@pega/cosmos-react-core 8.20.0 → 8.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/DateTime/Input/DateInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateInput.js +1 -1
- package/lib/components/DateTime/Input/DateInput.js.map +1 -1
- package/lib/components/DateTime/Input/DateRangeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateRangeInput.js +1 -1
- package/lib/components/DateTime/Input/DateRangeInput.js.map +1 -1
- package/lib/components/DateTime/Input/DateTimeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateTimeInput.js +1 -1
- package/lib/components/DateTime/Input/DateTimeInput.js.map +1 -1
- package/lib/components/DateTime/Input/Duration/DurationInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/Duration/DurationInput.js +1 -1
- package/lib/components/DateTime/Input/Duration/DurationInput.js.map +1 -1
- package/lib/components/DateTime/Input/MonthInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/MonthInput.js +1 -1
- package/lib/components/DateTime/Input/MonthInput.js.map +1 -1
- package/lib/components/DateTime/Input/QuarterInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/QuarterInput.js +1 -1
- package/lib/components/DateTime/Input/QuarterInput.js.map +1 -1
- package/lib/components/DateTime/Input/TimeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/TimeInput.js +1 -1
- package/lib/components/DateTime/Input/TimeInput.js.map +1 -1
- package/lib/components/DateTime/Input/TimeRangeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/TimeRangeInput.js +1 -1
- package/lib/components/DateTime/Input/TimeRangeInput.js.map +1 -1
- package/lib/components/DateTime/Input/WeekInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/WeekInput.js +1 -1
- package/lib/components/DateTime/Input/WeekInput.js.map +1 -1
- package/lib/components/File/FileInput.d.ts.map +1 -1
- package/lib/components/File/FileInput.js +10 -19
- package/lib/components/File/FileInput.js.map +1 -1
- package/lib/components/File/FileInput.styles.d.ts +3 -1
- package/lib/components/File/FileInput.styles.d.ts.map +1 -1
- package/lib/components/File/FileInput.styles.js +16 -18
- package/lib/components/File/FileInput.styles.js.map +1 -1
- package/lib/components/FormField/FormField.d.ts +1 -1
- package/lib/components/FormField/FormField.d.ts.map +1 -1
- package/lib/components/FormField/FormField.js +34 -32
- package/lib/components/FormField/FormField.js.map +1 -1
- package/lib/components/Number/NumberRangeInput.d.ts.map +1 -1
- package/lib/components/Number/NumberRangeInput.js +1 -1
- package/lib/components/Number/NumberRangeInput.js.map +1 -1
- package/lib/components/Phone/PhoneInput.d.ts.map +1 -1
- package/lib/components/Phone/PhoneInput.js +1 -1
- package/lib/components/Phone/PhoneInput.js.map +1 -1
- package/lib/components/RadioCheckGroup/RadioCheckGroup.d.ts.map +1 -1
- package/lib/components/RadioCheckGroup/RadioCheckGroup.js +1 -1
- package/lib/components/RadioCheckGroup/RadioCheckGroup.js.map +1 -1
- package/lib/components/TextArea/TextArea.d.ts +3 -1
- package/lib/components/TextArea/TextArea.d.ts.map +1 -1
- package/lib/components/TextArea/TextArea.js +30 -15
- package/lib/components/TextArea/TextArea.js.map +1 -1
- package/lib/hooks/useI18n.d.ts +2 -0
- package/lib/hooks/useI18n.d.ts.map +1 -1
- package/lib/i18n/default.d.ts +2 -0
- package/lib/i18n/default.d.ts.map +1 -1
- package/lib/i18n/default.js +3 -0
- package/lib/i18n/default.js.map +1 -1
- package/lib/i18n/i18n.d.ts +2 -0
- package/lib/i18n/i18n.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/FormField/FormField.tsx"],"names":[],"mappings":"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","sourcesContent":["import { cloneElement, useEffect, forwardRef, useState, useRef, Children } from 'react';\nimport type { FC, ReactNode, ComponentType, ReactElement, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\nimport { rgba } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport type { Action, ExcludeStrict, ForwardProps, OmitStrict, TestIdProp } from '../../types';\nimport Flex from '../Flex';\nimport type { FlexProps } from '../Flex';\nimport Actions from '../Actions';\nimport type { FormControlProps } from '../FormControl';\nimport { useConsolidatedRef, useI18n, useLiveLog, useTestIds, useUID } from '../../hooks';\nimport Label, { StyledLabel } from '../Label';\nimport type { LabelProps } from '../Label';\nimport { calculateFontSize, getHoverColors, readableColor, readableHue } from '../../styles';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { getFocusables, tryCatch, withTestIds, createClassName } from '../../utils';\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport * as warnSolidIcon from '../Icon/icons/warn-solid.icon';\nimport * as diamondMinusIcon from '../Icon/icons/diamond-minus.icon';\nimport * as checkIcon from '../Icon/icons/check.icon';\nimport AdditionalInfo, { StyledAdditionalInfo } from '../AdditionalInfo';\nimport { StyledRadioCheckInput } from '../RadioCheck/RadioCheck';\n\nimport { getFormFieldTestIds } from './FormField.test-ids';\nimport type { elements } from './FormField.test-ids';\n\nregisterIcon(warnSolidIcon, diamondMinusIcon, checkIcon);\n\nexport interface FormFieldProps\n extends OmitStrict<FormControlProps, 'placeholder' | 'value' | 'defaultValue'>,\n TestIdProp<typeof elements> {\n /** Pass a single form control component i.e. Input | TextArea | Select | etc.. */\n children: ReactElement | ReactElement[];\n /**\n * An id is required to connect a FormField's wrapping element, control element and info(aria-describedby) live region.\n * A random id will be generated if none is provided.\n * Since MOST FormControls should possess an id(excl. i.e RadioCheckGroup and others) this can be used.\n * The id prop will be used to generate the following:\n * - FormControl <-> Label association via a Label's htmlFor prop.\n * - FormField's wrapping element id {id}-field.\n * - FormField info element id ${id}-info.\n */\n id?: string;\n /**\n * Determines how the wrapping label should be rendered.\n * @default 'label'\n */\n labelAs?: LabelProps['as'];\n /**\n * Overrides the for attribute on the label. If this is not set it will default to the forms id.\n * @default undefined\n */\n labelFor?: LabelProps['htmlFor'];\n /**\n * Sets the id of the label.\n * @default undefined\n */\n labelId?: LabelProps['id'];\n /**\n * Visually hides the label region.\n * @default false\n */\n labelHidden?: boolean;\n /**\n * Visually places the label after the input.\n * @default false\n */\n labelAfter?: boolean;\n /**\n * Property used to check whether input type is radio to handle styling for RadioCheck\n * @default false\n */\n isRadioCheck?: boolean;\n /**\n * Wrapping HTML element tag. Renders as a fieldset for grouped elements i.e. RadioButtons/CheckboxGroup\n * @default 'div'\n */\n as?: 'div' | 'fieldset' | ComponentType<any>;\n /**\n * Layout field elements inline in a row.\n * @default false\n */\n inline?: boolean;\n /** Optionally utilized by Input or Select. */\n actions?: Action[];\n /** Enables Flex container prop pass through. */\n container?: ExcludeStrict<FlexProps['container'], true>;\n /** Character remaining count. Typically used on Textareas only */\n charLimitDisplay?: ReactNode;\n /** Id of additional describing element. */\n 'aria-describedby'?: string;\n /** Callback invoked when the clear button is clicked. If provided will render the clear button. */\n onClear?: () => void;\n /** Suppresses announcements for status changes. */\n suppressAnnouncements?: boolean;\n}\n\nconst StyledStatusIcon = styled(Icon)<{ status: NonNullable<FormFieldProps['status']> }>(({\n theme,\n status\n}) => {\n return css`\n height: 1em;\n width: 1em;\n color: ${tryCatch(\n () =>\n readableHue(\n theme.components['form-field'][status]['status-color'],\n theme.base.palette['primary-background']\n ),\n () => theme.components['form-field'][status]['status-color']\n )};\n vertical-align: baseline;\n `;\n});\n\nStyledStatusIcon.defaultProps = defaultThemeProp;\n\nconst StyledClearButton = styled(Button)(({ theme }) => {\n return css`\n margin-block-start: calc(${theme.base.spacing} / 2);\n align-self: start;\n `;\n});\n\nStyledClearButton.defaultProps = defaultThemeProp;\n\nexport const StyledFormFieldInfo = styled.div<Pick<FormControlProps, 'status'>>(\n ({\n status,\n theme: {\n base: { 'font-size': fontSize, 'font-scale': fontScale, spacing, palette },\n components: { 'form-field': formField }\n }\n }) => {\n const { xxs: infoFontSize } = calculateFontSize(fontSize, fontScale);\n\n return css`\n max-width: max-content;\n font-size: ${infoFontSize};\n word-break: break-word;\n\n &:not(:empty) {\n margin-block-start: calc(0.25 * ${spacing});\n }\n\n ${status &&\n formField[status] &&\n css`\n color: ${tryCatch(\n () => readableHue(formField[status]['status-color'], palette['primary-background']),\n () => formField[status]['status-color']\n )};\n `}\n `;\n }\n);\n\nStyledFormFieldInfo.defaultProps = defaultThemeProp;\n\nexport const StyledLabelRow = styled.div``;\n\nexport const StyledFormField = styled.div<\n FormFieldProps & { labelAsLegend: boolean; showAdditionalInfo: boolean }\n>(props => {\n const {\n labelAsLegend,\n isRadioCheck,\n showAdditionalInfo,\n disabled,\n required,\n theme: {\n base: {\n palette: { urgent },\n 'disabled-opacity': disabledOpacity,\n spacing,\n 'hit-area': { 'compact-min': hitAreaCompact }\n }\n }\n } = props;\n\n return css`\n ${disabled &&\n css`\n opacity: ${disabledOpacity};\n -webkit-user-select: none;\n user-select: none;\n `}\n position: relative;\n border: 0;\n\n &:has(${StyledRadioCheckInput}:only-of-type) {\n ${StyledFormFieldInfo} {\n min-width: 100%;\n }\n }\n\n > ${StyledLabel}, > ${StyledLabelRow} {\n &:not(:empty) {\n margin-bottom: calc(0.25 * ${spacing});\n min-height: ${hitAreaCompact};\n }\n }\n\n > ${StyledLabel}, > ${StyledLabelRow} > ${StyledLabel} {\n ${required &&\n css`\n &::after {\n content: ${'\"\\\\00a0*\" / \"\"'};\n color: ${urgent};\n }\n `}\n\n ${disabled &&\n css`\n cursor: not-allowed;\n `}\n }\n\n ${labelAsLegend &&\n css`\n > legend {\n display: inline-flex;\n align-items: flex-end;\n }\n `}\n\n ${labelAsLegend &&\n showAdditionalInfo &&\n css`\n display: block;\n\n > legend {\n float: inline-start;\n }\n\n > ${StyledAdditionalInfo} {\n ${!isRadioCheck &&\n css`\n float: inline-end;\n `}\n + * {\n clear: both;\n }\n }\n `}\n `;\n});\n\nStyledFormField.defaultProps = defaultThemeProp;\n\nconst StyledSuggestionButton = styled(Button)(({\n theme: {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n 'border-radius': baseRadius,\n spacing,\n palette\n },\n components: {\n 'form-control': { 'border-radius': radius, 'border-width': borderWidth },\n 'form-field': formField\n }\n }\n}) => {\n const { xxs: buttonFontSize } = calculateFontSize(fontSize, fontScale);\n const backgroundColor = tryCatch(\n () => readableHue(formField.pending['status-color'], palette['primary-background']),\n () => formField.pending['status-color']\n );\n const hoverColors = getHoverColors(backgroundColor);\n const color = tryCatch(() => readableColor(backgroundColor));\n const borderColor = color ? rgba(color, 0.4) : color;\n\n return css`\n background-color: ${backgroundColor};\n color: ${color};\n font-size: ${buttonFontSize};\n min-width: calc(3 * ${spacing});\n min-height: calc(3 * ${spacing});\n padding: 0 ${spacing};\n border-radius: 0;\n border: none;\n\n &:first-child {\n border-inline-end: ${borderWidth} solid ${borderColor};\n border-end-start-radius: calc(${baseRadius} * ${radius});\n margin-inline-start: calc(2 * ${spacing});\n }\n\n &:last-child {\n border-end-end-radius: calc(${baseRadius} * ${radius});\n margin-inline-start: 0;\n }\n\n &:hover {\n color: ${hoverColors.foreground};\n background-color: ${hoverColors.background};\n }\n\n @media (pointer: coarse) {\n min-height: 2rem;\n }\n `;\n});\n\nStyledSuggestionButton.defaultProps = defaultThemeProp;\n\nconst statusIconMap = { error: 'warn-solid', warning: 'diamond-minus', success: 'check' };\n\nconst FormField: FC<FormFieldProps & ForwardProps> = forwardRef(function FormField(\n props: PropsWithoutRef<FormFieldProps>,\n ref: Ref<HTMLElement>\n) {\n const uid = useUID();\n const {\n testId,\n children: controlElement,\n id = uid,\n as = 'div',\n label,\n labelAs = 'label',\n labelFor = id,\n labelId,\n labelHidden = false,\n labelAfter = false,\n info,\n status,\n suppressAnnouncements,\n isRadioCheck,\n charLimitDisplay,\n required = false,\n disabled = false,\n readOnly = false,\n inline = false,\n onClear,\n actions,\n container,\n additionalInfo,\n onResolveSuggestion,\n 'aria-describedby': ariaDescribedBy,\n className,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getFormFieldTestIds);\n\n const t = useI18n();\n const { announceAssertive } = useLiveLog();\n const labelAsLegend: boolean = labelAs === 'legend';\n const hasSuggestion = status === 'pending' && !!onResolveSuggestion;\n const consolidatedRef = useConsolidatedRef(ref);\n const labelRef = useRef<HTMLLabelElement | HTMLLegendElement>(null);\n const [labelText, setLabelText] = useState<string | null>(null);\n\n const showAdditionalInfo = !!additionalInfo && !disabled && !labelHidden;\n\n const labelContent = (\n <>\n <Label\n data-testid={testIds.label}\n id={labelId}\n as={labelAs}\n htmlFor={labelAs === 'label' ? labelFor : undefined}\n labelHidden={labelHidden}\n onClick={(e: MouseEvent) => {\n if (readOnly) e.preventDefault();\n }}\n inline={inline}\n ref={labelRef}\n >\n {label}\n </Label>\n\n {showAdditionalInfo && labelText && (\n <AdditionalInfo\n data-testid={testIds.additionalInfo}\n heading={additionalInfo.heading}\n contextualLabel={labelText}\n >\n {additionalInfo.content}\n </AdditionalInfo>\n )}\n </>\n );\n\n const labelRow =\n !isRadioCheck && !labelAsLegend && !labelHidden ? (\n <Flex\n as={StyledLabelRow}\n container={{ justify: 'between', alignItems: 'end' }}\n item={{ alignSelf: 'stretch' }}\n >\n {labelContent}\n </Flex>\n ) : (\n labelContent\n );\n\n useEffect(() => {\n setLabelText(labelRef.current?.textContent ?? null);\n }, [label]);\n\n useEffect(() => {\n if (suppressAnnouncements || (status !== 'error' && status !== 'warning')) return;\n\n let message = t(status);\n\n if (typeof info === 'string') message = `${message} ${info}`;\n\n if (labelRef.current?.textContent) message = `${labelRef.current?.textContent} ${message}`;\n\n announceAssertive({ message, type: status });\n }, [status, info]);\n\n // fieldset or single form control element\n let content: FormFieldProps['children'];\n if (labelAsLegend || Children.count(controlElement) > 1) {\n content = controlElement;\n } else {\n const controlElementAriaDescribedBy = Children.only(controlElement).props[\n 'aria-describedby'\n ] as string | undefined;\n content = cloneElement(controlElement as ReactElement, {\n 'aria-describedby':\n [controlElementAriaDescribedBy, info && !readOnly ? `${id}-info` : undefined]\n .join(' ')\n .trim() || undefined\n });\n }\n\n if (actions) {\n content = (\n <Flex container={{ alignItems: 'center', gap: 0.5 }}>\n {content}\n <Actions items={actions} menuAt={3} />\n </Flex>\n );\n }\n\n let infoContent = (\n <Flex\n id={`${id}-info`}\n data-testid={testIds.info}\n status={status}\n as={StyledFormFieldInfo}\n container={{ alignItems: 'center', gap: 0.5 }}\n >\n {status && status !== 'pending' && (\n <>\n <Flex\n item={{ alignSelf: 'start' }}\n as={StyledStatusIcon}\n status={status}\n name={statusIconMap[status]}\n />\n <VisuallyHiddenText>{`${t(status)} `}</VisuallyHiddenText>\n </>\n )}\n {info}\n </Flex>\n );\n\n if (charLimitDisplay) {\n infoContent = (\n <Flex container={{ justify: infoContent ? 'between' : 'end', gap: 1 }}>\n {infoContent}\n <Flex item={{ shrink: 0 }}>{charLimitDisplay}</Flex>\n </Flex>\n );\n }\n\n if (hasSuggestion) {\n const focusables = getFocusables(consolidatedRef);\n infoContent = (\n <Flex container={{ alignItems: 'start', justify: 'between' }}>\n <StyledFormFieldInfo data-testid={testIds.info} status={status} id={`${id}-info`}>\n {t('suggestion_info')}\n <VisuallyHiddenText aria-live='polite'>{t('suggestion_assist')}</VisuallyHiddenText>\n </StyledFormFieldInfo>\n <Flex container={{ wrap: 'nowrap' }}>\n <StyledSuggestionButton\n data-testid={testIds.suggestionReject}\n onClick={() => {\n onResolveSuggestion(false);\n focusables[0]?.focus();\n }}\n aria-label={`${t('no')}, ${t('reject_suggestion_button_a11y')}${labelText ? ` - ${labelText}` : ''}`}\n >\n {t('no')}\n </StyledSuggestionButton>\n <StyledSuggestionButton\n data-testid={testIds.suggestionAccept}\n onClick={() => {\n onResolveSuggestion(true);\n focusables[0]?.focus();\n }}\n aria-label={`${t('yes')}, ${t('accept_suggestion_button_a11y')}${labelText ? ` - ${labelText}` : ''}`}\n >\n {t('yes')}\n </StyledSuggestionButton>\n </Flex>\n </Flex>\n );\n }\n\n const onKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n const target = e.target as HTMLElement;\n if (!target.closest('button')) {\n e.preventDefault();\n onResolveSuggestion?.(true);\n }\n }\n };\n\n const descriptionIds = [];\n if (ariaDescribedBy) descriptionIds.push(ariaDescribedBy);\n if (labelAsLegend && info) descriptionIds.push(`${id}-info`);\n\n return (\n <Flex\n data-testid={testIds.root}\n {...restProps}\n container={{\n direction: inline ? 'row' : 'column',\n alignItems: inline ? 'center' : undefined,\n wrap: isRadioCheck ? 'wrap' : undefined,\n ...container\n }}\n as={StyledFormField}\n labelAsLegend={labelAsLegend}\n isRadioCheck={isRadioCheck}\n showAdditionalInfo={showAdditionalInfo}\n id={`${id}-field`}\n forwardedAs={as}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n onKeyDown={hasSuggestion ? onKeyDown : undefined}\n aria-describedby={descriptionIds.length ? descriptionIds.join(' ') : undefined}\n ref={consolidatedRef}\n className={createClassName('form-field', className, { status })}\n >\n {(labelAsLegend || !labelAfter) && labelRow}\n {content}\n {!labelAsLegend && labelAfter && labelRow}\n {!readOnly && infoContent}\n {isRadioCheck && onClear && (\n <StyledClearButton\n variant='link'\n onClick={() => {\n onClear();\n }}\n >\n {t('clear_selection')}\n </StyledClearButton>\n )}\n </Flex>\n );\n});\n\nexport default withTestIds(FormField, getFormFieldTestIds);\n"]}
|
|
1
|
+
{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/FormField/FormField.tsx"],"names":[],"mappings":"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","sourcesContent":["import { cloneElement, useEffect, forwardRef, useState, useRef, Children } from 'react';\nimport type { FC, ReactNode, ComponentType, ReactElement, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\nimport { rgba } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport type { Action, ExcludeStrict, ForwardProps, OmitStrict, TestIdProp } from '../../types';\nimport Flex, { StyledFlex } from '../Flex';\nimport type { FlexProps } from '../Flex';\nimport Actions from '../Actions';\nimport type { FormControlProps } from '../FormControl';\nimport { useConsolidatedRef, useI18n, useLiveLog, useTestIds, useUID } from '../../hooks';\nimport Label, { StyledLabel } from '../Label';\nimport type { LabelProps } from '../Label';\nimport { calculateFontSize, getHoverColors, readableColor, readableHue } from '../../styles';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { getFocusables, tryCatch, withTestIds, createClassName } from '../../utils';\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport * as warnSolidIcon from '../Icon/icons/warn-solid.icon';\nimport * as diamondMinusIcon from '../Icon/icons/diamond-minus.icon';\nimport * as checkIcon from '../Icon/icons/check.icon';\nimport AdditionalInfo, { StyledAdditionalInfo } from '../AdditionalInfo';\nimport { StyledRadioCheck, StyledRadioCheckInput } from '../RadioCheck/RadioCheck';\n\nimport { getFormFieldTestIds } from './FormField.test-ids';\nimport type { elements } from './FormField.test-ids';\n\nregisterIcon(warnSolidIcon, diamondMinusIcon, checkIcon);\n\nexport interface FormFieldProps\n extends OmitStrict<FormControlProps, 'placeholder' | 'value' | 'defaultValue'>,\n TestIdProp<typeof elements> {\n /** Pass a single form control component i.e. Input | TextArea | Select | etc.. */\n children: ReactElement | ReactElement[];\n /**\n * An id is required to connect a FormField's wrapping element, control element and info(aria-describedby) live region.\n * A random id will be generated if none is provided.\n * Since MOST FormControls should possess an id(excl. i.e RadioCheckGroup and others) this can be used.\n * The id prop will be used to generate the following:\n * - FormControl <-> Label association via a Label's htmlFor prop.\n * - FormField's wrapping element id {id}-field.\n * - FormField info element id ${id}-info.\n */\n id?: string;\n /**\n * Determines how the wrapping label should be rendered.\n * @default 'label'\n */\n labelAs?: LabelProps['as'];\n /**\n * Overrides the for attribute on the label. If this is not set it will default to the forms id.\n * @default undefined\n */\n labelFor?: LabelProps['htmlFor'];\n /**\n * Sets the id of the label.\n * @default undefined\n */\n labelId?: LabelProps['id'];\n /**\n * Visually hides the label region.\n * @default false\n */\n labelHidden?: boolean;\n /**\n * Visually places the label after the input.\n * @default false\n */\n labelAfter?: boolean;\n /**\n * Property used to check whether input type is radio to handle styling for RadioCheck\n * @default false\n */\n isRadioCheck?: boolean;\n /**\n * Wrapping HTML element tag. Renders as a fieldset for grouped elements i.e. RadioButtons/CheckboxGroup\n * @default 'div'\n */\n as?: 'div' | 'fieldset' | ComponentType<any>;\n /**\n * Layout field elements inline in a row.\n * @default false\n */\n inline?: boolean;\n /** Optionally utilized by Input or Select. */\n actions?: Action[];\n /** Enables Flex container prop pass through. */\n container?: ExcludeStrict<FlexProps['container'], true>;\n /** Character remaining count. Typically used on Textareas only */\n charLimitDisplay?: ReactNode;\n /** Id of additional describing element. */\n 'aria-describedby'?: string;\n /** Callback invoked when the clear button is clicked. If provided will render the clear button. */\n onClear?: () => void;\n /** Suppresses announcements for status changes. */\n suppressAnnouncements?: boolean;\n}\n\nconst StyledStatusIcon = styled(Icon)<{ status: NonNullable<FormFieldProps['status']> }>(({\n theme,\n status\n}) => {\n return css`\n height: 1em;\n width: 1em;\n color: ${tryCatch(\n () =>\n readableHue(\n theme.components['form-field'][status]['status-color'],\n theme.base.palette['primary-background']\n ),\n () => theme.components['form-field'][status]['status-color']\n )};\n vertical-align: baseline;\n `;\n});\n\nStyledStatusIcon.defaultProps = defaultThemeProp;\n\nconst StyledClearButton = styled(Button)(({ theme }) => {\n return css`\n margin-block-start: calc(${theme.base.spacing} / 2);\n align-self: start;\n `;\n});\n\nStyledClearButton.defaultProps = defaultThemeProp;\n\nexport const StyledFormFieldInfo = styled.div<Pick<FormControlProps, 'status'>>(\n ({\n status,\n theme: {\n base: { 'font-size': fontSize, 'font-scale': fontScale, spacing, palette },\n components: { 'form-field': formField }\n }\n }) => {\n const { xxs: infoFontSize } = calculateFontSize(fontSize, fontScale);\n\n return css`\n max-width: max-content;\n font-size: ${infoFontSize};\n word-break: break-word;\n\n &:not(:empty) {\n margin-block-start: calc(0.25 * ${spacing});\n }\n\n ${status &&\n formField[status] &&\n css`\n color: ${tryCatch(\n () => readableHue(formField[status]['status-color'], palette['primary-background']),\n () => formField[status]['status-color']\n )};\n `}\n `;\n }\n);\n\nStyledFormFieldInfo.defaultProps = defaultThemeProp;\n\nexport const StyledLabelRow = styled.div``;\n\nexport const StyledFormField = styled.div<\n FormFieldProps & { asFieldset: boolean; showAdditionalInfo: boolean }\n>(props => {\n const {\n asFieldset,\n showAdditionalInfo,\n disabled,\n required,\n theme: {\n base: {\n palette: { urgent },\n 'disabled-opacity': disabledOpacity,\n spacing,\n 'hit-area': { 'compact-min': hitAreaCompact }\n }\n }\n } = props;\n\n return css`\n ${disabled &&\n css`\n opacity: ${disabledOpacity};\n -webkit-user-select: none;\n user-select: none;\n `}\n position: relative;\n border: 0;\n\n &:has(${StyledRadioCheckInput}:only-of-type) {\n ${StyledFormFieldInfo} {\n min-width: 100%;\n }\n }\n\n ${StyledFlex}:has(${StyledRadioCheck}) {\n flex-shrink: 0;\n }\n\n > ${StyledLabel}, > ${StyledLabelRow}, > ${StyledFlex}:has(> ${StyledLabel}) {\n &:not(:empty) {\n margin-bottom: calc(0.25 * ${spacing});\n min-height: ${hitAreaCompact};\n }\n }\n\n > ${StyledLabel}, > ${StyledLabelRow} > ${StyledLabel}, > ${StyledFlex} > ${StyledLabel} {\n ${required &&\n css`\n &::after {\n content: ${'\"\\\\00a0*\" / \"\"'};\n color: ${urgent};\n }\n `}\n\n ${disabled &&\n css`\n cursor: not-allowed;\n `}\n }\n\n ${asFieldset &&\n showAdditionalInfo &&\n css`\n > ${StyledFlex} > ${StyledLabel} {\n display: block;\n }\n\n > ${StyledFlex}:has(> ${StyledLabel}) > ${StyledAdditionalInfo} {\n align-self: flex-start;\n }\n `}\n `;\n});\n\nStyledFormField.defaultProps = defaultThemeProp;\n\nconst StyledSuggestionButton = styled(Button)(({\n theme: {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n 'border-radius': baseRadius,\n spacing,\n palette\n },\n components: {\n 'form-control': { 'border-radius': radius, 'border-width': borderWidth },\n 'form-field': formField\n }\n }\n}) => {\n const { xxs: buttonFontSize } = calculateFontSize(fontSize, fontScale);\n const backgroundColor = tryCatch(\n () => readableHue(formField.pending['status-color'], palette['primary-background']),\n () => formField.pending['status-color']\n );\n const hoverColors = getHoverColors(backgroundColor);\n const color = tryCatch(() => readableColor(backgroundColor));\n const borderColor = color ? rgba(color, 0.4) : color;\n\n return css`\n background-color: ${backgroundColor};\n color: ${color};\n font-size: ${buttonFontSize};\n min-width: calc(3 * ${spacing});\n min-height: calc(3 * ${spacing});\n padding: 0 ${spacing};\n border-radius: 0;\n border: none;\n\n &:first-child {\n border-inline-end: ${borderWidth} solid ${borderColor};\n border-end-start-radius: calc(${baseRadius} * ${radius});\n margin-inline-start: calc(2 * ${spacing});\n }\n\n &:last-child {\n border-end-end-radius: calc(${baseRadius} * ${radius});\n margin-inline-start: 0;\n }\n\n &:hover {\n color: ${hoverColors.foreground};\n background-color: ${hoverColors.background};\n }\n\n @media (pointer: coarse) {\n min-height: 2rem;\n }\n `;\n});\n\nStyledSuggestionButton.defaultProps = defaultThemeProp;\n\nconst statusIconMap = { error: 'warn-solid', warning: 'diamond-minus', success: 'check' };\n\nconst FormField: FC<FormFieldProps & ForwardProps> = forwardRef(function FormField(\n props: PropsWithoutRef<FormFieldProps>,\n ref: Ref<HTMLElement>\n) {\n const uid = useUID();\n const {\n testId,\n children: controlElement,\n id = uid,\n as = 'div',\n label,\n labelAs: labelAsProp = 'label',\n labelFor = id,\n labelId: labelIdProp,\n labelHidden = false,\n labelAfter = false,\n info,\n status,\n suppressAnnouncements,\n isRadioCheck,\n charLimitDisplay,\n required = false,\n disabled = false,\n readOnly = false,\n inline = false,\n onClear,\n actions,\n container,\n additionalInfo,\n onResolveSuggestion,\n 'aria-describedby': ariaDescribedBy,\n className,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getFormFieldTestIds);\n\n const asFieldset =\n as === 'fieldset' || (typeof as !== 'string' && 'target' in as && as.target === 'fieldset');\n const t = useI18n();\n const { announceAssertive } = useLiveLog();\n const labelAs = asFieldset || labelAsProp === 'legend' ? 'span' : labelAsProp;\n const hasSuggestion = status === 'pending' && !!onResolveSuggestion;\n const consolidatedRef = useConsolidatedRef(ref);\n const labelRef = useRef<HTMLLabelElement | HTMLLegendElement>(null);\n const [labelText, setLabelText] = useState<string | null>(null);\n\n const showAdditionalInfo = !!additionalInfo && !disabled && !labelHidden;\n const labelId = asFieldset && !labelIdProp ? `${id}-label` : labelIdProp;\n\n const labelContent = (\n <>\n <Label\n data-testid={testIds.label}\n id={labelId}\n as={labelAs}\n htmlFor={labelAs === 'label' ? labelFor : undefined}\n labelHidden={labelHidden}\n onClick={(e: MouseEvent) => {\n if (readOnly) e.preventDefault();\n }}\n inline={inline}\n ref={labelRef}\n >\n {label}\n </Label>\n\n {showAdditionalInfo && labelText && (\n <AdditionalInfo\n data-testid={testIds.additionalInfo}\n heading={additionalInfo.heading}\n contextualLabel={labelText}\n >\n {additionalInfo.content}\n </AdditionalInfo>\n )}\n </>\n );\n\n let labelRow: ReactNode;\n if (!isRadioCheck && !asFieldset && !labelHidden) {\n labelRow = (\n <Flex\n as={StyledLabelRow}\n container={{ justify: 'between', alignItems: 'end' }}\n item={{ alignSelf: 'stretch' }}\n >\n {labelContent}\n </Flex>\n );\n } else if (asFieldset && !labelHidden) {\n labelRow = (\n <Flex\n container={{\n alignItems: 'end',\n justify: showAdditionalInfo && !isRadioCheck ? 'between' : undefined\n }}\n >\n {labelContent}\n </Flex>\n );\n } else {\n labelRow = labelContent;\n }\n\n useEffect(() => {\n setLabelText(labelRef.current?.textContent ?? null);\n }, [label]);\n\n useEffect(() => {\n if (suppressAnnouncements || (status !== 'error' && status !== 'warning')) return;\n\n let message = t(status);\n\n if (typeof info === 'string') message = `${message} ${info}`;\n\n if (labelRef.current?.textContent) message = `${labelRef.current?.textContent} ${message}`;\n\n announceAssertive({ message, type: status });\n }, [status, info]);\n\n // fieldset or single form control element\n let content: FormFieldProps['children'];\n if (asFieldset || Children.count(controlElement) > 1) {\n content = controlElement;\n } else {\n const controlElementAriaDescribedBy = Children.only(controlElement).props[\n 'aria-describedby'\n ] as string | undefined;\n content = cloneElement(controlElement as ReactElement, {\n 'aria-describedby':\n [controlElementAriaDescribedBy, info && !readOnly ? `${id}-info` : undefined]\n .join(' ')\n .trim() || undefined\n });\n }\n\n if (actions) {\n content = (\n <Flex container={{ alignItems: 'center', gap: 0.5 }}>\n {content}\n <Actions items={actions} menuAt={3} />\n </Flex>\n );\n }\n\n let infoContent = (\n <Flex\n id={`${id}-info`}\n data-testid={testIds.info}\n status={status}\n as={StyledFormFieldInfo}\n container={{ alignItems: 'center', gap: 0.5 }}\n >\n {status && status !== 'pending' && (\n <>\n <Flex\n item={{ alignSelf: 'start' }}\n as={StyledStatusIcon}\n status={status}\n name={statusIconMap[status]}\n />\n <VisuallyHiddenText>{`${t(status)} `}</VisuallyHiddenText>\n </>\n )}\n {info}\n </Flex>\n );\n\n if (charLimitDisplay) {\n infoContent = (\n <Flex container={{ justify: infoContent ? 'between' : 'end', gap: 1 }}>\n {infoContent}\n <Flex item={{ shrink: 0 }}>{charLimitDisplay}</Flex>\n </Flex>\n );\n }\n\n if (hasSuggestion) {\n const focusables = getFocusables(consolidatedRef);\n infoContent = (\n <Flex container={{ alignItems: 'start', justify: 'between' }}>\n <StyledFormFieldInfo data-testid={testIds.info} status={status} id={`${id}-info`}>\n {t('suggestion_info')}\n <VisuallyHiddenText aria-live='polite'>{t('suggestion_assist')}</VisuallyHiddenText>\n </StyledFormFieldInfo>\n <Flex container={{ wrap: 'nowrap' }}>\n <StyledSuggestionButton\n data-testid={testIds.suggestionReject}\n onClick={() => {\n onResolveSuggestion(false);\n focusables[0]?.focus();\n }}\n aria-label={`${t('no')}, ${t('reject_suggestion_button_a11y')}${labelText ? ` - ${labelText}` : ''}`}\n >\n {t('no')}\n </StyledSuggestionButton>\n <StyledSuggestionButton\n data-testid={testIds.suggestionAccept}\n onClick={() => {\n onResolveSuggestion(true);\n focusables[0]?.focus();\n }}\n aria-label={`${t('yes')}, ${t('accept_suggestion_button_a11y')}${labelText ? ` - ${labelText}` : ''}`}\n >\n {t('yes')}\n </StyledSuggestionButton>\n </Flex>\n </Flex>\n );\n }\n\n const onKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n const target = e.target as HTMLElement;\n if (!target.closest('button')) {\n e.preventDefault();\n onResolveSuggestion?.(true);\n }\n }\n };\n\n const descriptionIds = [];\n if (ariaDescribedBy) descriptionIds.push(ariaDescribedBy);\n if (asFieldset && info) descriptionIds.push(`${id}-info`);\n\n return (\n <Flex\n data-testid={testIds.root}\n {...restProps}\n container={{\n direction: inline ? 'row' : 'column',\n alignItems: inline ? 'center' : undefined,\n wrap: isRadioCheck ? 'wrap' : undefined,\n ...container\n }}\n as={StyledFormField}\n asFieldset={asFieldset}\n isRadioCheck={isRadioCheck}\n showAdditionalInfo={showAdditionalInfo}\n id={`${id}-field`}\n forwardedAs={as}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n onKeyDown={hasSuggestion ? onKeyDown : undefined}\n aria-describedby={descriptionIds.length ? descriptionIds.join(' ') : undefined}\n aria-labelledby={asFieldset ? labelId : undefined}\n ref={consolidatedRef}\n className={createClassName('form-field', className, { status })}\n >\n {(asFieldset || !labelAfter) && labelRow}\n {content}\n {!asFieldset && labelAfter && labelRow}\n {!readOnly && infoContent}\n {isRadioCheck && onClear && (\n <StyledClearButton\n variant='link'\n onClick={() => {\n onClear();\n }}\n >\n {t('clear_selection')}\n </StyledClearButton>\n )}\n </Flex>\n );\n});\n\nexport default withTestIds(FormField, getFormFieldTestIds);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberRangeInput.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberRangeInput.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;;;;AAGjE,
|
|
1
|
+
{"version":3,"file":"NumberRangeInput.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberRangeInput.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;;;;AAGjE,wBAqHE"}
|
|
@@ -32,6 +32,6 @@ export default withTestIds(forwardRef(function NumberRangeInput({ name, testId,
|
|
|
32
32
|
variant
|
|
33
33
|
};
|
|
34
34
|
const descriptionId = useUID();
|
|
35
|
-
return (_jsxs(_Fragment, { children: [_jsx(FormField, { testId: testIds, as: 'fieldset', ...restProps, ref: containerRef, container: { wrap: 'nowrap' }, labelHidden: labelHidden,
|
|
35
|
+
return (_jsxs(_Fragment, { children: [_jsx(FormField, { testId: testIds, as: 'fieldset', ...restProps, ref: containerRef, container: { wrap: 'nowrap' }, labelHidden: labelHidden, label: label, disabled: disabled, required: required, readOnly: readOnly, status: status, "aria-describedby": descriptionId, children: _jsxs(Flex, { container: true, as: StyledRangeInputContainer, className: createClassName('number-range-input', className), children: [_jsx(NumberInput, { testId: testIds.min, ...commonProps, value: start, onChange: fromValue => onChange({ start: fromValue, end }), label: fromLabel, "aria-label": `${t('range_from_numeric') + (label ? ` - ${label}` : '')}`, additionalInfo: fromAdditionalInfo, autoFocus: autoFocus }), _jsx(NumberInput, { testId: testIds.max, ...commonProps, value: end, onChange: toValue => onChange({ start, end: toValue }), label: toLabel, "aria-label": `${t('range_to_numeric') + (label ? ` - ${label}` : '')}`, additionalInfo: toAdditionalInfo })] }) }), _jsx(HiddenText, { id: descriptionId, children: t('range_input') })] }));
|
|
36
36
|
}), getNumberRangeTestIds);
|
|
37
37
|
//# sourceMappingURL=NumberRangeInput.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberRangeInput.js","sourceRoot":"","sources":["../../../src/components/Number/NumberRangeInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAwB,WAAW,EAAE,MAAM,OAAO,CAAC;AAGtE,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAC9F,OAAO,EAAE,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,SAAS,MAAM,cAAc,CAAC;AACrC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,UAAU,MAAM,eAAe,CAAC;AAEvC,OAAO,WAAW,MAAM,eAAe,CAAC;AAExC,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAE1D,eAAe,WAAW,CACxB,UAAU,CACR,SAAS,gBAAgB,CACvB,EACE,IAAI,EACJ,MAAM,EACN,KAAK,GAAG,EAAE,EACV,QAAQ,EACR,MAAM,EACN,OAAO,EACP,KAAK,EACL,SAAS,EACT,OAAO,EACP,WAAW,EACX,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,IAAI,EACJ,WAAW,EACX,gBAAgB,EAChB,mBAAmB,EACnB,GAAG,EACH,GAAG,EACH,IAAI,EACJ,OAAO,EACP,kBAAkB,EAClB,gBAAgB,EAChB,SAAS,EACT,MAAM,EACN,SAAS,EACT,GAAG,SAAS,EACb,EACD,GAAG;IAEH,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,qBAAqB,CAAC,CAAC;IAE1D,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,IAAI,EAAE,CAAC;IAChC,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,IAAI,EAAE,CAAC;IAE5B,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,OAAgB,EAAE,EAAE;QACnB,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC;IACjD,CAAC,EACD,CAAC,MAAM,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CACjC,CAAC;IAEF,MAAM,YAAY,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAC7C,cAAc,CAAC,CAAC,YAAY,CAAC,EAAE,aAAa,CAAC,CAAC;IAE9C,MAAM,WAAW,GAAG;QAClB,MAAM;QACN,WAAW;QACX,QAAQ;QACR,QAAQ;QACR,IAAI;QACJ,WAAW;QACX,gBAAgB;QAChB,mBAAmB;QACnB,GAAG;QACH,GAAG;QACH,OAAO;KACR,CAAC;IAEF,MAAM,aAAa,GAAG,MAAM,EAAE,CAAC;IAE/B,OAAO,CACL,8BACE,KAAC,SAAS,IACR,MAAM,EAAE,OAAO,EACf,EAAE,EAAC,UAAU,KACT,SAAS,EACb,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAC7B,WAAW,EAAE,WAAW,EACxB,
|
|
1
|
+
{"version":3,"file":"NumberRangeInput.js","sourceRoot":"","sources":["../../../src/components/Number/NumberRangeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, type PropsWithoutRef, useCallback } from 'react';\n\nimport type { RefElement } from '../../types';\nimport { useConsolidatedRef, useI18n, useFocusWithin, useTestIds, useUID } from '../../hooks';\nimport { StyledRangeInputContainer } from '../Input/Input.styles';\nimport FormField from '../FormField';\nimport Flex from '../Flex';\nimport { withTestIds, createClassName } from '../../utils';\nimport HiddenText from '../HiddenText';\n\nimport NumberInput from './NumberInput';\nimport type { NumberRangeInputProps } from './NumberInput.types';\nimport { getNumberRangeTestIds } from './Number.test-ids';\n\nexport default withTestIds(\n forwardRef<RefElement<NumberRangeInputProps>, PropsWithoutRef<NumberRangeInputProps>>(\n function NumberRangeInput(\n {\n name,\n testId,\n value = {},\n onChange,\n onBlur,\n onFocus,\n label,\n fromLabel,\n toLabel,\n labelHidden,\n placeholder,\n disabled,\n readOnly,\n required,\n status,\n unit,\n showDecimal,\n numberOfDecimals,\n showGroupSeparators,\n min,\n max,\n step,\n variant,\n fromAdditionalInfo,\n toAdditionalInfo,\n autoFocus,\n handle,\n className,\n ...restProps\n },\n ref\n ) {\n const testIds = useTestIds(testId, getNumberRangeTestIds);\n\n const t = useI18n();\n\n const start = value.start ?? '';\n const end = value.end ?? '';\n\n const onFocusChange = useCallback(\n (focused: boolean) => {\n (focused ? onFocus : onBlur)?.({ start, end });\n },\n [onBlur, value.start, value.end]\n );\n\n const containerRef = useConsolidatedRef(ref);\n useFocusWithin([containerRef], onFocusChange);\n\n const commonProps = {\n status,\n placeholder,\n readOnly,\n required,\n unit,\n showDecimal,\n numberOfDecimals,\n showGroupSeparators,\n min,\n max,\n variant\n };\n\n const descriptionId = useUID();\n\n return (\n <>\n <FormField\n testId={testIds}\n as='fieldset'\n {...restProps}\n ref={containerRef}\n container={{ wrap: 'nowrap' }}\n labelHidden={labelHidden}\n label={label}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n status={status}\n aria-describedby={descriptionId}\n >\n <Flex\n container\n as={StyledRangeInputContainer}\n className={createClassName('number-range-input', className)}\n >\n <NumberInput\n testId={testIds.min}\n {...commonProps}\n value={start}\n onChange={fromValue => onChange({ start: fromValue, end })}\n label={fromLabel}\n aria-label={`${t('range_from_numeric') + (label ? ` - ${label}` : '')}`}\n additionalInfo={fromAdditionalInfo}\n autoFocus={autoFocus}\n />\n <NumberInput\n testId={testIds.max}\n {...commonProps}\n value={end}\n onChange={toValue => onChange({ start, end: toValue })}\n label={toLabel}\n aria-label={`${t('range_to_numeric') + (label ? ` - ${label}` : '')}`}\n additionalInfo={toAdditionalInfo}\n />\n </Flex>\n </FormField>\n <HiddenText id={descriptionId}>{t('range_input')}</HiddenText>\n </>\n );\n }\n ),\n getNumberRangeTestIds\n);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAgC,GAAG,EAAE,MAAM,OAAO,CAAC;AAY/D,OAAO,KAAK,EACV,SAAS,EACT,+BAA+B,EAC/B,cAAc,EAEd,UAAU,EACX,MAAM,aAAa,CAAC;AAGrB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAkBvD,MAAM,WAAW,eAAgB,SAAQ,gBAAgB,EAAE,SAAS,EAAE,cAAc,EAAE,UAAU;IAC9F;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,oDAAoD;IACpD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,oDAAoD;IACpD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;;;;
|
|
1
|
+
{"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAgC,GAAG,EAAE,MAAM,OAAO,CAAC;AAY/D,OAAO,KAAK,EACV,SAAS,EACT,+BAA+B,EAC/B,cAAc,EAEd,UAAU,EACX,MAAM,aAAa,CAAC;AAGrB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAkBvD,MAAM,WAAW,eAAgB,SAAQ,gBAAgB,EAAE,SAAS,EAAE,cAAc,EAAE,UAAU;IAC9F;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,oDAAoD;IACpD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,oDAAoD;IACpD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;;;;AA6LD,wBAA6D"}
|
|
@@ -76,7 +76,7 @@ const PhoneInput = forwardRef(function PhoneInput(props, ref) {
|
|
|
76
76
|
const formatted = useInputFormatter(inputRef, subscriberNumber, formatter);
|
|
77
77
|
const codesOptions = (_jsx(_Fragment, { children: callingCodesList.map(code => (_jsx(Option, { value: code, children: code }, code))) }));
|
|
78
78
|
const Comp = (_jsxs(StyledPhoneInput, { "data-testid": testIds.root, as: StyledFormControl, forwardedAs: Flex, container: { alignItems: 'center', wrap: 'nowrap' }, ref: containerRef, status: status, readOnly: readOnly, disabled: disabled, children: [showCountryCode && !readOnly && (_jsxs(_Fragment, { children: [_jsx(Select, { "data-testid": testIds.countryCode, value: countryCode, "aria-label": t('select_country_code'), onChange: onSelectChange, required: required, status: status, readOnly: readOnly, disabled: disabled, autoComplete: 'tel-country-code', ref: setSelectEl, hasSuggestion: status === 'pending' && !!onResolveSuggestion, children: codesOptions }), selectEl && (_jsx(Tooltip, { target: selectEl, describeTarget: false, showDelay: 'none', hideDelay: 'none', children: t('country_code') }))] })), _jsx(Input, { "data-testid": testIds.control, ...restProps, inputMode: 'tel', ref: inputRef, value: formatted, "aria-label": t('enter_a_number'), onChange: onInputChange, required: required, status: status, readOnly: readOnly, disabled: disabled, autoComplete: 'tel-national', onResolveSuggestion: onResolveSuggestion, className: createClassName('phone-input', className) }), showCountryCode && inputEl && (_jsx(Tooltip, { target: inputEl, describeTarget: false, showDelay: 'none', hideDelay: 'none', children: t('phone_number') }))] }));
|
|
79
|
-
return label ? (_jsx(FormField, { testId: testIds, as: 'fieldset',
|
|
79
|
+
return label ? (_jsx(FormField, { testId: testIds, as: 'fieldset', additionalInfo: additionalInfo, label: label, labelHidden: labelHidden, id: id, info: info, readOnly: readOnly, status: status, required: required, disabled: disabled, onResolveSuggestion: onResolveSuggestion, children: Comp })) : (Comp);
|
|
80
80
|
});
|
|
81
81
|
export default withTestIds(PhoneInput, getPhoneInputTestIds);
|
|
82
82
|
//# sourceMappingURL=PhoneInput.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PhoneInput.js","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useCallback, useRef } from 'react';\nimport type { ChangeEvent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n useConsolidatedRef,\n useElement,\n useFocusWithin,\n useI18n,\n useInputFormatter,\n useTestIds\n} from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport type {\n BaseProps,\n ForwardRefForwardPropsComponent,\n NoChildrenProp,\n PropsWithDefaults,\n TestIdProp\n} from '../../types';\nimport FormField from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport type { FormControlProps } from '../FormControl';\nimport StyledInput from '../Input/Input.styles';\nimport Select, { Option } from '../Select';\nimport Input from '../Input';\nimport { StyledSelect } from '../Select/Select';\nimport Flex from '../Flex';\nimport { withTestIds, createClassName } from '../../utils';\nimport Tooltip from '../Tooltip';\n\nimport callingCodes from './callingCodes';\nimport {\n convertToCallbackParameter,\n formatPhone,\n formatPhoneNumber,\n getPhoneNumberParts\n} from './utils';\nimport { getPhoneInputTestIds } from './Phone.test-ids';\n\nexport interface PhoneInputProps extends FormControlProps, BaseProps, NoChildrenProp, TestIdProp {\n /**\n * Display select with countries calling codes\n * @default false\n */\n showCountryCode?: boolean;\n /** Changes lists of countries calling codes */\n callingCodesList?: string[];\n /** Callback fired on input value change */\n onChange?: (value: string) => void;\n /** Callback fired when the component loses focus */\n onBlur?: (value: string) => void;\n /** CCallback fired when the component gets focus */\n onFocus?: (value: string) => void;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLInputElement>;\n}\n\ntype PhoneInputPropsWithDefaults = PropsWithDefaults<PhoneInputProps>;\n\nconst StyledPhoneInput = styled.div<PhoneInputPropsWithDefaults>(() => {\n return css`\n border: 0;\n\n > ${StyledSelect} {\n max-width: max-content;\n border-inline-end: none;\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n }\n\n > ${StyledSelect} + ${StyledInput} {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n\n ${StyledSelect},\n ${StyledInput} {\n &:focus {\n z-index: 1;\n }\n }\n `;\n});\n\nStyledPhoneInput.defaultProps = defaultThemeProp;\n\nconst PhoneInput: ForwardRefForwardPropsComponent<PhoneInputProps> = forwardRef(function PhoneInput(\n props: PropsWithoutRef<PhoneInputProps>,\n ref: PhoneInputProps['ref']\n) {\n const {\n testId,\n value,\n id,\n label,\n labelHidden,\n info,\n status,\n required,\n readOnly,\n disabled,\n showCountryCode = false,\n callingCodesList = callingCodes,\n onChange,\n onBlur,\n onFocus,\n onResolveSuggestion,\n additionalInfo,\n className,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getPhoneInputTestIds);\n const [selectEl, setSelectEl] = useElement<HTMLSelectElement>();\n const [inputEl, setInputEl] = useElement<HTMLInputElement>();\n\n const t = useI18n();\n\n const [countryCode = callingCodesList[0], subscriberNumber = ''] = value\n ? getPhoneNumberParts(value, callingCodesList)\n : [];\n\n const onFocusChange = (focused: boolean) => {\n const callbackParam = convertToCallbackParameter(countryCode, subscriberNumber);\n if (focused) onFocus?.(callbackParam);\n else onBlur?.(callbackParam);\n };\n\n const onInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n onChange?.(convertToCallbackParameter(countryCode, e.target.value));\n };\n\n const onSelectChange = (e: ChangeEvent<HTMLSelectElement>) => {\n onChange?.(convertToCallbackParameter(e.target.value, subscriberNumber));\n };\n\n const inputRef = useConsolidatedRef<HTMLInputElement>(ref, setInputEl);\n const containerRef = useRef<HTMLElement>(null);\n useFocusWithin([containerRef], onFocusChange);\n\n const formatter = useCallback(\n (number: string) => {\n if (value && readOnly && showCountryCode) {\n const temp = formatPhone(value, { nationalFormat: !readOnly });\n if (temp) return temp;\n }\n return formatPhoneNumber(number.replace(/\\D+/g, ''), countryCode);\n },\n [readOnly, countryCode, showCountryCode]\n );\n\n const formatted = useInputFormatter(inputRef, subscriberNumber, formatter);\n\n const codesOptions = (\n <>\n {callingCodesList.map(code => (\n <Option key={code} value={code}>\n {code}\n </Option>\n ))}\n </>\n );\n\n const Comp = (\n <StyledPhoneInput\n data-testid={testIds.root}\n as={StyledFormControl}\n forwardedAs={Flex as any}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n ref={containerRef}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n >\n {showCountryCode && !readOnly && (\n <>\n <Select\n data-testid={testIds.countryCode}\n value={countryCode}\n aria-label={t('select_country_code')}\n onChange={onSelectChange}\n required={required}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n autoComplete='tel-country-code'\n ref={setSelectEl}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n >\n {codesOptions}\n </Select>\n {selectEl && (\n <Tooltip target={selectEl} describeTarget={false} showDelay='none' hideDelay='none'>\n {t('country_code')}\n </Tooltip>\n )}\n </>\n )}\n <Input\n data-testid={testIds.control}\n {...restProps}\n inputMode='tel'\n ref={inputRef}\n value={formatted}\n aria-label={t('enter_a_number')}\n onChange={onInputChange}\n required={required}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n autoComplete='tel-national'\n onResolveSuggestion={onResolveSuggestion}\n className={createClassName('phone-input', className)}\n />\n {showCountryCode && inputEl && (\n <Tooltip target={inputEl} describeTarget={false} showDelay='none' hideDelay='none'>\n {t('phone_number')}\n </Tooltip>\n )}\n </StyledPhoneInput>\n );\n\n return label ? (\n <FormField\n testId={testIds}\n as='fieldset'\n labelAs='legend'\n additionalInfo={additionalInfo}\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n readOnly={readOnly}\n status={status}\n required={required}\n disabled={disabled}\n onResolveSuggestion={onResolveSuggestion}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n});\n\nexport default withTestIds(PhoneInput, getPhoneInputTestIds);\n"]}
|
|
1
|
+
{"version":3,"file":"PhoneInput.js","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useCallback, useRef } from 'react';\nimport type { ChangeEvent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n useConsolidatedRef,\n useElement,\n useFocusWithin,\n useI18n,\n useInputFormatter,\n useTestIds\n} from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport type {\n BaseProps,\n ForwardRefForwardPropsComponent,\n NoChildrenProp,\n PropsWithDefaults,\n TestIdProp\n} from '../../types';\nimport FormField from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport type { FormControlProps } from '../FormControl';\nimport StyledInput from '../Input/Input.styles';\nimport Select, { Option } from '../Select';\nimport Input from '../Input';\nimport { StyledSelect } from '../Select/Select';\nimport Flex from '../Flex';\nimport { withTestIds, createClassName } from '../../utils';\nimport Tooltip from '../Tooltip';\n\nimport callingCodes from './callingCodes';\nimport {\n convertToCallbackParameter,\n formatPhone,\n formatPhoneNumber,\n getPhoneNumberParts\n} from './utils';\nimport { getPhoneInputTestIds } from './Phone.test-ids';\n\nexport interface PhoneInputProps extends FormControlProps, BaseProps, NoChildrenProp, TestIdProp {\n /**\n * Display select with countries calling codes\n * @default false\n */\n showCountryCode?: boolean;\n /** Changes lists of countries calling codes */\n callingCodesList?: string[];\n /** Callback fired on input value change */\n onChange?: (value: string) => void;\n /** Callback fired when the component loses focus */\n onBlur?: (value: string) => void;\n /** CCallback fired when the component gets focus */\n onFocus?: (value: string) => void;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLInputElement>;\n}\n\ntype PhoneInputPropsWithDefaults = PropsWithDefaults<PhoneInputProps>;\n\nconst StyledPhoneInput = styled.div<PhoneInputPropsWithDefaults>(() => {\n return css`\n border: 0;\n\n > ${StyledSelect} {\n max-width: max-content;\n border-inline-end: none;\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n }\n\n > ${StyledSelect} + ${StyledInput} {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n\n ${StyledSelect},\n ${StyledInput} {\n &:focus {\n z-index: 1;\n }\n }\n `;\n});\n\nStyledPhoneInput.defaultProps = defaultThemeProp;\n\nconst PhoneInput: ForwardRefForwardPropsComponent<PhoneInputProps> = forwardRef(function PhoneInput(\n props: PropsWithoutRef<PhoneInputProps>,\n ref: PhoneInputProps['ref']\n) {\n const {\n testId,\n value,\n id,\n label,\n labelHidden,\n info,\n status,\n required,\n readOnly,\n disabled,\n showCountryCode = false,\n callingCodesList = callingCodes,\n onChange,\n onBlur,\n onFocus,\n onResolveSuggestion,\n additionalInfo,\n className,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getPhoneInputTestIds);\n const [selectEl, setSelectEl] = useElement<HTMLSelectElement>();\n const [inputEl, setInputEl] = useElement<HTMLInputElement>();\n\n const t = useI18n();\n\n const [countryCode = callingCodesList[0], subscriberNumber = ''] = value\n ? getPhoneNumberParts(value, callingCodesList)\n : [];\n\n const onFocusChange = (focused: boolean) => {\n const callbackParam = convertToCallbackParameter(countryCode, subscriberNumber);\n if (focused) onFocus?.(callbackParam);\n else onBlur?.(callbackParam);\n };\n\n const onInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n onChange?.(convertToCallbackParameter(countryCode, e.target.value));\n };\n\n const onSelectChange = (e: ChangeEvent<HTMLSelectElement>) => {\n onChange?.(convertToCallbackParameter(e.target.value, subscriberNumber));\n };\n\n const inputRef = useConsolidatedRef<HTMLInputElement>(ref, setInputEl);\n const containerRef = useRef<HTMLElement>(null);\n useFocusWithin([containerRef], onFocusChange);\n\n const formatter = useCallback(\n (number: string) => {\n if (value && readOnly && showCountryCode) {\n const temp = formatPhone(value, { nationalFormat: !readOnly });\n if (temp) return temp;\n }\n return formatPhoneNumber(number.replace(/\\D+/g, ''), countryCode);\n },\n [readOnly, countryCode, showCountryCode]\n );\n\n const formatted = useInputFormatter(inputRef, subscriberNumber, formatter);\n\n const codesOptions = (\n <>\n {callingCodesList.map(code => (\n <Option key={code} value={code}>\n {code}\n </Option>\n ))}\n </>\n );\n\n const Comp = (\n <StyledPhoneInput\n data-testid={testIds.root}\n as={StyledFormControl}\n forwardedAs={Flex as any}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n ref={containerRef}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n >\n {showCountryCode && !readOnly && (\n <>\n <Select\n data-testid={testIds.countryCode}\n value={countryCode}\n aria-label={t('select_country_code')}\n onChange={onSelectChange}\n required={required}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n autoComplete='tel-country-code'\n ref={setSelectEl}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n >\n {codesOptions}\n </Select>\n {selectEl && (\n <Tooltip target={selectEl} describeTarget={false} showDelay='none' hideDelay='none'>\n {t('country_code')}\n </Tooltip>\n )}\n </>\n )}\n <Input\n data-testid={testIds.control}\n {...restProps}\n inputMode='tel'\n ref={inputRef}\n value={formatted}\n aria-label={t('enter_a_number')}\n onChange={onInputChange}\n required={required}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n autoComplete='tel-national'\n onResolveSuggestion={onResolveSuggestion}\n className={createClassName('phone-input', className)}\n />\n {showCountryCode && inputEl && (\n <Tooltip target={inputEl} describeTarget={false} showDelay='none' hideDelay='none'>\n {t('phone_number')}\n </Tooltip>\n )}\n </StyledPhoneInput>\n );\n\n return label ? (\n <FormField\n testId={testIds}\n as='fieldset'\n additionalInfo={additionalInfo}\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n readOnly={readOnly}\n status={status}\n required={required}\n disabled={disabled}\n onResolveSuggestion={onResolveSuggestion}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n});\n\nexport default withTestIds(PhoneInput, getPhoneInputTestIds);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioCheckGroup.d.ts","sourceRoot":"","sources":["../../../src/components/RadioCheckGroup/RadioCheckGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,GAAG,EAEH,YAAY,EACZ,WAAW,EAEZ,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAc,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE1E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAEnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAiBrD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAKhE,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAC/C,UAAU,EACV,UAAU,CAAC,OAAO,QAAQ,CAAC,GAAG;IAC5B,sDAAsD;IACtD,QAAQ,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACxC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACtD,mGAAmG;IACnG,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACpC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC;;;OAGG;IACH,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC;;;OAGG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,GAAG,WAAW,CAAC;IACnD,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB,CACF,CAAC;AAEF,eAAO,MAAM,qBAAqB,8GAuBhC,CAAC;;;;
|
|
1
|
+
{"version":3,"file":"RadioCheckGroup.d.ts","sourceRoot":"","sources":["../../../src/components/RadioCheckGroup/RadioCheckGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,GAAG,EAEH,YAAY,EACZ,WAAW,EAEZ,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAc,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE1E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAEnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAiBrD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAKhE,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAC/C,UAAU,EACV,UAAU,CAAC,OAAO,QAAQ,CAAC,GAAG;IAC5B,sDAAsD;IACtD,QAAQ,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACxC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACtD,mGAAmG;IACnG,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACpC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC;;;OAGG;IACH,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC;;;OAGG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,GAAG,WAAW,CAAC;IACnD,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB,CACF,CAAC;AAEF,eAAO,MAAM,qBAAqB,8GAuBhC,CAAC;;;;AAkJH,wBAAuE"}
|
|
@@ -90,7 +90,7 @@ const RadioCheckGroup = forwardRef(function RadioCheckGroup(props, ref) {
|
|
|
90
90
|
}
|
|
91
91
|
: child.props.onChange
|
|
92
92
|
})), [children, name, disabled, readOnly, variant, onChange]);
|
|
93
|
-
return (_jsx(FormField, { testId: testIds, as: StyledRadioCheckGroup,
|
|
93
|
+
return (_jsx(FormField, { testId: testIds, as: StyledRadioCheckGroup, ref: containerRef, name: name, disabled: disabled, required: required, ...restProps, isRadioCheck: true, onClear: onClear,
|
|
94
94
|
// Prevents blur when any input within the group is actively focused.
|
|
95
95
|
onMouseDown: (e) => {
|
|
96
96
|
restProps.onMouseDown?.(e);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioCheckGroup.js","sourceRoot":"","sources":["../../../src/components/RadioCheckGroup/RadioCheckGroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, Children, cloneElement, useState, useEffect, useRef, useMemo } from 'react';\nimport type {\n Ref,\n PropsWithoutRef,\n ReactElement,\n ChangeEvent,\n MouseEvent as ReactMouseEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { RefElement, TestIdProp, WithAttributes } from '../../types';\nimport FormField from '../FormField';\nimport type { FormFieldProps } from '../FormField';\nimport { StyledFormField, StyledFormFieldInfo } from '../FormField/FormField';\nimport type { FormControlProps } from '../FormControl';\nimport type { RadioCheckProps } from '../RadioCheck';\nimport Flex from '../Flex';\nimport {\n useArrows,\n useConsolidatedRef,\n useElement,\n useTestIds,\n useTheme,\n useUID\n} from '../../hooks';\nimport Grid from '../Grid';\nimport {\n StyledImageContainer,\n StyledSelectionCard,\n StyledSelectionCardInline\n} from '../SelectionCard/SelectionCard.styles';\nimport { getActiveElement, withTestIds } from '../../utils';\nimport type { elements } from '../FormField/FormField.test-ids';\nimport { StyledRadioCheck } from '../RadioCheck/RadioCheck';\n\nimport { getRadioCheckGroupTestIds } from './RadioCheckGroup.test-ids';\n\nexport type RadioCheckGroupProps = WithAttributes<\n 'fieldset',\n TestIdProp<typeof elements> & {\n /** Accepts Checkboxes or RadioButtons as children. */\n children: ReactElement | ReactElement[];\n /**\n * Conveniently pass an onChange handler to the group to be notified when any of the inputs change.\n * Additionally, onChange can be passed to individual children.\n * Both handlers will be called, child followed by group.\n */\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n /** Callback invoked when the clear button is clicked. If provided will render the clear button. */\n onClear?: FormFieldProps['onClear'];\n /** Set visual state based on a validation state. */\n status?: FormControlProps['status'];\n /** Pass a string or a fragment with an Icon and string. */\n label?: FormControlProps['label'];\n /** Visually hides the label region. */\n labelHidden?: FormControlProps['labelHidden'];\n /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n info?: FormControlProps['info'];\n /** Indicate if the field is required. The browser defaults to false. */\n required?: FormControlProps['required'];\n /** Disable the control. The browser defaults to false. */\n disabled?: FormControlProps['disabled'];\n /** Makes the input non editable and non clickable. The browser defaults to false. */\n readOnly?: FormControlProps['readOnly'];\n /**\n * Layout field elements inline in a row.\n * @default false\n */\n inline?: FormFieldProps['inline'];\n /** Used to toggle the auto stacking feature of an inlined group.\n * @default true\n */\n autoStack?: boolean;\n /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n name?: FormControlProps['name'];\n /**\n * Controls the styling of the child RadioChecks.\n * @default 'simple'\n */\n variant?: RadioCheckProps['variant'] | 'card-grid';\n /** Pass a heading and content to show additional information on the field. */\n additionalInfo?: FormControlProps['additionalInfo'];\n /** Ref forwarded to the wrapping element. */\n ref?: Ref<HTMLElement>;\n }\n>;\n\nexport const StyledRadioCheckGroup = styled.fieldset(() => {\n return css`\n flex-wrap: nowrap;\n\n &[disabled] {\n > ${StyledFormField} {\n opacity: unset;\n }\n }\n\n ${StyledSelectionCard} {\n max-width: 100%;\n }\n\n ${StyledSelectionCardInline} ${StyledImageContainer} {\n /* To enlarge the image containers to the size of the biggest one */\n min-height: 100%;\n }\n\n ${StyledRadioCheck} > ${StyledFormFieldInfo} {\n display: none;\n }\n `;\n});\n\nconst RadioCheckGroup = forwardRef<\n RefElement<RadioCheckGroupProps>,\n PropsWithoutRef<RadioCheckGroupProps>\n>(function RadioCheckGroup(props, ref) {\n const uid = useUID();\n const {\n testId,\n children,\n name = uid,\n disabled = false,\n required = false,\n onChange,\n readOnly,\n inline = false,\n autoStack = true,\n variant = 'simple',\n onClear,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getRadioCheckGroupTestIds);\n const theme = useTheme();\n const [optionsEl, setOptionsEl] = useElement<HTMLDivElement>();\n const [renderInline, setRenderInline] = useState(inline);\n const renderInlineRef = useRef(inline);\n const minInlineWidth = useRef(0);\n const containerRef = useConsolidatedRef(ref);\n\n useArrows(containerRef, {\n selector: '[data-main-focus]',\n cycle: false,\n dir: 'left-right'\n });\n\n useEffect(() => {\n setRenderInline(inline);\n if (inline && optionsEl && optionsEl.lastChild && autoStack) {\n const intersectionObserver = new IntersectionObserver(\n entries => {\n if (entries[0].intersectionRatio < 1) {\n if (entries[0].rootBounds) minInlineWidth.current = entries[0].rootBounds.width + 1;\n renderInlineRef.current = false;\n setRenderInline(false);\n }\n },\n { root: optionsEl, threshold: 1 }\n );\n\n const resizeObserver = new ResizeObserver(entries => {\n if (!renderInlineRef.current && entries[0].contentRect.width > minInlineWidth.current) {\n renderInlineRef.current = true;\n setRenderInline(true);\n }\n });\n\n intersectionObserver.observe(optionsEl.lastChild as Element);\n resizeObserver.observe(optionsEl);\n\n return () => {\n intersectionObserver.disconnect();\n resizeObserver.disconnect();\n };\n }\n }, [optionsEl, inline, autoStack]);\n\n const mapChildren = useMemo(\n () =>\n Children.map(children, child =>\n cloneElement(child, {\n name,\n status: restProps.status,\n disabled: disabled || child.props.disabled,\n readOnly: readOnly || child.props.readOnly,\n variant: variant === 'card-grid' ? 'card' : variant,\n suppressAnnouncements: true,\n onChange: onChange\n ? (e: ChangeEvent<HTMLInputElement>) => {\n if (!(readOnly || child.props.readOnly)) {\n child.props.onChange?.(e);\n onChange(e);\n }\n }\n : child.props.onChange\n })\n ),\n [children, name, disabled, readOnly, variant, onChange]\n );\n\n return (\n <FormField\n testId={testIds}\n as={StyledRadioCheckGroup}\n labelAs='legend'\n ref={containerRef}\n name={name}\n disabled={disabled}\n required={required}\n {...restProps}\n isRadioCheck\n onClear={onClear}\n // Prevents blur when any input within the group is actively focused.\n onMouseDown={(e: ReactMouseEvent<HTMLFieldSetElement>) => {\n restProps.onMouseDown?.(e);\n\n if (!containerRef.current) return;\n\n if (!containerRef.current.contains(getActiveElement())) return;\n\n if (!(e.target instanceof Element) || !e.target.closest('label')) return;\n\n e.preventDefault();\n }}\n >\n {variant === 'card-grid' ? (\n <Grid\n container={{\n gap: 1,\n cols: (() => {\n if (!renderInline) return 'minmax(min-content, max-content)';\n if (autoStack)\n return `repeat(auto-fit, minmax(min(100%, ${theme.base['content-width'].sm}), 1fr))`;\n return `repeat(${Children.count(children)}, 1fr)`;\n })(),\n autoRows: '1fr'\n }}\n >\n {mapChildren}\n </Grid>\n ) : (\n <Flex\n ref={setOptionsEl}\n container={{\n direction: renderInline ? 'row' : 'column',\n colGap: renderInline ? 1.5 : 2,\n rowGap: variant === 'card' ? 1 : 0,\n wrap: 'wrap'\n }}\n >\n {mapChildren}\n </Flex>\n )}\n </FormField>\n );\n});\n\nexport default withTestIds(RadioCheckGroup, getRadioCheckGroupTestIds);\n"]}
|
|
1
|
+
{"version":3,"file":"RadioCheckGroup.js","sourceRoot":"","sources":["../../../src/components/RadioCheckGroup/RadioCheckGroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, Children, cloneElement, useState, useEffect, useRef, useMemo } from 'react';\nimport type {\n Ref,\n PropsWithoutRef,\n ReactElement,\n ChangeEvent,\n MouseEvent as ReactMouseEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { RefElement, TestIdProp, WithAttributes } from '../../types';\nimport FormField from '../FormField';\nimport type { FormFieldProps } from '../FormField';\nimport { StyledFormField, StyledFormFieldInfo } from '../FormField/FormField';\nimport type { FormControlProps } from '../FormControl';\nimport type { RadioCheckProps } from '../RadioCheck';\nimport Flex from '../Flex';\nimport {\n useArrows,\n useConsolidatedRef,\n useElement,\n useTestIds,\n useTheme,\n useUID\n} from '../../hooks';\nimport Grid from '../Grid';\nimport {\n StyledImageContainer,\n StyledSelectionCard,\n StyledSelectionCardInline\n} from '../SelectionCard/SelectionCard.styles';\nimport { getActiveElement, withTestIds } from '../../utils';\nimport type { elements } from '../FormField/FormField.test-ids';\nimport { StyledRadioCheck } from '../RadioCheck/RadioCheck';\n\nimport { getRadioCheckGroupTestIds } from './RadioCheckGroup.test-ids';\n\nexport type RadioCheckGroupProps = WithAttributes<\n 'fieldset',\n TestIdProp<typeof elements> & {\n /** Accepts Checkboxes or RadioButtons as children. */\n children: ReactElement | ReactElement[];\n /**\n * Conveniently pass an onChange handler to the group to be notified when any of the inputs change.\n * Additionally, onChange can be passed to individual children.\n * Both handlers will be called, child followed by group.\n */\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n /** Callback invoked when the clear button is clicked. If provided will render the clear button. */\n onClear?: FormFieldProps['onClear'];\n /** Set visual state based on a validation state. */\n status?: FormControlProps['status'];\n /** Pass a string or a fragment with an Icon and string. */\n label?: FormControlProps['label'];\n /** Visually hides the label region. */\n labelHidden?: FormControlProps['labelHidden'];\n /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n info?: FormControlProps['info'];\n /** Indicate if the field is required. The browser defaults to false. */\n required?: FormControlProps['required'];\n /** Disable the control. The browser defaults to false. */\n disabled?: FormControlProps['disabled'];\n /** Makes the input non editable and non clickable. The browser defaults to false. */\n readOnly?: FormControlProps['readOnly'];\n /**\n * Layout field elements inline in a row.\n * @default false\n */\n inline?: FormFieldProps['inline'];\n /** Used to toggle the auto stacking feature of an inlined group.\n * @default true\n */\n autoStack?: boolean;\n /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n name?: FormControlProps['name'];\n /**\n * Controls the styling of the child RadioChecks.\n * @default 'simple'\n */\n variant?: RadioCheckProps['variant'] | 'card-grid';\n /** Pass a heading and content to show additional information on the field. */\n additionalInfo?: FormControlProps['additionalInfo'];\n /** Ref forwarded to the wrapping element. */\n ref?: Ref<HTMLElement>;\n }\n>;\n\nexport const StyledRadioCheckGroup = styled.fieldset(() => {\n return css`\n flex-wrap: nowrap;\n\n &[disabled] {\n > ${StyledFormField} {\n opacity: unset;\n }\n }\n\n ${StyledSelectionCard} {\n max-width: 100%;\n }\n\n ${StyledSelectionCardInline} ${StyledImageContainer} {\n /* To enlarge the image containers to the size of the biggest one */\n min-height: 100%;\n }\n\n ${StyledRadioCheck} > ${StyledFormFieldInfo} {\n display: none;\n }\n `;\n});\n\nconst RadioCheckGroup = forwardRef<\n RefElement<RadioCheckGroupProps>,\n PropsWithoutRef<RadioCheckGroupProps>\n>(function RadioCheckGroup(props, ref) {\n const uid = useUID();\n const {\n testId,\n children,\n name = uid,\n disabled = false,\n required = false,\n onChange,\n readOnly,\n inline = false,\n autoStack = true,\n variant = 'simple',\n onClear,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getRadioCheckGroupTestIds);\n const theme = useTheme();\n const [optionsEl, setOptionsEl] = useElement<HTMLDivElement>();\n const [renderInline, setRenderInline] = useState(inline);\n const renderInlineRef = useRef(inline);\n const minInlineWidth = useRef(0);\n const containerRef = useConsolidatedRef(ref);\n\n useArrows(containerRef, {\n selector: '[data-main-focus]',\n cycle: false,\n dir: 'left-right'\n });\n\n useEffect(() => {\n setRenderInline(inline);\n if (inline && optionsEl && optionsEl.lastChild && autoStack) {\n const intersectionObserver = new IntersectionObserver(\n entries => {\n if (entries[0].intersectionRatio < 1) {\n if (entries[0].rootBounds) minInlineWidth.current = entries[0].rootBounds.width + 1;\n renderInlineRef.current = false;\n setRenderInline(false);\n }\n },\n { root: optionsEl, threshold: 1 }\n );\n\n const resizeObserver = new ResizeObserver(entries => {\n if (!renderInlineRef.current && entries[0].contentRect.width > minInlineWidth.current) {\n renderInlineRef.current = true;\n setRenderInline(true);\n }\n });\n\n intersectionObserver.observe(optionsEl.lastChild as Element);\n resizeObserver.observe(optionsEl);\n\n return () => {\n intersectionObserver.disconnect();\n resizeObserver.disconnect();\n };\n }\n }, [optionsEl, inline, autoStack]);\n\n const mapChildren = useMemo(\n () =>\n Children.map(children, child =>\n cloneElement(child, {\n name,\n status: restProps.status,\n disabled: disabled || child.props.disabled,\n readOnly: readOnly || child.props.readOnly,\n variant: variant === 'card-grid' ? 'card' : variant,\n suppressAnnouncements: true,\n onChange: onChange\n ? (e: ChangeEvent<HTMLInputElement>) => {\n if (!(readOnly || child.props.readOnly)) {\n child.props.onChange?.(e);\n onChange(e);\n }\n }\n : child.props.onChange\n })\n ),\n [children, name, disabled, readOnly, variant, onChange]\n );\n\n return (\n <FormField\n testId={testIds}\n as={StyledRadioCheckGroup}\n ref={containerRef}\n name={name}\n disabled={disabled}\n required={required}\n {...restProps}\n isRadioCheck\n onClear={onClear}\n // Prevents blur when any input within the group is actively focused.\n onMouseDown={(e: ReactMouseEvent<HTMLFieldSetElement>) => {\n restProps.onMouseDown?.(e);\n\n if (!containerRef.current) return;\n\n if (!containerRef.current.contains(getActiveElement())) return;\n\n if (!(e.target instanceof Element) || !e.target.closest('label')) return;\n\n e.preventDefault();\n }}\n >\n {variant === 'card-grid' ? (\n <Grid\n container={{\n gap: 1,\n cols: (() => {\n if (!renderInline) return 'minmax(min-content, max-content)';\n if (autoStack)\n return `repeat(auto-fit, minmax(min(100%, ${theme.base['content-width'].sm}), 1fr))`;\n return `repeat(${Children.count(children)}, 1fr)`;\n })(),\n autoRows: '1fr'\n }}\n >\n {mapChildren}\n </Grid>\n ) : (\n <Flex\n ref={setOptionsEl}\n container={{\n direction: renderInline ? 'row' : 'column',\n colGap: renderInline ? 1.5 : 2,\n rowGap: variant === 'card' ? 1 : 0,\n wrap: 'wrap'\n }}\n >\n {mapChildren}\n </Flex>\n )}\n </FormField>\n );\n});\n\nexport default withTestIds(RadioCheckGroup, getRadioCheckGroupTestIds);\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { FC, ChangeEventHandler } from 'react';
|
|
1
|
+
import type { FC, ChangeEventHandler, FocusEventHandler } from 'react';
|
|
2
2
|
import type { BaseProps, ForwardProps, NoChildrenProp, TestIdProp } from '../../types';
|
|
3
3
|
import type { FormControlProps } from '../FormControl';
|
|
4
4
|
export interface TextAreaProps extends FormControlProps, BaseProps, NoChildrenProp, TestIdProp {
|
|
@@ -27,6 +27,8 @@ export interface TextAreaProps extends FormControlProps, BaseProps, NoChildrenPr
|
|
|
27
27
|
*/
|
|
28
28
|
hardStop?: boolean;
|
|
29
29
|
onChange?: ChangeEventHandler<HTMLTextAreaElement>;
|
|
30
|
+
onFocus?: FocusEventHandler<HTMLTextAreaElement>;
|
|
31
|
+
onBlur?: FocusEventHandler<HTMLTextAreaElement>;
|
|
30
32
|
}
|
|
31
33
|
declare const _default: FC<TextAreaProps & ForwardProps> & {
|
|
32
34
|
getTestIds: (testIdProp?: TestIdProp["testId"]) => import("../../types").TestIdsRecord<readonly ["control", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/TextArea/TextArea.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/TextArea/TextArea.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,EAAE,EAIF,kBAAkB,EAElB,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAGvF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAgBvD,MAAM,WAAW,aAAc,SAAQ,gBAAgB,EAAE,SAAS,EAAE,cAAc,EAAE,UAAU;IAC5F,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,QAAQ,CAAC,EAAE,kBAAkB,CAAC,mBAAmB,CAAC,CAAC;IACnD,OAAO,CAAC,EAAE,iBAAiB,CAAC,mBAAmB,CAAC,CAAC;IACjD,MAAM,CAAC,EAAE,iBAAiB,CAAC,mBAAmB,CAAC,CAAC;CACjD;;;;AA2LD,wBAAyD"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { forwardRef, useCallback, useState, useEffect,
|
|
2
|
+
import { forwardRef, useCallback, useState, useEffect, useRef } from 'react';
|
|
3
3
|
import FormField from '../FormField';
|
|
4
4
|
import { StyledFormControl } from '../FormControl';
|
|
5
5
|
import { hasProp, withTestIds } from '../../utils';
|
|
6
|
-
import { useConsolidatedRef, useElement, useI18n, useTestIds, useUID } from '../../hooks';
|
|
6
|
+
import { useConsolidatedRef, useElement, useI18n, useLiveLog, useTestIds, useUID } from '../../hooks';
|
|
7
7
|
import Text from '../Text';
|
|
8
8
|
import VisuallyHiddenText from '../VisuallyHiddenText';
|
|
9
9
|
import StyledTextArea from './TextArea.styles';
|
|
@@ -14,9 +14,12 @@ const TextArea = forwardRef(function TextArea(props, ref) {
|
|
|
14
14
|
const t = useI18n();
|
|
15
15
|
const testIds = useTestIds(testId, getTextAreaTestIds);
|
|
16
16
|
const [charCount, setCharCount] = useState(value?.length ?? defaultValue?.length ?? 0);
|
|
17
|
+
const [focused, setFocused] = useState(false);
|
|
17
18
|
const [textAreaEl, setTextAreaEl] = useElement();
|
|
18
19
|
const textAreaRef = useConsolidatedRef(ref, setTextAreaEl);
|
|
19
20
|
const prevHeightRef = useRef(0);
|
|
21
|
+
const focusTimeoutRef = useRef(NaN);
|
|
22
|
+
const { announceAssertive } = useLiveLog();
|
|
20
23
|
const controlProp = {};
|
|
21
24
|
// Conditionally render component as controlled/uncontrolled
|
|
22
25
|
if (hasProp(props, 'value')) {
|
|
@@ -26,21 +29,15 @@ const TextArea = forwardRef(function TextArea(props, ref) {
|
|
|
26
29
|
controlProp.defaultValue = defaultValue ?? '';
|
|
27
30
|
}
|
|
28
31
|
const onChange = useCallback((e) => {
|
|
32
|
+
// Announce every change event when the limit is reached or exceeded.
|
|
33
|
+
if (maxLength !== undefined && e.target.value.length >= maxLength) {
|
|
34
|
+
announceAssertive({ message: t('text_area_character_limit'), type: 'warning' });
|
|
35
|
+
}
|
|
29
36
|
if (!hardStop || maxLength === undefined || e.target.value.length <= maxLength) {
|
|
30
37
|
onChangeProp?.(e);
|
|
31
38
|
setCharCount(e.target.value.length);
|
|
32
39
|
}
|
|
33
|
-
}, [onChangeProp, hardStop, maxLength]);
|
|
34
|
-
const ariaDescribedBy = useMemo(() => {
|
|
35
|
-
const idString = [];
|
|
36
|
-
if (info) {
|
|
37
|
-
idString.push(`${id}-info`);
|
|
38
|
-
}
|
|
39
|
-
if (displayCharCount && typeof maxLength === 'number') {
|
|
40
|
-
idString.push(`${id}-charCount`);
|
|
41
|
-
}
|
|
42
|
-
return idString.length ? idString.join(' ') : undefined;
|
|
43
|
-
}, [info, id, displayCharCount, maxLength]);
|
|
40
|
+
}, [onChangeProp, hardStop, maxLength, announceAssertive, t]);
|
|
44
41
|
const recalculateHeight = useCallback(() => {
|
|
45
42
|
if (!textAreaRef.current)
|
|
46
43
|
return;
|
|
@@ -78,8 +75,26 @@ const TextArea = forwardRef(function TextArea(props, ref) {
|
|
|
78
75
|
observer.observe(textAreaEl);
|
|
79
76
|
return () => observer.disconnect();
|
|
80
77
|
}, [autoResize, recalculateHeight, textAreaEl]);
|
|
81
|
-
|
|
82
|
-
|
|
78
|
+
useEffect(() => () => {
|
|
79
|
+
clearTimeout(focusTimeoutRef.current);
|
|
80
|
+
}, []);
|
|
81
|
+
const TextAreaControl = (_jsx(StyledFormControl, { "data-testid": testIds.control, ref: textAreaRef, id: id, "aria-describedby":
|
|
82
|
+
// Remove when focused to prevent each change in character count from being announced.
|
|
83
|
+
!focused && displayCharCount && typeof maxLength === 'number'
|
|
84
|
+
? `${id}-charCount`
|
|
85
|
+
: undefined, required: required, disabled: disabled, status: status, readOnly: readOnly, autoResize: autoResize, resizable: autoResize ? false : resizable, maxLength: hardStop ? maxLength : undefined, hasSuggestion: status === 'pending' && !!onResolveSuggestion, ...controlProp, ...restProps, onChange: onChange, onFocus: (e) => {
|
|
86
|
+
// Need to delay so screen readers will include the character count in announcement on initial focus.
|
|
87
|
+
// Shorter delays did not seem to work.
|
|
88
|
+
focusTimeoutRef.current = window.setTimeout(() => {
|
|
89
|
+
setFocused(true);
|
|
90
|
+
}, 250);
|
|
91
|
+
restProps.onFocus?.(e);
|
|
92
|
+
}, onBlur: (e) => {
|
|
93
|
+
clearTimeout(focusTimeoutRef.current);
|
|
94
|
+
setFocused(false);
|
|
95
|
+
restProps.onBlur?.(e);
|
|
96
|
+
}, as: StyledTextArea }));
|
|
97
|
+
return label || displayCharCount ? (_jsx(FormField, { testId: testIds, additionalInfo: additionalInfo, label: label, labelHidden: labelHidden, id: id, readOnly: readOnly, info: info, status: status, charLimitDisplay: displayCharCount && typeof maxLength === 'number' ? (_jsxs(Text, { id: `${id}-charCount`, readOnly: readOnly, variant: 'secondary', children: [maxLength >= 0 ? t('x_of_y', [charCount || '0', maxLength]) : charCount, ' ', _jsx(VisuallyHiddenText, { children: t('characters_typed') })] })) : undefined, required: required, disabled: disabled, onResolveSuggestion: onResolveSuggestion, children: TextAreaControl })) : (TextAreaControl);
|
|
83
98
|
});
|
|
84
99
|
export default withTestIds(TextArea, getTextAreaTestIds);
|
|
85
100
|
//# sourceMappingURL=TextArea.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../src/components/TextArea/TextArea.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAItF,OAAO,SAAS,MAAM,cAAc,CAAC;AACrC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAEnD,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAC1F,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;AAEvD,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AA8BzD,MAAM,QAAQ,GAAqC,UAAU,CAAC,SAAS,QAAQ,CAC7E,KAAqC,EACrC,GAA6B;IAE7B,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,EACJ,MAAM,EACN,cAAc,EACd,EAAE,GAAG,GAAG,EACR,KAAK,EACL,YAAY,EACZ,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,MAAM,EACN,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,IAAI,EACjB,SAAS,EACT,gBAAgB,GAAG,KAAK,EACxB,QAAQ,GAAG,IAAI,EACf,QAAQ,EAAE,YAAY,EACtB,mBAAmB,EACnB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IACvD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,IAAI,CAAC,CAAC,CAAC;IACvF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,UAAU,EAAuB,CAAC;IACtE,MAAM,WAAW,GAAG,kBAAkB,CAAC,GAAG,EAAE,aAAa,CAAC,CAAC;IAC3D,MAAM,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;IAEhC,MAAM,WAAW,GAGb,EAAE,CAAC;IAEP,4DAA4D;IAC5D,IAAI,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,EAAE,CAAC;QAC5B,WAAW,CAAC,KAAK,GAAG,KAAK,IAAI,EAAE,CAAC;IAClC,CAAC;SAAM,IAAI,OAAO,CAAC,KAAK,EAAE,cAAc,CAAC,EAAE,CAAC;QAC1C,WAAW,CAAC,YAAY,GAAG,YAAY,IAAI,EAAE,CAAC;IAChD,CAAC;IAED,MAAM,QAAQ,GAAG,WAAW,CAC1B,CAAC,CAAmC,EAAE,EAAE;QACtC,IAAI,CAAC,QAAQ,IAAI,SAAS,KAAK,SAAS,IAAI,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,IAAI,SAAS,EAAE,CAAC;YAC/E,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;YAClB,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QACtC,CAAC;IACH,CAAC,EACD,CAAC,YAAY,EAAE,QAAQ,EAAE,SAAS,CAAC,CACpC,CAAC;IAEF,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE;QACnC,MAAM,QAAQ,GAAG,EAAE,CAAC;QAEpB,IAAI,IAAI,EAAE,CAAC;YACT,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;QAC9B,CAAC;QACD,IAAI,gBAAgB,IAAI,OAAO,SAAS,KAAK,QAAQ,EAAE,CAAC;YACtD,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC;QACnC,CAAC;QAED,OAAO,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAC1D,CAAC,EAAE,CAAC,IAAI,EAAE,EAAE,EAAE,gBAAgB,EAAE,SAAS,CAAC,CAAC,CAAC;IAE5C,MAAM,iBAAiB,GAAG,WAAW,CAAC,GAAG,EAAE;QACzC,IAAI,CAAC,WAAW,CAAC,OAAO;YAAE,OAAO;QAEjC,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,mBAAmB,EAAE,MAAM,CAAC,CAAC;QAEnE,iEAAiE;QACjE,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC;QAEjE,MAAM,YAAY,GAAG,WAAW,CAAC,OAAO,CAAC,YAAY,CAAC;QACtD,MAAM,WAAW,GAAG,WAAW,CAAC,OAAO,CAAC,YAAY,GAAG,WAAW,CAAC,OAAO,CAAC,YAAY,CAAC;QACxF,mFAAmF;QACnF,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,mBAAmB,EAAE,GAAG,YAAY,GAAG,WAAW,IAAI,CAAC,CAAC;QAE9F,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC;IAC9D,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,WAAW,CAAC,OAAO;YAAE,OAAO;QAEjC,IAAI,UAAU,EAAE,CAAC;YACf,iBAAiB,EAAE,CAAC;QACtB,CAAC;aAAM,CAAC;YACN,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,mBAAmB,CAAC,CAAC;QAChE,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAE3C,kFAAkF;IAClF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,UAAU,IAAI,CAAC,UAAU;YAAE,OAAO;QAEvC,aAAa,CAAC,OAAO,GAAG,UAAU,CAAC,YAAY,CAAC;QAEhD,MAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;YAC5C,MAAM,aAAa,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC;YACpD,IAAI,aAAa,CAAC,OAAO,KAAK,CAAC,IAAI,aAAa,GAAG,CAAC,EAAE,CAAC;gBACrD,iBAAiB,EAAE,CAAC;YACtB,CAAC;YACD,aAAa,CAAC,OAAO,GAAG,aAAa,CAAC;QACxC,CAAC,CAAC,CAAC;QAEH,QAAQ,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;QAC7B,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;IACrC,CAAC,EAAE,CAAC,UAAU,EAAE,iBAAiB,EAAE,UAAU,CAAC,CAAC,CAAC;IAEhD,MAAM,eAAe,GAAG,CACtB,KAAC,iBAAiB,mBACH,OAAO,CAAC,OAAO,EAC5B,GAAG,EAAE,WAAW,EAChB,EAAE,EAAE,EAAE,sBACY,eAAe,EACjC,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,EACzC,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAC3C,aAAa,EAAE,MAAM,KAAK,SAAS,IAAI,CAAC,CAAC,mBAAmB,KACxD,WAAW,KACX,SAAS,EACb,QAAQ,EAAE,QAAQ,EAClB,EAAE,EAAE,cAAc,GAClB,CACH,CAAC;IAEF,OAAO,KAAK,IAAI,gBAAgB,CAAC,CAAC,CAAC,CACjC,KAAC,SAAS,IACR,MAAM,EAAE,OAAO,EACf,cAAc,EAAE,cAAc,EAC9B,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,gBAAgB,EACd,gBAAgB,IAAI,OAAO,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,CAClD,MAAC,IAAI,IACH,EAAE,EAAE,GAAG,EAAE,YAAY,EACrB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAC,WAAW,eACR,SAAS,IAAI,CAAC,IAAI,SAAS,GAAG,SAAS,IAAI,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,aAE1E,SAAS,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,SAAS,IAAI,GAAG,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,EAAE,GAAG,EAC7E,KAAC,kBAAkB,cAAE,CAAC,CAAC,kBAAkB,CAAC,GAAsB,IAC3D,CACR,CAAC,CAAC,CAAC,SAAS,EAEf,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,mBAAmB,EAAE,mBAAmB,YAEvC,eAAe,GACN,CACb,CAAC,CAAC,CAAC,CACF,eAAe,CAChB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,WAAW,CAAC,QAAQ,EAAE,kBAAkB,CAAC,CAAC","sourcesContent":["import { forwardRef, useCallback, useState, useEffect, useMemo, useRef } from 'react';\nimport type { FC, Ref, PropsWithoutRef, ChangeEvent, ChangeEventHandler } from 'react';\n\nimport type { BaseProps, ForwardProps, NoChildrenProp, TestIdProp } from '../../types';\nimport FormField from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport type { FormControlProps } from '../FormControl';\nimport { hasProp, withTestIds } from '../../utils';\nimport { useConsolidatedRef, useElement, useI18n, useTestIds, useUID } from '../../hooks';\nimport Text from '../Text';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport StyledTextArea from './TextArea.styles';\nimport { getTextAreaTestIds } from './TextArea.test-ids';\n\nexport interface TextAreaProps extends FormControlProps, BaseProps, NoChildrenProp, TestIdProp {\n /** Minimum length of characters that can be input. */\n minLength?: number;\n /** Maximum length of characters that can be input. */\n maxLength?: number;\n /**\n * Allows the user to resize the Text Area. This prop is ignored if autoResize is true.\n * @default false\n */\n resizable?: boolean;\n /**\n * Enables the Text Area to resize itself automatically.\n * @default true\n */\n autoResize?: boolean;\n /**\n * Display a live character count in relation to the maxLength.\n * @default false\n */\n displayCharCount?: boolean;\n /**\n * Allow or disallow a value beyond the maxLength.\n * @default true\n */\n hardStop?: boolean;\n onChange?: ChangeEventHandler<HTMLTextAreaElement>;\n}\n\nconst TextArea: FC<TextAreaProps & ForwardProps> = forwardRef(function TextArea(\n props: PropsWithoutRef<TextAreaProps>,\n ref: Ref<HTMLTextAreaElement>\n) {\n const uid = useUID();\n const {\n testId,\n additionalInfo,\n id = uid,\n value,\n defaultValue,\n required = false,\n disabled = false,\n readOnly = false,\n label,\n labelHidden,\n info,\n status,\n resizable = false,\n autoResize = true,\n maxLength,\n displayCharCount = false,\n hardStop = true,\n onChange: onChangeProp,\n onResolveSuggestion,\n ...restProps\n } = props;\n const t = useI18n();\n\n const testIds = useTestIds(testId, getTextAreaTestIds);\n const [charCount, setCharCount] = useState(value?.length ?? defaultValue?.length ?? 0);\n const [textAreaEl, setTextAreaEl] = useElement<HTMLTextAreaElement>();\n const textAreaRef = useConsolidatedRef(ref, setTextAreaEl);\n const prevHeightRef = useRef(0);\n\n const controlProp: {\n value?: string;\n defaultValue?: string;\n } = {};\n\n // Conditionally render component as controlled/uncontrolled\n if (hasProp(props, 'value')) {\n controlProp.value = value ?? '';\n } else if (hasProp(props, 'defaultValue')) {\n controlProp.defaultValue = defaultValue ?? '';\n }\n\n const onChange = useCallback(\n (e: ChangeEvent<HTMLTextAreaElement>) => {\n if (!hardStop || maxLength === undefined || e.target.value.length <= maxLength) {\n onChangeProp?.(e);\n setCharCount(e.target.value.length);\n }\n },\n [onChangeProp, hardStop, maxLength]\n );\n\n const ariaDescribedBy = useMemo(() => {\n const idString = [];\n\n if (info) {\n idString.push(`${id}-info`);\n }\n if (displayCharCount && typeof maxLength === 'number') {\n idString.push(`${id}-charCount`);\n }\n\n return idString.length ? idString.join(' ') : undefined;\n }, [info, id, displayCharCount, maxLength]);\n\n const recalculateHeight = useCallback(() => {\n if (!textAreaRef.current) return;\n\n textAreaRef.current.style.setProperty('--textarea-height', 'auto');\n\n // Remove scrollbar width to avoid interference with calculation.\n textAreaRef.current.style.setProperty('scrollbar-width', 'none');\n\n const scrollHeight = textAreaRef.current.scrollHeight;\n const borderWidth = textAreaRef.current.offsetHeight - textAreaRef.current.clientHeight;\n // Set height to auto then scrollHeight + borderWidth to resize TextArea to content\n textAreaRef.current.style.setProperty('--textarea-height', `${scrollHeight + borderWidth}px`);\n\n textAreaRef.current.style.removeProperty('scrollbar-width');\n }, []);\n\n useEffect(() => {\n if (!textAreaRef.current) return;\n\n if (autoResize) {\n recalculateHeight();\n } else {\n textAreaRef.current.style.removeProperty('--textarea-height');\n }\n }, [value, autoResize, recalculateHeight]);\n\n // Recalculate height when the element becomes visible after being displayed none.\n useEffect(() => {\n if (!textAreaEl || !autoResize) return;\n\n prevHeightRef.current = textAreaEl.offsetHeight;\n\n const observer = new ResizeObserver(entries => {\n const currentHeight = entries[0].contentRect.height;\n if (prevHeightRef.current === 0 && currentHeight > 0) {\n recalculateHeight();\n }\n prevHeightRef.current = currentHeight;\n });\n\n observer.observe(textAreaEl);\n return () => observer.disconnect();\n }, [autoResize, recalculateHeight, textAreaEl]);\n\n const TextAreaControl = (\n <StyledFormControl\n data-testid={testIds.control}\n ref={textAreaRef}\n id={id}\n aria-describedby={ariaDescribedBy}\n required={required}\n disabled={disabled}\n status={status}\n readOnly={readOnly}\n autoResize={autoResize}\n resizable={autoResize ? false : resizable}\n maxLength={hardStop ? maxLength : undefined}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n {...controlProp}\n {...restProps}\n onChange={onChange}\n as={StyledTextArea}\n />\n );\n\n return label || displayCharCount ? (\n <FormField\n testId={testIds}\n additionalInfo={additionalInfo}\n label={label}\n labelHidden={labelHidden}\n id={id}\n readOnly={readOnly}\n info={info}\n status={status}\n charLimitDisplay={\n displayCharCount && typeof maxLength === 'number' ? (\n <Text\n id={`${id}-charCount`}\n readOnly={readOnly}\n variant='secondary'\n aria-live={maxLength >= 0 && maxLength - charCount <= 20 ? 'polite' : 'off'}\n >\n {maxLength >= 0 ? t('x_of_y', [charCount || '0', maxLength]) : charCount}{' '}\n <VisuallyHiddenText>{t('characters_typed')}</VisuallyHiddenText>\n </Text>\n ) : undefined\n }\n required={required}\n disabled={disabled}\n onResolveSuggestion={onResolveSuggestion}\n >\n {TextAreaControl}\n </FormField>\n ) : (\n TextAreaControl\n );\n});\n\nexport default withTestIds(TextArea, getTextAreaTestIds);\n"]}
|
|
1
|
+
{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../src/components/TextArea/TextArea.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useCallback, useState, useEffect, useRef } from 'react';\nimport type {\n FC,\n Ref,\n PropsWithoutRef,\n ChangeEvent,\n ChangeEventHandler,\n FocusEvent,\n FocusEventHandler\n} from 'react';\n\nimport type { BaseProps, ForwardProps, NoChildrenProp, TestIdProp } from '../../types';\nimport FormField from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport type { FormControlProps } from '../FormControl';\nimport { hasProp, withTestIds } from '../../utils';\nimport {\n useConsolidatedRef,\n useElement,\n useI18n,\n useLiveLog,\n useTestIds,\n useUID\n} from '../../hooks';\nimport Text from '../Text';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport StyledTextArea from './TextArea.styles';\nimport { getTextAreaTestIds } from './TextArea.test-ids';\n\nexport interface TextAreaProps extends FormControlProps, BaseProps, NoChildrenProp, TestIdProp {\n /** Minimum length of characters that can be input. */\n minLength?: number;\n /** Maximum length of characters that can be input. */\n maxLength?: number;\n /**\n * Allows the user to resize the Text Area. This prop is ignored if autoResize is true.\n * @default false\n */\n resizable?: boolean;\n /**\n * Enables the Text Area to resize itself automatically.\n * @default true\n */\n autoResize?: boolean;\n /**\n * Display a live character count in relation to the maxLength.\n * @default false\n */\n displayCharCount?: boolean;\n /**\n * Allow or disallow a value beyond the maxLength.\n * @default true\n */\n hardStop?: boolean;\n\n onChange?: ChangeEventHandler<HTMLTextAreaElement>;\n onFocus?: FocusEventHandler<HTMLTextAreaElement>;\n onBlur?: FocusEventHandler<HTMLTextAreaElement>;\n}\n\nconst TextArea: FC<TextAreaProps & ForwardProps> = forwardRef(function TextArea(\n props: PropsWithoutRef<TextAreaProps>,\n ref: Ref<HTMLTextAreaElement>\n) {\n const uid = useUID();\n const {\n testId,\n additionalInfo,\n id = uid,\n value,\n defaultValue,\n required = false,\n disabled = false,\n readOnly = false,\n label,\n labelHidden,\n info,\n status,\n resizable = false,\n autoResize = true,\n maxLength,\n displayCharCount = false,\n hardStop = true,\n onChange: onChangeProp,\n onResolveSuggestion,\n ...restProps\n } = props;\n const t = useI18n();\n\n const testIds = useTestIds(testId, getTextAreaTestIds);\n const [charCount, setCharCount] = useState(value?.length ?? defaultValue?.length ?? 0);\n const [focused, setFocused] = useState(false);\n const [textAreaEl, setTextAreaEl] = useElement<HTMLTextAreaElement>();\n const textAreaRef = useConsolidatedRef(ref, setTextAreaEl);\n const prevHeightRef = useRef(0);\n const focusTimeoutRef = useRef(NaN);\n const { announceAssertive } = useLiveLog();\n\n const controlProp: {\n value?: string;\n defaultValue?: string;\n } = {};\n\n // Conditionally render component as controlled/uncontrolled\n if (hasProp(props, 'value')) {\n controlProp.value = value ?? '';\n } else if (hasProp(props, 'defaultValue')) {\n controlProp.defaultValue = defaultValue ?? '';\n }\n\n const onChange = useCallback(\n (e: ChangeEvent<HTMLTextAreaElement>) => {\n // Announce every change event when the limit is reached or exceeded.\n if (maxLength !== undefined && e.target.value.length >= maxLength) {\n announceAssertive({ message: t('text_area_character_limit'), type: 'warning' });\n }\n\n if (!hardStop || maxLength === undefined || e.target.value.length <= maxLength) {\n onChangeProp?.(e);\n setCharCount(e.target.value.length);\n }\n },\n [onChangeProp, hardStop, maxLength, announceAssertive, t]\n );\n\n const recalculateHeight = useCallback(() => {\n if (!textAreaRef.current) return;\n\n textAreaRef.current.style.setProperty('--textarea-height', 'auto');\n\n // Remove scrollbar width to avoid interference with calculation.\n textAreaRef.current.style.setProperty('scrollbar-width', 'none');\n\n const scrollHeight = textAreaRef.current.scrollHeight;\n const borderWidth = textAreaRef.current.offsetHeight - textAreaRef.current.clientHeight;\n // Set height to auto then scrollHeight + borderWidth to resize TextArea to content\n textAreaRef.current.style.setProperty('--textarea-height', `${scrollHeight + borderWidth}px`);\n\n textAreaRef.current.style.removeProperty('scrollbar-width');\n }, []);\n\n useEffect(() => {\n if (!textAreaRef.current) return;\n\n if (autoResize) {\n recalculateHeight();\n } else {\n textAreaRef.current.style.removeProperty('--textarea-height');\n }\n }, [value, autoResize, recalculateHeight]);\n\n // Recalculate height when the element becomes visible after being displayed none.\n useEffect(() => {\n if (!textAreaEl || !autoResize) return;\n\n prevHeightRef.current = textAreaEl.offsetHeight;\n\n const observer = new ResizeObserver(entries => {\n const currentHeight = entries[0].contentRect.height;\n if (prevHeightRef.current === 0 && currentHeight > 0) {\n recalculateHeight();\n }\n prevHeightRef.current = currentHeight;\n });\n\n observer.observe(textAreaEl);\n return () => observer.disconnect();\n }, [autoResize, recalculateHeight, textAreaEl]);\n\n useEffect(\n () => () => {\n clearTimeout(focusTimeoutRef.current);\n },\n []\n );\n\n const TextAreaControl = (\n <StyledFormControl\n data-testid={testIds.control}\n ref={textAreaRef}\n id={id}\n aria-describedby={\n // Remove when focused to prevent each change in character count from being announced.\n !focused && displayCharCount && typeof maxLength === 'number'\n ? `${id}-charCount`\n : undefined\n }\n required={required}\n disabled={disabled}\n status={status}\n readOnly={readOnly}\n autoResize={autoResize}\n resizable={autoResize ? false : resizable}\n maxLength={hardStop ? maxLength : undefined}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n {...controlProp}\n {...restProps}\n onChange={onChange}\n onFocus={(e: FocusEvent<HTMLTextAreaElement>) => {\n // Need to delay so screen readers will include the character count in announcement on initial focus.\n // Shorter delays did not seem to work.\n focusTimeoutRef.current = window.setTimeout(() => {\n setFocused(true);\n }, 250);\n\n restProps.onFocus?.(e);\n }}\n onBlur={(e: FocusEvent<HTMLTextAreaElement>) => {\n clearTimeout(focusTimeoutRef.current);\n setFocused(false);\n restProps.onBlur?.(e);\n }}\n as={StyledTextArea}\n />\n );\n\n return label || displayCharCount ? (\n <FormField\n testId={testIds}\n additionalInfo={additionalInfo}\n label={label}\n labelHidden={labelHidden}\n id={id}\n readOnly={readOnly}\n info={info}\n status={status}\n charLimitDisplay={\n displayCharCount && typeof maxLength === 'number' ? (\n <Text id={`${id}-charCount`} readOnly={readOnly} variant='secondary'>\n {maxLength >= 0 ? t('x_of_y', [charCount || '0', maxLength]) : charCount}{' '}\n <VisuallyHiddenText>{t('characters_typed')}</VisuallyHiddenText>\n </Text>\n ) : undefined\n }\n required={required}\n disabled={disabled}\n onResolveSuggestion={onResolveSuggestion}\n >\n {TextAreaControl}\n </FormField>\n ) : (\n TextAreaControl\n );\n});\n\nexport default withTestIds(TextArea, getTextAreaTestIds);\n"]}
|
package/lib/hooks/useI18n.d.ts
CHANGED
|
@@ -255,6 +255,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
|
|
|
255
255
|
x_of_y: string;
|
|
256
256
|
n_more: string;
|
|
257
257
|
keypress_instruction: string;
|
|
258
|
+
text_area_character_limit: string;
|
|
258
259
|
preview_link_instruction: string;
|
|
259
260
|
polite_announcements: string;
|
|
260
261
|
assertive_announcements: string;
|
|
@@ -342,6 +343,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
|
|
|
342
343
|
many: string;
|
|
343
344
|
other: string;
|
|
344
345
|
};
|
|
346
|
+
no_file_chosen: string;
|
|
345
347
|
attach_files: string;
|
|
346
348
|
attach_review: string;
|
|
347
349
|
files_uploaded: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO
|
|
1
|
+
{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
|
package/lib/i18n/default.d.ts
CHANGED
|
@@ -251,6 +251,7 @@ declare const _default: {
|
|
|
251
251
|
x_of_y: string;
|
|
252
252
|
n_more: string;
|
|
253
253
|
keypress_instruction: string;
|
|
254
|
+
text_area_character_limit: string;
|
|
254
255
|
preview_link_instruction: string;
|
|
255
256
|
polite_announcements: string;
|
|
256
257
|
assertive_announcements: string;
|
|
@@ -338,6 +339,7 @@ declare const _default: {
|
|
|
338
339
|
many: string;
|
|
339
340
|
other: string;
|
|
340
341
|
};
|
|
342
|
+
no_file_chosen: string;
|
|
341
343
|
attach_files: string;
|
|
342
344
|
attach_review: string;
|
|
343
345
|
files_uploaded: {
|