@intlayer/design-system 7.6.0-canary.0 → 7.6.0-canary.1

package/dist/esm/components/Terminal/Terminal.mjs

@@ -3,7 +3,7 @@
 import { cn } from "../../utils/cn.mjs";
 import { Container } from "../Container/index.mjs";
 import { Input } from "../Input/Input.mjs";
-import { useMemo, useState } from "react";
+import { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useIntlayer } from "react-intlayer";
 
@@ -88,7 +88,7 @@ const parseAnsiCodes = (text, isDarkMode) => {
 };
 const Terminal = ({ className, children, isDarkMode = false, title = "bash", onClose, onSubmit, ...props }) => {
 	const content = useIntlayer("terminal");
-	const lines = useMemo(() => children.split("\n"), [children]);
+	const lines = typeof children === "string" ? children.split("\n") : [];
 	const [inputValue, setInputValue] = useState("");
 	const handleKeyDown = (e) => {
 		if (e.key === "Enter" && inputValue.trim()) {

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

@@ -1 +1 @@
-{"version":3,"file":"Terminal.mjs","names":[],"sources":["../../../../src/components/Terminal/Terminal.tsx"],"sourcesContent":["'use client';\n\nimport { Container } from '@components/Container';\nimport { Input } from '@components/Input';\nimport { cn } from '@utils/cn';\nimport {\n  type FC,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  useMemo,\n  useState,\n} from 'react';\nimport { useIntlayer } from 'react-intlayer';\n\n// ANSI color code mappings to CSS colors\nconst ANSI_COLORS: Record<string, { light: string; dark: string }> = {\n  '\\x1b[0m': { light: '', dark: '' }, // RESET\n  '\\x1b[90m': { light: 'text-gray-500', dark: 'text-gray-400' }, // GREY\n  '\\x1b[38;5;239m': { light: 'text-gray-600', dark: 'text-gray-500' }, // GREY_DARK\n  '\\x1b[38;5;252m': { light: 'text-gray-300', dark: 'text-gray-300' }, // GREY_LIGHT\n  '\\x1b[34m': { light: 'text-blue-600', dark: 'text-blue-400' }, // BLUE\n  '\\x1b[31m': { light: 'text-red-600', dark: 'text-red-400' }, // RED\n  '\\x1b[32m': { light: 'text-green-600', dark: 'text-green-400' }, // GREEN\n  '\\x1b[38;5;226m': { light: 'text-yellow-500', dark: 'text-yellow-300' }, // YELLOW\n  '\\x1b[35m': { light: 'text-purple-600', dark: 'text-purple-400' }, // MAGENTA\n  '\\x1b[38;5;3m': { light: 'text-amber-600', dark: 'text-amber-300' }, // BEIGE\n  '\\x1b[38;5;208m': { light: 'text-orange-600', dark: 'text-orange-400' }, // ORANGE\n  '\\x1b[36m': { light: 'text-cyan-600', dark: 'text-cyan-400' }, // CYAN\n  '\\x1b[37m': { light: 'text-gray-800', dark: 'text-gray-200' }, // WHITE\n  '\\x1b[1m': { light: 'font-bold', dark: 'font-bold' }, // BOLD\n};\n\ninterface AnsiSegment {\n  text: string;\n  color?: string;\n  isBold?: boolean;\n}\n\nconst parseAnsiCodes = (text: string, isDarkMode: boolean): AnsiSegment[] => {\n  const segments: AnsiSegment[] = [];\n  // biome-ignore lint/suspicious/noControlCharactersInRegex: we need to parse ANSI codes\n  const ansiRegex = /(\\x1b\\[[0-9;]*m)/g;\n  const parts = text.split(ansiRegex);\n\n  let currentColor: string | undefined;\n  let isBold = false;\n\n  for (const part of parts) {\n    if (ansiRegex.test(part)) {\n      // This is an ANSI code\n      const colorMapping = ANSI_COLORS[part];\n      if (colorMapping) {\n        if (part === '\\x1b[0m') {\n          // RESET\n          currentColor = undefined;\n          isBold = false;\n        } else if (part === '\\x1b[1m') {\n          // BOLD\n          isBold = true;\n        } else {\n          currentColor = isDarkMode ? colorMapping.dark : colorMapping.light;\n        }\n      }\n    } else if (part) {\n      // This is actual text\n      segments.push({\n        text: part,\n        color: currentColor,\n        isBold,\n      });\n    }\n  }\n\n  return segments;\n};\n\nexport type TerminalProps = {\n  children: string;\n  isDarkMode?: boolean;\n  title?: string;\n  onClose?: () => void;\n  onSubmit?: (value: string) => void;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'onSubmit'>;\n\nexport const Terminal: FC<TerminalProps> = ({\n  className,\n  children,\n  isDarkMode = false,\n  title = 'bash',\n  onClose,\n  onSubmit,\n  ...props\n}) => {\n  const content = useIntlayer('terminal');\n  const lines = useMemo(() => children.split('\\n'), [children]);\n  const [inputValue, setInputValue] = useState('');\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === 'Enter' && inputValue.trim()) {\n      onSubmit?.(inputValue);\n      setInputValue('');\n    }\n  };\n\n  // Explicitly type the container props to avoid type conflicts\n  const containerProps = props as Omit<\n    HTMLAttributes<HTMLDivElement>,\n    'children' | 'onSubmit'\n  >;\n\n  return (\n    <Container\n      roundedSize=\"2xl\"\n      className={cn(\n        'flex min-w-0 max-w-full flex-col overflow-hidden font-mono',\n        className\n      )}\n      {...containerProps}\n    >\n      {/* Tab bar */}\n      <div className=\"flex w-full flex-row items-center justify-start gap-1 bg-neutral-200 text-neutral text-xs dark:bg-neutral-950\">\n        <div className=\"mx-2 flex items-center justify-start gap-2 p-1\">\n          <div className=\"size-3 rounded-full bg-red-500\" />\n          <div className=\"size-3 rounded-full bg-yellow-500\" />\n          <div className=\"size-3 rounded-full bg-green-500\" />\n        </div>\n        <div className=\"flex size-full overflow-y-auto\">\n          <div className=\"flex h-8 min-w-20 items-center justify-between gap-2 bg-card px-3 py-1\">\n            <span>{title}</span>\n            {onClose && (\n              <button\n                type=\"button\"\n                onClick={onClose}\n                className=\"text-neutral transition-colors hover:text-text\"\n                aria-label={content.closeTab.value}\n              >\n                ×\n              </button>\n            )}\n          </div>\n        </div>\n      </div>\n\n      {/* Terminal content - hide scrollbar */}\n      <pre className=\"min-w-0 max-w-full overflow-x-auto overflow-y-auto border-neutral/30 border-b p-3 [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\">\n        <code>\n          {lines.map((line, lineIndex) => {\n            const segments = parseAnsiCodes(line, isDarkMode);\n\n            return (\n              <span className=\"line block w-full\" key={`line-${lineIndex}`}>\n                {segments.length === 0\n                  ? '\\n'\n                  : segments.map((segment, segIndex) => (\n                      <span\n                        key={`seg-${lineIndex}-${segIndex}`}\n                        className={cn(segment.color, {\n                          'font-bold': segment.isBold,\n                        })}\n                      >\n                        {segment.text}\n                      </span>\n                    ))}\n              </span>\n            );\n          })}\n        </code>\n      </pre>\n\n      {/* Input area */}\n      <Container className=\"p-2\">\n        <span className=\"text-neutral\">~/Desktop/MyApp</span>\n        <Input\n          className=\"m-0.5 w-full\"\n          variant=\"invisible\"\n          value={inputValue}\n          aria-label={content.terminalInput.value}\n          onChange={(e) => setInputValue(e.target.value)}\n          onKeyDown={handleKeyDown}\n        />\n      </Container>\n    </Container>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"Terminal.mjs","names":[],"sources":["../../../../src/components/Terminal/Terminal.tsx"],"sourcesContent":["'use client';\n\nimport { Container } from '@components/Container';\nimport { Input } from '@components/Input';\nimport { cn } from '@utils/cn';\nimport {\n  type FC,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  useState,\n} from 'react';\nimport { useIntlayer } from 'react-intlayer';\n\n// ANSI color code mappings to CSS colors\nconst ANSI_COLORS: Record<string, { light: string; dark: string }> = {\n  '\\x1b[0m': { light: '', dark: '' }, // RESET\n  '\\x1b[90m': { light: 'text-gray-500', dark: 'text-gray-400' }, // GREY\n  '\\x1b[38;5;239m': { light: 'text-gray-600', dark: 'text-gray-500' }, // GREY_DARK\n  '\\x1b[38;5;252m': { light: 'text-gray-300', dark: 'text-gray-300' }, // GREY_LIGHT\n  '\\x1b[34m': { light: 'text-blue-600', dark: 'text-blue-400' }, // BLUE\n  '\\x1b[31m': { light: 'text-red-600', dark: 'text-red-400' }, // RED\n  '\\x1b[32m': { light: 'text-green-600', dark: 'text-green-400' }, // GREEN\n  '\\x1b[38;5;226m': { light: 'text-yellow-500', dark: 'text-yellow-300' }, // YELLOW\n  '\\x1b[35m': { light: 'text-purple-600', dark: 'text-purple-400' }, // MAGENTA\n  '\\x1b[38;5;3m': { light: 'text-amber-600', dark: 'text-amber-300' }, // BEIGE\n  '\\x1b[38;5;208m': { light: 'text-orange-600', dark: 'text-orange-400' }, // ORANGE\n  '\\x1b[36m': { light: 'text-cyan-600', dark: 'text-cyan-400' }, // CYAN\n  '\\x1b[37m': { light: 'text-gray-800', dark: 'text-gray-200' }, // WHITE\n  '\\x1b[1m': { light: 'font-bold', dark: 'font-bold' }, // BOLD\n};\n\ninterface AnsiSegment {\n  text: string;\n  color?: string;\n  isBold?: boolean;\n}\n\nconst parseAnsiCodes = (text: string, isDarkMode: boolean): AnsiSegment[] => {\n  const segments: AnsiSegment[] = [];\n  // biome-ignore lint/suspicious/noControlCharactersInRegex: we need to parse ANSI codes\n  const ansiRegex = /(\\x1b\\[[0-9;]*m)/g;\n  const parts = text.split(ansiRegex);\n\n  let currentColor: string | undefined;\n  let isBold = false;\n\n  for (const part of parts) {\n    if (ansiRegex.test(part)) {\n      // This is an ANSI code\n      const colorMapping = ANSI_COLORS[part];\n      if (colorMapping) {\n        if (part === '\\x1b[0m') {\n          // RESET\n          currentColor = undefined;\n          isBold = false;\n        } else if (part === '\\x1b[1m') {\n          // BOLD\n          isBold = true;\n        } else {\n          currentColor = isDarkMode ? colorMapping.dark : colorMapping.light;\n        }\n      }\n    } else if (part) {\n      // This is actual text\n      segments.push({\n        text: part,\n        color: currentColor,\n        isBold,\n      });\n    }\n  }\n\n  return segments;\n};\n\nexport type TerminalProps = {\n  children: string;\n  isDarkMode?: boolean;\n  title?: string;\n  onClose?: () => void;\n  onSubmit?: (value: string) => void;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'onSubmit'>;\n\nexport const Terminal: FC<TerminalProps> = ({\n  className,\n  children,\n  isDarkMode = false,\n  title = 'bash',\n  onClose,\n  onSubmit,\n  ...props\n}) => {\n  const content = useIntlayer('terminal');\n  const lines = typeof children === 'string' ? children.split('\\n') : [];\n  const [inputValue, setInputValue] = useState('');\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === 'Enter' && inputValue.trim()) {\n      onSubmit?.(inputValue);\n      setInputValue('');\n    }\n  };\n\n  // Explicitly type the container props to avoid type conflicts\n  const containerProps = props as Omit<\n    HTMLAttributes<HTMLDivElement>,\n    'children' | 'onSubmit'\n  >;\n\n  return (\n    <Container\n      roundedSize=\"2xl\"\n      className={cn(\n        'flex min-w-0 max-w-full flex-col overflow-hidden font-mono',\n        className\n      )}\n      {...containerProps}\n    >\n      {/* Tab bar */}\n      <div className=\"flex w-full flex-row items-center justify-start gap-1 bg-neutral-200 text-neutral text-xs dark:bg-neutral-950\">\n        <div className=\"mx-2 flex items-center justify-start gap-2 p-1\">\n          <div className=\"size-3 rounded-full bg-red-500\" />\n          <div className=\"size-3 rounded-full bg-yellow-500\" />\n          <div className=\"size-3 rounded-full bg-green-500\" />\n        </div>\n        <div className=\"flex size-full overflow-y-auto\">\n          <div className=\"flex h-8 min-w-20 items-center justify-between gap-2 bg-card px-3 py-1\">\n            <span>{title}</span>\n            {onClose && (\n              <button\n                type=\"button\"\n                onClick={onClose}\n                className=\"text-neutral transition-colors hover:text-text\"\n                aria-label={content.closeTab.value}\n              >\n                ×\n              </button>\n            )}\n          </div>\n        </div>\n      </div>\n\n      {/* Terminal content - hide scrollbar */}\n      <pre className=\"min-w-0 max-w-full overflow-x-auto overflow-y-auto border-neutral/30 border-b p-3 [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\">\n        <code>\n          {lines.map((line, lineIndex) => {\n            const segments = parseAnsiCodes(line, isDarkMode);\n\n            return (\n              <span className=\"line block w-full\" key={`line-${lineIndex}`}>\n                {segments.length === 0\n                  ? '\\n'\n                  : segments.map((segment, segIndex) => (\n                      <span\n                        key={`seg-${lineIndex}-${segIndex}`}\n                        className={cn(segment.color, {\n                          'font-bold': segment.isBold,\n                        })}\n                      >\n                        {segment.text}\n                      </span>\n                    ))}\n              </span>\n            );\n          })}\n        </code>\n      </pre>\n\n      {/* Input area */}\n      <Container className=\"p-2\">\n        <span className=\"text-neutral\">~/Desktop/MyApp</span>\n        <Input\n          className=\"m-0.5 w-full\"\n          variant=\"invisible\"\n          value={inputValue}\n          aria-label={content.terminalInput.value}\n          onChange={(e) => setInputValue(e.target.value)}\n          onKeyDown={handleKeyDown}\n        />\n      </Container>\n    </Container>\n  );\n};\n"],"mappings":"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"}

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

@@ -1,5 +1,5 @@
 import { HTMLAttributes } from "react";
-import * as class_variance_authority_types9 from "class-variance-authority/types";
+import * as class_variance_authority_types1 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_types9.ClassProp) => string;
+} & class_variance_authority_types1.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_types379 from "@intlayer/types";
+import * as _intlayer_types329 from "@intlayer/types";
 
 //#region src/components/Breadcrumb/breadcrumb.content.d.ts
 declare const breadCrumbContent: {
   key: string;
   content: {
-    linkLabel: _intlayer_types379.TypedNodeModel<_intlayer_types379.NodeType.Translation, {
+    linkLabel: _intlayer_types329.TypedNodeModel<_intlayer_types329.NodeType.Translation, {
       en: string;
       fr: string;
       es: string;
@@ -24,7 +24,7 @@ declare const breadCrumbContent: {
       vi: string;
       uk: string;
     }, {
-      nodeType: "translation" | _intlayer_types379.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types329.NodeType.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_types11 from "class-variance-authority/types";
+import * as class_variance_authority_types2 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_types11.ClassProp) => string;
+} & class_variance_authority_types2.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":";;;;;;;;;;;cA2EM,0BAgKgC;EAhKhC,IAAA,CAAA,EAAA,OAAA,GAAA,QAiBJ,GAAA,OAAA;EA2HG,OAAA,CAAA,EAAA,SAAA,GAAA,QAAsB,GAAA,OAAA;AAoB3B,CAAA,GA/IE,gCAAA,CAAA,SA+IoC,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":";;;;;;;;;;;cA2EM,0BAgKgC;EAhKhC,IAAA,CAAA,EAAA,OAAA,GAAA,QAiBJ,GAAA,OAAA;EA2HG,OAAA,CAAA,EAAA,SAAA,GAAA,QAAsB,GAAA,OAAA;AAoB3B,CAAA,GA/IE,+BAAA,CAAA,SA+IoC,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"}

package/dist/types/components/Browser/{browser.content.d.ts → Browser.content.d.ts}

@@ -1,10 +1,10 @@
-import * as _intlayer_types331 from "@intlayer/types";
+import * as _intlayer_types332 from "@intlayer/types";
 
-//#region src/components/Browser/browser.content.d.ts
+//#region src/components/Browser/Browser.content.d.ts
 declare const browserContent: {
   key: string;
   content: {
-    ariaLabel: _intlayer_types331.TypedNodeModel<_intlayer_types331.NodeType.Translation, {
+    ariaLabel: _intlayer_types332.TypedNodeModel<_intlayer_types332.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -24,7 +24,7 @@ declare const browserContent: {
       vi: string;
       uk: string;
     }, {
-      nodeType: "translation" | _intlayer_types331.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types332.NodeType.Translation;
     } & {
       translation: {
         en: string;
@@ -47,7 +47,7 @@ declare const browserContent: {
         uk: string;
       };
     }>;
-    urlLabel: _intlayer_types331.TypedNodeModel<_intlayer_types331.NodeType.Translation, {
+    urlLabel: _intlayer_types332.TypedNodeModel<_intlayer_types332.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -67,7 +67,7 @@ declare const browserContent: {
       vi: string;
       uk: string;
     }, {
-      nodeType: "translation" | _intlayer_types331.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types332.NodeType.Translation;
     } & {
       translation: {
         en: string;
@@ -91,7 +91,7 @@ declare const browserContent: {
       };
     }>;
     urlPlaceholder: string;
-    errorMessage: _intlayer_types331.TypedNodeModel<_intlayer_types331.NodeType.Translation, {
+    errorMessage: _intlayer_types332.TypedNodeModel<_intlayer_types332.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -111,7 +111,7 @@ declare const browserContent: {
       vi: string;
       uk: string;
     }, {
-      nodeType: "translation" | _intlayer_types331.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types332.NodeType.Translation;
     } & {
       translation: {
         en: string;
@@ -134,7 +134,7 @@ declare const browserContent: {
         uk: string;
       };
     }>;
-    domainRestrictionError: _intlayer_types331.TypedNodeModel<_intlayer_types331.NodeType.Translation, {
+    domainRestrictionError: _intlayer_types332.TypedNodeModel<_intlayer_types332.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -154,7 +154,7 @@ declare const browserContent: {
       vi: string;
       uk: string;
     }, {
-      nodeType: "translation" | _intlayer_types331.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types332.NodeType.Translation;
     } & {
       translation: {
         en: string;
@@ -177,7 +177,7 @@ declare const browserContent: {
         uk: string;
       };
     }>;
-    backButtonLabel: _intlayer_types331.TypedNodeModel<_intlayer_types331.NodeType.Translation, {
+    backButtonLabel: _intlayer_types332.TypedNodeModel<_intlayer_types332.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -197,7 +197,7 @@ declare const browserContent: {
       vi: string;
       uk: string;
     }, {
-      nodeType: "translation" | _intlayer_types331.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types332.NodeType.Translation;
     } & {
       translation: {
         en: string;
@@ -220,7 +220,7 @@ declare const browserContent: {
         uk: string;
       };
     }>;
-    forwardButtonLabel: _intlayer_types331.TypedNodeModel<_intlayer_types331.NodeType.Translation, {
+    forwardButtonLabel: _intlayer_types332.TypedNodeModel<_intlayer_types332.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -240,7 +240,7 @@ declare const browserContent: {
       vi: string;
       uk: string;
     }, {
-      nodeType: "translation" | _intlayer_types331.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types332.NodeType.Translation;
     } & {
       translation: {
         en: string;
@@ -263,7 +263,7 @@ declare const browserContent: {
         uk: string;
       };
     }>;
-    reloadButtonTitle: _intlayer_types331.TypedNodeModel<_intlayer_types331.NodeType.Translation, {
+    reloadButtonTitle: _intlayer_types332.TypedNodeModel<_intlayer_types332.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -283,7 +283,7 @@ declare const browserContent: {
       vi: string;
       uk: string;
     }, {
-      nodeType: "translation" | _intlayer_types331.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types332.NodeType.Translation;
     } & {
       translation: {
         en: string;
@@ -306,7 +306,7 @@ declare const browserContent: {
         uk: string;
       };
     }>;
-    iframeTitle: _intlayer_types331.TypedNodeModel<_intlayer_types331.NodeType.Translation, {
+    iframeTitle: _intlayer_types332.TypedNodeModel<_intlayer_types332.NodeType.Translation, {
       en: string;
       'en-GB': string;
       fr: string;
@@ -326,7 +326,7 @@ declare const browserContent: {
       vi: string;
       uk: string;
     }, {
-      nodeType: "translation" | _intlayer_types331.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types332.NodeType.Translation;
     } & {
       translation: {
         en: string;
@@ -356,4 +356,4 @@ declare const browserContent: {
 };
 //#endregion
 export { browserContent, browserContent as default };
-//# sourceMappingURL=browser.content.d.ts.map
+//# sourceMappingURL=Browser.content.d.ts.map

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

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

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

@@ -1,5 +1,5 @@
 import { CSSProperties, HTMLAttributes, RefObject } from "react";
-import * as react_jsx_runtime18 from "react/jsx-runtime";
+import * as react_jsx_runtime11 from "react/jsx-runtime";
 
 //#region src/components/Browser/Browser.d.ts
 type BrowserProps = {
@@ -24,7 +24,7 @@ declare const Browser: ({
   ref,
   domainRestriction,
   ...props
-}: BrowserProps) => react_jsx_runtime18.JSX.Element;
+}: BrowserProps) => react_jsx_runtime11.JSX.Element;
 //#endregion
 export { Browser, BrowserProps };
 //# sourceMappingURL=Browser.d.ts.map

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

@@ -1,5 +1,5 @@
 import { ButtonHTMLAttributes, DetailedHTMLProps, FC } from "react";
-import * as class_variance_authority_types8 from "class-variance-authority/types";
+import * as class_variance_authority_types3 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
 import { LucideIcon } from "lucide-react";
 
@@ -60,13 +60,13 @@ declare enum ButtonTextAlign {
  * Enhanced button variants with improved accessibility and focus states
  */
 declare const buttonVariants: (props?: {
-  size?: "md" | "sm" | "lg" | "xl" | "icon-sm" | "icon-md" | "icon-lg" | "icon-xl";
-  color?: "error" | "success" | "custom" | "primary" | "secondary" | "destructive" | "neutral" | "light" | "dark" | "text" | "text-inverse" | "card" | "current";
-  roundedSize?: "md" | "sm" | "lg" | "none" | "xl" | "2xl" | "3xl" | "full" | "4xl" | "5xl";
-  variant?: "default" | "input" | "invisible-link" | "hoverable" | "none" | "outline" | "link" | "fade";
-  textAlign?: "left" | "center" | "right";
+  size?: "lg" | "md" | "sm" | "xl" | "icon-sm" | "icon-md" | "icon-lg" | "icon-xl";
+  color?: "text" | "error" | "custom" | "success" | "primary" | "secondary" | "destructive" | "neutral" | "card" | "light" | "dark" | "current" | "text-inverse";
+  roundedSize?: "none" | "lg" | "md" | "sm" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "full";
+  variant?: "input" | "none" | "default" | "outline" | "link" | "invisible-link" | "hoverable" | "fade";
+  textAlign?: "left" | "right" | "center";
   isFullWidth?: boolean;
-} & class_variance_authority_types8.ClassProp) => string;
+} & class_variance_authority_types3.ClassProp) => string;
 /**
  * Enhanced Button component props with comprehensive type safety and accessibility features
  */

package/dist/types/components/Carousel/index.content.d.ts

@@ -1,11 +1,11 @@
-import * as _intlayer_types370 from "@intlayer/types";
-import * as _intlayer_core1 from "@intlayer/core";
+import * as _intlayer_types0 from "@intlayer/types";
+import * as _intlayer_core0 from "@intlayer/core";
 
 //#region src/components/Carousel/index.content.d.ts
 declare const carouselContent: {
   key: string;
   content: {
-    goToSlide: _intlayer_core1.InsertionContent<_intlayer_types370.TypedNodeModel<_intlayer_types370.NodeType.Translation, {
+    goToSlide: _intlayer_core0.InsertionContent<_intlayer_types0.TypedNodeModel<_intlayer_types0.NodeType.Translation, {
       ar: string;
       de: string;
       en: string;
@@ -25,7 +25,7 @@ declare const carouselContent: {
       vi: string;
       zh: string;
     }, {
-      nodeType: "translation" | _intlayer_types370.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types0.NodeType.Translation;
     } & {
       translation: {
         ar: string;
@@ -48,7 +48,7 @@ declare const carouselContent: {
         zh: string;
       };
     }>>;
-    previousSlide: _intlayer_types370.TypedNodeModel<_intlayer_types370.NodeType.Translation, {
+    previousSlide: _intlayer_types0.TypedNodeModel<_intlayer_types0.NodeType.Translation, {
       en: string;
       'en-GB': string;
       ru: string;
@@ -68,7 +68,7 @@ declare const carouselContent: {
       vi: string;
       uk: string;
     }, {
-      nodeType: "translation" | _intlayer_types370.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types0.NodeType.Translation;
     } & {
       translation: {
         en: string;
@@ -91,7 +91,7 @@ declare const carouselContent: {
         uk: string;
       };
     }>;
-    nextSlide: _intlayer_types370.TypedNodeModel<_intlayer_types370.NodeType.Translation, {
+    nextSlide: _intlayer_types0.TypedNodeModel<_intlayer_types0.NodeType.Translation, {
       en: string;
       'en-GB': string;
       ru: string;
@@ -111,7 +111,7 @@ declare const carouselContent: {
       vi: string;
       uk: string;
     }, {
-      nodeType: "translation" | _intlayer_types370.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types0.NodeType.Translation;
     } & {
       translation: {
         en: string;

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

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

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 react5 from "react";
+import * as react6 from "react";
 import { ComponentProps, FC, HTMLAttributes } from "react";
-import * as react_jsx_runtime13 from "react/jsx-runtime";
+import * as react_jsx_runtime12 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<react5.DetailedHTMLProps<react5.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof react5.InputHTMLAttributes<HTMLInputElement>> & {
+  Input: FC<Omit<Pick<Pick<react6.DetailedHTMLProps<react6.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof react6.InputHTMLAttributes<HTMLInputElement>> & {
     ref?: React.Ref<HTMLInputElement>;
   } & {
     asChild?: boolean;
-  }, "key" | "asChild" | keyof react5.InputHTMLAttributes<HTMLInputElement>>, "onChange" | "type" | "value"> & {
+  }, "key" | "asChild" | keyof react6.InputHTMLAttributes<HTMLInputElement>>, "onChange" | "type" | "value"> & {
     value?: string;
     onValueChange?: (search: string) => void;
-  } & react5.RefAttributes<HTMLInputElement>>;
+  } & react6.RefAttributes<HTMLInputElement>>;
   List: FC<{
     children?: React.ReactNode;
-  } & Pick<Pick<react5.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | "key"> & {
+  } & Pick<Pick<react6.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;
-  } & react5.RefAttributes<HTMLDivElement>>;
+  } & react6.RefAttributes<HTMLDivElement>>;
   Empty: FC<{
     children?: React.ReactNode;
-  } & Pick<Pick<react5.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | "key"> & {
+  } & Pick<Pick<react6.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
   } & {
     asChild?: boolean;
-  }, keyof HTMLAttributes<HTMLDivElement> | "key" | "asChild"> & react5.RefAttributes<HTMLDivElement>>;
+  }, "key" | keyof HTMLAttributes<HTMLDivElement> | "asChild"> & react6.RefAttributes<HTMLDivElement>>;
   Group: FC<{
     children?: React.ReactNode;
-  } & Omit<Pick<Pick<react5.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | "key"> & {
+  } & Omit<Pick<Pick<react6.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;
-  } & react5.RefAttributes<HTMLDivElement>>;
-  Separator: FC<Pick<Pick<react5.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | "key"> & {
+  } & react6.RefAttributes<HTMLDivElement>>;
+  Separator: FC<Pick<Pick<react6.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;
-  } & react5.RefAttributes<HTMLDivElement>>;
+  } & react6.RefAttributes<HTMLDivElement>>;
   Item: FC<{
     children?: React.ReactNode;
-  } & Omit<Pick<Pick<react5.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | "key"> & {
+  } & Omit<Pick<Pick<react6.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">, "onSelect" | "disabled" | "value"> & {
     disabled?: boolean;
     onSelect?: (value: string) => void;
     value?: string;
     keywords?: string[];
     forceMount?: boolean;
-  } & react5.RefAttributes<HTMLDivElement>>;
+  } & react6.RefAttributes<HTMLDivElement>>;
   Shortcut: ({
     className,
     ...props
-  }: HTMLAttributes<HTMLSpanElement>) => react_jsx_runtime13.JSX.Element;
+  }: HTMLAttributes<HTMLSpanElement>) => react_jsx_runtime12.JSX.Element;
   propTypes?: any;
   displayName?: string | undefined;
 };

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

@@ -1,5 +1,5 @@
 import { DetailedHTMLProps, FC, HTMLAttributes, PropsWithChildren } from "react";
-import * as class_variance_authority_types14 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/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" | "none" | "xl" | "2xl" | "3xl" | "full" | "4xl";
-  transparency?: "sm" | "md" | "lg" | "none" | "xl" | "full";
-  padding?: "sm" | "md" | "lg" | "none" | "xl" | "2xl";
-  separator?: "without" | "x" | "y" | "both";
+  roundedSize?: "none" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "full";
+  transparency?: "none" | "sm" | "md" | "lg" | "xl" | "full" | "xs";
+  padding?: "none" | "sm" | "md" | "lg" | "xl" | "2xl";
+  separator?: "both" | "without" | "x" | "y";
   border?: "with" | "none";
-  borderColor?: "error" | "success" | "text" | "primary" | "secondary" | "neutral" | "warning" | "card";
-  background?: "with" | "hoverable" | "none";
-  gap?: "sm" | "md" | "lg" | "none" | "xl" | "2xl";
-} & class_variance_authority_types14.ClassProp) => string;
+  borderColor?: "error" | "primary" | "secondary" | "neutral" | "card" | "text" | "warning" | "success";
+  background?: "with" | "none" | "hoverable";
+  gap?: "none" | "sm" | "md" | "lg" | "xl" | "2xl";
+} & class_variance_authority_types0.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;AAqFY,cArFC,iBAqFmB,EAAA,CAAA,KAuEzB,CAvEyB,EAAA;EAcpB,WAAA,CAAA,EAAA,IAAA,GAAA,IAAqB,GAAA,IAAA,GAAA,MAAA,GAAA,IAAA,GAAA,KAAA,GAAA,KAAA,GAAA,MAAA,GAAA,KAAA;EAUrB,YAAA,CAAA,EAAA,IAAgB,GAAA,IAAA,GAAA,IAAA,GAAA,MAAA,GAAA,IAAA,GAAA,MAAA;EAShB,OAAA,CAAA,EAAA,IAAA,GAAA,IAAkB,GAAA,IAAA,GAAA,MAAA,GAAA,IAAA,GAAA,KAAA;EAQlB,SAAA,CAAA,EAAA,SAAA,GAAoB,GAAA,GAAA,GAAA,GAAA,MAAA;EAYpB,MAAA,CAAA,EAAA,MAAA,GAAA,MAAmB;EAOnB,WAAA,CAAA,EAAA,OAAY,GAAA,SAAA,GAAA,MAAA,GAAA,SAAA,GAAA,WAAA,GAAA,SAAA,GAAA,SAAA,GAAA,MAAA;EAUZ,UAAA,CAAA,EAAA,MAAc,GAAA,WAAA,GAAA,MAAA;EACC,GAAA,CAAA,EAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,MAAA,GAAA,IAAA,GAAA,KAAA;CAApB,GA1EL,gCAAA,CAAA,SA0EK,EAAA,GAAA,MAAA;;AADsB,aAtEjB,oBAAA;EAyEuB,IAAA,GAAA,MAAA;EAAf,EAAA,GAAA,IAAA;EAAgC,EAAA,GAAA,IAAA;EAAlD,EAAA,GAAA,IAAA;EAAiB,EAAA,GAAA,IAAA;EAkCN,KAAA,GAAA,KAgCZ;;;;;;;aA7HW,qBAAA;;;;;;;;;aAUA,gBAAA;;;;;;;;aASA,kBAAA;;;;;;;aAQA,oBAAA;;;;;;;;;;;aAYA,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;AAsFY,cAtFC,iBAsFmB,EAAA,CAAA,KAuEzB,CAvEyB,EAAA;EAcpB,WAAA,CAAA,EAAA,MAAA,GAAA,IAAqB,GAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,KAAA,GAAA,KAAA,GAAA,KAAA,GAAA,MAAA;EAUrB,YAAA,CAAA,EAAA,MAAgB,GAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,MAAA,GAAA,IAAA;EAShB,OAAA,CAAA,EAAA,MAAA,GAAA,IAAkB,GAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,KAAA;EAQlB,SAAA,CAAA,EAAA,MAAA,GAAA,SAAoB,GAAA,GAAA,GAAA,GAAA;EAYpB,MAAA,CAAA,EAAA,MAAA,GAAA,MAAmB;EAOnB,WAAA,CAAA,EAAA,OAAY,GAAA,SAAA,GAAA,WAAA,GAAA,SAAA,GAAA,MAAA,GAAA,MAAA,GAAA,SAAA,GAAA,SAAA;EAUZ,UAAA,CAAA,EAAA,MAAc,GAAA,MAAA,GAAA,WAAA;EACC,GAAA,CAAA,EAAA,MAAA,GAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,IAAA,GAAA,KAAA;CAApB,GA1EL,+BAAA,CAAA,SA0EK,EAAA,GAAA,MAAA;;AADsB,aAtEjB,oBAAA;EAyEuB,IAAA,GAAA,MAAA;EAAf,EAAA,GAAA,IAAA;EAAgC,EAAA,GAAA,IAAA;EAAlD,EAAA,GAAA,IAAA;EAAiB,EAAA,GAAA,IAAA;EAkCN,KAAA,GAAA,KAgCZ;;;;;;;aA7HW,qBAAA;;;;;;;;;aAUA,gBAAA;;;;;;;;aASA,kBAAA;;;;;;;aAQA,oBAAA;;;;;;;;;;;aAYA,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_types382 from "@intlayer/types";
+import * as _intlayer_types356 from "@intlayer/types";
 
 //#region src/components/CopyButton/CopyButton.content.d.ts
 declare const copyContentContent: {
   key: string;
   content: {
-    label: _intlayer_types382.TypedNodeModel<_intlayer_types382.NodeType.Translation, {
+    label: _intlayer_types356.TypedNodeModel<_intlayer_types356.NodeType.Translation, {
       en: string;
       fr: string;
       es: string;
@@ -24,7 +24,7 @@ declare const copyContentContent: {
       vi: string;
       uk: string;
     }, {
-      nodeType: "translation" | _intlayer_types382.NodeType.Translation;
+      nodeType: "translation" | _intlayer_types356.NodeType.Translation;
     } & {
       translation: {
         en: string;