npm - @pega/cosmos-react-core - Versions diffs - 3.0.0-dev.20.0 → 3.0.0-dev.21.2 - Mend

@pega/cosmos-react-core 3.0.0-dev.20.0 → 3.0.0-dev.21.2

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.

Files changed (145) hide show

package/lib/components/FormField/FormField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/FormField/FormField.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FC,\n ReactNode,\n ComponentType,\n cloneElement,\n ReactElement,\n useEffect,\n useState,\n PropsWithoutRef,\n forwardRef,\n Ref\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor, rgba } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport { Action, ForwardProps, OmitStrict } from '../../types';\nimport Flex, { FlexProps } from '../Flex';\nimport Actions from '../Actions';\nimport { FormControlProps } from '../FormControl';\nimport { useConsolidatedRef, useI18n, useUID } from '../../hooks';\nimport Label, { LabelProps, StyledLabel } from '../Label';\nimport { calculateFontSize, getHoverColors } from '../../styles';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { getFocusables, tryCatch } from '../../utils';\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport * as warnSolidIcon from '../Icon/icons/warn-solid.icon';\nimport * as flagWaveSolidIcon from '../Icon/icons/flag-wave-solid.icon';\nimport * as checkIcon from '../Icon/icons/check.icon';\n\nregisterIcon(warnSolidIcon, flagWaveSolidIcon, checkIcon);\n\nexport interface FormFieldProps\n extends OmitStrict<FormControlProps, 'placeholder' \| 'value' \| 'defaultValue'> {\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 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?: Exclude<FlexProps['container'], boolean>;\n /* Character remaining count. Typically used on Textareas only /\n charLimitDisplay?: ReactNode;\n}\n\nconst StyledStatusIcon = styled(Icon)<{ status: NonNullable<FormFieldProps['status']> }>(\n ({ theme, status }) => {\n return css`\n height: 1em;\n width: 1em;\n color: ${theme.components['form-field'][status]['status-color']};\n vertical-align: baseline;\n margin-inline-end: 0.5ch;\n `;\n }\n);\n\nStyledStatusIcon.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 },\n components: { 'form-field': formField }\n }\n }) => {\n const { xxs: infoFontSize } = calculateFontSize(fontSize, fontScale);\n\n return css`\n max-width: max-content;\n margin-top: calc(0.25 ${spacing});\n font-size: ${infoFontSize};\n word-break: break-word;\n ${status &&\n formField[status] &&\n css`\n color: ${formField[status]['status-color']};\n `}\n `;\n }\n);\n\nStyledFormFieldInfo.defaultProps = defaultThemeProp;\n\nexport const StyledFormField = styled.div<FormFieldProps>(props => {\n const {\n disabled,\n required,\n theme: {\n base: {\n palette: { urgent },\n 'disabled-opacity': disabledOpacity,\n spacing\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 > ${StyledLabel} {\n margin-bottom: calc(0.25 * ${spacing});\n ${disabled &&\n css`\n cursor: not-allowed;\n `}\n\n &::after {\n display: ${required ? 'inline' : 'none'};\n content: '\\\\00a0';\n vertical-align: top;\n color: ${urgent};\n }\n }\n `;\n});\n\nStyledFormField.defaultProps = defaultThemeProp;\n\nconst StyledSuggestionButton = styled(Button)(\n ({\n theme: {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n 'border-radius': baseRadius,\n spacing\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 = formField.pending['status-color'];\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 &: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 &:last-child {\n border-end-end-radius: calc(${baseRadius} * ${radius});\n margin-inline-start: 0;\n }\n &:hover {\n background-color: ${hoverColors.background};\n }\n\n @media (pointer: coarse) {\n min-height: 2rem;\n }\n `;\n }\n);\n\nStyledSuggestionButton.defaultProps = defaultThemeProp;\n\nconst statusIconMap = { error: 'warn-solid', warning: 'flag-wave-solid', success: 'check' };\n\nconst FormField: FC<FormFieldProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<FormFieldProps>, ref: Ref<HTMLElement>) => {\n const uid = useUID();\n const {\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 charLimitDisplay,\n required = false,\n disabled = false,\n readOnly = false,\n inline = false,\n actions,\n container,\n onResolveSuggestion,\n ...restProps\n } = props;\n const t = useI18n();\n const labelAsLegend: boolean = labelAs === 'legend';\n const hasSuggestion = status === 'pending' && !!onResolveSuggestion;\n const consolidatedRef = useConsolidatedRef(ref);\n\n const styledLabel = (\n <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 >\n {status && status !== 'pending' && !labelHidden && (\n <StyledStatusIcon status={status} name={statusIconMap[status]} />\n )}\n {label}\n </Label>\n );\n\n /\n We have to use an internal state and an effect to set the text value of info after the DOM element is rendered.\n This is to ensure screen readers will announce info on errors when role is set to alert.\n Needs testing to confirm. Currently the expected sequence would be:\n - FormField renders with no error and no info\n - user input triggers an error status\n - props passed set error status and provide info text\n - effect runs and sets live region state which renders and is announced\n /\n const [liveRegionInfo, setLiveRegionInfo] = useState<ReactNode>(null);\n\n useEffect(() => {\n setLiveRegionInfo(info);\n }, [info]);\n\n // fieldset or single form control element\n let content: FormFieldProps['children'] = labelAsLegend\n ? controlElement\n : cloneElement(controlElement as ReactElement, {\n 'aria-describedby': info && `${id}-info`\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 = info ? (\n /\n Region for additional info, help or error message.\n Withholding aria-live=\"assertive\" to avoid iOS issue. See below.\n https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions#Preferring_specialized_live_region_roles\n /\n <StyledFormFieldInfo\n status={status}\n role={status === 'error' \|\| status === 'warning' ? 'alert' : undefined}\n id={`${id}-info`}\n >\n {liveRegionInfo}\n </StyledFormFieldInfo>\n ) : undefined;\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 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 onClick={() => {\n onResolveSuggestion(false);\n focusables[0]?.focus();\n }}\n aria-label={t('reject_suggestion_button_a11y')}\n >\n {t('no')}\n </StyledSuggestionButton>\n <StyledSuggestionButton\n onClick={() => {\n onResolveSuggestion(true);\n focusables[0]?.focus();\n }}\n aria-label={t('accept_suggestion_button_a11y')}\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 return (\n <Flex\n {...restProps}\n container={{\n direction: inline ? 'row' : 'column',\n alignItems: inline ? 'center' : undefined,\n ...container\n }}\n as={StyledFormField}\n id={`${id}-field`}\n forwardedAs={as}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n onKeyDown={hasSuggestion ? onKeyDown : undefined}\n aria-describedby={labelAsLegend && info ? `${id}-info` : undefined}\n ref={consolidatedRef}\n >\n {(labelAsLegend \|\| !labelAfter) && styledLabel}\n {content}\n {!labelAsLegend && labelAfter && styledLabel}\n {infoContent}\n </Flex>\n );\n }\n);\n\nexport default FormField;\n"]}
1	+ {"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/FormField/FormField.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FC,\n ReactNode,\n ComponentType,\n cloneElement,\n ReactElement,\n useEffect,\n useState,\n PropsWithoutRef,\n forwardRef,\n Ref\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor, rgba } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport { Action, ForwardProps, OmitStrict } from '../../types';\nimport Flex, { FlexProps } from '../Flex';\nimport Actions from '../Actions';\nimport { FormControlProps } from '../FormControl';\nimport { useConsolidatedRef, useI18n, useUID } from '../../hooks';\nimport Label, { LabelProps, StyledLabel } from '../Label';\nimport { calculateFontSize, getHoverColors } from '../../styles';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { getFocusables, tryCatch } from '../../utils';\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport * as warnSolidIcon from '../Icon/icons/warn-solid.icon';\nimport * as flagWaveSolidIcon from '../Icon/icons/flag-wave-solid.icon';\nimport * as checkIcon from '../Icon/icons/check.icon';\nimport AdditionalInfo from '../AdditionalInfo';\n\nregisterIcon(warnSolidIcon, flagWaveSolidIcon, checkIcon);\n\nexport interface FormFieldProps\n extends OmitStrict<FormControlProps, 'placeholder' \| 'value' \| 'defaultValue'> {\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?: Exclude<FlexProps['container'], boolean>;\n /* Character remaining count. Typically used on Textareas only /\n charLimitDisplay?: ReactNode;\n}\n\nconst StyledStatusIcon = styled(Icon)<{ status: NonNullable<FormFieldProps['status']> }>(\n ({ theme, status }) => {\n return css`\n height: 1em;\n width: 1em;\n color: ${theme.components['form-field'][status]['status-color']};\n vertical-align: baseline;\n margin-inline-end: 0.5ch;\n `;\n }\n);\n\nStyledStatusIcon.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 },\n components: { 'form-field': formField }\n }\n }) => {\n const { xxs: infoFontSize } = calculateFontSize(fontSize, fontScale);\n\n return css`\n max-width: max-content;\n margin-top: calc(0.25 ${spacing});\n font-size: ${infoFontSize};\n word-break: break-word;\n ${status &&\n formField[status] &&\n css`\n color: ${formField[status]['status-color']};\n `}\n `;\n }\n);\n\nStyledFormFieldInfo.defaultProps = defaultThemeProp;\n\nconst StyledLabelRow = styled.div``;\n\nexport const StyledFormField = styled.div<FormFieldProps>(props => {\n const {\n disabled,\n required,\n theme: {\n base: {\n palette: { urgent },\n 'disabled-opacity': disabledOpacity,\n spacing\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 > ${StyledLabel}, > ${StyledLabelRow} {\n margin-bottom: calc(0.25 * ${spacing});\n }\n\n > ${StyledLabel}, > ${StyledLabelRow} > ${StyledLabel} {\n &::after {\n display: ${required ? 'inline' : 'none'};\n content: '\\\\00a0';\n vertical-align: top;\n color: ${urgent};\n }\n\n ${disabled &&\n css`\n cursor: not-allowed;\n `}\n }\n `;\n});\n\nStyledFormField.defaultProps = defaultThemeProp;\n\nconst StyledSuggestionButton = styled(Button)(\n ({\n theme: {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n 'border-radius': baseRadius,\n spacing\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 = formField.pending['status-color'];\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 &: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 &:last-child {\n border-end-end-radius: calc(${baseRadius} * ${radius});\n margin-inline-start: 0;\n }\n &:hover {\n background-color: ${hoverColors.background};\n }\n\n @media (pointer: coarse) {\n min-height: 2rem;\n }\n `;\n }\n);\n\nStyledSuggestionButton.defaultProps = defaultThemeProp;\n\nconst statusIconMap = { error: 'warn-solid', warning: 'flag-wave-solid', success: 'check' };\n\nconst FormField: FC<FormFieldProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<FormFieldProps>, ref: Ref<HTMLElement>) => {\n const uid = useUID();\n const {\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 isRadioCheck,\n charLimitDisplay,\n required = false,\n disabled = false,\n readOnly = false,\n inline = false,\n actions,\n container,\n additionalInfo,\n onResolveSuggestion,\n ...restProps\n } = props;\n const t = useI18n();\n const labelAsLegend: boolean = labelAs === 'legend';\n const hasSuggestion = status === 'pending' && !!onResolveSuggestion;\n const consolidatedRef = useConsolidatedRef(ref);\n\n const showAdditionalInfo = !!additionalInfo && !disabled && !labelHidden;\n\n const labelAndInfo = (\n <>\n <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 >\n {status && status !== 'pending' && !labelHidden && (\n <StyledStatusIcon status={status} name={statusIconMap[status]} />\n )}\n {label}\n </Label>\n {showAdditionalInfo && (\n <AdditionalInfo heading={additionalInfo.heading}>{additionalInfo.content}</AdditionalInfo>\n )}\n </>\n );\n\n const labelRow =\n showAdditionalInfo && !isRadioCheck ? (\n <Flex\n as={StyledLabelRow}\n container={{ justify: 'between', alignItems: 'end' }}\n item={{ alignSelf: 'stretch' }}\n >\n {labelAndInfo}\n </Flex>\n ) : (\n labelAndInfo\n );\n\n /\n We have to use an internal state and an effect to set the text value of info after the DOM element is rendered.\n This is to ensure screen readers will announce info on errors when role is set to alert.\n Needs testing to confirm. Currently the expected sequence would be:\n - FormField renders with no error and no info\n - user input triggers an error status\n - props passed set error status and provide info text\n - effect runs and sets live region state which renders and is announced\n /\n const [liveRegionInfo, setLiveRegionInfo] = useState<ReactNode>(null);\n\n useEffect(() => {\n setLiveRegionInfo(info);\n }, [info]);\n\n // fieldset or single form control element\n let content: FormFieldProps['children'] = labelAsLegend\n ? controlElement\n : cloneElement(controlElement as ReactElement, {\n 'aria-describedby': info && `${id}-info`\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 = info ? (\n /\n Region for additional info, help or error message.\n Withholding aria-live=\"assertive\" to avoid iOS issue. See below.\n https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions#Preferring_specialized_live_region_roles\n /\n <StyledFormFieldInfo\n status={status}\n role={status === 'error' \|\| status === 'warning' ? 'alert' : undefined}\n id={`${id}-info`}\n >\n {liveRegionInfo}\n </StyledFormFieldInfo>\n ) : undefined;\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 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 onClick={() => {\n onResolveSuggestion(false);\n focusables[0]?.focus();\n }}\n aria-label={t('reject_suggestion_button_a11y')}\n >\n {t('no')}\n </StyledSuggestionButton>\n <StyledSuggestionButton\n onClick={() => {\n onResolveSuggestion(true);\n focusables[0]?.focus();\n }}\n aria-label={t('accept_suggestion_button_a11y')}\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 return (\n <Flex\n {...restProps}\n container={{\n direction: inline ? 'row' : 'column',\n alignItems: inline ? 'center' : undefined,\n ...container\n }}\n as={StyledFormField}\n id={`${id}-field`}\n forwardedAs={as}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n onKeyDown={hasSuggestion ? onKeyDown : undefined}\n aria-describedby={labelAsLegend && info ? `${id}-info` : undefined}\n ref={consolidatedRef}\n >\n {(labelAsLegend \|\| !labelAfter) && labelRow}\n {content}\n {!labelAsLegend && labelAfter && labelRow}\n {infoContent}\n </Flex>\n );\n }\n);\n\nexport default FormField;\n"]}

package/lib/components/Input/Input.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAoC,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE9E,OAAO,EAAE,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAMrE,MAAM,WAAW,UAAW,SAAQ,gBAAgB,EAAE,SAAS,EAAE,cAAc;IAC7E;;;OAGG;IACH,IAAI,CAAC,EACD,MAAM,GACN,UAAU,GACV,QAAQ,GACR,OAAO,GACP,KAAK,GACL,QAAQ,GACR,KAAK,GACL,MAAM,GACN,gBAAgB,GAChB,MAAM,GACN,MAAM,GACN,OAAO,GACP,OAAO,CAAC;IACZ,iFAAiF;IACjF,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB;AAED,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,UAAU,GAAG,YAAY,~~CAkExC~~,CAAC;AAEF,eAAe,KAAK,CAAC"}
1	+ {"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAoC,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE9E,OAAO,EAAE,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAMrE,MAAM,WAAW,UAAW,SAAQ,gBAAgB,EAAE,SAAS,EAAE,cAAc;IAC7E;;;OAGG;IACH,IAAI,CAAC,EACD,MAAM,GACN,UAAU,GACV,QAAQ,GACR,OAAO,GACP,KAAK,GACL,QAAQ,GACR,KAAK,GACL,MAAM,GACN,gBAAgB,GAChB,MAAM,GACN,MAAM,GACN,OAAO,GACP,OAAO,CAAC;IACZ,iFAAiF;IACjF,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB;AAED,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,UAAU,GAAG,YAAY,CAoExC,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/lib/components/Input/Input.js CHANGED Viewed

@@ -7,7 +7,7 @@ import { useUID } from '../../hooks';
 import StyledInput from './Input.styles';
 const Input = forwardRef((props, ref) => {
     const uid = useUID();
-    const { id = uid, value, defaultValue, required = false, disabled = false, label, labelHidden, info, status, actions, onResolveSuggestion, ...restProps } = props;
+    const { id = uid, value, defaultValue, required = false, disabled = false, label, additionalInfo, labelHidden, info, status, actions, onResolveSuggestion, ...restProps } = props;
     const controlProp = {};
     // Conditionally render component as controlled/uncontrolled
     if (hasProp(props, 'value')) {
@@ -28,6 +28,7 @@ const Input = forwardRef((props, ref) => {
             as: StyledInput
         } }));
     return label ? (_jsx(FormField, { ...{
+            additionalInfo,
             label,
             labelHidden,
             id,

package/lib/components/Input/Input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAW,UAAU,EAAmB,MAAM,OAAO,CAAC;AAG7D,OAAO,SAAS,MAAM,cAAc,CAAC;AACrC,OAAO,EAAoB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACrE,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,WAAW,MAAM,gBAAgB,CAAC;AAyBzC,MAAM,KAAK,GAAkC,UAAU,CACrD,CAAC,KAAkC,EAAE,GAA0B,EAAE,EAAE;IACjE,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,EACJ,EAAE,GAAG,GAAG,EACR,KAAK,EACL,YAAY,EACZ,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,MAAM,EACN,OAAO,EACP,mBAAmB,EACnB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,WAAW,GAGb,EAAE,CAAC;IAEP,4DAA4D;IAC5D,IAAI,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,EAAE;QAC3B,WAAW,CAAC,KAAK,GAAG,KAAK,IAAI,EAAE,CAAC;KACjC;SAAM,IAAI,OAAO,CAAC,KAAK,EAAE,cAAc,CAAC,EAAE;QACzC,WAAW,CAAC,YAAY,GAAG,YAAY,IAAI,EAAE,CAAC;KAC/C;IAED,MAAM,IAAI,GAAG,CACX,KAAC,iBAAiB,OACZ;YACF,GAAG;YACH,EAAE;YACF,QAAQ;YACR,QAAQ;YACR,MAAM;YACN,aAAa,EAAE,CAAC,CAAC,mBAAmB,IAAI,MAAM,KAAK,SAAS;YAC5D,GAAG,WAAW;YACd,GAAG,SAAS;YACZ,EAAE,EAAE,WAAW;SAChB,GACD,CACH,CAAC;IAEF,OAAO,KAAK,CAAC,CAAC,CAAC,CACb,KAAC,SAAS,OACJ;YACF,KAAK;YACL,WAAW;YACX,EAAE;YACF,IAAI;YACJ,MAAM;YACN,QAAQ;YACR,QAAQ;YACR,OAAO;YACP,mBAAmB;SACpB,YAEA,IAAI,GACK,CACb,CAAC,CAAC,CAAC,CACF,IAAI,CACL,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import { FC, Ref, forwardRef, PropsWithoutRef } from 'react';\n\nimport { Action, BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport FormField from '../FormField';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport { hasProp } from '../../utils';\nimport { useUID } from '../../hooks';\n\nimport StyledInput from './Input.styles';\n\nexport interface InputProps extends FormControlProps, BaseProps, NoChildrenProp {\n /*\n Specifies the type of input to be used.\n * @default \"text\"\n /\n type?:\n \| 'text'\n \| 'password'\n \| 'number'\n \| 'email'\n \| 'url'\n \| 'search'\n \| 'tel'\n \| 'date'\n \| 'datetime-local'\n \| 'time'\n \| 'week'\n \| 'month'\n \| 'color';\n /* Pass an array of Action objects to append button(s) inline with the Input. */\n actions?: Action[];\n}\n\nconst Input: FC<InputProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<InputProps>, ref: Ref<HTMLInputElement>) => {\n const uid = useUID();\n const {\n id = uid,\n value,\n defaultValue,\n required = false,\n disabled = false,\n label,\n labelHidden,\n info,\n status,\n actions,\n onResolveSuggestion,\n ...restProps\n } = props;\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 Comp = (\n <StyledFormControl\n {...{\n ref,\n id,\n required,\n disabled,\n status,\n hasSuggestion: !!onResolveSuggestion && status === 'pending',\n ...controlProp,\n ...restProps,\n as: StyledInput\n }}\n />\n );\n\n return label ? (\n <FormField\n {...{\n label,\n labelHidden,\n id,\n info,\n status,\n required,\n disabled,\n actions,\n onResolveSuggestion\n }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default Input;\n"]}
1	+ {"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAW,UAAU,EAAmB,MAAM,OAAO,CAAC;AAG7D,OAAO,SAAS,MAAM,cAAc,CAAC;AACrC,OAAO,EAAoB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACrE,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,WAAW,MAAM,gBAAgB,CAAC;AAyBzC,MAAM,KAAK,GAAkC,UAAU,CACrD,CAAC,KAAkC,EAAE,GAA0B,EAAE,EAAE;IACjE,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,EACJ,EAAE,GAAG,GAAG,EACR,KAAK,EACL,YAAY,EACZ,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,cAAc,EACd,WAAW,EACX,IAAI,EACJ,MAAM,EACN,OAAO,EACP,mBAAmB,EACnB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,WAAW,GAGb,EAAE,CAAC;IAEP,4DAA4D;IAC5D,IAAI,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,EAAE;QAC3B,WAAW,CAAC,KAAK,GAAG,KAAK,IAAI,EAAE,CAAC;KACjC;SAAM,IAAI,OAAO,CAAC,KAAK,EAAE,cAAc,CAAC,EAAE;QACzC,WAAW,CAAC,YAAY,GAAG,YAAY,IAAI,EAAE,CAAC;KAC/C;IAED,MAAM,IAAI,GAAG,CACX,KAAC,iBAAiB,OACZ;YACF,GAAG;YACH,EAAE;YACF,QAAQ;YACR,QAAQ;YACR,MAAM;YACN,aAAa,EAAE,CAAC,CAAC,mBAAmB,IAAI,MAAM,KAAK,SAAS;YAC5D,GAAG,WAAW;YACd,GAAG,SAAS;YACZ,EAAE,EAAE,WAAW;SAChB,GACD,CACH,CAAC;IAEF,OAAO,KAAK,CAAC,CAAC,CAAC,CACb,KAAC,SAAS,OACJ;YACF,cAAc;YACd,KAAK;YACL,WAAW;YACX,EAAE;YACF,IAAI;YACJ,MAAM;YACN,QAAQ;YACR,QAAQ;YACR,OAAO;YACP,mBAAmB;SACpB,YAEA,IAAI,GACK,CACb,CAAC,CAAC,CAAC,CACF,IAAI,CACL,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import { FC, Ref, forwardRef, PropsWithoutRef } from 'react';\n\nimport { Action, BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport FormField from '../FormField';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport { hasProp } from '../../utils';\nimport { useUID } from '../../hooks';\n\nimport StyledInput from './Input.styles';\n\nexport interface InputProps extends FormControlProps, BaseProps, NoChildrenProp {\n /*\n Specifies the type of input to be used.\n * @default \"text\"\n /\n type?:\n \| 'text'\n \| 'password'\n \| 'number'\n \| 'email'\n \| 'url'\n \| 'search'\n \| 'tel'\n \| 'date'\n \| 'datetime-local'\n \| 'time'\n \| 'week'\n \| 'month'\n \| 'color';\n /* Pass an array of Action objects to append button(s) inline with the Input. */\n actions?: Action[];\n}\n\nconst Input: FC<InputProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<InputProps>, ref: Ref<HTMLInputElement>) => {\n const uid = useUID();\n const {\n id = uid,\n value,\n defaultValue,\n required = false,\n disabled = false,\n label,\n additionalInfo,\n labelHidden,\n info,\n status,\n actions,\n onResolveSuggestion,\n ...restProps\n } = props;\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 Comp = (\n <StyledFormControl\n {...{\n ref,\n id,\n required,\n disabled,\n status,\n hasSuggestion: !!onResolveSuggestion && status === 'pending',\n ...controlProp,\n ...restProps,\n as: StyledInput\n }}\n />\n );\n\n return label ? (\n <FormField\n {...{\n additionalInfo,\n label,\n labelHidden,\n id,\n info,\n status,\n required,\n disabled,\n actions,\n onResolveSuggestion\n }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default Input;\n"]}

package/lib/components/Location/LocationInput.d.ts CHANGED Viewed

@@ -5,6 +5,8 @@ import BaseLocationProps from './Location.types';
 import { LatLng } from './types';
 import { LocationViewProps } from './LocationView';
 export interface LocationInputProps extends LocationViewProps, BaseLocationProps, BaseProps, FormControlProps {
+    /** Button when clicked will show additional information for the location input */
+    additionalInfo?: FormControlProps['additionalInfo'];
     /**
      * Get user current location on component first render.
      * @default false

package/lib/components/Location/LocationInput.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LocationInput.d.ts","sourceRoot":"","sources":["../../../src/components/Location/LocationInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,EAAE,EAQH,MAAM,OAAO,CAAC;AAQf,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAOtD,OAAO,iBAAiB,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACjC,OAAqB,EAAE,iBAAiB,EAAsB,MAAM,gBAAgB,CAAC;AAErF,MAAM,WAAW,kBACf,SAAQ,iBAAiB,EACvB,iBAAiB,EACjB,SAAS,EACT,gBAAgB;IAClB;;;OAGG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,uCAAuC;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,yGAAyG;IACzG,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE;QACjB,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,KAAK,IAAI,CAAC;CACZ;AASD,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,GAAG,YAAY,~~CAqJxD~~,CAAC;AAEF,eAAe,aAAa,CAAC"}
1	+ {"version":3,"file":"LocationInput.d.ts","sourceRoot":"","sources":["../../../src/components/Location/LocationInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,EAAE,EAQH,MAAM,OAAO,CAAC;AAQf,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAOtD,OAAO,iBAAiB,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACjC,OAAqB,EAAE,iBAAiB,EAAsB,MAAM,gBAAgB,CAAC;AAErF,MAAM,WAAW,kBACf,SAAQ,iBAAiB,EACvB,iBAAiB,EACjB,SAAS,EACT,gBAAgB;IAClB,kFAAkF;IAClF,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD;;;OAGG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,uCAAuC;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,yGAAyG;IACzG,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE;QACjB,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,KAAK,IAAI,CAAC;CACZ;AASD,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,GAAG,YAAY,CAwJxD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/components/Location/LocationInput.js CHANGED Viewed

@@ -18,7 +18,7 @@ const StyledLocationMap = styled.div `
   }
 `;
 const LocationInput = forwardRef((props, ref) => {
-    const { label, labelHidden, id = createUID(), location = '', value = '', info, status, required, readOnly, disabled, onSelect, onError, onChange, bias, showMap, defaultToCurrentLocation, centerMapOnChange, height, zoomLevel, onClick, onBlur, ...restProps } = props;
+    const { label, labelHidden, id = createUID(), location = '', value = '', info, status, required, readOnly, disabled, additionalInfo, onSelect, onError, onChange, bias, showMap, defaultToCurrentLocation, centerMapOnChange, height, zoomLevel, onClick, onBlur, ...restProps } = props;
     const { name, ...providerOpts } = useContext(MapsContext);
     const t = useI18n();
     const [placePredictionMenu, setPlacePredictionMenu] = useState({ items: [] });
@@ -91,7 +91,7 @@ const LocationInput = forwardRef((props, ref) => {
                         height,
                         zoomLevel
                     } }) }))] }));
-    return label ? (_jsx(FormField, { ...{ label, labelHidden, id, info, status, ref, required, disabled }, children: Comp })) : (Comp);
+    return label ? (_jsx(FormField, { ...{ label, labelHidden, id, info, status, ref, required, disabled, additionalInfo }, children: Comp })) : (Comp);
 });
 export default LocationInput;
 //# sourceMappingURL=LocationInput.js.map

package/lib/components/Location/LocationInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LocationInput.js","sourceRoot":"","sources":["../../../src/components/Location/LocationInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n ChangeEvent,\n FC,\n forwardRef,\n PropsWithoutRef,\n Ref,\n useCallback,\n useContext,\n useEffect,\n useState\n} from 'react';\nimport styled from 'styled-components';\n\nimport ComboBox from '../ComboBox';\nimport { MenuProps } from '../Menu';\nimport { useI18n } from '../../hooks';\nimport { createUID } from '../../utils/utils';\nimport FormField from '../FormField';\nimport { FormControlProps } from '../FormControl';\nimport { BaseProps, ForwardProps } from '../../types';\nimport Flex from '../Flex';\n\nimport PoweredByGoogleImage from './PoweredByGoogleImage';\nimport CurrentLocationButton from './CurrentLocationButton';\nimport MapsContext from './MapsContext';\nimport { getPlaceById, getPlacePredictions, loadMapsAPI } from './utils';\nimport BaseLocationProps from './Location.types';\nimport { LatLng } from './types';\nimport LocationView, { LocationViewProps, StyledLocationView } from './LocationView';\n\nexport interface LocationInputProps\n extends LocationViewProps,\n BaseLocationProps,\n BaseProps,\n FormControlProps {\n /*\n Get user current location on component first render.\n * @default false\n /\n defaultToCurrentLocation?: boolean;\n /* The value of the location field. /\n value?: string;\n /\n Callback fired on every change of the location input.\n * The argument passed back is the component's value prop.\n /\n onChange?: (value: string) => void;\n /\n Callback fired when the control's input loses focus.\n * The argument passed back is the component's value prop.\n /\n onBlur?: (value: string) => void;\n /\n Set to true renders the map view below input.\n * @default false\n /\n showMap?: boolean;\n /* Location coordinates used for the map view. /\n location?: LatLng \| string;\n /* Callback fired when user chooses location from the dropdown of suggestions or submits input value. */\n onSelect?: (value: {\n name: string;\n address?: string;\n latitude?: number;\n longitude?: number;\n }) => void;\n}\n\nconst StyledLocationMap = styled.div`\n ${StyledLocationView} {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n`;\n\nconst LocationInput: FC<LocationInputProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<LocationInputProps>, ref: Ref<HTMLInputElement>) => {\n const {\n label,\n labelHidden,\n id = createUID(),\n location = '',\n value = '',\n info,\n status,\n required,\n readOnly,\n disabled,\n onSelect,\n onError,\n onChange,\n bias,\n showMap,\n defaultToCurrentLocation,\n centerMapOnChange,\n height,\n zoomLevel,\n onClick,\n onBlur,\n ...restProps\n } = props;\n const { name, ...providerOpts } = useContext(MapsContext);\n const t = useI18n();\n const [placePredictionMenu, setPlacePredictionMenu] = useState<MenuProps>({ items: [] });\n const [filterValue, setFilterValue] = useState('');\n\n useEffect(() => {\n const mapApiPromise = loadMapsAPI(name, providerOpts).catch(error => onError?.(error));\n\n if (filterValue) {\n mapApiPromise\n .then(() => getPlacePredictions(filterValue, bias))\n .then(({ placePredictions, token }) => {\n setPlacePredictionMenu({\n items: placePredictions.map(item => ({\n id: item.place_id,\n primary: item.structured_formatting.main_text,\n secondary: [item.structured_formatting.secondary_text]\n })),\n emptyText: t('location_not_found_text'),\n onItemClick: itemId =>\n getPlaceById(itemId, token).then(arg => {\n setFilterValue('');\n onSelect?.(arg);\n })\n });\n })\n .catch(error => {\n setPlacePredictionMenu({ items: [] });\n onError?.(error);\n });\n } else {\n setPlacePredictionMenu({ items: [] });\n }\n }, [filterValue, bias, onError, onSelect]);\n\n const onInputChange = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n setFilterValue(e.target.value);\n onChange?.(e.target.value);\n },\n [onChange]\n );\n\n const onMapClick = useCallback(\n (placeInfo: { latitude: number; longitude: number; name: string; address?: string }) => {\n onSelect?.(placeInfo);\n onClick?.(placeInfo);\n },\n [onSelect, onClick]\n );\n\n const Comp = (\n <>\n <ComboBox\n placeholder={t('location_input_placeholder')}\n menu={\n filterValue\n ? {\n ...placePredictionMenu,\n items: placePredictionMenu.items.concat({\n id: createUID(),\n primary: t('use_input_value', [filterValue])\n }),\n mode: 'action',\n emptyText: t('location_not_found_text'),\n footer: !showMap && (\n <Flex container={{ justify: 'end' }}>\n <PoweredByGoogleImage />\n </Flex>\n )\n }\n : undefined\n }\n actions={\n !disabled &&\n !readOnly && (\n <CurrentLocationButton\n {...{ defaultToCurrentLocation, onError, onChange: onSelect }}\n />\n )\n }\n onChange={onInputChange}\n onBlur={() => {\n setFilterValue('');\n onBlur?.(value);\n }}\n value={value}\n {...{\n required,\n disabled,\n readOnly,\n status,\n ...restProps\n }}\n />\n {showMap && (\n <StyledLocationMap>\n <LocationView\n {...{\n location,\n onClick: onMapClick,\n onError,\n bias,\n disabled,\n readOnly,\n centerMapOnChange,\n height,\n zoomLevel\n }}\n />\n </StyledLocationMap>\n )}\n </>\n );\n\n return label ? (\n <FormField {...{ label, labelHidden, id, info, status, ref, required, disabled }}>\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default LocationInput;\n"]}
1	+ {"version":3,"file":"LocationInput.js","sourceRoot":"","sources":["../../../src/components/Location/LocationInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n ChangeEvent,\n FC,\n forwardRef,\n PropsWithoutRef,\n Ref,\n useCallback,\n useContext,\n useEffect,\n useState\n} from 'react';\nimport styled from 'styled-components';\n\nimport ComboBox from '../ComboBox';\nimport { MenuProps } from '../Menu';\nimport { useI18n } from '../../hooks';\nimport { createUID } from '../../utils/utils';\nimport FormField from '../FormField';\nimport { FormControlProps } from '../FormControl';\nimport { BaseProps, ForwardProps } from '../../types';\nimport Flex from '../Flex';\n\nimport PoweredByGoogleImage from './PoweredByGoogleImage';\nimport CurrentLocationButton from './CurrentLocationButton';\nimport MapsContext from './MapsContext';\nimport { getPlaceById, getPlacePredictions, loadMapsAPI } from './utils';\nimport BaseLocationProps from './Location.types';\nimport { LatLng } from './types';\nimport LocationView, { LocationViewProps, StyledLocationView } from './LocationView';\n\nexport interface LocationInputProps\n extends LocationViewProps,\n BaseLocationProps,\n BaseProps,\n FormControlProps {\n /** Button when clicked will show additional information for the location input /\n additionalInfo?: FormControlProps['additionalInfo'];\n /\n Get user current location on component first render.\n * @default false\n /\n defaultToCurrentLocation?: boolean;\n /* The value of the location field. /\n value?: string;\n /\n Callback fired on every change of the location input.\n * The argument passed back is the component's value prop.\n /\n onChange?: (value: string) => void;\n /\n Callback fired when the control's input loses focus.\n * The argument passed back is the component's value prop.\n /\n onBlur?: (value: string) => void;\n /\n Set to true renders the map view below input.\n * @default false\n /\n showMap?: boolean;\n /* Location coordinates used for the map view. /\n location?: LatLng \| string;\n /* Callback fired when user chooses location from the dropdown of suggestions or submits input value. */\n onSelect?: (value: {\n name: string;\n address?: string;\n latitude?: number;\n longitude?: number;\n }) => void;\n}\n\nconst StyledLocationMap = styled.div`\n ${StyledLocationView} {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n`;\n\nconst LocationInput: FC<LocationInputProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<LocationInputProps>, ref: Ref<HTMLInputElement>) => {\n const {\n label,\n labelHidden,\n id = createUID(),\n location = '',\n value = '',\n info,\n status,\n required,\n readOnly,\n disabled,\n additionalInfo,\n onSelect,\n onError,\n onChange,\n bias,\n showMap,\n defaultToCurrentLocation,\n centerMapOnChange,\n height,\n zoomLevel,\n onClick,\n onBlur,\n ...restProps\n } = props;\n const { name, ...providerOpts } = useContext(MapsContext);\n const t = useI18n();\n const [placePredictionMenu, setPlacePredictionMenu] = useState<MenuProps>({ items: [] });\n const [filterValue, setFilterValue] = useState('');\n\n useEffect(() => {\n const mapApiPromise = loadMapsAPI(name, providerOpts).catch(error => onError?.(error));\n\n if (filterValue) {\n mapApiPromise\n .then(() => getPlacePredictions(filterValue, bias))\n .then(({ placePredictions, token }) => {\n setPlacePredictionMenu({\n items: placePredictions.map(item => ({\n id: item.place_id,\n primary: item.structured_formatting.main_text,\n secondary: [item.structured_formatting.secondary_text]\n })),\n emptyText: t('location_not_found_text'),\n onItemClick: itemId =>\n getPlaceById(itemId, token).then(arg => {\n setFilterValue('');\n onSelect?.(arg);\n })\n });\n })\n .catch(error => {\n setPlacePredictionMenu({ items: [] });\n onError?.(error);\n });\n } else {\n setPlacePredictionMenu({ items: [] });\n }\n }, [filterValue, bias, onError, onSelect]);\n\n const onInputChange = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n setFilterValue(e.target.value);\n onChange?.(e.target.value);\n },\n [onChange]\n );\n\n const onMapClick = useCallback(\n (placeInfo: { latitude: number; longitude: number; name: string; address?: string }) => {\n onSelect?.(placeInfo);\n onClick?.(placeInfo);\n },\n [onSelect, onClick]\n );\n\n const Comp = (\n <>\n <ComboBox\n placeholder={t('location_input_placeholder')}\n menu={\n filterValue\n ? {\n ...placePredictionMenu,\n items: placePredictionMenu.items.concat({\n id: createUID(),\n primary: t('use_input_value', [filterValue])\n }),\n mode: 'action',\n emptyText: t('location_not_found_text'),\n footer: !showMap && (\n <Flex container={{ justify: 'end' }}>\n <PoweredByGoogleImage />\n </Flex>\n )\n }\n : undefined\n }\n actions={\n !disabled &&\n !readOnly && (\n <CurrentLocationButton\n {...{ defaultToCurrentLocation, onError, onChange: onSelect }}\n />\n )\n }\n onChange={onInputChange}\n onBlur={() => {\n setFilterValue('');\n onBlur?.(value);\n }}\n value={value}\n {...{\n required,\n disabled,\n readOnly,\n status,\n ...restProps\n }}\n />\n {showMap && (\n <StyledLocationMap>\n <LocationView\n {...{\n location,\n onClick: onMapClick,\n onError,\n bias,\n disabled,\n readOnly,\n centerMapOnChange,\n height,\n zoomLevel\n }}\n />\n </StyledLocationMap>\n )}\n </>\n );\n\n return label ? (\n <FormField\n {...{ label, labelHidden, id, info, status, ref, required, disabled, additionalInfo }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default LocationInput;\n"]}

package/lib/components/Menu/Menu.styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Menu.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/Menu.styles.ts"],"names":[],"mappings":"~~AAaA~~,eAAO,MAAM,kBAAkB,qMAE9B,CAAC;AAEF,eAAO,MAAM,eAAe,2GA8D1B,CAAC;AAIH,eAAO,MAAM,cAAc;kBAA6B,OAAO;SA+C9D,CAAC;AAIF,eAAO,MAAM,eAAe,yGAW3B,CAAC;AAEF,eAAO,MAAM,sBAAsB,uGAElC,CAAC;AAEF,eAAO,MAAM,eAAe,wGAM1B,CAAC;AAIH,eAAO,MAAM,mBAAmB,wGAM9B,CAAC;AAIH,eAAO,MAAM,qBAAqB,yGAUhC,CAAC;AAIH,eAAO,MAAM,oBAAoB,4GAgD/B,CAAC;AAIH,eAAO,MAAM,cAAc,wGAiB1B,CAAC;AAIF,eAAO,MAAM,uBAAuB,~~8GAMlC~~,CAAC;AAIH,eAAO,MAAM,6BAA6B,8GAEzC,CAAC;AAEF,eAAO,MAAM,iBAAiB,wGAI7B,CAAC;AAEF,eAAO,MAAM,qBAAqB,yGAqBjC,CAAC;AAIF,eAAO,MAAM,UAAU,yGAyCrB,CAAC"}
1	+ {"version":3,"file":"Menu.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/Menu.styles.ts"],"names":[],"mappings":"AAeA,eAAO,MAAM,kBAAkB,qMAE9B,CAAC;AAEF,eAAO,MAAM,eAAe,2GA8D1B,CAAC;AAIH,eAAO,MAAM,cAAc;kBAA6B,OAAO;SA+C9D,CAAC;AAIF,eAAO,MAAM,eAAe,yGAW3B,CAAC;AAEF,eAAO,MAAM,sBAAsB,uGAElC,CAAC;AAEF,eAAO,MAAM,eAAe,wGAM1B,CAAC;AAIH,eAAO,MAAM,mBAAmB,wGAM9B,CAAC;AAIH,eAAO,MAAM,qBAAqB,yGAUhC,CAAC;AAIH,eAAO,MAAM,oBAAoB,4GAgD/B,CAAC;AAIH,eAAO,MAAM,cAAc,wGAiB1B,CAAC;AAIF,eAAO,MAAM,uBAAuB,8GAOlC,CAAC;AAIH,eAAO,MAAM,6BAA6B,8GAEzC,CAAC;AAEF,eAAO,MAAM,iBAAiB,wGAI7B,CAAC;AAEF,eAAO,MAAM,qBAAqB,yGAqBjC,CAAC;AAIF,eAAO,MAAM,UAAU,yGAyCrB,CAAC"}

package/lib/components/Menu/Menu.styles.js CHANGED Viewed

@@ -9,6 +9,7 @@ import { tryCatch } from '../../utils';
 import { StyledText } from '../Text';
 import { StyledVisuallyHiddenText } from '../VisuallyHiddenText/VisuallyHiddenText';
 import Button from '../Button';
+const listMaxHeight = '50vh';
 export const StyledExpandButton = styled(Button) `
   align-self: center;
 `;
@@ -219,6 +220,7 @@ StyledMenuList.defaultProps = defaultThemeProp;
 export const StyledMenuListContainer = styled.fieldset(({ theme }) => {
     return css `
     background-color: ${theme.base.palette['primary-background']};
+    max-height: ${listMaxHeight};
     border: 0;
     border-radius: inherit;
   `;
@@ -236,7 +238,7 @@ export const StyledMenuListWrapper = styled.div(({ theme }) => css `
     position: relative;
     overflow: hidden;
     transition: height ${theme.base.animation.speed} ${theme.base.animation.timing.ease};
-    max-height: 50vh;
+    max-height: ${listMaxHeight};
     & > fieldset:first-child {
       position: relative;

package/lib/components/Menu/Menu.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Menu.styles.js","sourceRoot":"","sources":["../../../src/components/Menu/Menu.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { hideVisually, mix, readableColor, rgba } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { StyledEmptyState } from '../EmptyState';\nimport { StyledIcon } from '../Icon';\nimport { StyledGrid } from '../Grid';\nimport { StyledBareButton } from '../Button/BareButton';\nimport { tryCatch } from '../../utils';\nimport { StyledText } from '../Text';\nimport { StyledVisuallyHiddenText } from '../VisuallyHiddenText/VisuallyHiddenText';\nimport Button from '../Button';\n\nexport const StyledExpandButton = styled(Button)`\n align-self: center;\n`;\n\nexport const StyledItemLabel = styled.label(({ theme }) => {\n const hoverCheckColor = tryCatch(() =>\n rgba(\n theme.components['radio-check'][':checked']['background-color'],\n theme.base.transparency['transparent-5']\n )\n );\n\n const checkedBackground = theme.components['radio-check'][':checked']['background-color'];\n const checkedForeground = tryCatch(() => readableColor(checkedBackground));\n\n return css`\n padding: calc(0.5 * ${theme.base.spacing}) ${theme.base.spacing};\n cursor: pointer;\n\n &:hover {\n & > input[type='radio']:not(:checked) + ${StyledIcon} {\n color: ${hoverCheckColor};\n }\n\n & > input[type='checkbox'] + ${StyledIcon} {\n border-color: ${theme.components['form-control'][':hover']['border-color']};\n }\n }\n\n > ${StyledGrid} {\n flex-grow: 1;\n }\n\n > input {\n ${hideVisually}\n\n & + ${StyledIcon} {\n margin-inline-start: 0;\n flex-shrink: 0;\n }\n\n &[type='radio'] + ${StyledIcon} {\n color: transparent;\n }\n\n &[type='radio']:checked + ${StyledIcon} {\n color: ${checkedBackground};\n }\n\n &[type='checkbox'] + ${StyledIcon} {\n border: 0.0625rem solid ${theme.components['radio-check']['border-color']};\n border-radius: min(\n calc(${theme.base['border-radius']} * ${theme.components.checkbox['border-radius']}),\n 0.25rem\n );\n color: transparent;\n background-color: ${theme.components['radio-check']['background-color']};\n }\n\n &[type='checkbox']:checked + ${StyledIcon} {\n background-color: ${checkedBackground};\n border-color: ${theme.components['radio-check'][':checked']['border-color']};\n color: ${checkedForeground};\n }\n }\n `;\n});\n\nStyledItemLabel.defaultProps = defaultThemeProp;\n\nexport const StyledMenuItem = styled.li<{ isParentItem: boolean }>(\n ({ theme: { base, components }, isParentItem }) => {\n const activeColor = tryCatch(() =>\n mix(0.85, base.palette['primary-background'], base.palette.interactive)\n );\n const hoverColor = tryCatch(() =>\n mix(0.95, base.palette['primary-background'], base.palette.interactive)\n );\n\n return css`\n min-height: ${base['hit-area']['mouse-min']};\n\n @media (pointer: coarse) {\n min-height: ${base['hit-area']['finger-min']};\n }\n\n &:focus-within {\n background-color: ${activeColor};\n }\n\n &:hover:not([aria-disabled='true']) {\n background-color: ${hoverColor};\n }\n\n > button:first-child,\n > a:first-child {\n display: block;\n width: 100%;\n padding: calc(0.5 * ${base.spacing}) ${base.spacing};\n text-align: start;\n text-decoration: none;\n color: inherit;\n ${isParentItem &&\n css`\n padding-inline-start: calc(1.125rem + 2 * ${base.spacing});\n `}\n }\n\n &[aria-disabled='true'] {\n label,\n ${StyledBareButton} {\n background-color: ${components['form-control'][':disabled']['background-color']};\n opacity: ${base['disabled-opacity']};\n }\n }\n `;\n }\n);\n\nStyledMenuItem.defaultProps = defaultThemeProp;\n\nexport const StyledAncestors = styled.div`\n ${StyledIcon} {\n width: 1em;\n height: 1em;\n }\n\n & > ${StyledText} {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n`;\n\nexport const StyledVisibilityHidden = styled.p`\n ${hideVisually}\n`;\n\nexport const StyledSeparator = styled.li(({ theme }) => {\n return css`\n height: 0.0625rem;\n background-color: ${theme.base.palette['border-line']};\n margin: ${theme.base.spacing} 0;\n `;\n});\n\nStyledSeparator.defaultProps = defaultThemeProp;\n\nexport const StyledMenuGroupList = styled.ul(({ theme }) => {\n return css`\n ${StyledMenuItem} button {\n padding-inline-start: calc(1.5 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledMenuGroupList.defaultProps = defaultThemeProp;\n\nexport const StyledMenuGroupHeader = styled.div(({ theme }) => {\n return css`\n min-height: ${theme.base['hit-area']['mouse-min']};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n background-color: ${theme.base.palette['secondary-background']};\n\n @media (pointer: coarse) {\n min-height: ${theme.base['hit-area']['finger-min']};\n }\n `;\n});\n\nStyledMenuGroupHeader.defaultProps = defaultThemeProp;\n\nexport const StyledMenuListHeader = styled.legend(({ theme: { base } }) => {\n const hoverColor = tryCatch(() =>\n mix(0.95, base.palette['primary-background'], base.palette.interactive)\n );\n const activeColor = tryCatch(() =>\n mix(0.85, base.palette['primary-background'], base.palette.interactive)\n );\n\n return css`\n width: 100%;\n background-color: ${base.palette['primary-background']};\n\n &:first-child {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n\n &:last-child {\n border-bottom-left-radius: inherit;\n border-bottom-right-radius: inherit;\n }\n\n &:focus-within {\n box-shadow: inset ${base.shadow.focus};\n background-color: ${activeColor};\n }\n\n &:hover:not([aria-disabled='true']):not([data-current='true']) {\n background-color: ${hoverColor};\n }\n\n & > ${StyledBareButton}, & > button {\n color: ${base.palette['foreground-color']};\n width: 100%;\n padding: calc(0.5 * ${base.spacing}) ${base.spacing};\n text-align: start;\n border-radius: inherit;\n\n > ${StyledGrid} {\n grid-column-gap: ${base.spacing};\n }\n\n ${StyledIcon} {\n /* Fixes vertical align issue increasing box size beyond square */\n display: block;\n }\n }\n `;\n});\n\nStyledMenuListHeader.defaultProps = defaultThemeProp;\n\nexport const StyledMenuList = styled.ul(\n ({ theme }) => css`\n overflow-x: hidden;\n overflow-y: auto;\n list-style: none;\n height: 100%;\n border-radius: inherit;\n\n ${StyledEmptyState} {\n padding: ${theme.base.spacing};\n height: auto;\n }\n\n li:not(:first-child):not([role='presentation']) > ${StyledMenuGroupHeader} {\n margin-block-start: ${theme.base.spacing};\n }\n `\n);\n\nStyledMenuList.defaultProps = defaultThemeProp;\n\nexport const StyledMenuListContainer = styled.fieldset(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['primary-background']};\n border: 0;\n border-radius: inherit;\n `;\n});\n\nStyledMenuListContainer.defaultProps = defaultThemeProp;\n\nexport const StyledFlyoutMenuListContainer = styled(StyledMenuListContainer)`\n min-width: 10rem;\n`;\n\nexport const StyledLoadingItem = styled.li`\n display: block;\n position: relative;\n height: 2.8rem;\n`;\n\nexport const StyledMenuListWrapper = styled.div(\n ({ theme }) => css`\n position: relative;\n overflow: hidden;\n transition: height ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n max-height: 50vh;\n\n & > fieldset:first-child {\n position: relative;\n }\n\n &:first-child {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n\n &:last-child {\n border-bottom-left-radius: inherit;\n border-bottom-right-radius: inherit;\n }\n `\n);\n\nStyledMenuListWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledMenu = styled.div(({ theme }) => {\n const borderStyle = `0.0625rem solid ${theme.base.palette['border-line']}`;\n const activeColor = tryCatch(() =>\n mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n\n return css`\n &:first-child {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n\n &:last-child {\n border-bottom-left-radius: inherit;\n border-bottom-right-radius: inherit;\n }\n\n &[data-active-scope='true'] [data-current='true'] {\n background-color: ${activeColor};\n }\n\n ${StyledVisuallyHiddenText}:first-child {\n + ${StyledMenuListWrapper}, + header {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n }\n\n > header,\n > footer {\n padding: ${theme.base.spacing};\n }\n\n > header {\n border-bottom: ${borderStyle};\n }\n\n > footer {\n border-top: ${borderStyle};\n }\n `;\n});\n\nStyledMenu.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"Menu.styles.js","sourceRoot":"","sources":["../../../src/components/Menu/Menu.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { hideVisually, mix, readableColor, rgba } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { StyledEmptyState } from '../EmptyState';\nimport { StyledIcon } from '../Icon';\nimport { StyledGrid } from '../Grid';\nimport { StyledBareButton } from '../Button/BareButton';\nimport { tryCatch } from '../../utils';\nimport { StyledText } from '../Text';\nimport { StyledVisuallyHiddenText } from '../VisuallyHiddenText/VisuallyHiddenText';\nimport Button from '../Button';\n\nconst listMaxHeight = '50vh';\n\nexport const StyledExpandButton = styled(Button)`\n align-self: center;\n`;\n\nexport const StyledItemLabel = styled.label(({ theme }) => {\n const hoverCheckColor = tryCatch(() =>\n rgba(\n theme.components['radio-check'][':checked']['background-color'],\n theme.base.transparency['transparent-5']\n )\n );\n\n const checkedBackground = theme.components['radio-check'][':checked']['background-color'];\n const checkedForeground = tryCatch(() => readableColor(checkedBackground));\n\n return css`\n padding: calc(0.5 * ${theme.base.spacing}) ${theme.base.spacing};\n cursor: pointer;\n\n &:hover {\n & > input[type='radio']:not(:checked) + ${StyledIcon} {\n color: ${hoverCheckColor};\n }\n\n & > input[type='checkbox'] + ${StyledIcon} {\n border-color: ${theme.components['form-control'][':hover']['border-color']};\n }\n }\n\n > ${StyledGrid} {\n flex-grow: 1;\n }\n\n > input {\n ${hideVisually}\n\n & + ${StyledIcon} {\n margin-inline-start: 0;\n flex-shrink: 0;\n }\n\n &[type='radio'] + ${StyledIcon} {\n color: transparent;\n }\n\n &[type='radio']:checked + ${StyledIcon} {\n color: ${checkedBackground};\n }\n\n &[type='checkbox'] + ${StyledIcon} {\n border: 0.0625rem solid ${theme.components['radio-check']['border-color']};\n border-radius: min(\n calc(${theme.base['border-radius']} * ${theme.components.checkbox['border-radius']}),\n 0.25rem\n );\n color: transparent;\n background-color: ${theme.components['radio-check']['background-color']};\n }\n\n &[type='checkbox']:checked + ${StyledIcon} {\n background-color: ${checkedBackground};\n border-color: ${theme.components['radio-check'][':checked']['border-color']};\n color: ${checkedForeground};\n }\n }\n `;\n});\n\nStyledItemLabel.defaultProps = defaultThemeProp;\n\nexport const StyledMenuItem = styled.li<{ isParentItem: boolean }>(\n ({ theme: { base, components }, isParentItem }) => {\n const activeColor = tryCatch(() =>\n mix(0.85, base.palette['primary-background'], base.palette.interactive)\n );\n const hoverColor = tryCatch(() =>\n mix(0.95, base.palette['primary-background'], base.palette.interactive)\n );\n\n return css`\n min-height: ${base['hit-area']['mouse-min']};\n\n @media (pointer: coarse) {\n min-height: ${base['hit-area']['finger-min']};\n }\n\n &:focus-within {\n background-color: ${activeColor};\n }\n\n &:hover:not([aria-disabled='true']) {\n background-color: ${hoverColor};\n }\n\n > button:first-child,\n > a:first-child {\n display: block;\n width: 100%;\n padding: calc(0.5 * ${base.spacing}) ${base.spacing};\n text-align: start;\n text-decoration: none;\n color: inherit;\n ${isParentItem &&\n css`\n padding-inline-start: calc(1.125rem + 2 * ${base.spacing});\n `}\n }\n\n &[aria-disabled='true'] {\n label,\n ${StyledBareButton} {\n background-color: ${components['form-control'][':disabled']['background-color']};\n opacity: ${base['disabled-opacity']};\n }\n }\n `;\n }\n);\n\nStyledMenuItem.defaultProps = defaultThemeProp;\n\nexport const StyledAncestors = styled.div`\n ${StyledIcon} {\n width: 1em;\n height: 1em;\n }\n\n & > ${StyledText} {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n`;\n\nexport const StyledVisibilityHidden = styled.p`\n ${hideVisually}\n`;\n\nexport const StyledSeparator = styled.li(({ theme }) => {\n return css`\n height: 0.0625rem;\n background-color: ${theme.base.palette['border-line']};\n margin: ${theme.base.spacing} 0;\n `;\n});\n\nStyledSeparator.defaultProps = defaultThemeProp;\n\nexport const StyledMenuGroupList = styled.ul(({ theme }) => {\n return css`\n ${StyledMenuItem} button {\n padding-inline-start: calc(1.5 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledMenuGroupList.defaultProps = defaultThemeProp;\n\nexport const StyledMenuGroupHeader = styled.div(({ theme }) => {\n return css`\n min-height: ${theme.base['hit-area']['mouse-min']};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n background-color: ${theme.base.palette['secondary-background']};\n\n @media (pointer: coarse) {\n min-height: ${theme.base['hit-area']['finger-min']};\n }\n `;\n});\n\nStyledMenuGroupHeader.defaultProps = defaultThemeProp;\n\nexport const StyledMenuListHeader = styled.legend(({ theme: { base } }) => {\n const hoverColor = tryCatch(() =>\n mix(0.95, base.palette['primary-background'], base.palette.interactive)\n );\n const activeColor = tryCatch(() =>\n mix(0.85, base.palette['primary-background'], base.palette.interactive)\n );\n\n return css`\n width: 100%;\n background-color: ${base.palette['primary-background']};\n\n &:first-child {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n\n &:last-child {\n border-bottom-left-radius: inherit;\n border-bottom-right-radius: inherit;\n }\n\n &:focus-within {\n box-shadow: inset ${base.shadow.focus};\n background-color: ${activeColor};\n }\n\n &:hover:not([aria-disabled='true']):not([data-current='true']) {\n background-color: ${hoverColor};\n }\n\n & > ${StyledBareButton}, & > button {\n color: ${base.palette['foreground-color']};\n width: 100%;\n padding: calc(0.5 * ${base.spacing}) ${base.spacing};\n text-align: start;\n border-radius: inherit;\n\n > ${StyledGrid} {\n grid-column-gap: ${base.spacing};\n }\n\n ${StyledIcon} {\n /* Fixes vertical align issue increasing box size beyond square */\n display: block;\n }\n }\n `;\n});\n\nStyledMenuListHeader.defaultProps = defaultThemeProp;\n\nexport const StyledMenuList = styled.ul(\n ({ theme }) => css`\n overflow-x: hidden;\n overflow-y: auto;\n list-style: none;\n height: 100%;\n border-radius: inherit;\n\n ${StyledEmptyState} {\n padding: ${theme.base.spacing};\n height: auto;\n }\n\n li:not(:first-child):not([role='presentation']) > ${StyledMenuGroupHeader} {\n margin-block-start: ${theme.base.spacing};\n }\n `\n);\n\nStyledMenuList.defaultProps = defaultThemeProp;\n\nexport const StyledMenuListContainer = styled.fieldset(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['primary-background']};\n max-height: ${listMaxHeight};\n border: 0;\n border-radius: inherit;\n `;\n});\n\nStyledMenuListContainer.defaultProps = defaultThemeProp;\n\nexport const StyledFlyoutMenuListContainer = styled(StyledMenuListContainer)`\n min-width: 10rem;\n`;\n\nexport const StyledLoadingItem = styled.li`\n display: block;\n position: relative;\n height: 2.8rem;\n`;\n\nexport const StyledMenuListWrapper = styled.div(\n ({ theme }) => css`\n position: relative;\n overflow: hidden;\n transition: height ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n max-height: ${listMaxHeight};\n\n & > fieldset:first-child {\n position: relative;\n }\n\n &:first-child {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n\n &:last-child {\n border-bottom-left-radius: inherit;\n border-bottom-right-radius: inherit;\n }\n `\n);\n\nStyledMenuListWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledMenu = styled.div(({ theme }) => {\n const borderStyle = `0.0625rem solid ${theme.base.palette['border-line']}`;\n const activeColor = tryCatch(() =>\n mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n\n return css`\n &:first-child {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n\n &:last-child {\n border-bottom-left-radius: inherit;\n border-bottom-right-radius: inherit;\n }\n\n &[data-active-scope='true'] [data-current='true'] {\n background-color: ${activeColor};\n }\n\n ${StyledVisuallyHiddenText}:first-child {\n + ${StyledMenuListWrapper}, + header {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n }\n\n > header,\n > footer {\n padding: ${theme.base.spacing};\n }\n\n > header {\n border-bottom: ${borderStyle};\n }\n\n > footer {\n border-top: ${borderStyle};\n }\n `;\n});\n\nStyledMenu.defaultProps = defaultThemeProp;\n"]}

package/lib/components/Menu/MenuList.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAYlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAW3C,OAAO,KAAK,EAEV,aAAa,EAGd,MAAM,cAAc,CAAC;~~AAsBtB~~,QAAA,MAAM,QAAQ,EAAE,iBAAiB,CAAC,aAAa,GAAG,YAAY,CA8M7D,CAAC;AAEF,eAAe,QAAQ,CAAC"}
1	+ {"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAYlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAW3C,OAAO,KAAK,EAEV,aAAa,EAGd,MAAM,cAAc,CAAC;AAiCtB,QAAA,MAAM,QAAQ,EAAE,iBAAiB,CAAC,aAAa,GAAG,YAAY,CA8M7D,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/lib/components/Menu/MenuList.js CHANGED Viewed

@@ -19,6 +19,15 @@ const setParentDisabled = (fieldset, bool) => {
         legendButton.disabled = bool;
     }
 };
+const countVisibleItems = (menuItems) => {
+    return menuItems.reduce((acc, item) => {
+        const isFlatGroup = !helpers.isItem(item);
+        if (isFlatGroup && item.items) {
+            return acc + item.items.length + 1;
+        }
+        return acc + 1;
+    }, 0);
+};
 const MenuList = forwardRef(({ items, parent, id, menuRole, ...restProps }, ref) => {
     const menuListWrapperRef = useRef(null);
     const selfRef = useConsolidatedRef(ref);
@@ -36,7 +45,7 @@ const MenuList = forwardRef(({ items, parent, id, menuRole, ...restProps }, ref)
         if (!selfRef.current || expandedItem)
             return;
         menuListWrapperRef.current = selfRef.current.parentElement;
-        resizeRootEl(selfRef.current, menuListWrapperRef.current, items.length + 1, scrollAt);
+        resizeRootEl(selfRef.current, menuListWrapperRef.current, countVisibleItems(items), scrollAt);
     });
     useEffect(() => {
         if (parent)
@@ -94,7 +103,7 @@ const MenuList = forwardRef(({ items, parent, id, menuRole, ...restProps }, ref)
                     if (parent && menuListWrapperRef.current) {
                         setParentDisabled(parent.el, false);
                         parent.el.style.opacity = '1';
-                        resizeRootEl(parent.el, menuListWrapperRef.current, parent.siblingItems.length + 1, scrollAt);
+                        resizeRootEl(parent.el, menuListWrapperRef.current, countVisibleItems(parent.siblingItems), scrollAt);
                     }
                     if (selfRef.current) {
                         selfRef.current.style.opacity = '0';

package/lib/components/Menu/MenuList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenuList.js","sourceRoot":"","sources":["../../../src/components/Menu/MenuList.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n MutableRefObject,\n PropsWithoutRef,\n useContext,\n useEffect,\n useLayoutEffect,\n useRef,\n useState,\n useMemo,\n Fragment,\n useCallback,\n MouseEvent\n} from 'react';\n\nimport { ForwardProps } from '../../types';\nimport Drawer from '../Drawer';\nimport {\n useAfterInitialEffect,\n useConsolidatedRef,\n useItemIntersection,\n useDirection\n} from '../../hooks';\nimport Progress from '../Progress';\nimport EmptyState from '../EmptyState';\n\nimport type {\n AcceptedMouseEventElement,\n MenuListProps,\n ParentMenuItemProps,\n MenuItemProps\n} from './Menu.types';\nimport MenuContext from './Menu.context';\nimport MenuListHeader from './MenuListHeader';\nimport MenuItem from './MenuItem';\nimport helpers from './helpers';\nimport {\n StyledLoadingItem,\n StyledMenuList,\n StyledMenuListContainer,\n StyledSeparator\n} from './Menu.styles';\nimport { resizeRootEl } from './NavItemsList';\nimport MenuGroup from './MenuGroup';\n\nconst setParentDisabled = (fieldset: HTMLFieldSetElement, bool: boolean) => {\n fieldset.disabled = bool;\n const legendButton = fieldset.querySelector<HTMLButtonElement>('legend button');\n if (legendButton) {\n legendButton.disabled = bool;\n }\n};\n\nconst MenuList: FunctionComponent<MenuListProps & ForwardProps> = forwardRef(\n (\n { items, parent, id, menuRole, ...restProps }: PropsWithoutRef<MenuListProps>,\n ref: MenuListProps['ref']\n ) => {\n const menuListWrapperRef: MutableRefObject<HTMLElement \| null> = useRef(null);\n const selfRef = useConsolidatedRef(ref);\n const ulRef = useRef<HTMLUListElement>(null);\n const returnFocusRef: MutableRefObject<HTMLButtonElement \| null> = useRef(null);\n const [open, setOpen] = useState(!parent);\n const [expandedItem, setExpandedItem] = useState<ParentMenuItemProps>();\n const {\n scrollAt,\n loadMore,\n loading,\n emptyText,\n currentItemId,\n onItemExpand,\n focusControl,\n updateActiveDescendants,\n setFocusReturnEl,\n onItemCollapse\n } = useContext(MenuContext);\n const { end } = useDirection();\n\n useItemIntersection(\n ulRef,\n items.length - 1,\n () => {\n if (!loading) loadMore?.(parent?.item?.id);\n },\n ':scope > li'\n );\n\n useLayoutEffect(() => {\n if (!selfRef.current \|\| expandedItem) return;\n menuListWrapperRef.current = selfRef.current.parentElement;\n resizeRootEl(\n selfRef.current,\n menuListWrapperRef.current as HTMLElement,\n items.length + 1,\n scrollAt\n );\n });\n\n useEffect(() => {\n if (parent) setOpen(true);\n }, []);\n\n useAfterInitialEffect(() => {\n if (expandedItem) {\n setExpandedItem(items.find(item => item.id === expandedItem.id) as ParentMenuItemProps); // FIXME\n }\n }, [expandedItem, items]);\n\n useAfterInitialEffect(() => {\n if (currentItemId) {\n // if there is ancestor item of the controlled item, set it to expanded.\n const ancestor = items.find(\n item => item.items?.length && helpers.getItem(item.items, currentItemId) !== undefined\n );\n\n if (ancestor) {\n setExpandedItem(ancestor as ParentMenuItemProps);\n updateActiveDescendants({ preventScroll: true });\n }\n }\n }, [currentItemId, items, parent]);\n\n const onExpandCallback = useCallback(\n (itemId: MenuItemProps['id'], e: MouseEvent<AcceptedMouseEventElement>) => {\n const item = helpers.getItem(items, itemId);\n returnFocusRef.current = e.currentTarget as HTMLButtonElement;\n setExpandedItem(item as ParentMenuItemProps); // FIXME\n item?.onExpand?.(itemId, e);\n onItemExpand?.(itemId, e);\n updateActiveDescendants({ preventScroll: true });\n },\n [items]\n );\n\n const listContent = useMemo(() => {\n if (items.length) {\n return items.map((item, index) => {\n return helpers.isItem(item) ? (\n <MenuItem\n {...item}\n key={item.id}\n role={menuRole === 'listbox' ? 'option' : 'menuitem'}\n onExpand={item.items ? onExpandCallback : undefined}\n />\n ) : (\n <Fragment key={item.id}>\n <MenuGroup {...item} itemRole={menuRole === 'listbox' ? 'option' : 'menuitem'} />\n {items[index + 1] && helpers.isItem(items[index + 1]) && (\n <StyledSeparator role='separator' />\n )}\n </Fragment>\n );\n });\n }\n\n if (!loading) {\n return <EmptyState message={emptyText} forwardedAs='li' />;\n }\n\n return null;\n }, [items, loading, emptyText]);\n\n const list = (\n <StyledMenuList id={expandedItem ? undefined : id} ref={ulRef} role={menuRole} {...restProps}>\n {parent && (\n <li role='presentation'>\n <MenuListHeader\n text={parent.item.primary}\n onClick={() => {\n setOpen(false);\n }}\n />\n </li>\n )}\n {listContent}\n {loading && !expandedItem && (\n <StyledLoadingItem>\n <Progress placement='local' />\n </StyledLoadingItem>\n )}\n </StyledMenuList>\n );\n\n return (\n <>\n <Drawer\n aria-hidden={!!expandedItem}\n as={StyledMenuListContainer}\n ref={selfRef}\n open={open}\n style={{ opacity: expandedItem ? 0 : 1 }}\n disabled={!!expandedItem}\n placement={end}\n onBeforeOpen={() => {\n if (parent) {\n parent.el.style.opacity = '0';\n }\n\n if (selfRef.current) {\n selfRef.current.style.opacity = '1';\n }\n }}\n onAfterOpen={() => {\n if (parent) {\n setParentDisabled(parent.el, true);\n }\n }}\n onBeforeClose={() => {\n if (parent && menuListWrapperRef.current) {\n setParentDisabled(parent.el, false);\n parent.el.style.opacity = '1';\n resizeRootEl(\n parent.el,\n menuListWrapperRef.current,\n parent.siblingItems.length + 1,\n scrollAt\n );\n }\n\n if (selfRef.current) {\n selfRef.current.style.opacity = '0';\n }\n }}\n onAfterClose={() => {\n if (parent) {\n focusControl?.focus();\n\n const expandBtn = parent.returnFocusRef.current;\n parent.setExpandedItem(undefined);\n\n if (expandBtn) {\n setFocusReturnEl(expandBtn?.closest('li'));\n }\n\n onItemCollapse?.(parent.item.id);\n updateActiveDescendants();\n }\n }}\n >\n {list}\n </Drawer>\n\n {expandedItem && selfRef.current && (\n <MenuList\n id={id}\n items={expandedItem.items}\n parent={{\n el: selfRef.current,\n item: expandedItem,\n siblingItems: items,\n setExpandedItem,\n returnFocusRef\n }}\n menuRole={menuRole}\n />\n )}\n </>\n );\n }\n);\n\nexport default MenuList;\n"]}
1	+ {"version":3,"file":"MenuList.js","sourceRoot":"","sources":["../../../src/components/Menu/MenuList.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n MutableRefObject,\n PropsWithoutRef,\n useContext,\n useEffect,\n useLayoutEffect,\n useRef,\n useState,\n useMemo,\n Fragment,\n useCallback,\n MouseEvent\n} from 'react';\n\nimport { ForwardProps } from '../../types';\nimport Drawer from '../Drawer';\nimport {\n useAfterInitialEffect,\n useConsolidatedRef,\n useItemIntersection,\n useDirection\n} from '../../hooks';\nimport Progress from '../Progress';\nimport EmptyState from '../EmptyState';\n\nimport type {\n AcceptedMouseEventElement,\n MenuListProps,\n ParentMenuItemProps,\n MenuItemProps\n} from './Menu.types';\nimport MenuContext from './Menu.context';\nimport MenuListHeader from './MenuListHeader';\nimport MenuItem from './MenuItem';\nimport helpers from './helpers';\nimport {\n StyledLoadingItem,\n StyledMenuList,\n StyledMenuListContainer,\n StyledSeparator\n} from './Menu.styles';\nimport { resizeRootEl } from './NavItemsList';\nimport MenuGroup from './MenuGroup';\n\nconst setParentDisabled = (fieldset: HTMLFieldSetElement, bool: boolean) => {\n fieldset.disabled = bool;\n const legendButton = fieldset.querySelector<HTMLButtonElement>('legend button');\n if (legendButton) {\n legendButton.disabled = bool;\n }\n};\n\nconst countVisibleItems = (menuItems: MenuListProps['items']): number => {\n return menuItems.reduce<number>((acc, item) => {\n const isFlatGroup = !helpers.isItem(item);\n if (isFlatGroup && item.items) {\n return acc + item.items.length + 1;\n }\n\n return acc + 1;\n }, 0);\n};\n\nconst MenuList: FunctionComponent<MenuListProps & ForwardProps> = forwardRef(\n (\n { items, parent, id, menuRole, ...restProps }: PropsWithoutRef<MenuListProps>,\n ref: MenuListProps['ref']\n ) => {\n const menuListWrapperRef: MutableRefObject<HTMLElement \| null> = useRef(null);\n const selfRef = useConsolidatedRef(ref);\n const ulRef = useRef<HTMLUListElement>(null);\n const returnFocusRef: MutableRefObject<HTMLButtonElement \| null> = useRef(null);\n const [open, setOpen] = useState(!parent);\n const [expandedItem, setExpandedItem] = useState<ParentMenuItemProps>();\n const {\n scrollAt,\n loadMore,\n loading,\n emptyText,\n currentItemId,\n onItemExpand,\n focusControl,\n updateActiveDescendants,\n setFocusReturnEl,\n onItemCollapse\n } = useContext(MenuContext);\n const { end } = useDirection();\n\n useItemIntersection(\n ulRef,\n items.length - 1,\n () => {\n if (!loading) loadMore?.(parent?.item?.id);\n },\n ':scope > li'\n );\n\n useLayoutEffect(() => {\n if (!selfRef.current \|\| expandedItem) return;\n menuListWrapperRef.current = selfRef.current.parentElement;\n resizeRootEl(\n selfRef.current,\n menuListWrapperRef.current as HTMLElement,\n countVisibleItems(items),\n scrollAt\n );\n });\n\n useEffect(() => {\n if (parent) setOpen(true);\n }, []);\n\n useAfterInitialEffect(() => {\n if (expandedItem) {\n setExpandedItem(items.find(item => item.id === expandedItem.id) as ParentMenuItemProps); // FIXME\n }\n }, [expandedItem, items]);\n\n useAfterInitialEffect(() => {\n if (currentItemId) {\n // if there is ancestor item of the controlled item, set it to expanded.\n const ancestor = items.find(\n item => item.items?.length && helpers.getItem(item.items, currentItemId) !== undefined\n );\n\n if (ancestor) {\n setExpandedItem(ancestor as ParentMenuItemProps);\n updateActiveDescendants({ preventScroll: true });\n }\n }\n }, [currentItemId, items, parent]);\n\n const onExpandCallback = useCallback(\n (itemId: MenuItemProps['id'], e: MouseEvent<AcceptedMouseEventElement>) => {\n const item = helpers.getItem(items, itemId);\n returnFocusRef.current = e.currentTarget as HTMLButtonElement;\n setExpandedItem(item as ParentMenuItemProps); // FIXME\n item?.onExpand?.(itemId, e);\n onItemExpand?.(itemId, e);\n updateActiveDescendants({ preventScroll: true });\n },\n [items]\n );\n\n const listContent = useMemo(() => {\n if (items.length) {\n return items.map((item, index) => {\n return helpers.isItem(item) ? (\n <MenuItem\n {...item}\n key={item.id}\n role={menuRole === 'listbox' ? 'option' : 'menuitem'}\n onExpand={item.items ? onExpandCallback : undefined}\n />\n ) : (\n <Fragment key={item.id}>\n <MenuGroup {...item} itemRole={menuRole === 'listbox' ? 'option' : 'menuitem'} />\n {items[index + 1] && helpers.isItem(items[index + 1]) && (\n <StyledSeparator role='separator' />\n )}\n </Fragment>\n );\n });\n }\n\n if (!loading) {\n return <EmptyState message={emptyText} forwardedAs='li' />;\n }\n\n return null;\n }, [items, loading, emptyText]);\n\n const list = (\n <StyledMenuList id={expandedItem ? undefined : id} ref={ulRef} role={menuRole} {...restProps}>\n {parent && (\n <li role='presentation'>\n <MenuListHeader\n text={parent.item.primary}\n onClick={() => {\n setOpen(false);\n }}\n />\n </li>\n )}\n {listContent}\n {loading && !expandedItem && (\n <StyledLoadingItem>\n <Progress placement='local' />\n </StyledLoadingItem>\n )}\n </StyledMenuList>\n );\n\n return (\n <>\n <Drawer\n aria-hidden={!!expandedItem}\n as={StyledMenuListContainer}\n ref={selfRef}\n open={open}\n style={{ opacity: expandedItem ? 0 : 1 }}\n disabled={!!expandedItem}\n placement={end}\n onBeforeOpen={() => {\n if (parent) {\n parent.el.style.opacity = '0';\n }\n\n if (selfRef.current) {\n selfRef.current.style.opacity = '1';\n }\n }}\n onAfterOpen={() => {\n if (parent) {\n setParentDisabled(parent.el, true);\n }\n }}\n onBeforeClose={() => {\n if (parent && menuListWrapperRef.current) {\n setParentDisabled(parent.el, false);\n parent.el.style.opacity = '1';\n resizeRootEl(\n parent.el,\n menuListWrapperRef.current,\n countVisibleItems(parent.siblingItems),\n scrollAt\n );\n }\n\n if (selfRef.current) {\n selfRef.current.style.opacity = '0';\n }\n }}\n onAfterClose={() => {\n if (parent) {\n focusControl?.focus();\n\n const expandBtn = parent.returnFocusRef.current;\n parent.setExpandedItem(undefined);\n\n if (expandBtn) {\n setFocusReturnEl(expandBtn?.closest('li'));\n }\n\n onItemCollapse?.(parent.item.id);\n updateActiveDescendants();\n }\n }}\n >\n {list}\n </Drawer>\n\n {expandedItem && selfRef.current && (\n <MenuList\n id={id}\n items={expandedItem.items}\n parent={{\n el: selfRef.current,\n item: expandedItem,\n siblingItems: items,\n setExpandedItem,\n returnFocusRef\n }}\n menuRole={menuRole}\n />\n )}\n </>\n );\n }\n);\n\nexport default MenuList;\n"]}

package/lib/components/Menu/NavItemsList.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavItemsList.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/NavItemsList.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY,QAClB,mBAAmB,WACf,WAAW,aACT,MAAM,YACP,MAAM,~~SAyBjB~~,CAAC;;;;AAEF,wBAAgC"}
1	+ {"version":3,"file":"NavItemsList.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/NavItemsList.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY,QAClB,mBAAmB,WACf,WAAW,aACT,MAAM,YACP,MAAM,SA6BjB,CAAC;;;;AAEF,wBAAgC"}

package/lib/components/Menu/NavItemsList.js CHANGED Viewed

@@ -1,13 +1,18 @@
 export const resizeRootEl = (ele, rootEle, itemCount, scrollAt) => {
     const hasLegend = !!ele.firstElementChild?.matches('legend');
-    const lastVisibleLI = ele.querySelectorAll(':scope > ul > li')[Math.max(Math.min(scrollAt - (hasLegend ? 2 : 1), itemCount - 1), 0)];
+    const selectors = [
+        'ul > li:not([role="separator"]):not([role="presentation"])',
+        'ul > li[role="presentation"] > div:first-child',
+        'ul > li > ul[role="group"] > li:not([role="separator"])'
+    ];
+    const lastVisibleLI = ele.querySelectorAll(selectors.join(', '))[Math.max(Math.min(scrollAt - (hasLegend ? 2 : 1), itemCount - 1), 0)];
     let menuRootElHeight;
     if (lastVisibleLI) {
         const containerTop = ele.getBoundingClientRect().top;
         const lastVisibleLIRect = lastVisibleLI.getBoundingClientRect();
         const ulScrollTop = ele.querySelector(':scope > ul')?.scrollTop ?? 0;
         let btm = lastVisibleLIRect.bottom;
-        if (itemCount >= scrollAt) {
+        if (itemCount > scrollAt) {
             btm = (lastVisibleLIRect.top + lastVisibleLIRect.bottom) / 2;
         }
         menuRootElHeight = btm - containerTop + ulScrollTop;

package/lib/components/Menu/NavItemsList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavItemsList.js","sourceRoot":"","sources":["../../../src/components/Menu/NavItemsList.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,YAAY,GAAG,CAC1B,GAAwB,EACxB,OAAoB,EACpB,SAAiB,EACjB,QAAgB,EAChB,EAAE;IACF,MAAM,SAAS,GAAG,CAAC,CAAC,GAAG,CAAC,iBAAiB,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;IAC7D,MAAM,aAAa,~~GACjB~~,GAAG,CAAC,gBAAgB,CAAC,~~kBAAkB~~,CAAC,~~CACtC~~,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,QAAQ,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,SAAS,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CACrE,CAAC;~~IAEJ~~,IAAI,gBAAoC,CAAC;IACzC,IAAI,aAAa,EAAE;QACjB,MAAM,YAAY,GAAG,GAAG,CAAC,qBAAqB,EAAE,CAAC,GAAG,CAAC;QACrD,MAAM,iBAAiB,GAAG,aAAa,CAAC,qBAAqB,EAAE,CAAC;QAChE,MAAM,WAAW,GAAG,GAAG,CAAC,aAAa,CAAC,aAAa,CAAC,EAAE,SAAS,IAAI,CAAC,CAAC;QAErE,IAAI,GAAG,GAAG,iBAAiB,CAAC,MAAM,CAAC;QACnC,IAAI,SAAS,~~IAAI~~,QAAQ,EAAE;~~YACzB~~,GAAG,GAAG,CAAC,iBAAiB,CAAC,GAAG,GAAG,iBAAiB,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;SAC9D;QAED,gBAAgB,GAAG,GAAG,GAAG,YAAY,GAAG,WAAW,CAAC;KACrD;IAED,qBAAqB,CAAC,GAAG,EAAE;QACzB,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,gBAAgB,CAAC,CAAC,CAAC,GAAG,gBAAgB,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;IACzE,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,eAAe,EAAE,YAAY,EAAE,CAAC","sourcesContent":["export const resizeRootEl = (\n ele: HTMLFieldSetElement,\n rootEle: HTMLElement,\n itemCount: number,\n scrollAt: number\n) => {\n const hasLegend = !!ele.firstElementChild?.matches('legend');\n const ~~lastVisibleLI~~ =\n ~~ele.querySelectorAll~~(':~~scope~~ > ul > li')[\n Math.max(Math.min(scrollAt - (hasLegend ? 2 : 1), itemCount - 1), 0)\n ];\n\n let menuRootElHeight: number \| undefined;\n if (lastVisibleLI) {\n const containerTop = ele.getBoundingClientRect().top;\n const lastVisibleLIRect = lastVisibleLI.getBoundingClientRect();\n const ulScrollTop = ele.querySelector(':scope > ul')?.scrollTop ?? 0;\n\n let btm = lastVisibleLIRect.bottom;\n if (itemCount >= scrollAt) {\n btm = (lastVisibleLIRect.top + lastVisibleLIRect.bottom) / 2;\n }\n\n menuRootElHeight = btm - containerTop + ulScrollTop;\n }\n\n requestAnimationFrame(() => {\n rootEle.style.height = menuRootElHeight ? `${menuRootElHeight}px` : '';\n });\n};\n\nexport default { resizeRootEl };\n"]}
1	+ {"version":3,"file":"NavItemsList.js","sourceRoot":"","sources":["../../../src/components/Menu/NavItemsList.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,YAAY,GAAG,CAC1B,GAAwB,EACxB,OAAoB,EACpB,SAAiB,EACjB,QAAgB,EAChB,EAAE;IACF,MAAM,SAAS,GAAG,CAAC,CAAC,GAAG,CAAC,iBAAiB,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;IAC7D,MAAM,SAAS,GAAG;QAChB,4DAA4D;QAC5D,gDAAgD;QAChD,yDAAyD;KAC1D,CAAC;IACF,MAAM,aAAa,GAAG,GAAG,CAAC,gBAAgB,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAC9D,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,QAAQ,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,SAAS,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CACrE,CAAC;IAEF,IAAI,gBAAoC,CAAC;IACzC,IAAI,aAAa,EAAE;QACjB,MAAM,YAAY,GAAG,GAAG,CAAC,qBAAqB,EAAE,CAAC,GAAG,CAAC;QACrD,MAAM,iBAAiB,GAAG,aAAa,CAAC,qBAAqB,EAAE,CAAC;QAChE,MAAM,WAAW,GAAG,GAAG,CAAC,aAAa,CAAC,aAAa,CAAC,EAAE,SAAS,IAAI,CAAC,CAAC;QAErE,IAAI,GAAG,GAAG,iBAAiB,CAAC,MAAM,CAAC;QACnC,IAAI,SAAS,GAAG,QAAQ,EAAE;YACxB,GAAG,GAAG,CAAC,iBAAiB,CAAC,GAAG,GAAG,iBAAiB,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;SAC9D;QAED,gBAAgB,GAAG,GAAG,GAAG,YAAY,GAAG,WAAW,CAAC;KACrD;IAED,qBAAqB,CAAC,GAAG,EAAE;QACzB,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,gBAAgB,CAAC,CAAC,CAAC,GAAG,gBAAgB,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;IACzE,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,eAAe,EAAE,YAAY,EAAE,CAAC","sourcesContent":["export const resizeRootEl = (\n ele: HTMLFieldSetElement,\n rootEle: HTMLElement,\n itemCount: number,\n scrollAt: number\n) => {\n const hasLegend = !!ele.firstElementChild?.matches('legend');\n const selectors = [\n 'ul > li:not([role=\"separator\"]):not([role=\"presentation\"])',\n 'ul > li[role=\"presentation\"] > div:first-child',\n 'ul > li > ul[role=\"group\"] > li:not([role=\"separator\"])'\n ];\n const lastVisibleLI = ele.querySelectorAll(selectors.join(', '))[\n Math.max(Math.min(scrollAt - (hasLegend ? 2 : 1), itemCount - 1), 0)\n ];\n\n let menuRootElHeight: number \| undefined;\n if (lastVisibleLI) {\n const containerTop = ele.getBoundingClientRect().top;\n const lastVisibleLIRect = lastVisibleLI.getBoundingClientRect();\n const ulScrollTop = ele.querySelector(':scope > ul')?.scrollTop ?? 0;\n\n let btm = lastVisibleLIRect.bottom;\n if (itemCount > scrollAt) {\n btm = (lastVisibleLIRect.top + lastVisibleLIRect.bottom) / 2;\n }\n\n menuRootElHeight = btm - containerTop + ulScrollTop;\n }\n\n requestAnimationFrame(() => {\n rootEle.style.height = menuRootElHeight ? `${menuRootElHeight}px` : '';\n });\n};\n\nexport default { resizeRootEl };\n"]}

package/lib/components/Menu/index.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 export { default } from './Menu';
-export { StyledMenuListWrapper, StyledMenuItem } from './Menu.styles';
+export { StyledMenuListWrapper, StyledMenuItem, StyledMenuListContainer } from './Menu.styles';
 export { MenuItemProps, MenuProps, MenuGroupProps } from './Menu.types';
 export { default as menuHelpers } from './helpers';
 //# sourceMappingURL=index.d.ts.map

package/lib/components/Menu/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACjC,OAAO,EAAE,qBAAqB,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;~~AACtE~~,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,WAAW,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACjC,OAAO,EAAE,qBAAqB,EAAE,cAAc,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAC/F,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,WAAW,CAAC"}

package/lib/components/Menu/index.js CHANGED Viewed

@@ -1,4 +1,4 @@
 export { default } from './Menu';
-export { StyledMenuListWrapper, StyledMenuItem } from './Menu.styles';
+export { StyledMenuListWrapper, StyledMenuItem, StyledMenuListContainer } from './Menu.styles';
 export { default as menuHelpers } from './helpers';
 //# sourceMappingURL=index.js.map

package/lib/components/Menu/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACjC,OAAO,EAAE,qBAAqB,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;~~AAEtE~~,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,WAAW,CAAC","sourcesContent":["export { default } from './Menu';\nexport { StyledMenuListWrapper, StyledMenuItem } from './Menu.styles';\nexport { MenuItemProps, MenuProps, MenuGroupProps } from './Menu.types';\nexport { default as menuHelpers } from './helpers';\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACjC,OAAO,EAAE,qBAAqB,EAAE,cAAc,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAE/F,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,WAAW,CAAC","sourcesContent":["export { default } from './Menu';\nexport { StyledMenuListWrapper, StyledMenuItem, StyledMenuListContainer } from './Menu.styles';\nexport { MenuItemProps, MenuProps, MenuGroupProps } from './Menu.types';\nexport { default as menuHelpers } from './helpers';\n"]}

package/lib/components/Number/NumberInput.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAQf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAW3C,OAAO,gBAA+C,MAAM,qBAAqB,CAAC;AAWlF,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,~~CA6MnE~~,CAAC;AAEF,eAAe,WAAW,CAAC"}
1	+ {"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAQf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAW3C,OAAO,gBAA+C,MAAM,qBAAqB,CAAC;AAWlF,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CA+MnE,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/lib/components/Number/NumberInput.js CHANGED Viewed

@@ -14,7 +14,7 @@ import { getCleanedValue, getDecimalSign, getDecrementedValue, getFormattedValue
 registerIcon(minusIcon, plusIcon);
 const NumberInput = forwardRef((props, ref) => {
     const uid = useUID();
-    const { id = uid, status, label, labelHidden, info, required, disabled, readOnly, value = '', onChange, onFocus, onBlur, onResolveSuggestion, unit, showDecimal = true, numberOfDecimals: numberOfDecimalsProp = NUMBER_MAX_DECIMAL_PLACES, showGroupSeparators = true, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER, step = 1, variant, 'aria-label': ariaLabel, ...restProps } = props;
+    const { id = uid, status, label, labelHidden, info, required, disabled, readOnly, additionalInfo, value = '', onChange, onFocus, onBlur, onResolveSuggestion, unit, showDecimal = true, numberOfDecimals: numberOfDecimalsProp = NUMBER_MAX_DECIMAL_PLACES, showGroupSeparators = true, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER, step = 1, variant, 'aria-label': ariaLabel, ...restProps } = props;
     const { locale } = useConfiguration();
     const inputRef = useConsolidatedRef(ref);
     const containerRef = useRef(null);
@@ -106,6 +106,7 @@ const NumberInput = forwardRef((props, ref) => {
             required,
             readOnly,
             disabled,
+            additionalInfo,
             onResolveSuggestion
         }, children: Comp })) : (Comp);
 });