@channel.io/bezier-react 1.6.0 → 1.6.2

package/dist/cjs/components/Forms/Switch/Switch.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var index_module = require('../../../node_modules/@radix-ui/react-switch/dist/index.module.js');
+var index = require('../../../node_modules/@radix-ui/react-switch/dist/index.js');
 var useFormFieldProps = require('../useFormFieldProps.js');
 var Switch_types = require('./Switch.types.js');
 var Switch_styled = require('./Switch.styled.js');
@@ -22,7 +22,7 @@ const Switch = /*#__PURE__*/React.forwardRef(function Switch({
     required,
     ...ownProps
   } = useFormFieldProps.default(rest);
-  return /*#__PURE__*/React.createElement(index_module.Root, Object.assign({
+  return /*#__PURE__*/React.createElement(index.Root, Object.assign({
     asChild: true,
     checked: checked,
     defaultChecked: defaultChecked,
@@ -33,7 +33,7 @@ const Switch = /*#__PURE__*/React.forwardRef(function Switch({
     ref: forwardedRef,
     size: size,
     "data-testid": testId
-  }, /*#__PURE__*/React.createElement(index_module.Thumb, {
+  }, /*#__PURE__*/React.createElement(index.Thumb, {
     asChild: true
   }, /*#__PURE__*/React.createElement(Switch_styled.SwitchThumb, {
     size: size,

package/dist/cjs/components/Forms/Switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sources":["../../../../../src/components/Forms/Switch/Switch.tsx"],"sourcesContent":["import React, {\n  type ReactElement,\n  type Ref,\n  forwardRef,\n} from 'react'\n\nimport * as SwitchPrimitive from '@radix-ui/react-switch'\n\nimport useFormFieldProps from '~/src/components/Forms/useFormFieldProps'\n\nimport type SwitchProps from './Switch.types'\nimport { SwitchSize } from './Switch.types'\n\nimport * as Styled from './Switch.styled'\n\nexport const SWITCH_TEST_ID = 'bezier-react-switch'\nexport const SWITCH_HANDLE_TEST_ID = 'bezier-react-switch-handle'\n\nexport const Switch = forwardRef(function Switch(\n  {\n    testId = SWITCH_TEST_ID,\n    handleTestId = SWITCH_HANDLE_TEST_ID,\n    checked,\n    defaultChecked = false,\n    onCheckedChange,\n    size = SwitchSize.M,\n    ...rest\n  }: SwitchProps,\n  forwardedRef: Ref<HTMLButtonElement>,\n): ReactElement {\n  const {\n    disabled,\n    required,\n    ...ownProps\n  } = useFormFieldProps(rest)\n\n  return (\n    <SwitchPrimitive.Root\n      asChild\n      checked={checked}\n      defaultChecked={defaultChecked}\n      onCheckedChange={onCheckedChange}\n      required={required}\n      disabled={disabled}\n      {...ownProps}\n    >\n      <Styled.SwitchRoot\n        ref={forwardedRef}\n        size={size}\n        data-testid={testId}\n      >\n        <SwitchPrimitive.Thumb asChild>\n          <Styled.SwitchThumb\n            size={size}\n            data-testid={handleTestId}\n          />\n        </SwitchPrimitive.Thumb>\n      </Styled.SwitchRoot>\n    </SwitchPrimitive.Root>\n  )\n})\n"],"names":["SWITCH_TEST_ID","SWITCH_HANDLE_TEST_ID","Switch","forwardRef","testId","handleTestId","checked","defaultChecked","onCheckedChange","size","SwitchSize","M","rest","forwardedRef","disabled","required","ownProps","useFormFieldProps","React","createElement","SwitchPrimitive","Object","assign","asChild","Styled","ref"],"mappings":";;;;;;;;AAeO,MAAMA,cAAc,GAAG,sBAAqB;AAC5C,MAAMC,qBAAqB,GAAG,6BAA4B;MAEpDC,MAAM,gBAAGC,gBAAU,CAAC,SAASD,MAAMA,CAC9C;AACEE,EAAAA,MAAM,GAAGJ,cAAc;AACvBK,EAAAA,YAAY,GAAGJ,qBAAqB;EACpCK,OAAO;AACPC,EAAAA,cAAc,GAAG,KAAK;EACtBC,eAAe;EACfC,IAAI,GAAGC,uBAAU,CAACC,CAAC;EACnB,GAAGC,IAAAA;AACQ,CAAC,EACdC,YAAoC,EACtB;EACd,MAAM;IACJC,QAAQ;IACRC,QAAQ;IACR,GAAGC,QAAAA;AACL,GAAC,GAAGC,yBAAiB,CAACL,IAAI,CAAC,CAAA;EAE3B,oBACEM,KAAA,CAAAC,aAAA,CAACC,iBAAoB,EAAAC,MAAA,CAAAC,MAAA,CAAA;IACnBC,OAAO,EAAA,IAAA;AACPjB,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,cAAc,EAAEA,cAAe;AAC/BC,IAAAA,eAAe,EAAEA,eAAgB;AACjCO,IAAAA,QAAQ,EAAEA,QAAS;AACnBD,IAAAA,QAAQ,EAAEA,QAAAA;GACNE,EAAAA,QAAQ,gBAEZE,KAAA,CAAAC,aAAA,CAACK,wBAAiB,EAAA;AAChBC,IAAAA,GAAG,EAAEZ,YAAa;AAClBJ,IAAAA,IAAI,EAAEA,IAAK;IACX,aAAaL,EAAAA,MAAAA;AAAO,GAAA,eAEpBc,KAAA,CAAAC,aAAA,CAACC,kBAAqB,EAAA;IAACG,OAAO,EAAA,IAAA;AAAA,GAAA,eAC5BL,KAAA,CAAAC,aAAA,CAACK,yBAAkB,EAAA;AACjBf,IAAAA,IAAI,EAAEA,IAAK;IACX,aAAaJ,EAAAA,YAAAA;GACd,CACoB,CACN,CACC,CAAC,CAAA;AAE3B,CAAC;;;;;;"}
+{"version":3,"file":"Switch.js","sources":["../../../../../src/components/Forms/Switch/Switch.tsx"],"sourcesContent":["import React, {\n  type ReactElement,\n  type Ref,\n  forwardRef,\n} from 'react'\n\nimport * as SwitchPrimitive from '@radix-ui/react-switch'\n\nimport useFormFieldProps from '~/src/components/Forms/useFormFieldProps'\n\nimport type SwitchProps from './Switch.types'\nimport { SwitchSize } from './Switch.types'\n\nimport * as Styled from './Switch.styled'\n\nexport const SWITCH_TEST_ID = 'bezier-react-switch'\nexport const SWITCH_HANDLE_TEST_ID = 'bezier-react-switch-handle'\n\nexport const Switch = forwardRef(function Switch(\n  {\n    testId = SWITCH_TEST_ID,\n    handleTestId = SWITCH_HANDLE_TEST_ID,\n    checked,\n    defaultChecked = false,\n    onCheckedChange,\n    size = SwitchSize.M,\n    ...rest\n  }: SwitchProps,\n  forwardedRef: Ref<HTMLButtonElement>,\n): ReactElement {\n  const {\n    disabled,\n    required,\n    ...ownProps\n  } = useFormFieldProps(rest)\n\n  return (\n    <SwitchPrimitive.Root\n      asChild\n      checked={checked}\n      defaultChecked={defaultChecked}\n      onCheckedChange={onCheckedChange}\n      required={required}\n      disabled={disabled}\n      {...ownProps}\n    >\n      <Styled.SwitchRoot\n        ref={forwardedRef}\n        size={size}\n        data-testid={testId}\n      >\n        <SwitchPrimitive.Thumb asChild>\n          <Styled.SwitchThumb\n            size={size}\n            data-testid={handleTestId}\n          />\n        </SwitchPrimitive.Thumb>\n      </Styled.SwitchRoot>\n    </SwitchPrimitive.Root>\n  )\n})\n"],"names":["SWITCH_TEST_ID","SWITCH_HANDLE_TEST_ID","Switch","forwardRef","testId","handleTestId","checked","defaultChecked","onCheckedChange","size","SwitchSize","M","rest","forwardedRef","disabled","required","ownProps","useFormFieldProps","React","createElement","SwitchPrimitive","Object","assign","asChild","Styled","ref"],"mappings":";;;;;;;;AAeO,MAAMA,cAAc,GAAG,sBAAqB;AAC5C,MAAMC,qBAAqB,GAAG,6BAA4B;MAEpDC,MAAM,gBAAGC,gBAAU,CAAC,SAASD,MAAMA,CAC9C;AACEE,EAAAA,MAAM,GAAGJ,cAAc;AACvBK,EAAAA,YAAY,GAAGJ,qBAAqB;EACpCK,OAAO;AACPC,EAAAA,cAAc,GAAG,KAAK;EACtBC,eAAe;EACfC,IAAI,GAAGC,uBAAU,CAACC,CAAC;EACnB,GAAGC,IAAAA;AACQ,CAAC,EACdC,YAAoC,EACtB;EACd,MAAM;IACJC,QAAQ;IACRC,QAAQ;IACR,GAAGC,QAAAA;AACL,GAAC,GAAGC,yBAAiB,CAACL,IAAI,CAAC,CAAA;EAE3B,oBACEM,KAAA,CAAAC,aAAA,CAACC,UAAoB,EAAAC,MAAA,CAAAC,MAAA,CAAA;IACnBC,OAAO,EAAA,IAAA;AACPjB,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,cAAc,EAAEA,cAAe;AAC/BC,IAAAA,eAAe,EAAEA,eAAgB;AACjCO,IAAAA,QAAQ,EAAEA,QAAS;AACnBD,IAAAA,QAAQ,EAAEA,QAAAA;GACNE,EAAAA,QAAQ,gBAEZE,KAAA,CAAAC,aAAA,CAACK,wBAAiB,EAAA;AAChBC,IAAAA,GAAG,EAAEZ,YAAa;AAClBJ,IAAAA,IAAI,EAAEA,IAAK;IACX,aAAaL,EAAAA,MAAAA;AAAO,GAAA,eAEpBc,KAAA,CAAAC,aAAA,CAACC,WAAqB,EAAA;IAACG,OAAO,EAAA,IAAA;AAAA,GAAA,eAC5BL,KAAA,CAAAC,aAAA,CAACK,yBAAkB,EAAA;AACjBf,IAAAA,IAAI,EAAEA,IAAK;IACX,aAAaJ,EAAAA,YAAAA;GACd,CACoB,CACN,CACC,CAAC,CAAA;AAE3B,CAAC;;;;;;"}

package/dist/cjs/components/ListItem/ListItem.styled.js

@@ -3,8 +3,8 @@
 var DisabledOpacity = require('../../constants/DisabledOpacity.js');
 var ListItem_types = require('./ListItem.types.js');
 var utils = require('./utils.js');
-var index = require('../../foundation/Transition/index.js');
 var Icon = require('../Icon/Icon.js');
+var index = require('../../foundation/Transition/index.js');
 var FoundationStyledComponent = require('../../foundation/FoundationStyledComponent.js');
 var Mixins = require('../../foundation/Mixins.js');
 var Typography = require('../../foundation/Typography.js');

package/dist/cjs/components/Modals/Modal/Modal.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var index_module = require('../../../node_modules/@radix-ui/react-dialog/dist/index.module.js');
+var index = require('../../../node_modules/@radix-ui/react-dialog/dist/index.js');
 var functionUtils = require('../../../utils/functionUtils.js');
 
 /**
@@ -36,7 +36,7 @@ function Modal({
     const callback = open ? onShow : onHide;
     callback();
   }, [onShow, onHide]);
-  return /*#__PURE__*/React.createElement(index_module.Root, {
+  return /*#__PURE__*/React.createElement(index.Root, {
     open: show,
     defaultOpen: defaultShow,
     onOpenChange: onOpenChange

package/dist/cjs/components/Modals/Modal/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sources":["../../../../../src/components/Modals/Modal/Modal.tsx"],"sourcesContent":["import React, { useCallback } from 'react'\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\n\nimport { noop } from '~/src/utils/functionUtils'\n\nimport { type ModalProps } from './Modal.types'\n\n/**\n * `Modal` is a dialog that appears on top of the page.\n *\n * `Modal` is a context of the Modal-related components. It doesn't render any DOM node.\n * It controls the visibility of the entire component and provides\n * handlers and accessibility properties to Modal-related components.\n *\n * @example\n *\n * ```tsx\n * // Anatomy of the Modal\n * <Modal>\n *  <ModalTrigger />\n *  <ModalContent>\n *    <ModalHeader />\n *    <ModalBody />\n *    <ModalFooter />\n *  </ModalContent>\n * </Modal>\n * ```\n */\nexport function Modal({\n  children,\n  show,\n  defaultShow,\n  onShow = noop,\n  onHide = noop,\n}: ModalProps) {\n  const onOpenChange = useCallback<NonNullable<DialogPrimitive.DialogProps['onOpenChange']>>((open) => {\n    const callback = open ? onShow : onHide\n    callback()\n  }, [\n    onShow,\n    onHide,\n  ])\n\n  return (\n    <DialogPrimitive.Root\n      open={show}\n      defaultOpen={defaultShow}\n      onOpenChange={onOpenChange}\n    >\n      { children }\n    </DialogPrimitive.Root>\n  )\n}\n\n"],"names":["Modal","children","show","defaultShow","onShow","noop","onHide","onOpenChange","useCallback","open","callback","React","createElement","DialogPrimitive","defaultOpen"],"mappings":";;;;;;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,KAAKA,CAAC;EACpBC,QAAQ;EACRC,IAAI;EACJC,WAAW;AACXC,EAAAA,MAAM,GAAGC,kBAAI;AACbC,EAAAA,MAAM,GAAGD,kBAAAA;AACC,CAAC,EAAE;AACb,EAAA,MAAME,YAAY,GAAGC,iBAAW,CAA4DC,IAAI,IAAK;AACnG,IAAA,MAAMC,QAAQ,GAAGD,IAAI,GAAGL,MAAM,GAAGE,MAAM,CAAA;AACvCI,IAAAA,QAAQ,EAAE,CAAA;AACZ,GAAC,EAAE,CACDN,MAAM,EACNE,MAAM,CACP,CAAC,CAAA;AAEF,EAAA,oBACEK,KAAA,CAAAC,aAAA,CAACC,iBAAoB,EAAA;AACnBJ,IAAAA,IAAI,EAAEP,IAAK;AACXY,IAAAA,WAAW,EAAEX,WAAY;AACzBI,IAAAA,YAAY,EAAEA,YAAAA;AAAa,GAAA,EAEzBN,QACkB,CAAC,CAAA;AAE3B;;;;"}
+{"version":3,"file":"Modal.js","sources":["../../../../../src/components/Modals/Modal/Modal.tsx"],"sourcesContent":["import React, { useCallback } from 'react'\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\n\nimport { noop } from '~/src/utils/functionUtils'\n\nimport { type ModalProps } from './Modal.types'\n\n/**\n * `Modal` is a dialog that appears on top of the page.\n *\n * `Modal` is a context of the Modal-related components. It doesn't render any DOM node.\n * It controls the visibility of the entire component and provides\n * handlers and accessibility properties to Modal-related components.\n *\n * @example\n *\n * ```tsx\n * // Anatomy of the Modal\n * <Modal>\n *  <ModalTrigger />\n *  <ModalContent>\n *    <ModalHeader />\n *    <ModalBody />\n *    <ModalFooter />\n *  </ModalContent>\n * </Modal>\n * ```\n */\nexport function Modal({\n  children,\n  show,\n  defaultShow,\n  onShow = noop,\n  onHide = noop,\n}: ModalProps) {\n  const onOpenChange = useCallback<NonNullable<DialogPrimitive.DialogProps['onOpenChange']>>((open) => {\n    const callback = open ? onShow : onHide\n    callback()\n  }, [\n    onShow,\n    onHide,\n  ])\n\n  return (\n    <DialogPrimitive.Root\n      open={show}\n      defaultOpen={defaultShow}\n      onOpenChange={onOpenChange}\n    >\n      { children }\n    </DialogPrimitive.Root>\n  )\n}\n\n"],"names":["Modal","children","show","defaultShow","onShow","noop","onHide","onOpenChange","useCallback","open","callback","React","createElement","DialogPrimitive","defaultOpen"],"mappings":";;;;;;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,KAAKA,CAAC;EACpBC,QAAQ;EACRC,IAAI;EACJC,WAAW;AACXC,EAAAA,MAAM,GAAGC,kBAAI;AACbC,EAAAA,MAAM,GAAGD,kBAAAA;AACC,CAAC,EAAE;AACb,EAAA,MAAME,YAAY,GAAGC,iBAAW,CAA4DC,IAAI,IAAK;AACnG,IAAA,MAAMC,QAAQ,GAAGD,IAAI,GAAGL,MAAM,GAAGE,MAAM,CAAA;AACvCI,IAAAA,QAAQ,EAAE,CAAA;AACZ,GAAC,EAAE,CACDN,MAAM,EACNE,MAAM,CACP,CAAC,CAAA;AAEF,EAAA,oBACEK,KAAA,CAAAC,aAAA,CAACC,UAAoB,EAAA;AACnBJ,IAAAA,IAAI,EAAEP,IAAK;AACXY,IAAAA,WAAW,EAAEX,WAAY;AACzBI,IAAAA,YAAY,EAAEA,YAAAA;AAAa,GAAA,EAEzBN,QACkB,CAAC,CAAA;AAE3B;;;;"}

package/dist/cjs/components/Modals/Modal/Modal.styled.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index_module = require('../../../node_modules/@radix-ui/react-dialog/dist/index.module.js');
+var index = require('../../../node_modules/@radix-ui/react-dialog/dist/index.js');
 var styleUtils = require('../../../utils/styleUtils.js');
 var Button = require('../../Button/Button.js');
 var Button_types = require('../../Button/Button.types.js');
@@ -8,7 +8,7 @@ var Text = require('../../Text/Text.js');
 var ModalAnimation_styled = require('./ModalAnimation.styled.js');
 var FoundationStyledComponent = require('../../../foundation/FoundationStyledComponent.js');
 
-const DialogPrimitiveOverlay = /*#__PURE__*/FoundationStyledComponent.styled(index_module.Overlay).withConfig({
+const DialogPrimitiveOverlay = /*#__PURE__*/FoundationStyledComponent.styled(index.Overlay).withConfig({
   displayName: "Modalstyled__DialogPrimitiveOverlay",
   componentId: "sc-p0ldb5-0"
 })(["position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--bezier-modal-z-index);display:grid;place-items:center;padding:40px 0;overflow-y:auto;background-color:var(--bgtxt-absolute-black-lighter);&[data-state='open']{", "}"], ModalAnimation_styled.default.overlayShow);

package/dist/cjs/components/Modals/Modal/Modal.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.styled.js","sources":["../../../../../src/components/Modals/Modal/Modal.styled.ts"],"sourcesContent":["import * as DialogPrimitive from '@radix-ui/react-dialog'\n\nimport {\n  css,\n  styled,\n} from '~/src/foundation'\n\nimport { gap } from '~/src/utils/styleUtils'\n\nimport {\n  Button,\n  ButtonColorVariant,\n  ButtonSize,\n  ButtonStyleVariant,\n} from '~/src/components/Button'\nimport { Text } from '~/src/components/Text'\n\nimport {\n  type ModalBodyProps,\n  type ModalContentProps,\n  type ModalFooterProps,\n  type ModalHeaderProps,\n} from './Modal.types'\n\nimport ModalAnimation from './ModalAnimation.styled'\n\nexport const DialogPrimitiveOverlay = styled(DialogPrimitive.Overlay)`\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: var(--bezier-modal-z-index);\n  display: grid;\n  place-items: center;\n  padding: 40px 0;\n  overflow-y: auto;\n  background-color: var(--bgtxt-absolute-black-lighter);\n\n  &[data-state='open'] {\n    ${ModalAnimation.overlayShow}\n  }\n`\n\nexport const Content = styled.div<ModalContentProps>`\n  ${({ foundation }) => foundation?.rounding.round20}\n  ${({ foundation }) => foundation?.elevation.ev4()}\n\n  position: relative;\n  box-sizing: border-box;\n  width: var(--bezier-modal-width);\n  min-width: 360px;\n  max-width: 100vw;\n  height: var(--bezier-modal-height);\n  max-height: 100%;\n  overflow: visible;\n  color: var(--bg-grey-darkest);\n  word-break: break-word;\n\n  &[data-state='open'] {\n    ${ModalAnimation.contentShow}\n  }\n\n  &:focus {\n    outline: none;\n  }\n\n  /* NOTE(@ed): to show a focus ring when the modal is mounted */\n  & [data-component='BezierButton']:focus {\n    box-shadow: 0 0 0 3px var(--bgtxt-cobalt-light);\n  }\n\n  ${({ interpolation }) => interpolation}\n`\n\nexport const Section = styled.section`\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n`\n\nconst MODAL_PADDING = 24\nconst HEADER_BODY_GAP = 12\nconst FOOTER_TOP_GAP = 16\n\nexport const Body = styled.div<ModalBodyProps>`\n  flex: 1;\n  padding: ${MODAL_PADDING}px;\n\n  ${({ interpolation }) => interpolation}\n`\n\nexport const Header = styled.header<ModalHeaderProps>`\n  display: flex;\n  flex-direction: column;\n  padding: ${MODAL_PADDING}px ${MODAL_PADDING}px 0 ${MODAL_PADDING}px;\n  ${gap(12)}\n\n  /* NOTE(@ed): Support when the ModalBody is used as stand-alone */\n  ${({ hidden }) => !hidden && css`\n    & + ${Body},\n    & + * ${Body} {\n      padding-top: ${HEADER_BODY_GAP}px;\n    }\n  `}\n\n  ${({ interpolation }) => interpolation}\n`\n\nexport const Footer = styled.footer<ModalFooterProps>`\n  display: flex;\n  padding: ${FOOTER_TOP_GAP}px ${MODAL_PADDING}px ${MODAL_PADDING}px;\n\n  /* NOTE(@ed): Support when the ModalBody is used as stand-alone */\n  /* stylelint-disable declaration-block-semicolon-newline-after, rule-empty-line-before */\n  ${Body} + &,\n  ${Body} + * & {\n    padding-top: 0;\n    margin-top: ${FOOTER_TOP_GAP - MODAL_PADDING}px;\n  }\n  /* stylelint-enable declaration-block-semicolon-newline-after, rule-empty-line-before */\n\n  ${({ interpolation }) => interpolation}\n`\n\nexport const TitleContainer = styled.div`\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  ${gap(6)}\n`\n\nexport const HeadingGroup = styled.hgroup`\n  display: flex;\n  flex: 1;\n  flex-direction: column-reverse;\n  ${gap(4)}\n`\n\nexport const Title = styled(Text).attrs({\n  forwardedAs: 'h2',\n  bold: true,\n  color: 'txt-black-darkest',\n})`\n  width: 100%;\n`\n\nconst CLOSE_ICON_BUTTON_SIZE = ButtonSize.M\nconst CLOSE_ICON_BUTTON_MARGIN_X = -6\nconst CLOSE_ICON_BUTTON_MARGIN_Y = -6\n\nexport const CloseIconButton = styled(Button).attrs({\n  size: CLOSE_ICON_BUTTON_SIZE,\n  leftContent: 'cancel',\n  colorVariant: ButtonColorVariant.MonochromeDark,\n  styleVariant: ButtonStyleVariant.Tertiary,\n})`\n  position: absolute;\n  top: ${MODAL_PADDING + CLOSE_ICON_BUTTON_MARGIN_X}px;\n  right: ${MODAL_PADDING + CLOSE_ICON_BUTTON_MARGIN_Y}px;\n`\n\nexport const CloseIconButtonSpacer = styled(Button).attrs({\n  forwardedAs: 'div',\n  size: CLOSE_ICON_BUTTON_SIZE,\n})`\n  margin-top: ${CLOSE_ICON_BUTTON_MARGIN_X}px;\n  margin-right: ${CLOSE_ICON_BUTTON_MARGIN_Y}px;\n  pointer-events: none;\n  visibility: hidden;\n`\n\nexport const FooterLeftContent = styled.div`\n  margin-right: auto;\n`\n\nexport const FooterRightContent = styled.div`\n  margin-left: auto;\n`\n"],"names":["DialogPrimitiveOverlay","styled","DialogPrimitive","withConfig","displayName","componentId","ModalAnimation","overlayShow","Content","div","foundation","rounding","round20","elevation","ev4","contentShow","interpolation","Section","section","MODAL_PADDING","HEADER_BODY_GAP","FOOTER_TOP_GAP","Body","Header","header","gap","hidden","css","Footer","footer","TitleContainer","HeadingGroup","hgroup","Title","Text","attrs","forwardedAs","bold","color","CLOSE_ICON_BUTTON_SIZE","ButtonSize","M","CLOSE_ICON_BUTTON_MARGIN_X","CLOSE_ICON_BUTTON_MARGIN_Y","CloseIconButton","Button","size","leftContent","colorVariant","ButtonColorVariant","MonochromeDark","styleVariant","ButtonStyleVariant","Tertiary","CloseIconButtonSpacer","FooterLeftContent","FooterRightContent"],"mappings":"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"}
+{"version":3,"file":"Modal.styled.js","sources":["../../../../../src/components/Modals/Modal/Modal.styled.ts"],"sourcesContent":["import * as DialogPrimitive from '@radix-ui/react-dialog'\n\nimport {\n  css,\n  styled,\n} from '~/src/foundation'\n\nimport { gap } from '~/src/utils/styleUtils'\n\nimport {\n  Button,\n  ButtonColorVariant,\n  ButtonSize,\n  ButtonStyleVariant,\n} from '~/src/components/Button'\nimport { Text } from '~/src/components/Text'\n\nimport {\n  type ModalBodyProps,\n  type ModalContentProps,\n  type ModalFooterProps,\n  type ModalHeaderProps,\n} from './Modal.types'\n\nimport ModalAnimation from './ModalAnimation.styled'\n\nexport const DialogPrimitiveOverlay = styled(DialogPrimitive.Overlay)`\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: var(--bezier-modal-z-index);\n  display: grid;\n  place-items: center;\n  padding: 40px 0;\n  overflow-y: auto;\n  background-color: var(--bgtxt-absolute-black-lighter);\n\n  &[data-state='open'] {\n    ${ModalAnimation.overlayShow}\n  }\n`\n\nexport const Content = styled.div<ModalContentProps>`\n  ${({ foundation }) => foundation?.rounding.round20}\n  ${({ foundation }) => foundation?.elevation.ev4()}\n\n  position: relative;\n  box-sizing: border-box;\n  width: var(--bezier-modal-width);\n  min-width: 360px;\n  max-width: 100vw;\n  height: var(--bezier-modal-height);\n  max-height: 100%;\n  overflow: visible;\n  color: var(--bg-grey-darkest);\n  word-break: break-word;\n\n  &[data-state='open'] {\n    ${ModalAnimation.contentShow}\n  }\n\n  &:focus {\n    outline: none;\n  }\n\n  /* NOTE(@ed): to show a focus ring when the modal is mounted */\n  & [data-component='BezierButton']:focus {\n    box-shadow: 0 0 0 3px var(--bgtxt-cobalt-light);\n  }\n\n  ${({ interpolation }) => interpolation}\n`\n\nexport const Section = styled.section`\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n`\n\nconst MODAL_PADDING = 24\nconst HEADER_BODY_GAP = 12\nconst FOOTER_TOP_GAP = 16\n\nexport const Body = styled.div<ModalBodyProps>`\n  flex: 1;\n  padding: ${MODAL_PADDING}px;\n\n  ${({ interpolation }) => interpolation}\n`\n\nexport const Header = styled.header<ModalHeaderProps>`\n  display: flex;\n  flex-direction: column;\n  padding: ${MODAL_PADDING}px ${MODAL_PADDING}px 0 ${MODAL_PADDING}px;\n  ${gap(12)}\n\n  /* NOTE(@ed): Support when the ModalBody is used as stand-alone */\n  ${({ hidden }) => !hidden && css`\n    & + ${Body},\n    & + * ${Body} {\n      padding-top: ${HEADER_BODY_GAP}px;\n    }\n  `}\n\n  ${({ interpolation }) => interpolation}\n`\n\nexport const Footer = styled.footer<ModalFooterProps>`\n  display: flex;\n  padding: ${FOOTER_TOP_GAP}px ${MODAL_PADDING}px ${MODAL_PADDING}px;\n\n  /* NOTE(@ed): Support when the ModalBody is used as stand-alone */\n  /* stylelint-disable declaration-block-semicolon-newline-after, rule-empty-line-before */\n  ${Body} + &,\n  ${Body} + * & {\n    padding-top: 0;\n    margin-top: ${FOOTER_TOP_GAP - MODAL_PADDING}px;\n  }\n  /* stylelint-enable declaration-block-semicolon-newline-after, rule-empty-line-before */\n\n  ${({ interpolation }) => interpolation}\n`\n\nexport const TitleContainer = styled.div`\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  ${gap(6)}\n`\n\nexport const HeadingGroup = styled.hgroup`\n  display: flex;\n  flex: 1;\n  flex-direction: column-reverse;\n  ${gap(4)}\n`\n\nexport const Title = styled(Text).attrs({\n  forwardedAs: 'h2',\n  bold: true,\n  color: 'txt-black-darkest',\n})`\n  width: 100%;\n`\n\nconst CLOSE_ICON_BUTTON_SIZE = ButtonSize.M\nconst CLOSE_ICON_BUTTON_MARGIN_X = -6\nconst CLOSE_ICON_BUTTON_MARGIN_Y = -6\n\nexport const CloseIconButton = styled(Button).attrs({\n  size: CLOSE_ICON_BUTTON_SIZE,\n  leftContent: 'cancel',\n  colorVariant: ButtonColorVariant.MonochromeDark,\n  styleVariant: ButtonStyleVariant.Tertiary,\n})`\n  position: absolute;\n  top: ${MODAL_PADDING + CLOSE_ICON_BUTTON_MARGIN_X}px;\n  right: ${MODAL_PADDING + CLOSE_ICON_BUTTON_MARGIN_Y}px;\n`\n\nexport const CloseIconButtonSpacer = styled(Button).attrs({\n  forwardedAs: 'div',\n  size: CLOSE_ICON_BUTTON_SIZE,\n})`\n  margin-top: ${CLOSE_ICON_BUTTON_MARGIN_X}px;\n  margin-right: ${CLOSE_ICON_BUTTON_MARGIN_Y}px;\n  pointer-events: none;\n  visibility: hidden;\n`\n\nexport const FooterLeftContent = styled.div`\n  margin-right: auto;\n`\n\nexport const FooterRightContent = styled.div`\n  margin-left: auto;\n`\n"],"names":["DialogPrimitiveOverlay","styled","DialogPrimitive","withConfig","displayName","componentId","ModalAnimation","overlayShow","Content","div","foundation","rounding","round20","elevation","ev4","contentShow","interpolation","Section","section","MODAL_PADDING","HEADER_BODY_GAP","FOOTER_TOP_GAP","Body","Header","header","gap","hidden","css","Footer","footer","TitleContainer","HeadingGroup","hgroup","Title","Text","attrs","forwardedAs","bold","color","CLOSE_ICON_BUTTON_SIZE","ButtonSize","M","CLOSE_ICON_BUTTON_MARGIN_X","CLOSE_ICON_BUTTON_MARGIN_Y","CloseIconButton","Button","size","leftContent","colorVariant","ButtonColorVariant","MonochromeDark","styleVariant","ButtonStyleVariant","Tertiary","CloseIconButtonSpacer","FooterLeftContent","FooterRightContent"],"mappings":"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"}

package/dist/cjs/components/Modals/Modal/ModalContent.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var index_module = require('../../../node_modules/@radix-ui/react-dialog/dist/index.module.js');
+var index = require('../../../node_modules/@radix-ui/react-dialog/dist/index.js');
 var ZIndex = require('../../../constants/ZIndex.js');
 var domUtils = require('../../../utils/domUtils.js');
 var typeUtils = require('../../../utils/typeUtils.js');
@@ -35,11 +35,11 @@ const ModalContent = /*#__PURE__*/React.forwardRef(function ModalContent({
   const contextValue = React.useMemo(() => ({
     showCloseIcon
   }), [showCloseIcon]);
-  return /*#__PURE__*/React.createElement(index_module.Portal, {
+  return /*#__PURE__*/React.createElement(index.Portal, {
     container: container
   }, /*#__PURE__*/React.createElement(Modal_styled.DialogPrimitiveOverlay, {
     style: overlayStyle
-  }, /*#__PURE__*/React.createElement(index_module.Content, {
+  }, /*#__PURE__*/React.createElement(index.Content, {
     asChild: true
   }, /*#__PURE__*/React.createElement(Modal_styled.Content, Object.assign({
     "aria-modal": true,

package/dist/cjs/components/Modals/Modal/ModalContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalContent.js","sources":["../../../../../src/components/Modals/Modal/ModalContent.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useMemo,\n} from 'react'\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\n\nimport { ZIndex } from '~/src/constants/ZIndex'\nimport { document } from '~/src/utils/domUtils'\nimport { isNumber } from '~/src/utils/typeUtils'\n\nimport {\n  type ModalContentContextValue,\n  type ModalContentProps,\n} from './Modal.types'\nimport ModalContentContext from './ModalContentContext'\nimport { ModalClose } from './ModalHelpers'\n\nimport * as Styled from './Modal.styled'\n\n/**\n * `ModalContent` is a container of the modal content.\n * It creates a portal to render the modal content outside of the DOM tree\n * and renders overlay behind the modal content too.\n */\nexport const ModalContent = forwardRef(function ModalContent({\n  children,\n  style,\n  container = document.body,\n  showCloseIcon = false,\n  width = 'max-content',\n  height = 'fit-content',\n  zIndex = ZIndex.Modal,\n  ...rest\n}: ModalContentProps, forwardedRef: React.Ref<HTMLDivElement>) {\n  const overlayStyle = useMemo((): React.CSSProperties & {\n    '--bezier-modal-z-index': ModalContentProps['zIndex']\n  } => ({\n    '--bezier-modal-z-index': zIndex,\n  }), [zIndex])\n\n  const contentStyle = useMemo((): React.CSSProperties & {\n    '--bezier-modal-width': ModalContentProps['width']\n    '--bezier-modal-height': ModalContentProps['height']\n  } => ({\n    ...style,\n    '--bezier-modal-width': isNumber(width) ? `${width}px` : width,\n    '--bezier-modal-height': isNumber(height) ? `${height}px` : height,\n  }), [\n    style,\n    width,\n    height,\n  ])\n\n  const contextValue = useMemo((): ModalContentContextValue => ({\n    showCloseIcon,\n  }), [showCloseIcon])\n\n  return (\n    <DialogPrimitive.Portal container={container}>\n      <Styled.DialogPrimitiveOverlay style={overlayStyle}>\n        <DialogPrimitive.Content asChild>\n          <Styled.Content\n            aria-modal\n            ref={forwardedRef}\n            style={contentStyle}\n            {...rest}\n          >\n            <Styled.Section>\n              <ModalContentContext.Provider value={contextValue}>\n                { children }\n              </ModalContentContext.Provider>\n\n              { /* NOTE: To prevent focusing first on the close button when opening the modal, place the close button behind. */ }\n              { showCloseIcon && (\n                <ModalClose>\n                  <Styled.CloseIconButton />\n                </ModalClose>\n              ) }\n            </Styled.Section>\n          </Styled.Content>\n        </DialogPrimitive.Content>\n      </Styled.DialogPrimitiveOverlay>\n    </DialogPrimitive.Portal>\n  )\n})\n"],"names":["ModalContent","forwardRef","children","style","container","document","body","showCloseIcon","width","height","zIndex","ZIndex","Modal","rest","forwardedRef","overlayStyle","useMemo","contentStyle","isNumber","contextValue","React","createElement","DialogPrimitive","Styled","asChild","Object","assign","ref","ModalContentContext","Provider","value","ModalClose"],"mappings":";;;;;;;;;;;AAoBA;AACA;AACA;AACA;AACA;MACaA,YAAY,gBAAGC,gBAAU,CAAC,SAASD,YAAYA,CAAC;EAC3DE,QAAQ;EACRC,KAAK;EACLC,SAAS,GAAGC,iBAAQ,CAACC,IAAI;AACzBC,EAAAA,aAAa,GAAG,KAAK;AACrBC,EAAAA,KAAK,GAAG,aAAa;AACrBC,EAAAA,MAAM,GAAG,aAAa;EACtBC,MAAM,GAAGC,aAAM,CAACC,KAAK;EACrB,GAAGC,IAAAA;AACc,CAAC,EAAEC,YAAuC,EAAE;AAC7D,EAAA,MAAMC,YAAY,GAAGC,aAAO,CAAC,OAEvB;AACJ,IAAA,wBAAwB,EAAEN,MAAAA;AAC5B,GAAC,CAAC,EAAE,CAACA,MAAM,CAAC,CAAC,CAAA;AAEb,EAAA,MAAMO,YAAY,GAAGD,aAAO,CAAC,OAGvB;AACJ,IAAA,GAAGb,KAAK;IACR,sBAAsB,EAAEe,kBAAQ,CAACV,KAAK,CAAC,GAAI,CAAEA,EAAAA,KAAM,CAAG,EAAA,CAAA,GAAGA,KAAK;IAC9D,uBAAuB,EAAEU,kBAAQ,CAACT,MAAM,CAAC,GAAI,CAAA,EAAEA,MAAO,CAAA,EAAA,CAAG,GAAGA,MAAAA;GAC7D,CAAC,EAAE,CACFN,KAAK,EACLK,KAAK,EACLC,MAAM,CACP,CAAC,CAAA;AAEF,EAAA,MAAMU,YAAY,GAAGH,aAAO,CAAC,OAAiC;AAC5DT,IAAAA,aAAAA;AACF,GAAC,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC,CAAA;AAEpB,EAAA,oBACEa,KAAA,CAAAC,aAAA,CAACC,mBAAsB,EAAA;AAAClB,IAAAA,SAAS,EAAEA,SAAAA;AAAU,GAAA,eAC3CgB,KAAA,CAAAC,aAAA,CAACE,mCAA6B,EAAA;AAACpB,IAAAA,KAAK,EAAEY,YAAAA;AAAa,GAAA,eACjDK,KAAA,CAAAC,aAAA,CAACC,oBAAuB,EAAA;IAACE,OAAO,EAAA,IAAA;GAC9BJ,eAAAA,KAAA,CAAAC,aAAA,CAACE,oBAAc,EAAAE,MAAA,CAAAC,MAAA,CAAA;IACb,YAAU,EAAA,IAAA;AACVC,IAAAA,GAAG,EAAEb,YAAa;AAClBX,IAAAA,KAAK,EAAEc,YAAAA;AAAa,GAAA,EAChBJ,IAAI,CAERO,eAAAA,KAAA,CAAAC,aAAA,CAACE,oBAAc,EAAA,IAAA,eACbH,KAAA,CAAAC,aAAA,CAACO,2BAAmB,CAACC,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAEX,YAAAA;GACjCjB,EAAAA,QAC0B,CAAC,EAG7BK,aAAa,iBACba,KAAA,CAAAC,aAAA,CAACU,uBAAU,EACTX,IAAAA,eAAAA,KAAA,CAAAC,aAAA,CAACE,4BAAsB,EAAA,IAAE,CACf,CAEA,CACF,CACO,CACI,CACT,CAAC,CAAA;AAE7B,CAAC;;;;"}
+{"version":3,"file":"ModalContent.js","sources":["../../../../../src/components/Modals/Modal/ModalContent.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useMemo,\n} from 'react'\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\n\nimport { ZIndex } from '~/src/constants/ZIndex'\nimport { document } from '~/src/utils/domUtils'\nimport { isNumber } from '~/src/utils/typeUtils'\n\nimport {\n  type ModalContentContextValue,\n  type ModalContentProps,\n} from './Modal.types'\nimport ModalContentContext from './ModalContentContext'\nimport { ModalClose } from './ModalHelpers'\n\nimport * as Styled from './Modal.styled'\n\n/**\n * `ModalContent` is a container of the modal content.\n * It creates a portal to render the modal content outside of the DOM tree\n * and renders overlay behind the modal content too.\n */\nexport const ModalContent = forwardRef(function ModalContent({\n  children,\n  style,\n  container = document.body,\n  showCloseIcon = false,\n  width = 'max-content',\n  height = 'fit-content',\n  zIndex = ZIndex.Modal,\n  ...rest\n}: ModalContentProps, forwardedRef: React.Ref<HTMLDivElement>) {\n  const overlayStyle = useMemo((): React.CSSProperties & {\n    '--bezier-modal-z-index': ModalContentProps['zIndex']\n  } => ({\n    '--bezier-modal-z-index': zIndex,\n  }), [zIndex])\n\n  const contentStyle = useMemo((): React.CSSProperties & {\n    '--bezier-modal-width': ModalContentProps['width']\n    '--bezier-modal-height': ModalContentProps['height']\n  } => ({\n    ...style,\n    '--bezier-modal-width': isNumber(width) ? `${width}px` : width,\n    '--bezier-modal-height': isNumber(height) ? `${height}px` : height,\n  }), [\n    style,\n    width,\n    height,\n  ])\n\n  const contextValue = useMemo((): ModalContentContextValue => ({\n    showCloseIcon,\n  }), [showCloseIcon])\n\n  return (\n    <DialogPrimitive.Portal container={container}>\n      <Styled.DialogPrimitiveOverlay style={overlayStyle}>\n        <DialogPrimitive.Content asChild>\n          <Styled.Content\n            aria-modal\n            ref={forwardedRef}\n            style={contentStyle}\n            {...rest}\n          >\n            <Styled.Section>\n              <ModalContentContext.Provider value={contextValue}>\n                { children }\n              </ModalContentContext.Provider>\n\n              { /* NOTE: To prevent focusing first on the close button when opening the modal, place the close button behind. */ }\n              { showCloseIcon && (\n                <ModalClose>\n                  <Styled.CloseIconButton />\n                </ModalClose>\n              ) }\n            </Styled.Section>\n          </Styled.Content>\n        </DialogPrimitive.Content>\n      </Styled.DialogPrimitiveOverlay>\n    </DialogPrimitive.Portal>\n  )\n})\n"],"names":["ModalContent","forwardRef","children","style","container","document","body","showCloseIcon","width","height","zIndex","ZIndex","Modal","rest","forwardedRef","overlayStyle","useMemo","contentStyle","isNumber","contextValue","React","createElement","DialogPrimitive","Styled","asChild","Object","assign","ref","ModalContentContext","Provider","value","ModalClose"],"mappings":";;;;;;;;;;;AAoBA;AACA;AACA;AACA;AACA;MACaA,YAAY,gBAAGC,gBAAU,CAAC,SAASD,YAAYA,CAAC;EAC3DE,QAAQ;EACRC,KAAK;EACLC,SAAS,GAAGC,iBAAQ,CAACC,IAAI;AACzBC,EAAAA,aAAa,GAAG,KAAK;AACrBC,EAAAA,KAAK,GAAG,aAAa;AACrBC,EAAAA,MAAM,GAAG,aAAa;EACtBC,MAAM,GAAGC,aAAM,CAACC,KAAK;EACrB,GAAGC,IAAAA;AACc,CAAC,EAAEC,YAAuC,EAAE;AAC7D,EAAA,MAAMC,YAAY,GAAGC,aAAO,CAAC,OAEvB;AACJ,IAAA,wBAAwB,EAAEN,MAAAA;AAC5B,GAAC,CAAC,EAAE,CAACA,MAAM,CAAC,CAAC,CAAA;AAEb,EAAA,MAAMO,YAAY,GAAGD,aAAO,CAAC,OAGvB;AACJ,IAAA,GAAGb,KAAK;IACR,sBAAsB,EAAEe,kBAAQ,CAACV,KAAK,CAAC,GAAI,CAAEA,EAAAA,KAAM,CAAG,EAAA,CAAA,GAAGA,KAAK;IAC9D,uBAAuB,EAAEU,kBAAQ,CAACT,MAAM,CAAC,GAAI,CAAA,EAAEA,MAAO,CAAA,EAAA,CAAG,GAAGA,MAAAA;GAC7D,CAAC,EAAE,CACFN,KAAK,EACLK,KAAK,EACLC,MAAM,CACP,CAAC,CAAA;AAEF,EAAA,MAAMU,YAAY,GAAGH,aAAO,CAAC,OAAiC;AAC5DT,IAAAA,aAAAA;AACF,GAAC,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC,CAAA;AAEpB,EAAA,oBACEa,KAAA,CAAAC,aAAA,CAACC,YAAsB,EAAA;AAAClB,IAAAA,SAAS,EAAEA,SAAAA;AAAU,GAAA,eAC3CgB,KAAA,CAAAC,aAAA,CAACE,mCAA6B,EAAA;AAACpB,IAAAA,KAAK,EAAEY,YAAAA;AAAa,GAAA,eACjDK,KAAA,CAAAC,aAAA,CAACC,aAAuB,EAAA;IAACE,OAAO,EAAA,IAAA;GAC9BJ,eAAAA,KAAA,CAAAC,aAAA,CAACE,oBAAc,EAAAE,MAAA,CAAAC,MAAA,CAAA;IACb,YAAU,EAAA,IAAA;AACVC,IAAAA,GAAG,EAAEb,YAAa;AAClBX,IAAAA,KAAK,EAAEc,YAAAA;AAAa,GAAA,EAChBJ,IAAI,CAERO,eAAAA,KAAA,CAAAC,aAAA,CAACE,oBAAc,EAAA,IAAA,eACbH,KAAA,CAAAC,aAAA,CAACO,2BAAmB,CAACC,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAEX,YAAAA;GACjCjB,EAAAA,QAC0B,CAAC,EAG7BK,aAAa,iBACba,KAAA,CAAAC,aAAA,CAACU,uBAAU,EACTX,IAAAA,eAAAA,KAAA,CAAAC,aAAA,CAACE,4BAAsB,EAAA,IAAE,CACf,CAEA,CACF,CACO,CACI,CACT,CAAC,CAAA;AAE7B,CAAC;;;;"}

package/dist/cjs/components/Modals/Modal/ModalHeader.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var index_module = require('../../../node_modules/@radix-ui/react-dialog/dist/index.module.js');
+var index = require('../../../node_modules/@radix-ui/react-dialog/dist/index.js');
 var Text = require('../../Text/Text.js');
 var Modal_types = require('./Modal.types.js');
 var ModalContentContext = require('./ModalContentContext.js');
@@ -26,7 +26,7 @@ function ModalHeaderTitle({
 }) {
   const hasSubtitle = !!subtitle;
   const titleTypo = getTitleTypo(size);
-  return /*#__PURE__*/React.createElement(index_module.Title, {
+  return /*#__PURE__*/React.createElement(index.Title, {
     asChild: true
   }, hasSubtitle ? /*#__PURE__*/React.createElement(Modal_styled.HeadingGroup, {
     role: "group",
@@ -68,7 +68,7 @@ const ModalHeader = /*#__PURE__*/React.forwardRef(function ModalHeader({
   }, rest), hasTitleArea && /*#__PURE__*/React.createElement(Modal_styled.TitleContainer, null, title && /*#__PURE__*/React.createElement(ModalHeaderTitle, {
     size: titleSize,
     subtitle: subtitle
-  }, title), showCloseIcon && /*#__PURE__*/React.createElement(Modal_styled.CloseIconButtonSpacer, null)), description && /*#__PURE__*/React.createElement(index_module.Description, {
+  }, title), showCloseIcon && /*#__PURE__*/React.createElement(Modal_styled.CloseIconButtonSpacer, null)), description && /*#__PURE__*/React.createElement(index.Description, {
     asChild: true
   }, /*#__PURE__*/React.createElement(Text.default, {
     as: "p",

package/dist/cjs/components/Modals/Modal/ModalHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalHeader.js","sources":["../../../../../src/components/Modals/Modal/ModalHeader.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useContext,\n} from 'react'\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\n\nimport { Typography } from '~/src/foundation'\n\nimport { Text } from '~/src/components/Text'\nimport { VisuallyHidden } from '~/src/components/VisuallyHidden'\n\nimport {\n  type ModalHeaderProps,\n  ModalTitleSize,\n} from './Modal.types'\nimport ModalContentContext from './ModalContentContext'\n\nimport * as Styled from './Modal.styled'\n\nfunction getTitleTypo(size: ModalTitleSize) {\n  switch (size) {\n    case ModalTitleSize.L:\n      return Typography.Size24\n    case ModalTitleSize.M:\n      return Typography.Size16\n    default:\n      return Typography.Size16\n  }\n}\n\nfunction ModalHeaderTitle({\n  children,\n  size,\n  subtitle,\n}: React.PropsWithChildren<Pick<ModalHeaderProps, 'subtitle'> & { size: NonNullable<ModalHeaderProps['titleSize']> }>) {\n  const hasSubtitle = !!subtitle\n  const titleTypo = getTitleTypo(size)\n\n  return (\n    <DialogPrimitive.Title asChild>\n      { hasSubtitle\n        ? (\n          <Styled.HeadingGroup\n            role=\"group\"\n            aria-roledescription=\"Heading group\"\n          >\n            <Styled.Title typo={titleTypo}>\n              { children }\n            </Styled.Title>\n\n            <Text\n              aria-roledescription=\"subtitle\"\n              as=\"p\"\n              bold\n              color=\"txt-black-dark\"\n              typo={Typography.Size13}\n            >\n              { subtitle }\n            </Text>\n          </Styled.HeadingGroup>\n        )\n        : (\n          <Styled.Title typo={titleTypo}>\n            { children }\n          </Styled.Title>\n        ) }\n    </DialogPrimitive.Title>\n  )\n}\n\n/**\n * `ModalHeader` is a header of the modal content.\n * It renders the accessible title and description of the modal.\n * If you want to hide the title and description, use `hidden` prop.\n */\nexport const ModalHeader = forwardRef(function ModalHeader({\n  title,\n  subtitle,\n  description,\n  titleSize = ModalTitleSize.L,\n  hidden = false,\n  ...rest\n}: ModalHeaderProps, forwardedRef: React.Ref<HTMLElement>) {\n  const { showCloseIcon } = useContext(ModalContentContext)\n  const hasTitleArea = title || showCloseIcon\n  const Hidden = hidden ? VisuallyHidden : React.Fragment\n\n  return (\n    <Hidden>\n      <Styled.Header\n        ref={forwardedRef}\n        hidden={hidden}\n        {...rest}\n      >\n        { hasTitleArea && (\n          <Styled.TitleContainer>\n            { title && (\n              <ModalHeaderTitle\n                size={titleSize}\n                subtitle={subtitle}\n              >\n                { title }\n              </ModalHeaderTitle>\n            ) }\n\n            { showCloseIcon && (\n              <Styled.CloseIconButtonSpacer />\n            ) }\n          </Styled.TitleContainer>\n        ) }\n\n        { description && (\n          <DialogPrimitive.Description asChild>\n            <Text\n              as=\"p\"\n              color=\"txt-black-darkest\"\n              typo={Typography.Size15}\n            >\n              { description }\n            </Text>\n          </DialogPrimitive.Description>\n        ) }\n      </Styled.Header>\n    </Hidden>\n  )\n})\n"],"names":["getTitleTypo","size","ModalTitleSize","L","Typography","Size24","M","Size16","ModalHeaderTitle","children","subtitle","hasSubtitle","titleTypo","React","createElement","DialogPrimitive","asChild","Styled","role","typo","Text","as","bold","color","Size13","ModalHeader","forwardRef","title","description","titleSize","hidden","rest","forwardedRef","showCloseIcon","useContext","ModalContentContext","hasTitleArea","Hidden","VisuallyHidden","Fragment","Object","assign","ref","Size15"],"mappings":"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"}
+{"version":3,"file":"ModalHeader.js","sources":["../../../../../src/components/Modals/Modal/ModalHeader.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useContext,\n} from 'react'\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\n\nimport { Typography } from '~/src/foundation'\n\nimport { Text } from '~/src/components/Text'\nimport { VisuallyHidden } from '~/src/components/VisuallyHidden'\n\nimport {\n  type ModalHeaderProps,\n  ModalTitleSize,\n} from './Modal.types'\nimport ModalContentContext from './ModalContentContext'\n\nimport * as Styled from './Modal.styled'\n\nfunction getTitleTypo(size: ModalTitleSize) {\n  switch (size) {\n    case ModalTitleSize.L:\n      return Typography.Size24\n    case ModalTitleSize.M:\n      return Typography.Size16\n    default:\n      return Typography.Size16\n  }\n}\n\nfunction ModalHeaderTitle({\n  children,\n  size,\n  subtitle,\n}: React.PropsWithChildren<Pick<ModalHeaderProps, 'subtitle'> & { size: NonNullable<ModalHeaderProps['titleSize']> }>) {\n  const hasSubtitle = !!subtitle\n  const titleTypo = getTitleTypo(size)\n\n  return (\n    <DialogPrimitive.Title asChild>\n      { hasSubtitle\n        ? (\n          <Styled.HeadingGroup\n            role=\"group\"\n            aria-roledescription=\"Heading group\"\n          >\n            <Styled.Title typo={titleTypo}>\n              { children }\n            </Styled.Title>\n\n            <Text\n              aria-roledescription=\"subtitle\"\n              as=\"p\"\n              bold\n              color=\"txt-black-dark\"\n              typo={Typography.Size13}\n            >\n              { subtitle }\n            </Text>\n          </Styled.HeadingGroup>\n        )\n        : (\n          <Styled.Title typo={titleTypo}>\n            { children }\n          </Styled.Title>\n        ) }\n    </DialogPrimitive.Title>\n  )\n}\n\n/**\n * `ModalHeader` is a header of the modal content.\n * It renders the accessible title and description of the modal.\n * If you want to hide the title and description, use `hidden` prop.\n */\nexport const ModalHeader = forwardRef(function ModalHeader({\n  title,\n  subtitle,\n  description,\n  titleSize = ModalTitleSize.L,\n  hidden = false,\n  ...rest\n}: ModalHeaderProps, forwardedRef: React.Ref<HTMLElement>) {\n  const { showCloseIcon } = useContext(ModalContentContext)\n  const hasTitleArea = title || showCloseIcon\n  const Hidden = hidden ? VisuallyHidden : React.Fragment\n\n  return (\n    <Hidden>\n      <Styled.Header\n        ref={forwardedRef}\n        hidden={hidden}\n        {...rest}\n      >\n        { hasTitleArea && (\n          <Styled.TitleContainer>\n            { title && (\n              <ModalHeaderTitle\n                size={titleSize}\n                subtitle={subtitle}\n              >\n                { title }\n              </ModalHeaderTitle>\n            ) }\n\n            { showCloseIcon && (\n              <Styled.CloseIconButtonSpacer />\n            ) }\n          </Styled.TitleContainer>\n        ) }\n\n        { description && (\n          <DialogPrimitive.Description asChild>\n            <Text\n              as=\"p\"\n              color=\"txt-black-darkest\"\n              typo={Typography.Size15}\n            >\n              { description }\n            </Text>\n          </DialogPrimitive.Description>\n        ) }\n      </Styled.Header>\n    </Hidden>\n  )\n})\n"],"names":["getTitleTypo","size","ModalTitleSize","L","Typography","Size24","M","Size16","ModalHeaderTitle","children","subtitle","hasSubtitle","titleTypo","React","createElement","DialogPrimitive","asChild","Styled","role","typo","Text","as","bold","color","Size13","ModalHeader","forwardRef","title","description","titleSize","hidden","rest","forwardedRef","showCloseIcon","useContext","ModalContentContext","hasTitleArea","Hidden","VisuallyHidden","Fragment","Object","assign","ref","Size15"],"mappings":";;;;;;;;;;;AAoBA,SAASA,YAAYA,CAACC,IAAoB,EAAE;AAC1C,EAAA,QAAQA,IAAI;IACV,KAAKC,0BAAc,CAACC,CAAC;MACnB,OAAOC,qBAAU,CAACC,MAAM,CAAA;IAC1B,KAAKH,0BAAc,CAACI,CAAC;MACnB,OAAOF,qBAAU,CAACG,MAAM,CAAA;AAC1B,IAAA;MACE,OAAOH,qBAAU,CAACG,MAAM,CAAA;AAC5B,GAAA;AACF,CAAA;AAEA,SAASC,gBAAgBA,CAAC;EACxBC,QAAQ;EACRR,IAAI;AACJS,EAAAA,QAAAA;AACkH,CAAC,EAAE;AACrH,EAAA,MAAMC,WAAW,GAAG,CAAC,CAACD,QAAQ,CAAA;AAC9B,EAAA,MAAME,SAAS,GAAGZ,YAAY,CAACC,IAAI,CAAC,CAAA;AAEpC,EAAA,oBACEY,KAAA,CAAAC,aAAA,CAACC,WAAqB,EAAA;IAACC,OAAO,EAAA,IAAA;GAC1BL,EAAAA,WAAW,gBAETE,KAAA,CAAAC,aAAA,CAACG,yBAAmB,EAAA;AAClBC,IAAAA,IAAI,EAAC,OAAO;IACZ,sBAAqB,EAAA,eAAA;AAAe,GAAA,eAEpCL,KAAA,CAAAC,aAAA,CAACG,kBAAY,EAAA;AAACE,IAAAA,IAAI,EAAEP,SAAAA;AAAU,GAAA,EAC1BH,QACU,CAAC,eAEfI,KAAA,CAAAC,aAAA,CAACM,YAAI,EAAA;AACH,IAAA,sBAAA,EAAqB,UAAU;AAC/BC,IAAAA,EAAE,EAAC,GAAG;IACNC,IAAI,EAAA,IAAA;AACJC,IAAAA,KAAK,EAAC,gBAAgB;IACtBJ,IAAI,EAAEf,qBAAU,CAACoB,MAAAA;GAEfd,EAAAA,QACE,CACa,CAAC,gBAGtBG,KAAA,CAAAC,aAAA,CAACG,kBAAY,EAAA;AAACE,IAAAA,IAAI,EAAEP,SAAAA;GAChBH,EAAAA,QACU,CAEG,CAAC,CAAA;AAE5B,CAAA;;AAEA;AACA;AACA;AACA;AACA;MACagB,WAAW,gBAAGC,gBAAU,CAAC,SAASD,WAAWA,CAAC;EACzDE,KAAK;EACLjB,QAAQ;EACRkB,WAAW;EACXC,SAAS,GAAG3B,0BAAc,CAACC,CAAC;AAC5B2B,EAAAA,MAAM,GAAG,KAAK;EACd,GAAGC,IAAAA;AACa,CAAC,EAAEC,YAAoC,EAAE;EACzD,MAAM;AAAEC,IAAAA,aAAAA;AAAc,GAAC,GAAGC,gBAAU,CAACC,2BAAmB,CAAC,CAAA;AACzD,EAAA,MAAMC,YAAY,GAAGT,KAAK,IAAIM,aAAa,CAAA;EAC3C,MAAMI,MAAM,GAAGP,MAAM,GAAGQ,6BAAc,GAAGzB,KAAK,CAAC0B,QAAQ,CAAA;AAEvD,EAAA,oBACE1B,KAAA,CAAAC,aAAA,CAACuB,MAAM,qBACLxB,KAAA,CAAAC,aAAA,CAACG,mBAAa,EAAAuB,MAAA,CAAAC,MAAA,CAAA;AACZC,IAAAA,GAAG,EAAEV,YAAa;AAClBF,IAAAA,MAAM,EAAEA,MAAAA;AAAO,GAAA,EACXC,IAAI,CAENK,EAAAA,YAAY,iBACZvB,KAAA,CAAAC,aAAA,CAACG,2BAAqB,QAClBU,KAAK,iBACLd,KAAA,CAAAC,aAAA,CAACN,gBAAgB,EAAA;AACfP,IAAAA,IAAI,EAAE4B,SAAU;AAChBnB,IAAAA,QAAQ,EAAEA,QAAAA;GAERiB,EAAAA,KACc,CACnB,EAECM,aAAa,iBACbpB,KAAA,CAAAC,aAAA,CAACG,kCAA4B,MAAE,CAEZ,CACxB,EAECW,WAAW,iBACXf,KAAA,CAAAC,aAAA,CAACC,iBAA2B,EAAA;IAACC,OAAO,EAAA,IAAA;AAAA,GAAA,eAClCH,KAAA,CAAAC,aAAA,CAACM,YAAI,EAAA;AACHC,IAAAA,EAAE,EAAC,GAAG;AACNE,IAAAA,KAAK,EAAC,mBAAmB;IACzBJ,IAAI,EAAEf,qBAAU,CAACuC,MAAAA;AAAO,GAAA,EAEtBf,WACE,CACqB,CAElB,CACT,CAAC,CAAA;AAEb,CAAC;;;;"}

package/dist/cjs/components/Modals/Modal/ModalHelpers.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var index_module = require('../../../node_modules/@radix-ui/react-dialog/dist/index.module.js');
+var index = require('../../../node_modules/@radix-ui/react-dialog/dist/index.js');
 
 /**
  * `ModalTrigger` is a button that opens the modal. **It doesn't render any DOM node.**
@@ -12,7 +12,7 @@ var index_module = require('../../../node_modules/@radix-ui/react-dialog/dist/in
 function ModalTrigger({
   children
 }) {
-  return /*#__PURE__*/React.createElement(index_module.Trigger, {
+  return /*#__PURE__*/React.createElement(index.Trigger, {
     asChild: true
   }, children);
 }
@@ -24,7 +24,7 @@ function ModalTrigger({
 function ModalClose({
   children
 }) {
-  return /*#__PURE__*/React.createElement(index_module.Close, {
+  return /*#__PURE__*/React.createElement(index.Close, {
     asChild: true
   }, children);
 }

package/dist/cjs/components/Modals/Modal/ModalHelpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalHelpers.js","sources":["../../../../../src/components/Modals/Modal/ModalHelpers.tsx"],"sourcesContent":["import React from 'react'\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\n\nimport {\n  type ModalCloseProps,\n  type ModalTriggerProps,\n} from './Modal.types'\n\n/**\n * `ModalTrigger` is a button that opens the modal. **It doesn't render any DOM node.**\n * It passes the handler that opens the modal and accessibility properties to the children.\n *\n * It **must** be placed outside of the `ModalContent`.\n */\nexport function ModalTrigger({ children }: ModalTriggerProps) {\n  return (\n    <DialogPrimitive.Trigger asChild>\n      { children }\n    </DialogPrimitive.Trigger>\n  )\n}\n\n/**\n * `ModalClose` is a button that closes the modal. **It doesn't render any DOM node.**\n * It passes the handler that closes the modal to the children.\n */\nexport function ModalClose({ children }: ModalCloseProps) {\n  return (\n    <DialogPrimitive.Close asChild>\n      { children }\n    </DialogPrimitive.Close>\n  )\n}\n"],"names":["ModalTrigger","children","React","createElement","DialogPrimitive","asChild","ModalClose"],"mappings":";;;;;AASA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,YAAYA,CAAC;AAAEC,EAAAA,QAAAA;AAA4B,CAAC,EAAE;AAC5D,EAAA,oBACEC,KAAA,CAAAC,aAAA,CAACC,oBAAuB,EAAA;IAACC,OAAO,EAAA,IAAA;AAAA,GAAA,EAC5BJ,QACqB,CAAC,CAAA;AAE9B,CAAA;;AAEA;AACA;AACA;AACA;AACO,SAASK,UAAUA,CAAC;AAAEL,EAAAA,QAAAA;AAA0B,CAAC,EAAE;AACxD,EAAA,oBACEC,KAAA,CAAAC,aAAA,CAACC,kBAAqB,EAAA;IAACC,OAAO,EAAA,IAAA;AAAA,GAAA,EAC1BJ,QACmB,CAAC,CAAA;AAE5B;;;;;"}
+{"version":3,"file":"ModalHelpers.js","sources":["../../../../../src/components/Modals/Modal/ModalHelpers.tsx"],"sourcesContent":["import React from 'react'\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\n\nimport {\n  type ModalCloseProps,\n  type ModalTriggerProps,\n} from './Modal.types'\n\n/**\n * `ModalTrigger` is a button that opens the modal. **It doesn't render any DOM node.**\n * It passes the handler that opens the modal and accessibility properties to the children.\n *\n * It **must** be placed outside of the `ModalContent`.\n */\nexport function ModalTrigger({ children }: ModalTriggerProps) {\n  return (\n    <DialogPrimitive.Trigger asChild>\n      { children }\n    </DialogPrimitive.Trigger>\n  )\n}\n\n/**\n * `ModalClose` is a button that closes the modal. **It doesn't render any DOM node.**\n * It passes the handler that closes the modal to the children.\n */\nexport function ModalClose({ children }: ModalCloseProps) {\n  return (\n    <DialogPrimitive.Close asChild>\n      { children }\n    </DialogPrimitive.Close>\n  )\n}\n"],"names":["ModalTrigger","children","React","createElement","DialogPrimitive","asChild","ModalClose"],"mappings":";;;;;AASA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,YAAYA,CAAC;AAAEC,EAAAA,QAAAA;AAA4B,CAAC,EAAE;AAC5D,EAAA,oBACEC,KAAA,CAAAC,aAAA,CAACC,aAAuB,EAAA;IAACC,OAAO,EAAA,IAAA;AAAA,GAAA,EAC5BJ,QACqB,CAAC,CAAA;AAE9B,CAAA;;AAEA;AACA;AACA;AACA;AACO,SAASK,UAAUA,CAAC;AAAEL,EAAAA,QAAAA;AAA0B,CAAC,EAAE;AACxD,EAAA,oBACEC,KAAA,CAAAC,aAAA,CAACC,WAAqB,EAAA;IAACC,OAAO,EAAA,IAAA;AAAA,GAAA,EAC1BJ,QACmB,CAAC,CAAA;AAE5B;;;;;"}

package/dist/cjs/components/Status/Status.styled.js

@@ -1,8 +1,8 @@
 'use strict';
 
 var ZIndex = require('../../constants/ZIndex.js');
-var Mixins = require('../../foundation/Mixins.js');
 var Icon$1 = require('../Icon/Icon.js');
+var Mixins = require('../../foundation/Mixins.js');
 var FoundationStyledComponent = require('../../foundation/FoundationStyledComponent.js');
 
 const Circle = /*#__PURE__*/FoundationStyledComponent.styled.div.withConfig({

package/dist/cjs/components/Tabs/TabAction.styled.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index_module = require('../../node_modules/@radix-ui/react-toolbar/dist/index.module.js');
+var index = require('../../node_modules/@radix-ui/react-toolbar/dist/index.js');
 var Tabs_types = require('./Tabs.types.js');
 var Icon = require('../Icon/Icon.js');
 var FoundationStyledComponent = require('../../foundation/FoundationStyledComponent.js');
@@ -58,11 +58,11 @@ const commonStyle = FoundationStyledComponent.css`
 }) => foundation?.theme?.['bgtxt-blue-lightest']};
   }
 `;
-const ToolbarButton = /*#__PURE__*/FoundationStyledComponent.styled(index_module.Button).withConfig({
+const ToolbarButton = /*#__PURE__*/FoundationStyledComponent.styled(index.Button).withConfig({
   displayName: "TabActionstyled__ToolbarButton",
   componentId: "sc-6o1ssm-0"
 })(["", ""], commonStyle);
-const ToolbarLink = /*#__PURE__*/FoundationStyledComponent.styled(index_module.Link).withConfig({
+const ToolbarLink = /*#__PURE__*/FoundationStyledComponent.styled(index.Link).withConfig({
   displayName: "TabActionstyled__ToolbarLink",
   componentId: "sc-6o1ssm-1"
 })(["", ""], commonStyle);

package/dist/cjs/components/Tabs/TabAction.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabAction.styled.js","sources":["../../../../src/components/Tabs/TabAction.styled.ts"],"sourcesContent":["import * as Toolbar from '@radix-ui/react-toolbar'\n\nimport {\n  css,\n  styled,\n} from '~/src/foundation'\n\nimport { Icon } from '~/src/components/Icon'\n\nimport { TabSize } from './Tabs.types'\n\nfunction getPaddingStyle({ size }: { size: TabSize }) {\n  switch (size) {\n    case TabSize.L:\n      return css`\n        padding: 0 14px;\n        ${({ foundation }) => foundation?.rounding?.round12};\n      `\n    case TabSize.M:\n      return css`\n        padding: 0 14px;\n        ${({ foundation }) => foundation?.rounding?.round8};\n      `\n    default:\n    case TabSize.S:\n      return css`\n        padding: 0 7px;\n        ${({ foundation }) => foundation?.rounding?.round6};\n      `\n  }\n}\n\nconst commonStyle = css`\n  all: unset;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  margin: 4px 0 5px 0;\n  color: ${({ foundation }) => foundation?.theme?.['bgtxt-blue-normal']};\n  text-decoration: none;\n  cursor: pointer;\n\n  ${({ foundation }) => foundation?.transition?.getTransitionsCSS('background-color')};\n  ${getPaddingStyle}\n\n  &:hover {\n    background-color: ${({ foundation }) => foundation?.theme?.['bgtxt-blue-lightest']};\n  }\n`\n\ninterface ToolbarComponentProps {\n  size: TabSize\n}\n\nexport const ToolbarButton = styled(Toolbar.Button)<ToolbarComponentProps>`\n  ${commonStyle}\n`\n\nexport const ToolbarLink = styled(Toolbar.Link)<ToolbarComponentProps>`\n  ${commonStyle}\n`\n\nexport const LinkIcon = styled(Icon)`\n  margin-left: 5px;\n`\n"],"names":["getPaddingStyle","size","TabSize","L","css","foundation","rounding","round12","M","round8","S","round6","commonStyle","theme","transition","getTransitionsCSS","ToolbarButton","styled","Toolbar","withConfig","displayName","componentId","ToolbarLink","LinkIcon","Icon"],"mappings":";;;;;;;AAWA,SAASA,eAAeA,CAAC;AAAEC,EAAAA,IAAAA;AAAwB,CAAC,EAAE;AACpD,EAAA,QAAQA,IAAI;IACV,KAAKC,kBAAO,CAACC,CAAC;AACZ,MAAA,OAAOC,6BAAI,CAAA;AACjB;AACA,QAAA,EAAU,CAAC;AAAEC,QAAAA,UAAAA;AAAW,OAAC,KAAKA,UAAU,EAAEC,QAAQ,EAAEC,OAAQ,CAAA;AAC5D,MAAO,CAAA,CAAA;IACH,KAAKL,kBAAO,CAACM,CAAC;AACZ,MAAA,OAAOJ,6BAAI,CAAA;AACjB;AACA,QAAA,EAAU,CAAC;AAAEC,QAAAA,UAAAA;AAAW,OAAC,KAAKA,UAAU,EAAEC,QAAQ,EAAEG,MAAO,CAAA;AAC3D,MAAO,CAAA,CAAA;AACH,IAAA,QAAA;IACA,KAAKP,kBAAO,CAACQ,CAAC;AACZ,MAAA,OAAON,6BAAI,CAAA;AACjB;AACA,QAAA,EAAU,CAAC;AAAEC,QAAAA,UAAAA;AAAW,OAAC,KAAKA,UAAU,EAAEC,QAAQ,EAAEK,MAAO,CAAA;AAC3D,MAAO,CAAA,CAAA;AACL,GAAA;AACF,CAAA;AAEA,MAAMC,WAAW,GAAGR,6BAAI,CAAA;AACxB;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAA,EAAW,CAAC;AAAEC,EAAAA,UAAAA;AAAW,CAAC,KAAKA,UAAU,EAAEQ,KAAK,GAAG,mBAAmB,CAAE,CAAA;AACxE;AACA;AACA;AACA,EAAA,EAAI,CAAC;AAAER,EAAAA,UAAAA;AAAW,CAAC,KAAKA,UAAU,EAAES,UAAU,EAAEC,iBAAiB,CAAC,kBAAkB,CAAE,CAAA;AACtF,EAAA,EAAIf,eAAgB,CAAA;AACpB;AACA;AACA,sBAAA,EAAwB,CAAC;AAAEK,EAAAA,UAAAA;AAAW,CAAC,KAAKA,UAAU,EAAEQ,KAAK,GAAG,qBAAqB,CAAE,CAAA;AACvF;AACA,CAAC,CAAA;AAMM,MAAMG,aAAa,gBAAGC,gCAAM,CAACC,mBAAc,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,gCAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAAA,CAAA,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA,EAC/CT,WAAW,EACd;AAEM,MAAMU,WAAW,gBAAGL,gCAAM,CAACC,iBAAY,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,8BAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAAA,CAAA,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA,EAC3CT,WAAW,EACd;AAEM,MAAMW,QAAQ,gBAAGN,gCAAM,CAACO,SAAI,CAAC,CAAAL,UAAA,CAAA;EAAAC,WAAA,EAAA,2BAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAEnC,CAAA,CAAA,CAAA,kBAAA,CAAA;;;;;;"}
+{"version":3,"file":"TabAction.styled.js","sources":["../../../../src/components/Tabs/TabAction.styled.ts"],"sourcesContent":["import * as Toolbar from '@radix-ui/react-toolbar'\n\nimport {\n  css,\n  styled,\n} from '~/src/foundation'\n\nimport { Icon } from '~/src/components/Icon'\n\nimport { TabSize } from './Tabs.types'\n\nfunction getPaddingStyle({ size }: { size: TabSize }) {\n  switch (size) {\n    case TabSize.L:\n      return css`\n        padding: 0 14px;\n        ${({ foundation }) => foundation?.rounding?.round12};\n      `\n    case TabSize.M:\n      return css`\n        padding: 0 14px;\n        ${({ foundation }) => foundation?.rounding?.round8};\n      `\n    default:\n    case TabSize.S:\n      return css`\n        padding: 0 7px;\n        ${({ foundation }) => foundation?.rounding?.round6};\n      `\n  }\n}\n\nconst commonStyle = css`\n  all: unset;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  margin: 4px 0 5px 0;\n  color: ${({ foundation }) => foundation?.theme?.['bgtxt-blue-normal']};\n  text-decoration: none;\n  cursor: pointer;\n\n  ${({ foundation }) => foundation?.transition?.getTransitionsCSS('background-color')};\n  ${getPaddingStyle}\n\n  &:hover {\n    background-color: ${({ foundation }) => foundation?.theme?.['bgtxt-blue-lightest']};\n  }\n`\n\ninterface ToolbarComponentProps {\n  size: TabSize\n}\n\nexport const ToolbarButton = styled(Toolbar.Button)<ToolbarComponentProps>`\n  ${commonStyle}\n`\n\nexport const ToolbarLink = styled(Toolbar.Link)<ToolbarComponentProps>`\n  ${commonStyle}\n`\n\nexport const LinkIcon = styled(Icon)`\n  margin-left: 5px;\n`\n"],"names":["getPaddingStyle","size","TabSize","L","css","foundation","rounding","round12","M","round8","S","round6","commonStyle","theme","transition","getTransitionsCSS","ToolbarButton","styled","Toolbar","withConfig","displayName","componentId","ToolbarLink","LinkIcon","Icon"],"mappings":";;;;;;;AAWA,SAASA,eAAeA,CAAC;AAAEC,EAAAA,IAAAA;AAAwB,CAAC,EAAE;AACpD,EAAA,QAAQA,IAAI;IACV,KAAKC,kBAAO,CAACC,CAAC;AACZ,MAAA,OAAOC,6BAAI,CAAA;AACjB;AACA,QAAA,EAAU,CAAC;AAAEC,QAAAA,UAAAA;AAAW,OAAC,KAAKA,UAAU,EAAEC,QAAQ,EAAEC,OAAQ,CAAA;AAC5D,MAAO,CAAA,CAAA;IACH,KAAKL,kBAAO,CAACM,CAAC;AACZ,MAAA,OAAOJ,6BAAI,CAAA;AACjB;AACA,QAAA,EAAU,CAAC;AAAEC,QAAAA,UAAAA;AAAW,OAAC,KAAKA,UAAU,EAAEC,QAAQ,EAAEG,MAAO,CAAA;AAC3D,MAAO,CAAA,CAAA;AACH,IAAA,QAAA;IACA,KAAKP,kBAAO,CAACQ,CAAC;AACZ,MAAA,OAAON,6BAAI,CAAA;AACjB;AACA,QAAA,EAAU,CAAC;AAAEC,QAAAA,UAAAA;AAAW,OAAC,KAAKA,UAAU,EAAEC,QAAQ,EAAEK,MAAO,CAAA;AAC3D,MAAO,CAAA,CAAA;AACL,GAAA;AACF,CAAA;AAEA,MAAMC,WAAW,GAAGR,6BAAI,CAAA;AACxB;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAA,EAAW,CAAC;AAAEC,EAAAA,UAAAA;AAAW,CAAC,KAAKA,UAAU,EAAEQ,KAAK,GAAG,mBAAmB,CAAE,CAAA;AACxE;AACA;AACA;AACA,EAAA,EAAI,CAAC;AAAER,EAAAA,UAAAA;AAAW,CAAC,KAAKA,UAAU,EAAES,UAAU,EAAEC,iBAAiB,CAAC,kBAAkB,CAAE,CAAA;AACtF,EAAA,EAAIf,eAAgB,CAAA;AACpB;AACA;AACA,sBAAA,EAAwB,CAAC;AAAEK,EAAAA,UAAAA;AAAW,CAAC,KAAKA,UAAU,EAAEQ,KAAK,GAAG,qBAAqB,CAAE,CAAA;AACvF;AACA,CAAC,CAAA;AAMM,MAAMG,aAAa,gBAAGC,gCAAM,CAACC,YAAc,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,gCAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAAA,CAAA,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA,EAC/CT,WAAW,EACd;AAEM,MAAMU,WAAW,gBAAGL,gCAAM,CAACC,UAAY,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,8BAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAAA,CAAA,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA,EAC3CT,WAAW,EACd;AAEM,MAAMW,QAAQ,gBAAGN,gCAAM,CAACO,SAAI,CAAC,CAAAL,UAAA,CAAA;EAAAC,WAAA,EAAA,2BAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAEnC,CAAA,CAAA,CAAA,kBAAA,CAAA;;;;;;"}

package/dist/cjs/components/Tabs/TabActions.styled.js

@@ -1,9 +1,9 @@
 'use strict';
 
-var index_module = require('../../node_modules/@radix-ui/react-toolbar/dist/index.module.js');
+var index = require('../../node_modules/@radix-ui/react-toolbar/dist/index.js');
 var FoundationStyledComponent = require('../../foundation/FoundationStyledComponent.js');
 
-const TabActions = /*#__PURE__*/FoundationStyledComponent.styled(index_module.Root).withConfig({
+const TabActions = /*#__PURE__*/FoundationStyledComponent.styled(index.Root).withConfig({
   displayName: "TabActionsstyled__TabActions",
   componentId: "sc-1luc1bl-0"
 })(["display:flex;"]);

package/dist/cjs/components/Tabs/TabActions.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabActions.styled.js","sources":["../../../../src/components/Tabs/TabActions.styled.ts"],"sourcesContent":["import * as Toolbar from '@radix-ui/react-toolbar'\n\nimport { styled } from '~/src/foundation'\n\nexport const TabActions = styled(Toolbar.Root)`\n  display: flex;\n`\n"],"names":["TabActions","styled","Toolbar","withConfig","displayName","componentId"],"mappings":";;;;;AAIO,MAAMA,UAAU,gBAAGC,gCAAM,CAACC,iBAAY,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,8BAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAE7C,CAAA,CAAA,CAAA,eAAA,CAAA;;;;"}
+{"version":3,"file":"TabActions.styled.js","sources":["../../../../src/components/Tabs/TabActions.styled.ts"],"sourcesContent":["import * as Toolbar from '@radix-ui/react-toolbar'\n\nimport { styled } from '~/src/foundation'\n\nexport const TabActions = styled(Toolbar.Root)`\n  display: flex;\n`\n"],"names":["TabActions","styled","Toolbar","withConfig","displayName","componentId"],"mappings":";;;;;AAIO,MAAMA,UAAU,gBAAGC,gCAAM,CAACC,UAAY,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,8BAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAE7C,CAAA,CAAA,CAAA,eAAA,CAAA;;;;"}

package/dist/cjs/components/Tabs/TabContent.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var index_module = require('../../node_modules/@radix-ui/react-tabs/dist/index.module.js');
+var index = require('../../node_modules/@radix-ui/react-tabs/dist/index.js');
 
 /**
  * `TabContent` has content associated with `TabItem`.
@@ -11,7 +11,7 @@ const TabContent = /*#__PURE__*/React.forwardRef(function TabContent({
   value,
   ...rest
 }, forwardedRef) {
-  return /*#__PURE__*/React.createElement(index_module.Content, Object.assign({
+  return /*#__PURE__*/React.createElement(index.Content, Object.assign({
     value: value,
     ref: forwardedRef
   }, rest), children);

package/dist/cjs/components/Tabs/TabContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabContent.js","sources":["../../../../src/components/Tabs/TabContent.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport * as Tabs from '@radix-ui/react-tabs'\n\nimport { type TabContentProps } from './Tabs.types'\n\n/**\n * `TabContent` has content associated with `TabItem`.\n */\nexport const TabContent = forwardRef(function TabContent({\n  children,\n  value,\n  ...rest\n}: TabContentProps, forwardedRef: React.Ref<HTMLDivElement>) {\n  return (\n    <Tabs.Content\n      value={value}\n      ref={forwardedRef}\n      {...rest}\n    >\n      { children }\n    </Tabs.Content>\n  )\n})\n"],"names":["TabContent","forwardRef","children","value","rest","forwardedRef","React","createElement","Tabs","Object","assign","ref"],"mappings":";;;;;AAMA;AACA;AACA;MACaA,UAAU,gBAAGC,gBAAU,CAAC,SAASD,UAAUA,CAAC;EACvDE,QAAQ;EACRC,KAAK;EACL,GAAGC,IAAAA;AACY,CAAC,EAAEC,YAAuC,EAAE;EAC3D,oBACEC,KAAA,CAAAC,aAAA,CAACC,oBAAY,EAAAC,MAAA,CAAAC,MAAA,CAAA;AACXP,IAAAA,KAAK,EAAEA,KAAM;AACbQ,IAAAA,GAAG,EAAEN,YAAAA;GACDD,EAAAA,IAAI,CAENF,EAAAA,QACU,CAAC,CAAA;AAEnB,CAAC;;;;"}
+{"version":3,"file":"TabContent.js","sources":["../../../../src/components/Tabs/TabContent.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport * as Tabs from '@radix-ui/react-tabs'\n\nimport { type TabContentProps } from './Tabs.types'\n\n/**\n * `TabContent` has content associated with `TabItem`.\n */\nexport const TabContent = forwardRef(function TabContent({\n  children,\n  value,\n  ...rest\n}: TabContentProps, forwardedRef: React.Ref<HTMLDivElement>) {\n  return (\n    <Tabs.Content\n      value={value}\n      ref={forwardedRef}\n      {...rest}\n    >\n      { children }\n    </Tabs.Content>\n  )\n})\n"],"names":["TabContent","forwardRef","children","value","rest","forwardedRef","React","createElement","Tabs","Object","assign","ref"],"mappings":";;;;;AAMA;AACA;AACA;MACaA,UAAU,gBAAGC,gBAAU,CAAC,SAASD,UAAUA,CAAC;EACvDE,QAAQ;EACRC,KAAK;EACL,GAAGC,IAAAA;AACY,CAAC,EAAEC,YAAuC,EAAE;EAC3D,oBACEC,KAAA,CAAAC,aAAA,CAACC,aAAY,EAAAC,MAAA,CAAAC,MAAA,CAAA;AACXP,IAAAA,KAAK,EAAEA,KAAM;AACbQ,IAAAA,GAAG,EAAEN,YAAAA;GACDD,EAAAA,IAAI,CAENF,EAAAA,QACU,CAAC,CAAA;AAEnB,CAAC;;;;"}

package/dist/cjs/components/Tabs/TabItem.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var index_module = require('../../node_modules/@radix-ui/react-tabs/dist/index.module.js');
+var index = require('../../node_modules/@radix-ui/react-tabs/dist/index.js');
 var Button_types = require('../Button/Button.types.js');
 var TabListContext = require('./TabListContext.js');
 var Tabs_types = require('./Tabs.types.js');
@@ -34,7 +34,7 @@ const TabItem = /*#__PURE__*/React.forwardRef(function TabItem({
   if (typeof children !== 'string') {
     return null;
   }
-  return /*#__PURE__*/React.createElement(index_module.TabsTrigger, {
+  return /*#__PURE__*/React.createElement(index.TabsTrigger, {
     disabled: disabled,
     value: value,
     asChild: true

package/dist/cjs/components/Tabs/TabItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabItem.js","sources":["../../../../src/components/Tabs/TabItem.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useContext,\n} from 'react'\n\nimport * as Tabs from '@radix-ui/react-tabs'\n\nimport {\n  ButtonColorVariant,\n  ButtonSize,\n  ButtonStyleVariant,\n} from '~/src/components/Button'\n\nimport TabListContext from './TabListContext'\nimport {\n  type TabItemProps,\n  TabSize,\n} from './Tabs.types'\n\nimport * as Styled from './TabItem.styled'\n\nconst getButtonSizeBy = (size: TabSize) => {\n  switch (size) {\n    case TabSize.L:\n      return ButtonSize.L\n    case TabSize.M:\n      return ButtonSize.M\n    default:\n    case TabSize.S:\n      return ButtonSize.S\n  }\n}\n\n/**\n * `TabItem` is a button that activates its associated content.\n */\nexport const TabItem = forwardRef(function TabItem({\n  disabled,\n  value,\n  children,\n  ...rest\n}: TabItemProps, forwardedRef: React.Ref<HTMLButtonElement>) {\n  const { size } = useContext(TabListContext)\n\n  if (typeof children !== 'string') {\n    return null\n  }\n\n  return (\n    <Tabs.TabsTrigger\n      disabled={disabled}\n      value={value}\n      asChild\n    >\n      <Styled.Button\n        disabled={disabled}\n        text={children}\n        size={getButtonSizeBy(size)}\n        colorVariant={ButtonColorVariant.MonochromeLight}\n        styleVariant={ButtonStyleVariant.Tertiary}\n        ref={forwardedRef}\n        {...rest}\n      />\n    </Tabs.TabsTrigger>\n  )\n})\n"],"names":["getButtonSizeBy","size","TabSize","L","ButtonSize","M","S","TabItem","forwardRef","disabled","value","children","rest","forwardedRef","useContext","TabListContext","React","createElement","Tabs","asChild","Styled","Object","assign","text","colorVariant","ButtonColorVariant","MonochromeLight","styleVariant","ButtonStyleVariant","Tertiary","ref"],"mappings":";;;;;;;;;AAqBA,MAAMA,eAAe,GAAIC,IAAa,IAAK;AACzC,EAAA,QAAQA,IAAI;IACV,KAAKC,kBAAO,CAACC,CAAC;MACZ,OAAOC,uBAAU,CAACD,CAAC,CAAA;IACrB,KAAKD,kBAAO,CAACG,CAAC;MACZ,OAAOD,uBAAU,CAACC,CAAC,CAAA;AACrB,IAAA,QAAA;IACA,KAAKH,kBAAO,CAACI,CAAC;MACZ,OAAOF,uBAAU,CAACE,CAAC,CAAA;AACvB,GAAA;AACF,CAAC,CAAA;;AAED;AACA;AACA;MACaC,OAAO,gBAAGC,gBAAU,CAAC,SAASD,OAAOA,CAAC;EACjDE,QAAQ;EACRC,KAAK;EACLC,QAAQ;EACR,GAAGC,IAAAA;AACS,CAAC,EAAEC,YAA0C,EAAE;EAC3D,MAAM;AAAEZ,IAAAA,IAAAA;AAAK,GAAC,GAAGa,gBAAU,CAACC,sBAAc,CAAC,CAAA;AAE3C,EAAA,IAAI,OAAOJ,QAAQ,KAAK,QAAQ,EAAE;AAChC,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;AAEA,EAAA,oBACEK,KAAA,CAAAC,aAAA,CAACC,wBAAgB,EAAA;AACfT,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,KAAK,EAAEA,KAAM;IACbS,OAAO,EAAA,IAAA;GAEPH,eAAAA,KAAA,CAAAC,aAAA,CAACG,qBAAa,EAAAC,MAAA,CAAAC,MAAA,CAAA;AACZb,IAAAA,QAAQ,EAAEA,QAAS;AACnBc,IAAAA,IAAI,EAAEZ,QAAS;AACfV,IAAAA,IAAI,EAAED,eAAe,CAACC,IAAI,CAAE;IAC5BuB,YAAY,EAAEC,+BAAkB,CAACC,eAAgB;IACjDC,YAAY,EAAEC,+BAAkB,CAACC,QAAS;AAC1CC,IAAAA,GAAG,EAAEjB,YAAAA;GACDD,EAAAA,IAAI,CACT,CACe,CAAC,CAAA;AAEvB,CAAC;;;;"}
+{"version":3,"file":"TabItem.js","sources":["../../../../src/components/Tabs/TabItem.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useContext,\n} from 'react'\n\nimport * as Tabs from '@radix-ui/react-tabs'\n\nimport {\n  ButtonColorVariant,\n  ButtonSize,\n  ButtonStyleVariant,\n} from '~/src/components/Button'\n\nimport TabListContext from './TabListContext'\nimport {\n  type TabItemProps,\n  TabSize,\n} from './Tabs.types'\n\nimport * as Styled from './TabItem.styled'\n\nconst getButtonSizeBy = (size: TabSize) => {\n  switch (size) {\n    case TabSize.L:\n      return ButtonSize.L\n    case TabSize.M:\n      return ButtonSize.M\n    default:\n    case TabSize.S:\n      return ButtonSize.S\n  }\n}\n\n/**\n * `TabItem` is a button that activates its associated content.\n */\nexport const TabItem = forwardRef(function TabItem({\n  disabled,\n  value,\n  children,\n  ...rest\n}: TabItemProps, forwardedRef: React.Ref<HTMLButtonElement>) {\n  const { size } = useContext(TabListContext)\n\n  if (typeof children !== 'string') {\n    return null\n  }\n\n  return (\n    <Tabs.TabsTrigger\n      disabled={disabled}\n      value={value}\n      asChild\n    >\n      <Styled.Button\n        disabled={disabled}\n        text={children}\n        size={getButtonSizeBy(size)}\n        colorVariant={ButtonColorVariant.MonochromeLight}\n        styleVariant={ButtonStyleVariant.Tertiary}\n        ref={forwardedRef}\n        {...rest}\n      />\n    </Tabs.TabsTrigger>\n  )\n})\n"],"names":["getButtonSizeBy","size","TabSize","L","ButtonSize","M","S","TabItem","forwardRef","disabled","value","children","rest","forwardedRef","useContext","TabListContext","React","createElement","Tabs","asChild","Styled","Object","assign","text","colorVariant","ButtonColorVariant","MonochromeLight","styleVariant","ButtonStyleVariant","Tertiary","ref"],"mappings":";;;;;;;;;AAqBA,MAAMA,eAAe,GAAIC,IAAa,IAAK;AACzC,EAAA,QAAQA,IAAI;IACV,KAAKC,kBAAO,CAACC,CAAC;MACZ,OAAOC,uBAAU,CAACD,CAAC,CAAA;IACrB,KAAKD,kBAAO,CAACG,CAAC;MACZ,OAAOD,uBAAU,CAACC,CAAC,CAAA;AACrB,IAAA,QAAA;IACA,KAAKH,kBAAO,CAACI,CAAC;MACZ,OAAOF,uBAAU,CAACE,CAAC,CAAA;AACvB,GAAA;AACF,CAAC,CAAA;;AAED;AACA;AACA;MACaC,OAAO,gBAAGC,gBAAU,CAAC,SAASD,OAAOA,CAAC;EACjDE,QAAQ;EACRC,KAAK;EACLC,QAAQ;EACR,GAAGC,IAAAA;AACS,CAAC,EAAEC,YAA0C,EAAE;EAC3D,MAAM;AAAEZ,IAAAA,IAAAA;AAAK,GAAC,GAAGa,gBAAU,CAACC,sBAAc,CAAC,CAAA;AAE3C,EAAA,IAAI,OAAOJ,QAAQ,KAAK,QAAQ,EAAE;AAChC,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;AAEA,EAAA,oBACEK,KAAA,CAAAC,aAAA,CAACC,iBAAgB,EAAA;AACfT,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,KAAK,EAAEA,KAAM;IACbS,OAAO,EAAA,IAAA;GAEPH,eAAAA,KAAA,CAAAC,aAAA,CAACG,qBAAa,EAAAC,MAAA,CAAAC,MAAA,CAAA;AACZb,IAAAA,QAAQ,EAAEA,QAAS;AACnBc,IAAAA,IAAI,EAAEZ,QAAS;AACfV,IAAAA,IAAI,EAAED,eAAe,CAACC,IAAI,CAAE;IAC5BuB,YAAY,EAAEC,+BAAkB,CAACC,eAAgB;IACjDC,YAAY,EAAEC,+BAAkB,CAACC,QAAS;AAC1CC,IAAAA,GAAG,EAAEjB,YAAAA;GACDD,EAAAA,IAAI,CACT,CACe,CAAC,CAAA;AAEvB,CAAC;;;;"}

package/dist/cjs/components/Tabs/TabItems.styled.js

@@ -1,9 +1,9 @@
 'use strict';
 
-var index_module = require('../../node_modules/@radix-ui/react-tabs/dist/index.module.js');
+var index = require('../../node_modules/@radix-ui/react-tabs/dist/index.js');
 var FoundationStyledComponent = require('../../foundation/FoundationStyledComponent.js');
 
-const TabItems = /*#__PURE__*/FoundationStyledComponent.styled(index_module.TabsList).withConfig({
+const TabItems = /*#__PURE__*/FoundationStyledComponent.styled(index.TabsList).withConfig({
   displayName: "TabItemsstyled__TabItems",
   componentId: "sc-10tqu8t-0"
 })(["display:flex;overflow:hidden;"]);

package/dist/cjs/components/Tabs/TabItems.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabItems.styled.js","sources":["../../../../src/components/Tabs/TabItems.styled.ts"],"sourcesContent":["import * as Tabs from '@radix-ui/react-tabs'\n\nimport { styled } from '~/src/foundation'\n\nexport const TabItems = styled(Tabs.TabsList)`\n  display: flex;\n  overflow: hidden;\n`\n"],"names":["TabItems","styled","Tabs","withConfig","displayName","componentId"],"mappings":";;;;;AAIO,MAAMA,QAAQ,gBAAGC,gCAAM,CAACC,qBAAa,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,0BAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAG5C,CAAA,CAAA,CAAA,+BAAA,CAAA;;;;"}
+{"version":3,"file":"TabItems.styled.js","sources":["../../../../src/components/Tabs/TabItems.styled.ts"],"sourcesContent":["import * as Tabs from '@radix-ui/react-tabs'\n\nimport { styled } from '~/src/foundation'\n\nexport const TabItems = styled(Tabs.TabsList)`\n  display: flex;\n  overflow: hidden;\n`\n"],"names":["TabItems","styled","Tabs","withConfig","displayName","componentId"],"mappings":";;;;;AAIO,MAAMA,QAAQ,gBAAGC,gCAAM,CAACC,cAAa,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,0BAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAG5C,CAAA,CAAA,CAAA,+BAAA,CAAA;;;;"}

package/dist/cjs/components/Tabs/Tabs.styled.js

@@ -1,9 +1,9 @@
 'use strict';
 
-var index_module = require('../../node_modules/@radix-ui/react-tabs/dist/index.module.js');
+var index = require('../../node_modules/@radix-ui/react-tabs/dist/index.js');
 var FoundationStyledComponent = require('../../foundation/FoundationStyledComponent.js');
 
-const Tabs = /*#__PURE__*/FoundationStyledComponent.styled(index_module.Root).withConfig({
+const Tabs = /*#__PURE__*/FoundationStyledComponent.styled(index.Root).withConfig({
   displayName: "Tabsstyled__Tabs",
   componentId: "sc-wm9mnc-0"
 })(["display:flex;flex-direction:column;width:100%;"]);

package/dist/cjs/components/Tabs/Tabs.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.styled.js","sources":["../../../../src/components/Tabs/Tabs.styled.ts"],"sourcesContent":["import * as TabsPrimitive from '@radix-ui/react-tabs'\n\nimport { styled } from '~/src/foundation'\n\nexport const Tabs = styled(TabsPrimitive.Root)`\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n`\n"],"names":["Tabs","styled","TabsPrimitive","withConfig","displayName","componentId"],"mappings":";;;;;AAIO,MAAMA,IAAI,gBAAGC,gCAAM,CAACC,iBAAkB,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,kBAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAI7C,CAAA,CAAA,CAAA,gDAAA,CAAA;;;;"}
+{"version":3,"file":"Tabs.styled.js","sources":["../../../../src/components/Tabs/Tabs.styled.ts"],"sourcesContent":["import * as TabsPrimitive from '@radix-ui/react-tabs'\n\nimport { styled } from '~/src/foundation'\n\nexport const Tabs = styled(TabsPrimitive.Root)`\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n`\n"],"names":["Tabs","styled","TabsPrimitive","withConfig","displayName","componentId"],"mappings":";;;;;AAIO,MAAMA,IAAI,gBAAGC,gCAAM,CAACC,UAAkB,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,kBAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAI7C,CAAA,CAAA,CAAA,gDAAA,CAAA;;;;"}

package/dist/cjs/components/Tooltip/Tooltip.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.types.js","sources":["../../../../src/components/Tooltip/Tooltip.types.ts"],"sourcesContent":["import { type Ref } from 'react'\n\nimport {\n  type AdditionalStylableProps,\n  type BezierComponentProps,\n  type ChildrenProps,\n  type ContentProps,\n  type DisableProps,\n  type RenderConfigProps,\n} from '~/src/types/ComponentProps'\n\ninterface TooltipOptions {\n  placement?: TooltipPosition\n  offset?: number\n  keepInContainer?: boolean\n  allowHover?: boolean\n  delayShow?: number\n  delayHide?: number\n  contentTestId?: string\n  lazy?: boolean\n}\n\nexport default interface TooltipProps extends\n  BezierComponentProps,\n  ChildrenProps,\n  ContentProps,\n  DisableProps,\n  AdditionalStylableProps<'content' | 'contentWrapper'>,\n  React.HTMLAttributes<HTMLDivElement>,\n  TooltipOptions {\n}\n\nexport interface TooltipContentProps extends Pick<\nTooltipOptions,\n'keepInContainer' |\n'placement' |\n'offset' |\n'allowHover'\n>,\n  RenderConfigProps,\n  ContentProps,\n  AdditionalStylableProps<'content' | 'contentWrapper'>,\n  DisableProps {\n  tooltipContainer: HTMLDivElement | null\n  forwardedRef: Ref<HTMLDivElement>\n}\n\nexport interface GetTooltipStyle extends Required<Pick<TooltipOptions, 'placement' | 'offset' | 'allowHover'>> {\n  tooltipContainer: HTMLDivElement\n}\n\nexport interface GetReplacement extends Required<Pick<TooltipOptions, 'placement' | 'keepInContainer'>> {\n  tooltip: HTMLDivElement\n}\n\nexport enum TooltipPosition {\n  TopCenter = 'topCenter',\n  TopLeft = 'topLeft',\n  TopRight = 'topRight',\n  RightCenter = 'rightCenter',\n  RightTop = 'rightTop',\n  RightBottom = 'rightBottom',\n  BottomCenter = 'bottomCenter',\n  BottomLeft = 'bottomLeft',\n  BottomRight = 'bottomRight',\n  LeftCenter = 'leftCenter',\n  LeftTop = 'leftTop',\n  LeftBottom = 'leftBottom',\n}\n"],"names":["TooltipPosition"],"mappings":";;AAuDYA,IAAAA,eAAe,0BAAfA,eAAe,EAAA;EAAfA,eAAe,CAAA,WAAA,CAAA,GAAA,WAAA,CAAA;EAAfA,eAAe,CAAA,SAAA,CAAA,GAAA,SAAA,CAAA;EAAfA,eAAe,CAAA,UAAA,CAAA,GAAA,UAAA,CAAA;EAAfA,eAAe,CAAA,aAAA,CAAA,GAAA,aAAA,CAAA;EAAfA,eAAe,CAAA,UAAA,CAAA,GAAA,UAAA,CAAA;EAAfA,eAAe,CAAA,aAAA,CAAA,GAAA,aAAA,CAAA;EAAfA,eAAe,CAAA,cAAA,CAAA,GAAA,cAAA,CAAA;EAAfA,eAAe,CAAA,YAAA,CAAA,GAAA,YAAA,CAAA;EAAfA,eAAe,CAAA,aAAA,CAAA,GAAA,aAAA,CAAA;EAAfA,eAAe,CAAA,YAAA,CAAA,GAAA,YAAA,CAAA;EAAfA,eAAe,CAAA,SAAA,CAAA,GAAA,SAAA,CAAA;EAAfA,eAAe,CAAA,YAAA,CAAA,GAAA,YAAA,CAAA;AAAA,EAAA,OAAfA,eAAe,CAAA;AAAA,CAAA,CAAA,EAAA;;;;"}
+{"version":3,"file":"Tooltip.types.js","sources":["../../../../src/components/Tooltip/Tooltip.types.ts"],"sourcesContent":["import { type Ref } from 'react'\n\nimport {\n  type AdditionalStylableProps,\n  type BezierComponentProps,\n  type ChildrenProps,\n  type ContentProps,\n  type DisableProps,\n  type RenderConfigProps,\n} from '~/src/types/ComponentProps'\n\ninterface TooltipOptions {\n  placement?: TooltipPosition\n  offset?: number\n  keepInContainer?: boolean\n  allowHover?: boolean\n  delayShow?: number\n  delayHide?: number\n  contentTestId?: string\n  lazy?: boolean\n}\n\nexport default interface TooltipProps extends\n  BezierComponentProps,\n  ChildrenProps,\n  ContentProps,\n  DisableProps,\n  AdditionalStylableProps<'content' | 'contentWrapper'>,\n  Omit<React.HTMLAttributes<HTMLDivElement>, keyof ContentProps>,\n  TooltipOptions {\n}\n\nexport interface TooltipContentProps extends Pick<\nTooltipOptions,\n'keepInContainer' |\n'placement' |\n'offset' |\n'allowHover'\n>,\n  RenderConfigProps,\n  ContentProps,\n  AdditionalStylableProps<'content' | 'contentWrapper'>,\n  DisableProps {\n  tooltipContainer: HTMLDivElement | null\n  forwardedRef: Ref<HTMLDivElement>\n}\n\nexport interface GetTooltipStyle extends Required<Pick<TooltipOptions, 'placement' | 'offset' | 'allowHover'>> {\n  tooltipContainer: HTMLDivElement\n}\n\nexport interface GetReplacement extends Required<Pick<TooltipOptions, 'placement' | 'keepInContainer'>> {\n  tooltip: HTMLDivElement\n}\n\nexport enum TooltipPosition {\n  TopCenter = 'topCenter',\n  TopLeft = 'topLeft',\n  TopRight = 'topRight',\n  RightCenter = 'rightCenter',\n  RightTop = 'rightTop',\n  RightBottom = 'rightBottom',\n  BottomCenter = 'bottomCenter',\n  BottomLeft = 'bottomLeft',\n  BottomRight = 'bottomRight',\n  LeftCenter = 'leftCenter',\n  LeftTop = 'leftTop',\n  LeftBottom = 'leftBottom',\n}\n"],"names":["TooltipPosition"],"mappings":";;AAuDYA,IAAAA,eAAe,0BAAfA,eAAe,EAAA;EAAfA,eAAe,CAAA,WAAA,CAAA,GAAA,WAAA,CAAA;EAAfA,eAAe,CAAA,SAAA,CAAA,GAAA,SAAA,CAAA;EAAfA,eAAe,CAAA,UAAA,CAAA,GAAA,UAAA,CAAA;EAAfA,eAAe,CAAA,aAAA,CAAA,GAAA,aAAA,CAAA;EAAfA,eAAe,CAAA,UAAA,CAAA,GAAA,UAAA,CAAA;EAAfA,eAAe,CAAA,aAAA,CAAA,GAAA,aAAA,CAAA;EAAfA,eAAe,CAAA,cAAA,CAAA,GAAA,cAAA,CAAA;EAAfA,eAAe,CAAA,YAAA,CAAA,GAAA,YAAA,CAAA;EAAfA,eAAe,CAAA,aAAA,CAAA,GAAA,aAAA,CAAA;EAAfA,eAAe,CAAA,YAAA,CAAA,GAAA,YAAA,CAAA;EAAfA,eAAe,CAAA,SAAA,CAAA,GAAA,SAAA,CAAA;EAAfA,eAAe,CAAA,YAAA,CAAA,GAAA,YAAA,CAAA;AAAA,EAAA,OAAfA,eAAe,CAAA;AAAA,CAAA,CAAA,EAAA;;;;"}

package/dist/cjs/components/VisuallyHidden/VisuallyHidden.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var index_module = require('../../node_modules/@radix-ui/react-visually-hidden/dist/index.module.js');
+var index = require('../../node_modules/@radix-ui/react-visually-hidden/dist/index.js');
 
 /**
  * `VisuallyHidden` is a component that visually hides the content. It doesn't render any DOM node.
@@ -19,7 +19,7 @@ var index_module = require('../../node_modules/@radix-ui/react-visually-hidden/d
 function VisuallyHidden({
   children
 }) {
-  return /*#__PURE__*/React.createElement(index_module.Root, {
+  return /*#__PURE__*/React.createElement(index.Root, {
     asChild: true
   }, children);
 }

package/dist/cjs/components/VisuallyHidden/VisuallyHidden.js.map

@@ -1 +1 @@
-{"version":3,"file":"VisuallyHidden.js","sources":["../../../../src/components/VisuallyHidden/VisuallyHidden.tsx"],"sourcesContent":["import React from 'react'\n\nimport * as VisuallyHiddenPrimitive from '@radix-ui/react-visually-hidden'\n\nimport { type VisuallyHiddenProps } from './VisuallyHidden.types'\n\n/**\n * `VisuallyHidden` is a component that visually hides the content. It doesn't render any DOM node.\n * It is useful when you want to provide additional information to screen readers.\n *\n * @example\n *\n * ```tsx\n * <VisuallyHidden>\n *   <span>This is a visually hidden text.</span>\n * </VisuallyHidden>\n * ```\n *\n */\nexport function VisuallyHidden({\n  children,\n}: VisuallyHiddenProps) {\n  return (\n    <VisuallyHiddenPrimitive.Root asChild>\n      { children }\n    </VisuallyHiddenPrimitive.Root>\n  )\n}\n"],"names":["VisuallyHidden","children","React","createElement","VisuallyHiddenPrimitive","asChild"],"mappings":";;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,cAAcA,CAAC;AAC7BC,EAAAA,QAAAA;AACmB,CAAC,EAAE;AACtB,EAAA,oBACEC,KAAA,CAAAC,aAAA,CAACC,iBAA4B,EAAA;IAACC,OAAO,EAAA,IAAA;AAAA,GAAA,EACjCJ,QAC0B,CAAC,CAAA;AAEnC;;;;"}
+{"version":3,"file":"VisuallyHidden.js","sources":["../../../../src/components/VisuallyHidden/VisuallyHidden.tsx"],"sourcesContent":["import React from 'react'\n\nimport * as VisuallyHiddenPrimitive from '@radix-ui/react-visually-hidden'\n\nimport { type VisuallyHiddenProps } from './VisuallyHidden.types'\n\n/**\n * `VisuallyHidden` is a component that visually hides the content. It doesn't render any DOM node.\n * It is useful when you want to provide additional information to screen readers.\n *\n * @example\n *\n * ```tsx\n * <VisuallyHidden>\n *   <span>This is a visually hidden text.</span>\n * </VisuallyHidden>\n * ```\n *\n */\nexport function VisuallyHidden({\n  children,\n}: VisuallyHiddenProps) {\n  return (\n    <VisuallyHiddenPrimitive.Root asChild>\n      { children }\n    </VisuallyHiddenPrimitive.Root>\n  )\n}\n"],"names":["VisuallyHidden","children","React","createElement","VisuallyHiddenPrimitive","asChild"],"mappings":";;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,cAAcA,CAAC;AAC7BC,EAAAA,QAAAA;AACmB,CAAC,EAAE;AACtB,EAAA,oBACEC,KAAA,CAAAC,aAAA,CAACC,UAA4B,EAAA;IAACC,OAAO,EAAA,IAAA;AAAA,GAAA,EACjCJ,QAC0B,CAAC,CAAA;AAEnC;;;;"}

package/dist/cjs/foundation/FoundationStyledComponent.js

@@ -13,6 +13,21 @@ var domElements = require('./utils/domElements.js');
  * 동작에는 문제가 없으며, type checking 도 올바르게 됩니다.
  */
 
+
+/**
+ * When interpreting the `.mjs` extension in the Next.js environment,
+ * default imported `styled` function are not interpreted correctly.
+ *
+ * We add `.default` to cover situation where the module is interpreted in CJS.
+ *
+ * This is code that can be removed when the major version of `styled-components` is updated (v6)
+ * and `styled` functions are changed to named import.
+ *
+ * @see https://github.com/rollup/rollup/issues/4438
+ * @see https://github.com/styled-components/styled-components/issues/115
+ */
+// @ts-expect-error
+const safetyStyledInNextJs = styled.default ?? styled;
 const FoundationContext = /*#__PURE__*/React.createContext(null);
 function FoundationProvider({
   foundation,
@@ -53,7 +68,7 @@ function templateFunctionGenerator(BaseComponentGenerator) {
 
 /* eslint-disable-next-line func-names */ /* @ts-ignore */
 const FoundationStyled = tag => {
-  const tagTemplate = /*#__PURE__*/styled(tag);
+  const tagTemplate = safetyStyledInNextJs(tag);
   return templateFunctionGenerator(tagTemplate);
 };
 domElements.default.forEach(element => {