@intlayer/design-system 8.9.6 → 8.9.8

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

@@ -1 +1 @@
-{"version":3,"file":"Accordion.mjs","names":[],"sources":["../../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@utils/cn';\nimport { ChevronDown } from 'lucide-react';\nimport {\n  type FC,\n  type KeyboardEvent,\n  type MouseEvent,\n  type ReactNode,\n  useId,\n  useState,\n} from 'react';\nimport {\n  Button,\n  ButtonColor,\n  type ButtonProps,\n  ButtonVariant,\n} from '../Button';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\n\nexport interface AccordionProps\n  extends Omit<ButtonProps, 'children' | 'onToggle'> {\n  /** The content displayed in the accordion header */\n  header: ReactNode;\n  /** The collapsible content inside the accordion */\n  children: ReactNode;\n  /** Controls whether the accordion is open (controlled mode) */\n  isOpen?: boolean;\n  /** Default open state (uncontrolled mode) */\n  defaultIsOpen?: boolean;\n  /** Called when the accordion state changes */\n  onToggle?: (isOpen: boolean) => void;\n  /** Disable the accordion interaction */\n  disabled?: boolean;\n  /** Custom class for the content container */\n  contentClassName?: string;\n  /** Custom class for the header container */\n  headerClassName?: string;\n  /** Accessible label for screen readers */\n  'aria-label'?: string;\n  /** ID for the accordion content (for aria-controls) */\n  contentId?: string;\n}\n\n/**\n * Accordion component that allows the user to expand and collapse content.\n * It provides a header with a chevron icon that controls the visibility of the content.\n *\n * Features:\n * - Supports both controlled and uncontrolled modes\n * - Accessible with proper ARIA attributes\n * - Keyboard navigation support\n * - Smooth animations for expand/collapse\n * - Customizable styling\n *\n * @param header - The content of the header.\n * @param children - The content to be expanded and collapsed.\n * @param isOpen - Controlled state for whether the content is expanded.\n * @param defaultIsOpen - Default open state for uncontrolled mode.\n * @param onToggle - Callback when the accordion state changes.\n * @param disabled - Whether the accordion is disabled.\n * @param contentClassName - Custom class for the content container.\n * @param headerClassName - Custom class for the header.\n * @param contentId - ID for the content (used for aria-controls).\n *\n * @example\n * // Uncontrolled mode\n * <Accordion header=\"Accordion Header\" defaultIsOpen={true}>\n *   <p>Accordion content</p>\n * </Accordion>\n *\n * @example\n * // Controlled mode\n * <Accordion\n *   header=\"Controlled Accordion\"\n *   isOpen={isOpen}\n *   onToggle={setIsOpen}\n * >\n *   <p>Controlled content</p>\n * </Accordion>\n */\nexport const Accordion: FC<AccordionProps> = ({\n  children,\n  header,\n  isOpen,\n  defaultIsOpen = false,\n  onToggle,\n  onClick,\n  disabled = false,\n  contentClassName,\n  headerClassName,\n  contentId,\n  'aria-label': ariaLabel,\n  ...props\n}) => {\n  // Determine if we're in controlled or uncontrolled mode\n  const isControlled = isOpen !== undefined;\n  const [internalIsOpen, setInternalIsOpen] = useState(defaultIsOpen);\n  const id = useId();\n\n  // Use controlled value if provided, otherwise use internal state\n  const isExpandedState = isControlled ? isOpen : internalIsOpen;\n  const isHidden = !isExpandedState;\n\n  // Generate unique ID for content if not provided\n  const generatedContentId = contentId ?? `${id}-accordion-content`;\n\n  const handleToggle = (e: MouseEvent<HTMLButtonElement>) => {\n    if (disabled) return;\n\n    const newIsOpen = !isExpandedState;\n\n    // Update internal state if uncontrolled\n    if (!isControlled) {\n      setInternalIsOpen(newIsOpen);\n    }\n\n    // Call external handlers\n    onToggle?.(newIsOpen);\n    onClick?.(e);\n  };\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\n    // Enter and Space should toggle the accordion\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      handleToggle(e as any);\n    }\n  };\n\n  return (\n    <div className=\"w-full\">\n      <Button\n        variant={ButtonVariant.HOVERABLE}\n        color={ButtonColor.TEXT}\n        onClick={handleToggle}\n        onKeyDown={handleKeyDown}\n        disabled={disabled}\n        isFullWidth\n        className={cn(\n          'flex items-center justify-between gap-2',\n          headerClassName\n        )}\n        IconRight={ChevronDown}\n        iconClassName={cn(\n          'transform transition-transform duration-500 ease-in-out',\n          isExpandedState ? 'rotate-0' : '-rotate-180'\n        )}\n        aria-expanded={isExpandedState}\n        aria-controls={generatedContentId}\n        aria-label={ariaLabel}\n        role=\"button\"\n        {...props}\n      >\n        {header}\n      </Button>\n\n      <MaxHeightSmoother\n        id={generatedContentId}\n        tabIndex={isHidden ? -1 : undefined}\n        isHidden={isHidden}\n        className={contentClassName}\n        role=\"region\"\n        aria-labelledby={generatedContentId}\n      >\n        {children}\n      </MaxHeightSmoother>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiFA,MAAa,aAAiC,EAC5C,UACA,QACA,QACA,gBAAgB,OAChB,UACA,SACA,WAAW,OACX,kBACA,iBACA,WACA,cAAc,WACd,GAAG,YACC;CAEJ,MAAM,eAAe,WAAW;CAChC,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,cAAc;CACnE,MAAM,KAAK,OAAO;CAGlB,MAAM,kBAAkB,eAAe,SAAS;CAChD,MAAM,WAAW,CAAC;CAGlB,MAAM,qBAAqB,aAAa,GAAG,GAAG;CAE9C,MAAM,gBAAgB,MAAqC;EACzD,IAAI,UAAU;EAEd,MAAM,YAAY,CAAC;EAGnB,IAAI,CAAC,cACH,kBAAkB,UAAU;EAI9B,WAAW,UAAU;EACrB,UAAU,EAAE;;CAGd,MAAM,iBAAiB,MAAwC;EAE7D,IAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;GACtC,EAAE,gBAAgB;GAClB,aAAa,EAAS;;;CAI1B,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,QAAD;GACE;GACA;GACA,SAAS;GACT,WAAW;GACD;GACV;GACA,WAAW,GACT,2CACA,gBACD;GACD,WAAW;GACX,eAAe,GACb,2DACA,kBAAkB,aAAa,cAChC;GACD,iBAAe;GACf,iBAAe;GACf,cAAY;GACZ,MAAK;GACL,GAAI;aAEH;GACM,GAET,oBAAC,mBAAD;GACE,IAAI;GACJ,UAAU,WAAW,KAAK;GAChB;GACV,WAAW;GACX,MAAK;GACL,mBAAiB;GAEhB;GACiB,EAChB"}
+{"version":3,"file":"Accordion.mjs","names":[],"sources":["../../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@utils/cn';\nimport { ChevronDown } from 'lucide-react';\nimport {\n  type FC,\n  type KeyboardEvent,\n  type MouseEvent,\n  type ReactNode,\n  useId,\n  useState,\n} from 'react';\nimport {\n  Button,\n  ButtonColor,\n  type ButtonProps,\n  ButtonVariant,\n} from '../Button';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\n\nexport interface AccordionProps\n  extends Omit<ButtonProps, 'children' | 'onToggle'> {\n  /** The content displayed in the accordion header */\n  header: ReactNode;\n  /** The collapsible content inside the accordion */\n  children: ReactNode;\n  /** Controls whether the accordion is open (controlled mode) */\n  isOpen?: boolean;\n  /** Default open state (uncontrolled mode) */\n  defaultIsOpen?: boolean;\n  /** Called when the accordion state changes */\n  onToggle?: (isOpen: boolean) => void;\n  /** Disable the accordion interaction */\n  disabled?: boolean;\n  /** Custom class for the content container */\n  contentClassName?: string;\n  /** Custom class for the header container */\n  headerClassName?: string;\n  /** Accessible label for screen readers */\n  'aria-label'?: string;\n  /** ID for the accordion content (for aria-controls) */\n  contentId?: string;\n}\n\n/**\n * Accordion component that allows the user to expand and collapse content.\n * It provides a header with a chevron icon that controls the visibility of the content.\n *\n * Features:\n * - Supports both controlled and uncontrolled modes\n * - Accessible with proper ARIA attributes\n * - Keyboard navigation support\n * - Smooth animations for expand/collapse\n * - Customizable styling\n *\n * @param header - The content of the header.\n * @param children - The content to be expanded and collapsed.\n * @param isOpen - Controlled state for whether the content is expanded.\n * @param defaultIsOpen - Default open state for uncontrolled mode.\n * @param onToggle - Callback when the accordion state changes.\n * @param disabled - Whether the accordion is disabled.\n * @param contentClassName - Custom class for the content container.\n * @param headerClassName - Custom class for the header.\n * @param contentId - ID for the content (used for aria-controls).\n *\n * @example\n * // Uncontrolled mode\n * <Accordion header=\"Accordion Header\" defaultIsOpen={true}>\n *   <p>Accordion content</p>\n * </Accordion>\n *\n * @example\n * // Controlled mode\n * <Accordion\n *   header=\"Controlled Accordion\"\n *   isOpen={isOpen}\n *   onToggle={setIsOpen}\n * >\n *   <p>Controlled content</p>\n * </Accordion>\n */\nexport const Accordion: FC<AccordionProps> = ({\n  children,\n  header,\n  isOpen,\n  defaultIsOpen = false,\n  onToggle,\n  onClick,\n  disabled = false,\n  contentClassName,\n  headerClassName,\n  contentId,\n  'aria-label': ariaLabel,\n  ...props\n}) => {\n  // Determine if we're in controlled or uncontrolled mode\n  const isControlled = isOpen !== undefined;\n  const [internalIsOpen, setInternalIsOpen] = useState(defaultIsOpen);\n  const id = useId();\n\n  // Use controlled value if provided, otherwise use internal state\n  const isExpandedState = isControlled ? isOpen : internalIsOpen;\n  const isHidden = !isExpandedState;\n\n  // Generate unique ID for content if not provided\n  const generatedContentId = contentId ?? `${id}-accordion-content`;\n\n  const handleToggle = (e: MouseEvent<HTMLButtonElement>) => {\n    if (disabled) return;\n\n    const newIsOpen = !isExpandedState;\n\n    // Update internal state if uncontrolled\n    if (!isControlled) {\n      setInternalIsOpen(newIsOpen);\n    }\n\n    // Call external handlers\n    onToggle?.(newIsOpen);\n    onClick?.(e);\n  };\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\n    // Enter and Space should toggle the accordion\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      handleToggle(e as any);\n    }\n  };\n\n  return (\n    <div className=\"w-full\">\n      <Button\n        variant={ButtonVariant.HOVERABLE}\n        color={ButtonColor.TEXT}\n        onClick={handleToggle}\n        onKeyDown={handleKeyDown}\n        disabled={disabled}\n        isFullWidth\n        className={cn(\n          'flex items-center justify-between gap-2',\n          headerClassName\n        )}\n        IconRight={ChevronDown}\n        iconClassName={cn(\n          'transform transition-transform duration-500 ease-in-out',\n          isExpandedState ? 'rotate-0' : '-rotate-180'\n        )}\n        aria-expanded={isExpandedState}\n        aria-controls={generatedContentId}\n        aria-label={ariaLabel}\n        role=\"button\"\n        {...props}\n      >\n        {header}\n      </Button>\n\n      <MaxHeightSmoother\n        id={generatedContentId}\n        tabIndex={isHidden ? -1 : undefined}\n        isHidden={isHidden}\n        className={contentClassName}\n        role=\"region\"\n        aria-labelledby={generatedContentId}\n      >\n        {children}\n      </MaxHeightSmoother>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiFA,MAAa,aAAiC,EAC5C,UACA,QACA,QACA,gBAAgB,OAChB,UACA,SACA,WAAW,OACX,kBACA,iBACA,WACA,cAAc,WACd,GAAG,YACC;CAEJ,MAAM,eAAe,WAAW;CAChC,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,aAAa;CAClE,MAAM,KAAK,MAAM;CAGjB,MAAM,kBAAkB,eAAe,SAAS;CAChD,MAAM,WAAW,CAAC;CAGlB,MAAM,qBAAqB,aAAa,GAAG,GAAG;CAE9C,MAAM,gBAAgB,MAAqC;EACzD,IAAI,UAAU;EAEd,MAAM,YAAY,CAAC;EAGnB,IAAI,CAAC,cACH,kBAAkB,SAAS;EAI7B,WAAW,SAAS;EACpB,UAAU,CAAC;CACb;CAEA,MAAM,iBAAiB,MAAwC;EAE7D,IAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;GACtC,EAAE,eAAe;GACjB,aAAa,CAAQ;EACvB;CACF;CAEA,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,QAAD;GACE;GACA;GACA,SAAS;GACT,WAAW;GACD;GACV;GACA,WAAW,GACT,2CACA,eACF;GACA,WAAW;GACX,eAAe,GACb,2DACA,kBAAkB,aAAa,aACjC;GACA,iBAAe;GACf,iBAAe;GACf,cAAY;GACZ,MAAK;GACL,GAAI;aAEH;EACK,IAER,oBAAC,mBAAD;GACE,IAAI;GACJ,UAAU,WAAW,KAAK;GAChB;GACV,WAAW;GACX,MAAK;GACL,mBAAiB;GAEhB;EACgB,EAChB;;AAET"}

package/dist/esm/components/Avatar/image.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"image.mjs","names":[],"sources":["../../../../src/components/Avatar/image.ts"],"sourcesContent":["enum ImageProvider {\n  Picsum = 'picsum',\n  Dummy = 'dummy',\n}\n\nenum ImageType {\n  Avatar = 'avatar',\n  Random = 'random',\n}\n\n/**\n * Generates a random image URL based on the specified provider and type.\n *\n * @param provider - The image provider to use (e.g., Unsplash, Picsum, Dummy)\n * @param type - The type of image to generate (Avatar or Random)\n * @returns A URL string pointing to a random image\n *\n * @example\n * ```ts\n * getRandomImageUrl(ImageProvider.Picsum, ImageType.Random) // 'https://picsum.photos/800/600?random=123'\n * getRandomImageUrl(ImageProvider.Dummy, ImageType.Avatar) // 'https://dummyimage.com/200x200/000/fff&text=Avatar'\n * ```\n */\nexport function getRandomImageUrl(\n  provider: ImageProvider,\n  type: ImageType\n): string {\n  switch (provider) {\n    case ImageProvider.Picsum:\n      if (type === ImageType.Avatar) {\n        return `https://picsum.photos/200/200?random=${Math.floor(Math.random() * 1000)}`;\n      } else {\n        return `https://picsum.photos/800/600?random=${Math.floor(Math.random() * 1000)}`;\n      }\n\n    case ImageProvider.Dummy:\n      if (type === ImageType.Avatar) {\n        return `https://dummyimage.com/200x200/000/fff&text=Avatar`;\n      } else {\n        return `https://dummyimage.com/800x600/000/fff&text=Random`;\n      }\n\n    default:\n      throw new Error(`Provider not supported: ${provider}`);\n  }\n}\n\n/**\n * Generates a random image URL for avatar images based on the specified provider.\n *\n * @param provider - The image provider to use (e.g., Unsplash, Picsum, Dummy)\n * @returns A URL string pointing to a random avatar image\n *\n * @example\n * ```ts\n * getAvatarImageUrl(ImageProvider.Picsum) // 'https://picsum.photos/200/200?random=123'\n * getAvatarImageUrl(ImageProvider.Dummy) // 'https://dummyimage.com/200x200/000/fff&text=Avatar'\n * ```\n */\nexport function getAvatarImageUrl(\n  provider: ImageProvider = ImageProvider.Picsum\n): string {\n  return getRandomImageUrl(provider, ImageType.Avatar);\n}\n"],"mappings":";;;;;;;;;;;;;;AAuBA,SAAgB,kBACd,UACA,MACQ;CACR,QAAQ,UAAR;EACE,eACE,IAAI,mBACF,OAAO,wCAAwC,KAAK,MAAM,KAAK,QAAQ,GAAG,IAAK;OAE/E,OAAO,wCAAwC,KAAK,MAAM,KAAK,QAAQ,GAAG,IAAK;EAGnF,cACE,IAAI,mBACF,OAAO;OAEP,OAAO;EAGX,SACE,MAAM,IAAI,MAAM,2BAA2B,WAAW;;;;;;;;;;;;;;;AAgB5D,SAAgB,kBACd,qBACQ;CACR,OAAO,kBAAkB,mBAA2B"}
+{"version":3,"file":"image.mjs","names":[],"sources":["../../../../src/components/Avatar/image.ts"],"sourcesContent":["enum ImageProvider {\n  Picsum = 'picsum',\n  Dummy = 'dummy',\n}\n\nenum ImageType {\n  Avatar = 'avatar',\n  Random = 'random',\n}\n\n/**\n * Generates a random image URL based on the specified provider and type.\n *\n * @param provider - The image provider to use (e.g., Unsplash, Picsum, Dummy)\n * @param type - The type of image to generate (Avatar or Random)\n * @returns A URL string pointing to a random image\n *\n * @example\n * ```ts\n * getRandomImageUrl(ImageProvider.Picsum, ImageType.Random) // 'https://picsum.photos/800/600?random=123'\n * getRandomImageUrl(ImageProvider.Dummy, ImageType.Avatar) // 'https://dummyimage.com/200x200/000/fff&text=Avatar'\n * ```\n */\nexport function getRandomImageUrl(\n  provider: ImageProvider,\n  type: ImageType\n): string {\n  switch (provider) {\n    case ImageProvider.Picsum:\n      if (type === ImageType.Avatar) {\n        return `https://picsum.photos/200/200?random=${Math.floor(Math.random() * 1000)}`;\n      } else {\n        return `https://picsum.photos/800/600?random=${Math.floor(Math.random() * 1000)}`;\n      }\n\n    case ImageProvider.Dummy:\n      if (type === ImageType.Avatar) {\n        return `https://dummyimage.com/200x200/000/fff&text=Avatar`;\n      } else {\n        return `https://dummyimage.com/800x600/000/fff&text=Random`;\n      }\n\n    default:\n      throw new Error(`Provider not supported: ${provider}`);\n  }\n}\n\n/**\n * Generates a random image URL for avatar images based on the specified provider.\n *\n * @param provider - The image provider to use (e.g., Unsplash, Picsum, Dummy)\n * @returns A URL string pointing to a random avatar image\n *\n * @example\n * ```ts\n * getAvatarImageUrl(ImageProvider.Picsum) // 'https://picsum.photos/200/200?random=123'\n * getAvatarImageUrl(ImageProvider.Dummy) // 'https://dummyimage.com/200x200/000/fff&text=Avatar'\n * ```\n */\nexport function getAvatarImageUrl(\n  provider: ImageProvider = ImageProvider.Picsum\n): string {\n  return getRandomImageUrl(provider, ImageType.Avatar);\n}\n"],"mappings":";;;;;;;;;;;;;;AAuBA,SAAgB,kBACd,UACA,MACQ;CACR,QAAQ,UAAR;EACE,eACE,IAAI,mBACF,OAAO,wCAAwC,KAAK,MAAM,KAAK,OAAO,IAAI,GAAI;OAE9E,OAAO,wCAAwC,KAAK,MAAM,KAAK,OAAO,IAAI,GAAI;EAGlF,cACE,IAAI,mBACF,OAAO;OAEP,OAAO;EAGX,SACE,MAAM,IAAI,MAAM,2BAA2B,UAAU;CACzD;AACF;;;;;;;;;;;;;AAcA,SAAgB,kBACd,qBACQ;CACR,OAAO,kBAAkB,kBAA0B;AACrD"}

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

@@ -51,7 +51,7 @@ const Container = ({ isClickable, onClick, ...props }) => {
 * <Avatar isLoading fullname="John Doe" />
 * ```
 */
-const Avatar = ({ fullname, className, isLoading = false, isLoggedIn = true, src, onClick, size = "md", alt, focusable = false, ...props }) => {
+const Avatar = ({ fullname, className, isLoading = false, isLoggedIn = true, src, onClick, size = "md", alt, focusable = false, hoverable = false, ...props }) => {
 	const isImageDefined = Boolean(src);
 	const isNameDefined = Boolean((fullname ?? "").length > 0);
 	const capitals = fullname ? getCapitals(fullname) : void 0;
@@ -85,14 +85,14 @@ const Avatar = ({ fullname, className, isLoading = false, isLoggedIn = true, src
 	]);
 	return /* @__PURE__ */ jsx(Container, {
 		isClickable,
-		className: cn(`rounded-full border-[1.3px] border-text p-[1.5px]`, size === "sm" && "size-7 border-[1px] p-[1px]", size === "md" && "size-9", size === "lg" && "size-12", size === "xl" && "size-16", isClickable && `cursor-pointer hover:opacity-80 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2`, !isClickable && focusable && `focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2`, displayLoader && "animate-pulse", className),
+		className: cn(`rounded-full border-[1.3px] border-text p-[1.5px] ring-offset-0 transition-ring duration-200`, size === "sm" && "size-7 border-[1px] p-[1px]", size === "md" && "size-9", size === "lg" && "size-12", size === "xl" && "size-16", size === "2xl" && "size-24", isClickable && `cursor-pointer hover:opacity-80 focus:outline-none focus:ring-3 focus:ring-text/50 focus:ring-offset-2`, hoverable && `hover:opacity-80 hover:ring-4 hover:ring-text/30 hover:ring-offset-2`, !isClickable && focusable && `focus:outline-none focus:ring-3 focus:ring-text/50 focus:ring-offset-2`, displayLoader && "animate-pulse", className),
 		onClick,
 		...accessibilityProps,
 		...props,
 		children: /* @__PURE__ */ jsx("div", {
-			className: "relative flex size-full flex-row items-center justify-center",
+			className: "relative flex aspect-square size-full flex-row items-center justify-center",
 			children: /* @__PURE__ */ jsxs("div", {
-				className: "absolute top-0 left-0 flex size-full flex-col items-center justify-center rounded-full bg-text text-text-opposite",
+				className: "absolute top-0 left-0 flex aspect-square size-full flex-col items-center justify-center rounded-full bg-text text-text-opposite",
 				children: [
 					displayLoader && /* @__PURE__ */ jsx(Loader, {
 						className: "w-3/4",
@@ -109,7 +109,7 @@ const Avatar = ({ fullname, className, isLoading = false, isLoggedIn = true, src
 						draggable: false
 					}),
 					displayInitials && /* @__PURE__ */ jsx("div", {
-						className: "flex size-full items-center justify-center gap-[0.1rem] font-bold text-sm max-md:py-1",
+						className: cn("flex size-full items-center justify-center gap-[0.1rem] font-bold max-md:py-1", size === "sm" && "text-xs", size === "md" && "text-sm", size === "lg" && "text-base", size === "xl" && "text-lg", size === "2xl" && "text-xl"),
 						children: capitals?.map((capital, index) => /* @__PURE__ */ jsx("span", { children: capital }, `${capital}-${index}`))
 					}),
 					displayUserIcon && /* @__PURE__ */ jsx(User, {

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/Avatar/index.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { User } from 'lucide-react';\nimport type { ComponentProps, FC, HTMLAttributes } from 'react';\nimport { useMemo } from 'react';\nimport { Loader } from '../Loader';\n\n/**\n * Props for the Avatar component\n */\nexport interface AvatarProps extends Omit<ComponentProps<'button'>, 'onClick'> {\n  /** Image source URL for the avatar */\n  src?: string;\n  /** Full name used to generate initials and alt text */\n  fullname?: string;\n  /** Displays a loading spinner when true */\n  isLoading?: boolean;\n  /** Whether the user is authenticated */\n  isLoggedIn?: boolean;\n  /** Size variant of the avatar */\n  size?: 'sm' | 'md' | 'lg' | 'xl';\n  /** Click handler - when provided, makes the avatar clickable */\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  /** Alternative text for accessibility */\n  alt?: string;\n  /** Whether the avatar should be focusable when not clickable */\n  focusable?: boolean;\n}\n\n/**\n * @description Gets the capital letters from a name.\n * @param name - The name to extract capitals from.\n * @param separator - The separator to split the name (default is an empty string, which splits by each character).\n * @returns {string[]} An array of capital letters from the name.\n */\nexport const getCapitals = (name: string, separator = ' '): string[] => {\n  if (!name) return [];\n\n  const parts =\n    separator === ' '\n      ? name.trim().split(/\\s+/) // handle multiple spaces\n      : name.split(separator);\n\n  return parts.filter(Boolean).map((word) => word.charAt(0).toUpperCase());\n};\n\n/**\n * Container component that renders either a button or div based on interactivity\n */\nconst Container: FC<\n  HTMLAttributes<HTMLElement> & {\n    isClickable: boolean;\n    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  }\n> = ({ isClickable, onClick, ...props }) => {\n  if (isClickable && onClick) {\n    return (\n      <button\n        {...(props as ComponentProps<'button'>)}\n        onClick={onClick}\n        type=\"button\"\n      />\n    );\n  }\n\n  return (\n    <div\n      {...(props as ComponentProps<'div'>)}\n      role={\n        props.tabIndex !== undefined || props['aria-label'] ? 'img' : undefined\n      }\n    />\n  );\n};\n\n/**\n * Avatar component that displays user profile images, initials, or a default user icon.\n * Supports loading states, authentication states, and accessibility features.\n *\n * @example\n * ```tsx\n * // With image\n * <Avatar src=\"https://example.com/avatar.jpg\" fullname=\"John Doe\" />\n *\n * // With initials\n * <Avatar fullname=\"John Doe\" />\n *\n * // Clickable avatar\n * <Avatar\n *   fullname=\"John Doe\"\n *   onClick={(e) => console.log('Avatar clicked')}\n * />\n *\n * // Loading state\n * <Avatar isLoading fullname=\"John Doe\" />\n * ```\n */\nexport const Avatar: FC<AvatarProps> = ({\n  fullname,\n  className,\n  isLoading = false,\n  isLoggedIn = true,\n  src,\n  onClick,\n  size = 'md',\n  alt,\n  focusable = false,\n  ...props\n}) => {\n  const isImageDefined = Boolean(src);\n  const isNameDefined = Boolean((fullname ?? '').length > 0);\n  const capitals = fullname ? getCapitals(fullname) : undefined;\n\n  // Display logic\n  const displayLoader = isLoading;\n  const displayAvatar = isLoggedIn && !displayLoader && isImageDefined;\n  const displayInitials =\n    isLoggedIn && !displayLoader && !displayAvatar && isNameDefined;\n  const displayUserIcon =\n    isLoggedIn && !displayLoader && !displayAvatar && !displayInitials;\n\n  const isClickable = onClick !== undefined;\n\n  // Accessibility attributes\n  const accessibilityProps = useMemo(() => {\n    const baseProps: Record<string, any> = {};\n\n    if (displayAvatar && alt) {\n      baseProps['aria-label'] = alt;\n    } else if (displayAvatar && fullname) {\n      baseProps['aria-label'] = `Avatar of ${fullname}`;\n    } else if (displayInitials && fullname) {\n      baseProps['aria-label'] = `Avatar initials for ${fullname}`;\n    } else if (displayUserIcon) {\n      baseProps['aria-label'] = 'Default user avatar';\n    } else if (displayLoader) {\n      baseProps['aria-label'] = 'Loading avatar';\n      baseProps['aria-busy'] = true;\n    }\n\n    if (!isClickable && focusable) {\n      baseProps.tabIndex = 0;\n    }\n\n    if (isClickable) {\n      baseProps['aria-describedby'] = 'avatar-description';\n    }\n\n    return baseProps;\n  }, [\n    displayAvatar,\n    displayInitials,\n    displayUserIcon,\n    displayLoader,\n    alt,\n    fullname,\n    isClickable,\n    focusable,\n  ]);\n\n  return (\n    <Container\n      isClickable={isClickable}\n      className={cn(\n        `rounded-full border-[1.3px] border-text p-[1.5px]`,\n        size === 'sm' && 'size-7 border-[1px] p-[1px]',\n        size === 'md' && 'size-9',\n        size === 'lg' && 'size-12',\n        size === 'xl' && 'size-16',\n        isClickable &&\n          `cursor-pointer hover:opacity-80 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2`,\n        !isClickable &&\n          focusable &&\n          `focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2`,\n        displayLoader && 'animate-pulse',\n        className\n      )}\n      onClick={onClick}\n      {...accessibilityProps}\n      {...props}\n    >\n      <div className=\"relative flex size-full flex-row items-center justify-center\">\n        <div className=\"absolute top-0 left-0 flex size-full flex-col items-center justify-center rounded-full bg-text text-text-opposite\">\n          {displayLoader && (\n            <Loader className=\"w-3/4\" aria-label=\"Loading user avatar\" />\n          )}\n\n          {displayAvatar && (\n            <img\n              className=\"size-full rounded-full object-cover\"\n              src={src}\n              srcSet={src}\n              alt={alt ?? `Avatar of ${fullname}`}\n              width={59}\n              height={59}\n              loading=\"lazy\"\n              draggable={false}\n            />\n          )}\n\n          {displayInitials && (\n            <div className=\"flex size-full items-center justify-center gap-[0.1rem] font-bold text-sm max-md:py-1\">\n              {capitals?.map((capital, index) => (\n                // biome-ignore lint/suspicious/noArrayIndexKey: Capitals are primitives and order is fixed\n                <span key={`${capital}-${index}`}>{capital}</span>\n              ))}\n            </div>\n          )}\n\n          {displayUserIcon && (\n            <User\n              size={cn(\n                size === 'sm' && 14,\n                size === 'md' && 25,\n                size === 'lg' && 30,\n                size === 'xl' && 40\n              )}\n              aria-label=\"Default user icon\"\n            />\n          )}\n        </div>\n      </div>\n    </Container>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;AAkCA,MAAa,eAAe,MAAc,YAAY,QAAkB;CACtE,IAAI,CAAC,MAAM,OAAO,EAAE;CAOpB,QAJE,cAAc,MACV,KAAK,MAAM,CAAC,MAAM,MAAM,GACxB,KAAK,MAAM,UAAU,EAEd,OAAO,QAAQ,CAAC,KAAK,SAAS,KAAK,OAAO,EAAE,CAAC,aAAa,CAAC;;;;;AAM1E,MAAM,aAKD,EAAE,aAAa,SAAS,GAAG,YAAY;CAC1C,IAAI,eAAe,SACjB,OACE,oBAAC,UAAD;EACE,GAAK;EACI;EACT,MAAK;EACL;CAIN,OACE,oBAAC,OAAD;EACE,GAAK;EACL,MACE,MAAM,aAAa,UAAa,MAAM,gBAAgB,QAAQ;EAEhE;;;;;;;;;;;;;;;;;;;;;;;;AA0BN,MAAa,UAA2B,EACtC,UACA,WACA,YAAY,OACZ,aAAa,MACb,KACA,SACA,OAAO,MACP,KACA,YAAY,OACZ,GAAG,YACC;CACJ,MAAM,iBAAiB,QAAQ,IAAI;CACnC,MAAM,gBAAgB,SAAS,YAAY,IAAI,SAAS,EAAE;CAC1D,MAAM,WAAW,WAAW,YAAY,SAAS,GAAG;CAGpD,MAAM,gBAAgB;CACtB,MAAM,gBAAgB,cAAc,CAAC,iBAAiB;CACtD,MAAM,kBACJ,cAAc,CAAC,iBAAiB,CAAC,iBAAiB;CACpD,MAAM,kBACJ,cAAc,CAAC,iBAAiB,CAAC,iBAAiB,CAAC;CAErD,MAAM,cAAc,YAAY;CAGhC,MAAM,qBAAqB,cAAc;EACvC,MAAM,YAAiC,EAAE;EAEzC,IAAI,iBAAiB,KACnB,UAAU,gBAAgB;OACrB,IAAI,iBAAiB,UAC1B,UAAU,gBAAgB,aAAa;OAClC,IAAI,mBAAmB,UAC5B,UAAU,gBAAgB,uBAAuB;OAC5C,IAAI,iBACT,UAAU,gBAAgB;OACrB,IAAI,eAAe;GACxB,UAAU,gBAAgB;GAC1B,UAAU,eAAe;;EAG3B,IAAI,CAAC,eAAe,WAClB,UAAU,WAAW;EAGvB,IAAI,aACF,UAAU,sBAAsB;EAGlC,OAAO;IACN;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,OACE,oBAAC,WAAD;EACe;EACb,WAAW,GACT,qDACA,SAAS,QAAQ,+BACjB,SAAS,QAAQ,UACjB,SAAS,QAAQ,WACjB,SAAS,QAAQ,WACjB,eACE,2GACF,CAAC,eACC,aACA,2EACF,iBAAiB,iBACjB,UACD;EACQ;EACT,GAAI;EACJ,GAAI;YAEJ,oBAAC,OAAD;GAAK,WAAU;aACb,qBAAC,OAAD;IAAK,WAAU;cAAf;KACG,iBACC,oBAAC,QAAD;MAAQ,WAAU;MAAQ,cAAW;MAAwB;KAG9D,iBACC,oBAAC,OAAD;MACE,WAAU;MACL;MACL,QAAQ;MACR,KAAK,OAAO,aAAa;MACzB,OAAO;MACP,QAAQ;MACR,SAAQ;MACR,WAAW;MACX;KAGH,mBACC,oBAAC,OAAD;MAAK,WAAU;gBACZ,UAAU,KAAK,SAAS,UAEvB,oBAAC,QAAD,YAAmC,SAAe,EAAvC,GAAG,QAAQ,GAAG,QAAyB,CAClD;MACE;KAGP,mBACC,oBAAC,MAAD;MACE,MAAM,GACJ,SAAS,QAAQ,IACjB,SAAS,QAAQ,IACjB,SAAS,QAAQ,IACjB,SAAS,QAAQ,GAClB;MACD,cAAW;MACX;KAEA;;GACF;EACI"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/Avatar/index.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { User } from 'lucide-react';\nimport type { ComponentProps, FC, HTMLAttributes } from 'react';\nimport { useMemo } from 'react';\nimport { Loader } from '../Loader';\n\n/**\n * Props for the Avatar component\n */\nexport interface AvatarProps extends Omit<ComponentProps<'button'>, 'onClick'> {\n  /** Image source URL for the avatar */\n  src?: string;\n  /** Full name used to generate initials and alt text */\n  fullname?: string;\n  /** Displays a loading spinner when true */\n  isLoading?: boolean;\n  /** Whether the user is authenticated */\n  isLoggedIn?: boolean;\n  /** Size variant of the avatar */\n  size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl';\n  /** Click handler - when provided, makes the avatar clickable */\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  /** Alternative text for accessibility */\n  alt?: string;\n  /** Whether the avatar should be focusable when not clickable */\n  focusable?: boolean;\n  /** Whether the avatar should be hoverable */\n  hoverable?: boolean;\n}\n\n/**\n * @description Gets the capital letters from a name.\n * @param name - The name to extract capitals from.\n * @param separator - The separator to split the name (default is an empty string, which splits by each character).\n * @returns {string[]} An array of capital letters from the name.\n */\nexport const getCapitals = (name: string, separator = ' '): string[] => {\n  if (!name) return [];\n\n  const parts =\n    separator === ' '\n      ? name.trim().split(/\\s+/) // handle multiple spaces\n      : name.split(separator);\n\n  return parts.filter(Boolean).map((word) => word.charAt(0).toUpperCase());\n};\n\n/**\n * Container component that renders either a button or div based on interactivity\n */\nconst Container: FC<\n  HTMLAttributes<HTMLElement> & {\n    isClickable: boolean;\n    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  }\n> = ({ isClickable, onClick, ...props }) => {\n  if (isClickable && onClick) {\n    return (\n      <button\n        {...(props as ComponentProps<'button'>)}\n        onClick={onClick}\n        type=\"button\"\n      />\n    );\n  }\n\n  return (\n    <div\n      {...(props as ComponentProps<'div'>)}\n      role={\n        props.tabIndex !== undefined || props['aria-label'] ? 'img' : undefined\n      }\n    />\n  );\n};\n\n/**\n * Avatar component that displays user profile images, initials, or a default user icon.\n * Supports loading states, authentication states, and accessibility features.\n *\n * @example\n * ```tsx\n * // With image\n * <Avatar src=\"https://example.com/avatar.jpg\" fullname=\"John Doe\" />\n *\n * // With initials\n * <Avatar fullname=\"John Doe\" />\n *\n * // Clickable avatar\n * <Avatar\n *   fullname=\"John Doe\"\n *   onClick={(e) => console.log('Avatar clicked')}\n * />\n *\n * // Loading state\n * <Avatar isLoading fullname=\"John Doe\" />\n * ```\n */\nexport const Avatar: FC<AvatarProps> = ({\n  fullname,\n  className,\n  isLoading = false,\n  isLoggedIn = true,\n  src,\n  onClick,\n  size = 'md',\n  alt,\n  focusable = false,\n  hoverable = false,\n  ...props\n}) => {\n  const isImageDefined = Boolean(src);\n  const isNameDefined = Boolean((fullname ?? '').length > 0);\n  const capitals = fullname ? getCapitals(fullname) : undefined;\n\n  // Display logic\n  const displayLoader = isLoading;\n  const displayAvatar = isLoggedIn && !displayLoader && isImageDefined;\n  const displayInitials =\n    isLoggedIn && !displayLoader && !displayAvatar && isNameDefined;\n  const displayUserIcon =\n    isLoggedIn && !displayLoader && !displayAvatar && !displayInitials;\n\n  const isClickable = onClick !== undefined;\n\n  // Accessibility attributes\n  const accessibilityProps = useMemo(() => {\n    const baseProps: Record<string, any> = {};\n\n    if (displayAvatar && alt) {\n      baseProps['aria-label'] = alt;\n    } else if (displayAvatar && fullname) {\n      baseProps['aria-label'] = `Avatar of ${fullname}`;\n    } else if (displayInitials && fullname) {\n      baseProps['aria-label'] = `Avatar initials for ${fullname}`;\n    } else if (displayUserIcon) {\n      baseProps['aria-label'] = 'Default user avatar';\n    } else if (displayLoader) {\n      baseProps['aria-label'] = 'Loading avatar';\n      baseProps['aria-busy'] = true;\n    }\n\n    if (!isClickable && focusable) {\n      baseProps.tabIndex = 0;\n    }\n\n    if (isClickable) {\n      baseProps['aria-describedby'] = 'avatar-description';\n    }\n\n    return baseProps;\n  }, [\n    displayAvatar,\n    displayInitials,\n    displayUserIcon,\n    displayLoader,\n    alt,\n    fullname,\n    isClickable,\n    focusable,\n  ]);\n\n  return (\n    <Container\n      isClickable={isClickable}\n      className={cn(\n        `rounded-full border-[1.3px] border-text p-[1.5px] ring-offset-0 transition-ring duration-200`,\n        size === 'sm' && 'size-7 border-[1px] p-[1px]',\n        size === 'md' && 'size-9',\n        size === 'lg' && 'size-12',\n        size === 'xl' && 'size-16',\n        size === '2xl' && 'size-24',\n        isClickable &&\n          `cursor-pointer hover:opacity-80 focus:outline-none focus:ring-3 focus:ring-text/50 focus:ring-offset-2`,\n        hoverable &&\n          `hover:opacity-80 hover:ring-4 hover:ring-text/30 hover:ring-offset-2`,\n        !isClickable &&\n          focusable &&\n          `focus:outline-none focus:ring-3 focus:ring-text/50 focus:ring-offset-2`,\n        displayLoader && 'animate-pulse',\n        className\n      )}\n      onClick={onClick}\n      {...accessibilityProps}\n      {...props}\n    >\n      <div className=\"relative flex aspect-square size-full flex-row items-center justify-center\">\n        <div className=\"absolute top-0 left-0 flex aspect-square size-full flex-col items-center justify-center rounded-full bg-text text-text-opposite\">\n          {displayLoader && (\n            <Loader className=\"w-3/4\" aria-label=\"Loading user avatar\" />\n          )}\n\n          {displayAvatar && (\n            <img\n              className=\"size-full rounded-full object-cover\"\n              src={src}\n              srcSet={src}\n              alt={alt ?? `Avatar of ${fullname}`}\n              width={59}\n              height={59}\n              loading=\"lazy\"\n              draggable={false}\n            />\n          )}\n\n          {displayInitials && (\n            <div\n              className={cn(\n                'flex size-full items-center justify-center gap-[0.1rem] font-bold max-md:py-1',\n                size === 'sm' && 'text-xs',\n                size === 'md' && 'text-sm',\n                size === 'lg' && 'text-base',\n                size === 'xl' && 'text-lg',\n                size === '2xl' && 'text-xl'\n              )}\n            >\n              {capitals?.map((capital, index) => (\n                // biome-ignore lint/suspicious/noArrayIndexKey: Capitals are primitives and order is fixed\n                <span key={`${capital}-${index}`}>{capital}</span>\n              ))}\n            </div>\n          )}\n\n          {displayUserIcon && (\n            <User\n              size={cn(\n                size === 'sm' && 14,\n                size === 'md' && 25,\n                size === 'lg' && 30,\n                size === 'xl' && 40\n              )}\n              aria-label=\"Default user icon\"\n            />\n          )}\n        </div>\n      </div>\n    </Container>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;AAoCA,MAAa,eAAe,MAAc,YAAY,QAAkB;CACtE,IAAI,CAAC,MAAM,OAAO,CAAC;CAOnB,QAJE,cAAc,MACV,KAAK,KAAK,EAAE,MAAM,KAAK,IACvB,KAAK,MAAM,SAAS,GAEb,OAAO,OAAO,EAAE,KAAK,SAAS,KAAK,OAAO,CAAC,EAAE,YAAY,CAAC;AACzE;;;;AAKA,MAAM,aAKD,EAAE,aAAa,SAAS,GAAG,YAAY;CAC1C,IAAI,eAAe,SACjB,OACE,oBAAC,UAAD;EACE,GAAK;EACI;EACT,MAAK;CACN;CAIL,OACE,oBAAC,OAAD;EACE,GAAK;EACL,MACE,MAAM,aAAa,UAAa,MAAM,gBAAgB,QAAQ;CAEjE;AAEL;;;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAa,UAA2B,EACtC,UACA,WACA,YAAY,OACZ,aAAa,MACb,KACA,SACA,OAAO,MACP,KACA,YAAY,OACZ,YAAY,OACZ,GAAG,YACC;CACJ,MAAM,iBAAiB,QAAQ,GAAG;CAClC,MAAM,gBAAgB,SAAS,YAAY,IAAI,SAAS,CAAC;CACzD,MAAM,WAAW,WAAW,YAAY,QAAQ,IAAI;CAGpD,MAAM,gBAAgB;CACtB,MAAM,gBAAgB,cAAc,CAAC,iBAAiB;CACtD,MAAM,kBACJ,cAAc,CAAC,iBAAiB,CAAC,iBAAiB;CACpD,MAAM,kBACJ,cAAc,CAAC,iBAAiB,CAAC,iBAAiB,CAAC;CAErD,MAAM,cAAc,YAAY;CAGhC,MAAM,qBAAqB,cAAc;EACvC,MAAM,YAAiC,CAAC;EAExC,IAAI,iBAAiB,KACnB,UAAU,gBAAgB;OACrB,IAAI,iBAAiB,UAC1B,UAAU,gBAAgB,aAAa;OAClC,IAAI,mBAAmB,UAC5B,UAAU,gBAAgB,uBAAuB;OAC5C,IAAI,iBACT,UAAU,gBAAgB;OACrB,IAAI,eAAe;GACxB,UAAU,gBAAgB;GAC1B,UAAU,eAAe;EAC3B;EAEA,IAAI,CAAC,eAAe,WAClB,UAAU,WAAW;EAGvB,IAAI,aACF,UAAU,sBAAsB;EAGlC,OAAO;CACT,GAAG;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,oBAAC,WAAD;EACe;EACb,WAAW,GACT,gGACA,SAAS,QAAQ,+BACjB,SAAS,QAAQ,UACjB,SAAS,QAAQ,WACjB,SAAS,QAAQ,WACjB,SAAS,SAAS,WAClB,eACE,0GACF,aACE,wEACF,CAAC,eACC,aACA,0EACF,iBAAiB,iBACjB,SACF;EACS;EACT,GAAI;EACJ,GAAI;YAEJ,oBAAC,OAAD;GAAK,WAAU;aACb,qBAAC,OAAD;IAAK,WAAU;cAAf;KACG,iBACC,oBAAC,QAAD;MAAQ,WAAU;MAAQ,cAAW;KAAuB;KAG7D,iBACC,oBAAC,OAAD;MACE,WAAU;MACL;MACL,QAAQ;MACR,KAAK,OAAO,aAAa;MACzB,OAAO;MACP,QAAQ;MACR,SAAQ;MACR,WAAW;KACZ;KAGF,mBACC,oBAAC,OAAD;MACE,WAAW,GACT,iFACA,SAAS,QAAQ,WACjB,SAAS,QAAQ,WACjB,SAAS,QAAQ,aACjB,SAAS,QAAQ,WACjB,SAAS,SAAS,SACpB;gBAEC,UAAU,KAAK,SAAS,UAEvB,oBAAC,QAAD,YAAmC,QAAc,GAAtC,GAAG,QAAQ,GAAG,OAAwB,CAClD;KACE;KAGN,mBACC,oBAAC,MAAD;MACE,MAAM,GACJ,SAAS,QAAQ,IACjB,SAAS,QAAQ,IACjB,SAAS,QAAQ,IACjB,SAAS,QAAQ,EACnB;MACA,cAAW;KACZ;IAEA;;EACF;CACI;AAEf"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/Badge/index.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type { HTMLAttributes } from 'react';\n\n/**\n * Badge color variants enum\n * @description Defines the available color themes for the badge component\n */\nexport enum BadgeColor {\n  PRIMARY = 'primary',\n  SECONDARY = 'secondary',\n  DESTRUCTIVE = 'destructive',\n  SUCCESS = 'success',\n  ERROR = 'error',\n  NEUTRAL = 'neutral',\n  LIGHT = 'light',\n  DARK = 'dark',\n  TEXT = 'text',\n  CUSTOM = 'custom',\n}\n\n/**\n * Badge visual variants enum\n * @description Defines the available visual styles for the badge component\n */\nexport enum BadgeVariant {\n  DEFAULT = 'default',\n  NONE = 'none',\n  OUTLINE = 'outline',\n  HOVERABLE = 'hoverable',\n}\n\n/**\n * Badge size variants enum\n * @description Defines the available sizes for the badge component\n */\nexport enum BadgeSize {\n  SMALL = 'sm',\n  MEDIUM = 'md',\n  LARGE = 'lg',\n}\n\n/**\n * Badge component variants using class-variance-authority\n * @description Defines the styling variants for different badge combinations\n */\nexport const badgeVariants = cva(\n  'inline-flex items-center rounded-md border px-2.5 py-0.5 font-semibold text-xs transition-colors focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2',\n  {\n    variants: {\n      color: {\n        [`${BadgeColor.PRIMARY}`]:\n          'border-primary bg-primary text-primary hover:bg-primary-500',\n        [`${BadgeColor.SECONDARY}`]:\n          'border-secondary bg-secondary text-secondary hover:bg-secondary-300',\n        [`${BadgeColor.DESTRUCTIVE}`]:\n          'border-destructive bg-destructive text-destructive hover:bg-destructive-500',\n        [`${BadgeColor.SUCCESS}`]:\n          'border-success bg-success text-success hover:bg-success-500',\n        [`${BadgeColor.ERROR}`]:\n          'border-error bg-error text-error hover:bg-error-500',\n        [`${BadgeColor.NEUTRAL}`]:\n          'border-neutral bg-neutral text-neutral hover:bg-neutral-600',\n        [`${BadgeColor.LIGHT}`]:\n          'border-white bg-white text-white hover:bg-neutral-500',\n        [`${BadgeColor.DARK}`]:\n          'border-neutral-800 bg-neutral-800 text-neutral-800 hover:bg-neutral-900',\n        [`${BadgeColor.TEXT}`]:\n          'border-text bg-text text-text hover:opacity-80',\n        [`${BadgeColor.CUSTOM}`]: '',\n      },\n      variant: {\n        [`${BadgeVariant.DEFAULT}`]: 'rounded-lg text-text-opposite',\n        [`${BadgeVariant.NONE}`]:\n          'border-none bg-opacity-0 text-inherit hover:bg-opacity-0',\n        [`${BadgeVariant.OUTLINE}`]:\n          'rounded-lg border-[1.3px] bg-opacity-0 hover:bg-opacity-30',\n        [`${BadgeVariant.HOVERABLE}`]:\n          'rounded-lg border-none bg-opacity-0 transition hover:bg-opacity-10',\n      },\n      size: {\n        [`${BadgeSize.SMALL}`]: 'px-2 py-0.5 text-xs',\n        [`${BadgeSize.MEDIUM}`]: 'px-2.5 py-0.5 text-xs',\n        [`${BadgeSize.LARGE}`]: 'px-3 py-1 text-sm',\n      },\n    },\n    defaultVariants: {\n      variant: BadgeVariant.DEFAULT,\n      color: BadgeColor.PRIMARY,\n      size: BadgeSize.MEDIUM,\n    },\n  }\n);\n\n/**\n * Badge component props interface\n * @description Comprehensive props for the Badge component with accessibility and interactive features\n */\nexport type BadgeProps = HTMLAttributes<HTMLElement> & {\n  /** The content to display inside the badge */\n  children?: React.ReactNode;\n  /** Color theme variant */\n  color?: BadgeColor | `${BadgeColor}`;\n  /** Visual style variant */\n  variant?: BadgeVariant | `${BadgeVariant}`;\n  /** Size of the badge */\n  size?: BadgeSize | `${BadgeSize}`;\n  /** Whether the badge is clickable */\n  clickable?: boolean;\n  /** Whether the badge is dismissible (shows close button) */\n  dismissible?: boolean;\n  /** Click handler for the badge */\n  onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n  /** Click handler for the dismiss button */\n  onDismiss?: () => void;\n  /** ARIA label for accessibility */\n  'aria-label'?: string;\n  /** Badge role for accessibility (default: 'status') */\n  role?: 'status' | 'button' | 'generic';\n  /** Whether badge should be focusable */\n  tabIndex?: number;\n};\n\n/**\n * Utility type for badge variant props\n */\nexport type BadgeVariantProps = VariantProps<typeof badgeVariants>;\n\n/**\n * Badge component for displaying status indicators, labels, and notifications\n *\n * @description A flexible badge component that supports multiple visual styles, colors, and interactive features.\n * It maintains accessibility standards and provides comprehensive customization options.\n *\n * @example\n * ```tsx\n * // Basic badge\n * <Badge>New</Badge>\n *\n * // Colored badge\n * <Badge color={BadgeColor.DESTRUCTIVE}>Error</Badge>\n *\n * // Clickable badge\n * <Badge clickable onClick={() => console.log('clicked')}>\n *   Clickable\n * </Badge>\n *\n * // Dismissible badge\n * <Badge dismissible onDismiss={() => console.log('dismissed')}>\n *   Dismissible\n * </Badge>\n * ```\n */\nexport const Badge: React.FC<BadgeProps> = ({\n  className,\n  variant = BadgeVariant.DEFAULT,\n  color = BadgeColor.PRIMARY,\n  size = BadgeSize.MEDIUM,\n  children,\n  clickable = false,\n  dismissible = false,\n  onClick,\n  onDismiss,\n  role,\n  tabIndex,\n  'aria-label': ariaLabel,\n  ...props\n}) => {\n  const Component = clickable ? 'button' : 'span';\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n    if (clickable && onClick && (event.key === 'Enter' || event.key === ' ')) {\n      event.preventDefault();\n      onClick(event as any);\n    }\n  };\n\n  const handleDismiss = (event: React.MouseEvent) => {\n    event.stopPropagation();\n    onDismiss?.();\n  };\n\n  return (\n    <Component\n      className={cn(\n        badgeVariants({ variant, color, size }),\n        clickable &&\n          'cursor-pointer hover:opacity-80 focus-visible:ring-2 focus-visible:ring-offset-2',\n        dismissible && 'pr-1',\n        className\n      )}\n      onClick={clickable ? onClick : undefined}\n      onKeyDown={clickable ? handleKeyDown : undefined}\n      role={role || (clickable ? 'button' : 'status')}\n      tabIndex={clickable ? (tabIndex ?? 0) : tabIndex}\n      aria-label={ariaLabel || (clickable ? `${children} button` : undefined)}\n      {...props}\n    >\n      {children}\n      {dismissible && (\n        <button\n          type=\"button\"\n          className=\"ml-1 inline-flex h-4 w-4 items-center justify-center rounded-full hover:bg-black/10 focus:outline-none focus:ring-1 focus:ring-offset-1\"\n          onClick={handleDismiss}\n          aria-label={`Remove ${children} badge`}\n        >\n          <svg\n            className=\"size-3\"\n            viewBox=\"0 0 20 20\"\n            fill=\"currentColor\"\n            aria-label=\"Remove badge\"\n          >\n            <title>Remove badge</title>\n            <path\n              fillRule=\"evenodd\"\n              d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n              clipRule=\"evenodd\"\n            />\n          </svg>\n        </button>\n      )}\n    </Component>\n  );\n};\n"],"mappings":";;;;;;;;;AAQA,IAAY,aAAL;CACL;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;;KACD;;;;;AAMD,IAAY,eAAL;CACL;CACA;CACA;CACA;;KACD;;;;;AAMD,IAAY,YAAL;CACL;CACA;CACA;;KACD;;;;;AAMD,MAAa,gBAAgB,IAC3B,0KACA;CACE,UAAU;EACR,OAAO;IACJ,YACC;IACD,cACC;IACD,gBACC;IACD,YACC;IACD,UACC;IACD,YACC;IACD,UACC;IACD,SACC;IACD,SACC;IACD,WAAyB;GAC3B;EACD,SAAS;IACN,YAA4B;IAC5B,SACC;IACD,YACC;IACD,cACC;GACH;EACD,MAAM;IACH,OAAuB;IACvB,OAAwB;IACxB,OAAuB;GACzB;EACF;CACD,iBAAiB;EACf;EACA;EACA;EACD;CACF,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;AA6DD,MAAa,SAA+B,EAC1C,WACA,qBACA,mBACA,aACA,UACA,YAAY,OACZ,cAAc,OACd,SACA,WACA,MACA,UACA,cAAc,WACd,GAAG,YACC;CACJ,MAAM,YAAY,YAAY,WAAW;CAEzC,MAAM,iBAAiB,UAA4C;EACjE,IAAI,aAAa,YAAY,MAAM,QAAQ,WAAW,MAAM,QAAQ,MAAM;GACxE,MAAM,gBAAgB;GACtB,QAAQ,MAAa;;;CAIzB,MAAM,iBAAiB,UAA4B;EACjD,MAAM,iBAAiB;EACvB,aAAa;;CAGf,OACE,qBAAC,WAAD;EACE,WAAW,GACT,cAAc;GAAE;GAAS;GAAO;GAAM,CAAC,EACvC,aACE,oFACF,eAAe,QACf,UACD;EACD,SAAS,YAAY,UAAU;EAC/B,WAAW,YAAY,gBAAgB;EACvC,MAAM,SAAS,YAAY,WAAW;EACtC,UAAU,YAAa,YAAY,IAAK;EACxC,cAAY,cAAc,YAAY,GAAG,SAAS,WAAW;EAC7D,GAAI;YAbN,CAeG,UACA,eACC,oBAAC,UAAD;GACE,MAAK;GACL,WAAU;GACV,SAAS;GACT,cAAY,UAAU,SAAS;aAE/B,qBAAC,OAAD;IACE,WAAU;IACV,SAAQ;IACR,MAAK;IACL,cAAW;cAJb,CAME,oBAAC,SAAD,YAAO,gBAAoB,GAC3B,oBAAC,QAAD;KACE,UAAS;KACT,GAAE;KACF,UAAS;KACT,EACE;;GACC,EAED"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/Badge/index.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type { HTMLAttributes } from 'react';\n\n/**\n * Badge color variants enum\n * @description Defines the available color themes for the badge component\n */\nexport enum BadgeColor {\n  PRIMARY = 'primary',\n  SECONDARY = 'secondary',\n  DESTRUCTIVE = 'destructive',\n  SUCCESS = 'success',\n  ERROR = 'error',\n  NEUTRAL = 'neutral',\n  LIGHT = 'light',\n  DARK = 'dark',\n  TEXT = 'text',\n  CUSTOM = 'custom',\n}\n\n/**\n * Badge visual variants enum\n * @description Defines the available visual styles for the badge component\n */\nexport enum BadgeVariant {\n  DEFAULT = 'default',\n  NONE = 'none',\n  OUTLINE = 'outline',\n  HOVERABLE = 'hoverable',\n}\n\n/**\n * Badge size variants enum\n * @description Defines the available sizes for the badge component\n */\nexport enum BadgeSize {\n  SMALL = 'sm',\n  MEDIUM = 'md',\n  LARGE = 'lg',\n}\n\n/**\n * Badge component variants using class-variance-authority\n * @description Defines the styling variants for different badge combinations\n */\nexport const badgeVariants = cva(\n  'inline-flex items-center rounded-md border px-2.5 py-0.5 font-semibold text-xs transition-colors focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2',\n  {\n    variants: {\n      color: {\n        [`${BadgeColor.PRIMARY}`]:\n          'border-primary bg-primary text-primary hover:bg-primary-500',\n        [`${BadgeColor.SECONDARY}`]:\n          'border-secondary bg-secondary text-secondary hover:bg-secondary-300',\n        [`${BadgeColor.DESTRUCTIVE}`]:\n          'border-destructive bg-destructive text-destructive hover:bg-destructive-500',\n        [`${BadgeColor.SUCCESS}`]:\n          'border-success bg-success text-success hover:bg-success-500',\n        [`${BadgeColor.ERROR}`]:\n          'border-error bg-error text-error hover:bg-error-500',\n        [`${BadgeColor.NEUTRAL}`]:\n          'border-neutral bg-neutral text-neutral hover:bg-neutral-600',\n        [`${BadgeColor.LIGHT}`]:\n          'border-white bg-white text-white hover:bg-neutral-500',\n        [`${BadgeColor.DARK}`]:\n          'border-neutral-800 bg-neutral-800 text-neutral-800 hover:bg-neutral-900',\n        [`${BadgeColor.TEXT}`]:\n          'border-text bg-text text-text hover:opacity-80',\n        [`${BadgeColor.CUSTOM}`]: '',\n      },\n      variant: {\n        [`${BadgeVariant.DEFAULT}`]: 'rounded-lg text-text-opposite',\n        [`${BadgeVariant.NONE}`]:\n          'border-none bg-opacity-0 text-inherit hover:bg-opacity-0',\n        [`${BadgeVariant.OUTLINE}`]:\n          'rounded-lg border-[1.3px] bg-opacity-0 hover:bg-opacity-30',\n        [`${BadgeVariant.HOVERABLE}`]:\n          'rounded-lg border-none bg-opacity-0 transition hover:bg-opacity-10',\n      },\n      size: {\n        [`${BadgeSize.SMALL}`]: 'px-2 py-0.5 text-xs',\n        [`${BadgeSize.MEDIUM}`]: 'px-2.5 py-0.5 text-xs',\n        [`${BadgeSize.LARGE}`]: 'px-3 py-1 text-sm',\n      },\n    },\n    defaultVariants: {\n      variant: BadgeVariant.DEFAULT,\n      color: BadgeColor.PRIMARY,\n      size: BadgeSize.MEDIUM,\n    },\n  }\n);\n\n/**\n * Badge component props interface\n * @description Comprehensive props for the Badge component with accessibility and interactive features\n */\nexport type BadgeProps = HTMLAttributes<HTMLElement> & {\n  /** The content to display inside the badge */\n  children?: React.ReactNode;\n  /** Color theme variant */\n  color?: BadgeColor | `${BadgeColor}`;\n  /** Visual style variant */\n  variant?: BadgeVariant | `${BadgeVariant}`;\n  /** Size of the badge */\n  size?: BadgeSize | `${BadgeSize}`;\n  /** Whether the badge is clickable */\n  clickable?: boolean;\n  /** Whether the badge is dismissible (shows close button) */\n  dismissible?: boolean;\n  /** Click handler for the badge */\n  onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n  /** Click handler for the dismiss button */\n  onDismiss?: () => void;\n  /** ARIA label for accessibility */\n  'aria-label'?: string;\n  /** Badge role for accessibility (default: 'status') */\n  role?: 'status' | 'button' | 'generic';\n  /** Whether badge should be focusable */\n  tabIndex?: number;\n};\n\n/**\n * Utility type for badge variant props\n */\nexport type BadgeVariantProps = VariantProps<typeof badgeVariants>;\n\n/**\n * Badge component for displaying status indicators, labels, and notifications\n *\n * @description A flexible badge component that supports multiple visual styles, colors, and interactive features.\n * It maintains accessibility standards and provides comprehensive customization options.\n *\n * @example\n * ```tsx\n * // Basic badge\n * <Badge>New</Badge>\n *\n * // Colored badge\n * <Badge color={BadgeColor.DESTRUCTIVE}>Error</Badge>\n *\n * // Clickable badge\n * <Badge clickable onClick={() => console.log('clicked')}>\n *   Clickable\n * </Badge>\n *\n * // Dismissible badge\n * <Badge dismissible onDismiss={() => console.log('dismissed')}>\n *   Dismissible\n * </Badge>\n * ```\n */\nexport const Badge: React.FC<BadgeProps> = ({\n  className,\n  variant = BadgeVariant.DEFAULT,\n  color = BadgeColor.PRIMARY,\n  size = BadgeSize.MEDIUM,\n  children,\n  clickable = false,\n  dismissible = false,\n  onClick,\n  onDismiss,\n  role,\n  tabIndex,\n  'aria-label': ariaLabel,\n  ...props\n}) => {\n  const Component = clickable ? 'button' : 'span';\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n    if (clickable && onClick && (event.key === 'Enter' || event.key === ' ')) {\n      event.preventDefault();\n      onClick(event as any);\n    }\n  };\n\n  const handleDismiss = (event: React.MouseEvent) => {\n    event.stopPropagation();\n    onDismiss?.();\n  };\n\n  return (\n    <Component\n      className={cn(\n        badgeVariants({ variant, color, size }),\n        clickable &&\n          'cursor-pointer hover:opacity-80 focus-visible:ring-2 focus-visible:ring-offset-2',\n        dismissible && 'pr-1',\n        className\n      )}\n      onClick={clickable ? onClick : undefined}\n      onKeyDown={clickable ? handleKeyDown : undefined}\n      role={role || (clickable ? 'button' : 'status')}\n      tabIndex={clickable ? (tabIndex ?? 0) : tabIndex}\n      aria-label={ariaLabel || (clickable ? `${children} button` : undefined)}\n      {...props}\n    >\n      {children}\n      {dismissible && (\n        <button\n          type=\"button\"\n          className=\"ml-1 inline-flex h-4 w-4 items-center justify-center rounded-full hover:bg-black/10 focus:outline-none focus:ring-1 focus:ring-offset-1\"\n          onClick={handleDismiss}\n          aria-label={`Remove ${children} badge`}\n        >\n          <svg\n            className=\"size-3\"\n            viewBox=\"0 0 20 20\"\n            fill=\"currentColor\"\n            aria-label=\"Remove badge\"\n          >\n            <title>Remove badge</title>\n            <path\n              fillRule=\"evenodd\"\n              d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n              clipRule=\"evenodd\"\n            />\n          </svg>\n        </button>\n      )}\n    </Component>\n  );\n};\n"],"mappings":";;;;;;;;;AAQA,IAAY,aAAL;CACL;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;;AACF;;;;;AAMA,IAAY,eAAL;CACL;CACA;CACA;CACA;;AACF;;;;;AAMA,IAAY,YAAL;CACL;CACA;CACA;;AACF;;;;;AAMA,MAAa,gBAAgB,IAC3B,0KACA;CACE,UAAU;EACR,OAAO;IACJ,YACC;IACD,cACC;IACD,gBACC;IACD,YACC;IACD,UACC;IACD,YACC;IACD,UACC;IACD,SACC;IACD,SACC;IACD,WAAyB;EAC5B;EACA,SAAS;IACN,YAA4B;IAC5B,SACC;IACD,YACC;IACD,cACC;EACJ;EACA,MAAM;IACH,OAAuB;IACvB,OAAwB;IACxB,OAAuB;EAC1B;CACF;CACA,iBAAiB;EACf;EACA;EACA;CACF;AACF,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;AA6DA,MAAa,SAA+B,EAC1C,WACA,qBACA,mBACA,aACA,UACA,YAAY,OACZ,cAAc,OACd,SACA,WACA,MACA,UACA,cAAc,WACd,GAAG,YACC;CACJ,MAAM,YAAY,YAAY,WAAW;CAEzC,MAAM,iBAAiB,UAA4C;EACjE,IAAI,aAAa,YAAY,MAAM,QAAQ,WAAW,MAAM,QAAQ,MAAM;GACxE,MAAM,eAAe;GACrB,QAAQ,KAAY;EACtB;CACF;CAEA,MAAM,iBAAiB,UAA4B;EACjD,MAAM,gBAAgB;EACtB,YAAY;CACd;CAEA,OACE,qBAAC,WAAD;EACE,WAAW,GACT,cAAc;GAAE;GAAS;GAAO;EAAK,CAAC,GACtC,aACE,oFACF,eAAe,QACf,SACF;EACA,SAAS,YAAY,UAAU;EAC/B,WAAW,YAAY,gBAAgB;EACvC,MAAM,SAAS,YAAY,WAAW;EACtC,UAAU,YAAa,YAAY,IAAK;EACxC,cAAY,cAAc,YAAY,GAAG,SAAS,WAAW;EAC7D,GAAI;YAbN,CAeG,UACA,eACC,oBAAC,UAAD;GACE,MAAK;GACL,WAAU;GACV,SAAS;GACT,cAAY,UAAU,SAAS;aAE/B,qBAAC,OAAD;IACE,WAAU;IACV,SAAQ;IACR,MAAK;IACL,cAAW;cAJb,CAME,oBAAC,SAAD,YAAO,eAAmB,IAC1B,oBAAC,QAAD;KACE,UAAS;KACT,GAAE;KACF,UAAS;IACV,EACE;;EACC,EAED;;AAEf"}

package/dist/esm/components/Breadcrumb/breadcrumb.content.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumb.content.mjs","names":[],"sources":["../../../../src/components/Breadcrumb/breadcrumb.content.ts"],"sourcesContent":["import { type Dictionary, t } from 'intlayer';\n\nexport const breadCrumbContent = {\n  key: 'breadcrumb',\n  content: {\n    linkLabel: t({\n      en: 'Go to',\n      fr: 'Aller à',\n      es: 'Ir a',\n      'en-GB': 'Go to',\n      de: 'Gehe zu',\n      ja: 'に移動',\n      ko: '로 이동',\n      zh: '转到',\n      it: 'Vai a',\n      pt: 'Ir para',\n      hi: 'कर जाएं',\n      ar: 'اذهب إلى',\n      ru: 'Перейти на',\n      tr: 'Git',\n      pl: 'Przejdź do',\n      id: 'Pergi ke',\n      vi: 'Đi tới',\n      uk: 'Перейти до',\n    }),\n  },\n  title: 'Breadcrumb navigation',\n  description:\n    \"Content declaration for the breadcrumb component's navigation label, used to guide users through hierarchical structures within the interface.\",\n  tags: ['navigation', 'breadcrumb'],\n} satisfies Dictionary;\n\nexport default breadCrumbContent;\n"],"mappings":";;;AAEA,MAAa,oBAAoB;CAC/B,KAAK;CACL,SAAS,EACP,WAAW,EAAE;EACX,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,SAAS;EACT,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,CAAC,EACH;CACD,OAAO;CACP,aACE;CACF,MAAM,CAAC,cAAc,aAAa;CACnC"}
+{"version":3,"file":"breadcrumb.content.mjs","names":[],"sources":["../../../../src/components/Breadcrumb/breadcrumb.content.ts"],"sourcesContent":["import { type Dictionary, t } from 'intlayer';\n\nexport const breadCrumbContent = {\n  key: 'breadcrumb',\n  content: {\n    linkLabel: t({\n      en: 'Go to',\n      fr: 'Aller à',\n      es: 'Ir a',\n      'en-GB': 'Go to',\n      de: 'Gehe zu',\n      ja: 'に移動',\n      ko: '로 이동',\n      zh: '转到',\n      it: 'Vai a',\n      pt: 'Ir para',\n      hi: 'कर जाएं',\n      ar: 'اذهب إلى',\n      ru: 'Перейти на',\n      tr: 'Git',\n      pl: 'Przejdź do',\n      id: 'Pergi ke',\n      vi: 'Đi tới',\n      uk: 'Перейти до',\n    }),\n  },\n  title: 'Breadcrumb navigation',\n  description:\n    \"Content declaration for the breadcrumb component's navigation label, used to guide users through hierarchical structures within the interface.\",\n  tags: ['navigation', 'breadcrumb'],\n} satisfies Dictionary;\n\nexport default breadCrumbContent;\n"],"mappings":";;;AAEA,MAAa,oBAAoB;CAC/B,KAAK;CACL,SAAS,EACP,WAAW,EAAE;EACX,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,SAAS;EACT,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;CACN,CAAC,EACH;CACA,OAAO;CACP,aACE;CACF,MAAM,CAAC,cAAc,YAAY;AACnC"}

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/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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"}
+{"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.content.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Browser.content.mjs","names":[],"sources":["../../../../src/components/Browser/Browser.content.ts"],"sourcesContent":["import { type Dictionary, t } from 'intlayer';\n\nexport const browserContent = {\n  key: 'browser',\n  content: {\n    ariaLabel: t({\n      en: 'Embedded browser',\n      'en-GB': 'Embedded browser',\n      fr: 'Navigateur intégré',\n      es: 'Navegador integrado',\n      de: 'Eingebetteter Browser',\n      ja: '埋め込みブラウザ',\n      ko: '임베디드 브라우저',\n      zh: '嵌入式浏览器',\n      it: 'Browser incorporato',\n      pt: 'Navegador incorporado',\n      hi: 'एम्बेडेड ब्राउज़र',\n      ar: 'متصفح مدمج',\n      ru: 'Встроенный браузер',\n      tr: 'Gömülü tarayıcı',\n      pl: 'Osadzona przeglądarka',\n      id: 'Peramban tertanam',\n      vi: 'Trình duyệt nhúng',\n      uk: 'Вбудований браузер',\n    }),\n    urlLabel: t({\n      en: 'URL address bar',\n      'en-GB': 'URL address bar',\n      fr: \"Barre d'adresse URL\",\n      es: 'Barra de direcciones URL',\n      de: 'URL-Adressleiste',\n      ja: 'URLアドレスバー',\n      ko: 'URL 주소 표시줄',\n      zh: 'URL地址栏',\n      it: 'Barra degli indirizzi URL',\n      pt: 'Barra de endereços URL',\n      hi: 'URL पता बार',\n      ar: 'شريط عنوان URL',\n      ru: 'Адресная строка URL',\n      tr: 'URL adres çubuğu',\n      pl: 'Pasek adresu URL',\n      id: 'Bilah alamat URL',\n      vi: 'Thanh địa chỉ URL',\n      uk: 'Рядок адреси URL',\n    }),\n    urlPlaceholder: 'https://example.com',\n    errorMessage: t({\n      en: 'Invalid URL. Try a path like \"/page\" or a full URL.',\n      'en-GB': 'Invalid URL. Try a path like \"/page\" or a full URL.',\n      fr: 'URL invalide. Essayez un chemin comme \"/page\" ou une URL complète.',\n      es: 'URL no válida. Intente una ruta como \"/page\" o una URL completa.',\n      de: 'Ungültige URL. Versuchen Sie einen Pfad wie \"/page\" oder eine vollständige URL.',\n      ja: '無効なURL。\"/page\"のようなパスまたは完全なURLを試してください。',\n      ko: '잘못된 URL입니다. \"/page\"와 같은 경로 또는 전체 URL을 시도하십시오.',\n      zh: '无效的URL。尝试像\"/page\"这样的路径或完整的URL。',\n      it: 'URL non valido. Prova un percorso come \"/page\" o un URL completo.',\n      pt: 'URL inválido. Tente um caminho como \"/page\" ou uma URL completa.',\n      hi: 'अमान्य URL। \"/page\" जैसा पथ या पूर्ण URL प्रयास करें।',\n      ar: 'رابط غير صالح. جرب مسارًا مثل \"/page\" أو رابطًا كاملاً.',\n      ru: 'Неверный URL. Попробуйте путь вроде \"/page\" или полный URL.',\n      tr: 'Geçersiz URL. \"/page\" gibi bir yol veya tam URL deneyin.',\n      pl: 'Nieprawidłowy adres URL. Wypróbuj ścieżkę jak \"/page\" lub pełny URL.',\n      id: 'URL tidak valid. Coba jalur seperti \"/page\" atau URL lengkap.',\n      vi: 'URL không hợp lệ. Thử đường dẫn như \"/page\" hoặc URL đầy đủ.',\n      uk: 'Недійсний URL. Спробуйте шлях на кшталт \"/page\" або повну URL-адресу.',\n    }),\n    domainRestrictionError: t({\n      en: 'URL must match the application domain.',\n      'en-GB': 'URL must match the application domain.',\n      fr: \"L'URL doit correspondre au domaine de l'application.\",\n      es: 'La URL debe coincidir con el dominio de la aplicación.',\n      de: 'Die URL muss mit der Anwendungsdomäne übereinstimmen.',\n      ja: 'URLはアプリケーションドメインと一致する必要があります。',\n      ko: 'URL은 애플리케이션 도메인과 일치해야 합니다.',\n      zh: 'URL必须与应用程序域名匹配。',\n      it: \"L'URL deve corrispondere al dominio dell'applicazione.\",\n      pt: 'A URL deve corresponder ao domínio da aplicação.',\n      hi: 'URL एप्लिकेशन डोमेन से मेल खाना चाहिए।',\n      ar: 'يجب أن يتطابق الرابط مع نطاق التطبيق.',\n      ru: 'URL должен соответствовать домену приложения.',\n      tr: 'URL, uygulama etki alanıyla eşleşmelidir.',\n      pl: 'Adres URL musi pasować do domeny aplikacji.',\n      id: 'URL harus cocok dengan domain aplikasi.',\n      vi: 'URL phải khớp với tên miền ứng dụng.',\n      uk: 'URL має відповідати домену застосунку.',\n    }),\n    backButtonLabel: t({\n      en: 'Go back',\n      'en-GB': 'Go back',\n      fr: 'Retour',\n      es: 'Atrás',\n      de: 'Zurück',\n      ja: '戻る',\n      ko: '뒤로 가기',\n      zh: '后退',\n      it: 'Indietro',\n      pt: 'Voltar',\n      hi: 'वापस जाएं',\n      ar: 'رجوع',\n      ru: 'Назад',\n      tr: 'Geri',\n      pl: 'Wstecz',\n      id: 'Kembali',\n      vi: 'Quay lại',\n      uk: 'Назад',\n    }),\n    forwardButtonLabel: t({\n      en: 'Go forward',\n      'en-GB': 'Go forward',\n      fr: 'Avancer',\n      es: 'Adelante',\n      de: 'Vorwärts',\n      ja: '進む',\n      ko: '앞으로 가기',\n      zh: '前进',\n      it: 'Avanti',\n      pt: 'Avançar',\n      hi: 'आगे जाएं',\n      ar: 'إلى الأمام',\n      ru: 'Вперёд',\n      tr: 'İleri',\n      pl: 'Naprzód',\n      id: 'Maju',\n      vi: 'Tiến tới',\n      uk: 'Вперед',\n    }),\n    iframeTitle: t({\n      en: 'Embedded web page',\n      'en-GB': 'Embedded web page',\n      fr: 'Page web intégrée',\n      es: 'Página web integrada',\n      de: 'Eingebettete Webseite',\n      ja: '埋め込みウェブページ',\n      ko: '임베디드 웹페이지',\n      zh: '嵌入式网页',\n      it: 'Pagina web incorporata',\n      pt: 'Página web incorporada',\n      hi: 'एम्बेडेड वेब पेज',\n      ar: 'صفحة ويب مدمجة',\n      ru: 'Встроенная веб-страница',\n      tr: 'Gömülü web sayfası',\n      pl: 'Osadzona strona internetowa',\n      id: 'Halaman web tertanam',\n      vi: 'Trang web được nhúng',\n      uk: 'Вбудована веб-сторінка',\n    }),\n  },\n  title: 'Embedded browser component',\n  description:\n    'Content declaration for the embedded browser UI component, including ARIA labels, URL placeholder, and error messages for displaying web pages within an iframe.',\n  tags: ['UI component', 'embedded browser', 'iframe'],\n} satisfies Dictionary;\n\nexport default browserContent;\n"],"mappings":";;;AAEA,MAAa,iBAAiB;CAC5B,KAAK;CACL,SAAS;EACP,WAAW,EAAE;GACX,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAAC;EACF,UAAU,EAAE;GACV,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAAC;EACF,gBAAgB;EAChB,cAAc,EAAE;GACd,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAAC;EACF,wBAAwB,EAAE;GACxB,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAAC;EACF,iBAAiB,EAAE;GACjB,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAAC;EACF,oBAAoB,EAAE;GACpB,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAAC;EACF,aAAa,EAAE;GACb,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAAC;EACH;CACD,OAAO;CACP,aACE;CACF,MAAM;EAAC;EAAgB;EAAoB;EAAS;CACrD"}
+{"version":3,"file":"Browser.content.mjs","names":[],"sources":["../../../../src/components/Browser/Browser.content.ts"],"sourcesContent":["import { type Dictionary, t } from 'intlayer';\n\nexport const browserContent = {\n  key: 'browser',\n  content: {\n    ariaLabel: t({\n      en: 'Embedded browser',\n      'en-GB': 'Embedded browser',\n      fr: 'Navigateur intégré',\n      es: 'Navegador integrado',\n      de: 'Eingebetteter Browser',\n      ja: '埋め込みブラウザ',\n      ko: '임베디드 브라우저',\n      zh: '嵌入式浏览器',\n      it: 'Browser incorporato',\n      pt: 'Navegador incorporado',\n      hi: 'एम्बेडेड ब्राउज़र',\n      ar: 'متصفح مدمج',\n      ru: 'Встроенный браузер',\n      tr: 'Gömülü tarayıcı',\n      pl: 'Osadzona przeglądarka',\n      id: 'Peramban tertanam',\n      vi: 'Trình duyệt nhúng',\n      uk: 'Вбудований браузер',\n    }),\n    urlLabel: t({\n      en: 'URL address bar',\n      'en-GB': 'URL address bar',\n      fr: \"Barre d'adresse URL\",\n      es: 'Barra de direcciones URL',\n      de: 'URL-Adressleiste',\n      ja: 'URLアドレスバー',\n      ko: 'URL 주소 표시줄',\n      zh: 'URL地址栏',\n      it: 'Barra degli indirizzi URL',\n      pt: 'Barra de endereços URL',\n      hi: 'URL पता बार',\n      ar: 'شريط عنوان URL',\n      ru: 'Адресная строка URL',\n      tr: 'URL adres çubuğu',\n      pl: 'Pasek adresu URL',\n      id: 'Bilah alamat URL',\n      vi: 'Thanh địa chỉ URL',\n      uk: 'Рядок адреси URL',\n    }),\n    urlPlaceholder: 'https://example.com',\n    errorMessage: t({\n      en: 'Invalid URL. Try a path like \"/page\" or a full URL.',\n      'en-GB': 'Invalid URL. Try a path like \"/page\" or a full URL.',\n      fr: 'URL invalide. Essayez un chemin comme \"/page\" ou une URL complète.',\n      es: 'URL no válida. Intente una ruta como \"/page\" o una URL completa.',\n      de: 'Ungültige URL. Versuchen Sie einen Pfad wie \"/page\" oder eine vollständige URL.',\n      ja: '無効なURL。\"/page\"のようなパスまたは完全なURLを試してください。',\n      ko: '잘못된 URL입니다. \"/page\"와 같은 경로 또는 전체 URL을 시도하십시오.',\n      zh: '无效的URL。尝试像\"/page\"这样的路径或完整的URL。',\n      it: 'URL non valido. Prova un percorso come \"/page\" o un URL completo.',\n      pt: 'URL inválido. Tente um caminho como \"/page\" ou uma URL completa.',\n      hi: 'अमान्य URL। \"/page\" जैसा पथ या पूर्ण URL प्रयास करें।',\n      ar: 'رابط غير صالح. جرب مسارًا مثل \"/page\" أو رابطًا كاملاً.',\n      ru: 'Неверный URL. Попробуйте путь вроде \"/page\" или полный URL.',\n      tr: 'Geçersiz URL. \"/page\" gibi bir yol veya tam URL deneyin.',\n      pl: 'Nieprawidłowy adres URL. Wypróbuj ścieżkę jak \"/page\" lub pełny URL.',\n      id: 'URL tidak valid. Coba jalur seperti \"/page\" atau URL lengkap.',\n      vi: 'URL không hợp lệ. Thử đường dẫn như \"/page\" hoặc URL đầy đủ.',\n      uk: 'Недійсний URL. Спробуйте шлях на кшталт \"/page\" або повну URL-адресу.',\n    }),\n    domainRestrictionError: t({\n      en: 'URL must match the application domain.',\n      'en-GB': 'URL must match the application domain.',\n      fr: \"L'URL doit correspondre au domaine de l'application.\",\n      es: 'La URL debe coincidir con el dominio de la aplicación.',\n      de: 'Die URL muss mit der Anwendungsdomäne übereinstimmen.',\n      ja: 'URLはアプリケーションドメインと一致する必要があります。',\n      ko: 'URL은 애플리케이션 도메인과 일치해야 합니다.',\n      zh: 'URL必须与应用程序域名匹配。',\n      it: \"L'URL deve corrispondere al dominio dell'applicazione.\",\n      pt: 'A URL deve corresponder ao domínio da aplicação.',\n      hi: 'URL एप्लिकेशन डोमेन से मेल खाना चाहिए।',\n      ar: 'يجب أن يتطابق الرابط مع نطاق التطبيق.',\n      ru: 'URL должен соответствовать домену приложения.',\n      tr: 'URL, uygulama etki alanıyla eşleşmelidir.',\n      pl: 'Adres URL musi pasować do domeny aplikacji.',\n      id: 'URL harus cocok dengan domain aplikasi.',\n      vi: 'URL phải khớp với tên miền ứng dụng.',\n      uk: 'URL має відповідати домену застосунку.',\n    }),\n    backButtonLabel: t({\n      en: 'Go back',\n      'en-GB': 'Go back',\n      fr: 'Retour',\n      es: 'Atrás',\n      de: 'Zurück',\n      ja: '戻る',\n      ko: '뒤로 가기',\n      zh: '后退',\n      it: 'Indietro',\n      pt: 'Voltar',\n      hi: 'वापस जाएं',\n      ar: 'رجوع',\n      ru: 'Назад',\n      tr: 'Geri',\n      pl: 'Wstecz',\n      id: 'Kembali',\n      vi: 'Quay lại',\n      uk: 'Назад',\n    }),\n    forwardButtonLabel: t({\n      en: 'Go forward',\n      'en-GB': 'Go forward',\n      fr: 'Avancer',\n      es: 'Adelante',\n      de: 'Vorwärts',\n      ja: '進む',\n      ko: '앞으로 가기',\n      zh: '前进',\n      it: 'Avanti',\n      pt: 'Avançar',\n      hi: 'आगे जाएं',\n      ar: 'إلى الأمام',\n      ru: 'Вперёд',\n      tr: 'İleri',\n      pl: 'Naprzód',\n      id: 'Maju',\n      vi: 'Tiến tới',\n      uk: 'Вперед',\n    }),\n    iframeTitle: t({\n      en: 'Embedded web page',\n      'en-GB': 'Embedded web page',\n      fr: 'Page web intégrée',\n      es: 'Página web integrada',\n      de: 'Eingebettete Webseite',\n      ja: '埋め込みウェブページ',\n      ko: '임베디드 웹페이지',\n      zh: '嵌入式网页',\n      it: 'Pagina web incorporata',\n      pt: 'Página web incorporada',\n      hi: 'एम्बेडेड वेब पेज',\n      ar: 'صفحة ويب مدمجة',\n      ru: 'Встроенная веб-страница',\n      tr: 'Gömülü web sayfası',\n      pl: 'Osadzona strona internetowa',\n      id: 'Halaman web tertanam',\n      vi: 'Trang web được nhúng',\n      uk: 'Вбудована веб-сторінка',\n    }),\n  },\n  title: 'Embedded browser component',\n  description:\n    'Content declaration for the embedded browser UI component, including ARIA labels, URL placeholder, and error messages for displaying web pages within an iframe.',\n  tags: ['UI component', 'embedded browser', 'iframe'],\n} satisfies Dictionary;\n\nexport default browserContent;\n"],"mappings":";;;AAEA,MAAa,iBAAiB;CAC5B,KAAK;CACL,SAAS;EACP,WAAW,EAAE;GACX,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN,CAAC;EACD,UAAU,EAAE;GACV,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN,CAAC;EACD,gBAAgB;EAChB,cAAc,EAAE;GACd,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN,CAAC;EACD,wBAAwB,EAAE;GACxB,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN,CAAC;EACD,iBAAiB,EAAE;GACjB,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN,CAAC;EACD,oBAAoB,EAAE;GACpB,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN,CAAC;EACD,aAAa,EAAE;GACb,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN,CAAC;CACH;CACA,OAAO;CACP,aACE;CACF,MAAM;EAAC;EAAgB;EAAoB;CAAQ;AACrD"}

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

@@ -1 +1 @@
-{"version":3,"file":"Browser.mjs","names":[],"sources":["../../../../src/components/Browser/Browser.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@utils/cn';\nimport { ArrowLeft, ArrowRight, RotateCw } from 'lucide-react';\nimport {\n  type CSSProperties,\n  type SubmitEvent,\n  type HTMLAttributes,\n  type RefObject,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button } from '../Button';\nimport { Input, inputVariants } from '../Input';\n\nexport type BrowserProps = {\n  initialUrl?: string;\n  path?: string;\n  className?: string;\n  style?: CSSProperties;\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  'aria-label'?: string;\n  sandbox?: string;\n  ref?: RefObject<HTMLIFrameElement | null>;\n  domainRestriction?: string;\n} & HTMLAttributes<HTMLIFrameElement>;\n\nexport const Browser = ({\n  initialUrl = 'https://example.com',\n  path,\n  className,\n  style,\n  size = 'md',\n  'aria-label': ariaLabel,\n  sandbox = 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-downloads',\n  ref,\n  domainRestriction,\n  ...props\n}: BrowserProps) => {\n  // --- State -----------------------------------------------------------------\n  const [inputUrl, setInputUrl] = useState(initialUrl);\n  const [currentUrl, setCurrentUrl] = useState(initialUrl);\n\n  // History Management\n  const [history, setHistory] = useState<string[]>([initialUrl]);\n  const [currentIndex, setCurrentIndex] = useState(0);\n\n  const [error, setError] = useState<string | null>(null);\n  const [submitted, setSubmitted] = useState(false);\n  const internalIframeRef = useRef<HTMLIFrameElement>(null);\n\n  useImperativeHandle(ref, () => internalIframeRef.current!, []);\n  const content = useIntlayer('browser');\n\n  // --- Effects ---------------------------------------------------------------\n\n  // Reset everything if initialUrl changes completely\n  useEffect(() => {\n    setInputUrl(initialUrl);\n    setCurrentUrl(initialUrl);\n    setHistory([initialUrl]);\n    setCurrentIndex(0);\n    setError(null);\n    setSubmitted(false);\n  }, [initialUrl]);\n\n  // Sync external path changes with the URL bar and History\n  useEffect(() => {\n    if (!path) return;\n\n    try {\n      const baseOrigin = domainRestriction ?? initialUrl;\n      const origin = new URL(baseOrigin).origin;\n      const fullUrl = `${origin}${path}`;\n\n      // Update Input (Always update the visual bar)\n      setInputUrl(fullUrl);\n\n      // Check internal iframe state to avoid reload if already there\n      let isAlreadyAtUrl = false;\n      if (internalIframeRef.current?.contentWindow) {\n        try {\n          const currentIframeHref =\n            internalIframeRef.current.contentWindow.location.href;\n          if (new URL(currentIframeHref).href === new URL(fullUrl).href) {\n            isAlreadyAtUrl = true;\n          }\n        } catch {\n          // Cross-origin access ignored\n        }\n      }\n\n      // Update History Stack\n      // We perform this check regardless of `isAlreadyAtUrl`.\n      // If the path changed (even internally), we want to record it in the arrow stack.\n      if (history[currentIndex] !== fullUrl) {\n        setHistory((prev) => {\n          const newHistory = prev.slice(0, currentIndex + 1);\n          newHistory.push(fullUrl);\n          return newHistory;\n        });\n        setCurrentIndex((prev) => prev + 1);\n      }\n\n      // Navigate (Update src) only if NOT already there\n      // This prevents the iframe from refreshing when the user navigated inside it.\n      if (!isAlreadyAtUrl) {\n        setCurrentUrl(fullUrl);\n      }\n\n      setError(null);\n    } catch {\n      // Ignore invalid paths\n    }\n  }, [path, domainRestriction, initialUrl]); // Removed currentIndex dependency to prevent loops\n\n  // --- Navigation Logic ------------------------------------------------------\n\n  const handleNavigateTo = (url: string) => {\n    try {\n      const validated = normalizeUrl(url);\n\n      // If we are navigating to the exact same URL, just reload\n      if (validated === currentUrl) {\n        handleReload();\n        return;\n      }\n\n      setCurrentUrl(validated);\n      setInputUrl(validated);\n      setError(null);\n\n      // Update History: Slice future if we went back, then push new\n      const newHistory = history.slice(0, currentIndex + 1);\n      newHistory.push(validated);\n      setHistory(newHistory);\n      setCurrentIndex(newHistory.length - 1);\n    } catch (e) {\n      if (\n        e instanceof Error &&\n        e.message === 'URL does not match allowed domain' &&\n        domainRestriction\n      ) {\n        setError(\n          content.domainRestrictionError?.value ??\n            `Only URLs from ${domainRestriction} are allowed.`\n        );\n      } else {\n        setError(content.errorMessage.value);\n      }\n    }\n  };\n\n  const handleBack = () => {\n    if (currentIndex > 0) {\n      const newIndex = currentIndex - 1;\n      const prevUrl = history[newIndex];\n      setCurrentIndex(newIndex);\n      setCurrentUrl(prevUrl);\n      setInputUrl(prevUrl);\n      setError(null);\n    }\n  };\n\n  const handleForward = () => {\n    if (currentIndex < history.length - 1) {\n      const newIndex = currentIndex + 1;\n      const nextUrl = history[newIndex];\n      setCurrentIndex(newIndex);\n      setCurrentUrl(nextUrl);\n      setInputUrl(nextUrl);\n      setError(null);\n    }\n  };\n\n  const handleSubmit = (e: SubmitEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    setSubmitted(true);\n    handleNavigateTo(inputUrl);\n  };\n\n  const handleReload = () => {\n    if (internalIframeRef.current) {\n      // Create a clean reload effect\n      const src = internalIframeRef.current.src;\n      internalIframeRef.current.src = '';\n      setTimeout(() => {\n        if (internalIframeRef.current) internalIframeRef.current.src = src;\n      }, 50);\n    }\n  };\n\n  // --- Validation Helpers ----------------------------------------------------\n  const isValidHostname = (host: string) => {\n    if (host === 'localhost') return true;\n    if (/^(\\d{1,3}\\.){3}\\d{1,3}$/.test(host)) return true;\n    if (/^[a-f0-9:]+$/i.test(host)) return true;\n    if (!/^[a-z0-9.-]+$/i.test(host)) return false;\n    if (/^[-.]/.test(host) || /[-.]$/.test(host)) return false;\n    if (host.includes('..')) return false;\n    if (!host.includes('.')) return false;\n    return true;\n  };\n\n  const getRestrictionOrigin = (): URL | null => {\n    if (!domainRestriction) return null;\n    try {\n      return new URL(domainRestriction);\n    } catch {\n      return null;\n    }\n  };\n\n  const normalizeUrl = (raw: string) => {\n    const trimmed = raw.trim();\n    if (!trimmed || /\\s/.test(trimmed)) throw new Error('Invalid');\n\n    const restrictionOrigin = getRestrictionOrigin();\n    const isRelativePath = trimmed.startsWith('/') && !trimmed.startsWith('//');\n\n    if (isRelativePath) {\n      if (restrictionOrigin) {\n        return new URL(`${restrictionOrigin.origin}${trimmed}`).toString();\n      }\n      return new URL(`${new URL(currentUrl).origin}${trimmed}`).toString();\n    }\n\n    const hasProtocol = /^[a-zA-Z][a-zA-Z0-9+.-]*:/.test(trimmed);\n    const candidate = hasProtocol ? trimmed : `https://${trimmed}`;\n    const url = new URL(candidate);\n\n    if (url.protocol !== 'http:' && url.protocol !== 'https:') {\n      throw new Error('Only http(s) is allowed');\n    }\n\n    if (!isValidHostname(url.hostname)) throw new Error('Invalid host');\n\n    if (restrictionOrigin) {\n      const urlMatches =\n        url.hostname === restrictionOrigin.hostname &&\n        url.protocol === restrictionOrigin.protocol &&\n        (restrictionOrigin.port === '' ||\n          url.port === restrictionOrigin.port ||\n          url.host === restrictionOrigin.host);\n\n      if (!urlMatches) throw new Error('URL does not match allowed domain');\n    }\n\n    return url.toString();\n  };\n\n  const showError = submitted && !!error;\n  const canGoBack = currentIndex > 0;\n  const canGoForward = currentIndex < history.length - 1;\n\n  return (\n    <section\n      className={cn(\n        '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)]',\n        className\n      )}\n      style={style}\n      aria-label={ariaLabel ?? content.ariaLabel.value}\n    >\n      {/* Top bar */}\n      <div className=\"relative z-10 flex shrink-0 items-center gap-3 rounded-t-xl bg-text/15 px-4 py-2\">\n        {/* Navigation Controls */}\n        <div className=\"flex items-center gap-1\">\n          <Button\n            type=\"button\"\n            onClick={handleBack}\n            disabled={!canGoBack}\n            variant=\"hoverable\"\n            size=\"icon-md\"\n            label={content.backButtonLabel.value}\n            Icon={ArrowLeft}\n          />\n          <Button\n            type=\"button\"\n            onClick={handleForward}\n            disabled={!canGoForward}\n            variant=\"hoverable\"\n            size=\"icon-md\"\n            label={content.forwardButtonLabel.value}\n            Icon={ArrowRight}\n          />\n        </div>\n\n        {/* URL Bar */}\n        <form\n          onSubmit={handleSubmit}\n          noValidate\n          className={cn(\n            inputVariants(),\n            'flex w-full gap-2 rounded-xl p-0.5! supports-[corner-shape:squircle]:rounded-2xl',\n            'bg-neutral/10 text-text/50 placeholder:text-neutral/80'\n          )}\n        >\n          <label htmlFor=\"browser-url\" className=\"sr-only\">\n            {content.urlLabel.value}\n          </label>\n          <Input\n            id=\"browser-url\"\n            type=\"text\"\n            inputMode=\"url\"\n            spellCheck={false}\n            autoCapitalize=\"off\"\n            variant=\"invisible\"\n            className=\"ml-3 p-0!\"\n            size=\"sm\"\n            autoCorrect=\"off\"\n            value={inputUrl}\n            onChange={(e) => {\n              setInputUrl(e.target.value);\n              if (showError) setError(null);\n            }}\n            placeholder={content.urlPlaceholder.value}\n            aria-label={content.urlLabel.value}\n            aria-invalid={showError}\n            aria-describedby={showError ? 'browser-url-error' : undefined}\n          />\n\n          <Button\n            type=\"button\"\n            onClick={handleReload}\n            variant=\"hoverable\"\n            size=\"icon-md\"\n            className=\"p-1!\"\n            label={'content.reloadButtonTitle.value'}\n            Icon={RotateCw}\n          />\n\n          {/* invisible submit */}\n          <button type=\"submit\" className=\"sr-only absolute\" tabIndex={-1} />\n        </form>\n\n        {/* Error Message Tooltip */}\n        {showError && (\n          <div className=\"absolute top-full left-4 z-20 mt-1\">\n            <p\n              id=\"browser-url-error\"\n              role=\"alert\"\n              aria-live=\"assertive\"\n              className=\"rounded-md bg-red-900/90 px-3 py-1.5 text-red-100 text-xs shadow-md backdrop-blur-sm\"\n            >\n              {error}\n            </p>\n          </div>\n        )}\n      </div>\n\n      {/* Iframe */}\n      <div className=\"relative z-0 flex min-h-0 w-full flex-1 flex-col overflow-hidden rounded-b-xl bg-background\">\n        <iframe\n          ref={internalIframeRef}\n          src={currentUrl}\n          title={content.iframeTitle.value}\n          className=\"size-full flex-1\"\n          sandbox={sandbox}\n          loading=\"lazy\"\n          aria-live=\"polite\"\n          {...props}\n        />\n      </div>\n    </section>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"Browser.mjs","names":[],"sources":["../../../../src/components/Browser/Browser.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@utils/cn';\nimport { ArrowLeft, ArrowRight, RotateCw } from 'lucide-react';\nimport {\n  type CSSProperties,\n  type HTMLAttributes,\n  type RefObject,\n  type SubmitEvent,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button } from '../Button';\nimport { Input, inputVariants } from '../Input';\n\nexport type BrowserProps = {\n  initialUrl?: string;\n  path?: string;\n  className?: string;\n  style?: CSSProperties;\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  'aria-label'?: string;\n  sandbox?: string;\n  ref?: RefObject<HTMLIFrameElement | null>;\n  domainRestriction?: string;\n} & HTMLAttributes<HTMLIFrameElement>;\n\nexport const Browser = ({\n  initialUrl = 'https://example.com',\n  path,\n  className,\n  style,\n  size = 'md',\n  'aria-label': ariaLabel,\n  sandbox = 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-downloads',\n  ref,\n  domainRestriction,\n  ...props\n}: BrowserProps) => {\n  // --- State -----------------------------------------------------------------\n  const [inputUrl, setInputUrl] = useState(initialUrl);\n  const [currentUrl, setCurrentUrl] = useState(initialUrl);\n\n  // History Management\n  const [history, setHistory] = useState<string[]>([initialUrl]);\n  const [currentIndex, setCurrentIndex] = useState(0);\n\n  const [error, setError] = useState<string | null>(null);\n  const [submitted, setSubmitted] = useState(false);\n  const internalIframeRef = useRef<HTMLIFrameElement>(null);\n\n  useImperativeHandle(ref, () => internalIframeRef.current!, []);\n  const content = useIntlayer('browser');\n\n  // --- Effects ---------------------------------------------------------------\n\n  // Reset everything if initialUrl changes completely\n  useEffect(() => {\n    setInputUrl(initialUrl);\n    setCurrentUrl(initialUrl);\n    setHistory([initialUrl]);\n    setCurrentIndex(0);\n    setError(null);\n    setSubmitted(false);\n  }, [initialUrl]);\n\n  // Sync external path changes with the URL bar and History\n  useEffect(() => {\n    if (!path) return;\n\n    try {\n      const baseOrigin = domainRestriction ?? initialUrl;\n      const origin = new URL(baseOrigin).origin;\n      const fullUrl = `${origin}${path}`;\n\n      // Update Input (Always update the visual bar)\n      setInputUrl(fullUrl);\n\n      // Check internal iframe state to avoid reload if already there\n      let isAlreadyAtUrl = false;\n      if (internalIframeRef.current?.contentWindow) {\n        try {\n          const currentIframeHref =\n            internalIframeRef.current.contentWindow.location.href;\n          if (new URL(currentIframeHref).href === new URL(fullUrl).href) {\n            isAlreadyAtUrl = true;\n          }\n        } catch {\n          // Cross-origin access ignored\n        }\n      }\n\n      // Update History Stack\n      // We perform this check regardless of `isAlreadyAtUrl`.\n      // If the path changed (even internally), we want to record it in the arrow stack.\n      if (history[currentIndex] !== fullUrl) {\n        setHistory((prev) => {\n          const newHistory = prev.slice(0, currentIndex + 1);\n          newHistory.push(fullUrl);\n          return newHistory;\n        });\n        setCurrentIndex((prev) => prev + 1);\n      }\n\n      // Navigate (Update src) only if NOT already there\n      // This prevents the iframe from refreshing when the user navigated inside it.\n      if (!isAlreadyAtUrl) {\n        setCurrentUrl(fullUrl);\n      }\n\n      setError(null);\n    } catch {\n      // Ignore invalid paths\n    }\n  }, [path, domainRestriction, initialUrl]); // Removed currentIndex dependency to prevent loops\n\n  // --- Navigation Logic ------------------------------------------------------\n\n  const handleNavigateTo = (url: string) => {\n    try {\n      const validated = normalizeUrl(url);\n\n      // If we are navigating to the exact same URL, just reload\n      if (validated === currentUrl) {\n        handleReload();\n        return;\n      }\n\n      setCurrentUrl(validated);\n      setInputUrl(validated);\n      setError(null);\n\n      // Update History: Slice future if we went back, then push new\n      const newHistory = history.slice(0, currentIndex + 1);\n      newHistory.push(validated);\n      setHistory(newHistory);\n      setCurrentIndex(newHistory.length - 1);\n    } catch (e) {\n      if (\n        e instanceof Error &&\n        e.message === 'URL does not match allowed domain' &&\n        domainRestriction\n      ) {\n        setError(\n          content.domainRestrictionError?.value ??\n            `Only URLs from ${domainRestriction} are allowed.`\n        );\n      } else {\n        setError(content.errorMessage.value);\n      }\n    }\n  };\n\n  const handleBack = () => {\n    if (currentIndex > 0) {\n      const newIndex = currentIndex - 1;\n      const prevUrl = history[newIndex];\n      setCurrentIndex(newIndex);\n      setCurrentUrl(prevUrl);\n      setInputUrl(prevUrl);\n      setError(null);\n    }\n  };\n\n  const handleForward = () => {\n    if (currentIndex < history.length - 1) {\n      const newIndex = currentIndex + 1;\n      const nextUrl = history[newIndex];\n      setCurrentIndex(newIndex);\n      setCurrentUrl(nextUrl);\n      setInputUrl(nextUrl);\n      setError(null);\n    }\n  };\n\n  const handleSubmit = (e: SubmitEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    setSubmitted(true);\n    handleNavigateTo(inputUrl);\n  };\n\n  const handleReload = () => {\n    if (internalIframeRef.current) {\n      // Create a clean reload effect\n      const src = internalIframeRef.current.src;\n      internalIframeRef.current.src = '';\n      setTimeout(() => {\n        if (internalIframeRef.current) internalIframeRef.current.src = src;\n      }, 50);\n    }\n  };\n\n  // --- Validation Helpers ----------------------------------------------------\n  const isValidHostname = (host: string) => {\n    if (host === 'localhost') return true;\n    if (/^(\\d{1,3}\\.){3}\\d{1,3}$/.test(host)) return true;\n    if (/^[a-f0-9:]+$/i.test(host)) return true;\n    if (!/^[a-z0-9.-]+$/i.test(host)) return false;\n    if (/^[-.]/.test(host) || /[-.]$/.test(host)) return false;\n    if (host.includes('..')) return false;\n    if (!host.includes('.')) return false;\n    return true;\n  };\n\n  const getRestrictionOrigin = (): URL | null => {\n    if (!domainRestriction) return null;\n    try {\n      return new URL(domainRestriction);\n    } catch {\n      return null;\n    }\n  };\n\n  const normalizeUrl = (raw: string) => {\n    const trimmed = raw.trim();\n    if (!trimmed || /\\s/.test(trimmed)) throw new Error('Invalid');\n\n    const restrictionOrigin = getRestrictionOrigin();\n    const isRelativePath = trimmed.startsWith('/') && !trimmed.startsWith('//');\n\n    if (isRelativePath) {\n      if (restrictionOrigin) {\n        return new URL(`${restrictionOrigin.origin}${trimmed}`).toString();\n      }\n      return new URL(`${new URL(currentUrl).origin}${trimmed}`).toString();\n    }\n\n    const hasProtocol = /^[a-zA-Z][a-zA-Z0-9+.-]*:/.test(trimmed);\n    const candidate = hasProtocol ? trimmed : `https://${trimmed}`;\n    const url = new URL(candidate);\n\n    if (url.protocol !== 'http:' && url.protocol !== 'https:') {\n      throw new Error('Only http(s) is allowed');\n    }\n\n    if (!isValidHostname(url.hostname)) throw new Error('Invalid host');\n\n    if (restrictionOrigin) {\n      const urlMatches =\n        url.hostname === restrictionOrigin.hostname &&\n        url.protocol === restrictionOrigin.protocol &&\n        (restrictionOrigin.port === '' ||\n          url.port === restrictionOrigin.port ||\n          url.host === restrictionOrigin.host);\n\n      if (!urlMatches) throw new Error('URL does not match allowed domain');\n    }\n\n    return url.toString();\n  };\n\n  const showError = submitted && !!error;\n  const canGoBack = currentIndex > 0;\n  const canGoForward = currentIndex < history.length - 1;\n\n  return (\n    <section\n      className={cn(\n        '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)]',\n        className\n      )}\n      style={style}\n      aria-label={ariaLabel ?? content.ariaLabel.value}\n    >\n      {/* Top bar */}\n      <div className=\"relative z-10 flex shrink-0 items-center gap-3 rounded-t-xl bg-text/15 px-4 py-2\">\n        {/* Navigation Controls */}\n        <div className=\"flex items-center gap-1\">\n          <Button\n            type=\"button\"\n            onClick={handleBack}\n            disabled={!canGoBack}\n            variant=\"hoverable\"\n            size=\"icon-md\"\n            label={content.backButtonLabel.value}\n            Icon={ArrowLeft}\n          />\n          <Button\n            type=\"button\"\n            onClick={handleForward}\n            disabled={!canGoForward}\n            variant=\"hoverable\"\n            size=\"icon-md\"\n            label={content.forwardButtonLabel.value}\n            Icon={ArrowRight}\n          />\n        </div>\n\n        {/* URL Bar */}\n        <form\n          onSubmit={handleSubmit}\n          noValidate\n          className={cn(\n            inputVariants(),\n            'flex w-full gap-2 rounded-xl p-0.5! supports-[corner-shape:squircle]:rounded-2xl',\n            'bg-neutral/10 text-text/50 placeholder:text-neutral/80'\n          )}\n        >\n          <label htmlFor=\"browser-url\" className=\"sr-only\">\n            {content.urlLabel.value}\n          </label>\n          <Input\n            id=\"browser-url\"\n            type=\"text\"\n            inputMode=\"url\"\n            spellCheck={false}\n            autoCapitalize=\"off\"\n            variant=\"invisible\"\n            className=\"ml-3 p-0!\"\n            size=\"sm\"\n            autoCorrect=\"off\"\n            value={inputUrl}\n            onChange={(e) => {\n              setInputUrl(e.target.value);\n              if (showError) setError(null);\n            }}\n            placeholder={content.urlPlaceholder.value}\n            aria-label={content.urlLabel.value}\n            aria-invalid={showError}\n            aria-describedby={showError ? 'browser-url-error' : undefined}\n          />\n\n          <Button\n            type=\"button\"\n            onClick={handleReload}\n            variant=\"hoverable\"\n            size=\"icon-md\"\n            className=\"p-1!\"\n            label={'content.reloadButtonTitle.value'}\n            Icon={RotateCw}\n          />\n\n          {/* invisible submit */}\n          <button type=\"submit\" className=\"sr-only absolute\" tabIndex={-1} />\n        </form>\n\n        {/* Error Message Tooltip */}\n        {showError && (\n          <div className=\"absolute top-full left-4 z-20 mt-1\">\n            <p\n              id=\"browser-url-error\"\n              role=\"alert\"\n              aria-live=\"assertive\"\n              className=\"rounded-md bg-red-900/90 px-3 py-1.5 text-red-100 text-xs shadow-md backdrop-blur-sm\"\n            >\n              {error}\n            </p>\n          </div>\n        )}\n      </div>\n\n      {/* Iframe */}\n      <div className=\"relative z-0 flex min-h-0 w-full flex-1 flex-col overflow-hidden rounded-b-xl bg-background\">\n        <iframe\n          ref={internalIframeRef}\n          src={currentUrl}\n          title={content.iframeTitle.value}\n          className=\"size-full flex-1\"\n          sandbox={sandbox}\n          loading=\"lazy\"\n          aria-live=\"polite\"\n          {...props}\n        />\n      </div>\n    </section>\n  );\n};\n"],"mappings":";;;;;;;;;;;AA8BA,MAAa,WAAW,EACtB,aAAa,uBACb,MACA,WACA,OACA,OAAO,MACP,cAAc,WACd,UAAU,2GACV,KACA,mBACA,GAAG,YACe;CAElB,MAAM,CAAC,UAAU,eAAe,SAAS,UAAU;CACnD,MAAM,CAAC,YAAY,iBAAiB,SAAS,UAAU;CAGvD,MAAM,CAAC,SAAS,cAAc,SAAmB,CAAC,UAAU,CAAC;CAC7D,MAAM,CAAC,cAAc,mBAAmB,SAAS,CAAC;CAElD,MAAM,CAAC,OAAO,YAAY,SAAwB,IAAI;CACtD,MAAM,CAAC,WAAW,gBAAgB,SAAS,KAAK;CAChD,MAAM,oBAAoB,OAA0B,IAAI;CAExD,oBAAoB,WAAW,kBAAkB,SAAU,CAAC,CAAC;CAC7D,MAAM,UAAU,YAAY,SAAS;CAKrC,gBAAgB;EACd,YAAY,UAAU;EACtB,cAAc,UAAU;EACxB,WAAW,CAAC,UAAU,CAAC;EACvB,gBAAgB,CAAC;EACjB,SAAS,IAAI;EACb,aAAa,KAAK;CACpB,GAAG,CAAC,UAAU,CAAC;CAGf,gBAAgB;EACd,IAAI,CAAC,MAAM;EAEX,IAAI;GAGF,MAAM,UAAU,GADD,IAAI,IADA,qBAAqB,UACP,EAAE,SACP;GAG5B,YAAY,OAAO;GAGnB,IAAI,iBAAiB;GACrB,IAAI,kBAAkB,SAAS,eAC7B,IAAI;IACF,MAAM,oBACJ,kBAAkB,QAAQ,cAAc,SAAS;IACnD,IAAI,IAAI,IAAI,iBAAiB,EAAE,SAAS,IAAI,IAAI,OAAO,EAAE,MACvD,iBAAiB;GAErB,QAAQ,CAER;GAMF,IAAI,QAAQ,kBAAkB,SAAS;IACrC,YAAY,SAAS;KACnB,MAAM,aAAa,KAAK,MAAM,GAAG,eAAe,CAAC;KACjD,WAAW,KAAK,OAAO;KACvB,OAAO;IACT,CAAC;IACD,iBAAiB,SAAS,OAAO,CAAC;GACpC;GAIA,IAAI,CAAC,gBACH,cAAc,OAAO;GAGvB,SAAS,IAAI;EACf,QAAQ,CAER;CACF,GAAG;EAAC;EAAM;EAAmB;CAAU,CAAC;CAIxC,MAAM,oBAAoB,QAAgB;EACxC,IAAI;GACF,MAAM,YAAY,aAAa,GAAG;GAGlC,IAAI,cAAc,YAAY;IAC5B,aAAa;IACb;GACF;GAEA,cAAc,SAAS;GACvB,YAAY,SAAS;GACrB,SAAS,IAAI;GAGb,MAAM,aAAa,QAAQ,MAAM,GAAG,eAAe,CAAC;GACpD,WAAW,KAAK,SAAS;GACzB,WAAW,UAAU;GACrB,gBAAgB,WAAW,SAAS,CAAC;EACvC,SAAS,GAAG;GACV,IACE,aAAa,SACb,EAAE,YAAY,uCACd,mBAEA,SACE,QAAQ,wBAAwB,SAC9B,kBAAkB,kBAAkB,cACxC;QAEA,SAAS,QAAQ,aAAa,KAAK;EAEvC;CACF;CAEA,MAAM,mBAAmB;EACvB,IAAI,eAAe,GAAG;GACpB,MAAM,WAAW,eAAe;GAChC,MAAM,UAAU,QAAQ;GACxB,gBAAgB,QAAQ;GACxB,cAAc,OAAO;GACrB,YAAY,OAAO;GACnB,SAAS,IAAI;EACf;CACF;CAEA,MAAM,sBAAsB;EAC1B,IAAI,eAAe,QAAQ,SAAS,GAAG;GACrC,MAAM,WAAW,eAAe;GAChC,MAAM,UAAU,QAAQ;GACxB,gBAAgB,QAAQ;GACxB,cAAc,OAAO;GACrB,YAAY,OAAO;GACnB,SAAS,IAAI;EACf;CACF;CAEA,MAAM,gBAAgB,MAAoC;EACxD,EAAE,eAAe;EACjB,aAAa,IAAI;EACjB,iBAAiB,QAAQ;CAC3B;CAEA,MAAM,qBAAqB;EACzB,IAAI,kBAAkB,SAAS;GAE7B,MAAM,MAAM,kBAAkB,QAAQ;GACtC,kBAAkB,QAAQ,MAAM;GAChC,iBAAiB;IACf,IAAI,kBAAkB,SAAS,kBAAkB,QAAQ,MAAM;GACjE,GAAG,EAAE;EACP;CACF;CAGA,MAAM,mBAAmB,SAAiB;EACxC,IAAI,SAAS,aAAa,OAAO;EACjC,IAAI,0BAA0B,KAAK,IAAI,GAAG,OAAO;EACjD,IAAI,gBAAgB,KAAK,IAAI,GAAG,OAAO;EACvC,IAAI,CAAC,iBAAiB,KAAK,IAAI,GAAG,OAAO;EACzC,IAAI,QAAQ,KAAK,IAAI,KAAK,QAAQ,KAAK,IAAI,GAAG,OAAO;EACrD,IAAI,KAAK,SAAS,IAAI,GAAG,OAAO;EAChC,IAAI,CAAC,KAAK,SAAS,GAAG,GAAG,OAAO;EAChC,OAAO;CACT;CAEA,MAAM,6BAAyC;EAC7C,IAAI,CAAC,mBAAmB,OAAO;EAC/B,IAAI;GACF,OAAO,IAAI,IAAI,iBAAiB;EAClC,QAAQ;GACN,OAAO;EACT;CACF;CAEA,MAAM,gBAAgB,QAAgB;EACpC,MAAM,UAAU,IAAI,KAAK;EACzB,IAAI,CAAC,WAAW,KAAK,KAAK,OAAO,GAAG,MAAM,IAAI,MAAM,SAAS;EAE7D,MAAM,oBAAoB,qBAAqB;EAG/C,IAFuB,QAAQ,WAAW,GAAG,KAAK,CAAC,QAAQ,WAAW,IAAI,GAEtD;GAClB,IAAI,mBACF,OAAO,IAAI,IAAI,GAAG,kBAAkB,SAAS,SAAS,EAAE,SAAS;GAEnE,OAAO,IAAI,IAAI,GAAG,IAAI,IAAI,UAAU,EAAE,SAAS,SAAS,EAAE,SAAS;EACrE;EAGA,MAAM,YADc,4BAA4B,KAAK,OACzB,IAAI,UAAU,WAAW;EACrD,MAAM,MAAM,IAAI,IAAI,SAAS;EAE7B,IAAI,IAAI,aAAa,WAAW,IAAI,aAAa,UAC/C,MAAM,IAAI,MAAM,yBAAyB;EAG3C,IAAI,CAAC,gBAAgB,IAAI,QAAQ,GAAG,MAAM,IAAI,MAAM,cAAc;EAElE,IAAI,mBAQF;OAAI,EANF,IAAI,aAAa,kBAAkB,YACnC,IAAI,aAAa,kBAAkB,aAClC,kBAAkB,SAAS,MAC1B,IAAI,SAAS,kBAAkB,QAC/B,IAAI,SAAS,kBAAkB,QAElB,MAAM,IAAI,MAAM,mCAAmC;EAAC;EAGvE,OAAO,IAAI,SAAS;CACtB;CAEA,MAAM,YAAY,aAAa,CAAC,CAAC;CACjC,MAAM,YAAY,eAAe;CACjC,MAAM,eAAe,eAAe,QAAQ,SAAS;CAErD,OACE,qBAAC,WAAD;EACE,WAAW,GACT,6HACA,SACF;EACO;EACP,cAAY,aAAa,QAAQ,UAAU;YAN7C,CASE,qBAAC,OAAD;GAAK,WAAU;aAAf;IAEE,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,QAAD;MACE,MAAK;MACL,SAAS;MACT,UAAU,CAAC;MACX,SAAQ;MACR,MAAK;MACL,OAAO,QAAQ,gBAAgB;MAC/B,MAAM;KACP,IACD,oBAAC,QAAD;MACE,MAAK;MACL,SAAS;MACT,UAAU,CAAC;MACX,SAAQ;MACR,MAAK;MACL,OAAO,QAAQ,mBAAmB;MAClC,MAAM;KACP,EACE;;IAGL,qBAAC,QAAD;KACE,UAAU;KACV;KACA,WAAW,GACT,cAAc,GACd,oFACA,wDACF;eAPF;MASE,oBAAC,SAAD;OAAO,SAAQ;OAAc,WAAU;iBACpC,QAAQ,SAAS;MACb;MACP,oBAAC,OAAD;OACE,IAAG;OACH,MAAK;OACL,WAAU;OACV,YAAY;OACZ,gBAAe;OACf,SAAQ;OACR,WAAU;OACV,MAAK;OACL,aAAY;OACZ,OAAO;OACP,WAAW,MAAM;QACf,YAAY,EAAE,OAAO,KAAK;QAC1B,IAAI,WAAW,SAAS,IAAI;OAC9B;OACA,aAAa,QAAQ,eAAe;OACpC,cAAY,QAAQ,SAAS;OAC7B,gBAAc;OACd,oBAAkB,YAAY,sBAAsB;MACrD;MAED,oBAAC,QAAD;OACE,MAAK;OACL,SAAS;OACT,SAAQ;OACR,MAAK;OACL,WAAU;OACV,OAAO;OACP,MAAM;MACP;MAGD,oBAAC,UAAD;OAAQ,MAAK;OAAS,WAAU;OAAmB,UAAU;MAAK;KAC9D;;IAGL,aACC,oBAAC,OAAD;KAAK,WAAU;eACb,oBAAC,KAAD;MACE,IAAG;MACH,MAAK;MACL,aAAU;MACV,WAAU;gBAET;KACA;IACA;GAEJ;MAGL,oBAAC,OAAD;GAAK,WAAU;aACb,oBAAC,UAAD;IACE,KAAK;IACL,KAAK;IACL,OAAO,QAAQ,YAAY;IAC3B,WAAU;IACD;IACT,SAAQ;IACR,aAAU;IACV,GAAI;GACL;EACE,EACE;;AAEb"}

package/dist/esm/components/Button/Button.mjs

@@ -9,6 +9,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 * Button size variants for different use cases
 */
 let ButtonSize = /* @__PURE__ */ function(ButtonSize) {
+	ButtonSize["XS"] = "xs";
 	ButtonSize["SM"] = "sm";
 	ButtonSize["MD"] = "md";
 	ButtonSize["LG"] = "lg";
@@ -21,14 +22,15 @@ let ButtonSize = /* @__PURE__ */ function(ButtonSize) {
 }({});
 const buttonIconVariants = cva("flex-none shrink-0", {
 	variants: { size: {
+		[`xs`]: "size-2",
 		[`sm`]: "size-3",
 		[`md`]: "size-4",
 		[`lg`]: "size-5",
 		[`xl`]: "size-6",
 		[`icon-sm`]: "size-3",
 		[`icon-md`]: "size-4",
-		[`icon-lg`]: "size-4",
-		[`icon-xl`]: "size-5"
+		[`icon-lg`]: "size-5",
+		[`icon-xl`]: "size-6"
 	} },
 	defaultVariants: { size: "md" }
 });
@@ -80,13 +82,14 @@ let ButtonTextAlign = /* @__PURE__ */ function(ButtonTextAlign) {
 const buttonVariants = cva("relative inline-flex cursor-pointer items-center justify-center font-medium ring-0 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50", {
 	variants: {
 		size: {
+			[`xs`]: "min-h-7 px-3 text-xs max-md:py-1",
 			[`sm`]: "min-h-7 px-3 text-xs max-md:py-1",
 			[`md`]: "min-h-8 px-6 text-sm max-md:py-2",
 			[`lg`]: "min-h-10 px-8 text-lg max-md:py-3",
 			[`xl`]: "min-h-11 px-10 text-xl max-md:py-4",
 			[`icon-sm`]: "p-1.5",
 			[`icon-md`]: "p-1.5",
-			[`icon-lg`]: "p-2",
+			[`icon-lg`]: "p-1.5",
 			[`icon-xl`]: "p-3"
 		},
 		color: {
@@ -253,7 +256,7 @@ const Button = ({ variant, size, color, children, Icon, IconRight, iconClassName
 				"aria-hidden": "true"
 			}),
 			/* @__PURE__ */ jsx("div", {
-				className: cn("flex items-center justify-center transition-[width] duration-300", isLoading && size === "sm" && "w-3", isLoading && size === "md" && "w-4", isLoading && size === "lg" && "w-5", isLoading && size === "xl" && "w-6"),
+				className: cn("flex items-center justify-center transition-[width] duration-300", isLoading && size === "sm" && "w-3", isLoading && size === "md" && "w-4", isLoading && size === "lg" && "w-6", isLoading && size === "xl" && "w-8"),
 				children: /* @__PURE__ */ jsx(Loader, {
 					className: buttonIconVariants({
 						size,

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

@@ -1 +1 @@
-{"version":3,"file":"Button.mjs","names":[],"sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type { LucideIcon } from 'lucide-react';\nimport type { ButtonHTMLAttributes, DetailedHTMLProps, FC } from 'react';\nimport { ContainerRoundedSize as ButtonRoundedSize } from '../Container';\nimport { Loader } from '../Loader';\n\n/**\n * Button size variants for different use cases\n */\nexport enum ButtonSize {\n  SM = 'sm',\n  MD = 'md',\n  LG = 'lg',\n  XL = 'xl',\n  ICON_SM = 'icon-sm',\n  ICON_MD = 'icon-md',\n  ICON_LG = 'icon-lg',\n  ICON_XL = 'icon-xl',\n}\n\nconst buttonIconVariants = cva('flex-none shrink-0', {\n  variants: {\n    size: {\n      [`${ButtonSize.SM}`]: 'size-3',\n      [`${ButtonSize.MD}`]: 'size-4',\n      [`${ButtonSize.LG}`]: 'size-5',\n      [`${ButtonSize.XL}`]: 'size-6',\n      [`${ButtonSize.ICON_SM}`]: 'size-3',\n      [`${ButtonSize.ICON_MD}`]: 'size-4',\n      [`${ButtonSize.ICON_LG}`]: 'size-4',\n      [`${ButtonSize.ICON_XL}`]: 'size-5',\n    },\n  },\n  defaultVariants: {\n    size: ButtonSize.MD,\n  },\n});\n\n/**\n * Button visual style variants\n */\nexport enum ButtonVariant {\n  DEFAULT = 'default',\n  NONE = 'none',\n  OUTLINE = 'outline',\n  LINK = 'link',\n  INVISIBLE_LINK = 'invisible-link',\n  HOVERABLE = 'hoverable',\n  FADE = 'fade',\n  INPUT = 'input',\n}\n\n/**\n * Button color themes that work with the design system\n */\nexport enum ButtonColor {\n  PRIMARY = 'primary',\n  SECONDARY = 'secondary',\n  DESTRUCTIVE = 'destructive',\n  NEUTRAL = 'neutral',\n  LIGHT = 'light',\n  DARK = 'dark',\n  TEXT = 'text',\n  CARD = 'card',\n  TEXT_INVERSE = 'text-inverse',\n  CURRENT = 'current',\n  ERROR = 'error',\n  SUCCESS = 'success',\n  CUSTOM = 'custom',\n}\n\n/**\n * Text alignment options for button content\n */\nexport enum ButtonTextAlign {\n  LEFT = 'left',\n  CENTER = 'center',\n  RIGHT = 'right',\n}\n\n/**\n * Enhanced button variants with improved accessibility and focus states\n */\nexport const buttonVariants = cva(\n  'relative inline-flex cursor-pointer items-center justify-center font-medium ring-0 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n  {\n    variants: {\n      size: {\n        [`${ButtonSize.SM}`]: 'min-h-7 px-3 text-xs max-md:py-1',\n        [`${ButtonSize.MD}`]: 'min-h-8 px-6 text-sm max-md:py-2',\n        [`${ButtonSize.LG}`]: 'min-h-10 px-8 text-lg max-md:py-3',\n        [`${ButtonSize.XL}`]: 'min-h-11 px-10 text-xl max-md:py-4',\n        [`${ButtonSize.ICON_SM}`]: 'p-1.5',\n        [`${ButtonSize.ICON_MD}`]: 'p-1.5',\n        [`${ButtonSize.ICON_LG}`]: 'p-2',\n        [`${ButtonSize.ICON_XL}`]: 'p-3',\n      },\n      color: {\n        [`${ButtonColor.PRIMARY}`]:\n          'hover-primary-500/20 text-primary ring-primary-500/20 *:text-text-light',\n        [`${ButtonColor.SECONDARY}`]:\n          'hover-secondary-500/20 text-secondary ring-secondary-500/20 *:text-text-light',\n        [`${ButtonColor.DESTRUCTIVE}`]:\n          'hover-destructive-500/20 text-destructive ring-destructive-500/20 *:text-text-light',\n        [`${ButtonColor.NEUTRAL}`]:\n          'text-neutral ring-neutral-500/5 *:text-text-light',\n        [`${ButtonColor.CARD}`]:\n          'hover-card-500/20 text-card ring-card-500/20 *:text-text-light',\n        [`${ButtonColor.LIGHT}`]:\n          'hover-white-500/20 text-white ring-white/20 *:text-text-light',\n        [`${ButtonColor.DARK}`]:\n          'text-neutral-800 ring-text-light/50 *:text-text-light',\n        [`${ButtonColor.TEXT}`]: 'text-text ring-text/20 *:text-text-opposite',\n        [`${ButtonColor.CURRENT}`]:\n          'hover-current-500/10 text-current ring-current/10 *:text-text-light',\n        [`${ButtonColor.TEXT_INVERSE}`]:\n          'text-text-opposite ring-text-opposite/20 *:text-text',\n        [`${ButtonColor.ERROR}`]:\n          'hover-error-500/20 text-error ring-error/20 *:text-text-light',\n        [`${ButtonColor.SUCCESS}`]:\n          'hover-success-500/20 text-success ring-success/20 *:text-text-light',\n        [`${ButtonColor.CUSTOM}`]: '',\n      },\n      roundedSize: {\n        [`${ButtonRoundedSize.NONE}`]: 'rounded-none',\n        [`${ButtonRoundedSize.SM}`]:\n          'rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl',\n        [`${ButtonRoundedSize.MD}`]:\n          'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n        [`${ButtonRoundedSize.LG}`]:\n          'rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl',\n        [`${ButtonRoundedSize.XL}`]:\n          'rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl',\n        [`${ButtonRoundedSize['2xl']}`]:\n          'rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]',\n        [`${ButtonRoundedSize['3xl']}`]:\n          'rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]',\n        [`${ButtonRoundedSize['4xl']}`]:\n          'rounded-[3rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[4rem]',\n        [`${ButtonRoundedSize['5xl']}`]:\n          'rounded-[4rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[5rem]',\n        [`${ButtonRoundedSize.FULL}`]: 'rounded-full',\n      },\n      variant: {\n        [`${ButtonVariant.DEFAULT}`]: [\n          'bg-current',\n          'hover:bg-current/90',\n          'hover:ring-5',\n          'aria-selected:ring-5',\n        ],\n\n        [`${ButtonVariant.OUTLINE}`]: [\n          'rounded-2xl border-[1.3px] border-current bg-current/0 *:text-current!',\n          'hover:bg-current/20 focus-visible:bg-current/20',\n          'hover:ring-5 focus-visible:ring-5',\n          'aria-selected:ring-5',\n        ],\n\n        [`${ButtonVariant.NONE}`]:\n          'border-none bg-current/0 text-inherit hover:bg-current/0',\n\n        [`${ButtonVariant.LINK}`]:\n          'h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 *:text-current! hover:bg-transparent hover:underline',\n\n        [`${ButtonVariant.INVISIBLE_LINK}`]:\n          'h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 *:text-current! hover:bg-transparent',\n\n        [`${ButtonVariant.HOVERABLE}`]:\n          'rounded-lg border-none bg-current/0 transition *:text-current! hover:bg-current/20 aria-[current]:bg-current/5',\n\n        [`${ButtonVariant.FADE}`]: [\n          'rounded-lg border-none bg-current/10 ring-current/5 transition *:text-current! hover:bg-current/20 aria-[current]:bg-current/5',\n          'hover:ring-5 focus-visible:ring-5',\n          'aria-selected:ring-5',\n        ],\n        [`${ButtonVariant.INPUT}`]: [\n          // base styles\n          'text-text',\n          'w-full select-text resize-none rounded-2xl text-base shadow-none outline-none supports-[corner-shape:squircle]:rounded-4xl',\n          'transition-shadow duration-100 md:text-sm',\n          'ring-0', // base ring\n          'disabled:opacity-50',\n\n          'text-text',\n          'bg-neutral-50 dark:bg-neutral-950',\n          'ring-neutral-100 dark:ring-neutral-700',\n\n          // Hover ring (similar spirit to your input)\n          'hover:ring-3', // width\n          'aria-selected:ring-4',\n          'focus-visible:ring-3',\n          'disabled:ring-0',\n\n          // Focus ring + animation\n          'focus-visible:outline-none',\n\n          // Remove any weird box-shadow\n          '[box-shadow:none] focus:[box-shadow:none]',\n\n          // aria-invalid border color\n          'aria-invalid:border-error',\n        ],\n      },\n\n      textAlign: {\n        [`${ButtonTextAlign.LEFT}`]: 'justify-start text-left',\n        [`${ButtonTextAlign.CENTER}`]: 'justify-center text-center',\n        [`${ButtonTextAlign.RIGHT}`]: 'justify-end text-right',\n      },\n\n      isFullWidth: {\n        true: 'w-full',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      variant: `${ButtonVariant.DEFAULT}`,\n      size: `${ButtonSize.MD}`,\n      color: `${ButtonColor.CUSTOM}`,\n      roundedSize: `${ButtonRoundedSize.MD}`,\n      textAlign: `${ButtonTextAlign.CENTER}`,\n      isFullWidth: false,\n    },\n  }\n);\n\n/**\n * Enhanced Button component props with comprehensive type safety and accessibility features\n */\nexport type ButtonProps = DetailedHTMLProps<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  HTMLButtonElement\n> &\n  VariantProps<typeof buttonVariants> & {\n    /**\n     * Accessible label for screen readers and assistive technologies.\n     * This is required for accessibility compliance.\n     */\n    label: string | null;\n\n    /**\n     * Optional icon to display on the left side of the button\n     */\n    Icon?: FC | LucideIcon;\n\n    /**\n     * Optional icon to display on the right side of the button\n     */\n    IconRight?: FC | LucideIcon;\n\n    /**\n     * Additional CSS classes for icon styling\n     */\n    iconClassName?: string;\n\n    /**\n     * Shows loading spinner and disables button interaction when true\n     */\n    isLoading?: boolean;\n\n    /**\n     * Marks the button as active (useful for navigation or toggle states)\n     */\n    isActive?: boolean;\n\n    /**\n     * Marks the button as selected\n     */\n    isSelected?: boolean;\n\n    /**\n     * Makes the button span the full width of its container\n     */\n    isFullWidth?: boolean;\n\n    /**\n     * Additional description for complex buttons (optional)\n     */\n    'aria-describedby'?: string;\n\n    /**\n     * Expanded state for collapsible sections (optional)\n     */\n    'aria-expanded'?: boolean;\n\n    /**\n     * Controls whether the button has popup/menu (optional)\n     */\n    'aria-haspopup'?:\n      | boolean\n      | 'true'\n      | 'false'\n      | 'menu'\n      | 'listbox'\n      | 'tree'\n      | 'grid'\n      | 'dialog';\n\n    /**\n     * Indicates if button controls are currently pressed (for toggle buttons)\n     */\n    'aria-pressed'?: boolean;\n  };\n\n/**\n * Button Component - A comprehensive, accessible button component\n *\n * Features:\n * - Full accessibility compliance with ARIA attributes\n * - Multiple variants and sizes for different use cases\n * - Icon support (left and right positioning)\n * - Loading states with spinner\n * - Keyboard navigation support\n * - Focus management with visible indicators\n * - Responsive design adaptations\n *\n * @example\n * ```tsx\n * // Basic button\n * <Button label=\"Click me\">Click me</Button>\n *\n * // Button with icon and loading state\n * <Button\n *   label=\"Save document\"\n *   Icon={SaveIcon}\n *   isLoading={saving}\n *   disabled={!hasChanges}\n * >\n *   Save\n * </Button>\n *\n * // Destructive action button\n * <Button\n *   variant={`${ButtonVariant.OUTLINE}`}\n *   color={ButtonColor.DESTRUCTIVE}\n *   label=\"Delete item permanently\"\n *   aria-describedby=\"delete-warning\"\n * >\n *   Delete\n * </Button>\n * ```\n */\nexport const Button: FC<ButtonProps> = ({\n  variant,\n  size,\n  color,\n  children,\n  Icon,\n  IconRight,\n  iconClassName,\n  isLoading = false,\n  isActive,\n  isSelected,\n  isFullWidth,\n  roundedSize,\n  textAlign,\n  disabled,\n  label,\n  className,\n  type = 'button',\n  'aria-describedby': ariaDescribedBy,\n  'aria-expanded': ariaExpanded,\n  'aria-haspopup': ariaHasPopup,\n  'aria-pressed': ariaPressed,\n  ...props\n}) => {\n  const isLink =\n    variant === `${ButtonVariant.LINK}` ||\n    variant === `${ButtonVariant.INVISIBLE_LINK}`;\n  const isIconOnly = !children && (Icon || IconRight);\n\n  const accessibilityProps = {\n    'aria-label': isIconOnly ? (label ?? undefined) : undefined,\n    'aria-labelledby': !isIconOnly ? undefined : undefined,\n    'aria-describedby': ariaDescribedBy,\n    'aria-expanded': ariaExpanded,\n    'aria-haspopup': ariaHasPopup,\n    'aria-pressed': isActive !== undefined ? isActive : ariaPressed,\n    'aria-busy': isLoading,\n    'aria-current': (isActive ? 'page' : undefined) as 'page' | undefined,\n    'aria-disabled': disabled || isLoading,\n    'aria-selected': isSelected,\n  };\n\n  const isSquareButton =\n    size === ButtonSize.ICON_SM ||\n    size === ButtonSize.ICON_MD ||\n    size === ButtonSize.ICON_LG ||\n    size === ButtonSize.ICON_XL;\n\n  return (\n    <button\n      disabled={isLoading || disabled}\n      role={isLink ? 'link' : 'button'}\n      type={type}\n      className={buttonVariants({\n        variant,\n        size,\n        color,\n        isFullWidth,\n        roundedSize,\n        textAlign:\n          textAlign ??\n          (IconRight ? ButtonTextAlign.LEFT : ButtonTextAlign.CENTER),\n        className,\n      })}\n      {...accessibilityProps}\n      {...props}\n    >\n      {Icon && !isLoading && (\n        <Icon\n          className={buttonIconVariants({\n            size,\n            className: cn(!isSquareButton && 'mr-3', iconClassName),\n          })}\n          aria-hidden=\"true\"\n        />\n      )}\n\n      <div\n        className={cn(\n          'flex items-center justify-center transition-[width] duration-300',\n          isLoading && size === ButtonSize.SM && 'w-3',\n          isLoading && size === ButtonSize.MD && 'w-4',\n          isLoading && size === ButtonSize.LG && 'w-5',\n          isLoading && size === ButtonSize.XL && 'w-6'\n        )}\n      >\n        <Loader\n          className={buttonIconVariants({\n            size,\n            className: cn(!isSquareButton && 'mr-3', iconClassName),\n          })}\n          isLoading={isLoading}\n          aria-hidden=\"true\"\n          data-testid=\"loader\"\n        />\n      </div>\n\n      {children && (\n        <span className=\"flex-1 truncate whitespace-nowrap\">{children}</span>\n      )}\n\n      {!children && isIconOnly && <span className=\"sr-only\">{label}</span>}\n\n      {IconRight && (\n        <IconRight\n          className={buttonIconVariants({\n            size,\n            className: cn(!isSquareButton && 'ml-3', iconClassName),\n          })}\n          aria-hidden=\"true\"\n        />\n      )}\n    </button>\n  );\n};\n"],"mappings":";;;;;;;;;;AAUA,IAAY,aAAL;CACL;CACA;CACA;CACA;CACA;CACA;CACA;CACA;;KACD;AAED,MAAM,qBAAqB,IAAI,sBAAsB;CACnD,UAAU,EACR,MAAM;GACH,OAAqB;GACrB,OAAqB;GACrB,OAAqB;GACrB,OAAqB;GACrB,YAA0B;GAC1B,YAA0B;GAC1B,YAA0B;GAC1B,YAA0B;EAC5B,EACF;CACD,iBAAiB,EACf,YACD;CACF,CAAC;;;;AAKF,IAAY,gBAAL;CACL;CACA;CACA;CACA;CACA;CACA;CACA;CACA;;KACD;;;;AAKD,IAAY,cAAL;CACL;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;;KACD;;;;AAKD,IAAY,kBAAL;CACL;CACA;CACA;;KACD;;;;AAKD,MAAa,iBAAiB,IAC5B,8LACA;CACE,UAAU;EACR,MAAM;IACH,OAAqB;IACrB,OAAqB;IACrB,OAAqB;IACrB,OAAqB;IACrB,YAA0B;IAC1B,YAA0B;IAC1B,YAA0B;IAC1B,YAA0B;GAC5B;EACD,OAAO;IACJ,YACC;IACD,cACC;IACD,gBACC;IACD,YACC;IACD,SACC;IACD,UACC;IACD,SACC;IACD,SAAwB;IACxB,YACC;IACD,iBACC;IACD,UACC;IACD,YACC;IACD,WAA0B;GAC5B;EACD,aAAa;IACV,cAA8B;IAC9B,YACC;IACD,YACC;IACD,YACC;IACD,YACC;IACD,aACC;IACD,aACC;IACD,aACC;IACD,aACC;IACD,cAA8B;GAChC;EACD,SAAS;IACN,YAA6B;IAC5B;IACA;IACA;IACA;IACD;IAEA,YAA6B;IAC5B;IACA;IACA;IACA;IACD;IAEA,SACC;IAED,SACC;IAED,mBACC;IAED,cACC;IAED,SAA0B;IACzB;IACA;IACA;IACD;IACA,UAA2B;IAE1B;IACA;IACA;IACA;IACA;IAEA;IACA;IACA;IAGA;IACA;IACA;IACA;IAGA;IAGA;IAGA;IACD;GACF;EAED,WAAW;IACR,SAA4B;IAC5B,WAA8B;IAC9B,UAA6B;GAC/B;EAED,aAAa;GACX,MAAM;GACN,OAAO;GACR;EACF;CACD,iBAAiB;EACf,SAAS;EACT,MAAM;EACN,OAAO;EACP,aAAa;EACb,WAAW;EACX,aAAa;EACd;CACF,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsHD,MAAa,UAA2B,EACtC,SACA,MACA,OACA,UACA,MACA,WACA,eACA,YAAY,OACZ,UACA,YACA,aACA,aACA,WACA,UACA,OACA,WACA,OAAO,UACP,oBAAoB,iBACpB,iBAAiB,cACjB,iBAAiB,cACjB,gBAAgB,aAChB,GAAG,YACC;CACJ,MAAM,SACJ,YAAY,UACZ,YAAY;CACd,MAAM,aAAa,CAAC,aAAa,QAAQ;CAEzC,MAAM,qBAAqB;EACzB,cAAc,aAAc,SAAS,SAAa;EAClD,mBAAmB,CAAC,aAAa,SAAY;EAC7C,oBAAoB;EACpB,iBAAiB;EACjB,iBAAiB;EACjB,gBAAgB,aAAa,SAAY,WAAW;EACpD,aAAa;EACb,gBAAiB,WAAW,SAAS;EACrC,iBAAiB,YAAY;EAC7B,iBAAiB;EAClB;CAED,MAAM,iBACJ,sBACA,sBACA,sBACA;CAEF,OACE,qBAAC,UAAD;EACE,UAAU,aAAa;EACvB,MAAM,SAAS,SAAS;EAClB;EACN,WAAW,eAAe;GACxB;GACA;GACA;GACA;GACA;GACA,WACE,cACC;GACH;GACD,CAAC;EACF,GAAI;EACJ,GAAI;YAhBN;GAkBG,QAAQ,CAAC,aACR,oBAAC,MAAD;IACE,WAAW,mBAAmB;KAC5B;KACA,WAAW,GAAG,CAAC,kBAAkB,QAAQ,cAAc;KACxD,CAAC;IACF,eAAY;IACZ;GAGJ,oBAAC,OAAD;IACE,WAAW,GACT,oEACA,aAAa,iBAA0B,OACvC,aAAa,iBAA0B,OACvC,aAAa,iBAA0B,OACvC,aAAa,iBAA0B,MACxC;cAED,oBAAC,QAAD;KACE,WAAW,mBAAmB;MAC5B;MACA,WAAW,GAAG,CAAC,kBAAkB,QAAQ,cAAc;MACxD,CAAC;KACS;KACX,eAAY;KACZ,eAAY;KACZ;IACE;GAEL,YACC,oBAAC,QAAD;IAAM,WAAU;IAAqC;IAAgB;GAGtE,CAAC,YAAY,cAAc,oBAAC,QAAD;IAAM,WAAU;cAAW;IAAa;GAEnE,aACC,oBAAC,WAAD;IACE,WAAW,mBAAmB;KAC5B;KACA,WAAW,GAAG,CAAC,kBAAkB,QAAQ,cAAc;KACxD,CAAC;IACF,eAAY;IACZ;GAEG"}
+{"version":3,"file":"Button.mjs","names":[],"sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type { LucideIcon } from 'lucide-react';\nimport type { ButtonHTMLAttributes, DetailedHTMLProps, FC } from 'react';\nimport { ContainerRoundedSize as ButtonRoundedSize } from '../Container';\nimport { Loader } from '../Loader';\n\n/**\n * Button size variants for different use cases\n */\nexport enum ButtonSize {\n  XS = 'xs',\n  SM = 'sm',\n  MD = 'md',\n  LG = 'lg',\n  XL = 'xl',\n  ICON_SM = 'icon-sm',\n  ICON_MD = 'icon-md',\n  ICON_LG = 'icon-lg',\n  ICON_XL = 'icon-xl',\n}\n\nconst buttonIconVariants = cva('flex-none shrink-0', {\n  variants: {\n    size: {\n      [`${ButtonSize.XS}`]: 'size-2',\n      [`${ButtonSize.SM}`]: 'size-3',\n      [`${ButtonSize.MD}`]: 'size-4',\n      [`${ButtonSize.LG}`]: 'size-5',\n      [`${ButtonSize.XL}`]: 'size-6',\n      [`${ButtonSize.ICON_SM}`]: 'size-3',\n      [`${ButtonSize.ICON_MD}`]: 'size-4',\n      [`${ButtonSize.ICON_LG}`]: 'size-5',\n      [`${ButtonSize.ICON_XL}`]: 'size-6',\n    },\n  },\n  defaultVariants: {\n    size: ButtonSize.MD,\n  },\n});\n\n/**\n * Button visual style variants\n */\nexport enum ButtonVariant {\n  DEFAULT = 'default',\n  NONE = 'none',\n  OUTLINE = 'outline',\n  LINK = 'link',\n  INVISIBLE_LINK = 'invisible-link',\n  HOVERABLE = 'hoverable',\n  FADE = 'fade',\n  INPUT = 'input',\n}\n\n/**\n * Button color themes that work with the design system\n */\nexport enum ButtonColor {\n  PRIMARY = 'primary',\n  SECONDARY = 'secondary',\n  DESTRUCTIVE = 'destructive',\n  NEUTRAL = 'neutral',\n  LIGHT = 'light',\n  DARK = 'dark',\n  TEXT = 'text',\n  CARD = 'card',\n  TEXT_INVERSE = 'text-inverse',\n  CURRENT = 'current',\n  ERROR = 'error',\n  SUCCESS = 'success',\n  CUSTOM = 'custom',\n}\n\n/**\n * Text alignment options for button content\n */\nexport enum ButtonTextAlign {\n  LEFT = 'left',\n  CENTER = 'center',\n  RIGHT = 'right',\n}\n\n/**\n * Enhanced button variants with improved accessibility and focus states\n */\nexport const buttonVariants = cva(\n  'relative inline-flex cursor-pointer items-center justify-center font-medium ring-0 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n  {\n    variants: {\n      size: {\n        [`${ButtonSize.XS}`]: 'min-h-7 px-3 text-xs max-md:py-1',\n        [`${ButtonSize.SM}`]: 'min-h-7 px-3 text-xs max-md:py-1',\n        [`${ButtonSize.MD}`]: 'min-h-8 px-6 text-sm max-md:py-2',\n        [`${ButtonSize.LG}`]: 'min-h-10 px-8 text-lg max-md:py-3',\n        [`${ButtonSize.XL}`]: 'min-h-11 px-10 text-xl max-md:py-4',\n        [`${ButtonSize.ICON_SM}`]: 'p-1.5',\n        [`${ButtonSize.ICON_MD}`]: 'p-1.5',\n        [`${ButtonSize.ICON_LG}`]: 'p-1.5',\n        [`${ButtonSize.ICON_XL}`]: 'p-3',\n      },\n      color: {\n        [`${ButtonColor.PRIMARY}`]:\n          'hover-primary-500/20 text-primary ring-primary-500/20 *:text-text-light',\n        [`${ButtonColor.SECONDARY}`]:\n          'hover-secondary-500/20 text-secondary ring-secondary-500/20 *:text-text-light',\n        [`${ButtonColor.DESTRUCTIVE}`]:\n          'hover-destructive-500/20 text-destructive ring-destructive-500/20 *:text-text-light',\n        [`${ButtonColor.NEUTRAL}`]:\n          'text-neutral ring-neutral-500/5 *:text-text-light',\n        [`${ButtonColor.CARD}`]:\n          'hover-card-500/20 text-card ring-card-500/20 *:text-text-light',\n        [`${ButtonColor.LIGHT}`]:\n          'hover-white-500/20 text-white ring-white/20 *:text-text-light',\n        [`${ButtonColor.DARK}`]:\n          'text-neutral-800 ring-text-light/50 *:text-text-light',\n        [`${ButtonColor.TEXT}`]: 'text-text ring-text/20 *:text-text-opposite',\n        [`${ButtonColor.CURRENT}`]:\n          'hover-current-500/10 text-current ring-current/10 *:text-text-light',\n        [`${ButtonColor.TEXT_INVERSE}`]:\n          'text-text-opposite ring-text-opposite/20 *:text-text',\n        [`${ButtonColor.ERROR}`]:\n          'hover-error-500/20 text-error ring-error/20 *:text-text-light',\n        [`${ButtonColor.SUCCESS}`]:\n          'hover-success-500/20 text-success ring-success/20 *:text-text-light',\n        [`${ButtonColor.CUSTOM}`]: '',\n      },\n      roundedSize: {\n        [`${ButtonRoundedSize.NONE}`]: 'rounded-none',\n        [`${ButtonRoundedSize.SM}`]:\n          'rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl',\n        [`${ButtonRoundedSize.MD}`]:\n          'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n        [`${ButtonRoundedSize.LG}`]:\n          'rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl',\n        [`${ButtonRoundedSize.XL}`]:\n          'rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl',\n        [`${ButtonRoundedSize['2xl']}`]:\n          'rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]',\n        [`${ButtonRoundedSize['3xl']}`]:\n          'rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]',\n        [`${ButtonRoundedSize['4xl']}`]:\n          'rounded-[3rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[4rem]',\n        [`${ButtonRoundedSize['5xl']}`]:\n          'rounded-[4rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[5rem]',\n        [`${ButtonRoundedSize.FULL}`]: 'rounded-full',\n      },\n      variant: {\n        [`${ButtonVariant.DEFAULT}`]: [\n          'bg-current',\n          'hover:bg-current/90',\n          'hover:ring-5',\n          'aria-selected:ring-5',\n        ],\n\n        [`${ButtonVariant.OUTLINE}`]: [\n          'rounded-2xl border-[1.3px] border-current bg-current/0 *:text-current!',\n          'hover:bg-current/20 focus-visible:bg-current/20',\n          'hover:ring-5 focus-visible:ring-5',\n          'aria-selected:ring-5',\n        ],\n\n        [`${ButtonVariant.NONE}`]:\n          'border-none bg-current/0 text-inherit hover:bg-current/0',\n\n        [`${ButtonVariant.LINK}`]:\n          'h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 *:text-current! hover:bg-transparent hover:underline',\n\n        [`${ButtonVariant.INVISIBLE_LINK}`]:\n          'h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 *:text-current! hover:bg-transparent',\n\n        [`${ButtonVariant.HOVERABLE}`]:\n          'rounded-lg border-none bg-current/0 transition *:text-current! hover:bg-current/20 aria-[current]:bg-current/5',\n\n        [`${ButtonVariant.FADE}`]: [\n          'rounded-lg border-none bg-current/10 ring-current/5 transition *:text-current! hover:bg-current/20 aria-[current]:bg-current/5',\n          'hover:ring-5 focus-visible:ring-5',\n          'aria-selected:ring-5',\n        ],\n        [`${ButtonVariant.INPUT}`]: [\n          // base styles\n          'text-text',\n          'w-full select-text resize-none rounded-2xl text-base shadow-none outline-none supports-[corner-shape:squircle]:rounded-4xl',\n          'transition-shadow duration-100 md:text-sm',\n          'ring-0', // base ring\n          'disabled:opacity-50',\n\n          'text-text',\n          'bg-neutral-50 dark:bg-neutral-950',\n          'ring-neutral-100 dark:ring-neutral-700',\n\n          // Hover ring (similar spirit to your input)\n          'hover:ring-3', // width\n          'aria-selected:ring-4',\n          'focus-visible:ring-3',\n          'disabled:ring-0',\n\n          // Focus ring + animation\n          'focus-visible:outline-none',\n\n          // Remove any weird box-shadow\n          '[box-shadow:none] focus:[box-shadow:none]',\n\n          // aria-invalid border color\n          'aria-invalid:border-error',\n        ],\n      },\n\n      textAlign: {\n        [`${ButtonTextAlign.LEFT}`]: 'justify-start text-left',\n        [`${ButtonTextAlign.CENTER}`]: 'justify-center text-center',\n        [`${ButtonTextAlign.RIGHT}`]: 'justify-end text-right',\n      },\n\n      isFullWidth: {\n        true: 'w-full',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      variant: `${ButtonVariant.DEFAULT}`,\n      size: `${ButtonSize.MD}`,\n      color: `${ButtonColor.CUSTOM}`,\n      roundedSize: `${ButtonRoundedSize.MD}`,\n      textAlign: `${ButtonTextAlign.CENTER}`,\n      isFullWidth: false,\n    },\n  }\n);\n\n/**\n * Enhanced Button component props with comprehensive type safety and accessibility features\n */\nexport type ButtonProps = DetailedHTMLProps<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  HTMLButtonElement\n> &\n  VariantProps<typeof buttonVariants> & {\n    /**\n     * Accessible label for screen readers and assistive technologies.\n     * This is required for accessibility compliance.\n     */\n    label: string | null;\n\n    /**\n     * Optional icon to display on the left side of the button\n     */\n    Icon?: FC | LucideIcon;\n\n    /**\n     * Optional icon to display on the right side of the button\n     */\n    IconRight?: FC | LucideIcon;\n\n    /**\n     * Additional CSS classes for icon styling\n     */\n    iconClassName?: string;\n\n    /**\n     * Shows loading spinner and disables button interaction when true\n     */\n    isLoading?: boolean;\n\n    /**\n     * Marks the button as active (useful for navigation or toggle states)\n     */\n    isActive?: boolean;\n\n    /**\n     * Marks the button as selected\n     */\n    isSelected?: boolean;\n\n    /**\n     * Makes the button span the full width of its container\n     */\n    isFullWidth?: boolean;\n\n    /**\n     * Additional description for complex buttons (optional)\n     */\n    'aria-describedby'?: string;\n\n    /**\n     * Expanded state for collapsible sections (optional)\n     */\n    'aria-expanded'?: boolean;\n\n    /**\n     * Controls whether the button has popup/menu (optional)\n     */\n    'aria-haspopup'?:\n      | boolean\n      | 'true'\n      | 'false'\n      | 'menu'\n      | 'listbox'\n      | 'tree'\n      | 'grid'\n      | 'dialog';\n\n    /**\n     * Indicates if button controls are currently pressed (for toggle buttons)\n     */\n    'aria-pressed'?: boolean;\n  };\n\n/**\n * Button Component - A comprehensive, accessible button component\n *\n * Features:\n * - Full accessibility compliance with ARIA attributes\n * - Multiple variants and sizes for different use cases\n * - Icon support (left and right positioning)\n * - Loading states with spinner\n * - Keyboard navigation support\n * - Focus management with visible indicators\n * - Responsive design adaptations\n *\n * @example\n * ```tsx\n * // Basic button\n * <Button label=\"Click me\">Click me</Button>\n *\n * // Button with icon and loading state\n * <Button\n *   label=\"Save document\"\n *   Icon={SaveIcon}\n *   isLoading={saving}\n *   disabled={!hasChanges}\n * >\n *   Save\n * </Button>\n *\n * // Destructive action button\n * <Button\n *   variant={`${ButtonVariant.OUTLINE}`}\n *   color={ButtonColor.DESTRUCTIVE}\n *   label=\"Delete item permanently\"\n *   aria-describedby=\"delete-warning\"\n * >\n *   Delete\n * </Button>\n * ```\n */\nexport const Button: FC<ButtonProps> = ({\n  variant,\n  size,\n  color,\n  children,\n  Icon,\n  IconRight,\n  iconClassName,\n  isLoading = false,\n  isActive,\n  isSelected,\n  isFullWidth,\n  roundedSize,\n  textAlign,\n  disabled,\n  label,\n  className,\n  type = 'button',\n  'aria-describedby': ariaDescribedBy,\n  'aria-expanded': ariaExpanded,\n  'aria-haspopup': ariaHasPopup,\n  'aria-pressed': ariaPressed,\n  ...props\n}) => {\n  const isLink =\n    variant === `${ButtonVariant.LINK}` ||\n    variant === `${ButtonVariant.INVISIBLE_LINK}`;\n  const isIconOnly = !children && (Icon || IconRight);\n\n  const accessibilityProps = {\n    'aria-label': isIconOnly ? (label ?? undefined) : undefined,\n    'aria-labelledby': !isIconOnly ? undefined : undefined,\n    'aria-describedby': ariaDescribedBy,\n    'aria-expanded': ariaExpanded,\n    'aria-haspopup': ariaHasPopup,\n    'aria-pressed': isActive !== undefined ? isActive : ariaPressed,\n    'aria-busy': isLoading,\n    'aria-current': (isActive ? 'page' : undefined) as 'page' | undefined,\n    'aria-disabled': disabled || isLoading,\n    'aria-selected': isSelected,\n  };\n\n  const isSquareButton =\n    size === ButtonSize.ICON_SM ||\n    size === ButtonSize.ICON_MD ||\n    size === ButtonSize.ICON_LG ||\n    size === ButtonSize.ICON_XL;\n\n  return (\n    <button\n      disabled={isLoading || disabled}\n      role={isLink ? 'link' : 'button'}\n      type={type}\n      className={buttonVariants({\n        variant,\n        size,\n        color,\n        isFullWidth,\n        roundedSize,\n        textAlign:\n          textAlign ??\n          (IconRight ? ButtonTextAlign.LEFT : ButtonTextAlign.CENTER),\n        className,\n      })}\n      {...accessibilityProps}\n      {...props}\n    >\n      {Icon && !isLoading && (\n        <Icon\n          className={buttonIconVariants({\n            size,\n            className: cn(!isSquareButton && 'mr-3', iconClassName),\n          })}\n          aria-hidden=\"true\"\n        />\n      )}\n\n      <div\n        className={cn(\n          'flex items-center justify-center transition-[width] duration-300',\n          isLoading && size === ButtonSize.SM && 'w-3',\n          isLoading && size === ButtonSize.MD && 'w-4',\n          isLoading && size === ButtonSize.LG && 'w-6',\n          isLoading && size === ButtonSize.XL && 'w-8'\n        )}\n      >\n        <Loader\n          className={buttonIconVariants({\n            size,\n            className: cn(!isSquareButton && 'mr-3', iconClassName),\n          })}\n          isLoading={isLoading}\n          aria-hidden=\"true\"\n          data-testid=\"loader\"\n        />\n      </div>\n\n      {children && (\n        <span className=\"flex-1 truncate whitespace-nowrap\">{children}</span>\n      )}\n\n      {!children && isIconOnly && <span className=\"sr-only\">{label}</span>}\n\n      {IconRight && (\n        <IconRight\n          className={buttonIconVariants({\n            size,\n            className: cn(!isSquareButton && 'ml-3', iconClassName),\n          })}\n          aria-hidden=\"true\"\n        />\n      )}\n    </button>\n  );\n};\n"],"mappings":";;;;;;;;;;AAUA,IAAY,aAAL;CACL;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;;AACF;AAEA,MAAM,qBAAqB,IAAI,sBAAsB;CACnD,UAAU,EACR,MAAM;GACH,OAAqB;GACrB,OAAqB;GACrB,OAAqB;GACrB,OAAqB;GACrB,OAAqB;GACrB,YAA0B;GAC1B,YAA0B;GAC1B,YAA0B;GAC1B,YAA0B;CAC7B,EACF;CACA,iBAAiB,EACf,WACF;AACF,CAAC;;;;AAKD,IAAY,gBAAL;CACL;CACA;CACA;CACA;CACA;CACA;CACA;CACA;;AACF;;;;AAKA,IAAY,cAAL;CACL;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;;AACF;;;;AAKA,IAAY,kBAAL;CACL;CACA;CACA;;AACF;;;;AAKA,MAAa,iBAAiB,IAC5B,8LACA;CACE,UAAU;EACR,MAAM;IACH,OAAqB;IACrB,OAAqB;IACrB,OAAqB;IACrB,OAAqB;IACrB,OAAqB;IACrB,YAA0B;IAC1B,YAA0B;IAC1B,YAA0B;IAC1B,YAA0B;EAC7B;EACA,OAAO;IACJ,YACC;IACD,cACC;IACD,gBACC;IACD,YACC;IACD,SACC;IACD,UACC;IACD,SACC;IACD,SAAwB;IACxB,YACC;IACD,iBACC;IACD,UACC;IACD,YACC;IACD,WAA0B;EAC7B;EACA,aAAa;IACV,cAA8B;IAC9B,YACC;IACD,YACC;IACD,YACC;IACD,YACC;IACD,aACC;IACD,aACC;IACD,aACC;IACD,aACC;IACD,cAA8B;EACjC;EACA,SAAS;IACN,YAA6B;IAC5B;IACA;IACA;IACA;GACF;IAEC,YAA6B;IAC5B;IACA;IACA;IACA;GACF;IAEC,SACC;IAED,SACC;IAED,mBACC;IAED,cACC;IAED,SAA0B;IACzB;IACA;IACA;GACF;IACC,UAA2B;IAE1B;IACA;IACA;IACA;IACA;IAEA;IACA;IACA;IAGA;IACA;IACA;IACA;IAGA;IAGA;IAGA;GACF;EACF;EAEA,WAAW;IACR,SAA4B;IAC5B,WAA8B;IAC9B,UAA6B;EAChC;EAEA,aAAa;GACX,MAAM;GACN,OAAO;EACT;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;EACN,OAAO;EACP,aAAa;EACb,WAAW;EACX,aAAa;CACf;AACF,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsHA,MAAa,UAA2B,EACtC,SACA,MACA,OACA,UACA,MACA,WACA,eACA,YAAY,OACZ,UACA,YACA,aACA,aACA,WACA,UACA,OACA,WACA,OAAO,UACP,oBAAoB,iBACpB,iBAAiB,cACjB,iBAAiB,cACjB,gBAAgB,aAChB,GAAG,YACC;CACJ,MAAM,SACJ,YAAY,UACZ,YAAY;CACd,MAAM,aAAa,CAAC,aAAa,QAAQ;CAEzC,MAAM,qBAAqB;EACzB,cAAc,aAAc,SAAS,SAAa;EAClD,mBAAmB,CAAC,aAAa,SAAY;EAC7C,oBAAoB;EACpB,iBAAiB;EACjB,iBAAiB;EACjB,gBAAgB,aAAa,SAAY,WAAW;EACpD,aAAa;EACb,gBAAiB,WAAW,SAAS;EACrC,iBAAiB,YAAY;EAC7B,iBAAiB;CACnB;CAEA,MAAM,iBACJ,sBACA,sBACA,sBACA;CAEF,OACE,qBAAC,UAAD;EACE,UAAU,aAAa;EACvB,MAAM,SAAS,SAAS;EAClB;EACN,WAAW,eAAe;GACxB;GACA;GACA;GACA;GACA;GACA,WACE,cACC;GACH;EACF,CAAC;EACD,GAAI;EACJ,GAAI;YAhBN;GAkBG,QAAQ,CAAC,aACR,oBAAC,MAAD;IACE,WAAW,mBAAmB;KAC5B;KACA,WAAW,GAAG,CAAC,kBAAkB,QAAQ,aAAa;IACxD,CAAC;IACD,eAAY;GACb;GAGH,oBAAC,OAAD;IACE,WAAW,GACT,oEACA,aAAa,iBAA0B,OACvC,aAAa,iBAA0B,OACvC,aAAa,iBAA0B,OACvC,aAAa,iBAA0B,KACzC;cAEA,oBAAC,QAAD;KACE,WAAW,mBAAmB;MAC5B;MACA,WAAW,GAAG,CAAC,kBAAkB,QAAQ,aAAa;KACxD,CAAC;KACU;KACX,eAAY;KACZ,eAAY;IACb;GACE;GAEJ,YACC,oBAAC,QAAD;IAAM,WAAU;IAAqC;GAAe;GAGrE,CAAC,YAAY,cAAc,oBAAC,QAAD;IAAM,WAAU;cAAW;GAAY;GAElE,aACC,oBAAC,WAAD;IACE,WAAW,mBAAmB;KAC5B;KACA,WAAW,GAAG,CAAC,kBAAkB,QAAQ,aAAa;IACxD,CAAC;IACD,eAAY;GACb;EAEG;;AAEZ"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.content.mjs","names":[],"sources":["../../../../src/components/Carousel/index.content.ts"],"sourcesContent":["import { type Dictionary, insert, t } from 'intlayer';\n\nconst carouselContent = {\n  key: 'carousel',\n  content: {\n    goToSlide: insert(\n      t({\n        ar: 'انتقل إلى الشريحة رقم {{index}}',\n        de: 'Zu Folie {{index}} wechseln',\n        en: 'Go to slide {{index}}',\n        'en-GB': 'Go to slide {{index}}',\n        es: 'Ir a la diapositiva {{index}}',\n        fr: 'Aller à la diapositive {{index}}',\n        hi: '{{index}} स्लाइड पर जाएँ',\n        id: 'Ke slide {{index}}',\n        it: 'Vai alla diapositiva {{index}}',\n        ja: '{{index}}枚目のスライドへ',\n        ko: '{{index}}번 슬라이드로 이동',\n        pl: 'Idź do slajdu {{index}}',\n        pt: 'Ir para o slide {{index}}',\n        ru: 'Перейти к слайду {{index}}',\n        tr: '{{index}}. slayta git',\n        uk: 'Перейти до слайду {{index}}',\n        vi: 'Đi tới slide {{index}}',\n        zh: '跳转到第{{index}}张幻灯片',\n      })\n    ),\n    previousSlide: t({\n      en: 'Previous slide',\n      'en-GB': 'Previous slide',\n      ru: 'Предыдущий слайд',\n      ja: '前のスライド',\n      fr: 'Diapositive précédente',\n      ko: '이전 슬라이드',\n      zh: '上一张幻灯片',\n      es: 'Diapositiva anterior',\n      de: 'Vorherige Folie',\n      ar: 'الشريحة السابقة',\n      it: 'Diapositiva precedente',\n      pt: 'Diapositiva anterior',\n      hi: 'पिछली स्लाइड',\n      tr: 'Önceki slayt',\n      pl: 'Poprzedni slajd',\n      id: 'Slide sebelumnya',\n      vi: 'Slide trước',\n      uk: 'Попередній слайд',\n    }),\n    nextSlide: t({\n      en: 'Next slide',\n      'en-GB': 'Next slide',\n      ru: 'Следующий слайд',\n      ja: '次のスライド',\n      fr: 'Diapositive suivante',\n      ko: '다음 슬라이드',\n      zh: '下一张幻灯片',\n      es: 'Diapositiva siguiente',\n      de: 'Nächste Folie',\n      ar: 'الشريحة التالية',\n      it: 'Diapositiva successiva',\n      pt: 'Diapositiva seguinte',\n      hi: 'अगली स्लाइड',\n      tr: 'Sonraki slayt',\n      pl: 'Następny slajd',\n      id: 'Slide berikutnya',\n      vi: 'Slide tiếp theo',\n      uk: 'Наступний слайд',\n    }),\n  },\n  title: 'Carousel component',\n  description:\n    \"Localization strings for the Carousel component controls, including labels for 'Go to slide', 'Previous slide', and 'Next slide'.\",\n  tags: ['component', 'carousel', 'ui', 'i18n'],\n} satisfies Dictionary;\n\nexport default carouselContent;\n"],"mappings":";;;AAEA,MAAM,kBAAkB;CACtB,KAAK;CACL,SAAS;EACP,WAAW,OACT,EAAE;GACA,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAAC,CACH;EACD,eAAe,EAAE;GACf,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAAC;EACF,WAAW,EAAE;GACX,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAAC;EACH;CACD,OAAO;CACP,aACE;CACF,MAAM;EAAC;EAAa;EAAY;EAAM;EAAO;CAC9C"}
+{"version":3,"file":"index.content.mjs","names":[],"sources":["../../../../src/components/Carousel/index.content.ts"],"sourcesContent":["import { type Dictionary, insert, t } from 'intlayer';\n\nconst carouselContent = {\n  key: 'carousel',\n  content: {\n    goToSlide: insert(\n      t({\n        ar: 'انتقل إلى الشريحة رقم {{index}}',\n        de: 'Zu Folie {{index}} wechseln',\n        en: 'Go to slide {{index}}',\n        'en-GB': 'Go to slide {{index}}',\n        es: 'Ir a la diapositiva {{index}}',\n        fr: 'Aller à la diapositive {{index}}',\n        hi: '{{index}} स्लाइड पर जाएँ',\n        id: 'Ke slide {{index}}',\n        it: 'Vai alla diapositiva {{index}}',\n        ja: '{{index}}枚目のスライドへ',\n        ko: '{{index}}번 슬라이드로 이동',\n        pl: 'Idź do slajdu {{index}}',\n        pt: 'Ir para o slide {{index}}',\n        ru: 'Перейти к слайду {{index}}',\n        tr: '{{index}}. slayta git',\n        uk: 'Перейти до слайду {{index}}',\n        vi: 'Đi tới slide {{index}}',\n        zh: '跳转到第{{index}}张幻灯片',\n      })\n    ),\n    previousSlide: t({\n      en: 'Previous slide',\n      'en-GB': 'Previous slide',\n      ru: 'Предыдущий слайд',\n      ja: '前のスライド',\n      fr: 'Diapositive précédente',\n      ko: '이전 슬라이드',\n      zh: '上一张幻灯片',\n      es: 'Diapositiva anterior',\n      de: 'Vorherige Folie',\n      ar: 'الشريحة السابقة',\n      it: 'Diapositiva precedente',\n      pt: 'Diapositiva anterior',\n      hi: 'पिछली स्लाइड',\n      tr: 'Önceki slayt',\n      pl: 'Poprzedni slajd',\n      id: 'Slide sebelumnya',\n      vi: 'Slide trước',\n      uk: 'Попередній слайд',\n    }),\n    nextSlide: t({\n      en: 'Next slide',\n      'en-GB': 'Next slide',\n      ru: 'Следующий слайд',\n      ja: '次のスライド',\n      fr: 'Diapositive suivante',\n      ko: '다음 슬라이드',\n      zh: '下一张幻灯片',\n      es: 'Diapositiva siguiente',\n      de: 'Nächste Folie',\n      ar: 'الشريحة التالية',\n      it: 'Diapositiva successiva',\n      pt: 'Diapositiva seguinte',\n      hi: 'अगली स्लाइड',\n      tr: 'Sonraki slayt',\n      pl: 'Następny slajd',\n      id: 'Slide berikutnya',\n      vi: 'Slide tiếp theo',\n      uk: 'Наступний слайд',\n    }),\n  },\n  title: 'Carousel component',\n  description:\n    \"Localization strings for the Carousel component controls, including labels for 'Go to slide', 'Previous slide', and 'Next slide'.\",\n  tags: ['component', 'carousel', 'ui', 'i18n'],\n} satisfies Dictionary;\n\nexport default carouselContent;\n"],"mappings":";;;AAEA,MAAM,kBAAkB;CACtB,KAAK;CACL,SAAS;EACP,WAAW,OACT,EAAE;GACA,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN,CAAC,CACH;EACA,eAAe,EAAE;GACf,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN,CAAC;EACD,WAAW,EAAE;GACX,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN,CAAC;CACH;CACA,OAAO;CACP,aACE;CACF,MAAM;EAAC;EAAa;EAAY;EAAM;CAAM;AAC9C"}