@pega/cosmos-react-core 3.0.0-dev.21.0 → 3.0.0-dev.22.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/Configuration/Configuration.d.ts.map +1 -1
- package/lib/components/Configuration/Configuration.js +4 -3
- package/lib/components/Configuration/Configuration.js.map +1 -1
- package/lib/components/Configuration/index.d.ts +0 -1
- package/lib/components/Configuration/index.d.ts.map +1 -1
- package/lib/components/Configuration/index.js +0 -1
- package/lib/components/Configuration/index.js.map +1 -1
- package/lib/components/DateTime/Input/DateRangeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateRangeInput.js +1 -1
- package/lib/components/DateTime/Input/DateRangeInput.js.map +1 -1
- package/lib/components/DateTime/Input/DateTimeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateTimeInput.js +4 -3
- package/lib/components/DateTime/Input/DateTimeInput.js.map +1 -1
- package/lib/components/FormField/FormField.d.ts.map +1 -1
- package/lib/components/FormField/FormField.js +15 -15
- package/lib/components/FormField/FormField.js.map +1 -1
- package/lib/components/Link/Link.d.ts.map +1 -1
- package/lib/components/Link/Link.js +2 -4
- package/lib/components/Link/Link.js.map +1 -1
- package/lib/components/Modal/MinimizedModal.d.ts.map +1 -1
- package/lib/components/Modal/MinimizedModal.js +2 -5
- package/lib/components/Modal/MinimizedModal.js.map +1 -1
- package/lib/components/Modal/Modal.d.ts.map +1 -1
- package/lib/components/Modal/Modal.js +3 -5
- package/lib/components/Modal/Modal.js.map +1 -1
- package/lib/components/Modal/ModalManager.d.ts.map +1 -1
- package/lib/components/Modal/ModalManager.js +2 -11
- package/lib/components/Modal/ModalManager.js.map +1 -1
- package/lib/components/Modal/index.d.ts +0 -1
- package/lib/components/Modal/index.d.ts.map +1 -1
- package/lib/components/Modal/index.js +0 -1
- package/lib/components/Modal/index.js.map +1 -1
- package/lib/components/RadioCheck/RadioCheck.js +1 -1
- package/lib/components/RadioCheck/RadioCheck.js.map +1 -1
- package/lib/components/RadioCheckGroup/RadioCheckGroup.d.ts.map +1 -1
- package/lib/components/RadioCheckGroup/RadioCheckGroup.js +0 -1
- package/lib/components/RadioCheckGroup/RadioCheckGroup.js.map +1 -1
- package/lib/components/Toaster/Context.d.ts +7 -0
- package/lib/components/Toaster/Context.d.ts.map +1 -0
- package/lib/components/Toaster/Context.js +6 -0
- package/lib/components/Toaster/Context.js.map +1 -0
- package/lib/components/Toaster/Toaster.d.ts +3 -40
- package/lib/components/Toaster/Toaster.d.ts.map +1 -1
- package/lib/components/Toaster/Toaster.js +8 -8
- package/lib/components/Toaster/Toaster.js.map +1 -1
- package/lib/components/Toaster/Toaster.types.d.ts +31 -0
- package/lib/components/Toaster/Toaster.types.d.ts.map +1 -0
- package/lib/components/Toaster/Toaster.types.js +2 -0
- package/lib/components/Toaster/Toaster.types.js.map +1 -0
- package/lib/components/Toaster/index.d.ts +1 -2
- package/lib/components/Toaster/index.d.ts.map +1 -1
- package/lib/components/Toaster/index.js +0 -1
- package/lib/components/Toaster/index.js.map +1 -1
- package/lib/hooks/index.d.ts +3 -0
- package/lib/hooks/index.d.ts.map +1 -1
- package/lib/hooks/index.js +3 -0
- package/lib/hooks/index.js.map +1 -1
- package/lib/hooks/useConfiguration.d.ts +1 -0
- package/lib/hooks/useConfiguration.d.ts.map +1 -1
- package/lib/hooks/useConfiguration.js +9 -2
- package/lib/hooks/useConfiguration.js.map +1 -1
- package/lib/hooks/useModalContext.d.ts +7 -0
- package/lib/hooks/useModalContext.d.ts.map +1 -0
- package/lib/hooks/useModalContext.js +12 -0
- package/lib/hooks/useModalContext.js.map +1 -0
- package/lib/hooks/useModalManager.d.ts +8 -0
- package/lib/hooks/useModalManager.d.ts.map +1 -0
- package/lib/hooks/useModalManager.js +16 -0
- package/lib/hooks/useModalManager.js.map +1 -0
- package/lib/hooks/useToaster.d.ts +8 -0
- package/lib/hooks/useToaster.d.ts.map +1 -0
- package/lib/hooks/useToaster.js +16 -0
- package/lib/hooks/useToaster.js.map +1 -0
- package/lib/register-contexts.d.ts +2 -0
- package/lib/register-contexts.d.ts.map +1 -0
- package/lib/register-contexts.js +10 -0
- package/lib/register-contexts.js.map +1 -0
- package/package.json +4 -2
|
@@ -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';\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\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 & label,\n legend {\n align-self: center;\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 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 styledLabel = isRadioCheck ? (\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 {additionalInfo && (\n <AdditionalInfo heading={additionalInfo.heading}>{additionalInfo.content}</AdditionalInfo>\n )}\n </>\n ) : (\n <Flex container={{ justify: 'between' }}>\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 {additionalInfo && (\n <AdditionalInfo heading={additionalInfo.heading}>{additionalInfo.content}</AdditionalInfo>\n )}\n </Flex>\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":";AAAA,OAAO,EAIL,YAAY,EAEZ,SAAS,EACT,QAAQ,EAER,UAAU,EAEX,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAE/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,IAAmB,MAAM,SAAS,CAAC;AAC1C,OAAO,OAAO,MAAM,YAAY,CAAC;AAEjC,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAClE,OAAO,KAAK,EAAE,EAAc,WAAW,EAAE,MAAM,UAAU,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACjE,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACtD,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,aAAa,MAAM,+BAA+B,CAAC;AAC/D,OAAO,KAAK,iBAAiB,MAAM,oCAAoC,CAAC;AACxE,OAAO,KAAK,SAAS,MAAM,0BAA0B,CAAC;AACtD,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAE/C,YAAY,CAAC,aAAa,EAAE,iBAAiB,EAAE,SAAS,CAAC,CAAC;AAgE1D,MAAM,gBAAgB,GAAG,MAAM,CAAC,IAAI,CAAC,CACnC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE;IACpB,OAAO,GAAG,CAAA;;;eAGC,KAAK,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC,MAAM,CAAC,CAAC,cAAc,CAAC;;;KAGhE,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAC3C,CAAC,EACC,MAAM,EACN,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,OAAO,EAAE,EACjE,UAAU,EAAE,EAAE,YAAY,EAAE,SAAS,EAAE,EACxC,EACF,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,EAAE,YAAY,EAAE,GAAG,iBAAiB,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAErE,OAAO,GAAG,CAAA;;gCAEkB,OAAO;mBACpB,YAAY;;QAEvB,MAAM;QACR,SAAS,CAAC,MAAM,CAAC;QACjB,GAAG,CAAA;iBACQ,SAAS,CAAC,MAAM,CAAC,CAAC,cAAc,CAAC;OAC3C;KACF,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AAEpC,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAiB,KAAK,CAAC,EAAE;IAChE,MAAM,EACJ,QAAQ,EACR,QAAQ,EACR,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,OAAO,EAAE,EAAE,MAAM,EAAE,EACnB,kBAAkB,EAAE,eAAe,EACnC,OAAO,EACR,EACF,EACF,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;MACN,QAAQ;QACV,GAAG,CAAA;iBACU,eAAe;;;KAG3B;;;;QAIG,WAAW,OAAO,cAAc;mCACL,OAAO;;;QAGlC,WAAW,OAAO,cAAc,MAAM,WAAW;;mBAEtC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM;;;iBAG9B,MAAM;;;QAGf,QAAQ;QACV,GAAG,CAAA;;OAEF;;GAEJ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEhD,MAAM,sBAAsB,GAAG,MAAM,CAAC,MAAM,CAAC,CAC3C,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,WAAW,EAAE,QAAQ,EACrB,YAAY,EAAE,SAAS,EACvB,eAAe,EAAE,UAAU,EAC3B,OAAO,EACR,EACD,UAAU,EAAE,EACV,cAAc,EAAE,EAAE,eAAe,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,EAAE,EACxE,YAAY,EAAE,SAAS,EACxB,EACF,EACF,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,EAAE,cAAc,EAAE,GAAG,iBAAiB,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IACvE,MAAM,eAAe,GAAG,SAAS,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;IAC1D,MAAM,WAAW,GAAG,cAAc,CAAC,eAAe,CAAC,CAAC;IACpD,MAAM,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC,CAAC;IAC7D,MAAM,WAAW,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;IAErD,OAAO,GAAG,CAAA;0BACY,eAAe;eAC1B,KAAK;mBACD,cAAc;4BACL,OAAO;6BACN,OAAO;mBACjB,OAAO;;;;6BAIG,WAAW,UAAU,WAAW;wCACrB,UAAU,MAAM,MAAM;wCACtB,OAAO;;;sCAGT,UAAU,MAAM,MAAM;;;;4BAIhC,WAAW,CAAC,UAAU;;;;;;KAM7C,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,sBAAsB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEvD,MAAM,aAAa,GAAG,EAAE,KAAK,EAAE,YAAY,EAAE,OAAO,EAAE,iBAAiB,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC;AAE5F,MAAM,SAAS,GAAsC,UAAU,CAC7D,CAAC,KAAsC,EAAE,GAAqB,EAAE,EAAE;IAChE,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,EACJ,QAAQ,EAAE,cAAc,EACxB,EAAE,GAAG,GAAG,EACR,EAAE,GAAG,KAAK,EACV,KAAK,EACL,OAAO,GAAG,OAAO,EACjB,QAAQ,GAAG,EAAE,EACb,OAAO,EACP,WAAW,GAAG,KAAK,EACnB,UAAU,GAAG,KAAK,EAClB,IAAI,EACJ,MAAM,EACN,YAAY,EACZ,gBAAgB,EAChB,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,MAAM,GAAG,KAAK,EACd,OAAO,EACP,SAAS,EACT,cAAc,EACd,mBAAmB,EACnB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,aAAa,GAAY,OAAO,KAAK,QAAQ,CAAC;IACpD,MAAM,aAAa,GAAG,MAAM,KAAK,SAAS,IAAI,CAAC,CAAC,mBAAmB,CAAC;IACpE,MAAM,eAAe,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAEhD,MAAM,kBAAkB,GAAG,CAAC,CAAC,cAAc,IAAI,CAAC,QAAQ,IAAI,CAAC,WAAW,CAAC;IAEzE,MAAM,YAAY,GAAG,CACnB,8BACE,MAAC,KAAK,IACJ,EAAE,EAAE,OAAO,EACX,EAAE,EAAE,OAAO,EACX,OAAO,EAAE,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EACnD,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,CAAC,CAAa,EAAE,EAAE;oBACzB,IAAI,QAAQ;wBAAE,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnC,CAAC,EACD,MAAM,EAAE,MAAM,aAEb,MAAM,IAAI,MAAM,KAAK,SAAS,IAAI,CAAC,WAAW,IAAI,CACjD,KAAC,gBAAgB,IAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,GAAI,CAClE,EACA,KAAK,IACA,EACP,kBAAkB,IAAI,CACrB,KAAC,cAAc,IAAC,OAAO,EAAE,cAAc,CAAC,OAAO,YAAG,cAAc,CAAC,OAAO,GAAkB,CAC3F,IACA,CACJ,CAAC;IAEF,MAAM,QAAQ,GACZ,kBAAkB,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACpC,KAAC,IAAI,IACH,EAAE,EAAE,cAAc,EAClB,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,EACpD,IAAI,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,YAE7B,YAAY,GACR,CACR,CAAC,CAAC,CAAC,CACF,YAAY,CACb,CAAC;IAEJ;;;;;;;;MAQE;IACF,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAY,IAAI,CAAC,CAAC;IAEtE,SAAS,CAAC,GAAG,EAAE;QACb,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,0CAA0C;IAC1C,IAAI,OAAO,GAA+B,aAAa;QACrD,CAAC,CAAC,cAAc;QAChB,CAAC,CAAC,YAAY,CAAC,cAA8B,EAAE;YAC3C,kBAAkB,EAAE,IAAI,IAAI,GAAG,EAAE,OAAO;SACzC,CAAC,CAAC;IAEP,IAAI,OAAO,EAAE;QACX,OAAO,GAAG,CACR,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,EAAE,aAChD,OAAO,EACR,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,GAAI,IACjC,CACR,CAAC;KACH;IAED,IAAI,WAAW,GAAG,IAAI,CAAC,CAAC,CAAC;IACvB;;;;MAIE;IACF,KAAC,mBAAmB,IAClB,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,MAAM,KAAK,OAAO,IAAI,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EACtE,EAAE,EAAE,GAAG,EAAE,OAAO,YAEf,cAAc,GACK,CACvB,CAAC,CAAC,CAAC,SAAS,CAAC;IAEd,IAAI,gBAAgB,EAAE;QACpB,WAAW,GAAG,CACZ,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,CAAC,EAAE,aAClE,WAAW,EACZ,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,YAAG,gBAAgB,GAAQ,IAC/C,CACR,CAAC;KACH;IAED,IAAI,aAAa,EAAE;QACjB,MAAM,UAAU,GAAG,aAAa,CAAC,eAAe,CAAC,CAAC;QAClD,WAAW,GAAG,CACZ,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,aAC1D,MAAC,mBAAmB,IAAC,MAAM,EAAE,MAAM,EAAE,EAAE,EAAE,GAAG,EAAE,OAAO,aAClD,CAAC,CAAC,iBAAiB,CAAC,EACrB,KAAC,kBAAkB,iBAAW,QAAQ,YAAE,CAAC,CAAC,mBAAmB,CAAC,GAAsB,IAChE,EACtB,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,aACjC,KAAC,sBAAsB,IACrB,OAAO,EAAE,GAAG,EAAE;gCACZ,mBAAmB,CAAC,KAAK,CAAC,CAAC;gCAC3B,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC;4BACzB,CAAC,gBACW,CAAC,CAAC,+BAA+B,CAAC,YAE7C,CAAC,CAAC,IAAI,CAAC,GACe,EACzB,KAAC,sBAAsB,IACrB,OAAO,EAAE,GAAG,EAAE;gCACZ,mBAAmB,CAAC,IAAI,CAAC,CAAC;gCAC1B,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC;4BACzB,CAAC,gBACW,CAAC,CAAC,+BAA+B,CAAC,YAE7C,CAAC,CAAC,KAAK,CAAC,GACc,IACpB,IACF,CACR,CAAC;KACH;IAED,MAAM,SAAS,GAAG,CAAC,CAAgB,EAAE,EAAE;QACrC,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;YACrB,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAC;YACvC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;gBAC7B,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,mBAAmB,EAAE,CAAC,IAAI,CAAC,CAAC;aAC7B;SACF;IACH,CAAC,CAAC;IAEF,OAAO,CACL,MAAC,IAAI,OACC,SAAS,EACb,SAAS,EAAE;YACT,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ;YACpC,UAAU,EAAE,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;YACzC,GAAG,SAAS;SACb,EACD,EAAE,EAAE,eAAe,EACnB,EAAE,EAAE,GAAG,EAAE,QAAQ,EACjB,WAAW,EAAE,EAAE,EACf,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,sBAC9B,aAAa,IAAI,IAAI,CAAC,CAAC,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,EAClE,GAAG,EAAE,eAAe,aAEnB,CAAC,aAAa,IAAI,CAAC,UAAU,CAAC,IAAI,QAAQ,EAC1C,OAAO,EACP,CAAC,aAAa,IAAI,UAAU,IAAI,QAAQ,EACxC,WAAW,IACP,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,SAAS,CAAC","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"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,SAAS,EACT,iBAAiB,EACjB,GAAG,EAMJ,MAAM,OAAO,CAAC;AAIf,OAAe,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAGhD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,SAAS,EACT,iBAAiB,EACjB,GAAG,EAMJ,MAAM,OAAO,CAAC;AAIf,OAAe,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAGhD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAOtD,MAAM,WAAW,SAAU,SAAQ,SAAS;IAC1C,oCAAoC;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB,oCAAoC;IACpC,IAAI,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACjC;;;OAGG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,mFAAmF;IACnF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iFAAiF;IACjF,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC1C,6CAA6C;IAC7C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B;AAED,eAAO,MAAM,iBAAiB,yGAE7B,CAAC;AAIF,eAAO,MAAM,oBAAoB,oLAyC/B,CAAC;AAIH,eAAO,MAAM,UAAU,iJAAmB,CAAC;AAI3C,QAAA,MAAM,IAAI,EAAE,iBAAiB,CAAC,SAAS,GAAG,YAAY,CAkHrD,CAAC;AAEF,eAAe,IAAI,CAAC"}
|
|
@@ -6,10 +6,9 @@ import Button from '../Button';
|
|
|
6
6
|
import Popover from '../Popover';
|
|
7
7
|
import BareButton from '../Button/BareButton';
|
|
8
8
|
import { defaultThemeProp } from '../../theme';
|
|
9
|
-
import { useBreakpoint, useConsolidatedRef, useI18n, useUID } from '../../hooks';
|
|
9
|
+
import { useBreakpoint, useConsolidatedRef, useI18n, useUID, useModalContext } from '../../hooks';
|
|
10
10
|
import { tryCatch } from '../../utils';
|
|
11
11
|
import { calculateFontSize } from '../../styles';
|
|
12
|
-
import { ModalManagerContext } from '../Modal';
|
|
13
12
|
import AppShellContext from '../AppShell/AppShellContext';
|
|
14
13
|
export const StyledLinkPopover = styled.div `
|
|
15
14
|
background-color: ${props => props.theme.components.tooltip['background-color']};
|
|
@@ -60,8 +59,7 @@ StyledLinkPopoverBtn.defaultProps = defaultThemeProp;
|
|
|
60
59
|
export const StyledLink = styled(Button) ``;
|
|
61
60
|
StyledLink.defaultProps = defaultThemeProp;
|
|
62
61
|
const Link = forwardRef(({ href, variant = 'link', previewable, onPreview, ...restProps }, ref) => {
|
|
63
|
-
const {
|
|
64
|
-
const { initialized: inModal } = useContext(ModalContext);
|
|
62
|
+
const { initialized: inModal } = useModalContext();
|
|
65
63
|
const { previewTriggerRef } = useContext(AppShellContext);
|
|
66
64
|
const uid = useUID();
|
|
67
65
|
const linkRef = useConsolidatedRef(ref);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n ReactNode,\n FunctionComponent,\n Ref,\n PropsWithoutRef,\n useState,\n useRef,\n KeyboardEvent,\n useContext\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport Button, { ButtonProps } from '../Button';\nimport Popover from '../Popover';\nimport BareButton from '../Button/BareButton';\nimport { BaseProps, ForwardProps } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { useBreakpoint, useConsolidatedRef, useI18n, useUID } from '../../hooks';\nimport { tryCatch } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport { ModalManagerContext } from '../Modal';\nimport AppShellContext from '../AppShell/AppShellContext';\n\nexport interface LinkProps extends BaseProps {\n /** Text or content for the Link. */\n children: ReactNode;\n /** URL or DOM id to navigate to. */\n href: string;\n /**\n * Controls the styling of the Link.\n * @default \"link\"\n */\n variant?: ButtonProps['variant'];\n /**\n * Set the Icon prop to `true` if you're using just an Icon in your Link. Make sure to pass an Icon as children if `true`.\n * @default false\n */\n icon?: ButtonProps['icon'];\n /** Determines if the Link should render a popover when focused or hovered over. */\n previewable?: boolean;\n /** Callback function that is run when the preview popover is interacted with. */\n onPreview?: (e: { href: string }) => void;\n /** Specifies where to open the link href. */\n target?: string;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLAnchorElement>;\n}\n\nexport const StyledLinkPopover = styled.div`\n background-color: ${props => props.theme.components.tooltip['background-color']};\n`;\n\nStyledLinkPopover.defaultProps = defaultThemeProp;\n\nexport const StyledLinkPopoverBtn = styled(BareButton)(({ theme }) => {\n const contrastColor = tryCatch(() => readableColor(theme.base.palette.interactive));\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n position: relative;\n display: inline-flex;\n align-items: center;\n z-index: 1;\n padding: 0 ${theme.base.spacing};\n min-height: 1.5rem;\n line-height: 1;\n color: ${contrastColor};\n font-size: ${fontSize.xs};\n text-decoration: none;\n\n /* FIXME: Button selector specificity... */\n & + & {\n margin: 0;\n }\n\n & + &::before {\n content: '';\n position: absolute;\n inset-inline-start: 0;\n inset-block: 0;\n width: 1px; /* stylelint-disable-line unit-allowed-list */\n background-color: ${contrastColor};\n opacity: ${theme.base.transparency['transparent-3']};\n }\n\n &:hover,\n &:active {\n text-decoration: underline;\n }\n\n &:focus {\n box-shadow: inset 0 0 0 0.0625rem ${theme.base.palette.light},\n 0 0 0.125rem 0.0625rem ${theme.base.palette.interactive};\n }\n `;\n});\n\nStyledLinkPopoverBtn.defaultProps = defaultThemeProp;\n\nexport const StyledLink = styled(Button)``;\n\nStyledLink.defaultProps = defaultThemeProp;\n\nconst Link: FunctionComponent<LinkProps & ForwardProps> = forwardRef(\n (\n { href, variant = 'link', previewable, onPreview, ...restProps }: PropsWithoutRef<LinkProps>,\n ref: LinkProps['ref']\n ) => {\n const { ModalContext } = useContext(ModalManagerContext);\n const { initialized: inModal } = useContext(ModalContext);\n const { previewTriggerRef } = useContext(AppShellContext);\n const uid = useUID();\n const linkRef = useConsolidatedRef(ref);\n const [popover, setPopover] = useState(false);\n const previewBtnRef = useRef<HTMLButtonElement>(null);\n const openInTabBtnRef = useRef<HTMLAnchorElement>(null);\n const isSmallOrAbove = useBreakpoint('sm');\n const t = useI18n();\n\n const openPopover = () => {\n if (isSmallOrAbove) setPopover(true);\n };\n\n const closePopover = () => {\n setPopover(false);\n };\n\n const onKeyUp = (event: KeyboardEvent) => {\n if (event.keyCode === 27) {\n closePopover();\n }\n\n if (event.keyCode === 38 || event.keyCode === 40) {\n previewBtnRef?.current?.focus();\n }\n\n if (event.keyCode === 37 || event.keyCode === 39) {\n if (previewBtnRef.current === document.activeElement) {\n openInTabBtnRef?.current?.focus();\n } else {\n previewBtnRef?.current?.focus();\n }\n }\n };\n\n const onEnterLink = () => {\n if (previewable) openPopover();\n };\n\n const onPreviewClick = () => {\n previewTriggerRef.current = linkRef.current;\n onPreview?.({ href });\n };\n\n return (\n <>\n <StyledLink\n href={href}\n variant={variant}\n ref={linkRef as any}\n {...restProps}\n onMouseEnter={onEnterLink}\n onMouseLeave={closePopover}\n onFocus={onEnterLink}\n onKeyUp={onKeyUp}\n onBlur={closePopover}\n aria-describedby={previewable ? `${uid}-preview-instructions` : undefined}\n />\n\n <Popover\n show={popover}\n groupId='link_preview'\n showDelay='short'\n hideDelay='short'\n placement='bottom'\n target={linkRef.current}\n onMouseEnter={openPopover}\n onMouseLeave={closePopover}\n as={StyledLinkPopover}\n arrow\n >\n {!inModal && (\n <StyledLinkPopoverBtn\n preview\n type='button'\n ref={previewBtnRef}\n onClick={onPreviewClick}\n tabIndex='-1'\n onFocus={openPopover}\n onBlur={closePopover}\n onKeyUp={onKeyUp}\n >\n {t('preview')}\n </StyledLinkPopoverBtn>\n )}\n <StyledLinkPopoverBtn\n forwardedAs='a'\n href={href}\n ref={openInTabBtnRef}\n target='_blank'\n rel='noreferrer'\n tabIndex='-1'\n onFocus={openPopover}\n onBlur={closePopover}\n onKeyUp={onKeyUp}\n >\n {t('link_open_in_tab_text')}\n </StyledLinkPopoverBtn>\n </Popover>\n\n {previewable && (\n <span id={`${uid}-preview-instructions`} hidden>\n {t('preview_link_arrow_navigation')}\n </span>\n )}\n </>\n );\n }\n);\n\nexport default Link;\n"]}
|
|
1
|
+
{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n ReactNode,\n FunctionComponent,\n Ref,\n PropsWithoutRef,\n useState,\n useRef,\n KeyboardEvent,\n useContext\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport Button, { ButtonProps } from '../Button';\nimport Popover from '../Popover';\nimport BareButton from '../Button/BareButton';\nimport { BaseProps, ForwardProps } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { useBreakpoint, useConsolidatedRef, useI18n, useUID, useModalContext } from '../../hooks';\nimport { tryCatch } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport AppShellContext from '../AppShell/AppShellContext';\n\nexport interface LinkProps extends BaseProps {\n /** Text or content for the Link. */\n children: ReactNode;\n /** URL or DOM id to navigate to. */\n href: string;\n /**\n * Controls the styling of the Link.\n * @default \"link\"\n */\n variant?: ButtonProps['variant'];\n /**\n * Set the Icon prop to `true` if you're using just an Icon in your Link. Make sure to pass an Icon as children if `true`.\n * @default false\n */\n icon?: ButtonProps['icon'];\n /** Determines if the Link should render a popover when focused or hovered over. */\n previewable?: boolean;\n /** Callback function that is run when the preview popover is interacted with. */\n onPreview?: (e: { href: string }) => void;\n /** Specifies where to open the link href. */\n target?: string;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLAnchorElement>;\n}\n\nexport const StyledLinkPopover = styled.div`\n background-color: ${props => props.theme.components.tooltip['background-color']};\n`;\n\nStyledLinkPopover.defaultProps = defaultThemeProp;\n\nexport const StyledLinkPopoverBtn = styled(BareButton)(({ theme }) => {\n const contrastColor = tryCatch(() => readableColor(theme.base.palette.interactive));\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n position: relative;\n display: inline-flex;\n align-items: center;\n z-index: 1;\n padding: 0 ${theme.base.spacing};\n min-height: 1.5rem;\n line-height: 1;\n color: ${contrastColor};\n font-size: ${fontSize.xs};\n text-decoration: none;\n\n /* FIXME: Button selector specificity... */\n & + & {\n margin: 0;\n }\n\n & + &::before {\n content: '';\n position: absolute;\n inset-inline-start: 0;\n inset-block: 0;\n width: 1px; /* stylelint-disable-line unit-allowed-list */\n background-color: ${contrastColor};\n opacity: ${theme.base.transparency['transparent-3']};\n }\n\n &:hover,\n &:active {\n text-decoration: underline;\n }\n\n &:focus {\n box-shadow: inset 0 0 0 0.0625rem ${theme.base.palette.light},\n 0 0 0.125rem 0.0625rem ${theme.base.palette.interactive};\n }\n `;\n});\n\nStyledLinkPopoverBtn.defaultProps = defaultThemeProp;\n\nexport const StyledLink = styled(Button)``;\n\nStyledLink.defaultProps = defaultThemeProp;\n\nconst Link: FunctionComponent<LinkProps & ForwardProps> = forwardRef(\n (\n { href, variant = 'link', previewable, onPreview, ...restProps }: PropsWithoutRef<LinkProps>,\n ref: LinkProps['ref']\n ) => {\n const { initialized: inModal } = useModalContext();\n const { previewTriggerRef } = useContext(AppShellContext);\n const uid = useUID();\n const linkRef = useConsolidatedRef(ref);\n const [popover, setPopover] = useState(false);\n const previewBtnRef = useRef<HTMLButtonElement>(null);\n const openInTabBtnRef = useRef<HTMLAnchorElement>(null);\n const isSmallOrAbove = useBreakpoint('sm');\n const t = useI18n();\n\n const openPopover = () => {\n if (isSmallOrAbove) setPopover(true);\n };\n\n const closePopover = () => {\n setPopover(false);\n };\n\n const onKeyUp = (event: KeyboardEvent) => {\n if (event.keyCode === 27) {\n closePopover();\n }\n\n if (event.keyCode === 38 || event.keyCode === 40) {\n previewBtnRef?.current?.focus();\n }\n\n if (event.keyCode === 37 || event.keyCode === 39) {\n if (previewBtnRef.current === document.activeElement) {\n openInTabBtnRef?.current?.focus();\n } else {\n previewBtnRef?.current?.focus();\n }\n }\n };\n\n const onEnterLink = () => {\n if (previewable) openPopover();\n };\n\n const onPreviewClick = () => {\n previewTriggerRef.current = linkRef.current;\n onPreview?.({ href });\n };\n\n return (\n <>\n <StyledLink\n href={href}\n variant={variant}\n ref={linkRef as any}\n {...restProps}\n onMouseEnter={onEnterLink}\n onMouseLeave={closePopover}\n onFocus={onEnterLink}\n onKeyUp={onKeyUp}\n onBlur={closePopover}\n aria-describedby={previewable ? `${uid}-preview-instructions` : undefined}\n />\n\n <Popover\n show={popover}\n groupId='link_preview'\n showDelay='short'\n hideDelay='short'\n placement='bottom'\n target={linkRef.current}\n onMouseEnter={openPopover}\n onMouseLeave={closePopover}\n as={StyledLinkPopover}\n arrow\n >\n {!inModal && (\n <StyledLinkPopoverBtn\n preview\n type='button'\n ref={previewBtnRef}\n onClick={onPreviewClick}\n tabIndex='-1'\n onFocus={openPopover}\n onBlur={closePopover}\n onKeyUp={onKeyUp}\n >\n {t('preview')}\n </StyledLinkPopoverBtn>\n )}\n <StyledLinkPopoverBtn\n forwardedAs='a'\n href={href}\n ref={openInTabBtnRef}\n target='_blank'\n rel='noreferrer'\n tabIndex='-1'\n onFocus={openPopover}\n onBlur={closePopover}\n onKeyUp={onKeyUp}\n >\n {t('link_open_in_tab_text')}\n </StyledLinkPopoverBtn>\n </Popover>\n\n {previewable && (\n <span id={`${uid}-preview-instructions`} hidden>\n {t('preview_link_arrow_navigation')}\n </span>\n )}\n </>\n );\n }\n);\n\nexport default Link;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MinimizedModal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/MinimizedModal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,
|
|
1
|
+
{"version":3,"file":"MinimizedModal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/MinimizedModal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAiB,MAAM,OAAO,CAAC;AAUzD,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAI3C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAqC3C,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,UAAU,GAAG,YAAY,CAuFhE,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { useContext } from 'react';
|
|
3
2
|
import styled, { css } from 'styled-components';
|
|
4
3
|
import Button from '../Button';
|
|
5
4
|
import BareRoleButton from '../Button/BareRoleButton';
|
|
@@ -9,8 +8,7 @@ import * as minusIcon from '../Icon/icons/minus.icon';
|
|
|
9
8
|
import * as undockIcon from '../Icon/icons/undock.icon';
|
|
10
9
|
import { defaultThemeProp } from '../../theme';
|
|
11
10
|
import Flex from '../Flex';
|
|
12
|
-
import { useI18n } from '../../hooks';
|
|
13
|
-
import { ModalManagerContext } from './Contexts';
|
|
11
|
+
import { useI18n, useModalContext } from '../../hooks';
|
|
14
12
|
registerIcon(timesIcon, minusIcon, undockIcon);
|
|
15
13
|
const StyledMinimizedModal = styled(BareRoleButton)(({ theme: { base } }) => {
|
|
16
14
|
return css `
|
|
@@ -44,8 +42,7 @@ const StyledMinimizedModal = styled(BareRoleButton)(({ theme: { base } }) => {
|
|
|
44
42
|
});
|
|
45
43
|
StyledMinimizedModal.defaultProps = defaultThemeProp;
|
|
46
44
|
const MinimizedModal = ({ heading, onBeforeClose, onAfterClose, onRequestDismiss, onRequestActivate, onRequestMinimize, onRequestMaximize, onRequestDock, ...restProps }) => {
|
|
47
|
-
const {
|
|
48
|
-
const { dismissible, dockable, maximizable, dock, maximize, activate, unmount } = useContext(ModalContext);
|
|
45
|
+
const { dismissible, dockable, maximizable, dock, maximize, activate, unmount } = useModalContext();
|
|
49
46
|
const t = useI18n();
|
|
50
47
|
return (_jsxs(Flex, { ...restProps, container: { alignItems: 'center', justify: 'between', pad: [0, 2], gap: 2 }, item: { shrink: 0 }, as: StyledMinimizedModal, "aria-label": `${t('activate')} ${heading}`, onKeyDown: (e) => {
|
|
51
48
|
// Prevent issues when auto focusing on close button.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MinimizedModal.js","sourceRoot":"","sources":["../../../src/components/Modal/MinimizedModal.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"MinimizedModal.js","sourceRoot":"","sources":["../../../src/components/Modal/MinimizedModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, KeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport BareRoleButton from '../Button/BareRoleButton';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport * as undockIcon from '../Icon/icons/undock.icon';\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\nimport Flex from '../Flex';\nimport { useI18n, useModalContext } from '../../hooks';\n\nimport { ModalProps } from './Modal.types';\n\nregisterIcon(timesIcon, minusIcon, undockIcon);\n\nconst StyledMinimizedModal = styled(BareRoleButton)(({ theme: { base } }) => {\n return css`\n height: 3rem;\n width: 30ch;\n border-radius: calc(0.5 * ${base['border-radius']}) calc(0.5 * ${base['border-radius']}) 0 0;\n color: ${base.palette['foreground-color']};\n background-color: ${base.palette['primary-background']};\n box-shadow: ${base.shadow.low};\n cursor: pointer;\n user-select: none;\n pointer-events: auto;\n transition: box-shadow ${base.animation.speed} ${base.animation.timing.ease};\n\n &:hover {\n box-shadow: ${base.shadow.high};\n }\n\n &:focus {\n outline: none;\n box-shadow: ${base.shadow.focus};\n }\n\n > div:first-child {\n margin-inline-end: auto;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n `;\n});\n\nStyledMinimizedModal.defaultProps = defaultThemeProp;\n\nconst MinimizedModal: FunctionComponent<ModalProps & ForwardProps> = ({\n heading,\n onBeforeClose,\n onAfterClose,\n onRequestDismiss,\n onRequestActivate,\n onRequestMinimize,\n onRequestMaximize,\n onRequestDock,\n ...restProps\n}) => {\n const { dismissible, dockable, maximizable, dock, maximize, activate, unmount } =\n useModalContext();\n\n const t = useI18n();\n\n return (\n <Flex\n {...restProps}\n container={{ alignItems: 'center', justify: 'between', pad: [0, 2], gap: 2 }}\n item={{ shrink: 0 }}\n as={StyledMinimizedModal}\n aria-label={`${t('activate')} ${heading}`}\n onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\n // Prevent issues when auto focusing on close button.\n if ((e.key === 'Space' || e.key === 'Enter') && e.target === e.currentTarget)\n e.preventDefault();\n }}\n onClick={() => {\n if (onRequestActivate?.() !== false && !dockable) activate();\n if (onRequestDock?.() !== false && dockable) dock();\n }}\n >\n <div>{heading}</div>\n\n {(maximizable || dockable || dismissible) && (\n <Flex container>\n {maximizable && (\n <Button\n icon\n variant='simple'\n aria-label={t('modal_maximize')}\n onClick={() => {\n if (onRequestMaximize?.() !== false) {\n maximize();\n }\n }}\n >\n <Icon name='undock' />\n </Button>\n )}\n\n {dockable && (\n <Button\n aria-label={t('modal_dock')}\n variant='simple'\n onClick={() => {\n if (onRequestDock?.() !== false) {\n dock();\n }\n }}\n icon\n >\n <Icon name='minus' />\n </Button>\n )}\n\n {dismissible && (\n <Button\n aria-label={`${t('close')} ${heading}`}\n variant='simple'\n onClick={() => {\n if (onRequestDismiss?.() !== false) {\n onBeforeClose?.();\n unmount();\n onAfterClose?.();\n }\n }}\n icon\n >\n <Icon name='times' />\n </Button>\n )}\n </Flex>\n )}\n </Flex>\n );\n};\n\nexport default MinimizedModal;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,
|
|
1
|
+
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAQlB,MAAM,OAAO,CAAC;AAOf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAoB3C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAWhD,QAAA,MAAM,KAAK,EAAE,iBAAiB,CAAC,UAAU,GAAG,YAAY,CAwRvD,CAAC;AAEF,eAAe,KAAK,CAAC"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { forwardRef,
|
|
2
|
+
import { forwardRef, useEffect, useRef, useCallback } from 'react';
|
|
3
3
|
import Progress from '../Progress';
|
|
4
4
|
import { getFocusables } from '../../utils';
|
|
5
5
|
import Backdrop from '../Backdrop';
|
|
6
6
|
import Flex from '../Flex';
|
|
7
7
|
import Button from '../Button';
|
|
8
|
-
import { useAfterInitialEffect, useConsolidatedRef, useI18n, useOuterEvent, useUID, useFocusTrap, usePrevious } from '../../hooks';
|
|
8
|
+
import { useAfterInitialEffect, useConsolidatedRef, useI18n, useOuterEvent, useUID, useFocusTrap, usePrevious, useModalContext } from '../../hooks';
|
|
9
9
|
import Icon, { registerIcon } from '../Icon';
|
|
10
10
|
import * as timesIcon from '../Icon/icons/times.icon';
|
|
11
11
|
import * as minusIcon from '../Icon/icons/minus.icon';
|
|
@@ -13,14 +13,12 @@ import * as dockIcon from '../Icon/icons/dock.icon';
|
|
|
13
13
|
import * as undockIcon from '../Icon/icons/undock.icon';
|
|
14
14
|
import Text from '../Text';
|
|
15
15
|
import { Count } from '../Badges';
|
|
16
|
-
import { ModalManagerContext } from './Contexts';
|
|
17
16
|
import MinimizedModal from './MinimizedModal';
|
|
18
17
|
import { StyledModal, StyledModalHeader, StyledModalContent, StyledModalActions, StyledModalChildrenWrap } from './Modal.styles';
|
|
19
18
|
registerIcon(timesIcon, minusIcon, dockIcon, undockIcon);
|
|
20
19
|
const Modal = forwardRef((props, ref) => {
|
|
21
20
|
const { as, progress = false, heading, count, children, actions, stretch = false, center = false, defaultFocus, onBeforeOpen, onAfterOpen, onBeforeClose, onAfterClose, onRequestDismiss, onRequestMinimize, onRequestMaximize, onRequestDock, onRequestActivate, ...restProps } = props;
|
|
22
|
-
const {
|
|
23
|
-
const { alert, dismissible, minimizable, maximizable, dockable, state, dismiss, minimize, maximize, dock, unmount, top } = useContext(ModalContext);
|
|
21
|
+
const { alert, dismissible, minimizable, maximizable, dockable, state, dismiss, minimize, maximize, dock, unmount, top } = useModalContext();
|
|
24
22
|
const modalRef = useConsolidatedRef(ref);
|
|
25
23
|
const modalContentRef = useRef(null);
|
|
26
24
|
const backdropRef = useRef(null);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EAIV,UAAU,EACV,SAAS,EAET,MAAM,EACN,WAAW,EAEZ,MAAM,OAAO,CAAC;AAEf,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,MAAM,MAAM,WAAW,CAAC;AAE/B,OAAO,EACL,qBAAqB,EACrB,kBAAkB,EAClB,OAAO,EACP,aAAa,EACb,MAAM,EACN,YAAY,EACZ,WAAW,EACZ,MAAM,aAAa,CAAC;AACrB,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,SAAS,MAAM,0BAA0B,CAAC;AACtD,OAAO,KAAK,SAAS,MAAM,0BAA0B,CAAC;AACtD,OAAO,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACpD,OAAO,KAAK,UAAU,MAAM,2BAA2B,CAAC;AACxD,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAElC,OAAO,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAE9C,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,uBAAuB,EACxB,MAAM,gBAAgB,CAAC;AAExB,YAAY,CAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC;AAEzD,MAAM,KAAK,GAAiD,UAAU,CACpE,CAAC,KAAkC,EAAE,GAAqB,EAAE,EAAE;IAC5D,MAAM,EACJ,EAAE,EACF,QAAQ,GAAG,KAAK,EAChB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,OAAO,EACP,OAAO,GAAG,KAAK,EACf,MAAM,GAAG,KAAK,EACd,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,aAAa,EACb,YAAY,EACZ,gBAAgB,EAChB,iBAAiB,EACjB,iBAAiB,EACjB,aAAa,EACb,iBAAiB,EACjB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,EAAE,YAAY,EAAE,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IACzD,MAAM,EACJ,KAAK,EACL,WAAW,EACX,WAAW,EACX,WAAW,EACX,QAAQ,EACR,KAAK,EACL,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,GAAG,EACJ,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IAE7B,MAAM,QAAQ,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IACzC,MAAM,eAAe,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACrD,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACjD,MAAM,cAAc,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IACvD,MAAM,aAAa,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IACzC,MAAM,EAAE,GAAG,MAAM,EAAE,CAAC;IACpB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,IAAI,gBAAgB,EAAE,EAAE,KAAK,KAAK,EAAE;YAClC,OAAO,EAAE,CAAC;SACX;IACH,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,GAAG,EAAE;QACpB,MAAM,UAAU,GAAG,aAAa,CAAC,QAAQ,CAAC,CAAC;QAE3C,IAAI,YAAY,EAAE,OAAO,EAAE;YACzB,YAAY,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SAC9B;aAAM;YACL,MAAM,SAAS,GACb,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE;gBACnB,OAAO,eAAe,CAAC,OAAO,EAAE,QAAQ,CAAC,EAAE,CAAC,CAAC;YAC/C,CAAC,CAAC;gBACF,cAAc,CAAC,OAAO;gBACtB,UAAU,CAAC,CAAC,CAAC,CAAC;YAEhB,SAAS,EAAE,KAAK,EAAE,CAAC;SACpB;IACH,CAAC,CAAC;IAEF,YAAY,CAAC,QAAQ,CAAC,CAAC;IAEvB,aAAa,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE;QACzC,IAAI,CAAC,WAAW,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC;YAAE,OAAO;QAE9D,IAAI,WAAW,EAAE;YACf,IAAI,CAAC,CAAC,MAAM,KAAK,WAAW,CAAC,OAAO,EAAE;gBACpC,UAAU,EAAE,CAAC;aACd;SACF;aAAM;YACL,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;SAC3B;IACH,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK,KAAK,WAAW;YAAE,OAAO;QAClC,IAAI,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,WAAW,IAAI,KAAK,KAAK,QAAQ;YAAE,QAAQ,EAAE,CAAC;QAEhF,4EAA4E;QAC5E,IAAI,KAAK,KAAK,QAAQ,IAAI,aAAa,KAAK,QAAQ,EAAE;YACpD,aAAa,EAAE,EAAE,CAAC;YAClB,OAAO,EAAE,CAAC;YACV,YAAY,EAAE,EAAE,CAAC;SAClB;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,SAAS,CAAC,GAAG,EAAE;QACb;;;;WAIG;QACH,IAAI,KAAK,KAAK,QAAQ,EAAE;YACtB,aAAa,EAAE,EAAE,CAAC;YAClB,OAAO,EAAE,CAAC;YACV,YAAY,EAAE,EAAE,CAAC;SAClB;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,0HAA0H;IAC1H,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,CAAqB,EAAE,EAAE;QACxB,IACE,WAAW;YACX,CAAC,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,WAAW,CAAC;YAC3C,CAAC,CAAC,GAAG,KAAK,QAAQ;YAClB,GAAG,EACH;YACA,UAAU,EAAE,CAAC;SACd;IACH,CAAC,EACD,CAAC,WAAW,EAAE,KAAK,EAAE,GAAG,EAAE,UAAU,CAAC,CACtC,CAAC;IAEF,MAAM,qBAAqB,GAAG,WAAW,CAAC,CAAC,CAAwC,EAAE,EAAE;QACrF,IAAI,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC;YAAE,CAAC,CAAC,cAAc,EAAE,CAAC;IAC3E,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,6FAA6F;IAC7F,MAAM,qBAAqB,GAAG,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IACjD,qBAAqB,CAAC,GAAG,EAAE;QACzB,0EAA0E;QAC1E,IAAI,CAAC,QAAQ,IAAI,qBAAqB,CAAC,OAAO,EAAE;YAC9C,QAAQ,EAAE,CAAC;YACX,qBAAqB,CAAC,OAAO,GAAG,KAAK,CAAC;SACvC;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,SAAS,GAAG,OAAO,IAAI,KAAK,KAAK,WAAW,CAAC;IAEnD,MAAM,KAAK,GAAG,CACZ,MAAC,IAAI,OACC,SAAS,EACb,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAClC,GAAG,EAAE,QAAQ,EACb,EAAE,EAAE,WAAW,EACf,WAAW,EAAE,EAAE,EACf,OAAO,EAAE,CAAC,CAAa,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EAC/C,SAAS,EAAE,cAAc,EACzB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,QAAQ,EACtC,OAAO,EAAE,SAAS,EAClB,MAAM,EAAE,MAAM,qBACG,GAAG,EAAE,UAAU,gBACpB,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EACjD,KAAK,EAAE,KAAK,eAEF,QAAQ,eACP,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,aAEtC,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAC/D,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EACnB,EAAE,EAAE,iBAAiB,EACrB,SAAS,EAAE,WAAW,IAAI,WAAW,aAErC,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAC3C,EAAE,EAAE,IAAI,EACR,OAAO,EAAC,IAAI,EACZ,EAAE,EAAE,GAAG,EAAE,UAAU,aAEnB,yBAAO,OAAO,GAAQ,EACrB,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAC,KAAK,cAAE,KAAK,GAAS,IAC/C,EAEP,MAAC,IAAI,IAAC,SAAS,mBACZ,WAAW,IAAI,CAAC,KAAK,IAAI,KAAK,KAAK,WAAW,IAAI,CACjD,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,gBACJ,CAAC,CAAC,gBAAgB,CAAC,EAC/B,SAAS,EAAE,qBAAqB,EAChC,OAAO,EAAE,GAAG,EAAE;oCACZ,IAAI,iBAAiB,EAAE,EAAE,KAAK,KAAK,EAAE;wCACnC,QAAQ,EAAE,CAAC;qCACZ;gCACH,CAAC,YAED,KAAC,IAAI,IAAC,IAAI,EAAC,QAAQ,GAAG,GACf,CACV,EACA,QAAQ,IAAI,CAAC,KAAK,IAAI,KAAK,KAAK,QAAQ,IAAI,CAC3C,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,gBACJ,CAAC,CAAC,YAAY,CAAC,EAC3B,SAAS,EAAE,qBAAqB,EAChC,OAAO,EAAE,GAAG,EAAE;oCACZ,IAAI,aAAa,EAAE,EAAE,KAAK,KAAK,EAAE;wCAC/B,IAAI,EAAE,CAAC;qCACR;gCACH,CAAC,YAED,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,GACb,CACV,EACA,WAAW,IAAI,CAAC,KAAK,IAAI,CACxB,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,gBACJ,CAAC,CAAC,gBAAgB,CAAC,EAC/B,SAAS,EAAE,qBAAqB,EAChC,OAAO,EAAE,GAAG,EAAE;oCACZ,IAAI,iBAAiB,EAAE,EAAE,KAAK,KAAK,EAAE;wCACnC,QAAQ,EAAE,CAAC;qCACZ;gCACH,CAAC,YAED,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,CACV,EACA,WAAW,IAAI,CAAC,KAAK,IAAI,CACxB,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,gBACJ,CAAC,CAAC,aAAa,CAAC,EAC5B,SAAS,EAAE,qBAAqB,EAChC,OAAO,EAAE,UAAU,EACnB,GAAG,EAAE,cAAc,YAEnB,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,CACV,IACI,IACF,EAEP,MAAC,IAAI,IAAC,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,kBAAkB,EAAE,GAAG,EAAE,eAAe,aAClE,QAAQ,IAAI,KAAC,uBAAuB,cAAE,QAAQ,GAA2B,EAE1E,KAAC,QAAQ,IACP,OAAO,EAAE,CAAC,CAAC,QAAQ,EACnB,SAAS,EAAC,OAAO,EACjB,OAAO,EAAE,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,GACvE,IACG,EAEN,OAAO,IAAI,CACV,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,kBAAkB,YACjF,OAAO,GACH,CACR,IACI,CACR,CAAC;IAEF,MAAM,WAAW,GACf,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,CACnB,KAAK,CACN,CAAC,CAAC,CAAC,CACF,KAAC,QAAQ,IACP,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE;YACT,UAAU,EAAE,MAAM,IAAI,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO;SACrD,EACD,eAAe,EAAC,MAAM,EACtB,IAAI,EAAE,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,WAAW,EAC/C,oBAAoB,EAAE,YAAY,EAClC,mBAAmB,EAAE,WAAW,EAChC,qBAAqB,EAAE,aAAa,EACpC,oBAAoB,EAAE,GAAG,EAAE;YACzB,OAAO,EAAE,CAAC;YACV,YAAY,EAAE,EAAE,CAAC;QACnB,CAAC,YAEA,KAAK,GACG,CACZ,CAAC;IAEJ,OAAO,KAAK,KAAK,WAAW,CAAC,CAAC,CAAC,KAAC,cAAc,OAAK,KAAK,KAAM,SAAS,GAAI,CAAC,CAAC,CAAC,WAAW,CAAC;AAC5F,CAAC,CACF,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n useContext,\n useEffect,\n MouseEvent,\n useRef,\n useCallback,\n KeyboardEvent as ReactKeyboardEvent\n} from 'react';\n\nimport Progress from '../Progress';\nimport { getFocusables } from '../../utils';\nimport Backdrop from '../Backdrop';\nimport Flex from '../Flex';\nimport Button from '../Button';\nimport { ForwardProps } from '../../types';\nimport {\n useAfterInitialEffect,\n useConsolidatedRef,\n useI18n,\n useOuterEvent,\n useUID,\n useFocusTrap,\n usePrevious\n} from '../../hooks';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport * as dockIcon from '../Icon/icons/dock.icon';\nimport * as undockIcon from '../Icon/icons/undock.icon';\nimport Text from '../Text';\nimport { Count } from '../Badges';\n\nimport { ModalManagerContext } from './Contexts';\nimport MinimizedModal from './MinimizedModal';\nimport type { ModalProps } from './Modal.types';\nimport {\n StyledModal,\n StyledModalHeader,\n StyledModalContent,\n StyledModalActions,\n StyledModalChildrenWrap\n} from './Modal.styles';\n\nregisterIcon(timesIcon, minusIcon, dockIcon, undockIcon);\n\nconst Modal: FunctionComponent<ModalProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<ModalProps>, ref: Ref<HTMLElement>) => {\n const {\n as,\n progress = false,\n heading,\n count,\n children,\n actions,\n stretch = false,\n center = false,\n defaultFocus,\n onBeforeOpen,\n onAfterOpen,\n onBeforeClose,\n onAfterClose,\n onRequestDismiss,\n onRequestMinimize,\n onRequestMaximize,\n onRequestDock,\n onRequestActivate,\n ...restProps\n } = props;\n\n const { ModalContext } = useContext(ModalManagerContext);\n const {\n alert,\n dismissible,\n minimizable,\n maximizable,\n dockable,\n state,\n dismiss,\n minimize,\n maximize,\n dock,\n unmount,\n top\n } = useContext(ModalContext);\n\n const modalRef = useConsolidatedRef(ref);\n const modalContentRef = useRef<HTMLDivElement>(null);\n const backdropRef = useRef<HTMLDivElement>(null);\n const closeButtonRef = useRef<HTMLButtonElement>(null);\n const previousState = usePrevious(state);\n const id = useUID();\n const t = useI18n();\n\n const tryDismiss = () => {\n if (onRequestDismiss?.() !== false) {\n dismiss();\n }\n };\n\n const setFocus = () => {\n const focusables = getFocusables(modalRef);\n\n if (defaultFocus?.current) {\n defaultFocus.current.focus();\n } else {\n const focusable =\n focusables.find(el => {\n return modalContentRef.current?.contains(el);\n }) ??\n closeButtonRef.current ??\n focusables[0];\n\n focusable?.focus();\n }\n };\n\n useFocusTrap(modalRef);\n\n useOuterEvent('mousedown', [modalRef], e => {\n if (['minimized', 'docked', 'closed'].includes(state)) return;\n\n if (dismissible) {\n if (e.target === backdropRef.current) {\n tryDismiss();\n }\n } else {\n modalRef.current?.focus();\n }\n });\n\n useEffect(() => {\n if (state === 'minimized') return;\n if (state === 'open' || state === 'maximized' || state === 'docked') setFocus();\n\n // This won't actually run until potential changes to docked modal handling.\n if (state === 'closed' && previousState === 'docked') {\n onBeforeClose?.();\n unmount();\n onAfterClose?.();\n }\n }, [state]);\n\n useEffect(() => {\n /*\n * If a modal is already in a closed state on initial mount, unmount it.\n * This only happens when a docked modal closes since the ModalManager\n * remounts it outside of the DockedModals container if state !== 'docked'.\n */\n if (state === 'closed') {\n onBeforeClose?.();\n unmount();\n onAfterClose?.();\n }\n }, []);\n\n // Dismiss on Escape needs to be handled using React event handling to be cancelable using SyntheticEvent.stopPropagation.\n const onModalKeyDown = useCallback(\n (e: ReactKeyboardEvent) => {\n if (\n dismissible &&\n (state === 'open' || state === 'maximized') &&\n e.key === 'Escape' &&\n top\n ) {\n tryDismiss();\n }\n },\n [dismissible, state, top, tryDismiss]\n );\n\n const onHeaderActionKeyDown = useCallback((e: ReactKeyboardEvent<HTMLButtonElement>) => {\n if (e.repeat && (e.key === 'Enter' || e.key === ' ')) e.preventDefault();\n }, []);\n\n // Set a ref based on the initial progress state to be used later to check for setting focus.\n const focusOnProgressChange = useRef(!!progress);\n useAfterInitialEffect(() => {\n // If the progress prop changed and we have already set focus we are done.\n if (!progress && focusOnProgressChange.current) {\n setFocus();\n focusOnProgressChange.current = false;\n }\n }, [progress]);\n\n const maximized = stretch || state === 'maximized';\n\n const modal = (\n <Flex\n {...restProps}\n container={{ direction: 'column' }}\n ref={modalRef}\n as={StyledModal}\n forwardedAs={as}\n onClick={(e: MouseEvent) => e.stopPropagation()}\n onKeyDown={onModalKeyDown}\n alert={alert}\n role={alert ? 'alertdialog' : 'dialog'}\n stretch={maximized}\n center={center}\n aria-labelledby={`${id}-heading`}\n aria-modal={state === 'docked' ? 'false' : 'true'}\n state={state}\n // FOR PR REVIEW: This may be too much, this may be fine...\n aria-live='polite'\n aria-busy={progress ? 'true' : 'false'}\n >\n <Flex\n container={{ justify: 'between', alignItems: 'center', gap: 1 }}\n item={{ shrink: 0 }}\n as={StyledModalHeader}\n hasAction={minimizable || dismissible}\n >\n <Flex\n container={{ alignItems: 'center', gap: 1 }}\n as={Text}\n variant='h2'\n id={`${id}-heading`}\n >\n <span>{heading}</span>\n {typeof count === 'number' && <Count>{count}</Count>}\n </Flex>\n\n <Flex container>\n {maximizable && !alert && state !== 'maximized' && (\n <Button\n icon\n variant='simple'\n aria-label={t('modal_maximize')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (onRequestMaximize?.() !== false) {\n maximize();\n }\n }}\n >\n <Icon name='undock' />\n </Button>\n )}\n {dockable && !alert && state !== 'docked' && (\n <Button\n icon\n variant='simple'\n aria-label={t('modal_dock')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (onRequestDock?.() !== false) {\n dock();\n }\n }}\n >\n <Icon name='dock' />\n </Button>\n )}\n {minimizable && !alert && (\n <Button\n icon\n variant='simple'\n aria-label={t('modal_minimize')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (onRequestMinimize?.() !== false) {\n minimize();\n }\n }}\n >\n <Icon name='minus' />\n </Button>\n )}\n {dismissible && !alert && (\n <Button\n icon\n variant='simple'\n aria-label={t('modal_close')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={tryDismiss}\n ref={closeButtonRef}\n >\n <Icon name='times' />\n </Button>\n )}\n </Flex>\n </Flex>\n\n <Flex item={{ grow: 1 }} as={StyledModalContent} ref={modalContentRef}>\n {children && <StyledModalChildrenWrap>{children}</StyledModalChildrenWrap>}\n\n <Progress\n visible={!!progress}\n placement='local'\n message={typeof progress === 'object' ? progress.message : t('loading')}\n />\n </Flex>\n\n {actions && (\n <Flex container={{ justify: 'between' }} item={{ shrink: 0 }} as={StyledModalActions}>\n {actions}\n </Flex>\n )}\n </Flex>\n );\n\n const renderModal =\n state === 'docked' ? (\n modal\n ) : (\n <Backdrop\n ref={backdropRef}\n container={{\n alignItems: center || maximized ? 'center' : 'start'\n }}\n transitionSpeed='slow'\n open={state === 'open' || state === 'maximized'}\n onBeforeTransitionIn={onBeforeOpen}\n onAfterTransitionIn={onAfterOpen}\n onBeforeTransitionOut={onBeforeClose}\n onAfterTransitionOut={() => {\n unmount();\n onAfterClose?.();\n }}\n >\n {modal}\n </Backdrop>\n );\n\n return state === 'minimized' ? <MinimizedModal {...props} {...restProps} /> : renderModal;\n }\n);\n\nexport default Modal;\n"]}
|
|
1
|
+
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n useEffect,\n MouseEvent,\n useRef,\n useCallback,\n KeyboardEvent as ReactKeyboardEvent\n} from 'react';\n\nimport Progress from '../Progress';\nimport { getFocusables } from '../../utils';\nimport Backdrop from '../Backdrop';\nimport Flex from '../Flex';\nimport Button from '../Button';\nimport { ForwardProps } from '../../types';\nimport {\n useAfterInitialEffect,\n useConsolidatedRef,\n useI18n,\n useOuterEvent,\n useUID,\n useFocusTrap,\n usePrevious,\n useModalContext\n} from '../../hooks';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport * as dockIcon from '../Icon/icons/dock.icon';\nimport * as undockIcon from '../Icon/icons/undock.icon';\nimport Text from '../Text';\nimport { Count } from '../Badges';\n\nimport MinimizedModal from './MinimizedModal';\nimport type { ModalProps } from './Modal.types';\nimport {\n StyledModal,\n StyledModalHeader,\n StyledModalContent,\n StyledModalActions,\n StyledModalChildrenWrap\n} from './Modal.styles';\n\nregisterIcon(timesIcon, minusIcon, dockIcon, undockIcon);\n\nconst Modal: FunctionComponent<ModalProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<ModalProps>, ref: Ref<HTMLElement>) => {\n const {\n as,\n progress = false,\n heading,\n count,\n children,\n actions,\n stretch = false,\n center = false,\n defaultFocus,\n onBeforeOpen,\n onAfterOpen,\n onBeforeClose,\n onAfterClose,\n onRequestDismiss,\n onRequestMinimize,\n onRequestMaximize,\n onRequestDock,\n onRequestActivate,\n ...restProps\n } = props;\n\n const {\n alert,\n dismissible,\n minimizable,\n maximizable,\n dockable,\n state,\n dismiss,\n minimize,\n maximize,\n dock,\n unmount,\n top\n } = useModalContext();\n\n const modalRef = useConsolidatedRef(ref);\n const modalContentRef = useRef<HTMLDivElement>(null);\n const backdropRef = useRef<HTMLDivElement>(null);\n const closeButtonRef = useRef<HTMLButtonElement>(null);\n const previousState = usePrevious(state);\n const id = useUID();\n const t = useI18n();\n\n const tryDismiss = () => {\n if (onRequestDismiss?.() !== false) {\n dismiss();\n }\n };\n\n const setFocus = () => {\n const focusables = getFocusables(modalRef);\n\n if (defaultFocus?.current) {\n defaultFocus.current.focus();\n } else {\n const focusable =\n focusables.find(el => {\n return modalContentRef.current?.contains(el);\n }) ??\n closeButtonRef.current ??\n focusables[0];\n\n focusable?.focus();\n }\n };\n\n useFocusTrap(modalRef);\n\n useOuterEvent('mousedown', [modalRef], e => {\n if (['minimized', 'docked', 'closed'].includes(state)) return;\n\n if (dismissible) {\n if (e.target === backdropRef.current) {\n tryDismiss();\n }\n } else {\n modalRef.current?.focus();\n }\n });\n\n useEffect(() => {\n if (state === 'minimized') return;\n if (state === 'open' || state === 'maximized' || state === 'docked') setFocus();\n\n // This won't actually run until potential changes to docked modal handling.\n if (state === 'closed' && previousState === 'docked') {\n onBeforeClose?.();\n unmount();\n onAfterClose?.();\n }\n }, [state]);\n\n useEffect(() => {\n /*\n * If a modal is already in a closed state on initial mount, unmount it.\n * This only happens when a docked modal closes since the ModalManager\n * remounts it outside of the DockedModals container if state !== 'docked'.\n */\n if (state === 'closed') {\n onBeforeClose?.();\n unmount();\n onAfterClose?.();\n }\n }, []);\n\n // Dismiss on Escape needs to be handled using React event handling to be cancelable using SyntheticEvent.stopPropagation.\n const onModalKeyDown = useCallback(\n (e: ReactKeyboardEvent) => {\n if (\n dismissible &&\n (state === 'open' || state === 'maximized') &&\n e.key === 'Escape' &&\n top\n ) {\n tryDismiss();\n }\n },\n [dismissible, state, top, tryDismiss]\n );\n\n const onHeaderActionKeyDown = useCallback((e: ReactKeyboardEvent<HTMLButtonElement>) => {\n if (e.repeat && (e.key === 'Enter' || e.key === ' ')) e.preventDefault();\n }, []);\n\n // Set a ref based on the initial progress state to be used later to check for setting focus.\n const focusOnProgressChange = useRef(!!progress);\n useAfterInitialEffect(() => {\n // If the progress prop changed and we have already set focus we are done.\n if (!progress && focusOnProgressChange.current) {\n setFocus();\n focusOnProgressChange.current = false;\n }\n }, [progress]);\n\n const maximized = stretch || state === 'maximized';\n\n const modal = (\n <Flex\n {...restProps}\n container={{ direction: 'column' }}\n ref={modalRef}\n as={StyledModal}\n forwardedAs={as}\n onClick={(e: MouseEvent) => e.stopPropagation()}\n onKeyDown={onModalKeyDown}\n alert={alert}\n role={alert ? 'alertdialog' : 'dialog'}\n stretch={maximized}\n center={center}\n aria-labelledby={`${id}-heading`}\n aria-modal={state === 'docked' ? 'false' : 'true'}\n state={state}\n // FOR PR REVIEW: This may be too much, this may be fine...\n aria-live='polite'\n aria-busy={progress ? 'true' : 'false'}\n >\n <Flex\n container={{ justify: 'between', alignItems: 'center', gap: 1 }}\n item={{ shrink: 0 }}\n as={StyledModalHeader}\n hasAction={minimizable || dismissible}\n >\n <Flex\n container={{ alignItems: 'center', gap: 1 }}\n as={Text}\n variant='h2'\n id={`${id}-heading`}\n >\n <span>{heading}</span>\n {typeof count === 'number' && <Count>{count}</Count>}\n </Flex>\n\n <Flex container>\n {maximizable && !alert && state !== 'maximized' && (\n <Button\n icon\n variant='simple'\n aria-label={t('modal_maximize')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (onRequestMaximize?.() !== false) {\n maximize();\n }\n }}\n >\n <Icon name='undock' />\n </Button>\n )}\n {dockable && !alert && state !== 'docked' && (\n <Button\n icon\n variant='simple'\n aria-label={t('modal_dock')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (onRequestDock?.() !== false) {\n dock();\n }\n }}\n >\n <Icon name='dock' />\n </Button>\n )}\n {minimizable && !alert && (\n <Button\n icon\n variant='simple'\n aria-label={t('modal_minimize')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (onRequestMinimize?.() !== false) {\n minimize();\n }\n }}\n >\n <Icon name='minus' />\n </Button>\n )}\n {dismissible && !alert && (\n <Button\n icon\n variant='simple'\n aria-label={t('modal_close')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={tryDismiss}\n ref={closeButtonRef}\n >\n <Icon name='times' />\n </Button>\n )}\n </Flex>\n </Flex>\n\n <Flex item={{ grow: 1 }} as={StyledModalContent} ref={modalContentRef}>\n {children && <StyledModalChildrenWrap>{children}</StyledModalChildrenWrap>}\n\n <Progress\n visible={!!progress}\n placement='local'\n message={typeof progress === 'object' ? progress.message : t('loading')}\n />\n </Flex>\n\n {actions && (\n <Flex container={{ justify: 'between' }} item={{ shrink: 0 }} as={StyledModalActions}>\n {actions}\n </Flex>\n )}\n </Flex>\n );\n\n const renderModal =\n state === 'docked' ? (\n modal\n ) : (\n <Backdrop\n ref={backdropRef}\n container={{\n alignItems: center || maximized ? 'center' : 'start'\n }}\n transitionSpeed='slow'\n open={state === 'open' || state === 'maximized'}\n onBeforeTransitionIn={onBeforeOpen}\n onAfterTransitionIn={onAfterOpen}\n onBeforeTransitionOut={onBeforeClose}\n onAfterTransitionOut={() => {\n unmount();\n onAfterClose?.();\n }}\n >\n {modal}\n </Backdrop>\n );\n\n return state === 'minimized' ? <MinimizedModal {...props} {...restProps} /> : renderModal;\n }\n);\n\nexport default Modal;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModalManager.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/ModalManager.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,iBAAiB,EAGjB,OAAO,EAER,MAAM,OAAO,CAAC;AAMf,OAAO,YAAY,CAAC;AAGpB,OAAO,EAIL,iBAAiB,EAEjB,wBAAwB,EACzB,MAAM,eAAe,CAAC;AAGvB,OAAO,QAAQ,YAAY,CAAC;IAC1B,UAAiB,aAAa;QAC5B,mBAAmB,CAAC,EAAE,OAAO,CAAC,wBAAwB,CAAC,CAAC;KACzD;CACF;AA4KD,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,
|
|
1
|
+
{"version":3,"file":"ModalManager.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/ModalManager.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,iBAAiB,EAGjB,OAAO,EAER,MAAM,OAAO,CAAC;AAMf,OAAO,YAAY,CAAC;AAGpB,OAAO,EAIL,iBAAiB,EAEjB,wBAAwB,EACzB,MAAM,eAAe,CAAC;AAGvB,OAAO,QAAQ,YAAY,CAAC;IAC1B,UAAiB,aAAa;QAC5B,mBAAmB,CAAC,EAAE,OAAO,CAAC,wBAAwB,CAAC,CAAC;KACzD;CACF;AA4KD,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CA6GtD,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -182,19 +182,10 @@ const ModalManager = ({ children }) => {
|
|
|
182
182
|
? window.cosmos.modalManagerContext ?? ModalManagerContext
|
|
183
183
|
: ModalManagerContext;
|
|
184
184
|
const priorCtx = useContext(context);
|
|
185
|
-
const priorCtxValue = useMemo(() => context === ModalManagerContext
|
|
186
|
-
? priorCtx
|
|
187
|
-
: {
|
|
188
|
-
...priorCtx,
|
|
189
|
-
create: (Comp, props, opts) => {
|
|
190
|
-
const WrappedComp = compProps => (_jsx(ModalManager, { children: _jsx(Comp, { ...compProps }) }));
|
|
191
|
-
return priorCtx.create(WrappedComp, props, opts);
|
|
192
|
-
}
|
|
193
|
-
}, [priorCtx, context]);
|
|
194
185
|
// Don't create additional Modal portals.
|
|
195
186
|
if (priorCtx.initialized)
|
|
196
|
-
return
|
|
197
|
-
return (_jsxs(
|
|
187
|
+
return _jsx(context.Provider, { value: priorCtx, children: children });
|
|
188
|
+
return (_jsxs(context.Provider, { value: providerValue, children: [children, modals.length > 0 &&
|
|
198
189
|
portalTarget &&
|
|
199
190
|
createPortal(_jsx(RenderModals, { modals: modals }), portalTarget)] }));
|
|
200
191
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModalManager.js","sourceRoot":"","sources":["../../../src/components/Modal/ModalManager.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n useReducer,\n useMemo,\n useEffect,\n useContext,\n FunctionComponent,\n ComponentType,\n Dispatch,\n Context,\n memo\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { createUID, windowIsAvailable } from '../../utils';\nimport { useConfiguration, useScrollToggle } from '../../hooks';\nimport { OmitStrict } from '../../types';\nimport '../../init';\n\nimport DockedModals from './DockedModals';\nimport {\n ModalMethods,\n ModalOptions,\n ModalObject,\n ModalManagerProps,\n ModalState,\n ModalManagerContextValue\n} from './Modal.types';\nimport { ModalContext, ModalManagerContext } from './Contexts';\n\ndeclare module '../../init' {\n export interface CosmosGlobals {\n modalManagerContext?: Context<ModalManagerContextValue>;\n }\n}\n\ntype ModalAction =\n | 'create'\n | 'update'\n | 'minimize'\n | 'maximize'\n | 'dock'\n | 'activate'\n | 'dismiss'\n | 'unmount';\n\ntype ModalReducerPayload<P extends object> =\n | { action: 'create'; modal: ModalObject<P> }\n | {\n action: 'update';\n modal: Partial<OmitStrict<ModalObject<P>, 'props'>> &\n Pick<ModalObject, 'id'> & { props: Partial<ModalObject<P>['props']> };\n }\n | {\n action: Exclude<ModalAction, 'create' | 'update'>;\n modal: Pick<ModalObject, 'id'>;\n };\n\nconst reducer = <P extends object>(\n modals: ModalObject[],\n payload: ModalReducerPayload<P>\n): ModalObject<any>[] => {\n switch (payload.action) {\n case 'create':\n return [\n ...modals.map(modal => {\n if (\n (!payload.modal.options.alert &&\n payload.modal.state === 'open' &&\n !modal.options.alert &&\n modal.state === 'open' &&\n modal.options.minimizable) ||\n payload.modal.options.dockable\n ) {\n modal.state = 'minimized';\n }\n\n return modal;\n }),\n payload.modal\n ];\n\n case 'unmount':\n return modals.filter(modal => modal.id !== payload.modal.id);\n\n case 'dismiss':\n return modals.map(modal => {\n modal.state = modal.id === payload.modal.id ? 'closed' : modal.state;\n return modal;\n });\n\n case 'update':\n return modals.map(modal => {\n modal.props =\n modal.id === payload.modal.id ? { ...modal.props, ...payload.modal.props } : modal.props;\n return modal;\n });\n\n case 'activate':\n return modals.map(modal => {\n if (modal.id === payload.modal.id && !modal.options.dockable) {\n modal.state = 'open';\n } else if (modal.id === payload.modal.id && modal.options.dockable) {\n modal.state = 'docked';\n } else if (!modal.options.alert && modal.state === 'open' && modal.options.minimizable) {\n modal.state = 'minimized';\n }\n\n return modal;\n });\n\n case 'minimize':\n return modals.map(modal => {\n modal.state =\n modal.id === payload.modal.id && modal.options.minimizable ? 'minimized' : modal.state;\n return modal;\n });\n\n case 'maximize':\n return modals.map(modal => {\n modal.state =\n modal.id === payload.modal.id && modal.options.maximizable ? 'maximized' : modal.state;\n return modal;\n });\n\n case 'dock':\n return modals.map(modal => {\n modal.state =\n modal.id === payload.modal.id && modal.options.dockable ? 'docked' : 'minimized';\n return modal;\n });\n\n default:\n return modals;\n }\n};\n\nconst WrappedModal = memo(\n ({\n Component,\n id,\n options: { alert, dismissible, dockable, minimizable, maximizable },\n state,\n methods,\n props,\n top\n }: ModalObject & { top: boolean }) => (\n <ModalContext.Provider\n value={{\n id,\n alert,\n dismissible,\n minimizable,\n maximizable,\n dockable,\n state,\n top,\n initialized: true,\n ...methods\n }}\n >\n <Component {...props} />\n </ModalContext.Provider>\n )\n);\n\nconst RenderModals = ({ modals }: { modals: ModalObject[] }) => {\n const { open, minimized, alerts } = modals.reduce<{\n open: ModalObject[];\n minimized: ModalObject[];\n alerts: ModalObject[];\n }>(\n (obj, modal) => {\n if (modal.options.alert) obj.alerts.push(modal);\n else if (modal.state === 'minimized' || modal.state === 'docked') {\n obj.minimized.push(modal);\n } else obj.open.push(modal);\n\n return obj;\n },\n { open: [], minimized: [], alerts: [] }\n );\n\n return (\n <>\n {open.map((modal, i) => (\n <WrappedModal\n {...modal}\n top={alerts.length === 0 && i === open.length - 1}\n key={modal.id}\n />\n ))}\n {minimized.length > 0 && (\n <DockedModals>\n {minimized.map(modal => (\n <WrappedModal {...modal} top={false} key={modal.id} />\n ))}\n </DockedModals>\n )}\n {alerts.map((modal, i) => (\n <WrappedModal {...modal} top={i === open.length - 1} key={modal.id} />\n ))}\n </>\n );\n};\n\nconst ModalManager: FunctionComponent<ModalManagerProps> = ({ children }) => {\n const [modals, dispatch] = useReducer(reducer, []);\n const { disableScroll, enableScroll } = useScrollToggle();\n\n const providerValue = useMemo(\n () => ({\n create: <P extends object>(\n Component: ComponentType<P>,\n props?: P,\n options?: ModalOptions\n ) => {\n const id = options?.id || createUID();\n\n const methods: ModalMethods<P> = {\n dismiss: () => {\n dispatch({ action: 'dismiss', modal: { id } });\n options?.onDismiss?.(id);\n },\n update: updateProps => {\n (dispatch as Dispatch<ModalReducerPayload<P>>)({\n action: 'update',\n modal: { id, props: updateProps }\n });\n },\n minimize: () => {\n dispatch({ action: 'minimize', modal: { id } });\n options?.onMinimize?.(id);\n },\n maximize: () => {\n dispatch({ action: 'maximize', modal: { id } });\n options?.onMaximize?.(id);\n },\n dock: () => {\n dispatch({ action: 'dock', modal: { id } });\n options?.onDock?.(id);\n },\n activate: () => {\n dispatch({ action: 'activate', modal: { id } });\n options?.onActivate?.(id);\n },\n unmount: () => {\n dispatch({ action: 'unmount', modal: { id } });\n }\n };\n\n let defaultState: ModalState;\n if (options?.defaultMinimized) {\n defaultState = 'minimized';\n } else if (options?.dockable) {\n defaultState = 'docked';\n } else {\n defaultState = 'open';\n }\n\n (dispatch as Dispatch<ModalReducerPayload<P>>)({\n action: 'create',\n modal: {\n id,\n methods,\n Component,\n props,\n state: defaultState,\n options: {\n alert: false,\n minimizable: false,\n maximizable: false,\n dockable: false,\n defaultMinimized: false,\n unmountWhenMinimized: true,\n ...options,\n dismissible: !!(options?.alert ? false : options?.dismissible ?? true)\n }\n }\n });\n\n return methods;\n },\n ModalContext,\n initialized: true\n }),\n []\n );\n\n useEffect(() => {\n if (modals.some(modal => modal.state === 'open' && !modal.options.dockable)) {\n disableScroll();\n } else {\n enableScroll();\n }\n }, [modals]);\n\n const { portalTarget } = useConfiguration();\n\n const context = windowIsAvailable\n ? window.cosmos.modalManagerContext ?? ModalManagerContext\n : ModalManagerContext;\n const priorCtx = useContext(context);\n\n const priorCtxValue = useMemo(\n () =>\n context === ModalManagerContext\n ? priorCtx\n : {\n ...priorCtx,\n create: (Comp, props, opts) => {\n const WrappedComp: typeof Comp = compProps => (\n <ModalManager>\n <Comp {...compProps} />\n </ModalManager>\n );\n return priorCtx.create(WrappedComp, props, opts);\n }\n },\n [priorCtx, context]\n );\n\n // Don't create additional Modal portals.\n if (priorCtx.initialized)\n return (\n <ModalManagerContext.Provider value={priorCtxValue}>{children}</ModalManagerContext.Provider>\n );\n\n return (\n <ModalManagerContext.Provider value={providerValue}>\n {children}\n {modals.length > 0 &&\n portalTarget &&\n createPortal(<RenderModals modals={modals} />, portalTarget)}\n </ModalManagerContext.Provider>\n );\n};\n\nexport default ModalManager;\n"]}
|
|
1
|
+
{"version":3,"file":"ModalManager.js","sourceRoot":"","sources":["../../../src/components/Modal/ModalManager.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n useReducer,\n useMemo,\n useEffect,\n useContext,\n FunctionComponent,\n ComponentType,\n Dispatch,\n Context,\n memo\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { createUID, windowIsAvailable } from '../../utils';\nimport { useConfiguration, useScrollToggle } from '../../hooks';\nimport { OmitStrict } from '../../types';\nimport '../../init';\n\nimport DockedModals from './DockedModals';\nimport {\n ModalMethods,\n ModalOptions,\n ModalObject,\n ModalManagerProps,\n ModalState,\n ModalManagerContextValue\n} from './Modal.types';\nimport { ModalContext, ModalManagerContext } from './Contexts';\n\ndeclare module '../../init' {\n export interface CosmosGlobals {\n modalManagerContext?: Context<ModalManagerContextValue>;\n }\n}\n\ntype ModalAction =\n | 'create'\n | 'update'\n | 'minimize'\n | 'maximize'\n | 'dock'\n | 'activate'\n | 'dismiss'\n | 'unmount';\n\ntype ModalReducerPayload<P extends object> =\n | { action: 'create'; modal: ModalObject<P> }\n | {\n action: 'update';\n modal: Partial<OmitStrict<ModalObject<P>, 'props'>> &\n Pick<ModalObject, 'id'> & { props: Partial<ModalObject<P>['props']> };\n }\n | {\n action: Exclude<ModalAction, 'create' | 'update'>;\n modal: Pick<ModalObject, 'id'>;\n };\n\nconst reducer = <P extends object>(\n modals: ModalObject[],\n payload: ModalReducerPayload<P>\n): ModalObject<any>[] => {\n switch (payload.action) {\n case 'create':\n return [\n ...modals.map(modal => {\n if (\n (!payload.modal.options.alert &&\n payload.modal.state === 'open' &&\n !modal.options.alert &&\n modal.state === 'open' &&\n modal.options.minimizable) ||\n payload.modal.options.dockable\n ) {\n modal.state = 'minimized';\n }\n\n return modal;\n }),\n payload.modal\n ];\n\n case 'unmount':\n return modals.filter(modal => modal.id !== payload.modal.id);\n\n case 'dismiss':\n return modals.map(modal => {\n modal.state = modal.id === payload.modal.id ? 'closed' : modal.state;\n return modal;\n });\n\n case 'update':\n return modals.map(modal => {\n modal.props =\n modal.id === payload.modal.id ? { ...modal.props, ...payload.modal.props } : modal.props;\n return modal;\n });\n\n case 'activate':\n return modals.map(modal => {\n if (modal.id === payload.modal.id && !modal.options.dockable) {\n modal.state = 'open';\n } else if (modal.id === payload.modal.id && modal.options.dockable) {\n modal.state = 'docked';\n } else if (!modal.options.alert && modal.state === 'open' && modal.options.minimizable) {\n modal.state = 'minimized';\n }\n\n return modal;\n });\n\n case 'minimize':\n return modals.map(modal => {\n modal.state =\n modal.id === payload.modal.id && modal.options.minimizable ? 'minimized' : modal.state;\n return modal;\n });\n\n case 'maximize':\n return modals.map(modal => {\n modal.state =\n modal.id === payload.modal.id && modal.options.maximizable ? 'maximized' : modal.state;\n return modal;\n });\n\n case 'dock':\n return modals.map(modal => {\n modal.state =\n modal.id === payload.modal.id && modal.options.dockable ? 'docked' : 'minimized';\n return modal;\n });\n\n default:\n return modals;\n }\n};\n\nconst WrappedModal = memo(\n ({\n Component,\n id,\n options: { alert, dismissible, dockable, minimizable, maximizable },\n state,\n methods,\n props,\n top\n }: ModalObject & { top: boolean }) => (\n <ModalContext.Provider\n value={{\n id,\n alert,\n dismissible,\n minimizable,\n maximizable,\n dockable,\n state,\n top,\n initialized: true,\n ...methods\n }}\n >\n <Component {...props} />\n </ModalContext.Provider>\n )\n);\n\nconst RenderModals = ({ modals }: { modals: ModalObject[] }) => {\n const { open, minimized, alerts } = modals.reduce<{\n open: ModalObject[];\n minimized: ModalObject[];\n alerts: ModalObject[];\n }>(\n (obj, modal) => {\n if (modal.options.alert) obj.alerts.push(modal);\n else if (modal.state === 'minimized' || modal.state === 'docked') {\n obj.minimized.push(modal);\n } else obj.open.push(modal);\n\n return obj;\n },\n { open: [], minimized: [], alerts: [] }\n );\n\n return (\n <>\n {open.map((modal, i) => (\n <WrappedModal\n {...modal}\n top={alerts.length === 0 && i === open.length - 1}\n key={modal.id}\n />\n ))}\n {minimized.length > 0 && (\n <DockedModals>\n {minimized.map(modal => (\n <WrappedModal {...modal} top={false} key={modal.id} />\n ))}\n </DockedModals>\n )}\n {alerts.map((modal, i) => (\n <WrappedModal {...modal} top={i === open.length - 1} key={modal.id} />\n ))}\n </>\n );\n};\n\nconst ModalManager: FunctionComponent<ModalManagerProps> = ({ children }) => {\n const [modals, dispatch] = useReducer(reducer, []);\n const { disableScroll, enableScroll } = useScrollToggle();\n\n const providerValue = useMemo(\n () => ({\n create: <P extends object>(\n Component: ComponentType<P>,\n props?: P,\n options?: ModalOptions\n ) => {\n const id = options?.id || createUID();\n\n const methods: ModalMethods<P> = {\n dismiss: () => {\n dispatch({ action: 'dismiss', modal: { id } });\n options?.onDismiss?.(id);\n },\n update: updateProps => {\n (dispatch as Dispatch<ModalReducerPayload<P>>)({\n action: 'update',\n modal: { id, props: updateProps }\n });\n },\n minimize: () => {\n dispatch({ action: 'minimize', modal: { id } });\n options?.onMinimize?.(id);\n },\n maximize: () => {\n dispatch({ action: 'maximize', modal: { id } });\n options?.onMaximize?.(id);\n },\n dock: () => {\n dispatch({ action: 'dock', modal: { id } });\n options?.onDock?.(id);\n },\n activate: () => {\n dispatch({ action: 'activate', modal: { id } });\n options?.onActivate?.(id);\n },\n unmount: () => {\n dispatch({ action: 'unmount', modal: { id } });\n }\n };\n\n let defaultState: ModalState;\n if (options?.defaultMinimized) {\n defaultState = 'minimized';\n } else if (options?.dockable) {\n defaultState = 'docked';\n } else {\n defaultState = 'open';\n }\n\n (dispatch as Dispatch<ModalReducerPayload<P>>)({\n action: 'create',\n modal: {\n id,\n methods,\n Component,\n props,\n state: defaultState,\n options: {\n alert: false,\n minimizable: false,\n maximizable: false,\n dockable: false,\n defaultMinimized: false,\n unmountWhenMinimized: true,\n ...options,\n dismissible: !!(options?.alert ? false : options?.dismissible ?? true)\n }\n }\n });\n\n return methods;\n },\n ModalContext,\n initialized: true\n }),\n []\n );\n\n useEffect(() => {\n if (modals.some(modal => modal.state === 'open' && !modal.options.dockable)) {\n disableScroll();\n } else {\n enableScroll();\n }\n }, [modals]);\n\n const { portalTarget } = useConfiguration();\n\n const context = windowIsAvailable\n ? window.cosmos.modalManagerContext ?? ModalManagerContext\n : ModalManagerContext;\n const priorCtx = useContext(context);\n\n // Don't create additional Modal portals.\n if (priorCtx.initialized) return <context.Provider value={priorCtx}>{children}</context.Provider>;\n\n return (\n <context.Provider value={providerValue}>\n {children}\n {modals.length > 0 &&\n portalTarget &&\n createPortal(<RenderModals modals={modals} />, portalTarget)}\n </context.Provider>\n );\n};\n\nexport default ModalManager;\n"]}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
export { default } from './Modal';
|
|
2
2
|
export { default as ModalManager } from './ModalManager';
|
|
3
|
-
export { ModalManagerContext } from './Contexts';
|
|
4
3
|
export { ModalProps } from './Modal.types';
|
|
5
4
|
export { ModalMethods } from './Modal.types';
|
|
6
5
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAClC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAClC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Modal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAClC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Modal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAClC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC","sourcesContent":["export { default } from './Modal';\nexport { default as ModalManager } from './ModalManager';\nexport { ModalProps } from './Modal.types';\nexport { ModalMethods } from './Modal.types';\n"]}
|
|
@@ -194,7 +194,7 @@ const RadioCheck = forwardRef((props, ref) => {
|
|
|
194
194
|
newRef.current.indeterminate = !!indeterminate;
|
|
195
195
|
}
|
|
196
196
|
}, [newRef, indeterminate, isRadio]);
|
|
197
|
-
return (_jsx(FormField, { as: card ? StyledRadioCheckCard : StyledRadioCheck, label: _jsxs(_Fragment, { children: [_jsx(StyledPseudoRadioCheck, { status: status, isRadio: isRadio, as: StyledFormControl, required: required, disabled: disabled, readOnly: readOnly }), label] }), labelAs: card ? 'div' : undefined, id: id, required: required, disabled: disabled, readOnly: readOnly, status: status, isRadioCheck: true, inline: true, labelAfter: true,
|
|
197
|
+
return (_jsx(FormField, { as: card ? StyledRadioCheckCard : StyledRadioCheck, label: _jsxs(_Fragment, { children: [_jsx(StyledPseudoRadioCheck, { status: status, isRadio: isRadio, as: StyledFormControl, required: required, disabled: disabled, readOnly: readOnly }), label] }), labelAs: card ? 'div' : undefined, id: id, required: required, disabled: disabled, readOnly: readOnly, status: status, isRadioCheck: true, inline: true, labelAfter: true, additionalInfo: additionalInfo, children: _jsx(StyledRadioCheckInput, { ...restProps, id: id, type: type, required: required, disabled: disabled, readOnly: readOnly, "aria-readonly": readOnly, onClick: (e) => {
|
|
198
198
|
if (readOnly)
|
|
199
199
|
e.preventDefault();
|
|
200
200
|
onClick?.(e);
|