@intlayer/design-system 7.3.2-canary.0 → 7.3.2

package/dist/esm/components/Modal/Modal.mjs

@@ -34,7 +34,7 @@ let ModalSize = /* @__PURE__ */ function(ModalSize$1) {
 * Class name variants for different modal sizes using class-variance-authority
 * Defines responsive sizing and scrollable content for modal containers
 */
-const modalVariants = cva("cursor-default justify-center overflow-auto p-3 shadow-sm", {
+const modalVariants = cva("cursor-default overflow-auto p-3 shadow-sm", {
 	variants: { size: {
 		sm: "h-auto max-h-[30vh] w-[95vw] max-w-xl",
 		md: "h-auto max-h-[50vh] w-[95vw] max-w-xl",

package/dist/esm/components/Modal/Modal.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.mjs","names":["m","Modal: FC<ModalProps>"],"sources":["../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["'use client';\n\nimport { cva } from 'class-variance-authority';\nimport { motion as m } from 'framer-motion';\nimport { X } from 'lucide-react';\nimport { type FC, type ReactNode, useEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useGetElementOrWindow, useScrollBlockage } from '../../hooks/index';\nimport { cn } from '../../utils/cn';\nimport { Button, ButtonColor, ButtonSize, ButtonVariant } from '../Button';\nimport { Container, type ContainerProps } from '../Container';\nimport { H3 } from '../Headers';\n\n/**\n * Enumeration of available modal sizes\n */\nexport enum ModalSize {\n  /** Small modal: max height 30vh, max width xl */\n  SM = 'sm',\n  /** Medium modal: max height 50vh, max width xl */\n  MD = 'md',\n  /** Large modal: max height 70vh, max width 2xl */\n  LG = 'lg',\n  /** Extra large modal: max height 95vh, max width 6xl */\n  XL = 'xl',\n  /** Unset size: max height 95vh, full width responsive */\n  UNSET = 'unset',\n}\n\n/**\n * Props for the Modal component\n */\ntype ModalProps = {\n  /** Content to be displayed inside the modal */\n  children: ReactNode;\n  /** Controls whether the modal is visible */\n  isOpen: boolean;\n  /** Callback function called when the modal should be closed */\n  onClose?: () => void;\n  /** Container element to render the modal into (defaults to document.body) */\n  container?: HTMLElement;\n  /** Whether to disable scrolling on the background content */\n  disableScroll?: boolean;\n  /** Whether to display a close button in the modal header */\n  hasCloseButton?: boolean;\n  /** Optional title displayed at the top of the modal */\n  title?: string;\n  /** Size variant for the modal */\n  size?: ModalSize | `${ModalSize}`;\n} & Pick<\n  ContainerProps,\n  | 'className'\n  | 'transparency'\n  | 'border'\n  | 'background'\n  | 'roundedSize'\n  | 'borderColor'\n  | 'padding'\n  | 'separator'\n  | 'gap'\n>;\n\n/**\n * Class name variants for different modal sizes using class-variance-authority\n * Defines responsive sizing and scrollable content for modal containers\n */\nconst modalVariants = cva(\n  'cursor-default justify-center overflow-auto p-3 shadow-sm',\n  {\n    variants: {\n      size: {\n        /** Small modal: height auto, max-height 30vh, width 95vw, max-width xl */\n        sm: 'h-auto max-h-[30vh] w-[95vw] max-w-xl',\n        /** Medium modal: height auto, max-height 50vh, width 95vw, max-width xl */\n        md: 'h-auto max-h-[50vh] w-[95vw] max-w-xl',\n        /** Large modal: height auto, max-height 70vh, width 95vw, max-width 2xl */\n        lg: 'h-auto max-h-[70vh] w-[95vw] max-w-2xl',\n        /** Extra large modal: height auto, max-height 95vh, width 95vw, max-width 6xl */\n        xl: 'h-auto max-h-[95vh] w-[95vw] max-w-6xl',\n        /** Unset modal: height auto, max-height 95vh, width 95vw, no max-width */\n        unset: 'h-auto max-h-[95vh] w-[95vw]',\n      },\n    },\n    defaultVariants: {\n      size: 'unset',\n    },\n  }\n);\n\n/**\n * Motion-enabled modal component with Framer Motion support\n * Extends Container component with motion capabilities for animations\n */\nconst MotionModal = m.create(Container);\n\n/**\n * Modal Component\n *\n * A highly customizable modal dialog component with portal rendering, Framer Motion animations,\n * and comprehensive accessibility features. Supports multiple size variants and scroll management.\n *\n * Features:\n * - Portal rendering to any container element (defaults to document.body)\n * - Smooth animations with Framer Motion\n * - Size variants: SM, MD, LG, XL, UNSET with responsive sizing\n * - Optional title and close button\n * - Background scroll prevention\n * - Click-outside-to-close functionality\n * - Full accessibility support with ARIA attributes\n * - Keyboard navigation support (ESC to close)\n * - Extensible styling with Container props\n *\n * @example\n * Basic usage:\n * ```jsx\n * <Modal isOpen={isModalOpen} onClose={() => setIsModalOpen(false)}>\n *   <p>Modal content goes here</p>\n * </Modal>\n * ```\n *\n * @example\n * With title and close button:\n * ```jsx\n * <Modal\n *   isOpen={isOpen}\n *   onClose={onClose}\n *   title=\"Confirm Action\"\n *   hasCloseButton\n *   size={ModalSize.LG}\n * >\n *   <div>\n *     <p>Are you sure you want to continue?</p>\n *     <Button onClick={onConfirm}>Confirm</Button>\n *   </div>\n * </Modal>\n * ```\n *\n * @example\n * Custom container and styling:\n * ```jsx\n * <Modal\n *   isOpen={isOpen}\n *   onClose={onClose}\n *   container={customContainer}\n *   background=\"card\"\n *   padding=\"lg\"\n *   border=\"default\"\n * >\n *   Content with custom styling\n * </Modal>\n * ```\n *\n * Accessibility Notes:\n * - Modal receives focus when opened\n * - Background content is hidden from screen readers when modal is open\n * - ESC key closes modal (handled by browser for role=\"dialog\")\n * - Click outside modal closes it\n * - Close button has descriptive label for screen readers\n *\n * @param props - Modal component props\n * @returns JSX element rendered via createPortal\n */\nexport const Modal: FC<ModalProps> = ({\n  children,\n  isOpen,\n  container,\n  disableScroll = true,\n  onClose,\n  hasCloseButton = false,\n  title,\n  size = ModalSize.MD,\n  className,\n  ...props\n}) => {\n  const containerElement = useGetElementOrWindow(container);\n\n  useScrollBlockage({ key: 'modal', disableScroll: isOpen && disableScroll });\n\n  useEffect(() => {\n    const handleEscape = (event: KeyboardEvent) => {\n      if (event.key === 'Escape' && isOpen && onClose) {\n        onClose();\n      }\n    };\n\n    document.addEventListener('keydown', handleEscape);\n\n    return () => {\n      document.removeEventListener('keydown', handleEscape);\n    };\n  }, [isOpen, onClose]);\n\n  if (!containerElement) return <></>;\n\n  const hasTitle = typeof title === 'string';\n\n  return createPortal(\n    <m.div\n      className=\"invisible fixed top-0 left-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-auto bg-background/40 backdrop-blur\"\n      animate={isOpen ? 'visible' : 'invisible'}\n      variants={{\n        visible: {\n          opacity: 1,\n          visibility: 'visible',\n          transition: { duration: 0.1, when: 'beforeChildren' },\n        },\n        invisible: {\n          opacity: 0,\n          visibility: 'hidden',\n          transition: { duration: 0.1, when: 'afterChildren' },\n        },\n      }}\n      onClick={(e) => {\n        e.stopPropagation();\n        onClose?.();\n      }}\n      aria-hidden={!isOpen}\n    >\n      <MotionModal\n        onClick={(e) => e.stopPropagation()}\n        initial={{ scale: isOpen ? 0.5 : 1 }}\n        animate={{ scale: isOpen ? 1 : 0.5 }}\n        transition={{ duration: 0.3 }}\n        className={modalVariants({\n          size,\n          className,\n        })}\n        role=\"dialog\"\n        aria-modal\n        roundedSize=\"2xl\"\n        {...props}\n      >\n        <div\n          className={cn(\n            'cursor-default',\n            hasCloseButton && hasTitle\n              ? `flex items-start`\n              : hasCloseButton\n                ? `flex justify-end`\n                : hasTitle\n                  ? `items-center`\n                  : `hidden`\n          )}\n        >\n          {hasTitle && (\n            <H3 className=\"mt-2 mb-4 ml-4 flex items-center justify-center font-bold text-lg\">\n              {title}\n            </H3>\n          )}\n          {hasCloseButton && (\n            <Button\n              variant={ButtonVariant.HOVERABLE}\n              color={ButtonColor.TEXT}\n              label=\"Close modal\"\n              className=\"ml-auto\"\n              onClick={(e) => {\n                e.stopPropagation();\n                onClose?.();\n              }}\n              Icon={X}\n              size={ButtonSize.ICON_MD}\n            />\n          )}\n        </div>\n        <div className=\"flex flex-1 flex-col items-center\">{children}</div>\n      </MotionModal>\n    </m.div>,\n    containerElement\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAgBA,IAAY,kDAAL;;AAEL;;AAEA;;AAEA;;AAEA;;AAEA;;;;;;;AAwCF,MAAM,gBAAgB,IACpB,6DACA;CACE,UAAU,EACR,MAAM;EAEJ,IAAI;EAEJ,IAAI;EAEJ,IAAI;EAEJ,IAAI;EAEJ,OAAO;EACR,EACF;CACD,iBAAiB,EACf,MAAM,SACP;CACF,CACF;;;;;AAMD,MAAM,cAAcA,OAAE,OAAO,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqEvC,MAAaC,SAAyB,EACpC,UACA,QACA,WACA,gBAAgB,MAChB,SACA,iBAAiB,OACjB,OACA,OAAO,UAAU,IACjB,WACA,GAAG,YACC;CACJ,MAAM,mBAAmB,sBAAsB,UAAU;AAEzD,mBAAkB;EAAE,KAAK;EAAS,eAAe,UAAU;EAAe,CAAC;AAE3E,iBAAgB;EACd,MAAM,gBAAgB,UAAyB;AAC7C,OAAI,MAAM,QAAQ,YAAY,UAAU,QACtC,UAAS;;AAIb,WAAS,iBAAiB,WAAW,aAAa;AAElD,eAAa;AACX,YAAS,oBAAoB,WAAW,aAAa;;IAEtD,CAAC,QAAQ,QAAQ,CAAC;AAErB,KAAI,CAAC,iBAAkB,QAAO,mCAAK;CAEnC,MAAM,WAAW,OAAO,UAAU;AAElC,QAAO,aACL,oBAACD,OAAE;EACD,WAAU;EACV,SAAS,SAAS,YAAY;EAC9B,UAAU;GACR,SAAS;IACP,SAAS;IACT,YAAY;IACZ,YAAY;KAAE,UAAU;KAAK,MAAM;KAAkB;IACtD;GACD,WAAW;IACT,SAAS;IACT,YAAY;IACZ,YAAY;KAAE,UAAU;KAAK,MAAM;KAAiB;IACrD;GACF;EACD,UAAU,MAAM;AACd,KAAE,iBAAiB;AACnB,cAAW;;EAEb,eAAa,CAAC;YAEd,qBAAC;GACC,UAAU,MAAM,EAAE,iBAAiB;GACnC,SAAS,EAAE,OAAO,SAAS,KAAM,GAAG;GACpC,SAAS,EAAE,OAAO,SAAS,IAAI,IAAK;GACpC,YAAY,EAAE,UAAU,IAAK;GAC7B,WAAW,cAAc;IACvB;IACA;IACD,CAAC;GACF,MAAK;GACL;GACA,aAAY;GACZ,GAAI;cAEJ,qBAAC;IACC,WAAW,GACT,kBACA,kBAAkB,WACd,qBACA,iBACE,qBACA,WACE,iBACA,SACT;eAEA,YACC,oBAAC;KAAG,WAAU;eACX;MACE,EAEN,kBACC,oBAAC;KACC,SAAS,cAAc;KACvB,OAAO,YAAY;KACnB,OAAM;KACN,WAAU;KACV,UAAU,MAAM;AACd,QAAE,iBAAiB;AACnB,iBAAW;;KAEb,MAAM;KACN,MAAM,WAAW;MACjB;KAEA,EACN,oBAAC;IAAI,WAAU;IAAqC;KAAe;IACvD;GACR,EACR,iBACD"}
+{"version":3,"file":"Modal.mjs","names":["m","Modal: FC<ModalProps>"],"sources":["../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["'use client';\n\nimport { cva } from 'class-variance-authority';\nimport { motion as m } from 'framer-motion';\nimport { X } from 'lucide-react';\nimport { type FC, type ReactNode, useEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useGetElementOrWindow, useScrollBlockage } from '../../hooks/index';\nimport { cn } from '../../utils/cn';\nimport { Button, ButtonColor, ButtonSize, ButtonVariant } from '../Button';\nimport { Container, type ContainerProps } from '../Container';\nimport { H3 } from '../Headers';\n\n/**\n * Enumeration of available modal sizes\n */\nexport enum ModalSize {\n  /** Small modal: max height 30vh, max width xl */\n  SM = 'sm',\n  /** Medium modal: max height 50vh, max width xl */\n  MD = 'md',\n  /** Large modal: max height 70vh, max width 2xl */\n  LG = 'lg',\n  /** Extra large modal: max height 95vh, max width 6xl */\n  XL = 'xl',\n  /** Unset size: max height 95vh, full width responsive */\n  UNSET = 'unset',\n}\n\n/**\n * Props for the Modal component\n */\ntype ModalProps = {\n  /** Content to be displayed inside the modal */\n  children: ReactNode;\n  /** Controls whether the modal is visible */\n  isOpen: boolean;\n  /** Callback function called when the modal should be closed */\n  onClose?: () => void;\n  /** Container element to render the modal into (defaults to document.body) */\n  container?: HTMLElement;\n  /** Whether to disable scrolling on the background content */\n  disableScroll?: boolean;\n  /** Whether to display a close button in the modal header */\n  hasCloseButton?: boolean;\n  /** Optional title displayed at the top of the modal */\n  title?: string;\n  /** Size variant for the modal */\n  size?: ModalSize | `${ModalSize}`;\n} & Pick<\n  ContainerProps,\n  | 'className'\n  | 'transparency'\n  | 'border'\n  | 'background'\n  | 'roundedSize'\n  | 'borderColor'\n  | 'padding'\n  | 'separator'\n  | 'gap'\n>;\n\n/**\n * Class name variants for different modal sizes using class-variance-authority\n * Defines responsive sizing and scrollable content for modal containers\n */\nconst modalVariants = cva('cursor-default overflow-auto p-3 shadow-sm', {\n  variants: {\n    size: {\n      /** Small modal: height auto, max-height 30vh, width 95vw, max-width xl */\n      sm: 'h-auto max-h-[30vh] w-[95vw] max-w-xl',\n      /** Medium modal: height auto, max-height 50vh, width 95vw, max-width xl */\n      md: 'h-auto max-h-[50vh] w-[95vw] max-w-xl',\n      /** Large modal: height auto, max-height 70vh, width 95vw, max-width 2xl */\n      lg: 'h-auto max-h-[70vh] w-[95vw] max-w-2xl',\n      /** Extra large modal: height auto, max-height 95vh, width 95vw, max-width 6xl */\n      xl: 'h-auto max-h-[95vh] w-[95vw] max-w-6xl',\n      /** Unset modal: height auto, max-height 95vh, width 95vw, no max-width */\n      unset: 'h-auto max-h-[95vh] w-[95vw]',\n    },\n  },\n  defaultVariants: {\n    size: 'unset',\n  },\n});\n\n/**\n * Motion-enabled modal component with Framer Motion support\n * Extends Container component with motion capabilities for animations\n */\nconst MotionModal = m.create(Container);\n\n/**\n * Modal Component\n *\n * A highly customizable modal dialog component with portal rendering, Framer Motion animations,\n * and comprehensive accessibility features. Supports multiple size variants and scroll management.\n *\n * Features:\n * - Portal rendering to any container element (defaults to document.body)\n * - Smooth animations with Framer Motion\n * - Size variants: SM, MD, LG, XL, UNSET with responsive sizing\n * - Optional title and close button\n * - Background scroll prevention\n * - Click-outside-to-close functionality\n * - Full accessibility support with ARIA attributes\n * - Keyboard navigation support (ESC to close)\n * - Extensible styling with Container props\n *\n * @example\n * Basic usage:\n * ```jsx\n * <Modal isOpen={isModalOpen} onClose={() => setIsModalOpen(false)}>\n *   <p>Modal content goes here</p>\n * </Modal>\n * ```\n *\n * @example\n * With title and close button:\n * ```jsx\n * <Modal\n *   isOpen={isOpen}\n *   onClose={onClose}\n *   title=\"Confirm Action\"\n *   hasCloseButton\n *   size={ModalSize.LG}\n * >\n *   <div>\n *     <p>Are you sure you want to continue?</p>\n *     <Button onClick={onConfirm}>Confirm</Button>\n *   </div>\n * </Modal>\n * ```\n *\n * @example\n * Custom container and styling:\n * ```jsx\n * <Modal\n *   isOpen={isOpen}\n *   onClose={onClose}\n *   container={customContainer}\n *   background=\"card\"\n *   padding=\"lg\"\n *   border=\"default\"\n * >\n *   Content with custom styling\n * </Modal>\n * ```\n *\n * Accessibility Notes:\n * - Modal receives focus when opened\n * - Background content is hidden from screen readers when modal is open\n * - ESC key closes modal (handled by browser for role=\"dialog\")\n * - Click outside modal closes it\n * - Close button has descriptive label for screen readers\n *\n * @param props - Modal component props\n * @returns JSX element rendered via createPortal\n */\nexport const Modal: FC<ModalProps> = ({\n  children,\n  isOpen,\n  container,\n  disableScroll = true,\n  onClose,\n  hasCloseButton = false,\n  title,\n  size = ModalSize.MD,\n  className,\n  ...props\n}) => {\n  const containerElement = useGetElementOrWindow(container);\n\n  useScrollBlockage({ key: 'modal', disableScroll: isOpen && disableScroll });\n\n  useEffect(() => {\n    const handleEscape = (event: KeyboardEvent) => {\n      if (event.key === 'Escape' && isOpen && onClose) {\n        onClose();\n      }\n    };\n\n    document.addEventListener('keydown', handleEscape);\n\n    return () => {\n      document.removeEventListener('keydown', handleEscape);\n    };\n  }, [isOpen, onClose]);\n\n  if (!containerElement) return <></>;\n\n  const hasTitle = typeof title === 'string';\n\n  return createPortal(\n    <m.div\n      className=\"invisible fixed top-0 left-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-auto bg-background/40 backdrop-blur\"\n      animate={isOpen ? 'visible' : 'invisible'}\n      variants={{\n        visible: {\n          opacity: 1,\n          visibility: 'visible',\n          transition: { duration: 0.1, when: 'beforeChildren' },\n        },\n        invisible: {\n          opacity: 0,\n          visibility: 'hidden',\n          transition: { duration: 0.1, when: 'afterChildren' },\n        },\n      }}\n      onClick={(e) => {\n        e.stopPropagation();\n        onClose?.();\n      }}\n      aria-hidden={!isOpen}\n    >\n      <MotionModal\n        onClick={(e) => e.stopPropagation()}\n        initial={{ scale: isOpen ? 0.5 : 1 }}\n        animate={{ scale: isOpen ? 1 : 0.5 }}\n        transition={{ duration: 0.3 }}\n        className={modalVariants({\n          size,\n          className,\n        })}\n        role=\"dialog\"\n        aria-modal\n        roundedSize=\"2xl\"\n        {...props}\n      >\n        <div\n          className={cn(\n            'cursor-default',\n            hasCloseButton && hasTitle\n              ? `flex items-start`\n              : hasCloseButton\n                ? `flex justify-end`\n                : hasTitle\n                  ? `items-center`\n                  : `hidden`\n          )}\n        >\n          {hasTitle && (\n            <H3 className=\"mt-2 mb-4 ml-4 flex items-center justify-center font-bold text-lg\">\n              {title}\n            </H3>\n          )}\n          {hasCloseButton && (\n            <Button\n              variant={ButtonVariant.HOVERABLE}\n              color={ButtonColor.TEXT}\n              label=\"Close modal\"\n              className=\"ml-auto\"\n              onClick={(e) => {\n                e.stopPropagation();\n                onClose?.();\n              }}\n              Icon={X}\n              size={ButtonSize.ICON_MD}\n            />\n          )}\n        </div>\n        <div className=\"flex flex-1 flex-col items-center\">{children}</div>\n      </MotionModal>\n    </m.div>,\n    containerElement\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAgBA,IAAY,kDAAL;;AAEL;;AAEA;;AAEA;;AAEA;;AAEA;;;;;;;AAwCF,MAAM,gBAAgB,IAAI,8CAA8C;CACtE,UAAU,EACR,MAAM;EAEJ,IAAI;EAEJ,IAAI;EAEJ,IAAI;EAEJ,IAAI;EAEJ,OAAO;EACR,EACF;CACD,iBAAiB,EACf,MAAM,SACP;CACF,CAAC;;;;;AAMF,MAAM,cAAcA,OAAE,OAAO,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqEvC,MAAaC,SAAyB,EACpC,UACA,QACA,WACA,gBAAgB,MAChB,SACA,iBAAiB,OACjB,OACA,OAAO,UAAU,IACjB,WACA,GAAG,YACC;CACJ,MAAM,mBAAmB,sBAAsB,UAAU;AAEzD,mBAAkB;EAAE,KAAK;EAAS,eAAe,UAAU;EAAe,CAAC;AAE3E,iBAAgB;EACd,MAAM,gBAAgB,UAAyB;AAC7C,OAAI,MAAM,QAAQ,YAAY,UAAU,QACtC,UAAS;;AAIb,WAAS,iBAAiB,WAAW,aAAa;AAElD,eAAa;AACX,YAAS,oBAAoB,WAAW,aAAa;;IAEtD,CAAC,QAAQ,QAAQ,CAAC;AAErB,KAAI,CAAC,iBAAkB,QAAO,mCAAK;CAEnC,MAAM,WAAW,OAAO,UAAU;AAElC,QAAO,aACL,oBAACD,OAAE;EACD,WAAU;EACV,SAAS,SAAS,YAAY;EAC9B,UAAU;GACR,SAAS;IACP,SAAS;IACT,YAAY;IACZ,YAAY;KAAE,UAAU;KAAK,MAAM;KAAkB;IACtD;GACD,WAAW;IACT,SAAS;IACT,YAAY;IACZ,YAAY;KAAE,UAAU;KAAK,MAAM;KAAiB;IACrD;GACF;EACD,UAAU,MAAM;AACd,KAAE,iBAAiB;AACnB,cAAW;;EAEb,eAAa,CAAC;YAEd,qBAAC;GACC,UAAU,MAAM,EAAE,iBAAiB;GACnC,SAAS,EAAE,OAAO,SAAS,KAAM,GAAG;GACpC,SAAS,EAAE,OAAO,SAAS,IAAI,IAAK;GACpC,YAAY,EAAE,UAAU,IAAK;GAC7B,WAAW,cAAc;IACvB;IACA;IACD,CAAC;GACF,MAAK;GACL;GACA,aAAY;GACZ,GAAI;cAEJ,qBAAC;IACC,WAAW,GACT,kBACA,kBAAkB,WACd,qBACA,iBACE,qBACA,WACE,iBACA,SACT;eAEA,YACC,oBAAC;KAAG,WAAU;eACX;MACE,EAEN,kBACC,oBAAC;KACC,SAAS,cAAc;KACvB,OAAO,YAAY;KACnB,OAAM;KACN,WAAU;KACV,UAAU,MAAM;AACd,QAAE,iBAAiB;AACnB,iBAAW;;KAEb,MAAM;KACN,MAAM,WAAW;MACjB;KAEA,EACN,oBAAC;IAAI,WAAU;IAAqC;KAAe;IACvD;GACR,EACR,iBACD"}

package/dist/types/components/Badge/index.d.ts

@@ -1,5 +1,5 @@
 import { HTMLAttributes } from "react";
-import * as class_variance_authority_types11 from "class-variance-authority/types";
+import * as class_variance_authority_types0 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
 
 //#region src/components/Badge/index.d.ts
@@ -47,7 +47,7 @@ declare const badgeVariants: (props?: {
   color?: BadgeColor;
   variant?: BadgeVariant;
   size?: BadgeSize;
-} & class_variance_authority_types11.ClassProp) => string;
+} & class_variance_authority_types0.ClassProp) => string;
 /**
  * Badge component props interface
  * @description Comprehensive props for the Badge component with accessibility and interactive features

package/dist/types/components/Breadcrumb/breadcrumb.content.d.ts

@@ -1,10 +1,10 @@
-import * as _intlayer_types145 from "@intlayer/types";
+import * as _intlayer_types292 from "@intlayer/types";
 
 //#region src/components/Breadcrumb/breadcrumb.content.d.ts
 declare const breadCrumbContent: {
   key: string;
   content: {
-    linkLabel: _intlayer_types145.TypedNodeModel<_intlayer_types145.NodeType.Translation, {
+    linkLabel: _intlayer_types292.TypedNodeModel<_intlayer_types292.NodeType.Translation, {
       en: string;
       fr: string;
       es: string;
@@ -23,7 +23,7 @@ declare const breadCrumbContent: {
       id: string;
       vi: string;
     }, {
-      nodeType: "translation" | _intlayer_types145.NodeType.Translation;
+      nodeType: _intlayer_types292.NodeType.Translation | "translation";
     } & {
       translation: {
         en: string;

package/dist/types/components/Breadcrumb/index.d.ts

@@ -1,7 +1,7 @@
 import { LinkColor } from "../Link/Link.js";
 import "../Link/index.js";
 import { FC, HTMLAttributes, ReactNode } from "react";
-import * as class_variance_authority_types12 from "class-variance-authority/types";
+import * as class_variance_authority_types0 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
 import { LocalesValues } from "@intlayer/types";
 
@@ -12,7 +12,7 @@ import { LocalesValues } from "@intlayer/types";
 declare const breadcrumbVariants: (props?: {
   size?: "small" | "medium" | "large";
   spacing?: "compact" | "normal" | "loose";
-} & class_variance_authority_types12.ClassProp) => string;
+} & class_variance_authority_types0.ClassProp) => string;
 /**
  * Detailed breadcrumb link configuration with optional href or onClick
  */

package/dist/types/components/Breadcrumb/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/components/Breadcrumb/index.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;;;cAqDM,0BA+JgC;EA/JhC,IAAA,CAAA,EAAA,OAAA,GAAA,QAiBJ,GAAA,OAAA;EA0HG,OAAA,CAAA,EAAA,SAAA,GAAA,QAAsB,GAAA,OAAA;AAoB3B,CAAA,GA9IE,gCAAA,CAAA,SA8IoC,EAAA,GAAsB,MAAA;AAE5D;;;KAtBK,sBAAA,GA+BoB;EAId;;;EAyBP,IAAA,CAAA,EAAA,MAAA;EACa;;;EA4BJ,IAAA,EAAA,MAAA;;;;;;;;;;;KArED,cAAA,YAA0B;KAE1B,eAAA;;;;SAIH;;;;;UAKC,eAAe;;;;WAId;;;;;;;;;;cAUG;;;;;;;;;;;;;;;IAeV,oBAAoB,sBACtB,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;cA4BJ,YAAY,GAAG"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/components/Breadcrumb/index.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;;;cAqDM,0BA+JgC;EA/JhC,IAAA,CAAA,EAAA,OAAA,GAAA,QAiBJ,GAAA,OAAA;EA0HG,OAAA,CAAA,EAAA,SAAA,GAAA,QAAsB,GAAA,OAAA;AAoB3B,CAAA,GA9IE,+BAAA,CAAA,SA8IoC,EAAsB,GAAA,MAAA;AAE5D;;;KAtBK,sBAAA,GA+BoB;EAId;;;EAyBP,IAAA,CAAA,EAAA,MAAA;EACa;;;EA4BJ,IAAA,EAAA,MAAA;;;;;;;;;;;KArED,cAAA,YAA0B;KAE1B,eAAA;;;;SAIH;;;;;UAKC,eAAe;;;;WAId;;;;;;;;;;cAUG;;;;;;;;;;;;;;;IAeV,oBAAoB,sBACtB,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;cA4BJ,YAAY,GAAG"}

package/dist/types/components/Browser/Browser.content.d.ts

@@ -1,10 +1,10 @@
-import * as _intlayer_types148 from "@intlayer/types";
+import * as _intlayer_types14 from "@intlayer/types";
 
 //#region src/components/Browser/Browser.content.d.ts
 declare const browserContent: {
   key: string;
   content: {
-    ariaLabel: _intlayer_types148.TypedNodeModel<_intlayer_types148.NodeType.Translation, {
+    ariaLabel: _intlayer_types14.TypedNodeModel<_intlayer_types14.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -23,7 +23,7 @@ declare const browserContent: {
       id: string;
       vi: string;
     }, {
-      nodeType: "translation" | _intlayer_types148.NodeType.Translation;
+      nodeType: _intlayer_types14.NodeType.Translation | "translation";
     } & {
       translation: {
         en: string;
@@ -45,7 +45,7 @@ declare const browserContent: {
         vi: string;
       };
     }>;
-    urlLabel: _intlayer_types148.TypedNodeModel<_intlayer_types148.NodeType.Translation, {
+    urlLabel: _intlayer_types14.TypedNodeModel<_intlayer_types14.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -64,7 +64,7 @@ declare const browserContent: {
       id: string;
       vi: string;
     }, {
-      nodeType: "translation" | _intlayer_types148.NodeType.Translation;
+      nodeType: _intlayer_types14.NodeType.Translation | "translation";
     } & {
       translation: {
         en: string;
@@ -87,7 +87,7 @@ declare const browserContent: {
       };
     }>;
     urlPlaceholder: string;
-    errorMessage: _intlayer_types148.TypedNodeModel<_intlayer_types148.NodeType.Translation, {
+    errorMessage: _intlayer_types14.TypedNodeModel<_intlayer_types14.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -106,7 +106,7 @@ declare const browserContent: {
       id: string;
       vi: string;
     }, {
-      nodeType: "translation" | _intlayer_types148.NodeType.Translation;
+      nodeType: _intlayer_types14.NodeType.Translation | "translation";
     } & {
       translation: {
         en: string;
@@ -128,7 +128,7 @@ declare const browserContent: {
         vi: string;
       };
     }>;
-    reloadButtonTitle: _intlayer_types148.TypedNodeModel<_intlayer_types148.NodeType.Translation, {
+    reloadButtonTitle: _intlayer_types14.TypedNodeModel<_intlayer_types14.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -147,7 +147,7 @@ declare const browserContent: {
       id: string;
       vi: string;
     }, {
-      nodeType: "translation" | _intlayer_types148.NodeType.Translation;
+      nodeType: _intlayer_types14.NodeType.Translation | "translation";
     } & {
       translation: {
         en: string;
@@ -169,7 +169,7 @@ declare const browserContent: {
         vi: string;
       };
     }>;
-    iframeTitle: _intlayer_types148.TypedNodeModel<_intlayer_types148.NodeType.Translation, {
+    iframeTitle: _intlayer_types14.TypedNodeModel<_intlayer_types14.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -188,7 +188,7 @@ declare const browserContent: {
       id: string;
       vi: string;
     }, {
-      nodeType: "translation" | _intlayer_types148.NodeType.Translation;
+      nodeType: _intlayer_types14.NodeType.Translation | "translation";
     } & {
       translation: {
         en: string;

package/dist/types/components/Browser/Browser.content.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Browser.content.d.ts","names":[],"sources":["../../../../src/components/Browser/Browser.content.ts"],"sourcesContent":[],"mappings":";;;cAEa;;;IAAA,SAAA,mCAwGS,0CAAA"}
+{"version":3,"file":"Browser.content.d.ts","names":[],"sources":["../../../../src/components/Browser/Browser.content.ts"],"sourcesContent":[],"mappings":";;;cAEa;;;IAAA,SAAA,kCAwGS,yCAAA"}

package/dist/types/components/Button/Button.d.ts

@@ -1,5 +1,5 @@
 import { ButtonHTMLAttributes, DetailedHTMLProps, FC } from "react";
-import * as class_variance_authority_types0 from "class-variance-authority/types";
+import * as class_variance_authority_types1 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
 import { LucideIcon } from "lucide-react";
 
@@ -66,7 +66,7 @@ declare const buttonVariants: (props?: {
   variant?: "input" | "default" | "none" | "outline" | "link" | "invisible-link" | "hoverable" | "fade";
   textAlign?: "left" | "center" | "right";
   isFullWidth?: boolean;
-} & class_variance_authority_types0.ClassProp) => string;
+} & class_variance_authority_types1.ClassProp) => string;
 /**
  * Enhanced Button component props with comprehensive type safety and accessibility features
  */

package/dist/types/components/CollapsibleTable/CollapsibleTable.d.ts

@@ -4,9 +4,9 @@ import { VariantProps } from "class-variance-authority";
 
 //#region src/components/CollapsibleTable/CollapsibleTable.d.ts
 declare const collapsibleTableVariants: (props?: {
-  size?: "sm" | "md" | "lg" | "xl" | "full";
+  size?: "full" | "sm" | "md" | "lg" | "xl";
   variant?: "default" | "dark" | "ghost" | "outlined";
-  spacing?: "sm" | "md" | "lg" | "none" | "auto";
+  spacing?: "auto" | "sm" | "md" | "lg" | "none";
 } & class_variance_authority_types2.ClassProp) => string;
 interface CollapsibleTableProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'>, VariantProps<typeof collapsibleTableVariants> {
   /** Table title displayed in the header */

package/dist/types/components/CollapsibleTable/CollapsibleTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CollapsibleTable.d.ts","names":[],"sources":["../../../../src/components/CollapsibleTable/CollapsibleTable.tsx"],"sourcesContent":[],"mappings":";;;;;cASM,gCA8EJ;;;EA9EI,OAAA,CAAA,EAAA,IAAA,GAAA,IAAA,GAAA,IA+BL,GAAA,MAAA,GAAA,MAAA;AA8CD,CAAA,GA9CC,+BAAA,CAAA,SA+CC,EAAA,GAAA,MAAA;AAA4B,UADb,qBAAA,SACP,IAAoB,CAAf,cAAe,CAAA,cAAA,CAAA,EAAA,OAAA,CAAA,EAC1B,YAD0B,CAAA,OACN,wBADM,CAAA,CAAA;EAAf;EACS,KAAA,EAAA,MAAA;EAIhB;EAsBO,IAAA,EAtBP,MAsBO,CAAA,MAAA,EAAA,OAAA,CAAA,EAAA;EAUW;EAA4B,SAAA,CAAA,EAAA,MAAA;EAFlC;EAnCV,eAAA,CAAA,EAAA,MAAA;EACN;EAAY,gBAAA,CAAA,EAAA,MAAA;EAoIH;;;;;;;;;;;;;;;eA1GE;;;;;;;;oBAQK,qCAEM,4BAA4B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAgGzC,kBAAkB,GAAG"}
+{"version":3,"file":"CollapsibleTable.d.ts","names":[],"sources":["../../../../src/components/CollapsibleTable/CollapsibleTable.tsx"],"sourcesContent":[],"mappings":";;;;;cASM,gCA8EJ;;;EA9EI,OAAA,CAAA,EAAA,MAAA,GAAA,IAAA,GAAA,IA+BL,GAAA,IAAA,GAAA,MAAA;AA8CD,CAAA,GA9CC,+BAAA,CAAA,SA+CC,EAAA,GAAA,MAAA;AAA4B,UADb,qBAAA,SACP,IAAoB,CAAf,cAAe,CAAA,cAAA,CAAA,EAAA,OAAA,CAAA,EAC1B,YAD0B,CAAA,OACN,wBADM,CAAA,CAAA;EAAf;EACS,KAAA,EAAA,MAAA;EAIhB;EAsBO,IAAA,EAtBP,MAsBO,CAAA,MAAA,EAAA,OAAA,CAAA,EAAA;EAUW;EAA4B,SAAA,CAAA,EAAA,MAAA;EAFlC;EAnCV,eAAA,CAAA,EAAA,MAAA;EACN;EAAY,gBAAA,CAAA,EAAA,MAAA;EAoIH;;;;;;;;;;;;;;;eA1GE;;;;;;;;oBAQK,qCAEM,4BAA4B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAgGzC,kBAAkB,GAAG"}

package/dist/types/components/Command/index.d.ts

@@ -1,6 +1,6 @@
-import * as react2 from "react";
+import * as react9 from "react";
 import { ComponentProps, FC, HTMLAttributes } from "react";
-import * as react_jsx_runtime4 from "react/jsx-runtime";
+import * as react_jsx_runtime22 from "react/jsx-runtime";
 import { DialogProps } from "@radix-ui/react-dialog";
 import { Command as Command$1 } from "cmdk";
 
@@ -25,65 +25,65 @@ declare const CommandRoot: FC<ComponentProps<typeof Command$1>>;
  */
 declare const Command: {
   Dialog: FC<DialogProps>;
-  Input: FC<Omit<Pick<Pick<react2.DetailedHTMLProps<react2.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, keyof react2.InputHTMLAttributes<HTMLInputElement> | "key"> & {
+  Input: FC<Omit<Pick<Pick<react9.DetailedHTMLProps<react9.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof react9.InputHTMLAttributes<HTMLInputElement>> & {
     ref?: React.Ref<HTMLInputElement>;
   } & {
     asChild?: boolean;
-  }, keyof react2.InputHTMLAttributes<HTMLInputElement> | "key" | "asChild">, "type" | "onChange" | "value"> & {
+  }, "key" | keyof react9.InputHTMLAttributes<HTMLInputElement> | "asChild">, "type" | "value" | "onChange"> & {
     value?: string;
     onValueChange?: (search: string) => void;
-  } & react2.RefAttributes<HTMLInputElement>>;
+  } & react9.RefAttributes<HTMLInputElement>>;
   List: FC<{
     children?: React.ReactNode;
-  } & Pick<Pick<react2.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | "key"> & {
+  } & Pick<Pick<react9.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
   } & {
     asChild?: boolean;
-  }, keyof HTMLAttributes<HTMLDivElement> | "key" | "asChild"> & {
+  }, "key" | keyof HTMLAttributes<HTMLDivElement> | "asChild"> & {
     label?: string;
-  } & react2.RefAttributes<HTMLDivElement>>;
+  } & react9.RefAttributes<HTMLDivElement>>;
   Empty: FC<{
     children?: React.ReactNode;
-  } & Pick<Pick<react2.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | "key"> & {
+  } & Pick<Pick<react9.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
   } & {
     asChild?: boolean;
-  }, keyof HTMLAttributes<HTMLDivElement> | "key" | "asChild"> & react2.RefAttributes<HTMLDivElement>>;
+  }, "key" | keyof HTMLAttributes<HTMLDivElement> | "asChild"> & react9.RefAttributes<HTMLDivElement>>;
   Group: FC<{
     children?: React.ReactNode;
-  } & Omit<Pick<Pick<react2.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | "key"> & {
+  } & Omit<Pick<Pick<react9.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
   } & {
     asChild?: boolean;
-  }, keyof HTMLAttributes<HTMLDivElement> | "key" | "asChild">, "value" | "heading"> & {
+  }, "key" | keyof HTMLAttributes<HTMLDivElement> | "asChild">, "value" | "heading"> & {
     heading?: React.ReactNode;
     value?: string;
     forceMount?: boolean;
-  } & react2.RefAttributes<HTMLDivElement>>;
-  Separator: FC<Pick<Pick<react2.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | "key"> & {
+  } & react9.RefAttributes<HTMLDivElement>>;
+  Separator: FC<Pick<Pick<react9.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
   } & {
     asChild?: boolean;
-  }, keyof HTMLAttributes<HTMLDivElement> | "key" | "asChild"> & {
+  }, "key" | keyof HTMLAttributes<HTMLDivElement> | "asChild"> & {
     alwaysRender?: boolean;
-  } & react2.RefAttributes<HTMLDivElement>>;
+  } & react9.RefAttributes<HTMLDivElement>>;
   Item: FC<{
     children?: React.ReactNode;
-  } & Omit<Pick<Pick<react2.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | "key"> & {
+  } & Omit<Pick<Pick<react9.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
   } & {
     asChild?: boolean;
-  }, keyof HTMLAttributes<HTMLDivElement> | "key" | "asChild">, "onSelect" | "disabled" | "value"> & {
+  }, "key" | keyof HTMLAttributes<HTMLDivElement> | "asChild">, "disabled" | "value" | "onSelect"> & {
     disabled?: boolean;
     onSelect?: (value: string) => void;
     value?: string;
     keywords?: string[];
     forceMount?: boolean;
-  } & react2.RefAttributes<HTMLDivElement>>;
+  } & react9.RefAttributes<HTMLDivElement>>;
   Shortcut: ({
     className,
     ...props
-  }: HTMLAttributes<HTMLSpanElement>) => react_jsx_runtime4.JSX.Element;
+  }: HTMLAttributes<HTMLSpanElement>) => react_jsx_runtime22.JSX.Element;
   propTypes?: any;
   displayName?: string | undefined;
 };

package/dist/types/components/Command/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/components/Command/index.tsx"],"sourcesContent":[],"mappings":";;;;;;;cAaa,aAAa,GAAG,sBAAsB;;;;AAAnD;;;;;AA0HA;;;;;;;;;cAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA7BV,eAAe,qBAAgB,kBAAA,CAAA,GAAA,CAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/components/Command/index.tsx"],"sourcesContent":[],"mappings":";;;;;;;cAaa,aAAa,GAAG,sBAAsB;;;;AAAnD;;;;;AA0HA;;;;;;;;;cAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA7BV,eAAe,qBAAgB,mBAAA,CAAA,GAAA,CAAA"}

package/dist/types/components/Container/index.d.ts

@@ -1,5 +1,5 @@
 import { DetailedHTMLProps, FC, HTMLAttributes, PropsWithChildren } from "react";
-import * as class_variance_authority_types3 from "class-variance-authority/types";
+import * as class_variance_authority_types14 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
 
 //#region src/components/Container/index.d.ts
@@ -9,15 +9,15 @@ import { VariantProps } from "class-variance-authority";
  * Provides flexible styling options for background, padding, borders, and layout
  */
 declare const containerVariants: (props?: {
-  roundedSize?: "sm" | "md" | "lg" | "xl" | "none" | "full" | "2xl" | "3xl";
-  transparency?: "sm" | "md" | "lg" | "xl" | "none" | "full";
+  roundedSize?: "full" | "sm" | "md" | "lg" | "xl" | "none" | "2xl" | "3xl";
+  transparency?: "full" | "sm" | "md" | "lg" | "xl" | "none";
   padding?: "sm" | "md" | "lg" | "xl" | "none" | "2xl";
   separator?: "without" | "x" | "y" | "both";
   border?: "none" | "with";
   borderColor?: "error" | "primary" | "secondary" | "neutral" | "text" | "success" | "warning";
   background?: "none" | "hoverable" | "with";
   gap?: "sm" | "md" | "lg" | "xl" | "none" | "2xl";
-} & class_variance_authority_types3.ClassProp) => string;
+} & class_variance_authority_types14.ClassProp) => string;
 /** Available rounded corner sizes for the container */
 declare enum ContainerRoundedSize {
   NONE = "none",

package/dist/types/components/Container/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/components/Container/index.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;AAaA;AA4EY,cA5EC,iBA4EmB,EAAA,CAAA,KAoEzB,CApEyB,EAAA;EAYpB,WAAA,CAAA,EAAA,IAAA,GAAA,IAAqB,GAAA,IAAA,GAAA,IAAA,GAAA,MAAA,GAAA,MAAA,GAAA,KAAA,GAAA,KAAA;EAUrB,YAAA,CAAA,EAAA,IAAgB,GAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,MAAA,GAAA,MAAA;EAShB,OAAA,CAAA,EAAA,IAAA,GAAA,IAAkB,GAAA,IAAA,GAAA,IAAA,GAAA,MAAA,GAAA,KAAA;EAQlB,SAAA,CAAA,EAAA,SAAA,GAAoB,GAAA,GAAA,GAAA,GAAA,MAAA;EAWpB,MAAA,CAAA,EAAA,MAAA,GAAA,MAAmB;EAOnB,WAAA,CAAA,EAAA,OAAY,GAAA,SAAA,GAAA,WAAA,GAAA,SAAA,GAAA,MAAA,GAAA,SAAA,GAAA,SAAA;EAUZ,UAAA,CAAA,EAAA,MAAc,GAAA,WAAA,GAAA,MAAA;EACC,GAAA,CAAA,EAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,MAAA,GAAA,KAAA;CAApB,GAvEL,+BAAA,CAAA,SAuEK,EAAA,GAAA,MAAA;;AADsB,aAnEjB,oBAAA;EAsEuB,IAAA,GAAA,MAAA;EAAf,EAAA,GAAA,IAAA;EAAgC,EAAA,GAAA,IAAA;EAAlD,EAAA,GAAA,IAAA;EAAiB,EAAA,GAAA,IAAA;EAkCN,MAAA,GAAA,KAgCZ;;;;;aA5HW,qBAAA;;;;;;;;;aAUA,gBAAA;;;;;;;;aASA,kBAAA;;;;;;;aAQA,oBAAA;;;;;;;;;;aAWA,mBAAA;;;;;;aAOA,YAAA;;;;;;;;;KAUA,cAAA,GAAiB,kBAC3B,KAAK,oBAAoB,iCAEzB,kBAAkB,eAAe,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAkCvC,WAAW,GAAG"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/components/Container/index.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;AAaA;AA4EY,cA5EC,iBA4EmB,EAAA,CAAA,KAoEzB,CApEyB,EAAA;EAYpB,WAAA,CAAA,EAAA,MAAA,GAAA,IAAqB,GAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,MAAA,GAAA,KAAA,GAAA,KAAA;EAUrB,YAAA,CAAA,EAAA,MAAgB,GAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,MAAA;EAShB,OAAA,CAAA,EAAA,IAAA,GAAA,IAAkB,GAAA,IAAA,GAAA,IAAA,GAAA,MAAA,GAAA,KAAA;EAQlB,SAAA,CAAA,EAAA,SAAA,GAAoB,GAAA,GAAA,GAAA,GAAA,MAAA;EAWpB,MAAA,CAAA,EAAA,MAAA,GAAA,MAAmB;EAOnB,WAAA,CAAA,EAAA,OAAY,GAAA,SAAA,GAAA,WAAA,GAAA,SAAA,GAAA,MAAA,GAAA,SAAA,GAAA,SAAA;EAUZ,UAAA,CAAA,EAAA,MAAc,GAAA,WAAA,GAAA,MAAA;EACC,GAAA,CAAA,EAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,MAAA,GAAA,KAAA;CAApB,GAvEL,gCAAA,CAAA,SAuEK,EAAA,GAAA,MAAA;;AADsB,aAnEjB,oBAAA;EAsEuB,IAAA,GAAA,MAAA;EAAf,EAAA,GAAA,IAAA;EAAgC,EAAA,GAAA,IAAA;EAAlD,EAAA,GAAA,IAAA;EAAiB,EAAA,GAAA,IAAA;EAkCN,MAAA,GAAA,KAgCZ;;;;;aA5HW,qBAAA;;;;;;;;;aAUA,gBAAA;;;;;;;;aASA,kBAAA;;;;;;;aAQA,oBAAA;;;;;;;;;;aAWA,mBAAA;;;;;;aAOA,YAAA;;;;;;;;;KAUA,cAAA,GAAiB,kBAC3B,KAAK,oBAAoB,iCAEzB,kBAAkB,eAAe,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAkCvC,WAAW,GAAG"}

package/dist/types/components/CopyButton/CopyButton.content.d.ts

@@ -1,10 +1,10 @@
-import * as _intlayer_types31 from "@intlayer/types";
+import * as _intlayer_types334 from "@intlayer/types";
 
 //#region src/components/CopyButton/CopyButton.content.d.ts
 declare const copyContentContent: {
   key: string;
   content: {
-    label: _intlayer_types31.TypedNodeModel<_intlayer_types31.NodeType.Translation, {
+    label: _intlayer_types334.TypedNodeModel<_intlayer_types334.NodeType.Translation, {
       en: string;
       fr: string;
       es: string;
@@ -23,7 +23,7 @@ declare const copyContentContent: {
       id: string;
       vi: string;
     }, {
-      nodeType: "translation" | _intlayer_types31.NodeType.Translation;
+      nodeType: _intlayer_types334.NodeType.Translation | "translation";
     } & {
       translation: {
         en: string;

package/dist/types/components/CopyButton/CopyButton.content.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CopyButton.content.d.ts","names":[],"sources":["../../../../src/components/CopyButton/CopyButton.content.ts"],"sourcesContent":[],"mappings":";;;cAEa;;;IAAA,KAAA,kCA2BS,yCAAA"}
+{"version":3,"file":"CopyButton.content.d.ts","names":[],"sources":["../../../../src/components/CopyButton/CopyButton.content.ts"],"sourcesContent":[],"mappings":";;;cAEa;;;IAAA,KAAA,mCA2BS,0CAAA"}

package/dist/types/components/DictionaryFieldEditor/DictionaryCreationForm/dictionaryCreationForm.content.d.ts

@@ -1,11 +1,11 @@
-import * as _intlayer_types220 from "@intlayer/types";
+import * as _intlayer_types70 from "@intlayer/types";
 
 //#region src/components/DictionaryFieldEditor/DictionaryCreationForm/dictionaryCreationForm.content.d.ts
 declare const dictionaryFormContent: {
   key: string;
   content: {
     keyInput: {
-      label: _intlayer_types220.TypedNodeModel<_intlayer_types220.NodeType.Translation, {
+      label: _intlayer_types70.TypedNodeModel<_intlayer_types70.NodeType.Translation, {
         en: string;
         'en-GB': string;
         fr: string;
@@ -24,7 +24,7 @@ declare const dictionaryFormContent: {
         id: string;
         vi: string;
       }, {
-        nodeType: "translation" | _intlayer_types220.NodeType.Translation;
+        nodeType: _intlayer_types70.NodeType.Translation | "translation";
       } & {
         translation: {
           en: string;
@@ -46,7 +46,7 @@ declare const dictionaryFormContent: {
           vi: string;
         };
       }>;
-      placeholder: _intlayer_types220.TypedNodeModel<_intlayer_types220.NodeType.Translation, {
+      placeholder: _intlayer_types70.TypedNodeModel<_intlayer_types70.NodeType.Translation, {
         en: string;
         'en-GB': string;
         fr: string;
@@ -65,7 +65,7 @@ declare const dictionaryFormContent: {
         id: string;
         vi: string;
       }, {
-        nodeType: "translation" | _intlayer_types220.NodeType.Translation;
+        nodeType: _intlayer_types70.NodeType.Translation | "translation";
       } & {
         translation: {
           en: string;
@@ -89,7 +89,7 @@ declare const dictionaryFormContent: {
       }>;
     };
     projectInput: {
-      label: _intlayer_types220.TypedNodeModel<_intlayer_types220.NodeType.Translation, {
+      label: _intlayer_types70.TypedNodeModel<_intlayer_types70.NodeType.Translation, {
         en: string;
         'en-GB': string;
         fr: string;
@@ -108,7 +108,7 @@ declare const dictionaryFormContent: {
         id: string;
         vi: string;
       }, {
-        nodeType: "translation" | _intlayer_types220.NodeType.Translation;
+        nodeType: _intlayer_types70.NodeType.Translation | "translation";
       } & {
         translation: {
           en: string;
@@ -130,7 +130,7 @@ declare const dictionaryFormContent: {
           vi: string;
         };
       }>;
-      placeholder: _intlayer_types220.TypedNodeModel<_intlayer_types220.NodeType.Translation, {
+      placeholder: _intlayer_types70.TypedNodeModel<_intlayer_types70.NodeType.Translation, {
         en: string;
         'en-GB': string;
         fr: string;
@@ -149,7 +149,7 @@ declare const dictionaryFormContent: {
         id: string;
         vi: string;
       }, {
-        nodeType: "translation" | _intlayer_types220.NodeType.Translation;
+        nodeType: _intlayer_types70.NodeType.Translation | "translation";
       } & {
         translation: {
           en: string;
@@ -173,7 +173,7 @@ declare const dictionaryFormContent: {
       }>;
     };
     noDictionaryView: {
-      title: _intlayer_types220.TypedNodeModel<_intlayer_types220.NodeType.Translation, {
+      title: _intlayer_types70.TypedNodeModel<_intlayer_types70.NodeType.Translation, {
         en: string;
         'en-GB': string;
         fr: string;
@@ -192,7 +192,7 @@ declare const dictionaryFormContent: {
         id: string;
         vi: string;
       }, {
-        nodeType: "translation" | _intlayer_types220.NodeType.Translation;
+        nodeType: _intlayer_types70.NodeType.Translation | "translation";
       } & {
         translation: {
           en: string;
@@ -214,7 +214,7 @@ declare const dictionaryFormContent: {
           vi: string;
         };
       }>;
-      description: _intlayer_types220.TypedNodeModel<_intlayer_types220.NodeType.Translation, {
+      description: _intlayer_types70.TypedNodeModel<_intlayer_types70.NodeType.Translation, {
         en: string;
         'en-GB': string;
         fr: string;
@@ -233,7 +233,7 @@ declare const dictionaryFormContent: {
         id: string;
         vi: string;
       }, {
-        nodeType: "translation" | _intlayer_types220.NodeType.Translation;
+        nodeType: _intlayer_types70.NodeType.Translation | "translation";
       } & {
         translation: {
           en: string;
@@ -256,7 +256,7 @@ declare const dictionaryFormContent: {
         };
       }>;
     };
-    createDictionaryTitle: _intlayer_types220.TypedNodeModel<_intlayer_types220.NodeType.Translation, {
+    createDictionaryTitle: _intlayer_types70.TypedNodeModel<_intlayer_types70.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -275,7 +275,7 @@ declare const dictionaryFormContent: {
       id: string;
       vi: string;
     }, {
-      nodeType: "translation" | _intlayer_types220.NodeType.Translation;
+      nodeType: _intlayer_types70.NodeType.Translation | "translation";
     } & {
       translation: {
         en: string;
@@ -297,7 +297,7 @@ declare const dictionaryFormContent: {
         vi: string;
       };
     }>;
-    createDictionaryDescription: _intlayer_types220.TypedNodeModel<_intlayer_types220.NodeType.Translation, {
+    createDictionaryDescription: _intlayer_types70.TypedNodeModel<_intlayer_types70.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -316,7 +316,7 @@ declare const dictionaryFormContent: {
       id: string;
       vi: string;
     }, {
-      nodeType: "translation" | _intlayer_types220.NodeType.Translation;
+      nodeType: _intlayer_types70.NodeType.Translation | "translation";
     } & {
       translation: {
         en: string;
@@ -339,7 +339,7 @@ declare const dictionaryFormContent: {
       };
     }>;
     createDictionaryButton: {
-      text: _intlayer_types220.TypedNodeModel<_intlayer_types220.NodeType.Translation, {
+      text: _intlayer_types70.TypedNodeModel<_intlayer_types70.NodeType.Translation, {
         en: string;
         'en-GB': string;
         fr: string;
@@ -358,7 +358,7 @@ declare const dictionaryFormContent: {
         id: string;
         vi: string;
       }, {
-        nodeType: "translation" | _intlayer_types220.NodeType.Translation;
+        nodeType: _intlayer_types70.NodeType.Translation | "translation";
       } & {
         translation: {
           en: string;
@@ -380,7 +380,7 @@ declare const dictionaryFormContent: {
           vi: string;
         };
       }>;
-      ariaLabel: _intlayer_types220.TypedNodeModel<_intlayer_types220.NodeType.Translation, {
+      ariaLabel: _intlayer_types70.TypedNodeModel<_intlayer_types70.NodeType.Translation, {
         en: string;
         'en-GB': string;
         fr: string;
@@ -399,7 +399,7 @@ declare const dictionaryFormContent: {
         id: string;
         vi: string;
       }, {
-        nodeType: "translation" | _intlayer_types220.NodeType.Translation;
+        nodeType: _intlayer_types70.NodeType.Translation | "translation";
       } & {
         translation: {
           en: string;
@@ -423,7 +423,7 @@ declare const dictionaryFormContent: {
       }>;
     };
     editButton: {
-      text: _intlayer_types220.TypedNodeModel<_intlayer_types220.NodeType.Translation, {
+      text: _intlayer_types70.TypedNodeModel<_intlayer_types70.NodeType.Translation, {
         en: string;
         'en-GB': string;
         fr: string;
@@ -442,7 +442,7 @@ declare const dictionaryFormContent: {
         id: string;
         vi: string;
       }, {
-        nodeType: "translation" | _intlayer_types220.NodeType.Translation;
+        nodeType: _intlayer_types70.NodeType.Translation | "translation";
       } & {
         translation: {
           en: string;
@@ -464,7 +464,7 @@ declare const dictionaryFormContent: {
           vi: string;
         };
       }>;
-      ariaLabel: _intlayer_types220.TypedNodeModel<_intlayer_types220.NodeType.Translation, {
+      ariaLabel: _intlayer_types70.TypedNodeModel<_intlayer_types70.NodeType.Translation, {
         en: string;
         'en-GB': string;
         fr: string;
@@ -483,7 +483,7 @@ declare const dictionaryFormContent: {
         id: string;
         vi: string;
       }, {
-        nodeType: "translation" | _intlayer_types220.NodeType.Translation;
+        nodeType: _intlayer_types70.NodeType.Translation | "translation";
       } & {
         translation: {
           en: string;