From 70a351548fc2dd5d38822b0fcc83740bc72acfe5 Mon Sep 17 00:00:00 2001 From: Matthias Prost Date: Fri, 22 Nov 2024 12:06:45 +0100 Subject: [PATCH] refactor(EstimateCost): improve re-render performances (#4489) --- .changeset/spicy-months-sniff.md | 5 + .../Components/CustomUnitInput.tsx | 90 +-- .../EstimateCost/Components/Item.tsx | 549 +++++++++--------- .../EstimateCost/Components/Region.tsx | 80 +-- .../EstimateCost/Components/Regular.tsx | 38 +- .../EstimateCost/Components/Strong.tsx | 20 +- .../EstimateCost/Components/Zone.tsx | 75 +-- .../EstimateCost/EstimateCostContent.tsx | 55 +- .../EstimateCost/__stories__/Unit.stories.tsx | 3 + .../__snapshots__/Item.test.tsx.snap | 28 +- .../__snapshots__/Regular.test.tsx.snap | 44 +- .../__snapshots__/Stepper.test.tsx.snap | 18 +- .../__snapshots__/Strong.test.tsx.snap | 8 +- .../__snapshots__/Unit.test.tsx.snap | 32 +- .../__snapshots__/Zone.test.tsx.snap | 4 +- .../__snapshots__/index.test.tsx.snap | 80 +-- 16 files changed, 580 insertions(+), 549 deletions(-) create mode 100644 .changeset/spicy-months-sniff.md diff --git a/.changeset/spicy-months-sniff.md b/.changeset/spicy-months-sniff.md new file mode 100644 index 0000000000..faaf2938ea --- /dev/null +++ b/.changeset/spicy-months-sniff.md @@ -0,0 +1,5 @@ +--- +"@ultraviolet/plus": patch +--- + +Improve render performances on `` diff --git a/packages/plus/src/components/EstimateCost/Components/CustomUnitInput.tsx b/packages/plus/src/components/EstimateCost/Components/CustomUnitInput.tsx index 77562400f6..5a3e539807 100644 --- a/packages/plus/src/components/EstimateCost/Components/CustomUnitInput.tsx +++ b/packages/plus/src/components/EstimateCost/Components/CustomUnitInput.tsx @@ -1,4 +1,4 @@ -import { useMemo } from 'react' +import { memo, useMemo } from 'react' import { useEstimateCost } from '../EstimateCostProvider' import type { Iteration, Units } from '../types' import { UnitInput } from './UnitInput' @@ -10,49 +10,51 @@ type CustomUnitInputProps = { timeUnits: Units[] } -export const CustomUnitInput = ({ - defaultTimeUnit = 'hours', - setIteration, - iteration, - timeUnits, -}: CustomUnitInputProps) => { - const { locales } = useEstimateCost() +export const CustomUnitInput = memo( + ({ + defaultTimeUnit = 'hours', + setIteration, + iteration, + timeUnits, + }: CustomUnitInputProps) => { + const { locales } = useEstimateCost() - const options = useMemo( - () => - timeUnits.map(unit => ({ - value: unit, - label: locales[`estimate.cost.units.${unit}.label`], - })), - [timeUnits, locales], - ) + const options = useMemo( + () => + timeUnits.map(unit => ({ + value: unit, + label: locales[`estimate.cost.units.${unit}.label`], + })), + [timeUnits, locales], + ) - const defaultOption = useMemo( - () => options.find(({ value }) => value === defaultTimeUnit), - [defaultTimeUnit, options], - ) + const defaultOption = useMemo( + () => options.find(({ value }) => value === defaultTimeUnit), + [defaultTimeUnit, options], + ) - return ( - - setIteration({ - unit: iteration.unit, - value: inputValue, - }) - } - onChangeUnitValue={unitValue => { - setIteration({ - unit: unitValue as Units, - value: iteration.value, - }) - }} - placeholder="0" - value={iteration.value} - unitValue={iteration.unit || defaultOption?.value} - minValue={1} - size="medium" - options={options} - /> - ) -} + return ( + + setIteration({ + unit: iteration.unit, + value: inputValue, + }) + } + onChangeUnitValue={unitValue => { + setIteration({ + unit: unitValue as Units, + value: iteration.value, + }) + }} + placeholder="0" + value={iteration.value} + unitValue={iteration.unit || defaultOption?.value} + minValue={1} + size="medium" + options={options} + /> + ) + }, +) diff --git a/packages/plus/src/components/EstimateCost/Components/Item.tsx b/packages/plus/src/components/EstimateCost/Components/Item.tsx index fff565d33e..4751302548 100644 --- a/packages/plus/src/components/EstimateCost/Components/Item.tsx +++ b/packages/plus/src/components/EstimateCost/Components/Item.tsx @@ -6,6 +6,7 @@ import { Children, cloneElement, isValidElement, + memo, useCallback, useEffect, useId, @@ -224,301 +225,303 @@ const StyleNoPriceItem = styled(Text)` text-align: right; ` -export const Item = ({ - discount = 0, - priceText, - discountText, - label, - tooltipInfo, // Shows an icon with tooltip that contains this text - subLabel = '', // Usually used for showing amount that is free - price: basePrice = 0, // Hourly price for one unit - monthlyPrice = 0, // Price per month - unit: baseUnit, // Can be GB, MB, Node, Queries, etc. - amount: currentAmount = 1, // Current number of items - onAmountChange, - amountFree = 0, // Amount that is free - offered by company - maxAmount = 0, // Max amount - used for kubernetes for example - longFractionDigits = false, // In case price is really long 0.0000076 - up 7 fraction digits - noIteration = false, // if item is not based on time (ex: download, upload, transfer) - noIterationText, - noBorder, // remove the border bottom of the item - noPrice, // remove the price on right side of the table - isDefined = true, - children = null, - isFirstElement = false, - isLastElement = false, - isPrimaryBackground = false, - productsCallback, - iteration: receivedIteration, // Object from parent that contains time period (hours, days, months) - shouldBeHidden = false, // Hide element from overlay if screen width is small - hideFromOverlay = false, // Hide element from overlay in any case - textNotDefined, // Text to display in case of not defined value - animated = false, // if true, zoomIn animation is triggered - tabulation, // Increase left padding of the item - labelTextVariant, // To change left cell typography variant - labelTextProminence, // To change left cell typography prominence - notice, // To display a gray text below the label -}: ItemProps) => { - const { locales, formatNumber } = useEstimateCost() +export const Item = memo( + ({ + discount = 0, + priceText, + discountText, + label, + tooltipInfo, // Shows an icon with tooltip that contains this text + subLabel = '', // Usually used for showing amount that is free + price: basePrice = 0, // Hourly price for one unit + monthlyPrice = 0, // Price per month + unit: baseUnit, // Can be GB, MB, Node, Queries, etc. + amount: currentAmount = 1, // Current number of items + onAmountChange, + amountFree = 0, // Amount that is free - offered by company + maxAmount = 0, // Max amount - used for kubernetes for example + longFractionDigits = false, // In case price is really long 0.0000076 - up 7 fraction digits + noIteration = false, // if item is not based on time (ex: download, upload, transfer) + noIterationText, + noBorder, // remove the border bottom of the item + noPrice, // remove the price on right side of the table + isDefined = true, + children = null, + isFirstElement = false, + isLastElement = false, + isPrimaryBackground = false, + productsCallback, + iteration: receivedIteration, // Object from parent that contains time period (hours, days, months) + shouldBeHidden = false, // Hide element from overlay if screen width is small + hideFromOverlay = false, // Hide element from overlay in any case + textNotDefined, // Text to display in case of not defined value + animated = false, // if true, zoomIn animation is triggered + tabulation, // Increase left padding of the item + labelTextVariant, // To change left cell typography variant + labelTextProminence, // To change left cell typography prominence + notice, // To display a gray text below the label + }: ItemProps) => { + const { locales, formatNumber } = useEstimateCost() - let iteration: Iteration | undefined + let iteration: Iteration | undefined - if (noIteration) { - iteration = { - ...(receivedIteration ?? { value: 0 }), - unit: 'hours', + if (noIteration) { + iteration = { + ...(receivedIteration ?? { value: 0 }), + unit: 'hours', + } + } else { + iteration = receivedIteration } - } else { - iteration = receivedIteration - } - const price = useMemo(() => { - if (monthlyPrice && basePrice === 0) { - return monthlyPrice / multiplier.months - } + const price = useMemo(() => { + if (monthlyPrice && basePrice === 0) { + return monthlyPrice / multiplier.months + } - return basePrice - }, [basePrice, monthlyPrice]) + return basePrice + }, [basePrice, monthlyPrice]) - const unit = useMemo(() => { - if (!baseUnit) { - return locales['estimate.cost.units.gb.label'] - } + const unit = useMemo(() => { + if (!baseUnit) { + return locales['estimate.cost.units.gb.label'] + } - return baseUnit - }, [baseUnit, locales]) + return baseUnit + }, [baseUnit, locales]) - const { isOverlay } = useOverlay() - const Row = isOverlay ? OverlayRow : StyledTr - const Cell = isOverlay ? StyledCell.withComponent('div') : StyledCell - const LeftSide = isOverlay ? 'div' : StyledLeftSide + const { isOverlay } = useOverlay() + const Row = isOverlay ? OverlayRow : StyledTr + const Cell = isOverlay ? StyledCell.withComponent('div') : StyledCell + const LeftSide = isOverlay ? 'div' : StyledLeftSide - const [amount, setAmount] = useState(currentAmount) - const [isVariant, setIsVariant] = useState(false) + const [amount, setAmount] = useState(currentAmount) + const [isVariant, setIsVariant] = useState(false) - useEffect(() => setAmount(currentAmount), [setAmount, currentAmount]) - useEffect(() => onAmountChange?.(amount), [onAmountChange, amount]) + useEffect(() => setAmount(currentAmount), [setAmount, currentAmount]) + useEffect(() => onAmountChange?.(amount), [onAmountChange, amount]) - const itemCallback = useCallback( - (localAmount: number, localIsVariant: boolean) => { - setAmount(localAmount) - setIsVariant(localIsVariant) - }, - [setAmount, setIsVariant], - ) + const itemCallback = useCallback( + (localAmount: number, localIsVariant: boolean) => { + setAmount(localAmount) + setIsVariant(localIsVariant) + }, + [setAmount, setIsVariant], + ) - const id = useId() + const id = useId() - // We remove Item from object list when Iem component unmount to avoid duplicates - useEffect( - () => () => productsCallback?.remove({ id }), - [id, productsCallback], - ) + // We remove Item from object list when Iem component unmount to avoid duplicates + useEffect( + () => () => productsCallback?.remove({ id }), + [id, productsCallback], + ) - useEffect(() => { - if (!isOverlay) { - productsCallback?.add({ - id, - amount, - price, - amountFree, - isVariant, - maxAmount, - noIteration, - longFractionDigits, - discount, - }) - } - }, [ - price, - discount, - amount, - id, - productsCallback, - maxAmount, - noIteration, - isVariant, - amountFree, - isOverlay, - longFractionDigits, - ]) + useEffect(() => { + if (!isOverlay) { + productsCallback?.add({ + id, + amount, + price, + amountFree, + isVariant, + maxAmount, + noIteration, + longFractionDigits, + discount, + }) + } + }, [ + price, + discount, + amount, + id, + productsCallback, + maxAmount, + noIteration, + isVariant, + amountFree, + isOverlay, + longFractionDigits, + ]) - const computedItemPrice = useMemo( - () => - calculatePrice({ - price, - amount, - amountFree, - timeUnit: noIteration ? 'hours' : (iteration?.unit ?? 'hours'), - timeAmount: noIteration ? 1 : (iteration?.value ?? 1), - discount, - }), - [price, amount, amountFree, iteration, noIteration, discount], - ) + const computedItemPrice = useMemo( + () => + calculatePrice({ + price, + amount, + amountFree, + timeUnit: noIteration ? 'hours' : (iteration?.unit ?? 'hours'), + timeAmount: noIteration ? 1 : (iteration?.value ?? 1), + discount, + }), + [price, amount, amountFree, iteration, noIteration, discount], + ) - const computedMaxItemPrice = useMemo( - () => - calculatePrice({ - price, - amount: maxAmount, - amountFree, - timeUnit: noIteration ? 'hours' : (iteration?.unit ?? 'hours'), - timeAmount: noIteration ? 1 : (iteration?.value ?? 1), - discount, - }), - [price, maxAmount, amountFree, iteration, noIteration, discount], - ) + const computedMaxItemPrice = useMemo( + () => + calculatePrice({ + price, + amount: maxAmount, + amountFree, + timeUnit: noIteration ? 'hours' : (iteration?.unit ?? 'hours'), + timeAmount: noIteration ? 1 : (iteration?.value ?? 1), + discount, + }), + [price, maxAmount, amountFree, iteration, noIteration, discount], + ) - const formatMaximumFractionDigits = useMemo(() => { - if (!iteration?.unit) { - return undefined - } + const formatMaximumFractionDigits = useMemo(() => { + if (!iteration?.unit) { + return undefined + } - return longFractionDigits - ? maximumFractionDigitsLong[iteration?.unit] - : maximumFractionDigits[iteration?.unit] - }, [iteration?.unit, longFractionDigits]) + return longFractionDigits + ? maximumFractionDigitsLong[iteration?.unit] + : maximumFractionDigits[iteration?.unit] + }, [iteration?.unit, longFractionDigits]) - return ( - - - - - - - {label} - - {tooltipInfo ? ( - - - - - - ) : null} - {subLabel && !isOverlay ? ( - - {subLabel} - - ) : null} - {discount > 0 && discountText ? ( - + + + + - {discountText} - + {label} + + {tooltipInfo ? ( + + + + + + ) : null} + {subLabel && !isOverlay ? ( + + {subLabel} + + ) : null} + {discount > 0 && discountText ? ( + + {discountText} + + ) : null} + + {notice ? ( + + {notice} + ) : null} - {notice ? ( - - {notice} - - ) : null} - - - {isDefined - ? Children.map(children, child => - isValidElement(child) - ? cloneElement(child, { - itemCallback, - amount, - maxAmount, - unit, + + {isDefined + ? Children.map(children, child => + isValidElement(child) + ? cloneElement(child, { + itemCallback, + amount, + maxAmount, + unit, + }) + : null, + ) + : textNotDefined || locales['estimate.cost.notDefined']} + + + + {!isOverlay ? ( + + {!noPrice ? ( + <> + + {priceText} + {!priceText + ? formatNumber(computedItemPrice, { + maximumFractionDigits: formatMaximumFractionDigits, }) - : null, - ) - : textNotDefined || locales['estimate.cost.notDefined']} - - - - {!isOverlay ? ( - - {!noPrice ? ( - <> - - {priceText} - {!priceText - ? formatNumber(computedItemPrice, { - maximumFractionDigits: formatMaximumFractionDigits, - }) - : null} - {noIterationText ? ( - - /{noIterationText} - - ) : null} - {!priceText && computedMaxItemPrice > 0 - ? ` - ${formatNumber(computedMaxItemPrice, { - maximumFractionDigits: formatMaximumFractionDigits, - })}` - : null} - - {(amount - amountFree !== 1 && computedItemPrice > 0) || - (maxAmount > 0 && computedMaxItemPrice > 0) ? ( - - {formatNumber( - calculatePrice({ - price, - amount: 1, - timeUnit: 'hours', - timeAmount: 1, - discount, - }), - { - maximumFractionDigits: longFractionDigits - ? maximumFractionDigitsLong.hours - : maximumFractionDigits.hours, - }, - )} - {TIME_RELATED_UNIT.includes(unit as Units) - ? locales[ - `estimate.cost.units.${unit as Units}.label` - ].toLowerCase() - : `/${unit}`} - {!noIteration - ? `/${locales[ - 'estimate.cost.units.hours.label' - ].toLowerCase()}` : null} - - ) : null} - - ) : null} - - ) : null} - - ) -} + {noIterationText ? ( + + /{noIterationText} + + ) : null} + {!priceText && computedMaxItemPrice > 0 + ? ` - ${formatNumber(computedMaxItemPrice, { + maximumFractionDigits: formatMaximumFractionDigits, + })}` + : null} + + {(amount - amountFree !== 1 && computedItemPrice > 0) || + (maxAmount > 0 && computedMaxItemPrice > 0) ? ( + + {formatNumber( + calculatePrice({ + price, + amount: 1, + timeUnit: 'hours', + timeAmount: 1, + discount, + }), + { + maximumFractionDigits: longFractionDigits + ? maximumFractionDigitsLong.hours + : maximumFractionDigits.hours, + }, + )} + {TIME_RELATED_UNIT.includes(unit as Units) + ? locales[ + `estimate.cost.units.${unit as Units}.label` + ].toLowerCase() + : `/${unit}`} + {!noIteration + ? `/${locales[ + 'estimate.cost.units.hours.label' + ].toLowerCase()}` + : null} + + ) : null} + + ) : null} + + ) : null} + + ) + }, +) diff --git a/packages/plus/src/components/EstimateCost/Components/Region.tsx b/packages/plus/src/components/EstimateCost/Components/Region.tsx index d9683b4cd3..9fb5a0f118 100644 --- a/packages/plus/src/components/EstimateCost/Components/Region.tsx +++ b/packages/plus/src/components/EstimateCost/Components/Region.tsx @@ -1,5 +1,5 @@ import styled from '@emotion/styled' -import type { ComponentProps, ReactNode } from 'react' +import { type ComponentProps, type ReactNode, memo } from 'react' import { useEstimateCost } from '../EstimateCostProvider' import type { BareEstimateProduct, EstimateProduct, Iteration } from '../types' import { Item } from './Item' @@ -28,42 +28,44 @@ type RegionProps = { noPrice?: boolean } & Pick, 'hideFromOverlay'> -export const Region = ({ - label, - image, - shouldBeHidden = false, - priceText, - animated = false, - isFirstElement, - isLastElement, - productsCallback, - iteration, - discount, - noBorder, - noPrice, - hideFromOverlay, -}: RegionProps) => { - const { locales } = useEstimateCost() +export const Region = memo( + ({ + label, + image, + shouldBeHidden = false, + priceText, + animated = false, + isFirstElement, + isLastElement, + productsCallback, + iteration, + discount, + noBorder, + noPrice, + hideFromOverlay, + }: RegionProps) => { + const { locales } = useEstimateCost() - return ( - - - - {label} - - - ) -} + return ( + + + + {label} + + + ) + }, +) diff --git a/packages/plus/src/components/EstimateCost/Components/Regular.tsx b/packages/plus/src/components/EstimateCost/Components/Regular.tsx index ec9b13da37..6ee0bb16d2 100644 --- a/packages/plus/src/components/EstimateCost/Components/Regular.tsx +++ b/packages/plus/src/components/EstimateCost/Components/Regular.tsx @@ -1,6 +1,6 @@ import { css } from '@emotion/react' import styled from '@emotion/styled' -import type { ReactNode } from 'react' +import { type ReactNode, memo } from 'react' import { useOverlay } from '../OverlayContext' type RegularProps = { @@ -33,21 +33,23 @@ const StyledRegular = styled('div', { `}; ` -export const Regular = ({ - variant = 'normal', - isDisabledOnOverlay = false, - children = null, - className, -}: RegularProps) => { - const { isOverlay } = useOverlay() +export const Regular = memo( + ({ + variant = 'normal', + isDisabledOnOverlay = false, + children = null, + className, + }: RegularProps) => { + const { isOverlay } = useOverlay() - return !isDisabledOnOverlay || !isOverlay ? ( - - {children} - - ) : null -} + return !isDisabledOnOverlay || !isOverlay ? ( + + {children} + + ) : null + }, +) diff --git a/packages/plus/src/components/EstimateCost/Components/Strong.tsx b/packages/plus/src/components/EstimateCost/Components/Strong.tsx index 79f8339740..a10d2fb3ad 100644 --- a/packages/plus/src/components/EstimateCost/Components/Strong.tsx +++ b/packages/plus/src/components/EstimateCost/Components/Strong.tsx @@ -1,5 +1,5 @@ import styled from '@emotion/styled' -import type { ReactNode } from 'react' +import { type ReactNode, memo } from 'react' import { Regular } from './Regular' type StrongProps = { @@ -21,12 +21,14 @@ export const StyledStrong = styled(Regular, { margin-right: 4px; ` -export const Strong = ({ - variant = 'normal', - children = null, - isDisabledOnOverlay = false, -}: StrongProps) => ( - - {children} - +export const Strong = memo( + ({ + variant = 'normal', + children = null, + isDisabledOnOverlay = false, + }: StrongProps) => ( + + {children} + + ), ) diff --git a/packages/plus/src/components/EstimateCost/Components/Zone.tsx b/packages/plus/src/components/EstimateCost/Components/Zone.tsx index 794876a9f5..f7441c5227 100644 --- a/packages/plus/src/components/EstimateCost/Components/Zone.tsx +++ b/packages/plus/src/components/EstimateCost/Components/Zone.tsx @@ -1,4 +1,5 @@ import styled from '@emotion/styled' +import { memo } from 'react' import { useEstimateCost } from '../EstimateCostProvider' import type { BareEstimateProduct, EstimateProduct, Iteration } from '../types' import { Item } from './Item' @@ -27,40 +28,42 @@ type RegionProps = { noPrice?: boolean } -export const Zone = ({ - label, - image, - shouldBeHidden = false, - priceText, - animated = false, - isFirstElement, - isLastElement, - productsCallback, - iteration, - discount, - noBorder, - noPrice, -}: RegionProps) => { - const { locales } = useEstimateCost() +export const Zone = memo( + ({ + label, + image, + shouldBeHidden = false, + priceText, + animated = false, + isFirstElement, + isLastElement, + productsCallback, + iteration, + discount, + noBorder, + noPrice, + }: RegionProps) => { + const { locales } = useEstimateCost() - return ( - - - - {label} - - - ) -} + return ( + + + + {label} + + + ) + }, +) diff --git a/packages/plus/src/components/EstimateCost/EstimateCostContent.tsx b/packages/plus/src/components/EstimateCost/EstimateCostContent.tsx index e8b598882a..5033cf5f0c 100644 --- a/packages/plus/src/components/EstimateCost/EstimateCostContent.tsx +++ b/packages/plus/src/components/EstimateCost/EstimateCostContent.tsx @@ -1,10 +1,11 @@ import styled from '@emotion/styled' import { Alert, Icon, Stack, Text } from '@ultraviolet/ui' -import type { ReactNode } from 'react' +import type { ComponentProps, ReactNode } from 'react' import { Children, cloneElement, isValidElement, + memo, useEffect, useMemo, useState, @@ -77,20 +78,35 @@ type ExtraProps = { discount?: number } -const DescriptionComponent = ({ - description, - locales, -}: { - description: ReactNode - locales: Record -}) => - description === undefined || typeof description === 'string' ? ( - - {description || locales['estimate.cost.description']} - - ) : ( - description - ) +const DescriptionComponent = memo( + ({ + description, + locales, + }: { + description: ReactNode + locales: Record + }) => + description === undefined || typeof description === 'string' ? ( + + {description || locales['estimate.cost.description']} + + ) : ( + description + ), +) + +const TitleComponent = memo( + ({ + locales, + }: { + locales: Required['locales']> + }) => ( + + <StyledIcon name="calculator" color="primary" size={20} /> + {locales?.['estimate.cost.label']} + + ), +) export const EstimateCostContent = ({ description, @@ -328,14 +344,7 @@ export const EstimateCostContent = ({ - - <StyledIcon - name="calculator" - color="primary" - size={20} - /> - {locales['estimate.cost.label']} - + diff --git a/packages/plus/src/components/EstimateCost/__stories__/Unit.stories.tsx b/packages/plus/src/components/EstimateCost/__stories__/Unit.stories.tsx index f4bbbc46ee..44ca4fe702 100644 --- a/packages/plus/src/components/EstimateCost/__stories__/Unit.stories.tsx +++ b/packages/plus/src/components/EstimateCost/__stories__/Unit.stories.tsx @@ -18,6 +18,9 @@ Unit.args = { , + + Test + , ], } diff --git a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Item.test.tsx.snap b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Item.test.tsx.snap index 9a7d3945e1..4f368d25d4 100644 --- a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Item.test.tsx.snap +++ b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Item.test.tsx.snap @@ -1900,7 +1900,7 @@ exports[`EstimateCost - Item > render with labelTextVariant 1`] = ` aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":ro:" + for=":ri:" > Select... @@ -1922,7 +1922,7 @@ exports[`EstimateCost - Item > render with labelTextVariant 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":ro:" + id=":ri:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -5159,7 +5159,7 @@ exports[`EstimateCost - Item > render with notice 1`] = ` aria-live="assertive" as="label" class="emotion-72 emotion-73" - for=":r1v:" + for=":r1d:" > Select... @@ -5181,7 +5181,7 @@ exports[`EstimateCost - Item > render with notice 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r1v:" + id=":r1d:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -7218,7 +7218,7 @@ exports[`EstimateCost - Item > render with priceText 1`] = ` aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":r13:" + for=":rq:" > Select... @@ -7240,7 +7240,7 @@ exports[`EstimateCost - Item > render with priceText 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r13:" + id=":rq:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -9256,7 +9256,7 @@ exports[`EstimateCost - Item > render with tabulation 1`] = ` aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":rd:" + for=":ra:" > Select... @@ -9278,7 +9278,7 @@ exports[`EstimateCost - Item > render with tabulation 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":rd:" + id=":ra:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -11192,8 +11192,8 @@ exports[`EstimateCost - Item > render with tooltipInfo 1`] = ` class="emotion-16 emotion-17" >
@@ -11358,7 +11358,7 @@ exports[`EstimateCost - Item > render with tooltipInfo 1`] = ` aria-live="assertive" as="label" class="emotion-75 emotion-76" - for=":r1f:" + for=":r13:" > Select... @@ -11380,7 +11380,7 @@ exports[`EstimateCost - Item > render with tooltipInfo 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r1f:" + id=":r13:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -11463,8 +11463,8 @@ exports[`EstimateCost - Item > render with tooltipInfo 1`] = ` class="emotion-16 emotion-17" >
diff --git a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Regular.test.tsx.snap b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Regular.test.tsx.snap index 8d6b0ec769..02dcc8dfa2 100644 --- a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Regular.test.tsx.snap +++ b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Regular.test.tsx.snap @@ -2167,7 +2167,7 @@ exports[`EstimateCost - Regular Item > render basic props with is not defined 1` aria-live="assertive" as="label" class="emotion-66 emotion-67" - for=":r31:" + for=":r21:" > Select... @@ -2189,7 +2189,7 @@ exports[`EstimateCost - Regular Item > render basic props with is not defined 1` autocomplete="off" autocorrect="off" class="" - id=":r31:" + id=":r21:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -3346,7 +3346,7 @@ exports[`EstimateCost - Regular Item > render basic props with long fractions di aria-live="assertive" as="label" class="emotion-68 emotion-69" - for=":r1r:" + for=":r17:" > Select... @@ -3368,7 +3368,7 @@ exports[`EstimateCost - Regular Item > render basic props with long fractions di autocomplete="off" autocorrect="off" class="" - id=":r1r:" + id=":r17:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -4541,7 +4541,7 @@ exports[`EstimateCost - Regular Item > render basic props with maxPrice 1`] = ` aria-live="assertive" as="label" class="emotion-68 emotion-69" - for=":r2k:" + for=":r1o:" > Select... @@ -4563,7 +4563,7 @@ exports[`EstimateCost - Regular Item > render basic props with maxPrice 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r2k:" + id=":r1o:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -5741,7 +5741,7 @@ exports[`EstimateCost - Regular Item > render basic props with maxPrice and long aria-live="assertive" as="label" class="emotion-68 emotion-69" - for=":r27:" + for=":r1f:" > Select... @@ -5763,7 +5763,7 @@ exports[`EstimateCost - Regular Item > render basic props with maxPrice and long autocomplete="off" autocorrect="off" class="" - id=":r27:" + id=":r1f:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -7081,7 +7081,7 @@ exports[`EstimateCost - Regular Item > render basic props with overlay 1`] = ` aria-live="assertive" as="label" class="emotion-89 emotion-90" - for=":rh:" + for=":re:" > Select... @@ -7103,7 +7103,7 @@ exports[`EstimateCost - Regular Item > render basic props with overlay 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":rh:" + id=":re:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -8474,7 +8474,7 @@ exports[`EstimateCost - Regular Item > render basic props with overlay beta 1`] aria-live="assertive" as="label" class="emotion-79 emotion-80" - for=":r18:" + for=":rs:" > Select... @@ -8496,7 +8496,7 @@ exports[`EstimateCost - Regular Item > render basic props with overlay beta 1`] autocomplete="off" autocorrect="off" class="" - id=":r18:" + id=":rs:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -9695,7 +9695,7 @@ exports[`EstimateCost - Regular Item > render basic props with sublabel 1`] = ` aria-live="assertive" as="label" class="emotion-68 emotion-69" - for=":r3c:" + for=":r29:" > Select... @@ -9717,7 +9717,7 @@ exports[`EstimateCost - Regular Item > render basic props with sublabel 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r3c:" + id=":r29:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -10883,7 +10883,7 @@ exports[`EstimateCost - Regular Item > render basic props with textNotDefined 1` aria-live="assertive" as="label" class="emotion-68 emotion-69" - for=":r3o:" + for=":r2i:" > Select... @@ -10905,7 +10905,7 @@ exports[`EstimateCost - Regular Item > render basic props with textNotDefined 1` autocomplete="off" autocorrect="off" class="" - id=":r3o:" + id=":r2i:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -12102,7 +12102,7 @@ exports[`EstimateCost - Regular Item > render basic with ellipsis 1`] = ` aria-live="assertive" as="label" class="emotion-71 emotion-72" - for=":r44:" + for=":r2r:" > Select... @@ -12124,7 +12124,7 @@ exports[`EstimateCost - Regular Item > render basic with ellipsis 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r44:" + id=":r2r:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -13468,7 +13468,7 @@ exports[`EstimateCost - Regular Item > render with alert 1`] = ` aria-live="assertive" as="label" class="emotion-82 emotion-83" - for=":r50:" + for=":r3e:" > Select... @@ -13490,7 +13490,7 @@ exports[`EstimateCost - Regular Item > render with alert 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r50:" + id=":r3e:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -14630,7 +14630,7 @@ exports[`EstimateCost - Regular Item > render with isDisabledOnOverlay 1`] = ` aria-live="assertive" as="label" class="emotion-66 emotion-67" - for=":r4j:" + for=":r34:" > Select... @@ -14652,7 +14652,7 @@ exports[`EstimateCost - Regular Item > render with isDisabledOnOverlay 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r4j:" + id=":r34:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" diff --git a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Stepper.test.tsx.snap b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Stepper.test.tsx.snap index 8ff5f4a902..b50b457f3e 100644 --- a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Stepper.test.tsx.snap +++ b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Stepper.test.tsx.snap @@ -2848,7 +2848,7 @@ exports[`EstimateCost - NumberInput Item > render basic with overlay 1`] = ` aria-live="assertive" as="label" class="emotion-70 emotion-71" - for=":ri:" + for=":rf:" > Select... @@ -2870,7 +2870,7 @@ exports[`EstimateCost - NumberInput Item > render basic with overlay 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":ri:" + id=":rf:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -2995,7 +2995,7 @@ exports[`EstimateCost - NumberInput Item > render basic with overlay 1`] = ` data-controls="true" data-has-unit="false" data-size="small" - id=":rl:" + id=":ri:" max="100" min="0" placeholder="" @@ -4388,7 +4388,7 @@ exports[`EstimateCost - NumberInput Item > render with getAmountValue 1`] = ` aria-live="assertive" as="label" class="emotion-70 emotion-71" - for=":r1j:" + for=":r19:" > Select... @@ -4410,7 +4410,7 @@ exports[`EstimateCost - NumberInput Item > render with getAmountValue 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r1j:" + id=":r19:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -4535,7 +4535,7 @@ exports[`EstimateCost - NumberInput Item > render with getAmountValue 1`] = ` data-controls="true" data-has-unit="false" data-size="small" - id=":r1m:" + id=":r1c:" max="100" min="0" placeholder="" @@ -5954,7 +5954,7 @@ exports[`EstimateCost - NumberInput Item > render with values 1`] = ` aria-live="assertive" as="label" class="emotion-70 emotion-71" - for=":r11:" + for=":rr:" > Select... @@ -5976,7 +5976,7 @@ exports[`EstimateCost - NumberInput Item > render with values 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r11:" + id=":rr:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -6106,7 +6106,7 @@ exports[`EstimateCost - NumberInput Item > render with values 1`] = ` data-controls="true" data-has-unit="false" data-size="small" - id=":r15:" + id=":rv:" max="51" min="0" placeholder="" diff --git a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Strong.test.tsx.snap b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Strong.test.tsx.snap index 3151288b74..28359dc61c 100644 --- a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Strong.test.tsx.snap +++ b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Strong.test.tsx.snap @@ -2216,7 +2216,7 @@ exports[`EstimateCost - Strong Item > render with isDisabledOnOverlay 1`] = ` aria-live="assertive" as="label" class="emotion-66 emotion-67" - for=":rp:" + for=":rj:" > Select... @@ -2238,7 +2238,7 @@ exports[`EstimateCost - Strong Item > render with isDisabledOnOverlay 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":rp:" + id=":rj:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -3423,7 +3423,7 @@ exports[`EstimateCost - Strong Item > render with small variant 1`] = ` aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":re:" + for=":rb:" > Select... @@ -3445,7 +3445,7 @@ exports[`EstimateCost - Strong Item > render with small variant 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":re:" + id=":rb:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" diff --git a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Unit.test.tsx.snap b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Unit.test.tsx.snap index f20079a277..e174324c68 100644 --- a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Unit.test.tsx.snap +++ b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Unit.test.tsx.snap @@ -3520,7 +3520,7 @@ exports[`EstimateCost - Unit Item > render basic props with monthly price 1`] = aria-live="assertive" as="label" class="emotion-70 emotion-71" - for=":rg:" + for=":rd:" > Select... @@ -3542,7 +3542,7 @@ exports[`EstimateCost - Unit Item > render basic props with monthly price 1`] = autocomplete="off" autocorrect="off" class="" - id=":rg:" + id=":rd:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -5869,7 +5869,7 @@ exports[`EstimateCost - Unit Item > render basic props with overlay 1`] = ` aria-live="assertive" as="label" class="emotion-70 emotion-71" - for=":r2m:" + for=":r24:" > Select... @@ -5891,7 +5891,7 @@ exports[`EstimateCost - Unit Item > render basic props with overlay 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r2m:" + id=":r24:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -8244,7 +8244,7 @@ exports[`EstimateCost - Unit Item > render basic props with values 1`] = ` aria-live="assertive" as="label" class="emotion-70 emotion-71" - for=":rt:" + for=":rn:" > Select... @@ -8266,7 +8266,7 @@ exports[`EstimateCost - Unit Item > render basic props with values 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":rt:" + id=":rn:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -10629,7 +10629,7 @@ exports[`EstimateCost - Unit Item > render basic props with values and no iterat aria-live="assertive" as="label" class="emotion-70 emotion-71" - for=":r1c:" + for=":r13:" > Select... @@ -10651,7 +10651,7 @@ exports[`EstimateCost - Unit Item > render basic props with values and no iterat autocomplete="off" autocorrect="off" class="" - id=":r1c:" + id=":r13:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -13017,7 +13017,7 @@ exports[`EstimateCost - Unit Item > render test 1`] = ` aria-live="assertive" as="label" class="emotion-86 emotion-87" - for=":r1t:" + for=":r1h:" > Select... @@ -13039,7 +13039,7 @@ exports[`EstimateCost - Unit Item > render test 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r1t:" + id=":r1h:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -15482,7 +15482,7 @@ exports[`EstimateCost - Unit Item > render with 0 amount 1`] = ` aria-live="assertive" as="label" class="emotion-70 emotion-71" - for=":r33:" + for=":r2e:" > Select... @@ -15504,7 +15504,7 @@ exports[`EstimateCost - Unit Item > render with 0 amount 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r33:" + id=":r2e:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -17843,7 +17843,7 @@ exports[`EstimateCost - Unit Item > render with 10 amount 1`] = ` aria-live="assertive" as="label" class="emotion-70 emotion-71" - for=":r3g:" + for=":r2p:" > Select... @@ -17865,7 +17865,7 @@ exports[`EstimateCost - Unit Item > render with 10 amount 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r3g:" + id=":r2p:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -20197,7 +20197,7 @@ exports[`EstimateCost - Unit Item > render with getAmountValue 1`] = ` aria-live="assertive" as="label" class="emotion-70 emotion-71" - for=":r4s:" + for=":r3o:" > Select... @@ -20219,7 +20219,7 @@ exports[`EstimateCost - Unit Item > render with getAmountValue 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r4s:" + id=":r3o:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" diff --git a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Zone.test.tsx.snap b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Zone.test.tsx.snap index 4687655052..d783d3c149 100644 --- a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Zone.test.tsx.snap +++ b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/Zone.test.tsx.snap @@ -1070,7 +1070,7 @@ exports[`EstimateCost - Zone > render region component, with animation 1`] = ` aria-live="assertive" as="label" class="emotion-71 emotion-72" - for=":re:" + for=":rb:" > Select... @@ -1092,7 +1092,7 @@ exports[`EstimateCost - Zone > render region component, with animation 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":re:" + id=":rb:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" diff --git a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/index.test.tsx.snap b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/index.test.tsx.snap index 34e0e1ba9f..8d9a497b09 100644 --- a/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/index.test.tsx.snap +++ b/packages/plus/src/components/EstimateCost/__tests__/__snapshots__/index.test.tsx.snap @@ -1126,7 +1126,7 @@ exports[`EstimateCost - index > render isBeta with discount 1`] = ` aria-live="assertive" as="label" class="emotion-73 emotion-74" - for=":ri:" + for=":re:" > Select... @@ -1148,7 +1148,7 @@ exports[`EstimateCost - index > render isBeta with discount 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":ri:" + id=":re:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -2428,7 +2428,7 @@ exports[`EstimateCost - index > render isBeta with discount equal to 100% 1`] = aria-live="assertive" as="label" class="emotion-73 emotion-74" - for=":r1e:" + for=":r12:" > Select... @@ -2450,7 +2450,7 @@ exports[`EstimateCost - index > render isBeta with discount equal to 100% 1`] = autocomplete="off" autocorrect="off" class="" - id=":r1e:" + id=":r12:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -3730,7 +3730,7 @@ exports[`EstimateCost - index > render isBeta with discount more than 100% 1`] = aria-live="assertive" as="label" class="emotion-73 emotion-74" - for=":r10:" + for=":ro:" > Select... @@ -3752,7 +3752,7 @@ exports[`EstimateCost - index > render isBeta with discount more than 100% 1`] = autocomplete="off" autocorrect="off" class="" - id=":r10:" + id=":ro:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -6245,7 +6245,7 @@ exports[`EstimateCost - index > render with all timeUnits values 1`] = ` aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":r4b:" + for=":r31:" > Select... @@ -6267,7 +6267,7 @@ exports[`EstimateCost - index > render with all timeUnits values 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r4b:" + id=":r31:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -8243,7 +8243,7 @@ exports[`EstimateCost - index > render with commitmentFees 1`] = ` aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":r7n:" + for=":r5d:" > Select... @@ -8265,7 +8265,7 @@ exports[`EstimateCost - index > render with commitmentFees 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r7n:" + id=":r5d:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -10257,7 +10257,7 @@ exports[`EstimateCost - index > render with commitmentFees and iscommitmentFeesC aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":r85:" + for=":r5o:" > Select... @@ -10279,7 +10279,7 @@ exports[`EstimateCost - index > render with commitmentFees and iscommitmentFeesC autocomplete="off" autocorrect="off" class="" - id=":r85:" + id=":r5o:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -12338,7 +12338,7 @@ exports[`EstimateCost - index > render with description as node 1`] = ` aria-live="assertive" as="label" class="emotion-67 emotion-68" - for=":r8i:" + for=":r62:" > Select... @@ -12360,7 +12360,7 @@ exports[`EstimateCost - index > render with description as node 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r8i:" + id=":r62:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -13545,7 +13545,7 @@ exports[`EstimateCost - index > render with discount 0 and defaultTimeUnit month aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":r5e:" + for=":r3r:" > Select... @@ -13567,7 +13567,7 @@ exports[`EstimateCost - index > render with discount 0 and defaultTimeUnit month autocomplete="off" autocorrect="off" class="" - id=":r5e:" + id=":r3r:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -15612,7 +15612,7 @@ exports[`EstimateCost - index > render with discount 0.5 and defaultTimeUnit mon aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":r6m:" + for=":r4n:" > Select... @@ -15634,7 +15634,7 @@ exports[`EstimateCost - index > render with discount 0.5 and defaultTimeUnit mon autocomplete="off" autocorrect="off" class="" - id=":r6m:" + id=":r4n:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -16819,7 +16819,7 @@ exports[`EstimateCost - index > render with discount 1 and defaultTimeUnit month aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":r53:" + for=":r3j:" > Select... @@ -16841,7 +16841,7 @@ exports[`EstimateCost - index > render with discount 1 and defaultTimeUnit month autocomplete="off" autocorrect="off" class="" - id=":r53:" + id=":r3j:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -18115,7 +18115,7 @@ exports[`EstimateCost - index > render with discount 1, isBeta and defaultTimeUn aria-live="assertive" as="label" class="emotion-73 emotion-74" - for=":r4n:" + for=":r3a:" > Select... @@ -18137,7 +18137,7 @@ exports[`EstimateCost - index > render with discount 1, isBeta and defaultTimeUn autocomplete="off" autocorrect="off" class="" - id=":r4n:" + id=":r3a:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -19328,7 +19328,7 @@ exports[`EstimateCost - index > render with discount 100% but no isBeta 1`] = ` aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":r1q:" + for=":r1b:" > Select... @@ -19350,7 +19350,7 @@ exports[`EstimateCost - index > render with discount 100% but no isBeta 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r1q:" + id=":r1b:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -22320,7 +22320,7 @@ exports[`EstimateCost - index > render with hideTotal 1`] = ` aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":r7d:" + for=":r56:" > Select... @@ -22342,7 +22342,7 @@ exports[`EstimateCost - index > render with hideTotal 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r7d:" + id=":r56:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -23583,7 +23583,7 @@ exports[`EstimateCost - index > render with isBeta but undefined discount 1`] = aria-live="assertive" as="label" class="emotion-73 emotion-74" - for=":r26:" + for=":r1k:" > Select... @@ -23605,7 +23605,7 @@ exports[`EstimateCost - index > render with isBeta but undefined discount 1`] = autocomplete="off" autocorrect="off" class="" - id=":r26:" + id=":r1k:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -25829,7 +25829,7 @@ exports[`EstimateCost - index > render with isBeta, discount 0 and defaultTimeUn aria-live="assertive" as="label" class="emotion-73 emotion-74" - for=":r5r:" + for=":r44:" > Select... @@ -25851,7 +25851,7 @@ exports[`EstimateCost - index > render with isBeta, discount 0 and defaultTimeUn autocomplete="off" autocorrect="off" class="" - id=":r5r:" + id=":r44:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -28065,7 +28065,7 @@ exports[`EstimateCost - index > render with isBeta, discount 0.5 and defaultTime aria-live="assertive" as="label" class="emotion-73 emotion-74" - for=":r69:" + for=":r4e:" > Select... @@ -28087,7 +28087,7 @@ exports[`EstimateCost - index > render with isBeta, discount 0.5 and defaultTime autocomplete="off" autocorrect="off" class="" - id=":r69:" + id=":r4e:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -29362,7 +29362,7 @@ exports[`EstimateCost - index > render with isBeta, price, discount 50% 1`] = ` aria-live="assertive" as="label" class="emotion-73 emotion-74" - for=":r2k:" + for=":r1u:" > Select... @@ -29384,7 +29384,7 @@ exports[`EstimateCost - index > render with isBeta, price, discount 50% 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r2k:" + id=":r1u:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -30575,7 +30575,7 @@ exports[`EstimateCost - index > render with item discount 50% 1`] = ` aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":r31:" + for=":r27:" > Select... @@ -30597,7 +30597,7 @@ exports[`EstimateCost - index > render with item discount 50% 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r31:" + id=":r27:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -31782,7 +31782,7 @@ exports[`EstimateCost - index > render with item discount 50% and defaultTimeUni aria-live="assertive" as="label" class="emotion-69 emotion-70" - for=":r3v:" + for=":r2p:" > Select... @@ -31804,7 +31804,7 @@ exports[`EstimateCost - index > render with item discount 50% and defaultTimeUni autocomplete="off" autocorrect="off" class="" - id=":r3v:" + id=":r2p:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;" @@ -33033,7 +33033,7 @@ exports[`EstimateCost - index > render with item discount 50% and text 1`] = ` aria-live="assertive" as="label" class="emotion-73 emotion-74" - for=":r3e:" + for=":r2g:" > Select... @@ -33055,7 +33055,7 @@ exports[`EstimateCost - index > render with item discount 50% and text 1`] = ` autocomplete="off" autocorrect="off" class="" - id=":r3e:" + id=":r2g:" role="combobox" spellcheck="false" style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"