@intlayer/design-system 8.2.4 → 8.3.0-canary.1

package/dist/esm/components/Accordion/Accordion.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t,ButtonColor as n,ButtonVariant as r}from"../Button/Button.mjs";import{MaxHeightSmoother as i}from"../MaxHeightSmoother/index.mjs";import{ChevronDown as a}from"lucide-react";import{useId as o,useState as s}from"react";import{jsx as c,jsxs as l}from"react/jsx-runtime";const u=({children:u,header:d,isOpen:f,defaultIsOpen:p=!1,onToggle:m,onClick:h,disabled:g=!1,contentClassName:_,headerClassName:v,contentId:y,"aria-label":b,...x})=>{let S=f!==void 0,[C,w]=s(p),T=o(),E=S?f:C,D=!E,O=y??`${T}-accordion-content`,k=e=>{if(g)return;let t=!E;S||w(t),m?.(t),h?.(e)};return l(`div`,{className:`w-full`,children:[c(t,{variant:r.HOVERABLE,color:n.TEXT,onClick:k,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),k(e))},disabled:g,isFullWidth:!0,className:e(`flex items-center justify-between gap-2`,v),IconRight:a,iconClassName:e(`transform transition-transform duration-500 ease-in-out`,E?`rotate-0`:`-rotate-180`),"aria-expanded":E,"aria-controls":O,"aria-label":b,role:`button`,...x,children:d}),c(i,{id:O,tabIndex:D?-1:void 0,isHidden:D,className:_,role:`region`,"aria-labelledby":O,children:u})]})};export{u as Accordion};
+"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t,ButtonColor as n,ButtonVariant as r}from"../Button/Button.mjs";import{MaxHeightSmoother as i}from"../MaxHeightSmoother/index.mjs";import{useId as a,useState as o}from"react";import{ChevronDown as s}from"lucide-react";import{jsx as c,jsxs as l}from"react/jsx-runtime";const u=({children:u,header:d,isOpen:f,defaultIsOpen:p=!1,onToggle:m,onClick:h,disabled:g=!1,contentClassName:_,headerClassName:v,contentId:y,"aria-label":b,...x})=>{let S=f!==void 0,[C,w]=o(p),T=a(),E=S?f:C,D=!E,O=y??`${T}-accordion-content`,k=e=>{if(g)return;let t=!E;S||w(t),m?.(t),h?.(e)};return l(`div`,{className:`w-full`,children:[c(t,{variant:r.HOVERABLE,color:n.TEXT,onClick:k,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),k(e))},disabled:g,isFullWidth:!0,className:e(`flex items-center justify-between gap-2`,v),IconRight:s,iconClassName:e(`transform transition-transform duration-500 ease-in-out`,E?`rotate-0`:`-rotate-180`),"aria-expanded":E,"aria-controls":O,"aria-label":b,role:`button`,...x,children:d}),c(i,{id:O,tabIndex:D?-1:void 0,isHidden:D,className:_,role:`region`,"aria-labelledby":O,children:u})]})};export{u as Accordion};
 //# sourceMappingURL=Accordion.mjs.map

package/dist/esm/components/Avatar/index.mjs

@@ -1,2 +1,2 @@
-import{cn as e}from"../../utils/cn.mjs";import{Loader as t}from"../Loader/index.mjs";import{User as n}from"lucide-react";import{useMemo as r}from"react";import{jsx as i,jsxs as a}from"react/jsx-runtime";const o=(e,t=` `)=>e?(t===` `?e.trim().split(/\s+/):e.split(t)).filter(Boolean).map(e=>e.charAt(0).toUpperCase()):[],s=({isClickable:e,onClick:t,...n})=>e&&t?i(`button`,{...n,onClick:t,type:`button`}):i(`div`,{...n,role:n.tabIndex!==void 0||n[`aria-label`]?`img`:void 0}),c=({fullname:c,className:l,isLoading:u=!1,isLoggedIn:d=!0,src:f,onClick:p,size:m=`md`,alt:h,focusable:g=!1,..._})=>{let v=!!f,y=(c??``).length>0,b=c?o(c):void 0,x=u,S=d&&!x&&v,C=d&&!x&&!S&&y,w=d&&!x&&!S&&!C,T=p!==void 0,E=r(()=>{let e={};return S&&h?e[`aria-label`]=h:S&&c?e[`aria-label`]=`Avatar of ${c}`:C&&c?e[`aria-label`]=`Avatar initials for ${c}`:w?e[`aria-label`]=`Default user avatar`:x&&(e[`aria-label`]=`Loading avatar`,e[`aria-busy`]=!0),!T&&g&&(e.tabIndex=0),T&&(e[`aria-describedby`]=`avatar-description`),e},[S,C,w,x,h,c,T,g]);return i(s,{isClickable:T,className:e(`rounded-full border-[1.3px] border-text p-[1.5px]`,m===`sm`&&`size-7 border-[1px] p-[1px]`,m===`md`&&`size-9`,m===`lg`&&`size-12`,m===`xl`&&`size-16`,T&&`cursor-pointer hover:opacity-80 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2`,!T&&g&&`focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2`,x&&`animate-pulse`,l),onClick:p,...E,..._,children:i(`div`,{className:`relative flex size-full flex-row items-center justify-center`,children:a(`div`,{className:`absolute top-0 left-0 flex size-full flex-col items-center justify-center rounded-full bg-text text-text-opposite`,children:[x&&i(t,{className:`w-3/4`,"aria-label":`Loading user avatar`}),S&&i(`img`,{className:`size-full rounded-full object-cover`,src:f,srcSet:f,alt:h??`Avatar of ${c}`,width:59,height:59,loading:`lazy`,draggable:!1}),C&&i(`div`,{className:`flex size-full items-center justify-center gap-[0.1rem] font-bold text-sm max-md:py-1`,children:b?.map((e,t)=>i(`span`,{children:e},`${e}-${t}`))}),w&&i(n,{size:e(m===`sm`&&14,m===`md`&&25,m===`lg`&&30,m===`xl`&&40),"aria-label":`Default user icon`})]})})})};export{c as Avatar,o as getCapitals};
+import{cn as e}from"../../utils/cn.mjs";import{Loader as t}from"../Loader/index.mjs";import{useMemo as n}from"react";import{User as r}from"lucide-react";import{jsx as i,jsxs as a}from"react/jsx-runtime";const o=(e,t=` `)=>e?(t===` `?e.trim().split(/\s+/):e.split(t)).filter(Boolean).map(e=>e.charAt(0).toUpperCase()):[],s=({isClickable:e,onClick:t,...n})=>e&&t?i(`button`,{...n,onClick:t,type:`button`}):i(`div`,{...n,role:n.tabIndex!==void 0||n[`aria-label`]?`img`:void 0}),c=({fullname:c,className:l,isLoading:u=!1,isLoggedIn:d=!0,src:f,onClick:p,size:m=`md`,alt:h,focusable:g=!1,..._})=>{let v=!!f,y=(c??``).length>0,b=c?o(c):void 0,x=u,S=d&&!x&&v,C=d&&!x&&!S&&y,w=d&&!x&&!S&&!C,T=p!==void 0,E=n(()=>{let e={};return S&&h?e[`aria-label`]=h:S&&c?e[`aria-label`]=`Avatar of ${c}`:C&&c?e[`aria-label`]=`Avatar initials for ${c}`:w?e[`aria-label`]=`Default user avatar`:x&&(e[`aria-label`]=`Loading avatar`,e[`aria-busy`]=!0),!T&&g&&(e.tabIndex=0),T&&(e[`aria-describedby`]=`avatar-description`),e},[S,C,w,x,h,c,T,g]);return i(s,{isClickable:T,className:e(`rounded-full border-[1.3px] border-text p-[1.5px]`,m===`sm`&&`size-7 border-[1px] p-[1px]`,m===`md`&&`size-9`,m===`lg`&&`size-12`,m===`xl`&&`size-16`,T&&`cursor-pointer hover:opacity-80 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2`,!T&&g&&`focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2`,x&&`animate-pulse`,l),onClick:p,...E,..._,children:i(`div`,{className:`relative flex size-full flex-row items-center justify-center`,children:a(`div`,{className:`absolute top-0 left-0 flex size-full flex-col items-center justify-center rounded-full bg-text text-text-opposite`,children:[x&&i(t,{className:`w-3/4`,"aria-label":`Loading user avatar`}),S&&i(`img`,{className:`size-full rounded-full object-cover`,src:f,srcSet:f,alt:h??`Avatar of ${c}`,width:59,height:59,loading:`lazy`,draggable:!1}),C&&i(`div`,{className:`flex size-full items-center justify-center gap-[0.1rem] font-bold text-sm max-md:py-1`,children:b?.map((e,t)=>i(`span`,{children:e},`${e}-${t}`))}),w&&i(r,{size:e(m===`sm`&&14,m===`md`&&25,m===`lg`&&30,m===`xl`&&40),"aria-label":`Default user icon`})]})})})};export{c as Avatar,o as getCapitals};
 //# sourceMappingURL=index.mjs.map

package/dist/esm/components/Breadcrumb/index.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t,ButtonVariant as n}from"../Button/Button.mjs";import{Link as r,LinkColor as i}from"../Link/Link.mjs";import{ChevronRightIcon as a}from"lucide-react";import{Fragment as o,createElement as s}from"react";import{cva as c}from"class-variance-authority";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{getIntlayer as f}from"intlayer";import{useIntlayer as p}from"react-intlayer";const m=e=>e&&{[i.PRIMARY]:`text-primary`,[i.SECONDARY]:`text-secondary`,[i.DESTRUCTIVE]:`text-destructive`,[i.NEUTRAL]:`text-neutral`,[i.LIGHT]:`text-white`,[i.DARK]:`text-neutral-800`,[i.TEXT]:`text-text`,[i.TEXT_INVERSE]:`text-text-opposite`,[i.ERROR]:`text-error`,[i.SUCCESS]:`text-success`,[i.CUSTOM]:``}[e]||``,h=c(`flex flex-row flex-wrap items-center text-sm`,{variants:{size:{small:`gap-1 text-xs`,medium:`gap-2 text-sm`,large:`gap-3 text-base`},spacing:{compact:`gap-1`,normal:`gap-2`,loose:`gap-4`}},defaultVariants:{size:`medium`,spacing:`normal`}}),g=({href:e,lang:t,children:n,onClick:i,color:a,position:o,locale:s,className:c,...p})=>{let m=f(`breadcrumb`).linkLabel;return d(l,{children:[u(r,{href:e,locale:s,color:a,onClick:i,itemProp:`item`,isExternalLink:!1,itemScope:!0,itemType:`https://schema.org/WebPage`,...p,label:`${m} ${n}`,itemID:e,size:`sm`,children:u(`span`,{itemProp:`name`,children:n})}),u(`meta`,{itemProp:`position`,content:o.toString()})]})},_=({children:e,onClick:r,color:i,position:a,className:o,...s})=>{let{linkLabel:c}=p(`breadcrumb`);return d(l,{children:[u(t,{onClick:r,variant:n.LINK,label:`${c} ${e}`,color:i,itemProp:`item`,...s,children:u(`span`,{itemProp:`name`,children:e})}),u(`meta`,{itemProp:`position`,content:a.toString()})]})},v=({children:t,position:n,className:r,...i})=>d(`span`,{itemProp:`item`,className:e(`inline-flex items-center`,`font-medium text-neutral-700`,`transition-colors duration-200`,r),children:[u(`span`,{itemProp:`name`,...i,children:t}),u(`meta`,{itemProp:`position`,content:n.toString()})]}),y=({links:t,className:n,color:r=i.TEXT,locale:c,elementType:l=`page`,separator:f=u(a,{size:10}),ariaLabel:p=`breadcrumb`,includeStructuredData:y=!0,maxItems:b,size:x,spacing:S,...C})=>{let w=b&&t.length>b?[...t.slice(0,1),`...`,...t.slice(-(b-2))]:t;return u(`nav`,{"aria-label":p,children:u(`ol`,{className:e(h({size:x,spacing:S}),n),...y&&{itemScope:!0,itemType:`http://schema.org/BreadcrumbList`},...C,children:w.map((t,n)=>{let i=n===w.length-1,a=typeof t==`object`&&typeof t.href==`string`,p=typeof t==`object`&&typeof t.onClick==`function`,h=n===w.length-1,b=h?l:void 0,x=t===`...`,S=t.text??t,C=m(r);if(x)return d(o,{children:[u(`li`,{className:`flex items-center`,"aria-hidden":`true`,children:u(`span`,{className:`text-neutral-500`,children:`…`})}),!i&&u(`li`,{"aria-hidden":`true`,className:`flex items-center`,children:u(`span`,{className:e(C),children:f})})]},`truncated-${S}`);let T=u(v,{position:n+1,"aria-current":b,className:e(`transition-colors duration-200`,h&&`text-neutral-900`),children:S},S);a?T=u(g,{href:t.href,color:r,position:n+1,locale:c,"aria-current":b,className:e(h&&`cursor-default text-neutral-900`),children:S},S):p&&(T=u(_,{onClick:t.onClick,color:r,position:n+1,"aria-current":b,className:e(h&&`cursor-default text-neutral-900`),children:S},S));let E=s(`li`,{...y&&{itemProp:`itemListElement`,itemScope:!0,itemType:`https://schema.org/ListItem`},key:S,className:`flex items-center`},T);return i?E:d(o,{children:[E,u(`li`,{"aria-hidden":`true`,className:`flex items-center`,children:u(`span`,{className:e(C),children:f})})]},S)})})})};export{y as Breadcrumb};
+"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t,ButtonVariant as n}from"../Button/Button.mjs";import{Link as r,LinkColor as i}from"../Link/Link.mjs";import{Fragment as a,createElement as o}from"react";import{cva as s}from"class-variance-authority";import{ChevronRightIcon as c}from"lucide-react";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{getIntlayer as f}from"intlayer";import{useIntlayer as p}from"react-intlayer";const m=e=>e&&{[i.PRIMARY]:`text-primary`,[i.SECONDARY]:`text-secondary`,[i.DESTRUCTIVE]:`text-destructive`,[i.NEUTRAL]:`text-neutral`,[i.LIGHT]:`text-white`,[i.DARK]:`text-neutral-800`,[i.TEXT]:`text-text`,[i.TEXT_INVERSE]:`text-text-opposite`,[i.ERROR]:`text-error`,[i.SUCCESS]:`text-success`,[i.CUSTOM]:``}[e]||``,h=s(`flex flex-row flex-wrap items-center text-sm`,{variants:{size:{small:`gap-1 text-xs`,medium:`gap-2 text-sm`,large:`gap-3 text-base`},spacing:{compact:`gap-1`,normal:`gap-2`,loose:`gap-4`}},defaultVariants:{size:`medium`,spacing:`normal`}}),g=({href:e,lang:t,children:n,onClick:i,color:a,position:o,locale:s,className:c,...p})=>{let m=f(`breadcrumb`).linkLabel;return d(l,{children:[u(r,{href:e,locale:s,color:a,onClick:i,itemProp:`item`,isExternalLink:!1,itemScope:!0,itemType:`https://schema.org/WebPage`,...p,label:`${m} ${n}`,itemID:e,size:`sm`,children:u(`span`,{itemProp:`name`,children:n})}),u(`meta`,{itemProp:`position`,content:o.toString()})]})},_=({children:e,onClick:r,color:i,position:a,className:o,...s})=>{let{linkLabel:c}=p(`breadcrumb`);return d(l,{children:[u(t,{onClick:r,variant:n.LINK,label:`${c} ${e}`,color:i,itemProp:`item`,...s,children:u(`span`,{itemProp:`name`,children:e})}),u(`meta`,{itemProp:`position`,content:a.toString()})]})},v=({children:t,position:n,className:r,...i})=>d(`span`,{itemProp:`item`,className:e(`inline-flex items-center`,`font-medium text-neutral-700`,`transition-colors duration-200`,r),children:[u(`span`,{itemProp:`name`,...i,children:t}),u(`meta`,{itemProp:`position`,content:n.toString()})]}),y=({links:t,className:n,color:r=i.TEXT,locale:s,elementType:l=`page`,separator:f=u(c,{size:10}),ariaLabel:p=`breadcrumb`,includeStructuredData:y=!0,maxItems:b,size:x,spacing:S,...C})=>{let w=b&&t.length>b?[...t.slice(0,1),`...`,...t.slice(-(b-2))]:t;return u(`nav`,{"aria-label":p,children:u(`ol`,{className:e(h({size:x,spacing:S}),n),...y&&{itemScope:!0,itemType:`http://schema.org/BreadcrumbList`},...C,children:w.map((t,n)=>{let i=n===w.length-1,c=typeof t==`object`&&typeof t.href==`string`,p=typeof t==`object`&&typeof t.onClick==`function`,h=n===w.length-1,b=h?l:void 0,x=t===`...`,S=t.text??t,C=m(r);if(x)return d(a,{children:[u(`li`,{className:`flex items-center`,"aria-hidden":`true`,children:u(`span`,{className:`text-neutral-500`,children:`…`})}),!i&&u(`li`,{"aria-hidden":`true`,className:`flex items-center`,children:u(`span`,{className:e(C),children:f})})]},`truncated-${S}`);let T=u(v,{position:n+1,"aria-current":b,className:e(`transition-colors duration-200`,h&&`text-neutral-900`),children:S},S);c?T=u(g,{href:t.href,color:r,position:n+1,locale:s,"aria-current":b,className:e(h&&`cursor-default text-neutral-900`),children:S},S):p&&(T=u(_,{onClick:t.onClick,color:r,position:n+1,"aria-current":b,className:e(h&&`cursor-default text-neutral-900`),children:S},S));let E=o(`li`,{...y&&{itemProp:`itemListElement`,itemScope:!0,itemType:`https://schema.org/ListItem`},key:S,className:`flex items-center`},T);return i?E:d(a,{children:[E,u(`li`,{"aria-hidden":`true`,className:`flex items-center`,children:u(`span`,{className:e(C),children:f})})]},S)})})})};export{y as Breadcrumb};
 //# sourceMappingURL=index.mjs.map

package/dist/esm/components/Breadcrumb/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/Breadcrumb/index.tsx"],"sourcesContent":["'use client';\n\nimport type { LocalesValues } from '@intlayer/types';\nimport { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { getIntlayer } from 'intlayer';\nimport { ChevronRightIcon } from 'lucide-react';\nimport { type FC, Fragment, type HTMLAttributes, type ReactNode } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button, type ButtonProps, ButtonVariant } from '../Button';\nimport { Link, LinkColor } from '../Link';\n\n/**\n * Props for LinkLink sub-component that renders breadcrumb items as links\n */\ntype LinkLinkProps = {\n  /**\n   * Position of the breadcrumb item in the list (1-based index)\n   */\n  position: number;\n  /**\n   * Locale for internationalization\n   */\n  locale?: LocalesValues;\n  /**\n   * URL to navigate to\n   */\n  href?: string;\n  /**\n   * Link color\n   */\n  color?: LinkColor | `${LinkColor}`;\n  /**\n   * Click handler\n   */\n  onClick?: () => void;\n  /**\n   * Children content\n   */\n  children?: string;\n  /**\n   * Additional CSS classes\n   */\n  className?: string;\n} & Omit<\n  HTMLAttributes<HTMLAnchorElement>,\n  'href' | 'onClick' | 'color' | 'children' | 'className'\n>;\n\n/**\n * Maps LinkColor to corresponding Tailwind text color classes\n */\nconst getColorClass = (color?: LinkColor | `${LinkColor}`): string => {\n  if (!color) return '';\n\n  const colorMap: Record<LinkColor, string> = {\n    [LinkColor.PRIMARY]: 'text-primary',\n    [LinkColor.SECONDARY]: 'text-secondary',\n    [LinkColor.DESTRUCTIVE]: 'text-destructive',\n    [LinkColor.NEUTRAL]: 'text-neutral',\n    [LinkColor.LIGHT]: 'text-white',\n    [LinkColor.DARK]: 'text-neutral-800',\n    [LinkColor.TEXT]: 'text-text',\n    [LinkColor.TEXT_INVERSE]: 'text-text-opposite',\n    [LinkColor.ERROR]: 'text-error',\n    [LinkColor.SUCCESS]: 'text-success',\n    [LinkColor.CUSTOM]: '',\n  };\n\n  return colorMap[color as LinkColor] || '';\n};\n\n/**\n * Breadcrumb variant styles using class-variance-authority\n */\nconst breadcrumbVariants = cva('flex flex-row flex-wrap items-center text-sm', {\n  variants: {\n    size: {\n      small: 'gap-1 text-xs',\n      medium: 'gap-2 text-sm',\n      large: 'gap-3 text-base',\n    },\n    spacing: {\n      compact: 'gap-1',\n      normal: 'gap-2',\n      loose: 'gap-4',\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n    spacing: 'normal',\n  },\n});\n\n/**\n * LinkLink sub-component for breadcrumb items that navigate to other pages\n */\nconst LinkLink: FC<LinkLinkProps> = ({\n  href,\n  lang,\n  children,\n  onClick,\n  color,\n  position,\n  locale,\n  className,\n  ...props\n}) => {\n  const content = getIntlayer('breadcrumb');\n  const linkLabel = content.linkLabel;\n\n  return (\n    <>\n      <Link\n        href={href}\n        locale={locale}\n        color={color}\n        onClick={onClick}\n        itemProp=\"item\"\n        isExternalLink={false}\n        itemScope\n        itemType=\"https://schema.org/WebPage\"\n        {...props}\n        label={`${linkLabel} ${children}`}\n        itemID={href}\n        size=\"sm\"\n      >\n        <span itemProp=\"name\">{children}</span>\n      </Link>\n      <meta itemProp=\"position\" content={position.toString()} />\n    </>\n  );\n};\n\n/**\n * Props for ButtonLink sub-component that renders breadcrumb items as interactive buttons\n */\ntype ButtonButtonProps = {\n  /**\n   * Text content for the breadcrumb button\n   */\n  children: string;\n  /**\n   * Position of the breadcrumb item in the list (1-based index)\n   */\n  position: number;\n} & Omit<ButtonProps, 'children' | 'label'>;\n\n/**\n * ButtonLink sub-component for breadcrumb items with click handlers\n */\nconst ButtonLink: FC<ButtonButtonProps> = ({\n  children: text,\n  onClick,\n  color,\n  position,\n  className,\n  ...props\n}) => {\n  const { linkLabel } = useIntlayer('breadcrumb');\n\n  return (\n    <>\n      <Button\n        onClick={onClick}\n        variant={ButtonVariant.LINK}\n        label={`${linkLabel} ${text}`}\n        color={color}\n        itemProp=\"item\"\n        {...props}\n      >\n        <span itemProp=\"name\">{text}</span>\n      </Button>\n      <meta itemProp=\"position\" content={position.toString()} />\n    </>\n  );\n};\n\n/**\n * Props for Span sub-component that renders static breadcrumb text\n */\ntype SpanProps = {\n  /**\n   * Text content for the static breadcrumb item\n   */\n  children: string;\n  /**\n   * Position of the breadcrumb item in the list (1-based index)\n   */\n  position: number;\n} & HTMLAttributes<HTMLSpanElement>;\n\n/**\n * Span sub-component for static breadcrumb text items\n */\nconst Span: FC<SpanProps> = ({ children, position, className, ...props }) => (\n  <span\n    itemProp=\"item\"\n    className={cn(\n      'inline-flex items-center',\n      'font-medium text-neutral-700',\n      'transition-colors duration-200',\n      className\n    )}\n  >\n    <span itemProp=\"name\" {...props}>\n      {children}\n    </span>\n    <meta itemProp=\"position\" content={position.toString()} />\n  </span>\n);\n\n/**\n * Detailed breadcrumb link configuration with optional href or onClick\n */\ntype DetailedBreadcrumbLink = {\n  /**\n   * URL to navigate to when the breadcrumb item is clicked\n   */\n  href?: string;\n  /**\n   * Text content to display for this breadcrumb item\n   */\n  text: string;\n  /**\n   * Custom click handler function for interactive breadcrumb items\n   */\n  onClick?: () => void;\n};\n\n/**\n * Union type representing different breadcrumb item configurations:\n * - string: Simple text breadcrumb item\n * - DetailedBreadcrumbLink: Object with href, text, and/or onClick properties\n */\nexport type BreadcrumbLink = string | DetailedBreadcrumbLink;\n\nexport type BreadcrumbProps = {\n  /**\n   * Array of breadcrumb items\n   */\n  links: BreadcrumbLink[];\n  /**\n   * Color scheme for breadcrumb links\n   * @default LinkColor.TEXT\n   */\n  color?: LinkColor | `${LinkColor}`;\n  /**\n   * Locale for internationalization\n   */\n  locale?: LocalesValues;\n  /**\n   * Element type for ARIA current attribute\n   * @default 'page'\n   */\n  elementType?: 'page' | 'location';\n  /**\n   * Custom separator between breadcrumb items\n   * @default ChevronRightIcon\n   */\n  separator?: ReactNode;\n  /**\n   * ARIA label for breadcrumb navigation\n   * @default 'breadcrumb'\n   */\n  ariaLabel?: string;\n  /**\n   * Whether to include structured data markup\n   * @default true\n   */\n  includeStructuredData?: boolean;\n  /**\n   * Maximum number of breadcrumb items to show before truncation\n   */\n  maxItems?: number;\n} & VariantProps<typeof breadcrumbVariants> &\n  HTMLAttributes<HTMLOListElement>;\n\n/**\n * Breadcrumb component providing navigational context with accessibility features\n *\n * Features:\n * - Supports links, buttons, and static text elements\n * - Full keyboard navigation support\n * - ARIA attributes for screen readers\n * - Schema.org structured data for SEO\n * - Customizable separators and styling\n * - Internationalization support\n * - Responsive design variants\n *\n * @example\n * ```tsx\n * <Breadcrumb\n *   links={[\n *     'Home',\n *     { href: '/products', text: 'Products' },\n *     { onClick: handleCategory, text: 'Electronics' },\n *     'Smartphones'\n *   ]}\n *   size=\"medium\"\n *   ariaLabel=\"Product navigation\"\n * />\n * ```\n */\nexport const Breadcrumb: FC<BreadcrumbProps> = ({\n  links,\n  className,\n  color = LinkColor.TEXT,\n  locale,\n  elementType = 'page',\n  separator = <ChevronRightIcon size={10} />,\n  ariaLabel = 'breadcrumb',\n  includeStructuredData = true,\n  maxItems,\n  size,\n  spacing,\n  ...props\n}) => {\n  const displayLinks =\n    maxItems && links.length > maxItems\n      ? [...links.slice(0, 1), '...', ...links.slice(-(maxItems - 2))]\n      : links;\n\n  return (\n    <nav aria-label={ariaLabel}>\n      <ol\n        className={cn(breadcrumbVariants({ size, spacing }), className)}\n        {...(includeStructuredData && {\n          itemScope: true,\n          itemType: 'http://schema.org/BreadcrumbList',\n        })}\n        {...props}\n      >\n        {displayLinks.map((link, index) => {\n          const isLastLink = index === displayLinks.length - 1;\n          const isLink =\n            typeof link === 'object' && typeof link.href === 'string';\n          const isButton =\n            typeof link === 'object' && typeof link.onClick === 'function';\n          const isActive = index === displayLinks.length - 1;\n          const ariaCurrent = isActive ? elementType : undefined;\n          const isTruncated = link === '...';\n\n          const text = (link as DetailedBreadcrumbLink).text ?? link;\n\n          const separatorColorClass = getColorClass(color);\n\n          if (isTruncated) {\n            return (\n              <Fragment key={`truncated-${text}`}>\n                <li className=\"flex items-center\" aria-hidden=\"true\">\n                  <span className=\"text-neutral-500\">…</span>\n                </li>\n                {!isLastLink && (\n                  <li aria-hidden=\"true\" className=\"flex items-center\">\n                    <span className={cn(separatorColorClass)}>{separator}</span>\n                  </li>\n                )}\n              </Fragment>\n            );\n          }\n\n          let section = (\n            <Span\n              key={text}\n              position={index + 1}\n              aria-current={ariaCurrent}\n              className={cn(\n                'transition-colors duration-200',\n                isActive && 'text-neutral-900'\n              )}\n            >\n              {text}\n            </Span>\n          );\n\n          if (isLink) {\n            section = (\n              <LinkLink\n                key={text}\n                href={link.href!}\n                color={color}\n                position={index + 1}\n                locale={locale}\n                aria-current={ariaCurrent}\n                className={cn(isActive && 'cursor-default text-neutral-900')}\n              >\n                {text}\n              </LinkLink>\n            );\n          } else if (isButton) {\n            section = (\n              <ButtonLink\n                key={text}\n                onClick={link.onClick!}\n                color={color}\n                position={index + 1}\n                aria-current={ariaCurrent}\n                className={cn(isActive && 'cursor-default text-neutral-900')}\n              >\n                {text}\n              </ButtonLink>\n            );\n          }\n\n          const listElement = (\n            <li\n              {...(includeStructuredData && {\n                itemProp: 'itemListElement',\n                itemScope: true,\n                itemType: 'https://schema.org/ListItem',\n              })}\n              key={text}\n              className=\"flex items-center\"\n            >\n              {section}\n            </li>\n          );\n\n          if (isLastLink) {\n            return listElement;\n          }\n\n          return (\n            <Fragment key={text}>\n              {listElement}\n              <li aria-hidden=\"true\" className=\"flex items-center\">\n                <span className={cn(separatorColorClass)}>{separator}</span>\n              </li>\n            </Fragment>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/Breadcrumb/index.tsx"],"sourcesContent":["'use client';\n\nimport type { LocalesValues } from '@intlayer/types/module_augmentation';\nimport { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { getIntlayer } from 'intlayer';\nimport { ChevronRightIcon } from 'lucide-react';\nimport { type FC, Fragment, type HTMLAttributes, type ReactNode } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button, type ButtonProps, ButtonVariant } from '../Button';\nimport { Link, LinkColor } from '../Link';\n\n/**\n * Props for LinkLink sub-component that renders breadcrumb items as links\n */\ntype LinkLinkProps = {\n  /**\n   * Position of the breadcrumb item in the list (1-based index)\n   */\n  position: number;\n  /**\n   * Locale for internationalization\n   */\n  locale?: LocalesValues;\n  /**\n   * URL to navigate to\n   */\n  href?: string;\n  /**\n   * Link color\n   */\n  color?: LinkColor | `${LinkColor}`;\n  /**\n   * Click handler\n   */\n  onClick?: () => void;\n  /**\n   * Children content\n   */\n  children?: string;\n  /**\n   * Additional CSS classes\n   */\n  className?: string;\n} & Omit<\n  HTMLAttributes<HTMLAnchorElement>,\n  'href' | 'onClick' | 'color' | 'children' | 'className'\n>;\n\n/**\n * Maps LinkColor to corresponding Tailwind text color classes\n */\nconst getColorClass = (color?: LinkColor | `${LinkColor}`): string => {\n  if (!color) return '';\n\n  const colorMap: Record<LinkColor, string> = {\n    [LinkColor.PRIMARY]: 'text-primary',\n    [LinkColor.SECONDARY]: 'text-secondary',\n    [LinkColor.DESTRUCTIVE]: 'text-destructive',\n    [LinkColor.NEUTRAL]: 'text-neutral',\n    [LinkColor.LIGHT]: 'text-white',\n    [LinkColor.DARK]: 'text-neutral-800',\n    [LinkColor.TEXT]: 'text-text',\n    [LinkColor.TEXT_INVERSE]: 'text-text-opposite',\n    [LinkColor.ERROR]: 'text-error',\n    [LinkColor.SUCCESS]: 'text-success',\n    [LinkColor.CUSTOM]: '',\n  };\n\n  return colorMap[color as LinkColor] || '';\n};\n\n/**\n * Breadcrumb variant styles using class-variance-authority\n */\nconst breadcrumbVariants = cva('flex flex-row flex-wrap items-center text-sm', {\n  variants: {\n    size: {\n      small: 'gap-1 text-xs',\n      medium: 'gap-2 text-sm',\n      large: 'gap-3 text-base',\n    },\n    spacing: {\n      compact: 'gap-1',\n      normal: 'gap-2',\n      loose: 'gap-4',\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n    spacing: 'normal',\n  },\n});\n\n/**\n * LinkLink sub-component for breadcrumb items that navigate to other pages\n */\nconst LinkLink: FC<LinkLinkProps> = ({\n  href,\n  lang,\n  children,\n  onClick,\n  color,\n  position,\n  locale,\n  className,\n  ...props\n}) => {\n  const content = getIntlayer('breadcrumb');\n  const linkLabel = content.linkLabel;\n\n  return (\n    <>\n      <Link\n        href={href}\n        locale={locale}\n        color={color}\n        onClick={onClick}\n        itemProp=\"item\"\n        isExternalLink={false}\n        itemScope\n        itemType=\"https://schema.org/WebPage\"\n        {...props}\n        label={`${linkLabel} ${children}`}\n        itemID={href}\n        size=\"sm\"\n      >\n        <span itemProp=\"name\">{children}</span>\n      </Link>\n      <meta itemProp=\"position\" content={position.toString()} />\n    </>\n  );\n};\n\n/**\n * Props for ButtonLink sub-component that renders breadcrumb items as interactive buttons\n */\ntype ButtonButtonProps = {\n  /**\n   * Text content for the breadcrumb button\n   */\n  children: string;\n  /**\n   * Position of the breadcrumb item in the list (1-based index)\n   */\n  position: number;\n} & Omit<ButtonProps, 'children' | 'label'>;\n\n/**\n * ButtonLink sub-component for breadcrumb items with click handlers\n */\nconst ButtonLink: FC<ButtonButtonProps> = ({\n  children: text,\n  onClick,\n  color,\n  position,\n  className,\n  ...props\n}) => {\n  const { linkLabel } = useIntlayer('breadcrumb');\n\n  return (\n    <>\n      <Button\n        onClick={onClick}\n        variant={ButtonVariant.LINK}\n        label={`${linkLabel} ${text}`}\n        color={color}\n        itemProp=\"item\"\n        {...props}\n      >\n        <span itemProp=\"name\">{text}</span>\n      </Button>\n      <meta itemProp=\"position\" content={position.toString()} />\n    </>\n  );\n};\n\n/**\n * Props for Span sub-component that renders static breadcrumb text\n */\ntype SpanProps = {\n  /**\n   * Text content for the static breadcrumb item\n   */\n  children: string;\n  /**\n   * Position of the breadcrumb item in the list (1-based index)\n   */\n  position: number;\n} & HTMLAttributes<HTMLSpanElement>;\n\n/**\n * Span sub-component for static breadcrumb text items\n */\nconst Span: FC<SpanProps> = ({ children, position, className, ...props }) => (\n  <span\n    itemProp=\"item\"\n    className={cn(\n      'inline-flex items-center',\n      'font-medium text-neutral-700',\n      'transition-colors duration-200',\n      className\n    )}\n  >\n    <span itemProp=\"name\" {...props}>\n      {children}\n    </span>\n    <meta itemProp=\"position\" content={position.toString()} />\n  </span>\n);\n\n/**\n * Detailed breadcrumb link configuration with optional href or onClick\n */\ntype DetailedBreadcrumbLink = {\n  /**\n   * URL to navigate to when the breadcrumb item is clicked\n   */\n  href?: string;\n  /**\n   * Text content to display for this breadcrumb item\n   */\n  text: string;\n  /**\n   * Custom click handler function for interactive breadcrumb items\n   */\n  onClick?: () => void;\n};\n\n/**\n * Union type representing different breadcrumb item configurations:\n * - string: Simple text breadcrumb item\n * - DetailedBreadcrumbLink: Object with href, text, and/or onClick properties\n */\nexport type BreadcrumbLink = string | DetailedBreadcrumbLink;\n\nexport type BreadcrumbProps = {\n  /**\n   * Array of breadcrumb items\n   */\n  links: BreadcrumbLink[];\n  /**\n   * Color scheme for breadcrumb links\n   * @default LinkColor.TEXT\n   */\n  color?: LinkColor | `${LinkColor}`;\n  /**\n   * Locale for internationalization\n   */\n  locale?: LocalesValues;\n  /**\n   * Element type for ARIA current attribute\n   * @default 'page'\n   */\n  elementType?: 'page' | 'location';\n  /**\n   * Custom separator between breadcrumb items\n   * @default ChevronRightIcon\n   */\n  separator?: ReactNode;\n  /**\n   * ARIA label for breadcrumb navigation\n   * @default 'breadcrumb'\n   */\n  ariaLabel?: string;\n  /**\n   * Whether to include structured data markup\n   * @default true\n   */\n  includeStructuredData?: boolean;\n  /**\n   * Maximum number of breadcrumb items to show before truncation\n   */\n  maxItems?: number;\n} & VariantProps<typeof breadcrumbVariants> &\n  HTMLAttributes<HTMLOListElement>;\n\n/**\n * Breadcrumb component providing navigational context with accessibility features\n *\n * Features:\n * - Supports links, buttons, and static text elements\n * - Full keyboard navigation support\n * - ARIA attributes for screen readers\n * - Schema.org structured data for SEO\n * - Customizable separators and styling\n * - Internationalization support\n * - Responsive design variants\n *\n * @example\n * ```tsx\n * <Breadcrumb\n *   links={[\n *     'Home',\n *     { href: '/products', text: 'Products' },\n *     { onClick: handleCategory, text: 'Electronics' },\n *     'Smartphones'\n *   ]}\n *   size=\"medium\"\n *   ariaLabel=\"Product navigation\"\n * />\n * ```\n */\nexport const Breadcrumb: FC<BreadcrumbProps> = ({\n  links,\n  className,\n  color = LinkColor.TEXT,\n  locale,\n  elementType = 'page',\n  separator = <ChevronRightIcon size={10} />,\n  ariaLabel = 'breadcrumb',\n  includeStructuredData = true,\n  maxItems,\n  size,\n  spacing,\n  ...props\n}) => {\n  const displayLinks =\n    maxItems && links.length > maxItems\n      ? [...links.slice(0, 1), '...', ...links.slice(-(maxItems - 2))]\n      : links;\n\n  return (\n    <nav aria-label={ariaLabel}>\n      <ol\n        className={cn(breadcrumbVariants({ size, spacing }), className)}\n        {...(includeStructuredData && {\n          itemScope: true,\n          itemType: 'http://schema.org/BreadcrumbList',\n        })}\n        {...props}\n      >\n        {displayLinks.map((link, index) => {\n          const isLastLink = index === displayLinks.length - 1;\n          const isLink =\n            typeof link === 'object' && typeof link.href === 'string';\n          const isButton =\n            typeof link === 'object' && typeof link.onClick === 'function';\n          const isActive = index === displayLinks.length - 1;\n          const ariaCurrent = isActive ? elementType : undefined;\n          const isTruncated = link === '...';\n\n          const text = (link as DetailedBreadcrumbLink).text ?? link;\n\n          const separatorColorClass = getColorClass(color);\n\n          if (isTruncated) {\n            return (\n              <Fragment key={`truncated-${text}`}>\n                <li className=\"flex items-center\" aria-hidden=\"true\">\n                  <span className=\"text-neutral-500\">…</span>\n                </li>\n                {!isLastLink && (\n                  <li aria-hidden=\"true\" className=\"flex items-center\">\n                    <span className={cn(separatorColorClass)}>{separator}</span>\n                  </li>\n                )}\n              </Fragment>\n            );\n          }\n\n          let section = (\n            <Span\n              key={text}\n              position={index + 1}\n              aria-current={ariaCurrent}\n              className={cn(\n                'transition-colors duration-200',\n                isActive && 'text-neutral-900'\n              )}\n            >\n              {text}\n            </Span>\n          );\n\n          if (isLink) {\n            section = (\n              <LinkLink\n                key={text}\n                href={link.href!}\n                color={color}\n                position={index + 1}\n                locale={locale}\n                aria-current={ariaCurrent}\n                className={cn(isActive && 'cursor-default text-neutral-900')}\n              >\n                {text}\n              </LinkLink>\n            );\n          } else if (isButton) {\n            section = (\n              <ButtonLink\n                key={text}\n                onClick={link.onClick!}\n                color={color}\n                position={index + 1}\n                aria-current={ariaCurrent}\n                className={cn(isActive && 'cursor-default text-neutral-900')}\n              >\n                {text}\n              </ButtonLink>\n            );\n          }\n\n          const listElement = (\n            <li\n              {...(includeStructuredData && {\n                itemProp: 'itemListElement',\n                itemScope: true,\n                itemType: 'https://schema.org/ListItem',\n              })}\n              key={text}\n              className=\"flex items-center\"\n            >\n              {section}\n            </li>\n          );\n\n          if (isLastLink) {\n            return listElement;\n          }\n\n          return (\n            <Fragment key={text}>\n              {listElement}\n              <li aria-hidden=\"true\" className=\"flex items-center\">\n                <span className={cn(separatorColorClass)}>{separator}</span>\n              </li>\n            </Fragment>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n};\n"],"mappings":"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"}

package/dist/esm/components/Browser/Browser.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t}from"../Button/Button.mjs";import{Input as n,inputVariants as r}from"../Input/Input.mjs";import{ArrowLeft as i,ArrowRight as a,RotateCw as o}from"lucide-react";import{useEffect as s,useImperativeHandle as c,useRef as l,useState as u}from"react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{useIntlayer as p}from"react-intlayer";const m=({initialUrl:m=`https://example.com`,path:h,className:g,style:_,size:v=`md`,"aria-label":y,sandbox:b=`allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-downloads`,ref:x,domainRestriction:S,...C})=>{let[w,T]=u(m),[E,D]=u(m),[O,k]=u([m]),[A,j]=u(0),[M,N]=u(null),[P,F]=u(!1),I=l(null);c(x,()=>I.current,[]);let L=p(`browser`);s(()=>{T(m),D(m),k([m]),j(0),N(null),F(!1)},[m]),s(()=>{if(h)try{let e=S??m,t=`${new URL(e).origin}${h}`;T(t);let n=!1;if(I.current?.contentWindow)try{let e=I.current.contentWindow.location.href;new URL(e).href===new URL(t).href&&(n=!0)}catch{}O[A]!==t&&(k(e=>{let n=e.slice(0,A+1);return n.push(t),n}),j(e=>e+1)),n||D(t),N(null)}catch{}},[h,S,m]);let R=e=>{try{let t=G(e);if(t===E){H();return}D(t),T(t),N(null);let n=O.slice(0,A+1);n.push(t),k(n),j(n.length-1)}catch(e){e instanceof Error&&e.message===`URL does not match allowed domain`&&S?N(L.domainRestrictionError?.value??`Only URLs from ${S} are allowed.`):N(L.errorMessage.value)}},z=()=>{if(A>0){let e=A-1,t=O[e];j(e),D(t),T(t),N(null)}},B=()=>{if(A<O.length-1){let e=A+1,t=O[e];j(e),D(t),T(t),N(null)}},V=e=>{e.preventDefault(),F(!0),R(w)},H=()=>{if(I.current){let e=I.current.src;I.current.src=``,setTimeout(()=>{I.current&&(I.current.src=e)},50)}},U=e=>e===`localhost`||/^(\d{1,3}\.){3}\d{1,3}$/.test(e)||/^[a-f0-9:]+$/i.test(e)?!0:!(!/^[a-z0-9.-]+$/i.test(e)||/^[-.]/.test(e)||/[-.]$/.test(e)||e.includes(`..`)||!e.includes(`.`)),W=()=>{if(!S)return null;try{return new URL(S)}catch{return null}},G=e=>{let t=e.trim();if(!t||/\s/.test(t))throw Error(`Invalid`);let n=W();if(t.startsWith(`/`)&&!t.startsWith(`//`))return n?new URL(`${n.origin}${t}`).toString():new URL(`${new URL(E).origin}${t}`).toString();let r=/^[a-zA-Z][a-zA-Z0-9+.-]*:/.test(t)?t:`https://${t}`,i=new URL(r);if(i.protocol!==`http:`&&i.protocol!==`https:`)throw Error(`Only http(s) is allowed`);if(!U(i.hostname))throw Error(`Invalid host`);if(n&&!(i.hostname===n.hostname&&i.protocol===n.protocol&&(n.port===``||i.port===n.port||i.host===n.host)))throw Error(`URL does not match allowed domain`);return i.toString()},K=P&&!!M,q=A>0,J=A<O.length-1;return f(`section`,{className:e(`flex w-full flex-col overflow-hidden rounded-xl bg-background shadow-[0_4px_12px_rgba(0,0,0,0.4),0_0_1px_rgba(0,0,0,0.2)]`,g),style:_,"aria-label":y??L.ariaLabel.value,children:[f(`div`,{className:`relative z-10 flex shrink-0 items-center gap-3 rounded-t-xl bg-text/15 px-4 py-2`,children:[f(`div`,{className:`flex items-center gap-1`,children:[d(t,{type:`button`,onClick:z,disabled:!q,variant:`hoverable`,size:`icon-md`,label:L.backButtonLabel.value,Icon:i}),d(t,{type:`button`,onClick:B,disabled:!J,variant:`hoverable`,size:`icon-md`,label:L.forwardButtonLabel.value,Icon:a})]}),f(`form`,{onSubmit:V,noValidate:!0,className:e(r(),`flex w-full gap-2 rounded-xl p-0.5! supports-[corner-shape:squircle]:rounded-2xl`,`bg-neutral/10 text-text/50 placeholder:text-neutral/80`),children:[d(`label`,{htmlFor:`browser-url`,className:`sr-only`,children:L.urlLabel.value}),d(n,{id:`browser-url`,type:`text`,inputMode:`url`,spellCheck:!1,autoCapitalize:`off`,variant:`invisible`,className:`ml-3 p-0!`,size:`sm`,autoCorrect:`off`,value:w,onChange:e=>{T(e.target.value),K&&N(null)},placeholder:L.urlPlaceholder.value,"aria-label":L.urlLabel.value,"aria-invalid":K,"aria-describedby":K?`browser-url-error`:void 0}),d(t,{type:`button`,onClick:H,variant:`hoverable`,size:`icon-md`,className:`p-1!`,label:`content.reloadButtonTitle.value`,Icon:o}),d(`button`,{type:`submit`,className:`sr-only absolute`,tabIndex:-1})]}),K&&d(`div`,{className:`absolute top-full left-4 z-20 mt-1`,children:d(`p`,{id:`browser-url-error`,role:`alert`,"aria-live":`assertive`,className:`rounded-md bg-red-900/90 px-3 py-1.5 text-red-100 text-xs shadow-md backdrop-blur-sm`,children:M})})]}),d(`div`,{className:`relative z-0 flex min-h-0 w-full flex-1 flex-col overflow-hidden rounded-b-xl bg-background`,children:d(`iframe`,{ref:I,src:E,title:L.iframeTitle.value,className:`size-full flex-1`,sandbox:b,loading:`lazy`,"aria-live":`polite`,...C})})]})};export{m as Browser};
+"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t}from"../Button/Button.mjs";import{Input as n,inputVariants as r}from"../Input/Input.mjs";import{useEffect as i,useImperativeHandle as a,useRef as o,useState as s}from"react";import{ArrowLeft as c,ArrowRight as l,RotateCw as u}from"lucide-react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{useIntlayer as p}from"react-intlayer";const m=({initialUrl:m=`https://example.com`,path:h,className:g,style:_,size:v=`md`,"aria-label":y,sandbox:b=`allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-downloads`,ref:x,domainRestriction:S,...C})=>{let[w,T]=s(m),[E,D]=s(m),[O,k]=s([m]),[A,j]=s(0),[M,N]=s(null),[P,F]=s(!1),I=o(null);a(x,()=>I.current,[]);let L=p(`browser`);i(()=>{T(m),D(m),k([m]),j(0),N(null),F(!1)},[m]),i(()=>{if(h)try{let e=S??m,t=`${new URL(e).origin}${h}`;T(t);let n=!1;if(I.current?.contentWindow)try{let e=I.current.contentWindow.location.href;new URL(e).href===new URL(t).href&&(n=!0)}catch{}O[A]!==t&&(k(e=>{let n=e.slice(0,A+1);return n.push(t),n}),j(e=>e+1)),n||D(t),N(null)}catch{}},[h,S,m]);let R=e=>{try{let t=G(e);if(t===E){H();return}D(t),T(t),N(null);let n=O.slice(0,A+1);n.push(t),k(n),j(n.length-1)}catch(e){e instanceof Error&&e.message===`URL does not match allowed domain`&&S?N(L.domainRestrictionError?.value??`Only URLs from ${S} are allowed.`):N(L.errorMessage.value)}},z=()=>{if(A>0){let e=A-1,t=O[e];j(e),D(t),T(t),N(null)}},B=()=>{if(A<O.length-1){let e=A+1,t=O[e];j(e),D(t),T(t),N(null)}},V=e=>{e.preventDefault(),F(!0),R(w)},H=()=>{if(I.current){let e=I.current.src;I.current.src=``,setTimeout(()=>{I.current&&(I.current.src=e)},50)}},U=e=>e===`localhost`||/^(\d{1,3}\.){3}\d{1,3}$/.test(e)||/^[a-f0-9:]+$/i.test(e)?!0:!(!/^[a-z0-9.-]+$/i.test(e)||/^[-.]/.test(e)||/[-.]$/.test(e)||e.includes(`..`)||!e.includes(`.`)),W=()=>{if(!S)return null;try{return new URL(S)}catch{return null}},G=e=>{let t=e.trim();if(!t||/\s/.test(t))throw Error(`Invalid`);let n=W();if(t.startsWith(`/`)&&!t.startsWith(`//`))return n?new URL(`${n.origin}${t}`).toString():new URL(`${new URL(E).origin}${t}`).toString();let r=/^[a-zA-Z][a-zA-Z0-9+.-]*:/.test(t)?t:`https://${t}`,i=new URL(r);if(i.protocol!==`http:`&&i.protocol!==`https:`)throw Error(`Only http(s) is allowed`);if(!U(i.hostname))throw Error(`Invalid host`);if(n&&!(i.hostname===n.hostname&&i.protocol===n.protocol&&(n.port===``||i.port===n.port||i.host===n.host)))throw Error(`URL does not match allowed domain`);return i.toString()},K=P&&!!M,q=A>0,J=A<O.length-1;return f(`section`,{className:e(`flex w-full flex-col overflow-hidden rounded-xl bg-background shadow-[0_4px_12px_rgba(0,0,0,0.4),0_0_1px_rgba(0,0,0,0.2)]`,g),style:_,"aria-label":y??L.ariaLabel.value,children:[f(`div`,{className:`relative z-10 flex shrink-0 items-center gap-3 rounded-t-xl bg-text/15 px-4 py-2`,children:[f(`div`,{className:`flex items-center gap-1`,children:[d(t,{type:`button`,onClick:z,disabled:!q,variant:`hoverable`,size:`icon-md`,label:L.backButtonLabel.value,Icon:c}),d(t,{type:`button`,onClick:B,disabled:!J,variant:`hoverable`,size:`icon-md`,label:L.forwardButtonLabel.value,Icon:l})]}),f(`form`,{onSubmit:V,noValidate:!0,className:e(r(),`flex w-full gap-2 rounded-xl p-0.5! supports-[corner-shape:squircle]:rounded-2xl`,`bg-neutral/10 text-text/50 placeholder:text-neutral/80`),children:[d(`label`,{htmlFor:`browser-url`,className:`sr-only`,children:L.urlLabel.value}),d(n,{id:`browser-url`,type:`text`,inputMode:`url`,spellCheck:!1,autoCapitalize:`off`,variant:`invisible`,className:`ml-3 p-0!`,size:`sm`,autoCorrect:`off`,value:w,onChange:e=>{T(e.target.value),K&&N(null)},placeholder:L.urlPlaceholder.value,"aria-label":L.urlLabel.value,"aria-invalid":K,"aria-describedby":K?`browser-url-error`:void 0}),d(t,{type:`button`,onClick:H,variant:`hoverable`,size:`icon-md`,className:`p-1!`,label:`content.reloadButtonTitle.value`,Icon:u}),d(`button`,{type:`submit`,className:`sr-only absolute`,tabIndex:-1})]}),K&&d(`div`,{className:`absolute top-full left-4 z-20 mt-1`,children:d(`p`,{id:`browser-url-error`,role:`alert`,"aria-live":`assertive`,className:`rounded-md bg-red-900/90 px-3 py-1.5 text-red-100 text-xs shadow-md backdrop-blur-sm`,children:M})})]}),d(`div`,{className:`relative z-0 flex min-h-0 w-full flex-1 flex-col overflow-hidden rounded-b-xl bg-background`,children:d(`iframe`,{ref:I,src:E,title:L.iframeTitle.value,className:`size-full flex-1`,sandbox:b,loading:`lazy`,"aria-live":`polite`,...C})})]})};export{m as Browser};
 //# sourceMappingURL=Browser.mjs.map

package/dist/esm/components/Carousel/index.mjs

@@ -1,5 +1,5 @@
-"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t,ButtonColor as n,ButtonSize as r,ButtonVariant as i}from"../Button/Button.mjs";import{KeyboardShortcut as a}from"../KeyboardShortcut/KeyboardShortcut.mjs";import{Popover as o}from"../Popover/dynamic.mjs";import{ChevronLeft as s,ChevronRight as c}from"lucide-react";import{Children as l,createContext as u,isValidElement as d,useContext as f,useEffect as p,useRef as m,useState as h}from"react";import{jsx as g,jsxs as _}from"react/jsx-runtime";import{useIntlayer as v}from"react-intlayer";const y=u(null),b=()=>{let e=f(y);if(!e)throw Error(`useCarousel must be used within a Carousel`);return e},x=(e,t)=>{switch(Math.abs(e-t)){case 0:return`opacity-100 z-40`;case 1:return`opacity-75 z-30 cursor-pointer`;case 2:return`opacity-50 z-20 pointer-events-none`;default:return`opacity-0 z-10 pointer-events-none`}},S=(e,t)=>{switch(Math.abs(e-t)){case 0:return 1;case 1:return .9;case 2:return .8;default:return .7}},C=(e,t)=>`calc(${e-t} * min(30vw, 300px))`,w=({children:t,className:n,...r})=>g(`div`,{className:e(`h-full w-full`,n),...r,children:t}),T=({className:l,disableKeyboardShortcuts:u=!1,...d})=>{let{selectedIndex:f,setSelectedIndex:p,totalItems:m,handlePrev:h,handleNext:y}=b(),{goToSlide:x,previousSlide:S,nextSlide:C}=v(`carousel`);return m<=1?null:_(`div`,{className:e(`absolute bottom-4 left-1/2 z-50 flex -translate-x-1/2 flex-row items-center gap-2`,l),...d,children:[_(o,{identifier:`carousel-prev`,children:[g(t,{variant:i.HOVERABLE,color:n.NEUTRAL,label:S.value,roundedSize:`full`,onClick:e=>{e.stopPropagation(),h()},Icon:s,size:r.ICON_MD,disabled:f===0}),g(o.Detail,{identifier:`carousel-prev`,children:_(`div`,{className:`flex items-center gap-2 p-2`,children:[g(`span`,{className:`whitespace-nowrap text-neutral text-xs`,children:S.value}),g(a,{shortcut:`ArrowLeft`,disabled:u,size:`sm`,onTriggered:h})]})})]}),Array.from({length:m}).map((t,n)=>{let r=n===f;return g(`button`,{type:`button`,onClick:e=>{e.stopPropagation(),p(n)},"aria-label":x({index:n+1}).value,className:e(`h-2.5 w-2.5 rounded-full transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-neutral-400 focus:ring-offset-2`,r?`scale-110 bg-text`:`bg-text/20 hover:bg-text/40`)},n)}),_(o,{identifier:`carousel-next`,children:[g(t,{variant:i.HOVERABLE,color:n.NEUTRAL,roundedSize:`full`,label:C.value,onClick:e=>{e.stopPropagation(),y()},Icon:c,size:r.ICON_MD,disabled:f===m-1}),g(o.Detail,{identifier:`carousel-next`,children:_(`div`,{className:`flex items-center gap-2 p-2`,children:[g(`span`,{className:`whitespace-nowrap text-neutral text-xs`,children:C.value}),g(a,{shortcut:`ArrowRight`,size:`sm`,onTriggered:y,disabled:u})]})})]})]})},E=e=>{let t=[],n=[];return e.forEach(e=>{d(e)&&e.type===w?t.push(e):n.push(e)}),[t,n]},D=Object.assign(({children:t,className:n,initialIndex:r=0,onIndexChange:i,...a})=>{let[o,s]=E(l.toArray(t)),c=o.length,[u,d]=h(r),[f,v]=h(r),[b,w]=h(0),[T,D]=h(0),[O,k]=h(!1),A=m(null),j=m([]),M=e=>{if(typeof window>`u`)return;let t=window.innerWidth/5,n=Math.round(e/t);if(Math.abs(n)>=1){let t=f-n,r=Math.max(0,Math.min(t,c-1));r!==u&&(d(r),D(t=>t+e))}},N=()=>{d(e=>Math.min(e+1,c-1))},P=()=>{d(e=>Math.max(e-1,0))},F=e=>{k(!0),D(e.clientX)},I=e=>{O&&M(e.clientX-T)},L=()=>k(!1);return p(()=>{u&&i?.(u)},[u,i]),p(()=>{let e;return u!==f&&(e=setInterval(()=>{v(t=>t===u?(clearInterval(e),t):t<u?t+1:t-1)},50)),()=>clearInterval(e)},[u,f]),p(()=>{let e=()=>{let e=j.current.map(e=>e?.offsetHeight||0),t=Math.max(0,...e);t>0&&w(t+40)};e();let t=new ResizeObserver(()=>{e()});return j.current.forEach(e=>{e&&t.observe(e)}),()=>t.disconnect()},[c]),g(y.Provider,{value:{selectedIndex:u,setSelectedIndex:d,totalItems:c,handlePrev:P,handleNext:N},children:_(`div`,{ref:A,className:e(`relative w-full cursor-grab select-none overflow-hidden outline-none transition-[height] duration-300 ease-in-out focus:outline-none focus:outline-none focus:ring-0 active:cursor-grabbing`,`max-w-[1400px]`,n),style:{height:b>0?b:`auto`,minHeight:`400px`},onMouseDown:F,onMouseMove:I,onMouseUp:L,onMouseLeave:L,onTouchStart:e=>{k(!0),D(e.touches[0].clientX)},onTouchMove:e=>{O&&M(e.touches[0].clientX-T)},onTouchEnd:L,role:`region`,"aria-label":`Carousel`,...a,children:[o.map((t,n)=>g(`div`,{role:`button`,tabIndex:0,ref:e=>{j.current[n]=e},className:e(`absolute left-1/2 -translate-x-1/2 transition-all duration-300 ease-in-out`,`outline-none ring-0 focus:outline-none focus:ring-0 focus:ring-offset-0 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0`,x(n,f)),onClick:e=>{e.stopPropagation(),d(n)},onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&d(n)},style:{transform:`
-                  translateX(${C(n,f)}) 
-                  scale(${S(n,f)})
-                `},children:t},n)),s]})})},{Item:w,Indicators:T});export{D as Carousel};
+"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t,ButtonColor as n,ButtonSize as r,ButtonVariant as i}from"../Button/Button.mjs";import{KeyboardShortcut as a}from"../KeyboardShortcut/KeyboardShortcut.mjs";import{Popover as o}from"../Popover/dynamic.mjs";import{Children as s,createContext as c,isValidElement as l,useContext as u,useEffect as d,useRef as f,useState as p}from"react";import{ChevronLeft as m,ChevronRight as h}from"lucide-react";import{jsx as g,jsxs as _}from"react/jsx-runtime";import{useIntlayer as v}from"react-intlayer";const y=c(null),b=()=>{let e=u(y);if(!e)throw Error(`useCarousel must be used within a Carousel`);return e},x=(e,t)=>{switch(Math.abs(e-t)){case 0:return`opacity-100 z-40`;case 1:return`opacity-75 z-30 cursor-pointer`;case 2:return`opacity-50 z-20 pointer-events-none`;default:return`opacity-0 z-10 pointer-events-none`}},S=(e,t)=>{switch(Math.abs(e-t)){case 0:return 1;case 1:return .9;case 2:return .8;default:return .7}},C=(e,t,n)=>{let r=e-t,i=n<600?.15:.3;return`${r*Math.min(n*i,300)}px`},w=({children:t,className:n,...r})=>g(`div`,{className:e(`h-full w-full`,n),...r,children:t}),T=({className:s,disableKeyboardShortcuts:c=!1,...l})=>{let{selectedIndex:u,setSelectedIndex:d,totalItems:f,handlePrev:p,handleNext:y}=b(),{goToSlide:x,previousSlide:S,nextSlide:C}=v(`carousel`);return f<=1?null:_(`div`,{className:e(`absolute bottom-4 left-1/2 z-50 flex -translate-x-1/2 flex-row items-center gap-2`,s),...l,children:[_(o,{identifier:`carousel-prev`,children:[g(t,{variant:i.HOVERABLE,color:n.NEUTRAL,label:S.value,roundedSize:`full`,onClick:e=>{e.stopPropagation(),p()},Icon:m,size:r.ICON_MD,disabled:u===0}),g(o.Detail,{identifier:`carousel-prev`,children:_(`div`,{className:`flex items-center gap-2 p-2`,children:[g(`span`,{className:`whitespace-nowrap text-neutral text-xs`,children:S.value}),g(a,{shortcut:`ArrowLeft`,disabled:c,size:`sm`,onTriggered:p})]})})]}),Array.from({length:f}).map((t,n)=>{let r=n===u;return g(`button`,{type:`button`,onClick:e=>{e.stopPropagation(),d(n)},"aria-label":x({index:n+1}).value,className:e(`h-2.5 w-2.5 rounded-full transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-neutral-400 focus:ring-offset-2`,r?`scale-110 bg-text`:`bg-text/20 hover:bg-text/40`)},n)}),_(o,{identifier:`carousel-next`,children:[g(t,{variant:i.HOVERABLE,color:n.NEUTRAL,roundedSize:`full`,label:C.value,onClick:e=>{e.stopPropagation(),y()},Icon:h,size:r.ICON_MD,disabled:u===f-1}),g(o.Detail,{identifier:`carousel-next`,children:_(`div`,{className:`flex items-center gap-2 p-2`,children:[g(`span`,{className:`whitespace-nowrap text-neutral text-xs`,children:C.value}),g(a,{shortcut:`ArrowRight`,size:`sm`,onTriggered:y,disabled:c})]})})]})]})},E=e=>{let t=[],n=[];return e.forEach(e=>{l(e)&&e.type===w?t.push(e):n.push(e)}),[t,n]},D=Object.assign(({children:t,className:n,initialIndex:r=0,onIndexChange:i,...a})=>{let[o,c]=E(s.toArray(t)),l=o.length,[u,m]=p(r),[h,v]=p(r),[b,w]=p(0),[T,D]=p(0);d(()=>{let e=()=>{if(!M.current)return;let e=M.current.clientWidth;D(e);let t=N.current.map(e=>e?.offsetHeight||0),n=Math.max(0,...t);n>0&&w(n+40)};e();let t=new ResizeObserver(()=>{e()});return M.current&&t.observe(M.current),N.current.forEach(e=>{e&&t.observe(e)}),()=>t.disconnect()},[l]);let[O,k]=p(0),[A,j]=p(!1),M=f(null),N=f([]),P=e=>{if(T===0)return;let t=T/5,n=Math.round(e/t);if(Math.abs(n)>=1){let t=h-n,r=Math.max(0,Math.min(t,l-1));r!==u&&(m(r),k(t=>t+e))}},F=()=>{m(e=>Math.min(e+1,l-1))},I=()=>{m(e=>Math.max(e-1,0))},L=e=>{j(!0),k(e.clientX)},R=e=>{A&&P(e.clientX-O)},z=()=>j(!1);return d(()=>{u&&i?.(u)},[u,i]),d(()=>{let e;return u!==h&&(e=setInterval(()=>{v(t=>t===u?(clearInterval(e),t):t<u?t+1:t-1)},50)),()=>clearInterval(e)},[u,h]),d(()=>{let e=()=>{let e=N.current.map(e=>e?.offsetHeight||0),t=Math.max(0,...e);t>0&&w(t+40)};e();let t=new ResizeObserver(()=>{e()});return N.current.forEach(e=>{e&&t.observe(e)}),()=>t.disconnect()},[l]),g(y.Provider,{value:{selectedIndex:u,setSelectedIndex:m,totalItems:l,handlePrev:I,handleNext:F},children:_(`div`,{ref:M,className:e(`relative flex w-full cursor-grab select-none items-center overflow-hidden outline-none transition-[height] duration-300 ease-in-out focus:outline-none focus:outline-none focus:ring-0 active:cursor-grabbing`,`max-w-[1400px]`,n),style:{height:b>0?b:`auto`,minHeight:`400px`},onMouseDown:L,onMouseMove:R,onMouseUp:z,onMouseLeave:z,onTouchStart:e=>{j(!0),k(e.touches[0].clientX)},onTouchMove:e=>{A&&P(e.touches[0].clientX-O)},onTouchEnd:z,role:`region`,"aria-label":`Carousel`,...a,children:[o.map((t,n)=>g(`div`,{role:`button`,tabIndex:0,ref:e=>{N.current[n]=e},className:e(`absolute left-1/2 -translate-x-1/2 transition-all duration-300 ease-in-out`,`outline-none ring-0 focus:outline-none focus:ring-0 focus:ring-offset-0 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0`,x(n,h)),onClick:e=>{e.stopPropagation(),m(n)},onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&m(n)},style:{transform:`
+                  translateX(${C(n,h,T)})
+                  scale(${S(n,h)})
+                `},children:t},n)),c]})})},{Item:w,Indicators:T});export{D as Carousel};
 //# sourceMappingURL=index.mjs.map

package/dist/esm/components/Carousel/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/Carousel/index.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Button,\n  ButtonColor,\n  ButtonSize,\n  ButtonVariant,\n} from '@components/Button';\nimport { KeyboardShortcut } from '@components/KeyboardShortcut';\nimport { Popover } from '@components/Popover';\nimport { cn } from '@utils/cn';\nimport { ChevronLeft, ChevronRight } from 'lucide-react';\nimport {\n  Children,\n  createContext,\n  type FC,\n  type HTMLAttributes,\n  isValidElement,\n  type MouseEventHandler,\n  type ReactElement,\n  type ReactNode,\n  type TouchEventHandler,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { useIntlayer } from 'react-intlayer';\n\n// ------------------------------------------------------------------\n// Configuration\n// ------------------------------------------------------------------\nconst SWIPE_THRESHOLD_DIVISOR = 5;\nconst TRANSITION_DELAY_MS = 50;\n\n// ------------------------------------------------------------------\n// Context Definition\n// ------------------------------------------------------------------\ntype CarouselContextValue = {\n  selectedIndex: number;\n  setSelectedIndex: (index: number) => void;\n  totalItems: number;\n  handlePrev: () => void;\n  handleNext: () => void;\n};\n\nconst CarouselContext = createContext<CarouselContextValue | null>(null);\n\nconst useCarousel = () => {\n  const context = useContext(CarouselContext);\n  if (!context) {\n    throw new Error('useCarousel must be used within a Carousel');\n  }\n  return context;\n};\n\n// ------------------------------------------------------------------\n// Helper Functions\n// ------------------------------------------------------------------\nconst getCardStyle = (index: number, displayedIndex: number) => {\n  const diff = Math.abs(index - displayedIndex);\n  switch (diff) {\n    case 0:\n      return 'opacity-100 z-40';\n    case 1:\n      return 'opacity-75 z-30 cursor-pointer';\n    case 2:\n      return 'opacity-50 z-20 pointer-events-none';\n    default:\n      return 'opacity-0 z-10 pointer-events-none';\n  }\n};\n\nconst getCardScale = (index: number, displayedIndex: number) => {\n  const diff = Math.abs(index - displayedIndex);\n  switch (diff) {\n    case 0:\n      return 1;\n    case 1:\n      return 0.9;\n    case 2:\n      return 0.8;\n    default:\n      return 0.7;\n  }\n};\n\n// FIX 1: Use CSS units (vw) instead of window.innerWidth (pixels)\n// This allows the calculation to work on SSR without hydration mismatch.\n// Your original logic: (3 * screenWidth) / 10  === 30% of viewport width\nconst getCardPositionX = (index: number, displayedIndex: number) => {\n  const diff = index - displayedIndex;\n  return `calc(${diff} * min(30vw, 300px))`;\n};\n\n// ------------------------------------------------------------------\n// Sub-Component: Item\n// ------------------------------------------------------------------\ntype CarouselItemProps = HTMLAttributes<HTMLDivElement> & {\n  children: ReactNode;\n};\n\nconst CarouselItem: FC<CarouselItemProps> = ({\n  children,\n  className,\n  ...props\n}) => {\n  return (\n    <div className={cn('h-full w-full', className)} {...props}>\n      {children}\n    </div>\n  );\n};\n\n// ------------------------------------------------------------------\n// Sub-Component: Indicators (Controller)\n// ------------------------------------------------------------------\ntype CarouselIndicatorsProps = HTMLAttributes<HTMLDivElement> & {\n  disableKeyboardShortcuts?: boolean;\n};\n\nconst CarouselIndicators: FC<CarouselIndicatorsProps> = ({\n  className,\n  disableKeyboardShortcuts = false,\n  ...props\n}) => {\n  const {\n    selectedIndex,\n    setSelectedIndex,\n    totalItems,\n    handlePrev,\n    handleNext,\n  } = useCarousel();\n  const { goToSlide, previousSlide, nextSlide } = useIntlayer('carousel');\n\n  if (totalItems <= 1) return null;\n\n  return (\n    <div\n      className={cn(\n        'absolute bottom-4 left-1/2 z-50 flex -translate-x-1/2 flex-row items-center gap-2',\n        className\n      )}\n      {...props}\n    >\n      <Popover identifier=\"carousel-prev\">\n        <Button\n          variant={ButtonVariant.HOVERABLE}\n          color={ButtonColor.NEUTRAL}\n          label={previousSlide.value}\n          roundedSize=\"full\"\n          onClick={(e) => {\n            e.stopPropagation();\n            handlePrev();\n          }}\n          Icon={ChevronLeft}\n          size={ButtonSize.ICON_MD}\n          disabled={selectedIndex === 0}\n        />\n\n        <Popover.Detail identifier=\"carousel-prev\">\n          <div className=\"flex items-center gap-2 p-2\">\n            <span className=\"whitespace-nowrap text-neutral text-xs\">\n              {previousSlide.value}\n            </span>\n            <KeyboardShortcut\n              shortcut=\"ArrowLeft\"\n              disabled={disableKeyboardShortcuts}\n              size=\"sm\"\n              onTriggered={handlePrev}\n            />\n          </div>\n        </Popover.Detail>\n      </Popover>\n\n      {Array.from({ length: totalItems }).map((_, index) => {\n        const isActive = index === selectedIndex;\n        return (\n          <button\n            key={index}\n            type=\"button\"\n            onClick={(e) => {\n              e.stopPropagation();\n              setSelectedIndex(index);\n            }}\n            aria-label={goToSlide({ index: index + 1 }).value}\n            className={cn(\n              'h-2.5 w-2.5 rounded-full transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-neutral-400 focus:ring-offset-2',\n              isActive ? 'scale-110 bg-text' : 'bg-text/20 hover:bg-text/40'\n            )}\n          />\n        );\n      })}\n\n      <Popover identifier=\"carousel-next\">\n        <Button\n          variant={ButtonVariant.HOVERABLE}\n          color={ButtonColor.NEUTRAL}\n          roundedSize=\"full\"\n          label={nextSlide.value}\n          onClick={(e) => {\n            e.stopPropagation();\n            handleNext();\n          }}\n          Icon={ChevronRight}\n          size={ButtonSize.ICON_MD}\n          disabled={selectedIndex === totalItems - 1}\n        />\n\n        <Popover.Detail identifier=\"carousel-next\">\n          <div className=\"flex items-center gap-2 p-2\">\n            <span className=\"whitespace-nowrap text-neutral text-xs\">\n              {nextSlide.value}\n            </span>\n            <KeyboardShortcut\n              shortcut=\"ArrowRight\"\n              size=\"sm\"\n              onTriggered={handleNext}\n              disabled={disableKeyboardShortcuts}\n            />\n          </div>\n        </Popover.Detail>\n      </Popover>\n    </div>\n  );\n};\n\n// ------------------------------------------------------------------\n// Main Component: Carousel Root\n// ------------------------------------------------------------------\ntype CarouselProps = HTMLAttributes<HTMLDivElement> & {\n  children: ReactNode;\n  initialIndex?: number;\n  onIndexChange?: (index: number) => void;\n};\n\nconst partitionCarouselChildren = (\n  children: ReactNode[]\n): [ReactElement[], ReactNode[]] => {\n  const slides: ReactElement[] = [];\n  const others: ReactNode[] = [];\n\n  children.forEach((child) => {\n    if (isValidElement(child) && child.type === CarouselItem) {\n      slides.push(child);\n    } else {\n      others.push(child);\n    }\n  });\n\n  return [slides, others];\n};\n\nconst CarouselRoot: FC<CarouselProps> = ({\n  children,\n  className,\n  initialIndex = 0,\n  onIndexChange,\n  ...props\n}) => {\n  const allChildren = Children.toArray(children);\n  const [slides, others] = partitionCarouselChildren(allChildren);\n  const totalItems = slides.length;\n\n  // State Management\n  const [selectedIndex, setSelectedIndex] = useState<number>(initialIndex);\n  const [displayedIndex, setDisplayedIndex] = useState<number>(initialIndex);\n  const [containerHeight, setContainerHeight] = useState<number>(0);\n\n  // Drag State\n  const [startX, setStartX] = useState(0);\n  const [isDragging, setIsDragging] = useState(false);\n\n  // Refs\n  const containerRef = useRef<HTMLDivElement>(null);\n  const itemsRef = useRef<(HTMLDivElement | null)[]>([]);\n\n  // Navigation Logic\n  const handleSwitchItem = (diff: number) => {\n    if (typeof window === 'undefined') return;\n\n    const screenWidth = window.innerWidth;\n    const swipeStep = screenWidth / SWIPE_THRESHOLD_DIVISOR;\n    const numSwipe = Math.round(diff / swipeStep);\n\n    if (Math.abs(numSwipe) >= 1) {\n      const newIndex = displayedIndex - numSwipe;\n      const clampedIndex = Math.max(0, Math.min(newIndex, totalItems - 1));\n\n      if (clampedIndex !== selectedIndex) {\n        setSelectedIndex(clampedIndex);\n        setStartX((prev) => prev + diff);\n      }\n    }\n  };\n\n  const handleNext = () => {\n    setSelectedIndex((prev) => Math.min(prev + 1, totalItems - 1));\n  };\n\n  const handlePrev = () => {\n    setSelectedIndex((prev) => Math.max(prev - 1, 0));\n  };\n\n  // Input Handlers\n  const handleMouseDown: MouseEventHandler<HTMLDivElement> = (e) => {\n    setIsDragging(true);\n    setStartX(e.clientX);\n  };\n  const handleMouseMove: MouseEventHandler<HTMLDivElement> = (e) => {\n    if (isDragging) handleSwitchItem(e.clientX - startX);\n  };\n  const handleDragEnd = () => setIsDragging(false);\n  const handleTouchStart: TouchEventHandler<HTMLDivElement> = (e) => {\n    setIsDragging(true);\n    setStartX(e.touches[0].clientX);\n  };\n  const handleTouchMove: TouchEventHandler<HTMLDivElement> = (e) => {\n    if (isDragging) handleSwitchItem(e.touches[0].clientX - startX);\n  };\n\n  // Effects\n  useEffect(() => {\n    if (selectedIndex) onIndexChange?.(selectedIndex);\n  }, [selectedIndex, onIndexChange]);\n\n  useEffect(() => {\n    let interval: NodeJS.Timeout;\n\n    if (selectedIndex !== displayedIndex) {\n      interval = setInterval(() => {\n        setDisplayedIndex((prev) => {\n          if (prev === selectedIndex) {\n            clearInterval(interval);\n            return prev;\n          }\n          return prev < selectedIndex ? prev + 1 : prev - 1;\n        });\n      }, TRANSITION_DELAY_MS);\n    }\n    return () => clearInterval(interval);\n  }, [selectedIndex, displayedIndex]);\n\n  // Calculate height based on the MAX height of ALL items\n  useEffect(() => {\n    const calculateMaxHeight = () => {\n      const heights = itemsRef.current.map((item) => item?.offsetHeight || 0);\n      const maxHeight = Math.max(0, ...heights);\n\n      if (maxHeight > 0) {\n        setContainerHeight(maxHeight + 40);\n      }\n    };\n\n    calculateMaxHeight();\n\n    const observer = new ResizeObserver(() => {\n      calculateMaxHeight();\n    });\n\n    itemsRef.current.forEach((item) => {\n      if (item) observer.observe(item);\n    });\n\n    return () => observer.disconnect();\n  }, [totalItems]); // Removed isMounted dependency\n\n  return (\n    <CarouselContext.Provider\n      value={{\n        selectedIndex,\n        setSelectedIndex,\n        totalItems,\n        handlePrev,\n        handleNext,\n      }}\n    >\n      <div\n        ref={containerRef}\n        className={cn(\n          'relative w-full cursor-grab select-none overflow-hidden outline-none transition-[height] duration-300 ease-in-out focus:outline-none focus:outline-none focus:ring-0 active:cursor-grabbing',\n          'max-w-[1400px]',\n          className\n        )}\n        style={{\n          height: containerHeight > 0 ? containerHeight : 'auto',\n          minHeight: '400px',\n        }}\n        onMouseDown={handleMouseDown}\n        onMouseMove={handleMouseMove}\n        onMouseUp={handleDragEnd}\n        onMouseLeave={handleDragEnd}\n        onTouchStart={handleTouchStart}\n        onTouchMove={handleTouchMove}\n        onTouchEnd={handleDragEnd}\n        role=\"region\"\n        aria-label=\"Carousel\"\n        {...props}\n      >\n        {slides.map((child, index) => {\n          return (\n            <div\n              key={index}\n              role=\"button\"\n              tabIndex={0}\n              ref={(el) => {\n                itemsRef.current[index] = el;\n              }}\n              // FIX 2: Removed isMounted checks and invisible classes.\n              // CSS units allow correct SSR rendering.\n              className={cn(\n                'absolute left-1/2 -translate-x-1/2 transition-all duration-300 ease-in-out',\n                'outline-none ring-0 focus:outline-none focus:ring-0 focus:ring-offset-0 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0',\n                getCardStyle(index, displayedIndex)\n              )}\n              onClick={(e) => {\n                e.stopPropagation();\n                setSelectedIndex(index);\n              }}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter' || e.key === ' ') setSelectedIndex(index);\n              }}\n              style={{\n                // FIX 3: getCardPositionX now returns '30vw', so no 'px' suffix needed here\n                transform: `\n                  translateX(${getCardPositionX(index, displayedIndex)}) \n                  scale(${getCardScale(index, displayedIndex)})\n                `,\n              }}\n            >\n              {child}\n            </div>\n          );\n        })}\n\n        {others}\n      </div>\n    </CarouselContext.Provider>\n  );\n};\n\nexport const Carousel = Object.assign(CarouselRoot, {\n  Item: CarouselItem,\n  Indicators: CarouselIndicators,\n});\n"],"mappings":"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"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/Carousel/index.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Button,\n  ButtonColor,\n  ButtonSize,\n  ButtonVariant,\n} from '@components/Button';\nimport { KeyboardShortcut } from '@components/KeyboardShortcut';\nimport { Popover } from '@components/Popover';\nimport { cn } from '@utils/cn';\nimport { ChevronLeft, ChevronRight } from 'lucide-react';\nimport {\n  Children,\n  createContext,\n  type FC,\n  type HTMLAttributes,\n  isValidElement,\n  type MouseEventHandler,\n  type ReactElement,\n  type ReactNode,\n  type TouchEventHandler,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { useIntlayer } from 'react-intlayer';\n\n// ------------------------------------------------------------------\n// Configuration\n// ------------------------------------------------------------------\nconst SWIPE_THRESHOLD_DIVISOR = 5;\nconst TRANSITION_DELAY_MS = 50;\n\n// ------------------------------------------------------------------\n// Context Definition\n// ------------------------------------------------------------------\ntype CarouselContextValue = {\n  selectedIndex: number;\n  setSelectedIndex: (index: number) => void;\n  totalItems: number;\n  handlePrev: () => void;\n  handleNext: () => void;\n};\n\nconst CarouselContext = createContext<CarouselContextValue | null>(null);\n\nconst useCarousel = () => {\n  const context = useContext(CarouselContext);\n  if (!context) {\n    throw new Error('useCarousel must be used within a Carousel');\n  }\n  return context;\n};\n\n// ------------------------------------------------------------------\n// Helper Functions\n// ------------------------------------------------------------------\nconst getCardStyle = (index: number, displayedIndex: number) => {\n  const diff = Math.abs(index - displayedIndex);\n  switch (diff) {\n    case 0:\n      return 'opacity-100 z-40';\n    case 1:\n      return 'opacity-75 z-30 cursor-pointer';\n    case 2:\n      return 'opacity-50 z-20 pointer-events-none';\n    default:\n      return 'opacity-0 z-10 pointer-events-none';\n  }\n};\n\nconst getCardScale = (index: number, displayedIndex: number) => {\n  const diff = Math.abs(index - displayedIndex);\n  switch (diff) {\n    case 0:\n      return 1;\n    case 1:\n      return 0.9;\n    case 2:\n      return 0.8;\n    default:\n      return 0.7;\n  }\n};\n\n// This allows the calculation to work on SSR without hydration mismatch.\n// Your original logic: (3 * screenWidth) / 10  === 30% of viewport width\nconst getCardPositionX = (\n  index: number,\n  displayedIndex: number,\n  containerWidth: number\n) => {\n  const diff = index - displayedIndex;\n  const gapPercentage = containerWidth < 600 ? 0.15 : 0.3; // Dropped to 15% for a tighter cluster\n  const step = Math.min(containerWidth * gapPercentage, 300);\n\n  // The 'px' here is mandatory\n  return `${diff * step}px`;\n};\n\n// ------------------------------------------------------------------\n// Sub-Component: Item\n// ------------------------------------------------------------------\ntype CarouselItemProps = HTMLAttributes<HTMLDivElement> & {\n  children: ReactNode;\n};\n\nconst CarouselItem: FC<CarouselItemProps> = ({\n  children,\n  className,\n  ...props\n}) => {\n  return (\n    <div className={cn('h-full w-full', className)} {...props}>\n      {children}\n    </div>\n  );\n};\n\n// ------------------------------------------------------------------\n// Sub-Component: Indicators (Controller)\n// ------------------------------------------------------------------\ntype CarouselIndicatorsProps = HTMLAttributes<HTMLDivElement> & {\n  disableKeyboardShortcuts?: boolean;\n};\n\nconst CarouselIndicators: FC<CarouselIndicatorsProps> = ({\n  className,\n  disableKeyboardShortcuts = false,\n  ...props\n}) => {\n  const {\n    selectedIndex,\n    setSelectedIndex,\n    totalItems,\n    handlePrev,\n    handleNext,\n  } = useCarousel();\n  const { goToSlide, previousSlide, nextSlide } = useIntlayer('carousel');\n\n  if (totalItems <= 1) return null;\n\n  return (\n    <div\n      className={cn(\n        'absolute bottom-4 left-1/2 z-50 flex -translate-x-1/2 flex-row items-center gap-2',\n        className\n      )}\n      {...props}\n    >\n      <Popover identifier=\"carousel-prev\">\n        <Button\n          variant={ButtonVariant.HOVERABLE}\n          color={ButtonColor.NEUTRAL}\n          label={previousSlide.value}\n          roundedSize=\"full\"\n          onClick={(e) => {\n            e.stopPropagation();\n            handlePrev();\n          }}\n          Icon={ChevronLeft}\n          size={ButtonSize.ICON_MD}\n          disabled={selectedIndex === 0}\n        />\n\n        <Popover.Detail identifier=\"carousel-prev\">\n          <div className=\"flex items-center gap-2 p-2\">\n            <span className=\"whitespace-nowrap text-neutral text-xs\">\n              {previousSlide.value}\n            </span>\n            <KeyboardShortcut\n              shortcut=\"ArrowLeft\"\n              disabled={disableKeyboardShortcuts}\n              size=\"sm\"\n              onTriggered={handlePrev}\n            />\n          </div>\n        </Popover.Detail>\n      </Popover>\n\n      {Array.from({ length: totalItems }).map((_, index) => {\n        const isActive = index === selectedIndex;\n        return (\n          <button\n            key={index}\n            type=\"button\"\n            onClick={(e) => {\n              e.stopPropagation();\n              setSelectedIndex(index);\n            }}\n            aria-label={goToSlide({ index: index + 1 }).value}\n            className={cn(\n              'h-2.5 w-2.5 rounded-full transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-neutral-400 focus:ring-offset-2',\n              isActive ? 'scale-110 bg-text' : 'bg-text/20 hover:bg-text/40'\n            )}\n          />\n        );\n      })}\n\n      <Popover identifier=\"carousel-next\">\n        <Button\n          variant={ButtonVariant.HOVERABLE}\n          color={ButtonColor.NEUTRAL}\n          roundedSize=\"full\"\n          label={nextSlide.value}\n          onClick={(e) => {\n            e.stopPropagation();\n            handleNext();\n          }}\n          Icon={ChevronRight}\n          size={ButtonSize.ICON_MD}\n          disabled={selectedIndex === totalItems - 1}\n        />\n\n        <Popover.Detail identifier=\"carousel-next\">\n          <div className=\"flex items-center gap-2 p-2\">\n            <span className=\"whitespace-nowrap text-neutral text-xs\">\n              {nextSlide.value}\n            </span>\n            <KeyboardShortcut\n              shortcut=\"ArrowRight\"\n              size=\"sm\"\n              onTriggered={handleNext}\n              disabled={disableKeyboardShortcuts}\n            />\n          </div>\n        </Popover.Detail>\n      </Popover>\n    </div>\n  );\n};\n\n// ------------------------------------------------------------------\n// Main Component: Carousel Root\n// ------------------------------------------------------------------\ntype CarouselProps = HTMLAttributes<HTMLDivElement> & {\n  children: ReactNode;\n  initialIndex?: number;\n  onIndexChange?: (index: number) => void;\n};\n\nconst partitionCarouselChildren = (\n  children: ReactNode[]\n): [ReactElement[], ReactNode[]] => {\n  const slides: ReactElement[] = [];\n  const others: ReactNode[] = [];\n\n  children.forEach((child) => {\n    if (isValidElement(child) && child.type === CarouselItem) {\n      slides.push(child);\n    } else {\n      others.push(child);\n    }\n  });\n\n  return [slides, others];\n};\n\nconst CarouselRoot: FC<CarouselProps> = ({\n  children,\n  className,\n  initialIndex = 0,\n  onIndexChange,\n  ...props\n}) => {\n  const allChildren = Children.toArray(children);\n  const [slides, others] = partitionCarouselChildren(allChildren);\n  const totalItems = slides.length;\n\n  // State Management\n  const [selectedIndex, setSelectedIndex] = useState<number>(initialIndex);\n  const [displayedIndex, setDisplayedIndex] = useState<number>(initialIndex);\n  const [containerHeight, setContainerHeight] = useState<number>(0);\n  const [containerWidth, setContainerWidth] = useState<number>(0);\n\n  useEffect(() => {\n    const calculateDimensions = () => {\n      if (!containerRef.current) return;\n\n      // Track Width\n      const width = containerRef.current.clientWidth;\n      setContainerWidth(width);\n\n      // Track Height (existing logic)\n      const heights = itemsRef.current.map((item) => item?.offsetHeight || 0);\n      const maxHeight = Math.max(0, ...heights);\n      if (maxHeight > 0) {\n        setContainerHeight(maxHeight + 40);\n      }\n    };\n\n    calculateDimensions();\n\n    const observer = new ResizeObserver(() => {\n      calculateDimensions();\n    });\n\n    if (containerRef.current) observer.observe(containerRef.current);\n    itemsRef.current.forEach((item) => {\n      if (item) observer.observe(item);\n    });\n\n    return () => observer.disconnect();\n  }, [totalItems]);\n\n  // Drag State\n  const [startX, setStartX] = useState(0);\n  const [isDragging, setIsDragging] = useState(false);\n\n  // Refs\n  const containerRef = useRef<HTMLDivElement>(null);\n  const itemsRef = useRef<(HTMLDivElement | null)[]>([]);\n\n  // Navigation Logic\n  const handleSwitchItem = (diff: number) => {\n    if (containerWidth === 0) return;\n\n    // Use container width for the threshold\n    const swipeStep = containerWidth / SWIPE_THRESHOLD_DIVISOR;\n    const numSwipe = Math.round(diff / swipeStep);\n\n    if (Math.abs(numSwipe) >= 1) {\n      const newIndex = displayedIndex - numSwipe;\n      const clampedIndex = Math.max(0, Math.min(newIndex, totalItems - 1));\n\n      if (clampedIndex !== selectedIndex) {\n        setSelectedIndex(clampedIndex);\n        setStartX((prev) => prev + diff);\n      }\n    }\n  };\n\n  const handleNext = () => {\n    setSelectedIndex((prev) => Math.min(prev + 1, totalItems - 1));\n  };\n\n  const handlePrev = () => {\n    setSelectedIndex((prev) => Math.max(prev - 1, 0));\n  };\n\n  // Input Handlers\n  const handleMouseDown: MouseEventHandler<HTMLDivElement> = (e) => {\n    setIsDragging(true);\n    setStartX(e.clientX);\n  };\n  const handleMouseMove: MouseEventHandler<HTMLDivElement> = (e) => {\n    if (isDragging) handleSwitchItem(e.clientX - startX);\n  };\n  const handleDragEnd = () => setIsDragging(false);\n  const handleTouchStart: TouchEventHandler<HTMLDivElement> = (e) => {\n    setIsDragging(true);\n    setStartX(e.touches[0].clientX);\n  };\n  const handleTouchMove: TouchEventHandler<HTMLDivElement> = (e) => {\n    if (isDragging) handleSwitchItem(e.touches[0].clientX - startX);\n  };\n\n  // Effects\n  useEffect(() => {\n    if (selectedIndex) onIndexChange?.(selectedIndex);\n  }, [selectedIndex, onIndexChange]);\n\n  useEffect(() => {\n    let interval: NodeJS.Timeout;\n\n    if (selectedIndex !== displayedIndex) {\n      interval = setInterval(() => {\n        setDisplayedIndex((prev) => {\n          if (prev === selectedIndex) {\n            clearInterval(interval);\n            return prev;\n          }\n          return prev < selectedIndex ? prev + 1 : prev - 1;\n        });\n      }, TRANSITION_DELAY_MS);\n    }\n    return () => clearInterval(interval);\n  }, [selectedIndex, displayedIndex]);\n\n  // Calculate height based on the MAX height of ALL items\n  useEffect(() => {\n    const calculateMaxHeight = () => {\n      const heights = itemsRef.current.map((item) => item?.offsetHeight || 0);\n      const maxHeight = Math.max(0, ...heights);\n\n      if (maxHeight > 0) {\n        setContainerHeight(maxHeight + 40);\n      }\n    };\n\n    calculateMaxHeight();\n\n    const observer = new ResizeObserver(() => {\n      calculateMaxHeight();\n    });\n\n    itemsRef.current.forEach((item) => {\n      if (item) observer.observe(item);\n    });\n\n    return () => observer.disconnect();\n  }, [totalItems]); // Removed isMounted dependency\n\n  return (\n    <CarouselContext.Provider\n      value={{\n        selectedIndex,\n        setSelectedIndex,\n        totalItems,\n        handlePrev,\n        handleNext,\n      }}\n    >\n      <div\n        ref={containerRef}\n        className={cn(\n          'relative flex w-full cursor-grab select-none items-center overflow-hidden outline-none transition-[height] duration-300 ease-in-out focus:outline-none focus:outline-none focus:ring-0 active:cursor-grabbing',\n          'max-w-[1400px]',\n          className\n        )}\n        style={{\n          height: containerHeight > 0 ? containerHeight : 'auto',\n          minHeight: '400px',\n        }}\n        onMouseDown={handleMouseDown}\n        onMouseMove={handleMouseMove}\n        onMouseUp={handleDragEnd}\n        onMouseLeave={handleDragEnd}\n        onTouchStart={handleTouchStart}\n        onTouchMove={handleTouchMove}\n        onTouchEnd={handleDragEnd}\n        role=\"region\"\n        aria-label=\"Carousel\"\n        {...props}\n      >\n        {slides.map((child, index) => {\n          return (\n            <div\n              key={index}\n              role=\"button\"\n              tabIndex={0}\n              ref={(el) => {\n                itemsRef.current[index] = el;\n              }}\n              // FIX 2: Removed isMounted checks and invisible classes.\n              // CSS units allow correct SSR rendering.\n              className={cn(\n                'absolute left-1/2 -translate-x-1/2 transition-all duration-300 ease-in-out',\n                'outline-none ring-0 focus:outline-none focus:ring-0 focus:ring-offset-0 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0',\n                getCardStyle(index, displayedIndex)\n              )}\n              onClick={(e) => {\n                e.stopPropagation();\n                setSelectedIndex(index);\n              }}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter' || e.key === ' ') setSelectedIndex(index);\n              }}\n              style={{\n                transform: `\n                  translateX(${getCardPositionX(\n                    index,\n                    displayedIndex,\n                    containerWidth\n                  )})\n                  scale(${getCardScale(index, displayedIndex)})\n                `,\n              }}\n            >\n              {child}\n            </div>\n          );\n        })}\n\n        {others}\n      </div>\n    </CarouselContext.Provider>\n  );\n};\n\nexport const Carousel = Object.assign(CarouselRoot, {\n  Item: CarouselItem,\n  Indicators: CarouselIndicators,\n});\n"],"mappings":"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"}

package/dist/esm/components/CollapsibleTable/CollapsibleTable.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"../../utils/cn.mjs";import{MaxHeightSmoother as t}from"../MaxHeightSmoother/index.mjs";import{ChevronRight as n}from"lucide-react";import{useState as r}from"react";import{cva as i}from"class-variance-authority";import{jsx as a,jsxs as o}from"react/jsx-runtime";const s=i(`w-full max-w-full overflow-hidden rounded-lg border bg-card`,{variants:{size:{sm:`max-w-lg`,md:`max-w-2xl`,lg:`max-w-4xl`,xl:`max-w-6xl`,full:`w-full max-w-none`},variant:{default:`border-neutral/20 bg-card`,dark:`border-[#B5B5B5] bg-[#242424]`,ghost:`border-transparent bg-transparent`,outlined:`border-2 border-primary/20 bg-background`},spacing:{none:``,sm:`m-2`,md:`m-4`,lg:`m-6`,auto:`m-auto`}},defaultVariants:{size:`md`,variant:`default`,spacing:`auto`}}),c=i(`flex w-full cursor-pointer items-center justify-between p-3 transition-colors duration-200`,{variants:{variant:{default:`hover:bg-neutral/5`,dark:`hover:bg-neutral/10`,ghost:`hover:bg-primary/5`,outlined:`hover:bg-primary/5`},borderStyle:{none:``,dashed:`border-neutral/20 border-b border-dashed`,solid:`border-neutral/20 border-b border-solid`}},defaultVariants:{variant:`default`,borderStyle:`dashed`}}),l=i(`w-full border-collapse`,{variants:{spacing:{none:`border-spacing-0`,sm:`border-spacing-1`,md:`border-spacing-2`,lg:`border-spacing-4`},layout:{auto:`table-auto`,fixed:`table-fixed`}},defaultVariants:{spacing:`md`,layout:`auto`}}),u=({title:i,data:u,className:d,headerClassName:f,contentClassName:p,tableClassName:m,thClassName:h,tdClassName:g,trClassName:_,defaultExpanded:v=!1,isExpanded:y,onExpandToggle:b,toggleIcon:x,size:S,variant:C,spacing:w,borderStyle:T,tableSpacing:E,tableLayout:D,columnRenderers:O,disabled:k=!1,"aria-label":A,contentId:j,...M})=>{let[N,P]=r(v),F=y??N,I=()=>{if(k)return;let e=!F;b?b(e):P(e)},L=(e=>{if(Array.isArray(e)&&e.length>0){let t=new Set;return e.forEach(e=>{e&&typeof e==`object`&&Object.keys(e).forEach(e=>{t.add(e)})}),Array.from(t)}return[]})(u),R=j||`collapsible-table-${Math.random().toString(36).substr(2,9)}`,z=(e,t,n)=>O?.[e]?O[e](t,n):String(t??`—`);return o(`section`,{className:e(s({size:S,variant:C,spacing:w}),d),"aria-label":A,...M,children:[o(`button`,{id:`${R}-header`,type:`button`,onClick:I,disabled:k,className:e(c({variant:C,borderStyle:F?T:`none`}),f,k&&`cursor-not-allowed opacity-50`),"aria-expanded":F,"aria-controls":R,children:[a(`p`,{className:`font-semibold`,children:i}),a(`div`,{className:e(`transition-transform duration-200`,F&&`rotate-90`,k&&`opacity-50`),children:x??a(n,{size:16})})]}),a(t,{isHidden:!F,children:a(`section`,{id:R,className:e(`overflow-x-auto p-3`,p),"aria-labelledby":`${R}-header`,children:o(`table`,{className:e(l({spacing:E,layout:D}),`border-separate`,m),children:[a(`thead`,{children:a(`tr`,{className:_,children:L.map(t=>a(`th`,{className:e(`pb-2 text-left font-medium text-sm text-text/70`,h),children:t},t))})}),a(`tbody`,{children:u.map((t,n)=>a(`tr`,{className:e(`bg-neutral/5 transition-colors hover:bg-neutral/10`,_),children:L.map(n=>a(`td`,{className:e(`rounded px-3 py-2 text-sm text-text`,g),children:z(n,t[n],t)},n))},n))})]})})})]})};export{u as CollapsibleTable};
+"use client";import{cn as e}from"../../utils/cn.mjs";import{MaxHeightSmoother as t}from"../MaxHeightSmoother/index.mjs";import{useState as n}from"react";import{cva as r}from"class-variance-authority";import{ChevronRight as i}from"lucide-react";import{jsx as a,jsxs as o}from"react/jsx-runtime";const s=r(`w-full max-w-full overflow-hidden rounded-lg border bg-card`,{variants:{size:{sm:`max-w-lg`,md:`max-w-2xl`,lg:`max-w-4xl`,xl:`max-w-6xl`,full:`w-full max-w-none`},variant:{default:`border-neutral/20 bg-card`,dark:`border-[#B5B5B5] bg-[#242424]`,ghost:`border-transparent bg-transparent`,outlined:`border-2 border-primary/20 bg-background`},spacing:{none:``,sm:`m-2`,md:`m-4`,lg:`m-6`,auto:`m-auto`}},defaultVariants:{size:`md`,variant:`default`,spacing:`auto`}}),c=r(`flex w-full cursor-pointer items-center justify-between p-3 transition-colors duration-200`,{variants:{variant:{default:`hover:bg-neutral/5`,dark:`hover:bg-neutral/10`,ghost:`hover:bg-primary/5`,outlined:`hover:bg-primary/5`},borderStyle:{none:``,dashed:`border-neutral/20 border-b border-dashed`,solid:`border-neutral/20 border-b border-solid`}},defaultVariants:{variant:`default`,borderStyle:`dashed`}}),l=r(`w-full border-collapse`,{variants:{spacing:{none:`border-spacing-0`,sm:`border-spacing-1`,md:`border-spacing-2`,lg:`border-spacing-4`},layout:{auto:`table-auto`,fixed:`table-fixed`}},defaultVariants:{spacing:`md`,layout:`auto`}}),u=({title:r,data:u,className:d,headerClassName:f,contentClassName:p,tableClassName:m,thClassName:h,tdClassName:g,trClassName:_,defaultExpanded:v=!1,isExpanded:y,onExpandToggle:b,toggleIcon:x,size:S,variant:C,spacing:w,borderStyle:T,tableSpacing:E,tableLayout:D,columnRenderers:O,disabled:k=!1,"aria-label":A,contentId:j,...M})=>{let[N,P]=n(v),F=y??N,I=()=>{if(k)return;let e=!F;b?b(e):P(e)},L=(e=>{if(Array.isArray(e)&&e.length>0){let t=new Set;return e.forEach(e=>{e&&typeof e==`object`&&Object.keys(e).forEach(e=>{t.add(e)})}),Array.from(t)}return[]})(u),R=j||`collapsible-table-${Math.random().toString(36).substr(2,9)}`,z=(e,t,n)=>O?.[e]?O[e](t,n):String(t??`—`);return o(`section`,{className:e(s({size:S,variant:C,spacing:w}),d),"aria-label":A,...M,children:[o(`button`,{id:`${R}-header`,type:`button`,onClick:I,disabled:k,className:e(c({variant:C,borderStyle:F?T:`none`}),f,k&&`cursor-not-allowed opacity-50`),"aria-expanded":F,"aria-controls":R,children:[a(`p`,{className:`font-semibold`,children:r}),a(`div`,{className:e(`transition-transform duration-200`,F&&`rotate-90`,k&&`opacity-50`),children:x??a(i,{size:16})})]}),a(t,{isHidden:!F,children:a(`section`,{id:R,className:e(`overflow-x-auto p-3`,p),"aria-labelledby":`${R}-header`,children:o(`table`,{className:e(l({spacing:E,layout:D}),`border-separate`,m),children:[a(`thead`,{children:a(`tr`,{className:_,children:L.map(t=>a(`th`,{className:e(`pb-2 text-left font-medium text-sm text-text/70`,h),children:t},t))})}),a(`tbody`,{children:u.map((t,n)=>a(`tr`,{className:e(`bg-neutral/5 transition-colors hover:bg-neutral/10`,_),children:L.map(n=>a(`td`,{className:e(`rounded px-3 py-2 text-sm text-text`,g),children:z(n,t[n],t)},n))},n))})]})})})]})};export{u as CollapsibleTable};
 //# sourceMappingURL=CollapsibleTable.mjs.map

package/dist/esm/components/ContentEditor/ContentEditor.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"../../utils/cn.mjs";import{InputVariant as t}from"../Input/Input.mjs";import{AutoSizedTextArea as n}from"../TextArea/AutoSizeTextArea.mjs";import{Check as r,X as i}from"lucide-react";import{useState as a}from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";const c=({children:c,onContentChange:l,isEditing:u,...d})=>{let[f,p]=a(c),[m,h]=a(0),g=f!==c,_=()=>{p(c),h(e=>e+1)},v=()=>{l(f)},y=e=>p(e.target.value??``),b=e=>{e.key===`Enter`&&(e.metaKey||e.ctrlKey)?(e.preventDefault(),v()):e.key===`Escape`&&(e.preventDefault(),_())};return s(`div`,{className:`flex flex-row items-center justify-between gap-2`,role:`group`,"aria-label":`Content editor`,children:[o(n,{className:e(`break-word m-3 inline w-full bg-transparent outline-hidden`,u?`cursor-text`:`cursor-pointer`),onChange:y,onKeyDown:b,variant:t.INVISIBLE,defaultValue:c,"aria-label":`Editable content`,"aria-describedby":g?`content-editor-actions`:void 0,...d},m),g&&s(`div`,{id:`content-editor-actions`,className:`flex flex-row items-center justify-between gap-2`,role:`group`,"aria-label":`Edit actions`,children:[o(r,{className:`cursor-pointer text-green-600 hover:scale-110`,size:16,onClick:v,role:`button`,tabIndex:0,"aria-label":`Save changes (Ctrl+Enter)`,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),v())}}),o(i,{className:`cursor-pointer text-red-600 hover:scale-110`,size:16,onClick:_,role:`button`,tabIndex:0,"aria-label":`Cancel changes (Escape)`,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),_())}})]})]})};export{c as ContentEditor};
+"use client";import{cn as e}from"../../utils/cn.mjs";import{InputVariant as t}from"../Input/Input.mjs";import{AutoSizedTextArea as n}from"../TextArea/AutoSizeTextArea.mjs";import{useState as r}from"react";import{Check as i,X as a}from"lucide-react";import{jsx as o,jsxs as s}from"react/jsx-runtime";const c=({children:c,onContentChange:l,isEditing:u,...d})=>{let[f,p]=r(c),[m,h]=r(0),g=f!==c,_=()=>{p(c),h(e=>e+1)},v=()=>{l(f)},y=e=>p(e.target.value??``),b=e=>{e.key===`Enter`&&(e.metaKey||e.ctrlKey)?(e.preventDefault(),v()):e.key===`Escape`&&(e.preventDefault(),_())};return s(`div`,{className:`flex flex-row items-center justify-between gap-2`,role:`group`,"aria-label":`Content editor`,children:[o(n,{className:e(`break-word m-3 inline w-full bg-transparent outline-hidden`,u?`cursor-text`:`cursor-pointer`),onChange:y,onKeyDown:b,variant:t.INVISIBLE,defaultValue:c,"aria-label":`Editable content`,"aria-describedby":g?`content-editor-actions`:void 0,...d},m),g&&s(`div`,{id:`content-editor-actions`,className:`flex flex-row items-center justify-between gap-2`,role:`group`,"aria-label":`Edit actions`,children:[o(i,{className:`cursor-pointer text-green-600 hover:scale-110`,size:16,onClick:v,role:`button`,tabIndex:0,"aria-label":`Save changes (Ctrl+Enter)`,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),v())}}),o(a,{className:`cursor-pointer text-red-600 hover:scale-110`,size:16,onClick:_,role:`button`,tabIndex:0,"aria-label":`Cancel changes (Escape)`,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),_())}})]})]})};export{c as ContentEditor};
 //# sourceMappingURL=ContentEditor.mjs.map

package/dist/esm/components/ContentEditor/ContentEditorInput.mjs

@@ -1,2 +1,2 @@
-"use client";import{Button as e,ButtonColor as t,ButtonSize as n,ButtonVariant as r}from"../Button/Button.mjs";import{Input as i,InputVariant as a}from"../Input/Input.mjs";import{Check as o,X as s}from"lucide-react";import{useEffect as c,useState as l}from"react";import{Fragment as u,jsx as d,jsxs as f}from"react/jsx-runtime";const p=({children:p,onContentChange:m,disabled:h,validate:g,additionalButtons:_,...v})=>{let[y,b]=l(p),[x,S]=l(0),C=y!==p,w=()=>{b(p),S(e=>e+1)},T=()=>{m(y)},E=e=>{b(e.currentTarget.value)},D=e=>{e.key===`Enter`&&!h&&O?(e.preventDefault(),T()):e.key===`Escape`&&(e.preventDefault(),w())};c(()=>{b(p),S(e=>e+1)},[p]);let O=g?.(y)??!0;return f(`div`,{className:`flex size-full flex-col items-center justify-between gap-2`,role:`group`,"aria-label":`Content editor input`,children:[d(i,{onChange:E,onKeyDown:D,"aria-label":`Editable input value`,"aria-describedby":C||_?`content-editor-input-actions`:void 0,"aria-invalid":!O,variant:a.INVISIBLE,className:`size-full`,defaultValue:p,disabled:h,...v},x),(C||_)&&f(`div`,{id:`content-editor-input-actions`,className:`flex w-full items-center justify-end gap-2`,role:`group`,"aria-label":`Edit actions`,children:[C&&f(u,{children:[d(e,{Icon:o,label:`Save changes${O?``:` (invalid content)`}`,variant:r.HOVERABLE,color:t.TEXT,size:n.ICON_SM,className:`cursor-pointer hover:scale-110`,disabled:h||!O,onClick:T,"aria-describedby":O?void 0:`validation-error`}),d(e,{Icon:s,label:`Cancel changes`,variant:r.HOVERABLE,size:n.ICON_SM,color:t.TEXT,className:`cursor-pointer hover:scale-110`,onClick:w,disabled:h})]}),_]})]},String(p))};export{p as ContentEditorInput};
+"use client";import{Button as e,ButtonColor as t,ButtonSize as n,ButtonVariant as r}from"../Button/Button.mjs";import{Input as i,InputVariant as a}from"../Input/Input.mjs";import{useEffect as o,useState as s}from"react";import{Check as c,X as l}from"lucide-react";import{Fragment as u,jsx as d,jsxs as f}from"react/jsx-runtime";const p=({children:p,onContentChange:m,disabled:h,validate:g,additionalButtons:_,...v})=>{let[y,b]=s(p),[x,S]=s(0),C=y!==p,w=()=>{b(p),S(e=>e+1)},T=()=>{m(y)},E=e=>{b(e.currentTarget.value)},D=e=>{e.key===`Enter`&&!h&&O?(e.preventDefault(),T()):e.key===`Escape`&&(e.preventDefault(),w())};o(()=>{b(p),S(e=>e+1)},[p]);let O=g?.(y)??!0;return f(`div`,{className:`flex size-full flex-col items-center justify-between gap-2`,role:`group`,"aria-label":`Content editor input`,children:[d(i,{onChange:E,onKeyDown:D,"aria-label":`Editable input value`,"aria-describedby":C||_?`content-editor-input-actions`:void 0,"aria-invalid":!O,variant:a.INVISIBLE,className:`size-full`,defaultValue:p,disabled:h,...v},x),(C||_)&&f(`div`,{id:`content-editor-input-actions`,className:`flex w-full items-center justify-end gap-2`,role:`group`,"aria-label":`Edit actions`,children:[C&&f(u,{children:[d(e,{Icon:c,label:`Save changes${O?``:` (invalid content)`}`,variant:r.HOVERABLE,color:t.TEXT,size:n.ICON_SM,className:`cursor-pointer hover:scale-110`,disabled:h||!O,onClick:T,"aria-describedby":O?void 0:`validation-error`}),d(e,{Icon:l,label:`Cancel changes`,variant:r.HOVERABLE,size:n.ICON_SM,color:t.TEXT,className:`cursor-pointer hover:scale-110`,onClick:w,disabled:h})]}),_]})]},String(p))};export{p as ContentEditorInput};
 //# sourceMappingURL=ContentEditorInput.mjs.map

package/dist/esm/components/ContentEditor/ContentEditorTextArea.mjs

@@ -1,2 +1,2 @@
-"use client";import{Button as e,ButtonColor as t,ButtonSize as n,ButtonVariant as r}from"../Button/Button.mjs";import{AutoCompleteTextarea as i}from"../TextArea/AutocompleteTextArea.mjs";import{useUser as a}from"../../hooks/useUser/index.mjs";import{Check as o,X as s}from"lucide-react";import{useEffect as c,useState as l}from"react";import{Fragment as u,jsx as d,jsxs as f}from"react/jsx-runtime";const p=({children:p,onContentChange:m,disabled:h,validate:g,additionalButtons:_,...v})=>{let{isAuthenticated:y}=a(),[b,x]=l(p),[S,C]=l(0),w=b!==p,T=()=>{x(p),C(e=>e+1)},E=()=>{m(b)},D=e=>x(e.currentTarget.value??``),O=e=>{e.key===`Enter`&&(e.metaKey||e.ctrlKey)&&!h&&k?(e.preventDefault(),E()):e.key===`Escape`&&(e.preventDefault(),T())};c(()=>{x(p),C(e=>e+1)},[p]);let k=g?.(b)??!0;return f(`div`,{className:`flex size-full flex-col items-center justify-between gap-2`,role:`group`,"aria-label":`Content editor textarea`,children:[d(i,{onChange:D,onKeyDown:O,variant:`invisible`,className:`size-full`,value:p,isActive:y,disabled:h,"aria-label":`Editable textarea content`,"aria-describedby":w||_?`content-editor-textarea-actions`:void 0,"aria-invalid":!k,...v},S),(w||_)&&f(`div`,{id:`content-editor-textarea-actions`,className:`flex w-full items-center justify-end gap-2`,role:`group`,"aria-label":`Edit actions`,children:[w&&f(u,{children:[d(e,{Icon:o,label:`Save changes${k?``:` (invalid content)`}`,variant:r.HOVERABLE,color:t.TEXT,size:n.ICON_SM,className:`cursor-pointer hover:scale-110`,disabled:h||!k,onClick:E,"aria-describedby":k?void 0:`textarea-validation-error`}),d(e,{Icon:s,label:`Cancel changes`,variant:r.HOVERABLE,size:n.ICON_SM,color:t.TEXT,className:`cursor-pointer hover:scale-110`,onClick:T,disabled:h})]}),_]})]},p)};export{p as ContentEditorTextArea};
+"use client";import{Button as e,ButtonColor as t,ButtonSize as n,ButtonVariant as r}from"../Button/Button.mjs";import{AutoCompleteTextarea as i}from"../TextArea/AutocompleteTextArea.mjs";import{useUser as a}from"../../hooks/useUser/index.mjs";import{useEffect as o,useState as s}from"react";import{Check as c,X as l}from"lucide-react";import{Fragment as u,jsx as d,jsxs as f}from"react/jsx-runtime";const p=({children:p,onContentChange:m,disabled:h,validate:g,additionalButtons:_,...v})=>{let{isAuthenticated:y}=a(),[b,x]=s(p),[S,C]=s(0),w=b!==p,T=()=>{x(p),C(e=>e+1)},E=()=>{m(b)},D=e=>x(e.currentTarget.value??``),O=e=>{e.key===`Enter`&&(e.metaKey||e.ctrlKey)&&!h&&k?(e.preventDefault(),E()):e.key===`Escape`&&(e.preventDefault(),T())};o(()=>{x(p),C(e=>e+1)},[p]);let k=g?.(b)??!0;return f(`div`,{className:`flex size-full flex-col items-center justify-between gap-2`,role:`group`,"aria-label":`Content editor textarea`,children:[d(i,{onChange:D,onKeyDown:O,variant:`invisible`,className:`size-full`,value:p,isActive:y,disabled:h,"aria-label":`Editable textarea content`,"aria-describedby":w||_?`content-editor-textarea-actions`:void 0,"aria-invalid":!k,...v},S),(w||_)&&f(`div`,{id:`content-editor-textarea-actions`,className:`flex w-full items-center justify-end gap-2`,role:`group`,"aria-label":`Edit actions`,children:[w&&f(u,{children:[d(e,{Icon:c,label:`Save changes${k?``:` (invalid content)`}`,variant:r.HOVERABLE,color:t.TEXT,size:n.ICON_SM,className:`cursor-pointer hover:scale-110`,disabled:h||!k,onClick:E,"aria-describedby":k?void 0:`textarea-validation-error`}),d(e,{Icon:l,label:`Cancel changes`,variant:r.HOVERABLE,size:n.ICON_SM,color:t.TEXT,className:`cursor-pointer hover:scale-110`,onClick:T,disabled:h})]}),_]})]},p)};export{p as ContentEditorTextArea};
 //# sourceMappingURL=ContentEditorTextArea.mjs.map

package/dist/esm/components/CopyButton/index.mjs

@@ -1,2 +1,2 @@
-"use client";import{Button as e,ButtonColor as t,ButtonSize as n,ButtonVariant as r}from"../Button/Button.mjs";import{CopyCheckIcon as i,CopyIcon as a}from"lucide-react";import{useEffect as o,useState as s}from"react";import{jsx as c}from"react/jsx-runtime";import{useIntlayer as l}from"react-intlayer";const u=({content:u,...d})=>{let[f,p]=s(!1),[m,h]=s(!1),{label:g}=l(`copy-button`),_=async()=>{try{h(!1),await navigator.clipboard.writeText(u),p(!0)}catch(e){console.error(`Failed to copy text: `,e),h(!0)}};o(()=>{if(f||m){let e=setTimeout(()=>{p(!1),h(!1)},1e3);return()=>clearTimeout(e)}},[f,m]);let v=()=>f?`Content copied to clipboard`:m?`Failed to copy content`:d.label??g.value;return c(e,{Icon:f?i:a,onClick:_,variant:r.HOVERABLE,color:t.TEXT,size:n.ICON_SM,tabIndex:0,title:v(),...d,label:v(),"aria-describedby":f?`copy-success`:m?`copy-error`:void 0})};export{u as CopyButton};
+"use client";import{Button as e,ButtonColor as t,ButtonSize as n,ButtonVariant as r}from"../Button/Button.mjs";import{useEffect as i,useState as a}from"react";import{CopyCheckIcon as o,CopyIcon as s}from"lucide-react";import{jsx as c}from"react/jsx-runtime";import{useIntlayer as l}from"react-intlayer";const u=({content:u,...d})=>{let[f,p]=a(!1),[m,h]=a(!1),{label:g}=l(`copy-button`),_=async()=>{try{h(!1),await navigator.clipboard.writeText(u),p(!0)}catch(e){console.error(`Failed to copy text: `,e),h(!0)}};i(()=>{if(f||m){let e=setTimeout(()=>{p(!1),h(!1)},1e3);return()=>clearTimeout(e)}},[f,m]);let v=()=>f?`Content copied to clipboard`:m?`Failed to copy content`:d.label??g.value;return c(e,{Icon:f?o:s,onClick:_,variant:r.HOVERABLE,color:t.TEXT,size:n.ICON_SM,tabIndex:0,title:v(),...d,label:v(),"aria-describedby":f?`copy-success`:m?`copy-error`:void 0})};export{u as CopyButton};
 //# sourceMappingURL=index.mjs.map

package/dist/esm/components/CopyToClipboard/index.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"../../utils/cn.mjs";import{CopyCheck as t,CopyIcon as n}from"lucide-react";import{useState as r}from"react";import{jsx as i,jsxs as a}from"react/jsx-runtime";const o=(e,t=2e3,n,i)=>{let[a,o]=r(!1);return{isCopied:a,copy:async()=>{if(e)try{if(navigator.clipboard?.writeText)await navigator.clipboard.writeText(e);else{i?.(Error(`Clipboard API not supported in this browser`));return}o(!0),setTimeout(()=>o(!1),t),n?.()}catch(e){let t=e instanceof Error?e.message:`Failed to copy to clipboard`;i?.(e instanceof Error?e:Error(t))}}}},s=({text:r,children:s,className:c,"aria-label":l=`Copy to clipboard`,"aria-copied-label":u=`Copied to clipboard`,feedbackDuration:d=2e3,onCopySuccess:f,onCopyError:p,disable:m,preventDefault:h=!0,stopPropagation:g=!0,size:_=14})=>{let{isCopied:v,copy:y}=o(r,d,f,p);if(m)return i(`span`,{className:c,children:s});let b=e=>{(e.key===`Enter`||e.key===` `)&&x(e)},x=e=>{h&&e.preventDefault(),g&&e.stopPropagation(),y()},S=v?u:l,C=v?t:n;return a(`span`,{className:e(`inline-flex max-w-full cursor-pointer items-center gap-2 rounded-md p-0.5 hover:bg-neutral/10`,c),onClick:x,onKeyDown:b,role:`button`,tabIndex:0,"aria-label":S,"aria-pressed":v,"data-testid":`copy-to-clipboard`,children:[i(`span`,{className:`min-w-0 break-all`,children:s}),r&&i(C,{className:`ml-1 ml-auto shrink-0`,size:_,"aria-hidden":`true`})]})};export{s as CopyToClipboard,o as useCopyToClipboard};
+"use client";import{cn as e}from"../../utils/cn.mjs";import{useState as t}from"react";import{CopyCheck as n,CopyIcon as r}from"lucide-react";import{jsx as i,jsxs as a}from"react/jsx-runtime";const o=(e,n=2e3,r,i)=>{let[a,o]=t(!1);return{isCopied:a,copy:async()=>{if(e)try{if(navigator.clipboard?.writeText)await navigator.clipboard.writeText(e);else{i?.(Error(`Clipboard API not supported in this browser`));return}o(!0),setTimeout(()=>o(!1),n),r?.()}catch(e){let t=e instanceof Error?e.message:`Failed to copy to clipboard`;i?.(e instanceof Error?e:Error(t))}}}},s=({text:t,children:s,className:c,"aria-label":l=`Copy to clipboard`,"aria-copied-label":u=`Copied to clipboard`,feedbackDuration:d=2e3,onCopySuccess:f,onCopyError:p,disable:m,preventDefault:h=!0,stopPropagation:g=!0,size:_=14})=>{let{isCopied:v,copy:y}=o(t,d,f,p);if(m)return i(`span`,{className:c,children:s});let b=e=>{(e.key===`Enter`||e.key===` `)&&x(e)},x=e=>{h&&e.preventDefault(),g&&e.stopPropagation(),y()},S=v?u:l,C=v?n:r;return a(`span`,{className:e(`inline-flex max-w-full cursor-pointer items-center gap-2 rounded-md p-0.5 hover:bg-neutral/10`,c),onClick:x,onKeyDown:b,role:`button`,tabIndex:0,"aria-label":S,"aria-pressed":v,"data-testid":`copy-to-clipboard`,children:[i(`span`,{className:`min-w-0 break-all`,children:s}),t&&i(C,{className:`ml-1 ml-auto shrink-0`,size:_,"aria-hidden":`true`})]})};export{s as CopyToClipboard,o as useCopyToClipboard};
 //# sourceMappingURL=index.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"DictionaryEditor.mjs","names":[],"sources":["../../../../src/components/DictionaryEditor/DictionaryEditor.tsx"],"sourcesContent":["'use client';\n\nimport {\n  useEditedContent,\n  useFocusUnmergedDictionary,\n} from '@intlayer/editor-react';\nimport type { Dictionary, Locale } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { NodeWrapper } from './NodeWrapper';\n\ntype DictionaryEditorProps = {\n  dictionary: Dictionary;\n  locale: Locale;\n  onDelete?: () => void;\n};\n\nexport const DictionaryEditor: FC<DictionaryEditorProps> = ({\n  dictionary,\n  ...props\n}) => {\n  const { editedContent, addEditedContent } = useEditedContent();\n  const { focusedContent, setFocusedContentKeyPath } =\n    useFocusUnmergedDictionary();\n\n  return (\n    <div className=\"flex flex-col gap-2\">\n      <NodeWrapper\n        {...props}\n        keyPath={[]}\n        dictionary={dictionary}\n        key={JSON.stringify(\n          (editedContent?.[dictionary.localId!] ?? dictionary).content\n        )}\n        editedContent={editedContent?.[dictionary.localId!]?.content}\n        focusedKeyPath={focusedContent?.keyPath}\n        section={dictionary.content}\n        onContentChange={(content) => {\n          addEditedContent(\n            dictionary.localId!,\n            content.newValue,\n            content.keyPath\n          );\n        }}\n        onFocusKeyPath={setFocusedContentKeyPath}\n      />\n    </div>\n  );\n};\n"],"mappings":"2OAgBA,MAAa,GAA+C,CAC1D,aACA,GAAG,KACC,CACJ,GAAM,CAAE,gBAAe,oBAAqB,GAAkB,CACxD,CAAE,iBAAgB,4BACtB,GAA4B,CAE9B,OACE,EAAC,MAAD,CAAK,UAAU,+BACb,EAAC,EAAD,CACE,GAAI,EACJ,QAAS,EAAE,CACC,aACZ,IAAK,KAAK,WACP,IAAgB,EAAW,UAAa,GAAY,QACtD,CACD,cAAe,IAAgB,EAAW,UAAW,QACrD,eAAgB,GAAgB,QAChC,QAAS,EAAW,QACpB,gBAAkB,GAAY,CAC5B,EACE,EAAW,QACX,EAAQ,SACR,EAAQ,QACT,EAEH,eAAgB,EAChB,CAAA,CACE,CAAA"}
+{"version":3,"file":"DictionaryEditor.mjs","names":[],"sources":["../../../../src/components/DictionaryEditor/DictionaryEditor.tsx"],"sourcesContent":["'use client';\n\nimport {\n  useEditedContent,\n  useFocusUnmergedDictionary,\n} from '@intlayer/editor-react';\nimport type { Dictionary } from '@intlayer/types/dictionary';\nimport type { Locale } from '@intlayer/types/allLocales';\nimport type { FC } from 'react';\nimport { NodeWrapper } from './NodeWrapper';\n\ntype DictionaryEditorProps = {\n  dictionary: Dictionary;\n  locale: Locale;\n  onDelete?: () => void;\n};\n\nexport const DictionaryEditor: FC<DictionaryEditorProps> = ({\n  dictionary,\n  ...props\n}) => {\n  const { editedContent, addEditedContent } = useEditedContent();\n  const { focusedContent, setFocusedContentKeyPath } =\n    useFocusUnmergedDictionary();\n\n  return (\n    <div className=\"flex flex-col gap-2\">\n      <NodeWrapper\n        {...props}\n        keyPath={[]}\n        dictionary={dictionary}\n        key={JSON.stringify(\n          (editedContent?.[dictionary.localId!] ?? dictionary).content\n        )}\n        editedContent={editedContent?.[dictionary.localId!]?.content}\n        focusedKeyPath={focusedContent?.keyPath}\n        section={dictionary.content}\n        onContentChange={(content) => {\n          addEditedContent(\n            dictionary.localId!,\n            content.newValue,\n            content.keyPath\n          );\n        }}\n        onFocusKeyPath={setFocusedContentKeyPath}\n      />\n    </div>\n  );\n};\n"],"mappings":"2OAiBA,MAAa,GAA+C,CAC1D,aACA,GAAG,KACC,CACJ,GAAM,CAAE,gBAAe,oBAAqB,GAAkB,CACxD,CAAE,iBAAgB,4BACtB,GAA4B,CAE9B,OACE,EAAC,MAAD,CAAK,UAAU,+BACb,EAAC,EAAD,CACE,GAAI,EACJ,QAAS,EAAE,CACC,aACZ,IAAK,KAAK,WACP,IAAgB,EAAW,UAAa,GAAY,QACtD,CACD,cAAe,IAAgB,EAAW,UAAW,QACrD,eAAgB,GAAgB,QAChC,QAAS,EAAW,QACpB,gBAAkB,GAAY,CAC5B,EACE,EAAW,QACX,EAAQ,SACR,EAAQ,QACT,EAEH,eAAgB,EAChB,CAAA,CACE,CAAA"}

package/dist/esm/components/DictionaryEditor/NodeWrapper/ArrayWrapper.mjs

@@ -1,2 +1,2 @@
-import{ItemLayout as e}from"../ItemLayout.mjs";import{NodeWrapper as t}from"./index.mjs";import{jsx as n}from"react/jsx-runtime";import{NodeType as r}from"@intlayer/types";import{isSameKeyPath as i}from"@intlayer/core/utils";const a=a=>{let{keyPath:o,section:s,onFocusKeyPath:c,focusedKeyPath:l=[]}=a;return s.map((s,u)=>{let d={key:u,type:r.Array},f=[...o,d];return n(e,{level:o.length,title:`${u}`,description:``,isSelected:i(f,l),onClick:e=>{e.stopPropagation(),c(f)},children:n(t,{...a,keyPath:f,section:s})},JSON.stringify(s))})};export{a as ArrayWrapper};
+import{ItemLayout as e}from"../ItemLayout.mjs";import{NodeWrapper as t}from"./index.mjs";import{jsx as n}from"react/jsx-runtime";import{NodeType as r}from"@intlayer/types/nodeType";import{isSameKeyPath as i}from"@intlayer/core/utils";const a=a=>{let{keyPath:o,section:s,onFocusKeyPath:c,focusedKeyPath:l=[]}=a;return s.map((s,u)=>{let d={key:u,type:r.Array},f=[...o,d];return n(e,{level:o.length,title:`${u}`,description:``,isSelected:i(f,l),onClick:e=>{e.stopPropagation(),c(f)},children:n(t,{...a,keyPath:f,section:s})},JSON.stringify(s))})};export{a as ArrayWrapper};
 //# sourceMappingURL=ArrayWrapper.mjs.map

package/dist/esm/components/DictionaryEditor/NodeWrapper/ArrayWrapper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ArrayWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/ArrayWrapper.tsx"],"sourcesContent":["import { isSameKeyPath } from '@intlayer/core/utils';\nimport type { ContentNode } from '@intlayer/types';\nimport { type KeyPath, NodeType } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { ItemLayout } from '../ItemLayout';\nimport { NodeWrapper, type NodeWrapperProps } from './index';\n\ntype ArrayWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: ContentNode[];\n};\n\nexport const ArrayWrapper: FC<ArrayWrapperProps> = (props) => {\n  const { keyPath, section, onFocusKeyPath, focusedKeyPath = [] } = props;\n\n  return section.map((subSection, key) => {\n    const newKeyPathEl: KeyPath = {\n      key,\n      type: NodeType.Array,\n    };\n    const newKeyPath: KeyPath[] = [...keyPath, newKeyPathEl];\n\n    return (\n      <ItemLayout\n        level={keyPath.length}\n        key={JSON.stringify(subSection)}\n        title={`${key}`}\n        description=\"\"\n        isSelected={isSameKeyPath(newKeyPath, focusedKeyPath)}\n        onClick={(e) => {\n          e.stopPropagation();\n          onFocusKeyPath(newKeyPath);\n        }}\n      >\n        <NodeWrapper {...props} keyPath={newKeyPath} section={subSection} />\n      </ItemLayout>\n    );\n  });\n};\n"],"mappings":"iOAWA,MAAa,EAAuC,GAAU,CAC5D,GAAM,CAAE,UAAS,UAAS,iBAAgB,iBAAiB,EAAE,EAAK,EAElE,OAAO,EAAQ,KAAK,EAAY,IAAQ,CACtC,IAAM,EAAwB,CAC5B,MACA,KAAM,EAAS,MAChB,CACK,EAAwB,CAAC,GAAG,EAAS,EAAa,CAExD,OACE,EAAC,EAAD,CACE,MAAO,EAAQ,OAEf,MAAO,GAAG,IACV,YAAY,GACZ,WAAY,EAAc,EAAY,EAAe,CACrD,QAAU,GAAM,CACd,EAAE,iBAAiB,CACnB,EAAe,EAAW,WAG5B,EAAC,EAAD,CAAa,GAAI,EAAO,QAAS,EAAY,QAAS,EAAc,CAAA,CACzD,CAVN,KAAK,UAAU,EAAW,CAUpB,EAEf"}
+{"version":3,"file":"ArrayWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/ArrayWrapper.tsx"],"sourcesContent":["import { isSameKeyPath } from '@intlayer/core/utils';\nimport type { ContentNode } from '@intlayer/types/dictionary';\nimport type { KeyPath } from '@intlayer/types/keyPath';;\nimport { NodeType } from '@intlayer/types/nodeType';\nimport type { FC } from 'react';\nimport { ItemLayout } from '../ItemLayout';\nimport { NodeWrapper, type NodeWrapperProps } from './index';\n\ntype ArrayWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: ContentNode[];\n};\n\nexport const ArrayWrapper: FC<ArrayWrapperProps> = (props) => {\n  const { keyPath, section, onFocusKeyPath, focusedKeyPath = [] } = props;\n\n  return section.map((subSection, key) => {\n    const newKeyPathEl: KeyPath = {\n      key,\n      type: NodeType.Array,\n    };\n    const newKeyPath: KeyPath[] = [...keyPath, newKeyPathEl];\n\n    return (\n      <ItemLayout\n        level={keyPath.length}\n        key={JSON.stringify(subSection)}\n        title={`${key}`}\n        description=\"\"\n        isSelected={isSameKeyPath(newKeyPath, focusedKeyPath)}\n        onClick={(e) => {\n          e.stopPropagation();\n          onFocusKeyPath(newKeyPath);\n        }}\n      >\n        <NodeWrapper {...props} keyPath={newKeyPath} section={subSection} />\n      </ItemLayout>\n    );\n  });\n};\n"],"mappings":"0OAYA,MAAa,EAAuC,GAAU,CAC5D,GAAM,CAAE,UAAS,UAAS,iBAAgB,iBAAiB,EAAE,EAAK,EAElE,OAAO,EAAQ,KAAK,EAAY,IAAQ,CACtC,IAAM,EAAwB,CAC5B,MACA,KAAM,EAAS,MAChB,CACK,EAAwB,CAAC,GAAG,EAAS,EAAa,CAExD,OACE,EAAC,EAAD,CACE,MAAO,EAAQ,OAEf,MAAO,GAAG,IACV,YAAY,GACZ,WAAY,EAAc,EAAY,EAAe,CACrD,QAAU,GAAM,CACd,EAAE,iBAAiB,CACnB,EAAe,EAAW,WAG5B,EAAC,EAAD,CAAa,GAAI,EAAO,QAAS,EAAY,QAAS,EAAc,CAAA,CACzD,CAVN,KAAK,UAAU,EAAW,CAUpB,EAEf"}

package/dist/esm/components/DictionaryEditor/NodeWrapper/ConditionWrapper.mjs

@@ -1,2 +1,2 @@
-import{NodeWrapper as e,traceKeys as t}from"./index.mjs";import{createElement as n}from"react";import{Fragment as r,jsx as i,jsxs as a}from"react/jsx-runtime";import{NodeType as o}from"@intlayer/types";const s=s=>{let{keyPath:c,section:l}=s;return i(`div`,{className:`ml-2 grid grid-cols-[auto,1fr] gap-2`,children:Object.keys(l).filter(e=>!t.includes(e)).map(t=>{let u={type:o.Condition,key:t},d=[...c,u],f=l[o.Condition][t];return a(r,{children:[i(`span`,{className:`flex items-center font-bold`,children:t}),n(e,{...s,key:t,keyPath:d,section:f})]})})})};export{s as ConditionWrapper};
+import{NodeWrapper as e,traceKeys as t}from"./index.mjs";import{createElement as n}from"react";import{Fragment as r,jsx as i,jsxs as a}from"react/jsx-runtime";import{NodeType as o}from"@intlayer/types/nodeType";const s=s=>{let{keyPath:c,section:l}=s;return i(`div`,{className:`ml-2 grid grid-cols-[auto,1fr] gap-2`,children:Object.keys(l).filter(e=>!t.includes(e)).map(t=>{let u={type:o.Condition,key:t},d=[...c,u],f=l[o.Condition][t];return a(r,{children:[i(`span`,{className:`flex items-center font-bold`,children:t}),n(e,{...s,key:t,keyPath:d,section:f})]})})})};export{s as ConditionWrapper};
 //# sourceMappingURL=ConditionWrapper.mjs.map

package/dist/esm/components/DictionaryEditor/NodeWrapper/ConditionWrapper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ConditionWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/ConditionWrapper.tsx"],"sourcesContent":["import type { ConditionContent } from '@intlayer/core/transpiler';\nimport { type ContentNode, type KeyPath, NodeType } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { NodeWrapper, type NodeWrapperProps, traceKeys } from './index';\n\ntype ConditionWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: ConditionContent<ContentNode>;\n};\n\nexport const ConditionWrapper: FC<ConditionWrapperProps> = (props) => {\n  const { keyPath, section } = props;\n\n  return (\n    <div className=\"ml-2 grid grid-cols-[auto,1fr] gap-2\">\n      {Object.keys(section)\n        .filter((key) => !traceKeys.includes(key))\n        .map((key) => {\n          const newKeyPathEl: KeyPath = {\n            type: NodeType.Condition,\n            key,\n          };\n          const newKeyPath: KeyPath[] = [...keyPath, newKeyPathEl];\n\n          const subSection =\n            section[NodeType.Condition][\n              key as keyof (typeof section)[NodeType.Condition]\n            ]!;\n\n          return (\n            <>\n              <span className=\"flex items-center font-bold\">{key}</span>\n              <NodeWrapper\n                {...props}\n                key={key}\n                keyPath={newKeyPath}\n                section={subSection}\n              />\n            </>\n          );\n        })}\n    </div>\n  );\n};\n"],"mappings":"0MASA,MAAa,EAA+C,GAAU,CACpE,GAAM,CAAE,UAAS,WAAY,EAE7B,OACE,EAAC,MAAD,CAAK,UAAU,gDACZ,OAAO,KAAK,EAAQ,CAClB,OAAQ,GAAQ,CAAC,EAAU,SAAS,EAAI,CAAC,CACzC,IAAK,GAAQ,CACZ,IAAM,EAAwB,CAC5B,KAAM,EAAS,UACf,MACD,CACK,EAAwB,CAAC,GAAG,EAAS,EAAa,CAElD,EACJ,EAAQ,EAAS,WACf,GAGJ,OACE,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,OAAD,CAAM,UAAU,uCAA+B,EAAW,CAAA,CAC1D,EAAC,EAAD,CACE,GAAI,EACC,MACL,QAAS,EACT,QAAS,EACT,CAAA,CACD,CAAA,CAAA,EAEL,CACA,CAAA"}
+{"version":3,"file":"ConditionWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/ConditionWrapper.tsx"],"sourcesContent":["import type { ConditionContent } from '@intlayer/core/transpiler';\nimport type { ContentNode } from '@intlayer/types/dictionary';\nimport type { KeyPath } from '@intlayer/types/keyPath';;\nimport { NodeType } from '@intlayer/types/nodeType';\nimport type { FC } from 'react';\nimport { NodeWrapper, type NodeWrapperProps, traceKeys } from './index';\n\ntype ConditionWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: ConditionContent<ContentNode>;\n};\n\nexport const ConditionWrapper: FC<ConditionWrapperProps> = (props) => {\n  const { keyPath, section } = props;\n\n  return (\n    <div className=\"ml-2 grid grid-cols-[auto,1fr] gap-2\">\n      {Object.keys(section)\n        .filter((key) => !traceKeys.includes(key))\n        .map((key) => {\n          const newKeyPathEl: KeyPath = {\n            type: NodeType.Condition,\n            key,\n          };\n          const newKeyPath: KeyPath[] = [...keyPath, newKeyPathEl];\n\n          const subSection =\n            section[NodeType.Condition][\n              key as keyof (typeof section)[NodeType.Condition]\n            ]!;\n\n          return (\n            <>\n              <span className=\"flex items-center font-bold\">{key}</span>\n              <NodeWrapper\n                {...props}\n                key={key}\n                keyPath={newKeyPath}\n                section={subSection}\n              />\n            </>\n          );\n        })}\n    </div>\n  );\n};\n"],"mappings":"mNAWA,MAAa,EAA+C,GAAU,CACpE,GAAM,CAAE,UAAS,WAAY,EAE7B,OACE,EAAC,MAAD,CAAK,UAAU,gDACZ,OAAO,KAAK,EAAQ,CAClB,OAAQ,GAAQ,CAAC,EAAU,SAAS,EAAI,CAAC,CACzC,IAAK,GAAQ,CACZ,IAAM,EAAwB,CAC5B,KAAM,EAAS,UACf,MACD,CACK,EAAwB,CAAC,GAAG,EAAS,EAAa,CAElD,EACJ,EAAQ,EAAS,WACf,GAGJ,OACE,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,OAAD,CAAM,UAAU,uCAA+B,EAAW,CAAA,CAC1D,EAAC,EAAD,CACE,GAAI,EACC,MACL,QAAS,EACT,QAAS,EACT,CAAA,CACD,CAAA,CAAA,EAEL,CACA,CAAA"}

package/dist/esm/components/DictionaryEditor/NodeWrapper/EnumerationWrapper.mjs

@@ -1,2 +1,2 @@
-import{NodeWrapper as e,traceKeys as t}from"./index.mjs";import{createElement as n}from"react";import{Fragment as r,jsx as i,jsxs as a}from"react/jsx-runtime";import{NodeType as o}from"@intlayer/types";const s=s=>{let{keyPath:c,section:l}=s;return i(`div`,{className:`ml-2 grid grid-cols-[auto,1fr] gap-2`,children:Object.keys(l).filter(e=>!t.includes(e)).map(t=>{let u={type:o.Enumeration,key:t},d=[...c,u],f=l[o.Enumeration][t];return a(r,{children:[i(`span`,{className:`flex items-center font-bold`,children:t}),n(e,{...s,key:t,keyPath:d,section:f})]})})})};export{s as EnumerationWrapper};
+import{NodeWrapper as e,traceKeys as t}from"./index.mjs";import{createElement as n}from"react";import{Fragment as r,jsx as i,jsxs as a}from"react/jsx-runtime";import{NodeType as o}from"@intlayer/types/nodeType";const s=s=>{let{keyPath:c,section:l}=s;return i(`div`,{className:`ml-2 grid grid-cols-[auto,1fr] gap-2`,children:Object.keys(l).filter(e=>!t.includes(e)).map(t=>{let u={type:o.Enumeration,key:t},d=[...c,u],f=l[o.Enumeration][t];return a(r,{children:[i(`span`,{className:`flex items-center font-bold`,children:t}),n(e,{...s,key:t,keyPath:d,section:f})]})})})};export{s as EnumerationWrapper};
 //# sourceMappingURL=EnumerationWrapper.mjs.map

package/dist/esm/components/DictionaryEditor/NodeWrapper/EnumerationWrapper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"EnumerationWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/EnumerationWrapper.tsx"],"sourcesContent":["import type { EnumerationContent } from '@intlayer/core/transpiler';\nimport { type ContentNode, type KeyPath, NodeType } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { NodeWrapper, type NodeWrapperProps, traceKeys } from './index';\n\ntype EnumerationWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: EnumerationContent<ContentNode>;\n};\n\nexport const EnumerationWrapper: FC<EnumerationWrapperProps> = (props) => {\n  const { keyPath, section } = props;\n\n  return (\n    <div className=\"ml-2 grid grid-cols-[auto,1fr] gap-2\">\n      {Object.keys(section)\n        .filter((key) => !traceKeys.includes(key))\n        .map((key) => {\n          const newKeyPathEl: KeyPath = {\n            type: NodeType.Enumeration,\n            key,\n          };\n          const newKeyPath: KeyPath[] = [...keyPath, newKeyPathEl];\n\n          const subSection =\n            section[NodeType.Enumeration][\n              key as keyof (typeof section)[NodeType.Enumeration]\n            ]!;\n\n          return (\n            <>\n              <span className=\"flex items-center font-bold\">{key}</span>\n              <NodeWrapper\n                {...props}\n                key={key}\n                keyPath={newKeyPath}\n                section={subSection}\n              />\n            </>\n          );\n        })}\n    </div>\n  );\n};\n"],"mappings":"0MASA,MAAa,EAAmD,GAAU,CACxE,GAAM,CAAE,UAAS,WAAY,EAE7B,OACE,EAAC,MAAD,CAAK,UAAU,gDACZ,OAAO,KAAK,EAAQ,CAClB,OAAQ,GAAQ,CAAC,EAAU,SAAS,EAAI,CAAC,CACzC,IAAK,GAAQ,CACZ,IAAM,EAAwB,CAC5B,KAAM,EAAS,YACf,MACD,CACK,EAAwB,CAAC,GAAG,EAAS,EAAa,CAElD,EACJ,EAAQ,EAAS,aACf,GAGJ,OACE,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,OAAD,CAAM,UAAU,uCAA+B,EAAW,CAAA,CAC1D,EAAC,EAAD,CACE,GAAI,EACC,MACL,QAAS,EACT,QAAS,EACT,CAAA,CACD,CAAA,CAAA,EAEL,CACA,CAAA"}
+{"version":3,"file":"EnumerationWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/EnumerationWrapper.tsx"],"sourcesContent":["import type { EnumerationContent } from '@intlayer/core/transpiler';\nimport type { ContentNode } from '@intlayer/types/dictionary';\nimport type { KeyPath } from '@intlayer/types/keyPath';\nimport { NodeType } from '@intlayer/types/nodeType';\nimport type { FC } from 'react';\nimport { NodeWrapper, type NodeWrapperProps, traceKeys } from './index';\n\ntype EnumerationWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: EnumerationContent<ContentNode>;\n};\n\nexport const EnumerationWrapper: FC<EnumerationWrapperProps> = (props) => {\n  const { keyPath, section } = props;\n\n  return (\n    <div className=\"ml-2 grid grid-cols-[auto,1fr] gap-2\">\n      {Object.keys(section)\n        .filter((key) => !traceKeys.includes(key))\n        .map((key) => {\n          const newKeyPathEl: KeyPath = {\n            type: NodeType.Enumeration,\n            key,\n          };\n          const newKeyPath: KeyPath[] = [...keyPath, newKeyPathEl];\n\n          const subSection =\n            section[NodeType.Enumeration][\n              key as keyof (typeof section)[NodeType.Enumeration]\n            ]!;\n\n          return (\n            <>\n              <span className=\"flex items-center font-bold\">{key}</span>\n              <NodeWrapper\n                {...props}\n                key={key}\n                keyPath={newKeyPath}\n                section={subSection}\n              />\n            </>\n          );\n        })}\n    </div>\n  );\n};\n"],"mappings":"mNAWA,MAAa,EAAmD,GAAU,CACxE,GAAM,CAAE,UAAS,WAAY,EAE7B,OACE,EAAC,MAAD,CAAK,UAAU,gDACZ,OAAO,KAAK,EAAQ,CAClB,OAAQ,GAAQ,CAAC,EAAU,SAAS,EAAI,CAAC,CACzC,IAAK,GAAQ,CACZ,IAAM,EAAwB,CAC5B,KAAM,EAAS,YACf,MACD,CACK,EAAwB,CAAC,GAAG,EAAS,EAAa,CAElD,EACJ,EAAQ,EAAS,aACf,GAGJ,OACE,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,OAAD,CAAM,UAAU,uCAA+B,EAAW,CAAA,CAC1D,EAAC,EAAD,CACE,GAAI,EACC,MACL,QAAS,EACT,QAAS,EACT,CAAA,CACD,CAAA,CAAA,EAEL,CACA,CAAA"}

package/dist/esm/components/DictionaryEditor/NodeWrapper/FileWrapper.mjs

@@ -1,2 +1,2 @@
-import{StringWrapper as e}from"./StringWrapper.mjs";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useEditedContent as r}from"@intlayer/editor-react";import{getContentNodeByKeyPath as i}from"@intlayer/core/dictionaryManipulator";import{NodeType as a}from"@intlayer/types";const o=o=>{let{keyPath:s,section:c}=o,{addEditedContent:l}=r(),u=i(o.editedContent,s),d=c[a.File],{content:f}=c,p=[...s,{type:a.File}];return n(`div`,{className:`ml-2 grid grid-cols-[auto,1fr] gap-2`,children:[n(`span`,{className:`text-neutral text-sm`,children:[d,` `]}),t(e,{...o,keyPath:p,section:f,editedContentValue:u?.content,onContentChange:e=>{l(o.dictionary.localId,{...c,content:e.newValue},s)}})]})};export{o as FileWrapper};
+import{StringWrapper as e}from"./StringWrapper.mjs";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useEditedContent as r}from"@intlayer/editor-react";import{getContentNodeByKeyPath as i}from"@intlayer/core/dictionaryManipulator";import{NodeType as a}from"@intlayer/types/nodeType";const o=o=>{let{keyPath:s,section:c}=o,{addEditedContent:l}=r(),u=i(o.editedContent,s),d=c[a.File],{content:f}=c,p=[...s,{type:a.File}];return n(`div`,{className:`ml-2 grid grid-cols-[auto,1fr] gap-2`,children:[n(`span`,{className:`text-neutral text-sm`,children:[d,` `]}),t(e,{...o,keyPath:p,section:f,editedContentValue:u?.content,onContentChange:e=>{l(o.dictionary.localId,{...c,content:e.newValue},s)}})]})};export{o as FileWrapper};
 //# sourceMappingURL=FileWrapper.mjs.map

package/dist/esm/components/DictionaryEditor/NodeWrapper/FileWrapper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FileWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/FileWrapper.tsx"],"sourcesContent":["import { getContentNodeByKeyPath } from '@intlayer/core/dictionaryManipulator';\nimport type { FileContent } from '@intlayer/core/transpiler';\nimport { useEditedContent } from '@intlayer/editor-react';\nimport {\n  type KeyPath,\n  type LocalDictionaryId,\n  NodeType,\n} from '@intlayer/types';\nimport type { FC } from 'react';\nimport { StringWrapper, type StringWrapperProps } from './StringWrapper';\n\ntype FileWrapperProps = Omit<StringWrapperProps, 'section'> & {\n  section: FileContent;\n};\n\nexport const FileWrapper: FC<FileWrapperProps> = (props) => {\n  const { keyPath, section } = props;\n  const { addEditedContent } = useEditedContent();\n  const editedContentValue = getContentNodeByKeyPath(\n    props.editedContent,\n    keyPath\n  ) as FileContent | undefined;\n\n  const subSection = section[NodeType.File];\n  const { content } = section;\n\n  const newKeyPath: KeyPath[] = [\n    ...keyPath,\n    {\n      type: NodeType.File,\n    },\n  ];\n\n  return (\n    <div className=\"ml-2 grid grid-cols-[auto,1fr] gap-2\">\n      <span className=\"text-neutral text-sm\">{subSection} </span>\n      <StringWrapper\n        {...props}\n        keyPath={newKeyPath}\n        section={content}\n        editedContentValue={editedContentValue?.content}\n        onContentChange={(content) => {\n          addEditedContent(\n            props.dictionary.localId as LocalDictionaryId,\n            {\n              ...section,\n              content: content.newValue,\n            } as FileContent,\n            keyPath\n          );\n        }}\n      />\n    </div>\n  );\n};\n"],"mappings":"0RAeA,MAAa,EAAqC,GAAU,CAC1D,GAAM,CAAE,UAAS,WAAY,EACvB,CAAE,oBAAqB,GAAkB,CACzC,EAAqB,EACzB,EAAM,cACN,EACD,CAEK,EAAa,EAAQ,EAAS,MAC9B,CAAE,WAAY,EAEd,EAAwB,CAC5B,GAAG,EACH,CACE,KAAM,EAAS,KAChB,CACF,CAED,OACE,EAAC,MAAD,CAAK,UAAU,gDAAf,CACE,EAAC,OAAD,CAAM,UAAU,gCAAhB,CAAwC,EAAW,IAAQ,GAC3D,EAAC,EAAD,CACE,GAAI,EACJ,QAAS,EACT,QAAS,EACT,mBAAoB,GAAoB,QACxC,gBAAkB,GAAY,CAC5B,EACE,EAAM,WAAW,QACjB,CACE,GAAG,EACH,QAAS,EAAQ,SAClB,CACD,EACD,EAEH,CAAA,CACE"}
+{"version":3,"file":"FileWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/FileWrapper.tsx"],"sourcesContent":["import { getContentNodeByKeyPath } from '@intlayer/core/dictionaryManipulator';\nimport type { FileContent } from '@intlayer/core/transpiler';\nimport { useEditedContent } from '@intlayer/editor-react';\nimport type { LocalDictionaryId } from '@intlayer/types/dictionary';\nimport type { KeyPath } from '@intlayer/types/keyPath';\nimport { NodeType } from '@intlayer/types/nodeType';\nimport type { FC } from 'react';\nimport { StringWrapper, type StringWrapperProps } from './StringWrapper';\n\ntype FileWrapperProps = Omit<StringWrapperProps, 'section'> & {\n  section: FileContent;\n};\n\nexport const FileWrapper: FC<FileWrapperProps> = (props) => {\n  const { keyPath, section } = props;\n  const { addEditedContent } = useEditedContent();\n  const editedContentValue = getContentNodeByKeyPath(\n    props.editedContent,\n    keyPath\n  ) as FileContent | undefined;\n\n  const subSection = section[NodeType.File];\n  const { content } = section;\n\n  const newKeyPath: KeyPath[] = [\n    ...keyPath,\n    {\n      type: NodeType.File,\n    },\n  ];\n\n  return (\n    <div className=\"ml-2 grid grid-cols-[auto,1fr] gap-2\">\n      <span className=\"text-neutral text-sm\">{subSection} </span>\n      <StringWrapper\n        {...props}\n        keyPath={newKeyPath}\n        section={content}\n        editedContentValue={editedContentValue?.content}\n        onContentChange={(content) => {\n          addEditedContent(\n            props.dictionary.localId as LocalDictionaryId,\n            {\n              ...section,\n              content: content.newValue,\n            } as FileContent,\n            keyPath\n          );\n        }}\n      />\n    </div>\n  );\n};\n"],"mappings":"mSAaA,MAAa,EAAqC,GAAU,CAC1D,GAAM,CAAE,UAAS,WAAY,EACvB,CAAE,oBAAqB,GAAkB,CACzC,EAAqB,EACzB,EAAM,cACN,EACD,CAEK,EAAa,EAAQ,EAAS,MAC9B,CAAE,WAAY,EAEd,EAAwB,CAC5B,GAAG,EACH,CACE,KAAM,EAAS,KAChB,CACF,CAED,OACE,EAAC,MAAD,CAAK,UAAU,gDAAf,CACE,EAAC,OAAD,CAAM,UAAU,gCAAhB,CAAwC,EAAW,IAAQ,GAC3D,EAAC,EAAD,CACE,GAAI,EACJ,QAAS,EACT,QAAS,EACT,mBAAoB,GAAoB,QACxC,gBAAkB,GAAY,CAC5B,EACE,EAAM,WAAW,QACjB,CACE,GAAG,EACH,QAAS,EAAQ,SAClB,CACD,EACD,EAEH,CAAA,CACE"}

package/dist/esm/components/DictionaryEditor/NodeWrapper/HtmlWrapper.mjs

@@ -1,2 +1,2 @@
-import{NodeWrapper as e}from"./index.mjs";import{jsx as t}from"react/jsx-runtime";import{NodeType as n}from"@intlayer/types";const r=r=>{let{keyPath:i,section:a}=r,o=[...i,{type:n.HTML}],s=a[n.HTML];return t(`div`,{className:`ml-2 grid grid-cols-[auto,1fr] gap-2`,children:t(e,{...r,keyPath:o,section:s})})};export{r as HtmlWrapper};
+import{NodeWrapper as e}from"./index.mjs";import{jsx as t}from"react/jsx-runtime";import{NodeType as n}from"@intlayer/types/nodeType";const r=r=>{let{keyPath:i,section:a}=r,o=[...i,{type:n.HTML}],s=a[n.HTML];return t(`div`,{className:`ml-2 grid grid-cols-[auto,1fr] gap-2`,children:t(e,{...r,keyPath:o,section:s})})};export{r as HtmlWrapper};
 //# sourceMappingURL=HtmlWrapper.mjs.map

package/dist/esm/components/DictionaryEditor/NodeWrapper/HtmlWrapper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"HtmlWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/HtmlWrapper.tsx"],"sourcesContent":["import type { HTMLContent } from '@intlayer/core/transpiler';\nimport { type ContentNode, type KeyPath, NodeType } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { NodeWrapper, type NodeWrapperProps } from './index';\n\ntype HtmlWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: HTMLContent<ContentNode>;\n};\n\nexport const HtmlWrapper: FC<HtmlWrapperProps> = (props) => {\n  const { keyPath, section } = props;\n\n  const newKeyPath: KeyPath[] = [\n    ...keyPath,\n    {\n      type: NodeType.HTML,\n    },\n  ];\n\n  const subSection = section[NodeType.HTML] as ContentNode;\n\n  return (\n    <div className=\"ml-2 grid grid-cols-[auto,1fr] gap-2\">\n      <NodeWrapper {...props} keyPath={newKeyPath} section={subSection} />\n    </div>\n  );\n};\n"],"mappings":"6HASA,MAAa,EAAqC,GAAU,CAC1D,GAAM,CAAE,UAAS,WAAY,EAEvB,EAAwB,CAC5B,GAAG,EACH,CACE,KAAM,EAAS,KAChB,CACF,CAEK,EAAa,EAAQ,EAAS,MAEpC,OACE,EAAC,MAAD,CAAK,UAAU,gDACb,EAAC,EAAD,CAAa,GAAI,EAAO,QAAS,EAAY,QAAS,EAAc,CAAA,CAChE,CAAA"}
+{"version":3,"file":"HtmlWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/HtmlWrapper.tsx"],"sourcesContent":["import type { HTMLContent } from '@intlayer/core/transpiler';\nimport type { ContentNode } from '@intlayer/types/dictionary';\nimport type { KeyPath } from '@intlayer/types/keyPath';;\nimport { NodeType } from '@intlayer/types/nodeType';\nimport type { FC } from 'react';\nimport { NodeWrapper, type NodeWrapperProps } from './index';\n\ntype HtmlWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: HTMLContent<ContentNode>;\n};\n\nexport const HtmlWrapper: FC<HtmlWrapperProps> = (props) => {\n  const { keyPath, section } = props;\n\n  const newKeyPath: KeyPath[] = [\n    ...keyPath,\n    {\n      type: NodeType.HTML,\n    },\n  ];\n\n  const subSection = section[NodeType.HTML] as ContentNode;\n\n  return (\n    <div className=\"ml-2 grid grid-cols-[auto,1fr] gap-2\">\n      <NodeWrapper {...props} keyPath={newKeyPath} section={subSection} />\n    </div>\n  );\n};\n"],"mappings":"sIAWA,MAAa,EAAqC,GAAU,CAC1D,GAAM,CAAE,UAAS,WAAY,EAEvB,EAAwB,CAC5B,GAAG,EACH,CACE,KAAM,EAAS,KAChB,CACF,CAEK,EAAa,EAAQ,EAAS,MAEpC,OACE,EAAC,MAAD,CAAK,UAAU,gDACb,EAAC,EAAD,CAAa,GAAI,EAAO,QAAS,EAAY,QAAS,EAAc,CAAA,CAChE,CAAA"}

package/dist/esm/components/DictionaryEditor/NodeWrapper/InsertionWrapper.mjs

@@ -1,2 +1,2 @@
-import{NodeWrapper as e}from"./index.mjs";import{jsx as t}from"react/jsx-runtime";import{NodeType as n}from"@intlayer/types";const r=r=>{let{keyPath:i,section:a}=r,o=[...i,{type:n.Insertion}],s=a[n.Insertion];return t(`div`,{className:`ml-2 grid grid-cols-[auto,1fr] gap-2`,children:t(e,{...r,keyPath:o,section:s})})};export{r as InsertionWrapper};
+import{NodeWrapper as e}from"./index.mjs";import{jsx as t}from"react/jsx-runtime";import{NodeType as n}from"@intlayer/types/nodeType";const r=r=>{let{keyPath:i,section:a}=r,o=[...i,{type:n.Insertion}],s=a[n.Insertion];return t(`div`,{className:`ml-2 grid grid-cols-[auto,1fr] gap-2`,children:t(e,{...r,keyPath:o,section:s})})};export{r as InsertionWrapper};
 //# sourceMappingURL=InsertionWrapper.mjs.map

package/dist/esm/components/DictionaryEditor/NodeWrapper/InsertionWrapper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"InsertionWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/InsertionWrapper.tsx"],"sourcesContent":["import type { InsertionContent } from '@intlayer/core/transpiler';\nimport { type ContentNode, type KeyPath, NodeType } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { NodeWrapper, type NodeWrapperProps } from './index';\n\ntype InsertionWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: InsertionContent<ContentNode>;\n};\n\nexport const InsertionWrapper: FC<InsertionWrapperProps> = (props) => {\n  const { keyPath, section } = props;\n\n  const newKeyPath: KeyPath[] = [\n    ...keyPath,\n    {\n      type: NodeType.Insertion,\n    },\n  ];\n\n  const subSection = section[NodeType.Insertion];\n\n  return (\n    <div className=\"ml-2 grid grid-cols-[auto,1fr] gap-2\">\n      <NodeWrapper {...props} keyPath={newKeyPath} section={subSection} />\n    </div>\n  );\n};\n"],"mappings":"6HASA,MAAa,EAA+C,GAAU,CACpE,GAAM,CAAE,UAAS,WAAY,EAEvB,EAAwB,CAC5B,GAAG,EACH,CACE,KAAM,EAAS,UAChB,CACF,CAEK,EAAa,EAAQ,EAAS,WAEpC,OACE,EAAC,MAAD,CAAK,UAAU,gDACb,EAAC,EAAD,CAAa,GAAI,EAAO,QAAS,EAAY,QAAS,EAAc,CAAA,CAChE,CAAA"}
+{"version":3,"file":"InsertionWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/InsertionWrapper.tsx"],"sourcesContent":["import type { InsertionContent } from '@intlayer/core/transpiler';\nimport type { ContentNode } from '@intlayer/types/dictionary';\nimport type { KeyPath } from '@intlayer/types/keyPath';\nimport { NodeType } from '@intlayer/types/nodeType';\nimport type { FC } from 'react';\nimport { NodeWrapper, type NodeWrapperProps } from './index';\n\ntype InsertionWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: InsertionContent<ContentNode>;\n};\n\nexport const InsertionWrapper: FC<InsertionWrapperProps> = (props) => {\n  const { keyPath, section } = props;\n\n  const newKeyPath: KeyPath[] = [\n    ...keyPath,\n    {\n      type: NodeType.Insertion,\n    },\n  ];\n\n  const subSection = section[NodeType.Insertion];\n\n  return (\n    <div className=\"ml-2 grid grid-cols-[auto,1fr] gap-2\">\n      <NodeWrapper {...props} keyPath={newKeyPath} section={subSection} />\n    </div>\n  );\n};\n"],"mappings":"sIAWA,MAAa,EAA+C,GAAU,CACpE,GAAM,CAAE,UAAS,WAAY,EAEvB,EAAwB,CAC5B,GAAG,EACH,CACE,KAAM,EAAS,UAChB,CACF,CAEK,EAAa,EAAQ,EAAS,WAEpC,OACE,EAAC,MAAD,CAAK,UAAU,gDACb,EAAC,EAAD,CAAa,GAAI,EAAO,QAAS,EAAY,QAAS,EAAc,CAAA,CAChE,CAAA"}

package/dist/esm/components/DictionaryEditor/NodeWrapper/MarkdownWrapper.mjs

@@ -1,2 +1,2 @@
-import{NodeWrapper as e}from"./index.mjs";import{jsx as t}from"react/jsx-runtime";import{NodeType as n}from"@intlayer/types";const r=r=>{let{keyPath:i,section:a}=r,o=[...i,{type:n.Markdown}],s=a[n.Markdown];return t(`div`,{className:`ml-2 grid grid-cols-[auto,1fr] gap-2`,children:t(e,{...r,keyPath:o,section:s})})};export{r as MarkdownWrapper};
+import{NodeWrapper as e}from"./index.mjs";import{jsx as t}from"react/jsx-runtime";import{NodeType as n}from"@intlayer/types/nodeType";const r=r=>{let{keyPath:i,section:a}=r,o=[...i,{type:n.Markdown}],s=a[n.Markdown];return t(`div`,{className:`ml-2 grid grid-cols-[auto,1fr] gap-2`,children:t(e,{...r,keyPath:o,section:s})})};export{r as MarkdownWrapper};
 //# sourceMappingURL=MarkdownWrapper.mjs.map

package/dist/esm/components/DictionaryEditor/NodeWrapper/MarkdownWrapper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MarkdownWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/MarkdownWrapper.tsx"],"sourcesContent":["import type { MarkdownContent } from '@intlayer/core/transpiler';\nimport { type ContentNode, type KeyPath, NodeType } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { NodeWrapper, type NodeWrapperProps } from './index';\n\ntype MarkdownWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: MarkdownContent<ContentNode>;\n};\n\nexport const MarkdownWrapper: FC<MarkdownWrapperProps> = (props) => {\n  const { keyPath, section } = props;\n\n  const newKeyPath: KeyPath[] = [\n    ...keyPath,\n    {\n      type: NodeType.Markdown,\n    },\n  ];\n\n  const subSection = section[NodeType.Markdown] as ContentNode;\n\n  return (\n    <div className=\"ml-2 grid grid-cols-[auto,1fr] gap-2\">\n      <NodeWrapper {...props} keyPath={newKeyPath} section={subSection} />\n    </div>\n  );\n};\n"],"mappings":"6HASA,MAAa,EAA6C,GAAU,CAClE,GAAM,CAAE,UAAS,WAAY,EAEvB,EAAwB,CAC5B,GAAG,EACH,CACE,KAAM,EAAS,SAChB,CACF,CAEK,EAAa,EAAQ,EAAS,UAEpC,OACE,EAAC,MAAD,CAAK,UAAU,gDACb,EAAC,EAAD,CAAa,GAAI,EAAO,QAAS,EAAY,QAAS,EAAc,CAAA,CAChE,CAAA"}
+{"version":3,"file":"MarkdownWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/MarkdownWrapper.tsx"],"sourcesContent":["import type { MarkdownContent } from '@intlayer/core/transpiler';\nimport type { ContentNode } from '@intlayer/types/dictionary';\nimport type { KeyPath } from '@intlayer/types/keyPath';;\nimport { NodeType } from '@intlayer/types/nodeType';\nimport type { FC } from 'react';\nimport { NodeWrapper, type NodeWrapperProps } from './index';\n\ntype MarkdownWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: MarkdownContent<ContentNode>;\n};\n\nexport const MarkdownWrapper: FC<MarkdownWrapperProps> = (props) => {\n  const { keyPath, section } = props;\n\n  const newKeyPath: KeyPath[] = [\n    ...keyPath,\n    {\n      type: NodeType.Markdown,\n    },\n  ];\n\n  const subSection = section[NodeType.Markdown] as ContentNode;\n\n  return (\n    <div className=\"ml-2 grid grid-cols-[auto,1fr] gap-2\">\n      <NodeWrapper {...props} keyPath={newKeyPath} section={subSection} />\n    </div>\n  );\n};\n"],"mappings":"sIAWA,MAAa,EAA6C,GAAU,CAClE,GAAM,CAAE,UAAS,WAAY,EAEvB,EAAwB,CAC5B,GAAG,EACH,CACE,KAAM,EAAS,SAChB,CACF,CAEK,EAAa,EAAQ,EAAS,UAEpC,OACE,EAAC,MAAD,CAAK,UAAU,gDACb,EAAC,EAAD,CAAa,GAAI,EAAO,QAAS,EAAY,QAAS,EAAc,CAAA,CAChE,CAAA"}

package/dist/esm/components/DictionaryEditor/NodeWrapper/NestedObjectWrapper.mjs

@@ -1,2 +1,2 @@
-import{ItemLayout as e}from"../ItemLayout.mjs";import{NodeWrapper as t,traceKeys as n}from"./index.mjs";import{memo as r,useMemo as i}from"react";import{jsx as a}from"react/jsx-runtime";import{NodeType as o}from"@intlayer/types";import{isSameKeyPath as s}from"@intlayer/core/utils";import{camelCaseToSentence as c}from"@intlayer/config/client";const l=r(r=>{let{keyPath:l,section:u,focusedKeyPath:d=[],onFocusKeyPath:f}=r;return i(()=>Object.keys(u??{}).filter(e=>!n.includes(e)),[u]).map(n=>{let i={key:n,type:o.Object},p=[...l,i],m=s(p,d);return a(e,{level:l.length,title:c(n),description:``,isSelected:m,onClick:e=>{e.stopPropagation(),f(m?[]:p)},children:a(t,{...r,keyPath:p,section:u[n]})},n)})});export{l as NestedObjectWrapper};
+import{ItemLayout as e}from"../ItemLayout.mjs";import{NodeWrapper as t,traceKeys as n}from"./index.mjs";import{memo as r,useMemo as i}from"react";import{jsx as a}from"react/jsx-runtime";import{camelCaseToSentence as o}from"@intlayer/config/client";import{NodeType as s}from"@intlayer/types/nodeType";import{isSameKeyPath as c}from"@intlayer/core/utils";const l=r(r=>{let{keyPath:l,section:u,focusedKeyPath:d=[],onFocusKeyPath:f}=r;return i(()=>Object.keys(u??{}).filter(e=>!n.includes(e)),[u]).map(n=>{let i={key:n,type:s.Object},p=[...l,i],m=c(p,d);return a(e,{level:l.length,title:o(n),description:``,isSelected:m,onClick:e=>{e.stopPropagation(),f(m?[]:p)},children:a(t,{...r,keyPath:p,section:u[n]})},n)})});export{l as NestedObjectWrapper};
 //# sourceMappingURL=NestedObjectWrapper.mjs.map

package/dist/esm/components/DictionaryEditor/NodeWrapper/NestedObjectWrapper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"NestedObjectWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/NestedObjectWrapper.tsx"],"sourcesContent":["import { camelCaseToSentence } from '@intlayer/config/client';\nimport { isSameKeyPath } from '@intlayer/core/utils';\nimport { type ContentNode, type KeyPath, NodeType } from '@intlayer/types';\nimport { type FC, memo, useMemo } from 'react';\nimport { ItemLayout } from '../ItemLayout';\nimport { NodeWrapper, type NodeWrapperProps, traceKeys } from './index';\n\ntype NestedObjectWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: Record<string, ContentNode>;\n};\n\nexport const NestedObjectWrapper: FC<NestedObjectWrapperProps> = memo(\n  (props) => {\n    const { keyPath, section, focusedKeyPath = [], onFocusKeyPath } = props;\n\n    const sectionKeys = useMemo(\n      () =>\n        Object.keys(section ?? {}).filter((key) => !traceKeys.includes(key)),\n      [section]\n    );\n\n    return sectionKeys.map((key) => {\n      const newKeyPathEl: KeyPath = { key, type: NodeType.Object };\n      const newKeyPath: KeyPath[] = [...keyPath, newKeyPathEl];\n\n      const isSelected = isSameKeyPath(newKeyPath, focusedKeyPath);\n\n      return (\n        <ItemLayout\n          level={keyPath.length}\n          key={key}\n          title={camelCaseToSentence(key)}\n          description=\"\"\n          isSelected={isSelected}\n          onClick={(e) => {\n            e.stopPropagation();\n\n            if (isSelected) {\n              onFocusKeyPath([]);\n            } else {\n              onFocusKeyPath(newKeyPath);\n            }\n          }}\n        >\n          <NodeWrapper {...props} keyPath={newKeyPath} section={section[key]} />\n        </ItemLayout>\n      );\n    });\n  }\n);\n"],"mappings":"wVAWA,MAAa,EAAoD,EAC9D,GAAU,CACT,GAAM,CAAE,UAAS,UAAS,iBAAiB,EAAE,CAAE,kBAAmB,EAQlE,OANoB,MAEhB,OAAO,KAAK,GAAW,EAAE,CAAC,CAAC,OAAQ,GAAQ,CAAC,EAAU,SAAS,EAAI,CAAC,CACtE,CAAC,EAAQ,CACV,CAEkB,IAAK,GAAQ,CAC9B,IAAM,EAAwB,CAAE,MAAK,KAAM,EAAS,OAAQ,CACtD,EAAwB,CAAC,GAAG,EAAS,EAAa,CAElD,EAAa,EAAc,EAAY,EAAe,CAE5D,OACE,EAAC,EAAD,CACE,MAAO,EAAQ,OAEf,MAAO,EAAoB,EAAI,CAC/B,YAAY,GACA,aACZ,QAAU,GAAM,CACd,EAAE,iBAAiB,CAGjB,EADE,EACa,EAAE,CAEF,EAAW,WAI9B,EAAC,EAAD,CAAa,GAAI,EAAO,QAAS,EAAY,QAAS,EAAQ,GAAQ,CAAA,CAC3D,CAfN,EAeM,EAEf,EAEL"}
+{"version":3,"file":"NestedObjectWrapper.mjs","names":[],"sources":["../../../../../src/components/DictionaryEditor/NodeWrapper/NestedObjectWrapper.tsx"],"sourcesContent":["import { camelCaseToSentence } from '@intlayer/config/client';\nimport { isSameKeyPath } from '@intlayer/core/utils';\nimport type { ContentNode } from '@intlayer/types/dictionary';\nimport type { KeyPath } from '@intlayer/types/keyPath';;\nimport { NodeType } from '@intlayer/types/nodeType';\nimport { type FC, memo, useMemo } from 'react';\nimport { ItemLayout } from '../ItemLayout';\nimport { NodeWrapper, type NodeWrapperProps, traceKeys } from './index';\n\ntype NestedObjectWrapperProps = Omit<NodeWrapperProps, 'section'> & {\n  section: Record<string, ContentNode>;\n};\n\nexport const NestedObjectWrapper: FC<NestedObjectWrapperProps> = memo(\n  (props) => {\n    const { keyPath, section, focusedKeyPath = [], onFocusKeyPath } = props;\n\n    const sectionKeys = useMemo(\n      () =>\n        Object.keys(section ?? {}).filter((key) => !traceKeys.includes(key)),\n      [section]\n    );\n\n    return sectionKeys.map((key) => {\n      const newKeyPathEl: KeyPath = { key, type: NodeType.Object };\n      const newKeyPath: KeyPath[] = [...keyPath, newKeyPathEl];\n\n      const isSelected = isSameKeyPath(newKeyPath, focusedKeyPath);\n\n      return (\n        <ItemLayout\n          level={keyPath.length}\n          key={key}\n          title={camelCaseToSentence(key)}\n          description=\"\"\n          isSelected={isSelected}\n          onClick={(e) => {\n            e.stopPropagation();\n\n            if (isSelected) {\n              onFocusKeyPath([]);\n            } else {\n              onFocusKeyPath(newKeyPath);\n            }\n          }}\n        >\n          <NodeWrapper {...props} keyPath={newKeyPath} section={section[key]} />\n        </ItemLayout>\n      );\n    });\n  }\n);\n"],"mappings":"iWAaA,MAAa,EAAoD,EAC9D,GAAU,CACT,GAAM,CAAE,UAAS,UAAS,iBAAiB,EAAE,CAAE,kBAAmB,EAQlE,OANoB,MAEhB,OAAO,KAAK,GAAW,EAAE,CAAC,CAAC,OAAQ,GAAQ,CAAC,EAAU,SAAS,EAAI,CAAC,CACtE,CAAC,EAAQ,CACV,CAEkB,IAAK,GAAQ,CAC9B,IAAM,EAAwB,CAAE,MAAK,KAAM,EAAS,OAAQ,CACtD,EAAwB,CAAC,GAAG,EAAS,EAAa,CAElD,EAAa,EAAc,EAAY,EAAe,CAE5D,OACE,EAAC,EAAD,CACE,MAAO,EAAQ,OAEf,MAAO,EAAoB,EAAI,CAC/B,YAAY,GACA,aACZ,QAAU,GAAM,CACd,EAAE,iBAAiB,CAGjB,EADE,EACa,EAAE,CAEF,EAAW,WAI9B,EAAC,EAAD,CAAa,GAAI,EAAO,QAAS,EAAY,QAAS,EAAQ,GAAQ,CAAA,CAC3D,CAfN,EAeM,EAEf,EAEL"}

package/dist/esm/components/DictionaryEditor/NodeWrapper/TranslationWrapper.mjs

@@ -1,2 +1,2 @@
-import{NodeWrapper as e}from"./index.mjs";import{jsx as t}from"react/jsx-runtime";import{NodeType as n}from"@intlayer/types";const r=r=>{let{keyPath:i,section:a,locale:o}=r,s={type:n.Translation,key:o},c=[...i,s],l=a.translation[o];return t(e,{...r,keyPath:c,section:l})};export{r as TranslationWrapper};
+import{NodeWrapper as e}from"./index.mjs";import{jsx as t}from"react/jsx-runtime";import{NodeType as n}from"@intlayer/types/nodeType";const r=r=>{let{keyPath:i,section:a,locale:o}=r,s={type:n.Translation,key:o},c=[...i,s],l=a.translation[o];return t(e,{...r,keyPath:c,section:l})};export{r as TranslationWrapper};
 //# sourceMappingURL=TranslationWrapper.mjs.map