@pega/cosmos-react-core 8.0.0-build.4.3 → 8.0.0-build.4.4

package/lib/components/Dialog/Dialog.styles.d.ts

@@ -2,5 +2,5 @@ export declare const StyledChildrenWrap: import("styled-components").StyledCompo
 export declare const StyledDialogHeader: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledDialogContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledDialogFooter: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledDialog: import("styled-components").StyledComponent<(<Modifiers extends string = string>(props: import("../Popover").PopoverProps<Modifiers> & import("../..").ForwardProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null), import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledDialog: import("styled-components").StyledComponent<(<Modifiers extends string = string>(props: import("../Popover").PopoverProps<Modifiers> & import("../..").ForwardProps) => import("react").ReactElement | null), import("styled-components").DefaultTheme, {}, never>;
 //# sourceMappingURL=Dialog.styles.d.ts.map

package/lib/components/Dialog/Dialog.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAE/C,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAE/C,eAAO,MAAM,mBAAmB,yGAgB9B,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAE/C,eAAO,MAAM,YAAY,8TAcvB,CAAC"}
+{"version":3,"file":"Dialog.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAE/C,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAE/C,eAAO,MAAM,mBAAmB,yGAgB9B,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAE/C,eAAO,MAAM,YAAY,oQAcvB,CAAC"}

package/lib/components/Dialog/FormDialog.d.ts

@@ -2,8 +2,8 @@ import type { FC, HTMLAttributes } from 'react';
 import type { OmitStrict } from '../../types';
 import type { FormDialogProps } from './Dialog.types';
 export declare const StyledFormDialog: import("styled-components").StyledComponent<FC<import("./Dialog.types").BaseDialogProps & {
-    labelledbyId?: string | undefined;
-    ariaLabel?: string | undefined;
+    labelledbyId?: string;
+    ariaLabel?: string;
 } & HTMLAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
 declare const FormDialog: FC<FormDialogProps & OmitStrict<HTMLAttributes<HTMLDivElement>, 'onSubmit'>>;
 export default FormDialog;

package/lib/components/Dialog/FormDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/FormDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect } from 'react';\nimport type { PropsWithoutRef, FC, HTMLAttributes } from 'react';\nimport styled from 'styled-components';\n\nimport {\n  useConsolidatedRef,\n  useEscape,\n  useFocusTrap,\n  useI18n,\n  useOuterEvent,\n  useUID\n} from '../../hooks';\nimport { getFocusables } from '../../utils';\nimport Button from '../Button';\nimport Text from '../Text';\nimport Progress from '../Progress';\nimport type { OmitStrict } from '../../types';\nimport Flex from '../Flex';\n\nimport {\n  StyledChildrenWrap,\n  StyledDialogContent,\n  StyledDialogFooter,\n  StyledDialogHeader\n} from './Dialog.styles';\nimport type { FormDialogProps } from './Dialog.types';\nimport Dialog from './Dialog';\n\nexport const StyledFormDialog = styled(Dialog)``;\n\nconst FormDialog: FC<FormDialogProps & OmitStrict<HTMLAttributes<HTMLDivElement>, 'onSubmit'>> =\n  forwardRef(function FormDialog(\n    {\n      arrow = true,\n      target,\n      heading,\n      ariaLabel,\n      children,\n      progress,\n      onDismiss,\n      onCancel,\n      onSubmit,\n      ...restProps\n    }: PropsWithoutRef<FormDialogProps>,\n    ref: FormDialogProps['ref']\n  ) {\n    const t = useI18n();\n    const headingId = useUID();\n    const dialogRef = useConsolidatedRef(ref);\n    const dialogContentRef = useRef<HTMLDivElement>(null);\n    const cancelButtonRef = useRef<HTMLButtonElement>(null);\n\n    const setFocus = () => {\n      if (progress) return;\n\n      const focusables = getFocusables(dialogRef);\n\n      const focusable =\n        focusables.find(el => {\n          return dialogContentRef.current?.contains(el);\n        }) ??\n        cancelButtonRef.current ??\n        focusables[0];\n\n      focusable?.focus();\n    };\n\n    const onCancelHandler = typeof onCancel === 'function' ? onCancel : onCancel.handler;\n\n    useEscape(\n      e => {\n        if (onDismiss) {\n          onDismiss();\n        } else {\n          onCancelHandler();\n        }\n        e.stopPropagation();\n      },\n      dialogRef,\n      [onDismiss, onCancelHandler]\n    );\n\n    useOuterEvent('mousedown', [target, dialogRef], () => {\n      if (onDismiss) {\n        onDismiss();\n      } else {\n        onCancelHandler();\n      }\n    });\n\n    useFocusTrap(dialogRef, false);\n\n    useEffect(() => {\n      if (!progress) {\n        setFocus();\n      }\n    }, [progress]);\n\n    useEffect(() => {\n      const closeDialog = () => {\n        setTimeout(() => {\n          if (onDismiss) {\n            onDismiss();\n          } else {\n            onCancelHandler();\n          }\n          // The 0 timeout ensures that the dialog will not re-open immediately after the close event is triggered.\n        }, 0);\n      };\n\n      target.addEventListener('click', closeDialog);\n\n      return () => {\n        if (document.contains(target)) {\n          target.focus();\n        }\n        target.removeEventListener('click', closeDialog);\n      };\n    }, []);\n\n    return (\n      <StyledFormDialog\n        {...restProps}\n        {...(heading === undefined ? { ariaLabel } : { labelledbyId: headingId })}\n        arrow={arrow}\n        target={target}\n        progress={progress}\n        ref={dialogRef}\n      >\n        {heading !== undefined && (\n          <Flex\n            container={{ alignItems: 'center', justify: 'between', pad: 2 }}\n            item={{ shrink: 0 }}\n            as={StyledDialogHeader}\n          >\n            <Text id={headingId} variant='h2'>\n              {heading}\n            </Text>\n          </Flex>\n        )}\n\n        <Flex item={{ grow: 1 }} as={StyledDialogContent} ref={dialogContentRef}>\n          {children && (\n            <StyledChildrenWrap inert={progress ? '' : undefined}>{children}</StyledChildrenWrap>\n          )}\n          <Progress\n            visible={!!progress}\n            focusOnVisible\n            placement='local'\n            message={typeof progress === 'string' ? progress : undefined}\n          />\n        </Flex>\n\n        <Flex\n          container={{ alignItems: 'center', justify: 'between', pad: 2 }}\n          item={{ shrink: 0 }}\n          as={StyledDialogFooter}\n        >\n          <Button\n            onClick={() => {\n              onCancelHandler();\n            }}\n            disabled={typeof onCancel !== 'function' ? onCancel.disabled : undefined}\n            ref={cancelButtonRef}\n          >\n            {typeof onCancel !== 'function' && onCancel.text ? onCancel.text : t('cancel')}\n          </Button>\n\n          <Button\n            variant='primary'\n            onClick={() => {\n              (typeof onSubmit !== 'function' ? onSubmit.handler : onSubmit)();\n            }}\n            disabled={typeof onSubmit !== 'function' ? onSubmit.disabled : undefined}\n          >\n            {typeof onSubmit !== 'function' && onSubmit.text ? onSubmit.text : t('submit')}\n          </Button>\n        </Flex>\n      </StyledFormDialog>\n    );\n  });\n\nexport default FormDialog;\n"]}
+{"version":3,"file":"FormDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/FormDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect } from 'react';\nimport type { PropsWithoutRef, FC, HTMLAttributes } from 'react';\nimport styled from 'styled-components';\n\nimport {\n  useConsolidatedRef,\n  useEscape,\n  useFocusTrap,\n  useI18n,\n  useOuterEvent,\n  useUID\n} from '../../hooks';\nimport { getFocusables } from '../../utils';\nimport Button from '../Button';\nimport Text from '../Text';\nimport Progress from '../Progress';\nimport type { OmitStrict } from '../../types';\nimport Flex from '../Flex';\n\nimport {\n  StyledChildrenWrap,\n  StyledDialogContent,\n  StyledDialogFooter,\n  StyledDialogHeader\n} from './Dialog.styles';\nimport type { FormDialogProps } from './Dialog.types';\nimport Dialog from './Dialog';\n\nexport const StyledFormDialog = styled(Dialog)``;\n\nconst FormDialog: FC<FormDialogProps & OmitStrict<HTMLAttributes<HTMLDivElement>, 'onSubmit'>> =\n  forwardRef(function FormDialog(\n    {\n      arrow = true,\n      target,\n      heading,\n      ariaLabel,\n      children,\n      progress,\n      onDismiss,\n      onCancel,\n      onSubmit,\n      ...restProps\n    }: PropsWithoutRef<FormDialogProps>,\n    ref: FormDialogProps['ref']\n  ) {\n    const t = useI18n();\n    const headingId = useUID();\n    const dialogRef = useConsolidatedRef(ref);\n    const dialogContentRef = useRef<HTMLDivElement>(null);\n    const cancelButtonRef = useRef<HTMLButtonElement>(null);\n\n    const setFocus = () => {\n      if (progress) return;\n\n      const focusables = getFocusables(dialogRef);\n\n      const focusable =\n        focusables.find(el => {\n          return dialogContentRef.current?.contains(el);\n        }) ??\n        cancelButtonRef.current ??\n        focusables[0];\n\n      focusable?.focus();\n    };\n\n    const onCancelHandler = typeof onCancel === 'function' ? onCancel : onCancel.handler;\n\n    useEscape(\n      e => {\n        if (onDismiss) {\n          onDismiss();\n        } else {\n          onCancelHandler();\n        }\n        e.stopPropagation();\n      },\n      dialogRef,\n      [onDismiss, onCancelHandler]\n    );\n\n    useOuterEvent('mousedown', [target, dialogRef], () => {\n      if (onDismiss) {\n        onDismiss();\n      } else {\n        onCancelHandler();\n      }\n    });\n\n    useFocusTrap(dialogRef, false);\n\n    useEffect(() => {\n      if (!progress) {\n        setFocus();\n      }\n    }, [progress]);\n\n    useEffect(() => {\n      const closeDialog = () => {\n        setTimeout(() => {\n          if (onDismiss) {\n            onDismiss();\n          } else {\n            onCancelHandler();\n          }\n          // The 0 timeout ensures that the dialog will not re-open immediately after the close event is triggered.\n        }, 0);\n      };\n\n      target.addEventListener('click', closeDialog);\n\n      return () => {\n        if (document.contains(target)) {\n          target.focus();\n        }\n        target.removeEventListener('click', closeDialog);\n      };\n    }, []);\n\n    return (\n      <StyledFormDialog\n        {...restProps}\n        {...(heading === undefined ? { ariaLabel } : { labelledbyId: headingId })}\n        arrow={arrow}\n        target={target}\n        progress={progress}\n        ref={dialogRef}\n      >\n        {heading !== undefined && (\n          <Flex\n            container={{ alignItems: 'center', justify: 'between', pad: 2 }}\n            item={{ shrink: 0 }}\n            as={StyledDialogHeader}\n          >\n            <Text id={headingId} variant='h2'>\n              {heading}\n            </Text>\n          </Flex>\n        )}\n\n        <Flex item={{ grow: 1 }} as={StyledDialogContent} ref={dialogContentRef}>\n          {children && (\n            <StyledChildrenWrap inert={progress ? '' : undefined}>{children}</StyledChildrenWrap>\n          )}\n          <Progress\n            visible={!!progress}\n            focusOnVisible\n            placement='local'\n            message={typeof progress === 'string' ? progress : undefined}\n          />\n        </Flex>\n\n        <Flex\n          container={{ alignItems: 'center', justify: 'between', pad: 2 }}\n          item={{ shrink: 0 }}\n          as={StyledDialogFooter}\n        >\n          <Button\n            onClick={() => {\n              onCancelHandler();\n            }}\n            disabled={typeof onCancel !== 'function' ? onCancel.disabled : undefined}\n            ref={cancelButtonRef}\n          >\n            {typeof onCancel !== 'function' && onCancel.text ? onCancel.text : t('cancel')}\n          </Button>\n\n          <Button\n            variant='primary'\n            onClick={() => {\n              (typeof onSubmit !== 'function' ? onSubmit.handler : onSubmit)();\n            }}\n            disabled={typeof onSubmit !== 'function' ? onSubmit.disabled : undefined}\n          >\n            {typeof onSubmit !== 'function' && onSubmit.text ? onSubmit.text : t('submit')}\n          </Button>\n        </Flex>\n      </StyledFormDialog>\n    );\n  });\n\nexport default FormDialog;\n"]}

package/lib/components/Dialog/InfoDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"InfoDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/InfoDialog.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtD,OAAO,EACL,kBAAkB,EAClB,SAAS,EACT,YAAY,EACZ,OAAO,EACP,aAAa,EACb,MAAM,EACP,MAAM,aAAa,CAAC;AACrB,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,OAAO,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAE9F,OAAO,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE5E,MAAM,UAAU,GAAyD,UAAU,CACjF,SAAS,UAAU,CACjB,EACE,MAAM,EACN,OAAO,EAAE,WAAW,EACpB,QAAQ,EACR,QAAQ,EAAE,YAAY,EACtB,SAAS,EACT,GAAG,SAAS,EACqB,EACnC,GAA2B;IAE3B,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,SAAS,GAAG,MAAM,EAAE,CAAC;IAC3B,MAAM,SAAS,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAC1C,MAAM,gBAAgB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACtD,MAAM,cAAc,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAEvD,MAAM,QAAQ,GAAG,GAAG,EAAE;QACpB,IAAI,YAAY;YAAE,OAAO;QAEzB,MAAM,UAAU,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC;QAE5C,MAAM,SAAS,GACb,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE;YACnB,OAAO,gBAAgB,CAAC,OAAO,EAAE,QAAQ,CAAC,EAAE,CAAC,CAAC;QAChD,CAAC,CAAC;YACF,cAAc,CAAC,OAAO;YACtB,UAAU,CAAC,CAAC,CAAC,CAAC;QAEhB,SAAS,EAAE,KAAK,EAAE,CAAC;IACrB,CAAC,CAAC;IAEF,SAAS,CACP,CAAC,CAAC,EAAE;QACF,SAAS,EAAE,EAAE,CAAC;QACd,CAAC,CAAC,eAAe,EAAE,CAAC;IACtB,CAAC,EACD,SAAS,EACT,CAAC,SAAS,CAAC,CACZ,CAAC;IAEF,aAAa,CAAC,WAAW,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,EAAE,GAAG,EAAE;QACnD,SAAS,EAAE,EAAE,CAAC;IAChB,CAAC,CAAC,CAAC;IAEH,YAAY,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;IAE/B,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,YAAY,EAAE;YACjB,QAAQ,EAAE,CAAC;SACZ;IACH,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,WAAW,GAAG,GAAG,EAAE;YACvB,UAAU,CAAC,GAAG,EAAE;gBACd,SAAS,EAAE,EAAE,CAAC;gBACd,yGAAyG;YAC3G,CAAC,EAAE,CAAC,CAAC,CAAC;QACR,CAAC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QAE9C,OAAO,GAAG,EAAE;YACV,IAAI,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;gBAC7B,MAAM,CAAC,KAAK,EAAE,CAAC;aAChB;YACD,MAAM,CAAC,mBAAmB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QACnD,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,CAAC,CAC5B,KAAC,IAAI,IAAC,EAAE,EAAE,SAAS,EAAE,OAAO,EAAC,IAAI,YAC9B,OAAO,WAAW,KAAK,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,OAAO,GAC/D,CACR,CAAC,CAAC,CAAC,IAAI,CAAC;IAET,MAAM,QAAQ,GAAG,CACf,KAAC,QAAQ,IACP,OAAO,EAAE,CAAC,CAAC,YAAY,EACvB,cAAc,QACd,SAAS,EAAC,OAAO,EACjB,OAAO,EAAE,OAAO,YAAY,KAAK,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,GACpE,CACH,CAAC;IAEF,MAAM,aAAa,GAAG,CACpB,KAAC,mBAAmB,IAClB,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE,GAAG,EAAE;YACZ,SAAS,EAAE,CAAC;QACd,CAAC,EACD,KAAK,EAAE,CAAC,CAAC,OAAO,CAAC,EACjB,GAAG,EAAE,cAAc,YAEnB,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACD,CACvB,CAAC;IAEF,OAAO,CACL,MAAC,gBAAgB,OACX,SAAS,KACT,CAAC,OAAO,WAAW,KAAK,QAAQ;YAClC,CAAC,CAAC,EAAE,YAAY,EAAE,SAAS,EAAE;YAC7B,CAAC,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,CAAC,EACxC,KAAK,QACL,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,YAAY,EACtB,GAAG,EAAE,SAAS,aAEb,WAAW,IAAI,OAAO,IAAI,CACzB,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,EACvE,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EACnB,EAAE,EAAE,kBAAkB,aAErB,OAAO,WAAW,KAAK,QAAQ,CAAC,CAAC,CAAC,CACjC,OAAO,CACR,CAAC,CAAC,CAAC,CACF,KAAC,WAAW,IACV,OAAO,EAAE,OAAO,EAChB,SAAS,EACP,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,CACtB,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,YAAE,WAAW,CAAC,SAAS,GAAQ,CACzD,CAAC,CAAC,CAAC,SAAS,EAEf,MAAM,EAAE,WAAW,CAAC,MAAM,GAC1B,CACH,EACA,aAAa,IACT,CACR,EAEA,CAAC,CAAC,WAAW,IAAI,QAAQ,IAAI,YAAY,CAAC,IAAI,CAC7C,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAClC,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EACjB,EAAE,EAAE,mBAAmB,EACvB,GAAG,EAAE,gBAAgB,aAEpB,CAAC,WAAW,IAAI,aAAa,EAC7B,QAAQ,IAAI,CACX,KAAC,kBAAkB,IAAC,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,YACrD,QAAQ,GACU,CACtB,EACA,QAAQ,IACJ,CACR,IACgB,CACpB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import { forwardRef, useRef, useEffect } from 'react';\nimport type { PropsWithoutRef, FC, HTMLAttributes } from 'react';\n\nimport {\n  useConsolidatedRef,\n  useEscape,\n  useFocusTrap,\n  useI18n,\n  useOuterEvent,\n  useUID\n} from '../../hooks';\nimport Text from '../Text';\nimport Icon from '../Icon';\nimport Progress from '../Progress';\nimport Flex from '../Flex';\nimport SummaryItem from '../SummaryItem';\nimport { getFocusables } from '../../utils';\n\nimport { StyledChildrenWrap, StyledDialogContent, StyledDialogHeader } from './Dialog.styles';\nimport type { InfoDialogProps } from './Dialog.types';\nimport { StyledDismissButton, StyledInfoDialog } from './InfoDialog.styles';\n\nconst InfoDialog: FC<InfoDialogProps & HTMLAttributes<HTMLDivElement>> = forwardRef(\n  function InfoDialog(\n    {\n      target,\n      heading: headingProp,\n      children,\n      progress: progressProp,\n      onDismiss,\n      ...restProps\n    }: PropsWithoutRef<InfoDialogProps>,\n    ref: InfoDialogProps['ref']\n  ) {\n    const t = useI18n();\n    const headingId = useUID();\n    const dialogRef = useConsolidatedRef(ref);\n    const dialogContentRef = useRef<HTMLDivElement>(null);\n    const closeButtonRef = useRef<HTMLButtonElement>(null);\n\n    const setFocus = () => {\n      if (progressProp) return;\n\n      const focusables = getFocusables(dialogRef);\n\n      const focusable =\n        focusables.find(el => {\n          return dialogContentRef.current?.contains(el);\n        }) ??\n        closeButtonRef.current ??\n        focusables[0];\n\n      focusable?.focus();\n    };\n\n    useEscape(\n      e => {\n        onDismiss?.();\n        e.stopPropagation();\n      },\n      dialogRef,\n      [onDismiss]\n    );\n\n    useOuterEvent('mousedown', [target, dialogRef], () => {\n      onDismiss?.();\n    });\n\n    useFocusTrap(dialogRef, false);\n\n    useEffect(() => {\n      if (!progressProp) {\n        setFocus();\n      }\n    }, [progressProp]);\n\n    useEffect(() => {\n      const closeDialog = () => {\n        setTimeout(() => {\n          onDismiss?.();\n          // The 0 timeout ensures that the dialog will not re-open immediately after the close event is triggered.\n        }, 0);\n      };\n\n      target.addEventListener('click', closeDialog);\n\n      return () => {\n        if (document.contains(target)) {\n          target.focus();\n        }\n        target.removeEventListener('click', closeDialog);\n      };\n    }, []);\n\n    const heading = headingProp ? (\n      <Text id={headingId} variant='h2'>\n        {typeof headingProp === 'string' ? headingProp : headingProp.primary}\n      </Text>\n    ) : null;\n\n    const progress = (\n      <Progress\n        visible={!!progressProp}\n        focusOnVisible\n        placement='local'\n        message={typeof progressProp === 'string' ? progressProp : undefined}\n      />\n    );\n\n    const dismissButton = (\n      <StyledDismissButton\n        icon\n        variant='simple'\n        onClick={() => {\n          onDismiss();\n        }}\n        label={t('close')}\n        ref={closeButtonRef}\n      >\n        <Icon name='times' />\n      </StyledDismissButton>\n    );\n\n    return (\n      <StyledInfoDialog\n        {...restProps}\n        {...(typeof headingProp === 'string'\n          ? { labelledbyId: headingId }\n          : { ariaLabel: headingProp?.primary })}\n        arrow\n        target={target}\n        progress={progressProp}\n        ref={dialogRef}\n      >\n        {headingProp && heading && (\n          <Flex\n            container={{ alignItems: 'center', justify: 'between', pad: 2, gap: 1 }}\n            item={{ shrink: 0 }}\n            as={StyledDialogHeader}\n          >\n            {typeof headingProp === 'string' ? (\n              heading\n            ) : (\n              <SummaryItem\n                primary={heading}\n                secondary={\n                  headingProp.secondary ? (\n                    <Text variant='secondary'>{headingProp.secondary}</Text>\n                  ) : undefined\n                }\n                visual={headingProp.visual}\n              />\n            )}\n            {dismissButton}\n          </Flex>\n        )}\n\n        {(!headingProp || children || progressProp) && (\n          <Flex\n            container={{ direction: 'column' }}\n            item={{ grow: 1 }}\n            as={StyledDialogContent}\n            ref={dialogContentRef}\n          >\n            {!headingProp && dismissButton}\n            {children && (\n              <StyledChildrenWrap inert={progressProp ? '' : undefined}>\n                {children}\n              </StyledChildrenWrap>\n            )}\n            {progress}\n          </Flex>\n        )}\n      </StyledInfoDialog>\n    );\n  }\n);\n\nexport default InfoDialog;\n"]}
+{"version":3,"file":"InfoDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/InfoDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect } from 'react';\nimport type { PropsWithoutRef, FC, HTMLAttributes } from 'react';\n\nimport {\n  useConsolidatedRef,\n  useEscape,\n  useFocusTrap,\n  useI18n,\n  useOuterEvent,\n  useUID\n} from '../../hooks';\nimport Text from '../Text';\nimport Icon from '../Icon';\nimport Progress from '../Progress';\nimport Flex from '../Flex';\nimport SummaryItem from '../SummaryItem';\nimport { getFocusables } from '../../utils';\n\nimport { StyledChildrenWrap, StyledDialogContent, StyledDialogHeader } from './Dialog.styles';\nimport type { InfoDialogProps } from './Dialog.types';\nimport { StyledDismissButton, StyledInfoDialog } from './InfoDialog.styles';\n\nconst InfoDialog: FC<InfoDialogProps & HTMLAttributes<HTMLDivElement>> = forwardRef(\n  function InfoDialog(\n    {\n      target,\n      heading: headingProp,\n      children,\n      progress: progressProp,\n      onDismiss,\n      ...restProps\n    }: PropsWithoutRef<InfoDialogProps>,\n    ref: InfoDialogProps['ref']\n  ) {\n    const t = useI18n();\n    const headingId = useUID();\n    const dialogRef = useConsolidatedRef(ref);\n    const dialogContentRef = useRef<HTMLDivElement>(null);\n    const closeButtonRef = useRef<HTMLButtonElement>(null);\n\n    const setFocus = () => {\n      if (progressProp) return;\n\n      const focusables = getFocusables(dialogRef);\n\n      const focusable =\n        focusables.find(el => {\n          return dialogContentRef.current?.contains(el);\n        }) ??\n        closeButtonRef.current ??\n        focusables[0];\n\n      focusable?.focus();\n    };\n\n    useEscape(\n      e => {\n        onDismiss?.();\n        e.stopPropagation();\n      },\n      dialogRef,\n      [onDismiss]\n    );\n\n    useOuterEvent('mousedown', [target, dialogRef], () => {\n      onDismiss?.();\n    });\n\n    useFocusTrap(dialogRef, false);\n\n    useEffect(() => {\n      if (!progressProp) {\n        setFocus();\n      }\n    }, [progressProp]);\n\n    useEffect(() => {\n      const closeDialog = () => {\n        setTimeout(() => {\n          onDismiss?.();\n          // The 0 timeout ensures that the dialog will not re-open immediately after the close event is triggered.\n        }, 0);\n      };\n\n      target.addEventListener('click', closeDialog);\n\n      return () => {\n        if (document.contains(target)) {\n          target.focus();\n        }\n        target.removeEventListener('click', closeDialog);\n      };\n    }, []);\n\n    const heading = headingProp ? (\n      <Text id={headingId} variant='h2'>\n        {typeof headingProp === 'string' ? headingProp : headingProp.primary}\n      </Text>\n    ) : null;\n\n    const progress = (\n      <Progress\n        visible={!!progressProp}\n        focusOnVisible\n        placement='local'\n        message={typeof progressProp === 'string' ? progressProp : undefined}\n      />\n    );\n\n    const dismissButton = (\n      <StyledDismissButton\n        icon\n        variant='simple'\n        onClick={() => {\n          onDismiss();\n        }}\n        label={t('close')}\n        ref={closeButtonRef}\n      >\n        <Icon name='times' />\n      </StyledDismissButton>\n    );\n\n    return (\n      <StyledInfoDialog\n        {...restProps}\n        {...(typeof headingProp === 'string'\n          ? { labelledbyId: headingId }\n          : { ariaLabel: headingProp?.primary })}\n        arrow\n        target={target}\n        progress={progressProp}\n        ref={dialogRef}\n      >\n        {headingProp && heading && (\n          <Flex\n            container={{ alignItems: 'center', justify: 'between', pad: 2, gap: 1 }}\n            item={{ shrink: 0 }}\n            as={StyledDialogHeader}\n          >\n            {typeof headingProp === 'string' ? (\n              heading\n            ) : (\n              <SummaryItem\n                primary={heading}\n                secondary={\n                  headingProp.secondary ? (\n                    <Text variant='secondary'>{headingProp.secondary}</Text>\n                  ) : undefined\n                }\n                visual={headingProp.visual}\n              />\n            )}\n            {dismissButton}\n          </Flex>\n        )}\n\n        {(!headingProp || children || progressProp) && (\n          <Flex\n            container={{ direction: 'column' }}\n            item={{ grow: 1 }}\n            as={StyledDialogContent}\n            ref={dialogContentRef}\n          >\n            {!headingProp && dismissButton}\n            {children && (\n              <StyledChildrenWrap inert={progressProp ? '' : undefined}>\n                {children}\n              </StyledChildrenWrap>\n            )}\n            {progress}\n          </Flex>\n        )}\n      </StyledInfoDialog>\n    );\n  }\n);\n\nexport default InfoDialog;\n"]}

package/lib/components/Dialog/InfoDialog.styles.d.ts

@@ -1,6 +1,6 @@
 export declare const StyledDismissButton: import("styled-components").StyledComponent<import("react").FunctionComponent<import("../Button").ButtonProps & import("../..").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledInfoDialog: import("styled-components").StyledComponent<import("react").FC<import("./Dialog.types").BaseDialogProps & {
-    labelledbyId?: string | undefined;
-    ariaLabel?: string | undefined;
+    labelledbyId?: string;
+    ariaLabel?: string;
 } & import("react").HTMLAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
 //# sourceMappingURL=InfoDialog.styles.d.ts.map

package/lib/components/Drawer/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/Drawer/Drawer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAErE,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE7E,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAsD/C,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAA0C,KAAK,CAAC,EAAE;IACtF,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,eAAe,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IACnF,IAAI,SAAS,GAAG,YAAY,CAAC;IAC7B,IAAI,IAAI,GAAG,GAAG,CAAC;IACf,IAAI,MAAM,GAAG,KAAK,CAAC;IAEnB,IAAI,SAAS,KAAK,KAAK,IAAI,SAAS,KAAK,QAAQ,EAAE;QACjD,SAAS,GAAG,UAAU,CAAC;QACvB,IAAI,GAAG,GAAG,CAAC;QACX,MAAM,GAAG,MAAM,CAAC;KACjB;IAED,MAAM,SAAS,GAAG,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;IACvE,MAAM,KAAK,GAAG,eAAe,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC;IAE5D,OAAO,GAAG,CAAA;eACG,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,MAAM;gBAC3B,QAAQ;MAClB,SAAS;MACT,MAAM;cACE,SAAS,KAAK,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM;aACzC,SAAS,KAAK,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM;;+BAExB,KAAK;kCACF,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;iBACjD,KAAK,KAAK,MAAM;QAC3B,CAAC,CAAC,MAAM;QACR,CAAC,CAAC,YAAY,IAAI,IAAI,SAAS,KAAK,KAAK,IAAI,SAAS,KAAK,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,SAAS,GAAG;;MAE3F,MAAM;QACR,GAAG,CAAA;oBACa,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI;KACrC;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7C,MAAM,MAAM,GAAkD,UAAU,CAAC,SAAS,MAAM,CACtF,KAAkB,EAClB,GAAqB;IAErB,MAAM,EACJ,IAAI,GAAG,KAAK,EACZ,MAAM,GAAG,KAAK,EACd,QAAQ,GAAG,UAAU,EACrB,QAAQ,EACR,SAAS,GAAG,OAAO,EACnB,eAAe,EACf,IAAI,GAAG,MAAM,EACb,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,cAAc,GAAG,KAAK,EACtB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,SAAS,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAE1C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAQ,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IAEpE,IAAI,SAAS,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IACnC,IAAI,CAAC,SAAS;QAAE,SAAS,GAAG,KAAK,CAAC;IAElC,aAAa,CACX,WAAW,EACX,CAAC,SAAS,CAAC,EACX,WAAW,CAAC,GAAG,EAAE;QACf,IAAI,IAAI;YAAE,YAAY,EAAE,EAAE,CAAC;IAC7B,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC,CACzB,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,IAAI,CAAC,KAAK,KAAK,QAAQ,IAAI,KAAK,KAAK,SAAS,CAAC,EAAE;YACvD,YAAY,EAAE,EAAE,CAAC;YACjB,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;YAC1B,QAAQ,CAAC,SAAS,CAAC,CAAC;SACrB;aAAM,IAAI,CAAC,IAAI,IAAI,CAAC,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,SAAS,CAAC,EAAE;YAC7D,aAAa,EAAE,EAAE,CAAC;YAClB,QAAQ,CAAC,SAAS,CAAC,CAAC;SACrB;aAAM,IAAI,IAAI,IAAI,KAAK,KAAK,MAAM,IAAI,SAAS,KAAK,MAAM,EAAE;YAC3D,WAAW,EAAE,EAAE,CAAC;SACjB;aAAM,IAAI,CAAC,IAAI,IAAI,KAAK,KAAK,QAAQ,IAAI,SAAS,KAAK,QAAQ,EAAE;YAChE,YAAY,EAAE,EAAE,CAAC;SAClB;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,YAAY,CAAC,CAAC,CAAC;IAErF,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,CAAkB,EAAQ,EAAE;QAC3B,IAAI,CAAC,CAAC,MAAM,KAAK,SAAS,CAAC,OAAO,IAAI,CAAC,CAAC,YAAY,KAAK,WAAW;YAAE,OAAO;QAC7E,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IACrC,CAAC,EACD,CAAC,IAAI,CAAC,CACP,CAAC;IAEF,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,IAAI,IAAI,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC5D,KAAC,YAAY,IACX,GAAG,EAAE,SAAS,EACd,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,IAAI,IAAI,EACtB,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,eAAe,EAAE,eAAe,KAC5B,SAAS,YAEZ,QAAQ,GACI,CAChB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,MAAM,CAAC","sourcesContent":["import { useEffect, useCallback, forwardRef, useState } from 'react';\nimport type { Ref, FunctionComponent, ReactNode, TransitionEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useOuterEvent, useConsolidatedRef, usePrevious } from '../../hooks';\nimport type { AsProp, BaseProps, ForwardProps } from '../../types';\nimport { reflow } from '../../utils';\nimport { defaultThemeProp } from '../../theme';\n\nexport interface DrawerProps extends AsProp, BaseProps {\n  /**\n   * If true, the Drawer will be visible.\n   * @default false\n   */\n  open: boolean;\n  /** Content of the Drawer. */\n  children?: ReactNode;\n  /**\n   * Determines whether a drop shadow should be visible along the edge of the Drawer for contrast purposes.\n   * @default false\n   */\n  shadow?: boolean;\n  /**\n   * Used to determine which side of the viewport the Drawer should open from.\n   * @default 'right'\n   */\n  placement?: 'top' | 'right' | 'bottom' | 'left';\n  /**\n   * The position of the Drawer.\n   * @default 'absolute'\n   */\n  position?: 'absolute' | 'fixed';\n  /**\n   * Determines the speed of the transition. This value comes from `theme.base.animation.speed`.\n   * @default '0.25s'\n   */\n  transitionSpeed?: string;\n  /**\n   * The width or height that the Drawer will open to, depending on its placement.\n   * @default '100%'\n   */\n  size?: string;\n  /** Callback fired after Drawer opens. */\n  onAfterOpen?: () => void;\n  /** Callback fired after Drawer closes. */\n  onAfterClose?: () => void;\n  /** Callback fired before Drawer opens. */\n  onBeforeOpen?: () => void;\n  /** Callback fired before Drawer closes. */\n  onBeforeClose?: () => void;\n  /** Callback fired when a click action occurs outside of the Drawer. */\n  onOuterClick?: () => void;\n  /**\n   * If true, removes the component from the real DOM when closed. For full virtual DOM unmount(if necessary), perform at a parent level.\n   * @default false\n   */\n  nullWhenClosed?: boolean;\n}\n\ntype State = 'open' | 'closed' | 'opening' | 'closing';\n\nexport const StyledDrawer = styled.div<Partial<DrawerProps & { state: State }>>(props => {\n  const { state, shadow, position, placement, transitionSpeed, size, theme } = props;\n  let dimension = 'horizontal';\n  let axis = 'X';\n  let anchor = 'top';\n\n  if (placement === 'top' || placement === 'bottom') {\n    dimension = 'vertical';\n    axis = 'Y';\n    anchor = 'left';\n  }\n\n  const translate = state === 'open' || state === 'opening' ? 0 : '100%';\n  const speed = transitionSpeed || theme.base.animation.speed;\n\n  return css`\n    z-index: ${theme.base['z-index'].drawer};\n    position: ${position};\n    ${placement}: 0;\n    ${anchor}: 0;\n    height: ${dimension === 'vertical' ? size : '100%'};\n    width: ${dimension === 'horizontal' ? size : '100%'};\n    transition-property: transform, box-shadow, opacity;\n    transition-duration: max(${speed}, 0.0001s);\n    transition-timing-function: ${theme.base.animation.timing.ease};\n    transform: ${state === 'open'\n      ? 'none'\n      : `translate${axis}(${placement === 'top' || placement === 'left' ? '-' : ''}${translate})`};\n\n    ${shadow &&\n    css`\n      box-shadow: ${theme.base.shadow.high};\n    `}\n  `;\n});\n\nStyledDrawer.defaultProps = defaultThemeProp;\n\nconst Drawer: FunctionComponent<DrawerProps & ForwardProps> = forwardRef(function Drawer(\n  props: DrawerProps,\n  ref: Ref<HTMLElement>\n) {\n  const {\n    open = false,\n    shadow = false,\n    position = 'absolute',\n    children,\n    placement = 'right',\n    transitionSpeed,\n    size = '100%',\n    onAfterOpen,\n    onAfterClose,\n    onBeforeOpen,\n    onBeforeClose,\n    onOuterClick,\n    nullWhenClosed = false,\n    ...restProps\n  } = props;\n\n  const drawerRef = useConsolidatedRef(ref);\n\n  const [state, setState] = useState<State>(open ? 'open' : 'closed');\n\n  let prevState = usePrevious(state);\n  if (!prevState) prevState = state;\n\n  useOuterEvent(\n    'mousedown',\n    [drawerRef],\n    useCallback(() => {\n      if (open) onOuterClick?.();\n    }, [open, onOuterClick])\n  );\n\n  useEffect(() => {\n    if (open && (state === 'closed' || state === 'closing')) {\n      onBeforeOpen?.();\n      reflow(drawerRef.current);\n      setState('opening');\n    } else if (!open && (state === 'open' || state === 'opening')) {\n      onBeforeClose?.();\n      setState('closing');\n    } else if (open && state === 'open' && prevState !== 'open') {\n      onAfterOpen?.();\n    } else if (!open && state === 'closed' && prevState !== 'closed') {\n      onAfterClose?.();\n    }\n  }, [open, state, prevState, onBeforeOpen, onBeforeClose, onAfterOpen, onAfterClose]);\n\n  const onTransitionEnd = useCallback(\n    (e: TransitionEvent): void => {\n      if (e.target !== drawerRef.current || e.propertyName !== 'transform') return;\n      setState(open ? 'open' : 'closed');\n    },\n    [open]\n  );\n\n  return state === 'closed' && !open && nullWhenClosed ? null : (\n    <StyledDrawer\n      ref={drawerRef}\n      position={position}\n      shadow={shadow && open}\n      transitionSpeed={transitionSpeed}\n      placement={placement}\n      size={size}\n      open={open}\n      state={state}\n      onTransitionEnd={onTransitionEnd}\n      {...restProps}\n    >\n      {children}\n    </StyledDrawer>\n  );\n});\n\nexport default Drawer;\n"]}
+{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/Drawer/Drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useCallback, forwardRef, useState } from 'react';\nimport type { Ref, FunctionComponent, ReactNode, TransitionEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useOuterEvent, useConsolidatedRef, usePrevious } from '../../hooks';\nimport type { AsProp, BaseProps, ForwardProps } from '../../types';\nimport { reflow } from '../../utils';\nimport { defaultThemeProp } from '../../theme';\n\nexport interface DrawerProps extends AsProp, BaseProps {\n  /**\n   * If true, the Drawer will be visible.\n   * @default false\n   */\n  open: boolean;\n  /** Content of the Drawer. */\n  children?: ReactNode;\n  /**\n   * Determines whether a drop shadow should be visible along the edge of the Drawer for contrast purposes.\n   * @default false\n   */\n  shadow?: boolean;\n  /**\n   * Used to determine which side of the viewport the Drawer should open from.\n   * @default 'right'\n   */\n  placement?: 'top' | 'right' | 'bottom' | 'left';\n  /**\n   * The position of the Drawer.\n   * @default 'absolute'\n   */\n  position?: 'absolute' | 'fixed';\n  /**\n   * Determines the speed of the transition. This value comes from `theme.base.animation.speed`.\n   * @default '0.25s'\n   */\n  transitionSpeed?: string;\n  /**\n   * The width or height that the Drawer will open to, depending on its placement.\n   * @default '100%'\n   */\n  size?: string;\n  /** Callback fired after Drawer opens. */\n  onAfterOpen?: () => void;\n  /** Callback fired after Drawer closes. */\n  onAfterClose?: () => void;\n  /** Callback fired before Drawer opens. */\n  onBeforeOpen?: () => void;\n  /** Callback fired before Drawer closes. */\n  onBeforeClose?: () => void;\n  /** Callback fired when a click action occurs outside of the Drawer. */\n  onOuterClick?: () => void;\n  /**\n   * If true, removes the component from the real DOM when closed. For full virtual DOM unmount(if necessary), perform at a parent level.\n   * @default false\n   */\n  nullWhenClosed?: boolean;\n}\n\ntype State = 'open' | 'closed' | 'opening' | 'closing';\n\nexport const StyledDrawer = styled.div<Partial<DrawerProps & { state: State }>>(props => {\n  const { state, shadow, position, placement, transitionSpeed, size, theme } = props;\n  let dimension = 'horizontal';\n  let axis = 'X';\n  let anchor = 'top';\n\n  if (placement === 'top' || placement === 'bottom') {\n    dimension = 'vertical';\n    axis = 'Y';\n    anchor = 'left';\n  }\n\n  const translate = state === 'open' || state === 'opening' ? 0 : '100%';\n  const speed = transitionSpeed || theme.base.animation.speed;\n\n  return css`\n    z-index: ${theme.base['z-index'].drawer};\n    position: ${position};\n    ${placement}: 0;\n    ${anchor}: 0;\n    height: ${dimension === 'vertical' ? size : '100%'};\n    width: ${dimension === 'horizontal' ? size : '100%'};\n    transition-property: transform, box-shadow, opacity;\n    transition-duration: max(${speed}, 0.0001s);\n    transition-timing-function: ${theme.base.animation.timing.ease};\n    transform: ${state === 'open'\n      ? 'none'\n      : `translate${axis}(${placement === 'top' || placement === 'left' ? '-' : ''}${translate})`};\n\n    ${shadow &&\n    css`\n      box-shadow: ${theme.base.shadow.high};\n    `}\n  `;\n});\n\nStyledDrawer.defaultProps = defaultThemeProp;\n\nconst Drawer: FunctionComponent<DrawerProps & ForwardProps> = forwardRef(function Drawer(\n  props: DrawerProps,\n  ref: Ref<HTMLElement>\n) {\n  const {\n    open = false,\n    shadow = false,\n    position = 'absolute',\n    children,\n    placement = 'right',\n    transitionSpeed,\n    size = '100%',\n    onAfterOpen,\n    onAfterClose,\n    onBeforeOpen,\n    onBeforeClose,\n    onOuterClick,\n    nullWhenClosed = false,\n    ...restProps\n  } = props;\n\n  const drawerRef = useConsolidatedRef(ref);\n\n  const [state, setState] = useState<State>(open ? 'open' : 'closed');\n\n  let prevState = usePrevious(state);\n  if (!prevState) prevState = state;\n\n  useOuterEvent(\n    'mousedown',\n    [drawerRef],\n    useCallback(() => {\n      if (open) onOuterClick?.();\n    }, [open, onOuterClick])\n  );\n\n  useEffect(() => {\n    if (open && (state === 'closed' || state === 'closing')) {\n      onBeforeOpen?.();\n      reflow(drawerRef.current);\n      setState('opening');\n    } else if (!open && (state === 'open' || state === 'opening')) {\n      onBeforeClose?.();\n      setState('closing');\n    } else if (open && state === 'open' && prevState !== 'open') {\n      onAfterOpen?.();\n    } else if (!open && state === 'closed' && prevState !== 'closed') {\n      onAfterClose?.();\n    }\n  }, [open, state, prevState, onBeforeOpen, onBeforeClose, onAfterOpen, onAfterClose]);\n\n  const onTransitionEnd = useCallback(\n    (e: TransitionEvent): void => {\n      if (e.target !== drawerRef.current || e.propertyName !== 'transform') return;\n      setState(open ? 'open' : 'closed');\n    },\n    [open]\n  );\n\n  return state === 'closed' && !open && nullWhenClosed ? null : (\n    <StyledDrawer\n      ref={drawerRef}\n      position={position}\n      shadow={shadow && open}\n      transitionSpeed={transitionSpeed}\n      placement={placement}\n      size={size}\n      open={open}\n      state={state}\n      onTransitionEnd={onTransitionEnd}\n      {...restProps}\n    >\n      {children}\n    </StyledDrawer>\n  );\n});\n\nexport default Drawer;\n"]}

package/lib/components/EmojiPicker/EmojiDisplay.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmojiDisplay.js","sourceRoot":"","sources":["../../../src/components/EmojiPicker/EmojiDisplay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,UAAU,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,sBAAsB,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAE3D,OAAO,IAAI,MAAM,0BAA0B,CAAC;AAG5C,OAAO,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC;AAEtD,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAQ7C,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAA;;;;;CAKrC,CAAC;AACF,MAAM,YAAY,GAAyC,KAAK,CAAC,EAAE;IACjE,MAAM,EAAE,OAAO,EAAE,IAAI,GAAG,EAAE,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACnD,MAAM,KAAK,GAAG,UAAU,EAAE,CAAC;IAC3B,IAAI,MAAM,GAAkB,EAAE,CAAC;IAC/B,MAAM,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IACnD,IAAI,OAAO,OAAO,KAAK,QAAQ,IAAI,QAAQ,EAAE;QAC3C,MAAM,WAAW,GAAG,CAAC,MAAc,EAAE,EAAE;YACrC,MAAM,SAAS,GAAG,sBAAsB,CAAC,MAAM,EAAE,QAAQ,EAAE,IAA6B,CAAC,CAAC;YAC1F,OAAO,SAAS,IAAI,KAAC,KAAK,IAAC,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,GAAI,CAAC;QAC7E,CAAC,CAAC;QACF,IAAI,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE;YACnC,MAAM,GAAG,uBAAuB,CAAC,OAAO,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC;SAC/D;KACF;IACD,OAAO,QAAQ,IAAI,MAAM,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,CAAC,CACtC,KAAC,kBAAkB,OAAK,SAAS,YAAG,MAAM,GAAsB,CACjE,CAAC,CAAC,CAAC,CACF,4BAAG,OAAO,GAAI,CACf,CAAC;AACJ,CAAC,CAAC;AACF,eAAe,YAAY,CAAC","sourcesContent":["import { useContext } from 'react';\nimport type { FunctionComponent, ReactNode } from 'react';\nimport styled from 'styled-components';\nimport emojiRegex from 'emoji-regex';\nimport { getEmojiDataFromNative, Emoji } from 'emoji-mart';\nimport type { Data as NativeData } from 'emoji-mart';\nimport data from 'emoji-mart/data/all.json';\n\nimport type { BaseProps, NoChildrenProp } from '../../types';\nimport { replaceMatchWithElement } from '../../utils';\n\nimport { EmojiContext } from './EmojiPicker';\n\nexport interface EmojiDisplayProps extends BaseProps, NoChildrenProp {\n  /** Content to be displayed */\n  content: ReactNode;\n  /** Size of emoji */\n  size?: number;\n}\nconst StyledEmojiDisplay = styled.span`\n  .emoji-mart-emoji {\n    line-height: 1;\n    vertical-align: middle;\n  }\n`;\nconst EmojiDisplay: FunctionComponent<EmojiDisplayProps> = props => {\n  const { content, size = 20, ...restProps } = props;\n  const regex = emojiRegex();\n  let msgArr: JSX.Element[] = [];\n  const { set: emojiSet } = useContext(EmojiContext);\n  if (typeof content === 'string' && emojiSet) {\n    const renderEmoji = (eMatch: string) => {\n      const emojiData = getEmojiDataFromNative(eMatch, emojiSet, data as unknown as NativeData);\n      return emojiData && <Emoji set={emojiSet} emoji={emojiData} size={size} />;\n    };\n    if (content.split(regex).length > 1) {\n      msgArr = replaceMatchWithElement(content, regex, renderEmoji);\n    }\n  }\n  return emojiSet && msgArr.length >= 1 ? (\n    <StyledEmojiDisplay {...restProps}>{msgArr}</StyledEmojiDisplay>\n  ) : (\n    <>{content}</>\n  );\n};\nexport default EmojiDisplay;\n"]}
+{"version":3,"file":"EmojiDisplay.js","sourceRoot":"","sources":["../../../src/components/EmojiPicker/EmojiDisplay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,UAAU,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,sBAAsB,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAE3D,OAAO,IAAI,MAAM,0BAA0B,CAAC;AAG5C,OAAO,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC;AAEtD,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAQ7C,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAA;;;;;CAKrC,CAAC;AACF,MAAM,YAAY,GAAyC,KAAK,CAAC,EAAE;IACjE,MAAM,EAAE,OAAO,EAAE,IAAI,GAAG,EAAE,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACnD,MAAM,KAAK,GAAG,UAAU,EAAE,CAAC;IAC3B,IAAI,MAAM,GAAkB,EAAE,CAAC;IAC/B,MAAM,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IACnD,IAAI,OAAO,OAAO,KAAK,QAAQ,IAAI,QAAQ,EAAE,CAAC;QAC5C,MAAM,WAAW,GAAG,CAAC,MAAc,EAAE,EAAE;YACrC,MAAM,SAAS,GAAG,sBAAsB,CAAC,MAAM,EAAE,QAAQ,EAAE,IAA6B,CAAC,CAAC;YAC1F,OAAO,SAAS,IAAI,KAAC,KAAK,IAAC,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,GAAI,CAAC;QAC7E,CAAC,CAAC;QACF,IAAI,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACpC,MAAM,GAAG,uBAAuB,CAAC,OAAO,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC;QAChE,CAAC;IACH,CAAC;IACD,OAAO,QAAQ,IAAI,MAAM,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,CAAC,CACtC,KAAC,kBAAkB,OAAK,SAAS,YAAG,MAAM,GAAsB,CACjE,CAAC,CAAC,CAAC,CACF,4BAAG,OAAO,GAAI,CACf,CAAC;AACJ,CAAC,CAAC;AACF,eAAe,YAAY,CAAC","sourcesContent":["import { useContext } from 'react';\nimport type { FunctionComponent, ReactNode } from 'react';\nimport styled from 'styled-components';\nimport emojiRegex from 'emoji-regex';\nimport { getEmojiDataFromNative, Emoji } from 'emoji-mart';\nimport type { Data as NativeData } from 'emoji-mart';\nimport data from 'emoji-mart/data/all.json';\n\nimport type { BaseProps, NoChildrenProp } from '../../types';\nimport { replaceMatchWithElement } from '../../utils';\n\nimport { EmojiContext } from './EmojiPicker';\n\nexport interface EmojiDisplayProps extends BaseProps, NoChildrenProp {\n  /** Content to be displayed */\n  content: ReactNode;\n  /** Size of emoji */\n  size?: number;\n}\nconst StyledEmojiDisplay = styled.span`\n  .emoji-mart-emoji {\n    line-height: 1;\n    vertical-align: middle;\n  }\n`;\nconst EmojiDisplay: FunctionComponent<EmojiDisplayProps> = props => {\n  const { content, size = 20, ...restProps } = props;\n  const regex = emojiRegex();\n  let msgArr: JSX.Element[] = [];\n  const { set: emojiSet } = useContext(EmojiContext);\n  if (typeof content === 'string' && emojiSet) {\n    const renderEmoji = (eMatch: string) => {\n      const emojiData = getEmojiDataFromNative(eMatch, emojiSet, data as unknown as NativeData);\n      return emojiData && <Emoji set={emojiSet} emoji={emojiData} size={size} />;\n    };\n    if (content.split(regex).length > 1) {\n      msgArr = replaceMatchWithElement(content, regex, renderEmoji);\n    }\n  }\n  return emojiSet && msgArr.length >= 1 ? (\n    <StyledEmojiDisplay {...restProps}>{msgArr}</StyledEmojiDisplay>\n  ) : (\n    <>{content}</>\n  );\n};\nexport default EmojiDisplay;\n"]}

package/lib/components/EmojiPicker/EmojiPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmojiPicker.js","sourceRoot":"","sources":["../../../src/components/EmojiPicker/EmojiPicker.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnF,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1C,OAAO,GAAG,MAAM,0BAA0B,CAAC;AAC3C,OAAO,KAAK,MAAM,4BAA4B,CAAC;AAC/C,OAAO,MAAM,MAAM,6BAA6B,CAAC;AACjD,OAAO,OAAO,MAAM,8BAA8B,CAAC;AACnD,OAAO,QAAQ,MAAM,+BAA+B,CAAC;AAErD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAGvC,OAAO,iBAAiB,MAAM,sBAAsB,CAAC;AAiCrD,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAAoB,EAAE,CAAC,CAAC;AACjE,MAAM,WAAW,GAAwC,UAAU,CAAC,SAAS,WAAW,CACtF,EACE,SAAS,GAAG,EAAE,EACd,OAAO,GAAG,CAAC,EACX,UAAU,GAAG,IAAI,EACjB,OAAO,EACP,QAAQ,EACR,GAAG,SAAS,EACsB,EACpC,GAAwB;IAExB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,EAAE,GAAG,EAAE,iBAAiB,EAAE,YAAY,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IAC1E,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAgC,IAAI,CAAC,CAAC;IAEtE,SAAS,CAAC,GAAG,EAAE;QACb,kDAAkD;QAClD,OAAO,CAAC,IAAI,CAAC,CAAC;QAEd,UAAU,CAAC,GAAG,EAAE;YACd,IAAI,YAAY,EAAE;gBAChB,OAAO,CAAC,YAAY,CAAC,CAAC;aACvB;iBAAM;gBACL,QAAQ,GAAG,EAAE;oBACX,KAAK,OAAO;wBACV,OAAO,CAAC,KAAK,CAAC,CAAC;wBACf,MAAM;oBACR,KAAK,QAAQ;wBACX,OAAO,CAAC,MAAM,CAAC,CAAC;wBAChB,MAAM;oBACR,KAAK,SAAS;wBACZ,OAAO,CAAC,OAAO,CAAC,CAAC;wBACjB,MAAM;oBACR,KAAK,UAAU;wBACb,OAAO,CAAC,QAAQ,CAAC,CAAC;wBAClB,MAAM;oBACR;wBACE,OAAO,CAAC,GAAG,CAAC,CAAC;wBACb,MAAM;iBACT;aACF;QACH,CAAC,EAAE,CAAC,CAAC,CAAC;IACR,CAAC,EAAE,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC,CAAC;IAExB,OAAO,CACL,IAAI,IAAI,CACN,KAAC,iBAAiB,IAChB,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,EAAE,cAAc,EAAE,GAAG,SAAS,IAAI,EAAmB,YAE5D,KAAC,YAAY,OACP,SAAS,EACb,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,CAAC,iBAAiB,EAC1B,iBAAiB,EAAE,iBAAiB,EACpC,IAAI,EAAE,IAAiB,EACvB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,EACrC,KAAK,EAAC,EAAE,EACR,KAAK,EAAC,EAAE,EACR,YAAY,QACZ,aAAa,EAAE,UAAU,EACzB,WAAW,EAAE,KAAK,GAClB,GACgB,CACrB,CACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,WAAW,CAAC","sourcesContent":["import { useState, useEffect, useContext, createContext, forwardRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, CSSProperties, Ref } from 'react';\nimport { NimblePicker } from 'emoji-mart';\nimport type { CategoryName, Data as EmojiData, BackgroundImageFn, PickerProps } from 'emoji-mart';\nimport all from 'emoji-mart/data/all.json';\nimport apple from 'emoji-mart/data/apple.json';\nimport google from 'emoji-mart/data/google.json';\nimport twitter from 'emoji-mart/data/twitter.json';\nimport facebook from 'emoji-mart/data/facebook.json';\n\nimport { useTheme } from '../../hooks';\nimport type { BaseProps, DeepPartial, NoChildrenProp } from '../../types';\n\nimport StyledEmojiPicker from './EmojiPicker.styles';\n\ntype EmojiSet = 'apple' | 'google' | 'twitter' | 'facebook';\n\nexport interface EmojiPickerProps extends BaseProps, NoChildrenProp {\n  /** Individual emojis size in pixels. */\n  emojiSize?: number;\n  /** Number of emoji per line in a picker. */\n  perLine?: number;\n  /** Don't load excluded categories. Accepts [I18n categories keys](https://www.npmjs.com/package/emoji-mart#i18n). */\n  exclude?: CategoryName[];\n  /** Show footer for picker. */\n  showFooter?: boolean;\n  /** A Fn that gets called on selecting an emoji from picker. */\n  onSelect?: PickerProps['onSelect'];\n  /** Ref for the emoji Picker */\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport interface EmojiContextValue {\n  /**\n   * A Fn that returns that image sheet to use for emojis.\n   * If no sprite is provided, native emoji are used.\n   * For the source of image please visit this [link](https://www.jsdelivr.com/package/npm/emoji-datasource?version=5.0.1&path=img)\n   */\n  spriteSrcResolver?: BackgroundImageFn;\n  /** Emoji set to be used. */\n  set?: EmojiSet;\n  /** Data to be used. [link](https://github.com/iamcal/emoji-data).\n   * Use this in case you would like to filter out some emoji, one must change the sprite image accordingly. */\n  overrideData?: EmojiData;\n}\n\nexport const EmojiContext = createContext<EmojiContextValue>({});\nconst EmojiPicker: FunctionComponent<EmojiPickerProps> = forwardRef(function EmojiPicker(\n  {\n    emojiSize = 24,\n    perLine = 9,\n    showFooter = true,\n    exclude,\n    onSelect,\n    ...restProps\n  }: PropsWithoutRef<EmojiPickerProps>,\n  ref: Ref<HTMLDivElement>\n) {\n  const theme = useTheme();\n  const { set, spriteSrcResolver, overrideData } = useContext(EmojiContext);\n  const [data, setData] = useState<DeepPartial<EmojiData> | null>(null);\n\n  useEffect(() => {\n    // Unmount NimblePicker for changes to take effect\n    setData(null);\n\n    setTimeout(() => {\n      if (overrideData) {\n        setData(overrideData);\n      } else {\n        switch (set) {\n          case 'apple':\n            setData(apple);\n            break;\n          case 'google':\n            setData(google);\n            break;\n          case 'twitter':\n            setData(twitter);\n            break;\n          case 'facebook':\n            setData(facebook);\n            break;\n          default:\n            setData(all);\n            break;\n        }\n      }\n    }, 0);\n  }, [set, overrideData]);\n\n  return (\n    data && (\n      <StyledEmojiPicker\n        ref={ref}\n        showFooter={showFooter}\n        style={{ '--emoji-size': `${emojiSize}px` } as CSSProperties}\n      >\n        <NimblePicker\n          {...restProps}\n          set={set}\n          native={!spriteSrcResolver}\n          backgroundImageFn={spriteSrcResolver}\n          data={data as EmojiData}\n          emojiSize={emojiSize}\n          perLine={perLine}\n          exclude={exclude}\n          onSelect={onSelect}\n          color={theme.base.palette.interactive}\n          emoji=''\n          title=''\n          emojiTooltip\n          showSkinTones={showFooter}\n          showPreview={false}\n        />\n      </StyledEmojiPicker>\n    )\n  );\n});\n\nexport default EmojiPicker;\n"]}
+{"version":3,"file":"EmojiPicker.js","sourceRoot":"","sources":["../../../src/components/EmojiPicker/EmojiPicker.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnF,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1C,OAAO,GAAG,MAAM,0BAA0B,CAAC;AAC3C,OAAO,KAAK,MAAM,4BAA4B,CAAC;AAC/C,OAAO,MAAM,MAAM,6BAA6B,CAAC;AACjD,OAAO,OAAO,MAAM,8BAA8B,CAAC;AACnD,OAAO,QAAQ,MAAM,+BAA+B,CAAC;AAErD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAGvC,OAAO,iBAAiB,MAAM,sBAAsB,CAAC;AAiCrD,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAAoB,EAAE,CAAC,CAAC;AACjE,MAAM,WAAW,GAAwC,UAAU,CAAC,SAAS,WAAW,CACtF,EACE,SAAS,GAAG,EAAE,EACd,OAAO,GAAG,CAAC,EACX,UAAU,GAAG,IAAI,EACjB,OAAO,EACP,QAAQ,EACR,GAAG,SAAS,EACsB,EACpC,GAAwB;IAExB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,EAAE,GAAG,EAAE,iBAAiB,EAAE,YAAY,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IAC1E,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAgC,IAAI,CAAC,CAAC;IAEtE,SAAS,CAAC,GAAG,EAAE;QACb,kDAAkD;QAClD,OAAO,CAAC,IAAI,CAAC,CAAC;QAEd,UAAU,CAAC,GAAG,EAAE;YACd,IAAI,YAAY,EAAE,CAAC;gBACjB,OAAO,CAAC,YAAY,CAAC,CAAC;YACxB,CAAC;iBAAM,CAAC;gBACN,QAAQ,GAAG,EAAE,CAAC;oBACZ,KAAK,OAAO;wBACV,OAAO,CAAC,KAAK,CAAC,CAAC;wBACf,MAAM;oBACR,KAAK,QAAQ;wBACX,OAAO,CAAC,MAAM,CAAC,CAAC;wBAChB,MAAM;oBACR,KAAK,SAAS;wBACZ,OAAO,CAAC,OAAO,CAAC,CAAC;wBACjB,MAAM;oBACR,KAAK,UAAU;wBACb,OAAO,CAAC,QAAQ,CAAC,CAAC;wBAClB,MAAM;oBACR;wBACE,OAAO,CAAC,GAAG,CAAC,CAAC;wBACb,MAAM;gBACV,CAAC;YACH,CAAC;QACH,CAAC,EAAE,CAAC,CAAC,CAAC;IACR,CAAC,EAAE,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC,CAAC;IAExB,OAAO,CACL,IAAI,IAAI,CACN,KAAC,iBAAiB,IAChB,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,EAAE,cAAc,EAAE,GAAG,SAAS,IAAI,EAAmB,YAE5D,KAAC,YAAY,OACP,SAAS,EACb,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,CAAC,iBAAiB,EAC1B,iBAAiB,EAAE,iBAAiB,EACpC,IAAI,EAAE,IAAiB,EACvB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,EACrC,KAAK,EAAC,EAAE,EACR,KAAK,EAAC,EAAE,EACR,YAAY,QACZ,aAAa,EAAE,UAAU,EACzB,WAAW,EAAE,KAAK,GAClB,GACgB,CACrB,CACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,WAAW,CAAC","sourcesContent":["import { useState, useEffect, useContext, createContext, forwardRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, CSSProperties, Ref } from 'react';\nimport { NimblePicker } from 'emoji-mart';\nimport type { CategoryName, Data as EmojiData, BackgroundImageFn, PickerProps } from 'emoji-mart';\nimport all from 'emoji-mart/data/all.json';\nimport apple from 'emoji-mart/data/apple.json';\nimport google from 'emoji-mart/data/google.json';\nimport twitter from 'emoji-mart/data/twitter.json';\nimport facebook from 'emoji-mart/data/facebook.json';\n\nimport { useTheme } from '../../hooks';\nimport type { BaseProps, DeepPartial, NoChildrenProp } from '../../types';\n\nimport StyledEmojiPicker from './EmojiPicker.styles';\n\ntype EmojiSet = 'apple' | 'google' | 'twitter' | 'facebook';\n\nexport interface EmojiPickerProps extends BaseProps, NoChildrenProp {\n  /** Individual emojis size in pixels. */\n  emojiSize?: number;\n  /** Number of emoji per line in a picker. */\n  perLine?: number;\n  /** Don't load excluded categories. Accepts [I18n categories keys](https://www.npmjs.com/package/emoji-mart#i18n). */\n  exclude?: CategoryName[];\n  /** Show footer for picker. */\n  showFooter?: boolean;\n  /** A Fn that gets called on selecting an emoji from picker. */\n  onSelect?: PickerProps['onSelect'];\n  /** Ref for the emoji Picker */\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport interface EmojiContextValue {\n  /**\n   * A Fn that returns that image sheet to use for emojis.\n   * If no sprite is provided, native emoji are used.\n   * For the source of image please visit this [link](https://www.jsdelivr.com/package/npm/emoji-datasource?version=5.0.1&path=img)\n   */\n  spriteSrcResolver?: BackgroundImageFn;\n  /** Emoji set to be used. */\n  set?: EmojiSet;\n  /** Data to be used. [link](https://github.com/iamcal/emoji-data).\n   * Use this in case you would like to filter out some emoji, one must change the sprite image accordingly. */\n  overrideData?: EmojiData;\n}\n\nexport const EmojiContext = createContext<EmojiContextValue>({});\nconst EmojiPicker: FunctionComponent<EmojiPickerProps> = forwardRef(function EmojiPicker(\n  {\n    emojiSize = 24,\n    perLine = 9,\n    showFooter = true,\n    exclude,\n    onSelect,\n    ...restProps\n  }: PropsWithoutRef<EmojiPickerProps>,\n  ref: Ref<HTMLDivElement>\n) {\n  const theme = useTheme();\n  const { set, spriteSrcResolver, overrideData } = useContext(EmojiContext);\n  const [data, setData] = useState<DeepPartial<EmojiData> | null>(null);\n\n  useEffect(() => {\n    // Unmount NimblePicker for changes to take effect\n    setData(null);\n\n    setTimeout(() => {\n      if (overrideData) {\n        setData(overrideData);\n      } else {\n        switch (set) {\n          case 'apple':\n            setData(apple);\n            break;\n          case 'google':\n            setData(google);\n            break;\n          case 'twitter':\n            setData(twitter);\n            break;\n          case 'facebook':\n            setData(facebook);\n            break;\n          default:\n            setData(all);\n            break;\n        }\n      }\n    }, 0);\n  }, [set, overrideData]);\n\n  return (\n    data && (\n      <StyledEmojiPicker\n        ref={ref}\n        showFooter={showFooter}\n        style={{ '--emoji-size': `${emojiSize}px` } as CSSProperties}\n      >\n        <NimblePicker\n          {...restProps}\n          set={set}\n          native={!spriteSrcResolver}\n          backgroundImageFn={spriteSrcResolver}\n          data={data as EmojiData}\n          emojiSize={emojiSize}\n          perLine={perLine}\n          exclude={exclude}\n          onSelect={onSelect}\n          color={theme.base.palette.interactive}\n          emoji=''\n          title=''\n          emojiTooltip\n          showSkinTones={showFooter}\n          showPreview={false}\n        />\n      </StyledEmojiPicker>\n    )\n  );\n});\n\nexport default EmojiPicker;\n"]}

package/lib/components/ExpandCollapse/ExpandCollapse.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandCollapse.js","sourceRoot":"","sources":["../../../src/components/ExpandCollapse/ExpandCollapse.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useLayoutEffect, useCallback } from 'react';\nimport type { FunctionComponent, Ref, ReactNode, PropsWithoutRef, CSSProperties } from 'react';\n\nimport type { ForwardProps, BaseProps, AsProp, PropsWithDefaults } from '../../types';\nimport { useConsolidatedRef, usePrevious, useTheme } from '../../hooks';\n\nexport interface ExpandCollapseProps extends AsProp, BaseProps {\n  /** Content to expand/collapse. */\n  children?: ReactNode;\n  /**\n   * If true,the content will be hidden.\n   * @default false\n   */\n  collapsed?: boolean;\n  /**\n   * Used to determine the transition property.\n   * @default 'height'\n   */\n  dimension?: 'height' | 'width';\n  /** Minimum height/width to collapse to. This will set the starting collapsed size as well. */\n  min?: string;\n  /** Maximum height/width to expand to. Expanded state will expanded up until, but not beyond, the natural height/width of the element. */\n  max?: string;\n  /** Callback fired after content collapsed. */\n  onAfterCollapse?: () => void;\n  /** Callback fired after content expanded. */\n  onAfterExpand?: () => void;\n  /** Callback fired before content collapsed. */\n  onBeforeCollapse?: () => void;\n  /** Callback fired before content expanded. */\n  onBeforeExpand?: () => void;\n  /**\n   * Determine the speed of animation. This value comes from `theme.base.animation.speed`.\n   * @default '0.25s'\n   */\n  transitionSpeed?: string;\n  /**\n   * If true, removes the component from the real DOM when collapsed. For full virtual DOM unmount(if necessary), perform at a parent level.\n   * @default false\n   */\n  nullWhenCollapsed?: boolean;\n}\n\ntype ExpandCollapsePropsWithDefaults = PropsWithDefaults<\n  ExpandCollapseProps,\n  'collapsed' | 'dimension' | 'transitionSpeed' | 'nullWhenCollapsed'\n>;\n\ntype Statuses = 'collapsed' | 'collapsing' | 'expanded' | 'expanding';\n\ninterface GetStyleProps\n  extends Pick<\n    ExpandCollapsePropsWithDefaults,\n    'dimension' | 'transitionSpeed' | 'min' | 'max' | 'nullWhenCollapsed'\n  > {\n  status: Statuses;\n  el?: HTMLElement | null;\n  transitionTimingFunction?: string;\n}\n\nconst getScrollSize = (\n  el: HTMLElement,\n  dimension: ExpandCollapsePropsWithDefaults['dimension']\n): string => {\n  if (!el) return '';\n  return dimension === 'height' ? `${el.scrollHeight}px` : `${el.scrollWidth}px`;\n};\n\nconst getStyle = (props: GetStyleProps): CSSProperties => {\n  const {\n    status,\n    dimension,\n    transitionSpeed,\n    transitionTimingFunction,\n    min,\n    max,\n    nullWhenCollapsed,\n    el\n  } = props;\n  const style: CSSProperties = {};\n  let maxSize = max;\n\n  if (el && !max) {\n    maxSize = getScrollSize(el, dimension!);\n  }\n\n  if (status === 'expanded' || status === 'collapsed') {\n    if (max || min) {\n      style[dimension as 'height' | 'width'] = status === 'expanded' ? maxSize : min || 0;\n      style[`overflow${dimension === 'width' ? 'X' : 'Y'}`] = 'hidden';\n    }\n\n    if (status === 'collapsed' && !nullWhenCollapsed && !min) {\n      style.display = 'none';\n    }\n  }\n\n  if (status === 'expanding' || status === 'collapsing') {\n    style[dimension as 'height' | 'width'] = status === 'expanding' ? maxSize : min || 0;\n    style.overflow = 'hidden';\n    style.transitionProperty = dimension;\n    style.transitionDuration = `max(${transitionSpeed}, 0.01ms)`;\n    style.transitionTimingFunction = transitionTimingFunction;\n  }\n\n  return style;\n};\n\nconst ExpandCollapse: FunctionComponent<ExpandCollapseProps & ForwardProps> = forwardRef(\n  function ExpandCollapse(props: PropsWithoutRef<ExpandCollapseProps>, refArg: Ref<HTMLElement>) {\n    const {\n      base: { animation: themeAnimation }\n    } = useTheme();\n\n    const {\n      children,\n      dimension = 'height',\n      collapsed = false,\n      onBeforeExpand,\n      onAfterExpand,\n      onBeforeCollapse,\n      onAfterCollapse,\n      transitionSpeed = themeAnimation.speed,\n      min,\n      max,\n      nullWhenCollapsed = false,\n      as: Tag = 'div',\n      ...restProps\n    } = props;\n\n    const [status, setStatus] = useState<Statuses>(collapsed ? 'collapsed' : 'expanded');\n    const styleStateHook = useState<CSSProperties>();\n    const setStyle = styleStateHook[1];\n    let style = styleStateHook[0];\n    const previousStatus = usePrevious(status);\n    const ref = useConsolidatedRef(refArg);\n\n    const onTransitionEnd = useCallback(\n      (e: TransitionEvent) => {\n        if (e.target !== ref.current || e.propertyName !== dimension) return;\n        setStatus(status === 'expanding' ? 'expanded' : 'collapsed');\n      },\n      [ref.current, status]\n    );\n\n    useLayoutEffect(() => {\n      const wantsToCollapse = collapsed;\n      const wantsToExpand = !collapsed;\n      const canCollapse = ['expanded', 'expanding'].includes(status);\n      const canExpand = ['collapsed', 'collapsing'].includes(status);\n\n      if (wantsToExpand && canExpand) {\n        onBeforeExpand?.();\n        setStatus('expanding');\n      } else if (wantsToCollapse && canCollapse) {\n        onBeforeCollapse?.();\n        setStatus('collapsing');\n      }\n\n      if (status === 'expanded' && previousStatus !== 'expanded') {\n        onAfterExpand?.();\n      } else if (status === 'collapsed' && previousStatus !== 'collapsed') {\n        onAfterCollapse?.();\n      }\n\n      setStyle(\n        getStyle({\n          dimension,\n          min,\n          max,\n          transitionSpeed,\n          nullWhenCollapsed,\n          status,\n          el: ref.current,\n          transitionTimingFunction: themeAnimation.timing.ease\n        })\n      );\n    }, [collapsed, status, min, max]);\n\n    if (status !== previousStatus && ['expanded', 'collapsed'].includes(previousStatus!)) {\n      style = getStyle({\n        dimension,\n        min,\n        max,\n        transitionSpeed,\n        nullWhenCollapsed,\n        status: status === 'expanding' ? 'collapsing' : 'expanding',\n        el: ref.current,\n        transitionTimingFunction: themeAnimation.timing.ease\n      });\n    }\n\n    return status === 'collapsed' && nullWhenCollapsed && !min ? null : (\n      <Tag ref={ref} onTransitionEnd={onTransitionEnd} {...restProps} style={style}>\n        {children}\n      </Tag>\n    );\n  }\n);\n\nexport default ExpandCollapse;\n"]}
+{"version":3,"file":"ExpandCollapse.js","sourceRoot":"","sources":["../../../src/components/ExpandCollapse/ExpandCollapse.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useLayoutEffect, useCallback } from 'react';\nimport type { FunctionComponent, Ref, ReactNode, PropsWithoutRef, CSSProperties } from 'react';\n\nimport type { ForwardProps, BaseProps, AsProp, PropsWithDefaults } from '../../types';\nimport { useConsolidatedRef, usePrevious, useTheme } from '../../hooks';\n\nexport interface ExpandCollapseProps extends AsProp, BaseProps {\n  /** Content to expand/collapse. */\n  children?: ReactNode;\n  /**\n   * If true,the content will be hidden.\n   * @default false\n   */\n  collapsed?: boolean;\n  /**\n   * Used to determine the transition property.\n   * @default 'height'\n   */\n  dimension?: 'height' | 'width';\n  /** Minimum height/width to collapse to. This will set the starting collapsed size as well. */\n  min?: string;\n  /** Maximum height/width to expand to. Expanded state will expanded up until, but not beyond, the natural height/width of the element. */\n  max?: string;\n  /** Callback fired after content collapsed. */\n  onAfterCollapse?: () => void;\n  /** Callback fired after content expanded. */\n  onAfterExpand?: () => void;\n  /** Callback fired before content collapsed. */\n  onBeforeCollapse?: () => void;\n  /** Callback fired before content expanded. */\n  onBeforeExpand?: () => void;\n  /**\n   * Determine the speed of animation. This value comes from `theme.base.animation.speed`.\n   * @default '0.25s'\n   */\n  transitionSpeed?: string;\n  /**\n   * If true, removes the component from the real DOM when collapsed. For full virtual DOM unmount(if necessary), perform at a parent level.\n   * @default false\n   */\n  nullWhenCollapsed?: boolean;\n}\n\ntype ExpandCollapsePropsWithDefaults = PropsWithDefaults<\n  ExpandCollapseProps,\n  'collapsed' | 'dimension' | 'transitionSpeed' | 'nullWhenCollapsed'\n>;\n\ntype Statuses = 'collapsed' | 'collapsing' | 'expanded' | 'expanding';\n\ninterface GetStyleProps\n  extends Pick<\n    ExpandCollapsePropsWithDefaults,\n    'dimension' | 'transitionSpeed' | 'min' | 'max' | 'nullWhenCollapsed'\n  > {\n  status: Statuses;\n  el?: HTMLElement | null;\n  transitionTimingFunction?: string;\n}\n\nconst getScrollSize = (\n  el: HTMLElement,\n  dimension: ExpandCollapsePropsWithDefaults['dimension']\n): string => {\n  if (!el) return '';\n  return dimension === 'height' ? `${el.scrollHeight}px` : `${el.scrollWidth}px`;\n};\n\nconst getStyle = (props: GetStyleProps): CSSProperties => {\n  const {\n    status,\n    dimension,\n    transitionSpeed,\n    transitionTimingFunction,\n    min,\n    max,\n    nullWhenCollapsed,\n    el\n  } = props;\n  const style: CSSProperties = {};\n  let maxSize = max;\n\n  if (el && !max) {\n    maxSize = getScrollSize(el, dimension!);\n  }\n\n  if (status === 'expanded' || status === 'collapsed') {\n    if (max || min) {\n      style[dimension as 'height' | 'width'] = status === 'expanded' ? maxSize : min || 0;\n      style[`overflow${dimension === 'width' ? 'X' : 'Y'}`] = 'hidden';\n    }\n\n    if (status === 'collapsed' && !nullWhenCollapsed && !min) {\n      style.display = 'none';\n    }\n  }\n\n  if (status === 'expanding' || status === 'collapsing') {\n    style[dimension as 'height' | 'width'] = status === 'expanding' ? maxSize : min || 0;\n    style.overflow = 'hidden';\n    style.transitionProperty = dimension;\n    style.transitionDuration = `max(${transitionSpeed}, 0.01ms)`;\n    style.transitionTimingFunction = transitionTimingFunction;\n  }\n\n  return style;\n};\n\nconst ExpandCollapse: FunctionComponent<ExpandCollapseProps & ForwardProps> = forwardRef(\n  function ExpandCollapse(props: PropsWithoutRef<ExpandCollapseProps>, refArg: Ref<HTMLElement>) {\n    const {\n      base: { animation: themeAnimation }\n    } = useTheme();\n\n    const {\n      children,\n      dimension = 'height',\n      collapsed = false,\n      onBeforeExpand,\n      onAfterExpand,\n      onBeforeCollapse,\n      onAfterCollapse,\n      transitionSpeed = themeAnimation.speed,\n      min,\n      max,\n      nullWhenCollapsed = false,\n      as: Tag = 'div',\n      ...restProps\n    } = props;\n\n    const [status, setStatus] = useState<Statuses>(collapsed ? 'collapsed' : 'expanded');\n    const styleStateHook = useState<CSSProperties>();\n    const setStyle = styleStateHook[1];\n    let style = styleStateHook[0];\n    const previousStatus = usePrevious(status);\n    const ref = useConsolidatedRef(refArg);\n\n    const onTransitionEnd = useCallback(\n      (e: TransitionEvent) => {\n        if (e.target !== ref.current || e.propertyName !== dimension) return;\n        setStatus(status === 'expanding' ? 'expanded' : 'collapsed');\n      },\n      [ref.current, status]\n    );\n\n    useLayoutEffect(() => {\n      const wantsToCollapse = collapsed;\n      const wantsToExpand = !collapsed;\n      const canCollapse = ['expanded', 'expanding'].includes(status);\n      const canExpand = ['collapsed', 'collapsing'].includes(status);\n\n      if (wantsToExpand && canExpand) {\n        onBeforeExpand?.();\n        setStatus('expanding');\n      } else if (wantsToCollapse && canCollapse) {\n        onBeforeCollapse?.();\n        setStatus('collapsing');\n      }\n\n      if (status === 'expanded' && previousStatus !== 'expanded') {\n        onAfterExpand?.();\n      } else if (status === 'collapsed' && previousStatus !== 'collapsed') {\n        onAfterCollapse?.();\n      }\n\n      setStyle(\n        getStyle({\n          dimension,\n          min,\n          max,\n          transitionSpeed,\n          nullWhenCollapsed,\n          status,\n          el: ref.current,\n          transitionTimingFunction: themeAnimation.timing.ease\n        })\n      );\n    }, [collapsed, status, min, max]);\n\n    if (status !== previousStatus && ['expanded', 'collapsed'].includes(previousStatus!)) {\n      style = getStyle({\n        dimension,\n        min,\n        max,\n        transitionSpeed,\n        nullWhenCollapsed,\n        status: status === 'expanding' ? 'collapsing' : 'expanding',\n        el: ref.current,\n        transitionTimingFunction: themeAnimation.timing.ease\n      });\n    }\n\n    return status === 'collapsed' && nullWhenCollapsed && !min ? null : (\n      <Tag ref={ref} onTransitionEnd={onTransitionEnd} {...restProps} style={style}>\n        {children}\n      </Tag>\n    );\n  }\n);\n\nexport default ExpandCollapse;\n"]}

package/lib/components/FieldGroup/FieldGroup.d.ts

@@ -45,8 +45,8 @@ export declare const StyledFieldGroupName: import("styled-components").StyledCom
 export declare const StyledFieldGroupLegend: import("styled-components").StyledComponent<"legend", import("styled-components").DefaultTheme, Pick<FieldGroupProps, "collapsed">, never>;
 export declare const StyledFieldGroup: import("styled-components").StyledComponent<"fieldset", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledGroupContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    collapsed?: boolean | undefined;
-    border?: boolean | undefined;
+    collapsed?: boolean;
+    border?: boolean;
 }, never>;
 declare const FieldGroup: FunctionComponent<FieldGroupProps & ForwardProps>;
 export default FieldGroup;

package/lib/components/FieldGroup/FieldGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldGroup.d.ts","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmB,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAYhF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAKvE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAK7D,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG;IACxC,sCAAsC;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,2CAA2C;IAC3C,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;CAChC,GAAG,CACE;IACE,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,wCAAwC;IACxC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,4DAA4D;IAC5D,cAAc,CAAC,EAAE;QACf,OAAO,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;QACzC,OAAO,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAC;KAC1C,CAAC;IACF,gDAAgD;IAChD,OAAO,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;IAChC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;CAChC,GACD;IACE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,iBAAiB,CAAC,EAAE,KAAK,CAAC;CAC3B,CACJ,CAAC;AA+BJ,eAAO,MAAM,oBAAoB,0GAAgB,CAAC;AAElD,eAAO,MAAM,sBAAsB,4IA+BlC,CAAC;AAIF,eAAO,MAAM,gBAAgB,8GAiC5B,CAAC;AAIF,eAAO,MAAM,oBAAoB;;;SA+BhC,CAAC;AA8BF,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAoFjE,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"FieldGroup.d.ts","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmB,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAYhF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAKvE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAK7D,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG;IACxC,sCAAsC;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,2CAA2C;IAC3C,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;CAChC,GAAG,CACE;IACE,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,wCAAwC;IACxC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,4DAA4D;IAC5D,cAAc,CAAC,EAAE;QACf,OAAO,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;QACzC,OAAO,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAC;KAC1C,CAAC;IACF,gDAAgD;IAChD,OAAO,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;IAChC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;CAChC,GACD;IACE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,iBAAiB,CAAC,EAAE,KAAK,CAAC;CAC3B,CACJ,CAAC;AA+BJ,eAAO,MAAM,oBAAoB,0GAAgB,CAAC;AAElD,eAAO,MAAM,sBAAsB,4IA+BlC,CAAC;AAIF,eAAO,MAAM,gBAAgB,8GAiC5B,CAAC;AAIF,eAAO,MAAM,oBAAoB;gBAA4B,OAAO;aAAW,OAAO;SA+BrF,CAAC;AA8BF,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAoFjE,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/lib/components/FieldGroup/FieldGroupList.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldGroupList.js","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroupList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAGhD,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE9D,OAAO,UAAU,EAAE,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAG5D,YAAY,CAAC,QAAQ,CAAC,CAAC;AAiBvB,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CACrC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;0BACM,KAAK,CAAC,IAAI,CAAC,OAAO;;MAEtC,gBAAgB;;;GAGnB,CACF,CAAC;AAEF,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,UAAU,CAAC,CAC9C,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;eACL,KAAK,CAAC,IAAI,CAAC,OAAO,eAAe,KAAK,CAAC,IAAI,CAAC,OAAO;;;uCAG3B,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;mCACrC,KAAK,CAAC,IAAI,CAAC,OAAO;;;;;;GAMlD,CACF,CAAC;AAEF,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,eAAe,GAAG,MAAM,CAAC,MAAM,CAAC,CACpC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;kBACF,KAAK,CAAC,IAAI,CAAC,OAAO;GACjC,CACF,CAAC;AAEF,eAAe,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEhD,MAAM,cAAc,GAA0D,UAAU,CACtF,SAAS,cAAc,CACrB,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,eAAe,EAAE,GAAG,SAAS,EAAwC,EAC/F,GAA+B;IAE/B,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACjD,MAAM,SAAS,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAElD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,eAAe,GAAG,gBAAgB,EAAE,CAAC;QAC3C,IAAI,eAAe,KAAK,SAAS,CAAC,OAAO,IAAI,WAAW,CAAC,OAAO,EAAE;YAChE,MAAM,eAAe,GAAG,WAAW,CAAC,OAAO,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;YAC7E,MAAM,UAAU,GAAG,aAAa,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;YAEtD,MAAM,kBAAkB,GAAG,UAAU,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,CACvD,eAAe,EAAE,QAAQ,CAAC,SAAS,CAAC,CACrC,CAAC;YAEF,MAAM,sBAAsB,GAAG,UAAU,CAAC,MAAM,CAC9C,SAAS,CAAC,EAAE,CAAC,CAAC,eAAe,EAAE,QAAQ,CAAC,SAAS,CAAC,CACnD,CAAC;YAEF,IAAI,sBAAsB,CAAC,MAAM,GAAG,CAAC,EAAE;gBACrC,sBAAsB,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC;aACnC;iBAAM;gBACL,kBAAkB,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC;aAChC;SACF;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IAEnB,OAAO,CACL,MAAC,oBAAoB,IAAC,GAAG,EAAE,GAAG,KAAM,SAAS,aAC1C,KAAK,CAAC,GAAG,CACR,CACE,EACE,EAAE,EACF,QAAQ,EACR,IAAI,EACJ,UAAU,EACV,QAAQ,EAAE,YAAY,EACtB,GAAG,aAAa,EACQ,EAC1B,KAAK,EACL,EAAE;gBACF,MAAM,UAAU,GAAG,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;gBAC9C,OAAO,CACL,KAAC,cAAc,IAEb,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,KAClB,aAAa,EACjB,OAAO,EACL,QAAQ,IAAI,YAAY;wBACtB,CAAC,CAAC;4BACE;gCACE,EAAE,EAAE,QAAQ;gCACZ,IAAI,EAAE,CAAC,CAAC,QAAQ,CAAC;gCACjB,IAAI,EAAE,OAAO;gCACb,QAAQ,EAAE,IAAI;gCACd,OAAO,EAAE,GAAG,EAAE;oCACZ,YAAY,EAAE,CAAC,EAAE,CAAC,CAAC;oCACnB,QAAQ,EAAE,CAAC,EAAE,CAAC,CAAC;gCACjB,CAAC;6BACF;yBACF;wBACH,CAAC,CAAC,SAAS,EAEf,GAAG,EAAE,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,YAExC,QAAQ,IAtBJ,EAAE,CAuBQ,CAClB,CAAC;YACJ,CAAC,CACF,EACA,KAAK,IAAI,CACR,MAAC,eAAe,IAAC,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,aAC5D,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,EACnB,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,IAC9C,CACnB,IACoB,CACxB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { forwardRef, useEffect, useRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { ForwardProps } from '../../types';\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport { useI18n } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport { getActiveElement, getFocusables } from '../../utils';\n\nimport FieldGroup, { StyledFieldGroup } from './FieldGroup';\nimport type { FieldGroupProps } from './FieldGroup';\n\nregisterIcon(plusIcon);\n\nexport type FieldGroupListItemProps = FieldGroupProps & {\n  /** The ID of the field group list item */\n  id: string;\n  /** Item level onDelete callback. */\n  onDelete?: (id: string) => void;\n};\n\nexport interface FieldGroupListProps {\n  items: FieldGroupListItemProps[];\n  contextualLabel?: string;\n  onAdd?: () => void;\n  onDelete?: (id: string) => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledFieldGroupList = styled.div(\n  ({ theme }) => css`\n    margin-block-start: ${theme.base.spacing};\n\n    ${StyledFieldGroup} {\n      margin-block-start: 0;\n    }\n  `\n);\n\nStyledFieldGroupList.defaultProps = defaultThemeProp;\n\nexport const StyledListItem = styled(FieldGroup)(\n  ({ theme }) => css`\n    padding: ${theme.base.spacing} 0 calc(2 * ${theme.base.spacing});\n\n    &:not(:last-of-type) {\n      border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n      margin-block-end: calc(2 * ${theme.base.spacing});\n    }\n\n    legend {\n      margin-block-end: 0;\n    }\n  `\n);\n\nStyledListItem.defaultProps = defaultThemeProp;\n\nconst StyledAddButton = styled(Button)(\n  ({ theme }) => css`\n    margin-top: ${theme.base.spacing};\n  `\n);\n\nStyledAddButton.defaultProps = defaultThemeProp;\n\nconst FieldGroupList: FunctionComponent<FieldGroupListProps & ForwardProps> = forwardRef(\n  function FieldGroupList(\n    { items, onAdd, onDelete, contextualLabel, ...restProps }: PropsWithoutRef<FieldGroupListProps>,\n    ref: FieldGroupListProps['ref']\n  ) {\n    const t = useI18n();\n    const lastItemRef = useRef<HTMLDivElement>(null);\n    const addBtnRef = useRef<HTMLButtonElement>(null);\n\n    useEffect(() => {\n      const currentActiveEl = getActiveElement();\n      if (currentActiveEl === addBtnRef.current && lastItemRef.current) {\n        const groupItemLegend = lastItemRef.current.querySelector(':scope > legend');\n        const focusables = getFocusables(lastItemRef.current);\n\n        const groupActionButtons = focusables.filter(focusable =>\n          groupItemLegend?.contains(focusable)\n        );\n\n        const groupContentFocusables = focusables.filter(\n          focusable => !groupItemLegend?.contains(focusable)\n        );\n\n        if (groupContentFocusables.length > 0) {\n          groupContentFocusables[0].focus();\n        } else {\n          groupActionButtons[0]?.focus();\n        }\n      }\n    }, [items.length]);\n\n    return (\n      <StyledFieldGroupList ref={ref} {...restProps}>\n        {items.map(\n          (\n            {\n              id,\n              children,\n              name,\n              headingTag,\n              onDelete: itemOnDelete,\n              ...restItemProps\n            }: FieldGroupListItemProps,\n            index\n          ) => {\n            const isLastItem = index === items.length - 1;\n            return (\n              <StyledListItem\n                key={id}\n                name={name}\n                headingTag={headingTag}\n                {...restItemProps}\n                actions={\n                  onDelete || itemOnDelete\n                    ? [\n                        {\n                          id: 'delete',\n                          text: t('delete'),\n                          icon: 'trash',\n                          iconOnly: true,\n                          onClick: () => {\n                            itemOnDelete?.(id);\n                            onDelete?.(id);\n                          }\n                        }\n                      ]\n                    : undefined\n                }\n                ref={isLastItem ? lastItemRef : undefined}\n              >\n                {children}\n              </StyledListItem>\n            );\n          }\n        )}\n        {onAdd && (\n          <StyledAddButton variant='link' onClick={onAdd} ref={addBtnRef}>\n            <Icon name='plus' />\n            {contextualLabel ? t('add_noun', [contextualLabel]) : t('add')}\n          </StyledAddButton>\n        )}\n      </StyledFieldGroupList>\n    );\n  }\n);\n\nexport default FieldGroupList;\n"]}
+{"version":3,"file":"FieldGroupList.js","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroupList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { ForwardProps } from '../../types';\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport { useI18n } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport { getActiveElement, getFocusables } from '../../utils';\n\nimport FieldGroup, { StyledFieldGroup } from './FieldGroup';\nimport type { FieldGroupProps } from './FieldGroup';\n\nregisterIcon(plusIcon);\n\nexport type FieldGroupListItemProps = FieldGroupProps & {\n  /** The ID of the field group list item */\n  id: string;\n  /** Item level onDelete callback. */\n  onDelete?: (id: string) => void;\n};\n\nexport interface FieldGroupListProps {\n  items: FieldGroupListItemProps[];\n  contextualLabel?: string;\n  onAdd?: () => void;\n  onDelete?: (id: string) => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledFieldGroupList = styled.div(\n  ({ theme }) => css`\n    margin-block-start: ${theme.base.spacing};\n\n    ${StyledFieldGroup} {\n      margin-block-start: 0;\n    }\n  `\n);\n\nStyledFieldGroupList.defaultProps = defaultThemeProp;\n\nexport const StyledListItem = styled(FieldGroup)(\n  ({ theme }) => css`\n    padding: ${theme.base.spacing} 0 calc(2 * ${theme.base.spacing});\n\n    &:not(:last-of-type) {\n      border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n      margin-block-end: calc(2 * ${theme.base.spacing});\n    }\n\n    legend {\n      margin-block-end: 0;\n    }\n  `\n);\n\nStyledListItem.defaultProps = defaultThemeProp;\n\nconst StyledAddButton = styled(Button)(\n  ({ theme }) => css`\n    margin-top: ${theme.base.spacing};\n  `\n);\n\nStyledAddButton.defaultProps = defaultThemeProp;\n\nconst FieldGroupList: FunctionComponent<FieldGroupListProps & ForwardProps> = forwardRef(\n  function FieldGroupList(\n    { items, onAdd, onDelete, contextualLabel, ...restProps }: PropsWithoutRef<FieldGroupListProps>,\n    ref: FieldGroupListProps['ref']\n  ) {\n    const t = useI18n();\n    const lastItemRef = useRef<HTMLDivElement>(null);\n    const addBtnRef = useRef<HTMLButtonElement>(null);\n\n    useEffect(() => {\n      const currentActiveEl = getActiveElement();\n      if (currentActiveEl === addBtnRef.current && lastItemRef.current) {\n        const groupItemLegend = lastItemRef.current.querySelector(':scope > legend');\n        const focusables = getFocusables(lastItemRef.current);\n\n        const groupActionButtons = focusables.filter(focusable =>\n          groupItemLegend?.contains(focusable)\n        );\n\n        const groupContentFocusables = focusables.filter(\n          focusable => !groupItemLegend?.contains(focusable)\n        );\n\n        if (groupContentFocusables.length > 0) {\n          groupContentFocusables[0].focus();\n        } else {\n          groupActionButtons[0]?.focus();\n        }\n      }\n    }, [items.length]);\n\n    return (\n      <StyledFieldGroupList ref={ref} {...restProps}>\n        {items.map(\n          (\n            {\n              id,\n              children,\n              name,\n              headingTag,\n              onDelete: itemOnDelete,\n              ...restItemProps\n            }: FieldGroupListItemProps,\n            index\n          ) => {\n            const isLastItem = index === items.length - 1;\n            return (\n              <StyledListItem\n                key={id}\n                name={name}\n                headingTag={headingTag}\n                {...restItemProps}\n                actions={\n                  onDelete || itemOnDelete\n                    ? [\n                        {\n                          id: 'delete',\n                          text: t('delete'),\n                          icon: 'trash',\n                          iconOnly: true,\n                          onClick: () => {\n                            itemOnDelete?.(id);\n                            onDelete?.(id);\n                          }\n                        }\n                      ]\n                    : undefined\n                }\n                ref={isLastItem ? lastItemRef : undefined}\n              >\n                {children}\n              </StyledListItem>\n            );\n          }\n        )}\n        {onAdd && (\n          <StyledAddButton variant='link' onClick={onAdd} ref={addBtnRef}>\n            <Icon name='plus' />\n            {contextualLabel ? t('add_noun', [contextualLabel]) : t('add')}\n          </StyledAddButton>\n        )}\n      </StyledFieldGroupList>\n    );\n  }\n);\n\nexport default FieldGroupList;\n"]}

package/lib/components/FieldValueList/FieldValueList.d.ts

@@ -28,10 +28,10 @@ export type StyledFieldValueListProps = Pick<FieldValueListProps, 'variant'>;
 export declare const StyledFieldValueList: import("styled-components").StyledComponent<"dl", import("styled-components").DefaultTheme, StyledFieldValueListProps, never>;
 export declare const StyledStackedFieldValue: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const FieldValueItem: (({ testId, name, value, variant, truncate }: FieldValueListItemProps) => JSX.Element) & {
-    getTestIds: (testIdProp?: string | null | undefined) => import("../../types").TestIdsRecord<readonly ["name", "value"]>;
+    getTestIds: (testIdProp?: TestIdProp["testId"]) => import("../../types").TestIdsRecord<readonly ["name", "value"]>;
 };
 declare const _default: FunctionComponent<FieldValueListProps & ForwardProps> & {
-    getTestIds: (testIdProp?: string | null | undefined) => import("../../types").TestIdsRecord<readonly []>;
+    getTestIds: (testIdProp?: TestIdProp["testId"]) => import("../../types").TestIdsRecord<readonly []>;
 };
 export default _default;
 //# sourceMappingURL=FieldValueList.d.ts.map

package/lib/components/FieldValueList/FieldValueList.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldValueList.js","sourceRoot":"","sources":["../../../src/components/FieldValueList/FieldValueList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef } from 'react';\nimport type { ReactNode, FunctionComponent, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type {\n  BaseProps,\n  ExcludeStrict,\n  ForwardProps,\n  NoChildrenProp,\n  TestIdProp\n} from '../../types';\nimport Grid from '../Grid';\nimport { StyledLabel } from '../Label';\nimport { useBreakpoint, useConsolidatedRef, useTestIds } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport ShowMoreLess from '../ShowMoreLess';\nimport { withTestIds } from '../../utils';\nimport NoValue from '../NoValue/NoValue';\n\nimport { getFieldValueListTestIds, getFieldValueItemTestIds } from './FieldValueList.test-ids';\n\nexport type FieldValueVariant = 'inline' | 'stacked';\n\ninterface BaseFieldValueListItem extends TestIdProp {\n  name: string;\n  id?: string;\n  variant?: FieldValueVariant;\n}\n\nexport type FieldValueListItemProps =\n  | (BaseFieldValueListItem & {\n      value?: ExcludeStrict<ReactNode, 'string'>;\n      truncate?: never;\n    })\n  | (BaseFieldValueListItem & {\n      value: string;\n      truncate?: boolean;\n    });\n\nexport interface FieldValueListProps extends BaseProps, NoChildrenProp, TestIdProp {\n  /** The set of field values to render in the list. */\n  fields: FieldValueListItemProps[];\n  /**\n   * Determines if the field and values should be displayed on the same line, or stacked with the field above the value.\n   * @default 'inline'\n   */\n  variant?: FieldValueVariant | 'value-comparison';\n}\n\nexport const StyledFieldName = styled.dt`\n  word-break: break-word;\n`;\n\nexport const StyledFieldValue = styled.dd`\n  word-break: break-word;\n`;\n\nexport type StyledFieldValueListProps = Pick<FieldValueListProps, 'variant'>;\n\nexport const StyledFieldValueList = styled.dl<StyledFieldValueListProps>(({ variant, theme }) => {\n  return css`\n    width: 100%;\n\n    ${variant === 'value-comparison' &&\n    css`\n      dt {\n        width: 100%;\n      }\n      dd {\n        text-align: end;\n        padding-inline-start: calc(2 * ${theme.base.spacing});\n      }\n      ${StyledLabel} {\n        max-width: unset;\n      }\n      dd:not(:last-of-type),\n      dt:not(:last-of-type) {\n        border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n        padding-bottom: calc(0.5 * ${theme.base.spacing});\n      }\n    `}\n  `;\n});\n\nStyledFieldValueList.defaultProps = defaultThemeProp;\n\nexport const StyledStackedFieldValue = styled.div``;\n\nexport const FieldValueItem = withTestIds(\n  ({ testId, name, value, variant = 'inline', truncate = true }: FieldValueListItemProps) => {\n    const testIds = useTestIds(testId, getFieldValueItemTestIds);\n\n    const displayValue =\n      typeof value === 'string' && truncate ? (\n        <ShowMoreLess lines={3}>{value}</ShowMoreLess>\n      ) : (\n        value\n      );\n\n    const labelAndValue = (\n      <>\n        <StyledLabel data-testid={testIds.name} as={StyledFieldName}>\n          {name}\n        </StyledLabel>\n        <StyledFieldValue data-testid={testIds.value}>\n          {value ? displayValue : <NoValue />}\n        </StyledFieldValue>\n      </>\n    );\n\n    return variant === 'stacked' ? (\n      <StyledStackedFieldValue data-testid={testIds.root}>{labelAndValue}</StyledStackedFieldValue>\n    ) : (\n      <>{labelAndValue}</>\n    );\n  },\n  getFieldValueItemTestIds\n);\n\nconst FieldValueList: FunctionComponent<FieldValueListProps & ForwardProps> = forwardRef(\n  function FieldValueList(\n    { testId, fields, variant = 'inline', ...restProps }: FieldValueListProps,\n    ref: Ref<HTMLDivElement>\n  ) {\n    const testIds = useTestIds(testId, getFieldValueListTestIds);\n\n    const fieldValueListRef = useConsolidatedRef<HTMLDivElement>(ref);\n\n    const isXSContentWidthOrAbove = useBreakpoint('xs', {\n      breakpointRef: fieldValueListRef,\n      themeProp: 'content-width'\n    });\n\n    return (\n      <Grid\n        data-testid={testIds.root}\n        {...restProps}\n        ref={fieldValueListRef}\n        container={{\n          cols:\n            ['inline', 'value-comparison'].includes(variant) && isXSContentWidthOrAbove\n              ? '16ch minmax(0, 1fr)'\n              : 'minmax(0, 1fr)',\n          colGap: variant !== 'value-comparison' ? 2 : 0,\n          rowGap: variant !== 'value-comparison' ? 1 : 0.5\n        }}\n        as={StyledFieldValueList}\n        variant={isXSContentWidthOrAbove ? variant : 'stacked'}\n      >\n        {fields.map(({ id, name, value, truncate = true, variant: fieldVariant }) => {\n          const sharedProps: BaseFieldValueListItem & { key: string } = {\n            name,\n            variant:\n              (fieldVariant ?? variant) === 'stacked' || !isXSContentWidthOrAbove\n                ? 'stacked'\n                : 'inline',\n\n            key: id ?? name\n          };\n\n          if (typeof value === 'string') {\n            return <FieldValueItem {...sharedProps} value={value} truncate={truncate} />;\n          }\n\n          return <FieldValueItem {...sharedProps} value={value} />;\n        })}\n      </Grid>\n    );\n  }\n);\n\nexport default withTestIds(FieldValueList, getFieldValueListTestIds);\n"]}
+{"version":3,"file":"FieldValueList.js","sourceRoot":"","sources":["../../../src/components/FieldValueList/FieldValueList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef } from 'react';\nimport type { ReactNode, FunctionComponent, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type {\n  BaseProps,\n  ExcludeStrict,\n  ForwardProps,\n  NoChildrenProp,\n  TestIdProp\n} from '../../types';\nimport Grid from '../Grid';\nimport { StyledLabel } from '../Label';\nimport { useBreakpoint, useConsolidatedRef, useTestIds } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport ShowMoreLess from '../ShowMoreLess';\nimport { withTestIds } from '../../utils';\nimport NoValue from '../NoValue/NoValue';\n\nimport { getFieldValueListTestIds, getFieldValueItemTestIds } from './FieldValueList.test-ids';\n\nexport type FieldValueVariant = 'inline' | 'stacked';\n\ninterface BaseFieldValueListItem extends TestIdProp {\n  name: string;\n  id?: string;\n  variant?: FieldValueVariant;\n}\n\nexport type FieldValueListItemProps =\n  | (BaseFieldValueListItem & {\n      value?: ExcludeStrict<ReactNode, 'string'>;\n      truncate?: never;\n    })\n  | (BaseFieldValueListItem & {\n      value: string;\n      truncate?: boolean;\n    });\n\nexport interface FieldValueListProps extends BaseProps, NoChildrenProp, TestIdProp {\n  /** The set of field values to render in the list. */\n  fields: FieldValueListItemProps[];\n  /**\n   * Determines if the field and values should be displayed on the same line, or stacked with the field above the value.\n   * @default 'inline'\n   */\n  variant?: FieldValueVariant | 'value-comparison';\n}\n\nexport const StyledFieldName = styled.dt`\n  word-break: break-word;\n`;\n\nexport const StyledFieldValue = styled.dd`\n  word-break: break-word;\n`;\n\nexport type StyledFieldValueListProps = Pick<FieldValueListProps, 'variant'>;\n\nexport const StyledFieldValueList = styled.dl<StyledFieldValueListProps>(({ variant, theme }) => {\n  return css`\n    width: 100%;\n\n    ${variant === 'value-comparison' &&\n    css`\n      dt {\n        width: 100%;\n      }\n      dd {\n        text-align: end;\n        padding-inline-start: calc(2 * ${theme.base.spacing});\n      }\n      ${StyledLabel} {\n        max-width: unset;\n      }\n      dd:not(:last-of-type),\n      dt:not(:last-of-type) {\n        border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n        padding-bottom: calc(0.5 * ${theme.base.spacing});\n      }\n    `}\n  `;\n});\n\nStyledFieldValueList.defaultProps = defaultThemeProp;\n\nexport const StyledStackedFieldValue = styled.div``;\n\nexport const FieldValueItem = withTestIds(\n  ({ testId, name, value, variant = 'inline', truncate = true }: FieldValueListItemProps) => {\n    const testIds = useTestIds(testId, getFieldValueItemTestIds);\n\n    const displayValue =\n      typeof value === 'string' && truncate ? (\n        <ShowMoreLess lines={3}>{value}</ShowMoreLess>\n      ) : (\n        value\n      );\n\n    const labelAndValue = (\n      <>\n        <StyledLabel data-testid={testIds.name} as={StyledFieldName}>\n          {name}\n        </StyledLabel>\n        <StyledFieldValue data-testid={testIds.value}>\n          {value ? displayValue : <NoValue />}\n        </StyledFieldValue>\n      </>\n    );\n\n    return variant === 'stacked' ? (\n      <StyledStackedFieldValue data-testid={testIds.root}>{labelAndValue}</StyledStackedFieldValue>\n    ) : (\n      <>{labelAndValue}</>\n    );\n  },\n  getFieldValueItemTestIds\n);\n\nconst FieldValueList: FunctionComponent<FieldValueListProps & ForwardProps> = forwardRef(\n  function FieldValueList(\n    { testId, fields, variant = 'inline', ...restProps }: FieldValueListProps,\n    ref: Ref<HTMLDivElement>\n  ) {\n    const testIds = useTestIds(testId, getFieldValueListTestIds);\n\n    const fieldValueListRef = useConsolidatedRef<HTMLDivElement>(ref);\n\n    const isXSContentWidthOrAbove = useBreakpoint('xs', {\n      breakpointRef: fieldValueListRef,\n      themeProp: 'content-width'\n    });\n\n    return (\n      <Grid\n        data-testid={testIds.root}\n        {...restProps}\n        ref={fieldValueListRef}\n        container={{\n          cols:\n            ['inline', 'value-comparison'].includes(variant) && isXSContentWidthOrAbove\n              ? '16ch minmax(0, 1fr)'\n              : 'minmax(0, 1fr)',\n          colGap: variant !== 'value-comparison' ? 2 : 0,\n          rowGap: variant !== 'value-comparison' ? 1 : 0.5\n        }}\n        as={StyledFieldValueList}\n        variant={isXSContentWidthOrAbove ? variant : 'stacked'}\n      >\n        {fields.map(({ id, name, value, truncate = true, variant: fieldVariant }) => {\n          const sharedProps: BaseFieldValueListItem & { key: string } = {\n            name,\n            variant:\n              (fieldVariant ?? variant) === 'stacked' || !isXSContentWidthOrAbove\n                ? 'stacked'\n                : 'inline',\n\n            key: id ?? name\n          };\n\n          if (typeof value === 'string') {\n            return <FieldValueItem {...sharedProps} value={value} truncate={truncate} />;\n          }\n\n          return <FieldValueItem {...sharedProps} value={value} />;\n        })}\n      </Grid>\n    );\n  }\n);\n\nexport default withTestIds(FieldValueList, getFieldValueListTestIds);\n"]}

package/lib/components/FieldValueList/FieldValueList.test-ids.d.ts

@@ -1,3 +1,3 @@
-export declare const getFieldValueListTestIds: (testIdProp?: string | null | undefined) => import("../..").TestIdsRecord<readonly []>;
-export declare const getFieldValueItemTestIds: (testIdProp?: string | null | undefined) => import("../..").TestIdsRecord<readonly ["name", "value"]>;
+export declare const getFieldValueListTestIds: (testIdProp?: import("../..").TestIdProp["testId"]) => import("../..").TestIdsRecord<readonly []>;
+export declare const getFieldValueItemTestIds: (testIdProp?: import("../..").TestIdProp["testId"]) => import("../..").TestIdsRecord<readonly ["name", "value"]>;
 //# sourceMappingURL=FieldValueList.test-ids.d.ts.map

package/lib/components/FieldValueList/FieldValueList.test-ids.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldValueList.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/FieldValueList/FieldValueList.test-ids.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,wBAAwB,wFAAiD,CAAC;AAEvF,eAAO,MAAM,wBAAwB,uGAG1B,CAAC"}
+{"version":3,"file":"FieldValueList.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/FieldValueList/FieldValueList.test-ids.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,wBAAwB,mGAAiD,CAAC;AAEvF,eAAO,MAAM,wBAAwB,kHAG1B,CAAC"}

package/lib/components/File/File.test-ids.d.ts

@@ -1,2 +1,2 @@
-export declare const getFileInputTestIds: (testIdProp?: string | null | undefined) => import("../..").TestIdsRecord<readonly ["control", "files", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
+export declare const getFileInputTestIds: (testIdProp?: import("../..").TestIdProp["testId"]) => import("../..").TestIdsRecord<readonly ["control", "files", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
 //# sourceMappingURL=File.test-ids.d.ts.map

package/lib/components/File/File.test-ids.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"File.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/File/File.test-ids.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,mBAAmB,wLAIrB,CAAC"}
+{"version":3,"file":"File.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/File/File.test-ids.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,mBAAmB,mMAIrB,CAAC"}

package/lib/components/File/FileDisplay.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileDisplay.js","sourceRoot":"","sources":["../../../src/components/File/FileDisplay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAInC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,OAAO,MAAM,oBAAoB,CAAC;AAEzC,OAAO,QAAQ,MAAM,YAAY,CAAC;AA2BlC,MAAM,WAAW,GAAuD,UAAU,CAChF,SAAS,WAAW,CAClB,EACE,EAAE,EACF,WAAW,EACX,KAAK,EACL,OAAO,EACP,SAAS,EACT,SAAS,EACT,UAAU,EACV,OAAO,GAAG,KAAK,EACf,GAAG,SAAS,EACsB,EACpC,GAA4B;IAE5B,IAAI,OAAO,KAAK,MAAM,IAAI,CAAC,KAAK,EAAE;QAChC,OAAO,CACL,eAAM,GAAG,EAAE,GAAG,KAAM,SAAS,YAC1B,KAAK,CAAC,CAAC,CAAC,WAAW,IAAI,KAAK,CAAC,CAAC,CAAC,KAAC,OAAO,KAAG,GACtC,CACR,CAAC;KACH;IAED,IAAI,OAAO,KAAK,MAAM;QACpB,OAAO,CACL,KAAC,IAAI,IAAC,GAAG,EAAE,GAA6B,KAAM,SAAS,EAAE,IAAI,EAAE,KAAK,YACjE,WAAW,IAAI,KAAK,GAChB,CACR,CAAC;IAEJ,OAAO,CACL,KAAC,QAAQ,OACH,SAAS,EACb,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAA0B,EAC/B,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,IAAI,KAAK,EACvC,IAAI,EAAE,WAAW,IAAI,KAAK,EAC1B,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,GAChB,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\n\nimport type { BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport Link from '../Link';\nimport NoValue from '../NoValue/NoValue';\n\nimport FileItem from './FileItem';\nimport type { FileItemProps } from './FileItem';\n\nexport interface FileDisplayProps\n  extends Pick<FileItemProps, 'id' | 'onPreview' | 'onDownload'>,\n    BaseProps,\n    NoChildrenProp {\n  /** URL address */\n  value?: string;\n  /** The text to be displayed. */\n  displayText?: string;\n  /**\n   * Display value either as file, link only or textual representation.\n   * @default 'file'\n   */\n  variant?: 'file' | 'link' | 'text';\n  /**\n   * Used for a compact version of variant 'file' type\n   * @default false\n   */\n  compact?: FileItemProps['compact'];\n  /** Thumbnail image. */\n  thumbnail?: string;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLDivElement | HTMLAnchorElement | HTMLSpanElement>;\n}\n\nconst FileDisplay: FunctionComponent<FileDisplayProps & ForwardProps> = forwardRef(\n  function FileDisplay(\n    {\n      id,\n      displayText,\n      value,\n      variant,\n      thumbnail,\n      onPreview,\n      onDownload,\n      compact = false,\n      ...restProps\n    }: PropsWithoutRef<FileDisplayProps>,\n    ref: FileDisplayProps['ref']\n  ) {\n    if (variant === 'text' || !value) {\n      return (\n        <span ref={ref} {...restProps}>\n          {value ? displayText || value : <NoValue />}\n        </span>\n      );\n    }\n\n    if (variant === 'link')\n      return (\n        <Link ref={ref as Ref<HTMLAnchorElement>} {...restProps} href={value}>\n          {displayText || value}\n        </Link>\n      );\n\n    return (\n      <FileItem\n        {...restProps}\n        id={id}\n        ref={ref as Ref<HTMLDivElement>}\n        format={value.split('.').pop() ?? value}\n        name={displayText || value}\n        thumbnail={thumbnail}\n        onDownload={onDownload}\n        onPreview={onPreview}\n        compact={compact}\n      />\n    );\n  }\n);\n\nexport default FileDisplay;\n"]}
+{"version":3,"file":"FileDisplay.js","sourceRoot":"","sources":["../../../src/components/File/FileDisplay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAInC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,OAAO,MAAM,oBAAoB,CAAC;AAEzC,OAAO,QAAQ,MAAM,YAAY,CAAC;AA2BlC,MAAM,WAAW,GAAuD,UAAU,CAChF,SAAS,WAAW,CAClB,EACE,EAAE,EACF,WAAW,EACX,KAAK,EACL,OAAO,EACP,SAAS,EACT,SAAS,EACT,UAAU,EACV,OAAO,GAAG,KAAK,EACf,GAAG,SAAS,EACsB,EACpC,GAA4B;IAE5B,IAAI,OAAO,KAAK,MAAM,IAAI,CAAC,KAAK,EAAE,CAAC;QACjC,OAAO,CACL,eAAM,GAAG,EAAE,GAAG,KAAM,SAAS,YAC1B,KAAK,CAAC,CAAC,CAAC,WAAW,IAAI,KAAK,CAAC,CAAC,CAAC,KAAC,OAAO,KAAG,GACtC,CACR,CAAC;IACJ,CAAC;IAED,IAAI,OAAO,KAAK,MAAM;QACpB,OAAO,CACL,KAAC,IAAI,IAAC,GAAG,EAAE,GAA6B,KAAM,SAAS,EAAE,IAAI,EAAE,KAAK,YACjE,WAAW,IAAI,KAAK,GAChB,CACR,CAAC;IAEJ,OAAO,CACL,KAAC,QAAQ,OACH,SAAS,EACb,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAA0B,EAC/B,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,IAAI,KAAK,EACvC,IAAI,EAAE,WAAW,IAAI,KAAK,EAC1B,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,GAChB,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\n\nimport type { BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport Link from '../Link';\nimport NoValue from '../NoValue/NoValue';\n\nimport FileItem from './FileItem';\nimport type { FileItemProps } from './FileItem';\n\nexport interface FileDisplayProps\n  extends Pick<FileItemProps, 'id' | 'onPreview' | 'onDownload'>,\n    BaseProps,\n    NoChildrenProp {\n  /** URL address */\n  value?: string;\n  /** The text to be displayed. */\n  displayText?: string;\n  /**\n   * Display value either as file, link only or textual representation.\n   * @default 'file'\n   */\n  variant?: 'file' | 'link' | 'text';\n  /**\n   * Used for a compact version of variant 'file' type\n   * @default false\n   */\n  compact?: FileItemProps['compact'];\n  /** Thumbnail image. */\n  thumbnail?: string;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLDivElement | HTMLAnchorElement | HTMLSpanElement>;\n}\n\nconst FileDisplay: FunctionComponent<FileDisplayProps & ForwardProps> = forwardRef(\n  function FileDisplay(\n    {\n      id,\n      displayText,\n      value,\n      variant,\n      thumbnail,\n      onPreview,\n      onDownload,\n      compact = false,\n      ...restProps\n    }: PropsWithoutRef<FileDisplayProps>,\n    ref: FileDisplayProps['ref']\n  ) {\n    if (variant === 'text' || !value) {\n      return (\n        <span ref={ref} {...restProps}>\n          {value ? displayText || value : <NoValue />}\n        </span>\n      );\n    }\n\n    if (variant === 'link')\n      return (\n        <Link ref={ref as Ref<HTMLAnchorElement>} {...restProps} href={value}>\n          {displayText || value}\n        </Link>\n      );\n\n    return (\n      <FileItem\n        {...restProps}\n        id={id}\n        ref={ref as Ref<HTMLDivElement>}\n        format={value.split('.').pop() ?? value}\n        name={displayText || value}\n        thumbnail={thumbnail}\n        onDownload={onDownload}\n        onPreview={onPreview}\n        compact={compact}\n      />\n    );\n  }\n);\n\nexport default FileDisplay;\n"]}

package/lib/components/File/FileInput.d.ts

@@ -72,7 +72,7 @@ interface BaseFileInputProps extends BaseProps, NoChildrenProp, TestIdProp, Pick
 export interface FileInputProps extends BaseFileInputProps, MultiAttachCompactProps {
 }
 declare const _default: FunctionComponent<FileInputProps & ForwardProps> & {
-    getTestIds: (testIdProp?: string | null | undefined) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["control", "files", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
+    getTestIds: (testIdProp?: TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["control", "files", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
 };
 export default _default;
 //# sourceMappingURL=FileInput.d.ts.map