@intlayer/design-system 3.0.2 → 3.1.0

package/dist/components/Input/Checkbox.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.mjs","sources":["../../../src/components/Input/Checkbox.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  forwardRef,\n  useId,\n  type DetailedHTMLProps,\n  type InputHTMLAttributes,\n} from 'react';\n\nexport const checkboxVariants = cva('', {\n  variants: {\n    variant: {\n      default: [\n        'pointer rounded border-2 bg-input-background text-input-text shadow-none outline-0 transition-all',\n        'border-input-border hover:border-input-border-hover focus:border-input-border-focus focus:outline-0 focus:[box-shadow:none]',\n        'checked:bg-checkbox-checked checked:border-checkbox-checked-border',\n        'disabled:opacity-50',\n      ],\n    },\n    size: {\n      sm: 'size-4',\n      md: 'size-5',\n      lg: 'size-6',\n    },\n    color: {\n      primary: 'accent-primary dark:accent-primary-dark',\n      secondary: 'accent-secondary dark:accent-secondary-dark',\n      destructive: 'accent-destructive dark:accent-destructive-dark',\n      neutral: 'accent-neutral dark:accent-neutral-dark',\n      light: 'accent-light dark:accent-light-dark',\n      text: 'accent-text dark:accent-text-dark',\n      dark: 'accent-dark dark:accent-dark-dark',\n      error: 'accent-error dark:accent-error-dark',\n      success: 'accent-success dark:accent-success-dark',\n      custom: 'accent-custom dark:accent-custom-dark',\n    },\n    validationStyleEnabled: {\n      disabled: '',\n      enabled: 'valid:border-success invalid:border-error',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n    color: 'primary',\n    validationStyleEnabled: 'disabled',\n    size: 'md',\n  },\n});\n\nexport type CheckboxProps = DetailedHTMLProps<\n  InputHTMLAttributes<HTMLInputElement>,\n  HTMLInputElement\n> & {\n  validationStyleEnabled?: boolean;\n  label?: string;\n} & Omit<VariantProps<typeof checkboxVariants>, 'validationStyleEnabled'>;\n\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      validationStyleEnabled = false,\n      label,\n      size,\n      color,\n      variant,\n      className,\n      ...props\n    },\n    ref\n  ) => {\n    const id = useId();\n    return (\n      <>\n        <input\n          ref={ref}\n          type=\"checkbox\"\n          className={checkboxVariants({\n            variant,\n            size,\n            color,\n            validationStyleEnabled: validationStyleEnabled\n              ? 'enabled'\n              : 'disabled',\n            className,\n          })}\n          id={id}\n          {...props}\n        />\n        <label htmlFor={id}>{label}</label>\n      </>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n"],"names":["jsxs","Fragment","jsx"],"mappings":";;;AAQa,MAAA,mBAAmB,IAAI,IAAI;AAAA,EACtC,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,QACP;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAAA,IACA,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,IACA,OAAO;AAAA,MACL,SAAS;AAAA,MACT,WAAW;AAAA,MACX,aAAa;AAAA,MACb,SAAS;AAAA,MACT,OAAO;AAAA,MACP,MAAM;AAAA,MACN,MAAM;AAAA,MACN,OAAO;AAAA,MACP,SAAS;AAAA,MACT,QAAQ;AAAA,IACV;AAAA,IACA,wBAAwB;AAAA,MACtB,UAAU;AAAA,MACV,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,OAAO;AAAA,IACP,wBAAwB;AAAA,IACxB,MAAM;AAAA,EACR;AACF,CAAC;AAUM,MAAM,WAAW;AAAA,EACtB,CACE;AAAA,IACE,yBAAyB;AAAA,IACzB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,KAEL,QACG;AACH,UAAM,KAAK;AACX,WAEIA,kCAAA,KAAAC,4BAAA,EAAA,UAAA;AAAA,MAAAC,kCAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC;AAAA,UACA,MAAK;AAAA,UACL,WAAW,iBAAiB;AAAA,YAC1B;AAAA,YACA;AAAA,YACA;AAAA,YACA,wBAAwB,yBACpB,YACA;AAAA,YACJ;AAAA,UAAA,CACD;AAAA,UACD;AAAA,UACC,GAAG;AAAA,QAAA;AAAA,MACN;AAAA,MACCA,kCAAA,IAAA,SAAA,EAAM,SAAS,IAAK,UAAM,OAAA;AAAA,IAC7B,EAAA,CAAA;AAAA,EAEJ;AACF;AAEA,SAAS,cAAc;"}

package/dist/components/Input/Input.d.ts

@@ -1,6 +1,5 @@
 import { VariantProps } from 'class-variance-authority';
 import { DetailedHTMLProps, InputHTMLAttributes } from 'react';
-
 export declare const inputVariants: (props?: ({
     variant?: "default" | "invisible" | null | undefined;
     validationStyleEnabled?: "disabled" | "enabled" | null | undefined;

package/dist/components/Input/InputPassword.d.ts

@@ -1,5 +1,4 @@
 import { InputProps } from './Input';
-
 type InputPasswordProps = Omit<InputProps, 'type'>;
 export declare const InputPassword: import('react').ForwardRefExoticComponent<Omit<InputPasswordProps, "ref"> & import('react').RefAttributes<HTMLInputElement>>;
 export {};

package/dist/components/Input/index.cjs

@@ -2,7 +2,10 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const components_Input_Input = require("./Input.cjs");
 const components_Input_InputPassword = require("./InputPassword.cjs");
+const components_Input_Checkbox = require("./Checkbox.cjs");
 exports.Input = components_Input_Input.Input;
 exports.inputVariants = components_Input_Input.inputVariants;
 exports.InputPassword = components_Input_InputPassword.InputPassword;
+exports.Checkbox = components_Input_Checkbox.Checkbox;
+exports.checkboxVariants = components_Input_Checkbox.checkboxVariants;
 //# sourceMappingURL=index.cjs.map

package/dist/components/Input/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}

package/dist/components/Input/index.d.ts

@@ -1,3 +1,4 @@
 export * from './Input';
 export * from './InputPassword';
+export * from './Checkbox';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Input/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Input/index.tsx"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Input/index.tsx"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC"}

package/dist/components/Input/index.mjs

@@ -1,8 +1,11 @@
 import { Input, inputVariants } from "./Input.mjs";
 import { InputPassword } from "./InputPassword.mjs";
+import { Checkbox, checkboxVariants } from "./Checkbox.mjs";
 export {
+  Checkbox,
   Input,
   InputPassword,
+  checkboxVariants,
   inputVariants
 };
 //# sourceMappingURL=index.mjs.map

package/dist/components/Input/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/components/Label/index.d.ts

@@ -1,4 +1,3 @@
 import { LabelHTMLAttributes } from 'react';
-
 export declare const Label: import('react').ForwardRefExoticComponent<LabelHTMLAttributes<HTMLLabelElement> & import('react').RefAttributes<HTMLLabelElement>>;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Link/Link.cjs

@@ -11,7 +11,9 @@ const linkVariants = classVarianceAuthority.cva(
       variant: {
         outline: "rounded-lg border-[1.5px] bg-opacity-0 hover:bg-opacity-30 dark:bg-opacity-0",
         default: "h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent hover:underline dark:bg-transparent hover:dark:bg-transparent",
-        "invisible-link": "h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent dark:bg-transparent hover:dark:bg-transparent"
+        "invisible-link": "h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent dark:bg-transparent hover:dark:bg-transparent",
+        button: "rounded-lg text-text-opposite dark:text-text-opposite-dark disabled:opacity-50 flex items-center justify-center gap-2 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 leading-9",
+        hoverable: "rounded-lg border-none bg-opacity-0 transition hover:bg-opacity-10 aria-[current=true]:bg-opacity-5 dark:border-none dark:bg-opacity-0 dark:hover:bg-opacity-10"
       },
       color: {
         primary: "border-primary bg-primary text-primary hover:bg-primary-500 dark:border-primary-dark dark:bg-primary-dark dark:text-primary-dark hover:dark:bg-primary-300",
@@ -38,16 +40,19 @@ const Link = require$$0.forwardRef(
     children,
     label,
     className,
+    isActive,
     isExternalLink: isExternalLinkProp,
     ...props
   }, ref) => {
     const isChildrenString = typeof children === "string";
-    const isExternalLink = isChildrenString ?? isExternalLinkProp ?? isExternal(props.href);
+    const isExternalLink = isExternalLinkProp === true || typeof isExternalLinkProp === "undefined" && isChildrenString && isExternal(props.href);
     return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
       "a",
       {
         ref,
         "aria-label": label,
+        "aria-current": isActive,
+        "aria-selected": isActive,
         className: linkVariants({
           variant,
           color,

package/dist/components/Link/Link.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Link.cjs","sources":["../../../src/components/Link/Link.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { ExternalLink } from 'lucide-react';\nimport {\n  forwardRef,\n  type DetailedHTMLProps,\n  type AnchorHTMLAttributes,\n} from 'react';\n\nconst linkVariants = cva(\n  'gap-3 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n  {\n    variants: {\n      variant: {\n        outline:\n          'rounded-lg border-[1.5px] bg-opacity-0 hover:bg-opacity-30 dark:bg-opacity-0',\n        default:\n          'h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent hover:underline dark:bg-transparent hover:dark:bg-transparent',\n        'invisible-link':\n          'h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent dark:bg-transparent hover:dark:bg-transparent',\n      },\n      color: {\n        primary:\n          'border-primary bg-primary text-primary hover:bg-primary-500 dark:border-primary-dark dark:bg-primary-dark dark:text-primary-dark hover:dark:bg-primary-300',\n        secondary:\n          'border-secondary bg-secondary text-secondary hover:bg-secondary-300 dark:border-secondary-dark dark:bg-secondary-dark dark:text-secondary-dark hover:dark:bg-secondary-100',\n        destructive:\n          'border-destructive bg-destructive text-destructive hover:bg-destructive-500 dark:border-destructive-dark dark:bg-destructive-dark hover:dark:bg-destructive-200',\n        neutral:\n          'border-neutral bg-neutral text-neutral hover:bg-neutral-600 dark:border-neutral-dark dark:bg-neutral-dark dark:text-neutral-dark hover:dark:bg-neutral-400',\n        light: 'border-white bg-white text-white hover:bg-neutral-500',\n        dark: 'border-neutral-800 bg-neutral-800 text-neutral-800 hover:bg-neutral-900 dark:hover:bg-neutral-700',\n        text: 'border-text bg-text text-text hover:opacity-80 dark:border-text-dark dark:bg-text-dark dark:text-text-dark',\n        custom: '',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      color: 'primary',\n    },\n  }\n);\n\nexport type LinkProps = DetailedHTMLProps<\n  AnchorHTMLAttributes<HTMLAnchorElement>,\n  HTMLAnchorElement\n> &\n  VariantProps<typeof linkVariants> & {\n    label: string;\n    isExternalLink?: boolean;\n  };\n\nconst isExternal = (href = ''): boolean => /^https?:\\/\\//.test(href);\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(\n  (\n    {\n      variant = 'default',\n      color = 'primary',\n      children,\n      label,\n      className,\n      isExternalLink: isExternalLinkProp,\n      ...props\n    },\n    ref\n  ) => {\n    const isChildrenString = typeof children === 'string';\n    const isExternalLink =\n      isChildrenString ?? isExternalLinkProp ?? isExternal(props.href);\n\n    return (\n      <a\n        ref={ref}\n        aria-label={label}\n        className={linkVariants({\n          variant,\n          color,\n          className,\n        })}\n        {...props}\n      >\n        {children}\n        {isExternalLink && <ExternalLink className=\"size-4\" />}\n      </a>\n    );\n  }\n);\n\nLink.displayName = 'Link';\n"],"names":["cva","forwardRef","jsxs","jsx","ExternalLink"],"mappings":";;;;;;AAQA,MAAM,eAAeA,uBAAA;AAAA,EACnB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SACE;AAAA,QACF,SACE;AAAA,QACF,kBACE;AAAA,MACJ;AAAA,MACA,OAAO;AAAA,QACL,SACE;AAAA,QACF,WACE;AAAA,QACF,aACE;AAAA,QACF,SACE;AAAA,QACF,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,OAAO;AAAA,IACT;AAAA,EACF;AACF;AAWA,MAAM,aAAa,CAAC,OAAO,OAAgB,eAAe,KAAK,IAAI;AAE5D,MAAM,OAAOC,WAAA;AAAA,EAClB,CACE;AAAA,IACE,UAAU;AAAA,IACV,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,GAAG;AAAA,KAEL,QACG;AACG,UAAA,mBAAmB,OAAO,aAAa;AAC7C,UAAM,iBACJ,oBAAoB,sBAAsB,WAAW,MAAM,IAAI;AAG/D,WAAAC,2BAAA,kBAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,cAAY;AAAA,QACZ,WAAW,aAAa;AAAA,UACtB;AAAA,UACA;AAAA,UACA;AAAA,QAAA,CACD;AAAA,QACA,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA;AAAA,UACA,kBAAkBC,2BAAAA,kBAAAA,IAACC,YAAAA,cAAa,EAAA,WAAU,SAAS,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAG1D;AACF;AAEA,KAAK,cAAc;;"}
+{"version":3,"file":"Link.cjs","sources":["../../../src/components/Link/Link.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { ExternalLink } from 'lucide-react';\nimport {\n  forwardRef,\n  type DetailedHTMLProps,\n  type AnchorHTMLAttributes,\n} from 'react';\n\nconst linkVariants = cva(\n  'gap-3 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n  {\n    variants: {\n      variant: {\n        outline:\n          'rounded-lg border-[1.5px] bg-opacity-0 hover:bg-opacity-30 dark:bg-opacity-0',\n        default:\n          'h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent hover:underline dark:bg-transparent hover:dark:bg-transparent',\n        'invisible-link':\n          'h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent dark:bg-transparent hover:dark:bg-transparent',\n\n        button:\n          'rounded-lg text-text-opposite dark:text-text-opposite-dark disabled:opacity-50 flex items-center justify-center gap-2 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 leading-9',\n        hoverable:\n          'rounded-lg border-none bg-opacity-0 transition hover:bg-opacity-10 aria-[current=true]:bg-opacity-5 dark:border-none dark:bg-opacity-0 dark:hover:bg-opacity-10',\n      },\n      color: {\n        primary:\n          'border-primary bg-primary text-primary hover:bg-primary-500 dark:border-primary-dark dark:bg-primary-dark dark:text-primary-dark hover:dark:bg-primary-300',\n        secondary:\n          'border-secondary bg-secondary text-secondary hover:bg-secondary-300 dark:border-secondary-dark dark:bg-secondary-dark dark:text-secondary-dark hover:dark:bg-secondary-100',\n        destructive:\n          'border-destructive bg-destructive text-destructive hover:bg-destructive-500 dark:border-destructive-dark dark:bg-destructive-dark hover:dark:bg-destructive-200',\n        neutral:\n          'border-neutral bg-neutral text-neutral hover:bg-neutral-600 dark:border-neutral-dark dark:bg-neutral-dark dark:text-neutral-dark hover:dark:bg-neutral-400',\n        light: 'border-white bg-white text-white hover:bg-neutral-500',\n        dark: 'border-neutral-800 bg-neutral-800 text-neutral-800 hover:bg-neutral-900 dark:hover:bg-neutral-700',\n        text: 'border-text bg-text text-text hover:opacity-80 dark:border-text-dark dark:bg-text-dark dark:text-text-dark',\n        custom: '',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      color: 'primary',\n    },\n  }\n);\n\nexport type LinkProps = DetailedHTMLProps<\n  AnchorHTMLAttributes<HTMLAnchorElement>,\n  HTMLAnchorElement\n> &\n  VariantProps<typeof linkVariants> & {\n    label: string;\n    isExternalLink?: boolean;\n    isActive?: boolean;\n  };\n\nconst isExternal = (href = ''): boolean => /^https?:\\/\\//.test(href);\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(\n  (\n    {\n      variant = 'default',\n      color = 'primary',\n      children,\n      label,\n      className,\n      isActive,\n      isExternalLink: isExternalLinkProp,\n      ...props\n    },\n    ref\n  ) => {\n    const isChildrenString = typeof children === 'string';\n    const isExternalLink =\n      isExternalLinkProp === true ||\n      (typeof isExternalLinkProp === 'undefined' &&\n        isChildrenString &&\n        isExternal(props.href));\n\n    return (\n      <a\n        ref={ref}\n        aria-label={label}\n        aria-current={isActive}\n        aria-selected={isActive}\n        className={linkVariants({\n          variant,\n          color,\n          className,\n        })}\n        {...props}\n      >\n        {children}\n        {isExternalLink && <ExternalLink className=\"size-4\" />}\n      </a>\n    );\n  }\n);\n\nLink.displayName = 'Link';\n"],"names":["cva","forwardRef","jsxs","jsx","ExternalLink"],"mappings":";;;;;;AAQA,MAAM,eAAeA,uBAAA;AAAA,EACnB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SACE;AAAA,QACF,SACE;AAAA,QACF,kBACE;AAAA,QAEF,QACE;AAAA,QACF,WACE;AAAA,MACJ;AAAA,MACA,OAAO;AAAA,QACL,SACE;AAAA,QACF,WACE;AAAA,QACF,aACE;AAAA,QACF,SACE;AAAA,QACF,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,OAAO;AAAA,IACT;AAAA,EACF;AACF;AAYA,MAAM,aAAa,CAAC,OAAO,OAAgB,eAAe,KAAK,IAAI;AAE5D,MAAM,OAAOC,WAAA;AAAA,EAClB,CACE;AAAA,IACE,UAAU;AAAA,IACV,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,GAAG;AAAA,KAEL,QACG;AACG,UAAA,mBAAmB,OAAO,aAAa;AACvC,UAAA,iBACJ,uBAAuB,QACtB,OAAO,uBAAuB,eAC7B,oBACA,WAAW,MAAM,IAAI;AAGvB,WAAAC,2BAAA,kBAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,cAAY;AAAA,QACZ,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,WAAW,aAAa;AAAA,UACtB;AAAA,UACA;AAAA,UACA;AAAA,QAAA,CACD;AAAA,QACA,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA;AAAA,UACA,kBAAkBC,2BAAAA,kBAAAA,IAACC,YAAAA,cAAa,EAAA,WAAU,SAAS,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAG1D;AACF;AAEA,KAAK,cAAc;;"}

package/dist/components/Link/Link.d.ts

@@ -1,13 +1,13 @@
 import { VariantProps } from 'class-variance-authority';
 import { DetailedHTMLProps, AnchorHTMLAttributes } from 'react';
-
 declare const linkVariants: (props?: ({
-    variant?: "default" | "outline" | "invisible-link" | null | undefined;
-    color?: "text" | "primary" | "secondary" | "destructive" | "neutral" | "light" | "dark" | "custom" | null | undefined;
+    variant?: "default" | "button" | "outline" | "invisible-link" | "hoverable" | null | undefined;
+    color?: "text" | "dark" | "light" | "primary" | "secondary" | "destructive" | "neutral" | "custom" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type LinkProps = DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> & VariantProps<typeof linkVariants> & {
     label: string;
     isExternalLink?: boolean;
+    isActive?: boolean;
 };
 export declare const Link: import('react').ForwardRefExoticComponent<Omit<LinkProps, "ref"> & import('react').RefAttributes<HTMLAnchorElement>>;
 export {};

package/dist/components/Link/Link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAElE,OAAO,EAEL,KAAK,iBAAiB,EACtB,KAAK,oBAAoB,EAC1B,MAAM,OAAO,CAAC;AAEf,QAAA,MAAM,YAAY;;;8EAgCjB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,iBAAiB,CACvC,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,iBAAiB,CAClB,GACC,YAAY,CAAC,OAAO,YAAY,CAAC,GAAG;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AAIJ,eAAO,MAAM,IAAI,sHAiChB,CAAC"}
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAElE,OAAO,EAEL,KAAK,iBAAiB,EACtB,KAAK,oBAAoB,EAC1B,MAAM,OAAO,CAAC;AAEf,QAAA,MAAM,YAAY;;;8EAqCjB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,iBAAiB,CACvC,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,iBAAiB,CAClB,GACC,YAAY,CAAC,OAAO,YAAY,CAAC,GAAG;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAIJ,eAAO,MAAM,IAAI,sHAuChB,CAAC"}

package/dist/components/Link/Link.mjs

@@ -9,7 +9,9 @@ const linkVariants = cva(
       variant: {
         outline: "rounded-lg border-[1.5px] bg-opacity-0 hover:bg-opacity-30 dark:bg-opacity-0",
         default: "h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent hover:underline dark:bg-transparent hover:dark:bg-transparent",
-        "invisible-link": "h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent dark:bg-transparent hover:dark:bg-transparent"
+        "invisible-link": "h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent dark:bg-transparent hover:dark:bg-transparent",
+        button: "rounded-lg text-text-opposite dark:text-text-opposite-dark disabled:opacity-50 flex items-center justify-center gap-2 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 leading-9",
+        hoverable: "rounded-lg border-none bg-opacity-0 transition hover:bg-opacity-10 aria-[current=true]:bg-opacity-5 dark:border-none dark:bg-opacity-0 dark:hover:bg-opacity-10"
       },
       color: {
         primary: "border-primary bg-primary text-primary hover:bg-primary-500 dark:border-primary-dark dark:bg-primary-dark dark:text-primary-dark hover:dark:bg-primary-300",
@@ -36,16 +38,19 @@ const Link = forwardRef(
     children,
     label,
     className,
+    isActive,
     isExternalLink: isExternalLinkProp,
     ...props
   }, ref) => {
     const isChildrenString = typeof children === "string";
-    const isExternalLink = isChildrenString ?? isExternalLinkProp ?? isExternal(props.href);
+    const isExternalLink = isExternalLinkProp === true || typeof isExternalLinkProp === "undefined" && isChildrenString && isExternal(props.href);
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "a",
       {
         ref,
         "aria-label": label,
+        "aria-current": isActive,
+        "aria-selected": isActive,
         className: linkVariants({
           variant,
           color,

package/dist/components/Link/Link.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Link.mjs","sources":["../../../src/components/Link/Link.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { ExternalLink } from 'lucide-react';\nimport {\n  forwardRef,\n  type DetailedHTMLProps,\n  type AnchorHTMLAttributes,\n} from 'react';\n\nconst linkVariants = cva(\n  'gap-3 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n  {\n    variants: {\n      variant: {\n        outline:\n          'rounded-lg border-[1.5px] bg-opacity-0 hover:bg-opacity-30 dark:bg-opacity-0',\n        default:\n          'h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent hover:underline dark:bg-transparent hover:dark:bg-transparent',\n        'invisible-link':\n          'h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent dark:bg-transparent hover:dark:bg-transparent',\n      },\n      color: {\n        primary:\n          'border-primary bg-primary text-primary hover:bg-primary-500 dark:border-primary-dark dark:bg-primary-dark dark:text-primary-dark hover:dark:bg-primary-300',\n        secondary:\n          'border-secondary bg-secondary text-secondary hover:bg-secondary-300 dark:border-secondary-dark dark:bg-secondary-dark dark:text-secondary-dark hover:dark:bg-secondary-100',\n        destructive:\n          'border-destructive bg-destructive text-destructive hover:bg-destructive-500 dark:border-destructive-dark dark:bg-destructive-dark hover:dark:bg-destructive-200',\n        neutral:\n          'border-neutral bg-neutral text-neutral hover:bg-neutral-600 dark:border-neutral-dark dark:bg-neutral-dark dark:text-neutral-dark hover:dark:bg-neutral-400',\n        light: 'border-white bg-white text-white hover:bg-neutral-500',\n        dark: 'border-neutral-800 bg-neutral-800 text-neutral-800 hover:bg-neutral-900 dark:hover:bg-neutral-700',\n        text: 'border-text bg-text text-text hover:opacity-80 dark:border-text-dark dark:bg-text-dark dark:text-text-dark',\n        custom: '',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      color: 'primary',\n    },\n  }\n);\n\nexport type LinkProps = DetailedHTMLProps<\n  AnchorHTMLAttributes<HTMLAnchorElement>,\n  HTMLAnchorElement\n> &\n  VariantProps<typeof linkVariants> & {\n    label: string;\n    isExternalLink?: boolean;\n  };\n\nconst isExternal = (href = ''): boolean => /^https?:\\/\\//.test(href);\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(\n  (\n    {\n      variant = 'default',\n      color = 'primary',\n      children,\n      label,\n      className,\n      isExternalLink: isExternalLinkProp,\n      ...props\n    },\n    ref\n  ) => {\n    const isChildrenString = typeof children === 'string';\n    const isExternalLink =\n      isChildrenString ?? isExternalLinkProp ?? isExternal(props.href);\n\n    return (\n      <a\n        ref={ref}\n        aria-label={label}\n        className={linkVariants({\n          variant,\n          color,\n          className,\n        })}\n        {...props}\n      >\n        {children}\n        {isExternalLink && <ExternalLink className=\"size-4\" />}\n      </a>\n    );\n  }\n);\n\nLink.displayName = 'Link';\n"],"names":["jsxs","jsx"],"mappings":";;;;AAQA,MAAM,eAAe;AAAA,EACnB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SACE;AAAA,QACF,SACE;AAAA,QACF,kBACE;AAAA,MACJ;AAAA,MACA,OAAO;AAAA,QACL,SACE;AAAA,QACF,WACE;AAAA,QACF,aACE;AAAA,QACF,SACE;AAAA,QACF,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,OAAO;AAAA,IACT;AAAA,EACF;AACF;AAWA,MAAM,aAAa,CAAC,OAAO,OAAgB,eAAe,KAAK,IAAI;AAE5D,MAAM,OAAO;AAAA,EAClB,CACE;AAAA,IACE,UAAU;AAAA,IACV,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,GAAG;AAAA,KAEL,QACG;AACG,UAAA,mBAAmB,OAAO,aAAa;AAC7C,UAAM,iBACJ,oBAAoB,sBAAsB,WAAW,MAAM,IAAI;AAG/D,WAAAA,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,cAAY;AAAA,QACZ,WAAW,aAAa;AAAA,UACtB;AAAA,UACA;AAAA,UACA;AAAA,QAAA,CACD;AAAA,QACA,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA;AAAA,UACA,kBAAkBC,kCAAAA,IAAC,cAAa,EAAA,WAAU,SAAS,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAG1D;AACF;AAEA,KAAK,cAAc;"}
+{"version":3,"file":"Link.mjs","sources":["../../../src/components/Link/Link.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { ExternalLink } from 'lucide-react';\nimport {\n  forwardRef,\n  type DetailedHTMLProps,\n  type AnchorHTMLAttributes,\n} from 'react';\n\nconst linkVariants = cva(\n  'gap-3 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n  {\n    variants: {\n      variant: {\n        outline:\n          'rounded-lg border-[1.5px] bg-opacity-0 hover:bg-opacity-30 dark:bg-opacity-0',\n        default:\n          'h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent hover:underline dark:bg-transparent hover:dark:bg-transparent',\n        'invisible-link':\n          'h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 hover:bg-transparent dark:bg-transparent hover:dark:bg-transparent',\n\n        button:\n          'rounded-lg text-text-opposite dark:text-text-opposite-dark disabled:opacity-50 flex items-center justify-center gap-2 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 leading-9',\n        hoverable:\n          'rounded-lg border-none bg-opacity-0 transition hover:bg-opacity-10 aria-[current=true]:bg-opacity-5 dark:border-none dark:bg-opacity-0 dark:hover:bg-opacity-10',\n      },\n      color: {\n        primary:\n          'border-primary bg-primary text-primary hover:bg-primary-500 dark:border-primary-dark dark:bg-primary-dark dark:text-primary-dark hover:dark:bg-primary-300',\n        secondary:\n          'border-secondary bg-secondary text-secondary hover:bg-secondary-300 dark:border-secondary-dark dark:bg-secondary-dark dark:text-secondary-dark hover:dark:bg-secondary-100',\n        destructive:\n          'border-destructive bg-destructive text-destructive hover:bg-destructive-500 dark:border-destructive-dark dark:bg-destructive-dark hover:dark:bg-destructive-200',\n        neutral:\n          'border-neutral bg-neutral text-neutral hover:bg-neutral-600 dark:border-neutral-dark dark:bg-neutral-dark dark:text-neutral-dark hover:dark:bg-neutral-400',\n        light: 'border-white bg-white text-white hover:bg-neutral-500',\n        dark: 'border-neutral-800 bg-neutral-800 text-neutral-800 hover:bg-neutral-900 dark:hover:bg-neutral-700',\n        text: 'border-text bg-text text-text hover:opacity-80 dark:border-text-dark dark:bg-text-dark dark:text-text-dark',\n        custom: '',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      color: 'primary',\n    },\n  }\n);\n\nexport type LinkProps = DetailedHTMLProps<\n  AnchorHTMLAttributes<HTMLAnchorElement>,\n  HTMLAnchorElement\n> &\n  VariantProps<typeof linkVariants> & {\n    label: string;\n    isExternalLink?: boolean;\n    isActive?: boolean;\n  };\n\nconst isExternal = (href = ''): boolean => /^https?:\\/\\//.test(href);\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(\n  (\n    {\n      variant = 'default',\n      color = 'primary',\n      children,\n      label,\n      className,\n      isActive,\n      isExternalLink: isExternalLinkProp,\n      ...props\n    },\n    ref\n  ) => {\n    const isChildrenString = typeof children === 'string';\n    const isExternalLink =\n      isExternalLinkProp === true ||\n      (typeof isExternalLinkProp === 'undefined' &&\n        isChildrenString &&\n        isExternal(props.href));\n\n    return (\n      <a\n        ref={ref}\n        aria-label={label}\n        aria-current={isActive}\n        aria-selected={isActive}\n        className={linkVariants({\n          variant,\n          color,\n          className,\n        })}\n        {...props}\n      >\n        {children}\n        {isExternalLink && <ExternalLink className=\"size-4\" />}\n      </a>\n    );\n  }\n);\n\nLink.displayName = 'Link';\n"],"names":["jsxs","jsx"],"mappings":";;;;AAQA,MAAM,eAAe;AAAA,EACnB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SACE;AAAA,QACF,SACE;AAAA,QACF,kBACE;AAAA,QAEF,QACE;AAAA,QACF,WACE;AAAA,MACJ;AAAA,MACA,OAAO;AAAA,QACL,SACE;AAAA,QACF,WACE;AAAA,QACF,aACE;AAAA,QACF,SACE;AAAA,QACF,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,OAAO;AAAA,IACT;AAAA,EACF;AACF;AAYA,MAAM,aAAa,CAAC,OAAO,OAAgB,eAAe,KAAK,IAAI;AAE5D,MAAM,OAAO;AAAA,EAClB,CACE;AAAA,IACE,UAAU;AAAA,IACV,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,GAAG;AAAA,KAEL,QACG;AACG,UAAA,mBAAmB,OAAO,aAAa;AACvC,UAAA,iBACJ,uBAAuB,QACtB,OAAO,uBAAuB,eAC7B,oBACA,WAAW,MAAM,IAAI;AAGvB,WAAAA,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,cAAY;AAAA,QACZ,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,WAAW,aAAa;AAAA,UACtB;AAAA,UACA;AAAA,UACA;AAAA,QAAA,CACD;AAAA,QACA,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA;AAAA,UACA,kBAAkBC,kCAAAA,IAAC,cAAa,EAAA,WAAU,SAAS,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAG1D;AACF;AAEA,KAAK,cAAc;"}

package/dist/components/Loader/index.d.ts

@@ -1,5 +1,4 @@
 import { FC, HTMLAttributes } from 'react';
-
 export interface LoaderProps extends HTMLAttributes<HTMLDivElement> {
     isLoading?: boolean;
 }

package/dist/components/Loader/spinner.d.ts

@@ -1,5 +1,4 @@
 import { SVGProps } from 'react';
-
 type SpinnerProps = SVGProps<SVGSVGElement> & {
     strokeWidth?: number;
 };

package/dist/components/LocaleSwitcherDropDown/LocaleSwitcher.d.ts

@@ -1,6 +1,5 @@
 import { Locales } from '@intlayer/config/client';
 import { FC } from 'react';
-
 export type LocaleSwitcherProps = {
     locale?: Locales;
     localeList: Locales[];

package/dist/components/Logo/LogoCircle.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 import { LogoBaseProps } from '.';
-
 export declare const LogoCircle: FC<LogoBaseProps>;
 //# sourceMappingURL=LogoCircle.d.ts.map

package/dist/components/Logo/LogoNoFrame.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 import { LogoBaseProps } from '.';
-
 export declare const LogoNoFrame: FC<LogoBaseProps>;
 //# sourceMappingURL=LogoNoFrame.d.ts.map

package/dist/components/Logo/LogoSquare.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 import { LogoBaseProps } from '.';
-
 export declare const LogoSquare: FC<LogoBaseProps>;
 //# sourceMappingURL=LogoSquare.d.ts.map

package/dist/components/Logo/LogoSquircle.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 import { LogoBaseProps } from '.';
-
 export declare const LogoSquircle: FC<LogoBaseProps>;
 //# sourceMappingURL=LogoSquircle.d.ts.map

package/dist/components/Logo/LogoTextOnly.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 import { LogoBaseProps } from '.';
-
 export declare const LogoTextOnly: FC<LogoBaseProps>;
 //# sourceMappingURL=LogoTextOnly.d.ts.map

package/dist/components/Logo/LogoWithTextBelowCircle.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 import { LogoBaseProps } from '.';
-
 export declare const LogoWithTextBelowCircle: FC<LogoBaseProps>;
 //# sourceMappingURL=LogoWithTextBelowCircle.d.ts.map

package/dist/components/Logo/LogoWithTextBelowNoFrame.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 import { LogoBaseProps } from '.';
-
 export declare const LogoWithTextBelowNoFrame: FC<LogoBaseProps>;
 //# sourceMappingURL=LogoWithTextBelowNoFrame.d.ts.map

package/dist/components/Logo/LogoWithTextBelowSquircle.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 import { LogoBaseProps } from '.';
-
 export declare const LogoWithTextBelowSquircle: FC<LogoBaseProps>;
 //# sourceMappingURL=LogoWithTextBelowSquircle.d.ts.map

package/dist/components/Logo/LogoWithTextCircle.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 import { LogoBaseProps } from '.';
-
 export declare const LogoWithTextCircle: FC<LogoBaseProps>;
 //# sourceMappingURL=LogoWithTextCircle.d.ts.map

package/dist/components/Logo/LogoWithTextNoFrame.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 import { LogoBaseProps } from '.';
-
 export declare const LogoWithTextNoFrame: FC<LogoBaseProps>;
 //# sourceMappingURL=LogoWithTextNoFrame.d.ts.map

package/dist/components/Logo/LogoWithTextSquircle.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
 import { LogoBaseProps } from '.';
-
 export declare const LogoWithTextSquircle: FC<LogoBaseProps>;
 //# sourceMappingURL=LogoWithTextSquircle.d.ts.map

package/dist/components/Logo/index.d.ts

@@ -1,5 +1,4 @@
 import { FC, SVGProps } from 'react';
-
 export type LogoBaseProps = SVGProps<SVGSVGElement> & {
     bgColor?: string;
 };

package/dist/components/MarkDownRender/index.d.ts

@@ -1,5 +1,4 @@
 import { FC } from 'react';
-
 type MarkdownRendererProps = {
     isDarkMode?: boolean;
     children: string;

package/dist/components/MaxHeightSmoother/index.d.ts

@@ -1,5 +1,4 @@
 import { FC, HTMLAttributes, ReactNode } from 'react';
-
 interface MaxHeightSmootherProps extends HTMLAttributes<HTMLDivElement> {
     children: ReactNode;
     isHidden?: boolean;

package/dist/components/MaxWidthSmoother/index.d.ts

@@ -1,5 +1,4 @@
 import { HTMLAttributes } from 'react';
-
 type Align = 'left' | 'right';
 type MaxHeightSmootherProps = HTMLAttributes<HTMLDivElement> & {
     isHidden: boolean;

package/dist/components/Modal/Modal.cjs

@@ -21,20 +21,23 @@ require("deepmerge");
 const utils_cn = require("../../utils/cn.cjs");
 const components_Container_index = require("../Container/index.cjs");
 const components_Headers_index = require("../Headers/index.cjs");
-const modalVariants = classVarianceAuthority.cva("cursor-default overflow-auto p-3 shadow", {
-  variants: {
-    variant: {
-      sm: "w-full max-h-[30vh] max-w-[30vw]",
-      md: "w-full max-h-[50vh] max-w-[50vw]",
-      lg: "w-full max-h-[70vh] max-w-[70vw]",
-      xl: "w-full max-h-[95vh] max-w-[95vw]",
-      unset: "max-h-[95vh] max-w-[95vw]"
+const modalVariants = classVarianceAuthority.cva(
+  "cursor-default overflow-auto p-3 shadow justify-center",
+  {
+    variants: {
+      variant: {
+        sm: "w-full max-h-[30vh] max-w-[30vw]",
+        md: "w-full max-h-[50vh] max-w-[50vw]",
+        lg: "w-full max-h-[70vh] max-w-[70vw]",
+        xl: "w-full max-h-[95vh] max-w-[95vw]",
+        unset: "max-h-[95vh] max-w-[95vw]"
+      }
+    },
+    defaultVariants: {
+      variant: "unset"
     }
-  },
-  defaultVariants: {
-    variant: "unset"
   }
-});
+);
 const MotionModal = framerMotion.motion.create(components_Container_index.Container);
 const Modal = ({
   children,
@@ -44,7 +47,8 @@ const Modal = ({
   onClose,
   hasCloseButton = false,
   title,
-  size = "unset"
+  size = "unset",
+  ...props
 }) => {
   const containerElement = hooks_useGetElementOrWindow.useGetElementOrWindow(container);
   hooks_useScrollBlockage_index.useScrollBlockage({ key: "modal", disableScroll: isOpen && disableScroll });
@@ -81,7 +85,7 @@ const Modal = ({
             role: "dialog",
             "aria-modal": true,
             roundedSize: "2xl",
-            transparency: "sm",
+            ...props,
             children: [
               /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
                 "div",
@@ -106,7 +110,7 @@ const Modal = ({
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "mx-2 my-4 flex flex-1 flex-col items-center justify-center overflow-auto", children })
+              /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "mx-2 my-4 flex flex-1 flex-col items-center overflow-auto", children })
             ]
           }
         )

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.cjs","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["/* eslint-disable sonarjs/no-nested-conditional */\n'use client';\n\nimport { cva } from 'class-variance-authority';\nimport { motion } from 'framer-motion';\nimport { X } from 'lucide-react';\nimport type { FC } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useGetElementOrWindow, useScrollBlockage } from '../../hooks/index';\nimport { cn } from '../../utils/cn';\nimport { Container } from '../Container';\nimport { H3 } from '../Headers';\n\ninterface ModalProps {\n  children: React.ReactNode;\n  isOpen: boolean;\n  onClose: () => void;\n  container?: HTMLElement;\n  disableScroll?: boolean;\n  hasCloseButton?: boolean;\n  title?: string;\n  size?: Size;\n}\n\nconst modalVariants = cva('cursor-default overflow-auto p-3 shadow', {\n  variants: {\n    variant: {\n      sm: 'w-full max-h-[30vh] max-w-[30vw]',\n      md: 'w-full max-h-[50vh] max-w-[50vw]',\n      lg: 'w-full max-h-[70vh] max-w-[70vw]',\n      xl: 'w-full max-h-[95vh] max-w-[95vw]',\n      unset: 'max-h-[95vh] max-w-[95vw]',\n    },\n  },\n  defaultVariants: {\n    variant: 'unset',\n  },\n});\n\ntype Size = 'sm' | 'md' | 'lg' | 'xl' | 'unset';\n\nconst MotionModal = motion.create(Container);\n\n/**\n * Usage example:\n * ```jsx\n * <Modal isOpen={isOpen} onClose={onClose}>\n *   Modal content\n * </Modal>\n * ```\n */\nexport const Modal: FC<ModalProps> = ({\n  children,\n  isOpen,\n  container,\n  disableScroll = false,\n  onClose,\n  hasCloseButton = false,\n  title,\n  size = 'unset',\n}) => {\n  const containerElement = useGetElementOrWindow(container);\n\n  useScrollBlockage({ key: 'modal', disableScroll: isOpen && disableScroll });\n\n  if (!containerElement) return <></>;\n\n  const hasTitle = typeof title === 'string';\n\n  return createPortal(\n    <motion.div\n      className={cn(\n        'bg-background/40 dark:bg-background-dark/40 fixed left-0 top-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-auto backdrop-blur',\n        isOpen ? 'visible' : 'hidden'\n      )}\n      initial={{ opacity: isOpen ? 0 : 1 }}\n      animate={{ opacity: isOpen ? 1 : 0 }}\n      transition={{ duration: 0.1 }}\n      onClick={(e) => {\n        e.stopPropagation();\n        onClose();\n      }}\n      aria-hidden={!isOpen}\n    >\n      <MotionModal\n        onClick={(e) => e.stopPropagation()}\n        initial={{ scale: isOpen ? 0.5 : 1 }}\n        animate={{ scale: isOpen ? 1 : 0.5 }}\n        transition={{ duration: 0.3 }}\n        className={cn(\n          modalVariants({\n            variant: size,\n          })\n        )}\n        role=\"dialog\"\n        aria-modal\n        roundedSize=\"2xl\"\n        transparency=\"sm\"\n      >\n        <div\n          className={cn(\n            hasCloseButton && hasTitle\n              ? `flex items-center justify-center`\n              : hasCloseButton\n                ? `flex items-center justify-end`\n                : hasTitle\n                  ? `items-center`\n                  : `hidden`\n          )}\n        >\n          {hasTitle && (\n            <H3 className=\"flex items-center justify-center text-lg font-bold\">\n              {title}\n            </H3>\n          )}\n          {hasCloseButton && (\n            <X\n              role=\"button\"\n              aria-label=\"Close modal\"\n              className=\"right-2 top-2 ml-auto cursor-pointer\"\n              onClick={(e) => {\n                e.stopPropagation();\n                onClose();\n              }}\n            />\n          )}\n        </div>\n        <div className=\"mx-2 my-4 flex flex-1 flex-col items-center justify-center overflow-auto\">\n          {children}\n        </div>\n      </MotionModal>\n    </motion.div>,\n    containerElement\n  );\n};\n"],"names":["cva","motion","Container","useGetElementOrWindow","useScrollBlockage","jsx","Fragment","createPortal","cn","jsxs","H3","X"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAM,gBAAgBA,2BAAI,2CAA2C;AAAA,EACnE,UAAU;AAAA,IACR,SAAS;AAAA,MACP,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,OAAO;AAAA,IACT;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,EACX;AACF,CAAC;AAID,MAAM,cAAcC,aAAO,OAAA,OAAOC,2BAAAA,SAAS;AAUpC,MAAM,QAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA,OAAO;AACT,MAAM;AACE,QAAA,mBAAmBC,kDAAsB,SAAS;AAExDC,gCAAA,kBAAkB,EAAE,KAAK,SAAS,eAAe,UAAU,eAAe;AAEtE,MAAA,CAAC,iBAAkB,QAASC,2BAAA,kBAAA,IAAAC,WAAA,kBAAA,UAAA,CAAA,CAAA;AAE1B,QAAA,WAAW,OAAO,UAAU;AAE3B,SAAAC,SAAA;AAAA,IACLF,2BAAA,kBAAA;AAAA,MAACJ,aAAAA,OAAO;AAAA,MAAP;AAAA,QACC,WAAWO,SAAA;AAAA,UACT;AAAA,UACA,SAAS,YAAY;AAAA,QACvB;AAAA,QACA,SAAS,EAAE,SAAS,SAAS,IAAI,EAAE;AAAA,QACnC,SAAS,EAAE,SAAS,SAAS,IAAI,EAAE;AAAA,QACnC,YAAY,EAAE,UAAU,IAAI;AAAA,QAC5B,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AACV;QACV;AAAA,QACA,eAAa,CAAC;AAAA,QAEd,UAAAC,2BAAA,kBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,YAClC,SAAS,EAAE,OAAO,SAAS,MAAM,EAAE;AAAA,YACnC,SAAS,EAAE,OAAO,SAAS,IAAI,IAAI;AAAA,YACnC,YAAY,EAAE,UAAU,IAAI;AAAA,YAC5B,WAAWD,SAAA;AAAA,cACT,cAAc;AAAA,gBACZ,SAAS;AAAA,cAAA,CACV;AAAA,YACH;AAAA,YACA,MAAK;AAAA,YACL,cAAU;AAAA,YACV,aAAY;AAAA,YACZ,cAAa;AAAA,YAEb,UAAA;AAAA,cAAAC,2BAAA,kBAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAWD,SAAA;AAAA,oBACT,kBAAkB,WACd,qCACA,iBACE,kCACA,WACE,iBACA;AAAA,kBACV;AAAA,kBAEC,UAAA;AAAA,oBAAA,YACEH,2BAAA,kBAAA,IAAAK,6BAAA,EAAG,WAAU,sDACX,UACH,OAAA;AAAA,oBAED,kBACCL,2BAAA,kBAAA;AAAA,sBAACM,YAAA;AAAA,sBAAA;AAAA,wBACC,MAAK;AAAA,wBACL,cAAW;AAAA,wBACX,WAAU;AAAA,wBACV,SAAS,CAAC,MAAM;AACd,4BAAE,gBAAgB;AACV;wBACV;AAAA,sBAAA;AAAA,oBACF;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAEJ;AAAA,cACCN,2BAAAA,kBAAAA,IAAA,OAAA,EAAI,WAAU,4EACZ,SACH,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IACF;AAAA,IACA;AAAA,EAAA;AAEJ;;"}
+{"version":3,"file":"Modal.cjs","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["'use client';\n\nimport { cva } from 'class-variance-authority';\nimport { motion } from 'framer-motion';\nimport { X } from 'lucide-react';\nimport type { FC } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useGetElementOrWindow, useScrollBlockage } from '../../hooks/index';\nimport { cn } from '../../utils/cn';\nimport { Container, type ContainerProps } from '../Container';\nimport { H3 } from '../Headers';\n\ntype ModalProps = {\n  children: React.ReactNode;\n  isOpen: boolean;\n  onClose: () => void;\n  container?: HTMLElement;\n  disableScroll?: boolean;\n  hasCloseButton?: boolean;\n  title?: string;\n  size?: Size;\n} & Pick<ContainerProps, 'transparency'>;\n\nconst modalVariants = cva(\n  'cursor-default overflow-auto p-3 shadow justify-center',\n  {\n    variants: {\n      variant: {\n        sm: 'w-full max-h-[30vh] max-w-[30vw]',\n        md: 'w-full max-h-[50vh] max-w-[50vw]',\n        lg: 'w-full max-h-[70vh] max-w-[70vw]',\n        xl: 'w-full max-h-[95vh] max-w-[95vw]',\n        unset: 'max-h-[95vh] max-w-[95vw]',\n      },\n    },\n    defaultVariants: {\n      variant: 'unset',\n    },\n  }\n);\n\ntype Size = 'sm' | 'md' | 'lg' | 'xl' | 'unset';\n\nconst MotionModal = motion.create(Container);\n\n/**\n * Usage example:\n * ```jsx\n * <Modal isOpen={isOpen} onClose={onClose}>\n *   Modal content\n * </Modal>\n * ```\n */\nexport const Modal: FC<ModalProps> = ({\n  children,\n  isOpen,\n  container,\n\n  disableScroll = false,\n  onClose,\n  hasCloseButton = false,\n  title,\n  size = 'unset',\n  ...props\n}) => {\n  const containerElement = useGetElementOrWindow(container);\n\n  useScrollBlockage({ key: 'modal', disableScroll: isOpen && disableScroll });\n\n  if (!containerElement) return <></>;\n\n  const hasTitle = typeof title === 'string';\n\n  return createPortal(\n    <motion.div\n      className={cn(\n        'bg-background/40 dark:bg-background-dark/40 fixed left-0 top-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-auto backdrop-blur',\n        isOpen ? 'visible' : 'hidden'\n      )}\n      initial={{ opacity: isOpen ? 0 : 1 }}\n      animate={{ opacity: isOpen ? 1 : 0 }}\n      transition={{ duration: 0.1 }}\n      onClick={(e) => {\n        e.stopPropagation();\n        onClose();\n      }}\n      aria-hidden={!isOpen}\n    >\n      <MotionModal\n        onClick={(e) => e.stopPropagation()}\n        initial={{ scale: isOpen ? 0.5 : 1 }}\n        animate={{ scale: isOpen ? 1 : 0.5 }}\n        transition={{ duration: 0.3 }}\n        className={cn(\n          modalVariants({\n            variant: size,\n          })\n        )}\n        role=\"dialog\"\n        aria-modal\n        roundedSize=\"2xl\"\n        {...props}\n      >\n        <div\n          className={cn(\n            hasCloseButton && hasTitle\n              ? `flex items-center justify-center`\n              : hasCloseButton\n                ? `flex items-center justify-end`\n                : hasTitle\n                  ? `items-center`\n                  : `hidden`\n          )}\n        >\n          {hasTitle && (\n            <H3 className=\"flex items-center justify-center text-lg font-bold\">\n              {title}\n            </H3>\n          )}\n          {hasCloseButton && (\n            <X\n              role=\"button\"\n              aria-label=\"Close modal\"\n              className=\"right-2 top-2 ml-auto cursor-pointer\"\n              onClick={(e) => {\n                e.stopPropagation();\n                onClose();\n              }}\n            />\n          )}\n        </div>\n        <div className=\"mx-2 my-4 flex flex-1 flex-col items-center overflow-auto\">\n          {children}\n        </div>\n      </MotionModal>\n    </motion.div>,\n    containerElement\n  );\n};\n"],"names":["cva","motion","Container","useGetElementOrWindow","useScrollBlockage","jsx","Fragment","createPortal","cn","jsxs","H3","X"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAuBA,MAAM,gBAAgBA,uBAAA;AAAA,EACpB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,OAAO;AAAA,MACT;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,IACX;AAAA,EACF;AACF;AAIA,MAAM,cAAcC,aAAO,OAAA,OAAOC,2BAAAA,SAAS;AAUpC,MAAM,QAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EAEA,gBAAgB;AAAA,EAChB;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,MAAM;AACE,QAAA,mBAAmBC,kDAAsB,SAAS;AAExDC,gCAAA,kBAAkB,EAAE,KAAK,SAAS,eAAe,UAAU,eAAe;AAEtE,MAAA,CAAC,iBAAkB,QAASC,2BAAA,kBAAA,IAAAC,WAAA,kBAAA,UAAA,CAAA,CAAA;AAE1B,QAAA,WAAW,OAAO,UAAU;AAE3B,SAAAC,SAAA;AAAA,IACLF,2BAAA,kBAAA;AAAA,MAACJ,aAAAA,OAAO;AAAA,MAAP;AAAA,QACC,WAAWO,SAAA;AAAA,UACT;AAAA,UACA,SAAS,YAAY;AAAA,QACvB;AAAA,QACA,SAAS,EAAE,SAAS,SAAS,IAAI,EAAE;AAAA,QACnC,SAAS,EAAE,SAAS,SAAS,IAAI,EAAE;AAAA,QACnC,YAAY,EAAE,UAAU,IAAI;AAAA,QAC5B,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AACV;QACV;AAAA,QACA,eAAa,CAAC;AAAA,QAEd,UAAAC,2BAAA,kBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,YAClC,SAAS,EAAE,OAAO,SAAS,MAAM,EAAE;AAAA,YACnC,SAAS,EAAE,OAAO,SAAS,IAAI,IAAI;AAAA,YACnC,YAAY,EAAE,UAAU,IAAI;AAAA,YAC5B,WAAWD,SAAA;AAAA,cACT,cAAc;AAAA,gBACZ,SAAS;AAAA,cAAA,CACV;AAAA,YACH;AAAA,YACA,MAAK;AAAA,YACL,cAAU;AAAA,YACV,aAAY;AAAA,YACX,GAAG;AAAA,YAEJ,UAAA;AAAA,cAAAC,2BAAA,kBAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAWD,SAAA;AAAA,oBACT,kBAAkB,WACd,qCACA,iBACE,kCACA,WACE,iBACA;AAAA,kBACV;AAAA,kBAEC,UAAA;AAAA,oBAAA,YACEH,2BAAA,kBAAA,IAAAK,6BAAA,EAAG,WAAU,sDACX,UACH,OAAA;AAAA,oBAED,kBACCL,2BAAA,kBAAA;AAAA,sBAACM,YAAA;AAAA,sBAAA;AAAA,wBACC,MAAK;AAAA,wBACL,cAAW;AAAA,wBACX,WAAU;AAAA,wBACV,SAAS,CAAC,MAAM;AACd,4BAAE,gBAAgB;AACV;wBACV;AAAA,sBAAA;AAAA,oBACF;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAEJ;AAAA,cACCN,2BAAAA,kBAAAA,IAAA,OAAA,EAAI,WAAU,6DACZ,SACH,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IACF;AAAA,IACA;AAAA,EAAA;AAEJ;;"}

package/dist/components/Modal/Modal.d.ts

@@ -1,6 +1,6 @@
 import { FC } from 'react';
-
-interface ModalProps {
+import { ContainerProps } from '../Container';
+type ModalProps = {
     children: React.ReactNode;
     isOpen: boolean;
     onClose: () => void;
@@ -9,7 +9,7 @@ interface ModalProps {
     hasCloseButton?: boolean;
     title?: string;
     size?: Size;
-}
+} & Pick<ContainerProps, 'transparency'>;
 type Size = 'sm' | 'md' | 'lg' | 'xl' | 'unset';
 /**
  * Usage example:

package/dist/components/Modal/Modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAOhC,UAAU,UAAU;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,WAAW,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,IAAI,CAAC;CACb;AAiBD,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,OAAO,CAAC;AAIhD;;;;;;;GAOG;AACH,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,UAAU,CAmFhC,CAAC"}
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAIhC,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,cAAc,CAAC;AAG9D,KAAK,UAAU,GAAG;IAChB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,WAAW,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,IAAI,CAAC;CACb,GAAG,IAAI,CAAC,cAAc,EAAE,cAAc,CAAC,CAAC;AAoBzC,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,OAAO,CAAC;AAIhD;;;;;;;GAOG;AACH,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,UAAU,CAqFhC,CAAC"}

package/dist/components/Modal/Modal.mjs

@@ -19,20 +19,23 @@ import "deepmerge";
 import { cn } from "../../utils/cn.mjs";
 import { Container } from "../Container/index.mjs";
 import { H3 } from "../Headers/index.mjs";
-const modalVariants = cva("cursor-default overflow-auto p-3 shadow", {
-  variants: {
-    variant: {
-      sm: "w-full max-h-[30vh] max-w-[30vw]",
-      md: "w-full max-h-[50vh] max-w-[50vw]",
-      lg: "w-full max-h-[70vh] max-w-[70vw]",
-      xl: "w-full max-h-[95vh] max-w-[95vw]",
-      unset: "max-h-[95vh] max-w-[95vw]"
+const modalVariants = cva(
+  "cursor-default overflow-auto p-3 shadow justify-center",
+  {
+    variants: {
+      variant: {
+        sm: "w-full max-h-[30vh] max-w-[30vw]",
+        md: "w-full max-h-[50vh] max-w-[50vw]",
+        lg: "w-full max-h-[70vh] max-w-[70vw]",
+        xl: "w-full max-h-[95vh] max-w-[95vw]",
+        unset: "max-h-[95vh] max-w-[95vw]"
+      }
+    },
+    defaultVariants: {
+      variant: "unset"
     }
-  },
-  defaultVariants: {
-    variant: "unset"
   }
-});
+);
 const MotionModal = motion.create(Container);
 const Modal = ({
   children,
@@ -42,7 +45,8 @@ const Modal = ({
   onClose,
   hasCloseButton = false,
   title,
-  size = "unset"
+  size = "unset",
+  ...props
 }) => {
   const containerElement = useGetElementOrWindow(container);
   useScrollBlockage({ key: "modal", disableScroll: isOpen && disableScroll });
@@ -79,7 +83,7 @@ const Modal = ({
             role: "dialog",
             "aria-modal": true,
             roundedSize: "2xl",
-            transparency: "sm",
+            ...props,
             children: [
               /* @__PURE__ */ jsxRuntimeExports.jsxs(
                 "div",
@@ -104,7 +108,7 @@ const Modal = ({
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mx-2 my-4 flex flex-1 flex-col items-center justify-center overflow-auto", children })
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mx-2 my-4 flex flex-1 flex-col items-center overflow-auto", children })
             ]
           }
         )

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.mjs","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["/* eslint-disable sonarjs/no-nested-conditional */\n'use client';\n\nimport { cva } from 'class-variance-authority';\nimport { motion } from 'framer-motion';\nimport { X } from 'lucide-react';\nimport type { FC } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useGetElementOrWindow, useScrollBlockage } from '../../hooks/index';\nimport { cn } from '../../utils/cn';\nimport { Container } from '../Container';\nimport { H3 } from '../Headers';\n\ninterface ModalProps {\n  children: React.ReactNode;\n  isOpen: boolean;\n  onClose: () => void;\n  container?: HTMLElement;\n  disableScroll?: boolean;\n  hasCloseButton?: boolean;\n  title?: string;\n  size?: Size;\n}\n\nconst modalVariants = cva('cursor-default overflow-auto p-3 shadow', {\n  variants: {\n    variant: {\n      sm: 'w-full max-h-[30vh] max-w-[30vw]',\n      md: 'w-full max-h-[50vh] max-w-[50vw]',\n      lg: 'w-full max-h-[70vh] max-w-[70vw]',\n      xl: 'w-full max-h-[95vh] max-w-[95vw]',\n      unset: 'max-h-[95vh] max-w-[95vw]',\n    },\n  },\n  defaultVariants: {\n    variant: 'unset',\n  },\n});\n\ntype Size = 'sm' | 'md' | 'lg' | 'xl' | 'unset';\n\nconst MotionModal = motion.create(Container);\n\n/**\n * Usage example:\n * ```jsx\n * <Modal isOpen={isOpen} onClose={onClose}>\n *   Modal content\n * </Modal>\n * ```\n */\nexport const Modal: FC<ModalProps> = ({\n  children,\n  isOpen,\n  container,\n  disableScroll = false,\n  onClose,\n  hasCloseButton = false,\n  title,\n  size = 'unset',\n}) => {\n  const containerElement = useGetElementOrWindow(container);\n\n  useScrollBlockage({ key: 'modal', disableScroll: isOpen && disableScroll });\n\n  if (!containerElement) return <></>;\n\n  const hasTitle = typeof title === 'string';\n\n  return createPortal(\n    <motion.div\n      className={cn(\n        'bg-background/40 dark:bg-background-dark/40 fixed left-0 top-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-auto backdrop-blur',\n        isOpen ? 'visible' : 'hidden'\n      )}\n      initial={{ opacity: isOpen ? 0 : 1 }}\n      animate={{ opacity: isOpen ? 1 : 0 }}\n      transition={{ duration: 0.1 }}\n      onClick={(e) => {\n        e.stopPropagation();\n        onClose();\n      }}\n      aria-hidden={!isOpen}\n    >\n      <MotionModal\n        onClick={(e) => e.stopPropagation()}\n        initial={{ scale: isOpen ? 0.5 : 1 }}\n        animate={{ scale: isOpen ? 1 : 0.5 }}\n        transition={{ duration: 0.3 }}\n        className={cn(\n          modalVariants({\n            variant: size,\n          })\n        )}\n        role=\"dialog\"\n        aria-modal\n        roundedSize=\"2xl\"\n        transparency=\"sm\"\n      >\n        <div\n          className={cn(\n            hasCloseButton && hasTitle\n              ? `flex items-center justify-center`\n              : hasCloseButton\n                ? `flex items-center justify-end`\n                : hasTitle\n                  ? `items-center`\n                  : `hidden`\n          )}\n        >\n          {hasTitle && (\n            <H3 className=\"flex items-center justify-center text-lg font-bold\">\n              {title}\n            </H3>\n          )}\n          {hasCloseButton && (\n            <X\n              role=\"button\"\n              aria-label=\"Close modal\"\n              className=\"right-2 top-2 ml-auto cursor-pointer\"\n              onClick={(e) => {\n                e.stopPropagation();\n                onClose();\n              }}\n            />\n          )}\n        </div>\n        <div className=\"mx-2 my-4 flex flex-1 flex-col items-center justify-center overflow-auto\">\n          {children}\n        </div>\n      </MotionModal>\n    </motion.div>,\n    containerElement\n  );\n};\n"],"names":["jsx","Fragment","jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAwBA,MAAM,gBAAgB,IAAI,2CAA2C;AAAA,EACnE,UAAU;AAAA,IACR,SAAS;AAAA,MACP,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,OAAO;AAAA,IACT;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,EACX;AACF,CAAC;AAID,MAAM,cAAc,OAAO,OAAO,SAAS;AAUpC,MAAM,QAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA,OAAO;AACT,MAAM;AACE,QAAA,mBAAmB,sBAAsB,SAAS;AAExD,oBAAkB,EAAE,KAAK,SAAS,eAAe,UAAU,eAAe;AAEtE,MAAA,CAAC,iBAAkB,QAASA,kCAAA,IAAAC,kBAAA,UAAA,CAAA,CAAA;AAE1B,QAAA,WAAW,OAAO,UAAU;AAE3B,SAAA;AAAA,IACLD,kCAAA;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,SAAS,YAAY;AAAA,QACvB;AAAA,QACA,SAAS,EAAE,SAAS,SAAS,IAAI,EAAE;AAAA,QACnC,SAAS,EAAE,SAAS,SAAS,IAAI,EAAE;AAAA,QACnC,YAAY,EAAE,UAAU,IAAI;AAAA,QAC5B,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AACV;QACV;AAAA,QACA,eAAa,CAAC;AAAA,QAEd,UAAAE,kCAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,YAClC,SAAS,EAAE,OAAO,SAAS,MAAM,EAAE;AAAA,YACnC,SAAS,EAAE,OAAO,SAAS,IAAI,IAAI;AAAA,YACnC,YAAY,EAAE,UAAU,IAAI;AAAA,YAC5B,WAAW;AAAA,cACT,cAAc;AAAA,gBACZ,SAAS;AAAA,cAAA,CACV;AAAA,YACH;AAAA,YACA,MAAK;AAAA,YACL,cAAU;AAAA,YACV,aAAY;AAAA,YACZ,cAAa;AAAA,YAEb,UAAA;AAAA,cAAAA,kCAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAW;AAAA,oBACT,kBAAkB,WACd,qCACA,iBACE,kCACA,WACE,iBACA;AAAA,kBACV;AAAA,kBAEC,UAAA;AAAA,oBAAA,YACEF,kCAAA,IAAA,IAAA,EAAG,WAAU,sDACX,UACH,OAAA;AAAA,oBAED,kBACCA,kCAAA;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,MAAK;AAAA,wBACL,cAAW;AAAA,wBACX,WAAU;AAAA,wBACV,SAAS,CAAC,MAAM;AACd,4BAAE,gBAAgB;AACV;wBACV;AAAA,sBAAA;AAAA,oBACF;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAEJ;AAAA,cACCA,kCAAAA,IAAA,OAAA,EAAI,WAAU,4EACZ,SACH,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IACF;AAAA,IACA;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"Modal.mjs","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["'use client';\n\nimport { cva } from 'class-variance-authority';\nimport { motion } from 'framer-motion';\nimport { X } from 'lucide-react';\nimport type { FC } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useGetElementOrWindow, useScrollBlockage } from '../../hooks/index';\nimport { cn } from '../../utils/cn';\nimport { Container, type ContainerProps } from '../Container';\nimport { H3 } from '../Headers';\n\ntype ModalProps = {\n  children: React.ReactNode;\n  isOpen: boolean;\n  onClose: () => void;\n  container?: HTMLElement;\n  disableScroll?: boolean;\n  hasCloseButton?: boolean;\n  title?: string;\n  size?: Size;\n} & Pick<ContainerProps, 'transparency'>;\n\nconst modalVariants = cva(\n  'cursor-default overflow-auto p-3 shadow justify-center',\n  {\n    variants: {\n      variant: {\n        sm: 'w-full max-h-[30vh] max-w-[30vw]',\n        md: 'w-full max-h-[50vh] max-w-[50vw]',\n        lg: 'w-full max-h-[70vh] max-w-[70vw]',\n        xl: 'w-full max-h-[95vh] max-w-[95vw]',\n        unset: 'max-h-[95vh] max-w-[95vw]',\n      },\n    },\n    defaultVariants: {\n      variant: 'unset',\n    },\n  }\n);\n\ntype Size = 'sm' | 'md' | 'lg' | 'xl' | 'unset';\n\nconst MotionModal = motion.create(Container);\n\n/**\n * Usage example:\n * ```jsx\n * <Modal isOpen={isOpen} onClose={onClose}>\n *   Modal content\n * </Modal>\n * ```\n */\nexport const Modal: FC<ModalProps> = ({\n  children,\n  isOpen,\n  container,\n\n  disableScroll = false,\n  onClose,\n  hasCloseButton = false,\n  title,\n  size = 'unset',\n  ...props\n}) => {\n  const containerElement = useGetElementOrWindow(container);\n\n  useScrollBlockage({ key: 'modal', disableScroll: isOpen && disableScroll });\n\n  if (!containerElement) return <></>;\n\n  const hasTitle = typeof title === 'string';\n\n  return createPortal(\n    <motion.div\n      className={cn(\n        'bg-background/40 dark:bg-background-dark/40 fixed left-0 top-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-auto backdrop-blur',\n        isOpen ? 'visible' : 'hidden'\n      )}\n      initial={{ opacity: isOpen ? 0 : 1 }}\n      animate={{ opacity: isOpen ? 1 : 0 }}\n      transition={{ duration: 0.1 }}\n      onClick={(e) => {\n        e.stopPropagation();\n        onClose();\n      }}\n      aria-hidden={!isOpen}\n    >\n      <MotionModal\n        onClick={(e) => e.stopPropagation()}\n        initial={{ scale: isOpen ? 0.5 : 1 }}\n        animate={{ scale: isOpen ? 1 : 0.5 }}\n        transition={{ duration: 0.3 }}\n        className={cn(\n          modalVariants({\n            variant: size,\n          })\n        )}\n        role=\"dialog\"\n        aria-modal\n        roundedSize=\"2xl\"\n        {...props}\n      >\n        <div\n          className={cn(\n            hasCloseButton && hasTitle\n              ? `flex items-center justify-center`\n              : hasCloseButton\n                ? `flex items-center justify-end`\n                : hasTitle\n                  ? `items-center`\n                  : `hidden`\n          )}\n        >\n          {hasTitle && (\n            <H3 className=\"flex items-center justify-center text-lg font-bold\">\n              {title}\n            </H3>\n          )}\n          {hasCloseButton && (\n            <X\n              role=\"button\"\n              aria-label=\"Close modal\"\n              className=\"right-2 top-2 ml-auto cursor-pointer\"\n              onClick={(e) => {\n                e.stopPropagation();\n                onClose();\n              }}\n            />\n          )}\n        </div>\n        <div className=\"mx-2 my-4 flex flex-1 flex-col items-center overflow-auto\">\n          {children}\n        </div>\n      </MotionModal>\n    </motion.div>,\n    containerElement\n  );\n};\n"],"names":["jsx","Fragment","jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAuBA,MAAM,gBAAgB;AAAA,EACpB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,OAAO;AAAA,MACT;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,IACX;AAAA,EACF;AACF;AAIA,MAAM,cAAc,OAAO,OAAO,SAAS;AAUpC,MAAM,QAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EAEA,gBAAgB;AAAA,EAChB;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,MAAM;AACE,QAAA,mBAAmB,sBAAsB,SAAS;AAExD,oBAAkB,EAAE,KAAK,SAAS,eAAe,UAAU,eAAe;AAEtE,MAAA,CAAC,iBAAkB,QAASA,kCAAA,IAAAC,kBAAA,UAAA,CAAA,CAAA;AAE1B,QAAA,WAAW,OAAO,UAAU;AAE3B,SAAA;AAAA,IACLD,kCAAA;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,SAAS,YAAY;AAAA,QACvB;AAAA,QACA,SAAS,EAAE,SAAS,SAAS,IAAI,EAAE;AAAA,QACnC,SAAS,EAAE,SAAS,SAAS,IAAI,EAAE;AAAA,QACnC,YAAY,EAAE,UAAU,IAAI;AAAA,QAC5B,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AACV;QACV;AAAA,QACA,eAAa,CAAC;AAAA,QAEd,UAAAE,kCAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,YAClC,SAAS,EAAE,OAAO,SAAS,MAAM,EAAE;AAAA,YACnC,SAAS,EAAE,OAAO,SAAS,IAAI,IAAI;AAAA,YACnC,YAAY,EAAE,UAAU,IAAI;AAAA,YAC5B,WAAW;AAAA,cACT,cAAc;AAAA,gBACZ,SAAS;AAAA,cAAA,CACV;AAAA,YACH;AAAA,YACA,MAAK;AAAA,YACL,cAAU;AAAA,YACV,aAAY;AAAA,YACX,GAAG;AAAA,YAEJ,UAAA;AAAA,cAAAA,kCAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAW;AAAA,oBACT,kBAAkB,WACd,qCACA,iBACE,kCACA,WACE,iBACA;AAAA,kBACV;AAAA,kBAEC,UAAA;AAAA,oBAAA,YACEF,kCAAA,IAAA,IAAA,EAAG,WAAU,sDACX,UACH,OAAA;AAAA,oBAED,kBACCA,kCAAA;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,MAAK;AAAA,wBACL,cAAW;AAAA,wBACX,WAAU;AAAA,wBACV,SAAS,CAAC,MAAM;AACd,4BAAE,gBAAgB;AACV;wBACV;AAAA,sBAAA;AAAA,oBACF;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAEJ;AAAA,cACCA,kCAAAA,IAAA,OAAA,EAAI,WAAU,6DACZ,SACH,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IACF;AAAA,IACA;AAAA,EAAA;AAEJ;"}

package/dist/components/Navbar/Burger.d.ts

@@ -1,5 +1,4 @@
 import { HTMLAttributes } from 'react';
-
 interface BurgerProps extends HTMLAttributes<HTMLDivElement> {
     isActive?: boolean;
 }