npm - @intlayer/design-system - Versions diffs - 3.3.6 → 3.4.7 - Mend

@intlayer/design-system 3.3.6 → 3.4.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (56) hide show

package/dist/components/Input/Checkbox.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.cjs","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":["cva","forwardRef","useId","jsxs","Fragment","jsx"],"mappings":";;;;;AAQa,MAAA,mBAAmBA,2BAAI,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,WAAWC,WAAA;AAAA,EACtB,CACE;AAAA,IACE,yBAAyB;AAAA,IACzB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,KAEL,QACG;AACH,UAAM,KAAKC,WAAAA;AACX,WAEIC,2BAAA,kBAAA,KAAAC,uCAAA,EAAA,UAAA;AAAA,MAAAC,2BAAA,kBAAA;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,2BAAA,kBAAA,IAAA,SAAA,EAAM,SAAS,IAAK,UAAM,OAAA;AAAA,IAC7B,EAAA,CAAA;AAAA,EAEJ;AACF;AAEA,SAAS,cAAc;;;"}
1	+ {"version":3,"file":"Checkbox.cjs","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 = Omit<\n DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>,\n 'size'\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":["cva","forwardRef","useId","jsxs","Fragment","jsx"],"mappings":";;;;;AAQa,MAAA,mBAAmBA,2BAAI,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,WAAWC,WAAA;AAAA,EACtB,CACE;AAAA,IACE,yBAAyB;AAAA,IACzB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,KAEL,QACG;AACH,UAAM,KAAKC,WAAAA;AACX,WAEIC,2BAAA,kBAAA,KAAAC,uCAAA,EAAA,UAAA;AAAA,MAAAC,2BAAA,kBAAA;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,2BAAA,kBAAA,IAAA,SAAA,EAAM,SAAS,IAAK,UAAM,OAAA;AAAA,IAC7B,EAAA,CAAA;AAAA,EAEJ;AACF;AAEA,SAAS,cAAc;;;"}

package/dist/components/Input/Checkbox.d.ts CHANGED Viewed

@@ -6,7 +6,7 @@ export declare const checkboxVariants: (props?: ({
     color?: "text" | "error" | "primary" | "secondary" | "neutral" | "destructive" | "light" | "dark" | "success" | "custom" | null | undefined;
     validationStyleEnabled?: "disabled" | "enabled" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export type CheckboxProps = DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> & {
+export type CheckboxProps = Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, 'size'> & {
     validationStyleEnabled?: boolean;
     label?: string;
 } & Omit<VariantProps<typeof checkboxVariants>, 'validationStyleEnabled'>;

package/dist/components/Input/Checkbox.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Input/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAGL,KAAK,iBAAiB,EACtB,KAAK,mBAAmB,EACzB,MAAM,OAAO,CAAC;AAEf,eAAO,MAAM,gBAAgB;;;;;8EAsC3B,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,iBAAiB,~~CAC3C~~,mBAAmB,CAAC,gBAAgB,CAAC,~~EACrC~~,gBAAgB,~~CACjB~~,GAAG;IACF,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,IAAI,CAAC,YAAY,CAAC,OAAO,gBAAgB,CAAC,EAAE,wBAAwB,CAAC,CAAC;AAE1E,eAAO,MAAM,QAAQ,yHAmCpB,CAAC"}
1	+ {"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Input/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAGL,KAAK,iBAAiB,EACtB,KAAK,mBAAmB,EACzB,MAAM,OAAO,CAAC;AAEf,eAAO,MAAM,gBAAgB;;;;;8EAsC3B,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,IAAI,CAC9B,iBAAiB,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,EAC1E,MAAM,CACP,GAAG;IACF,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,IAAI,CAAC,YAAY,CAAC,OAAO,gBAAgB,CAAC,EAAE,wBAAwB,CAAC,CAAC;AAE1E,eAAO,MAAM,QAAQ,yHAmCpB,CAAC"}

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

	@@ -1 +1 @@
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;"}
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 = Omit<\n DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>,\n 'size'\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/Link/Link.cjs CHANGED Viewed

@@ -12,7 +12,8 @@ const linkVariants = classVarianceAuthority.cva(
         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",
-        button: "rounded-lg text-text-opposite dark:text-text-opposite-dark max-md:py-2 px-2 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",
+        button: "rounded-lg text-text-opposite dark:text-text-opposite-dark min-h-8 px-6 max-md:py-2 text-sm flex items-center justify-center gap-2 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50",
+        "button-outlined": "rounded-lg border-[1.5px] bg-opacity-0 hover:bg-opacity-30 dark:bg-opacity-0 min-h-8 px-6 max-md:py-2 text-sm flex items-center justify-center gap-2 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50",
         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: {

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

	@@ -1 +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 button:\n 'rounded-lg text-text-opposite dark:text-text-opposite-dark max-md:py-2 px-2 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;;"}
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 button:\n 'rounded-lg text-text-opposite dark:text-text-opposite-dark min-h-8 px-6 max-md:py-2 text-sm flex items-center justify-center gap-2 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n 'button-outlined':\n 'rounded-lg border-[1.5px] bg-opacity-0 hover:bg-opacity-30 dark:bg-opacity-0 min-h-8 px-6 max-md:py-2 text-sm flex items-center justify-center gap-2 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\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,mBACE;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 CHANGED Viewed

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

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

	@@ -1 +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;;;~~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"}
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;;;8EAuCjB,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 CHANGED Viewed

@@ -10,7 +10,8 @@ const linkVariants = cva(
         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",
-        button: "rounded-lg text-text-opposite dark:text-text-opposite-dark max-md:py-2 px-2 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",
+        button: "rounded-lg text-text-opposite dark:text-text-opposite-dark min-h-8 px-6 max-md:py-2 text-sm flex items-center justify-center gap-2 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50",
+        "button-outlined": "rounded-lg border-[1.5px] bg-opacity-0 hover:bg-opacity-30 dark:bg-opacity-0 min-h-8 px-6 max-md:py-2 text-sm flex items-center justify-center gap-2 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50",
         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: {

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

	@@ -1 +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 button:\n 'rounded-lg text-text-opposite dark:text-text-opposite-dark max-md:py-2 px-2 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;"}
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 button:\n 'rounded-lg text-text-opposite dark:text-text-opposite-dark min-h-8 px-6 max-md:py-2 text-sm flex items-center justify-center gap-2 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n 'button-outlined':\n 'rounded-lg border-[1.5px] bg-opacity-0 hover:bg-opacity-30 dark:bg-opacity-0 min-h-8 px-6 max-md:py-2 text-sm flex items-center justify-center gap-2 whitespace-nowrap font-medium transition focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\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,mBACE;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/LocaleSwitcherDropDown/LocaleSwitcher.cjs CHANGED Viewed

@@ -41,7 +41,7 @@ const LocaleSwitcher = ({
             identifier: DROPDOWN_IDENTIFIER,
             "aria-label": "Language selector",
             children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "flex w-full items-center justify-between", children: [
-              /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "px-2 py-1", children: localeName }),
+              /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "px-2", children: localeName }),
               /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(lucideReact.MoveVertical, { className: "w-5 self-center" })
             ] })
           }

package/dist/components/LocaleSwitcherDropDown/LocaleSwitcher.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LocaleSwitcher.cjs","sources":["../../../src/components/LocaleSwitcherDropDown/LocaleSwitcher.tsx"],"sourcesContent":["import type { Locales } from '@intlayer/config/client';\nimport { getLocaleName } from '@intlayer/core';\nimport { MoveVertical } from 'lucide-react';\nimport type { ButtonHTMLAttributes, FC } from 'react';\nimport { Container } from '../Container';\nimport { DropDown } from '../DropDown';\n\nconst ButtonItem: FC<ButtonHTMLAttributes<HTMLButtonElement>> = ({\n children,\n ...props\n}) => (\n <div className=\"relative w-full p-0.5\">\n <button\n className=\"hover:bg-text/10 focus:bg-text-opposite/20 aria-selected:bg-text/20 dark:hover:bg-text-opposite/10 dark:focus:bg-text-opposite/20 dark:aria-selected:bg-text-opposite/20 w-full cursor-pointer rounded-lg px-3 py-1 text-left focus:outline-none disabled:text-white/25 aria-selected:hover:cursor-default\"\n data-mode=\"system\"\n {...props}\n >\n {children}\n </button>\n </div>\n);\n\nexport type LocaleSwitcherProps = {\n locale?: Locales;\n localeList: Locales[];\n availableLocales?: Locales[];\n fullLocaleName?: boolean;\n setLocale: (locale: Locales) => void;\n};\n\nconst DROPDOWN_IDENTIFIER = 'locale-switcher';\n\nexport const LocaleSwitcher: FC<LocaleSwitcherProps> = ({\n locale,\n localeList,\n availableLocales,\n fullLocaleName = true,\n setLocale,\n}) => {\n let localeName = 'Select a locale';\n\n if (locale) {\n localeName = fullLocaleName ? getLocaleName(locale) : locale.toUpperCase();\n }\n\n return (\n <div\n className=\"border-text text-text dark:border-text-dark dark:text-text-dark rounded-xl border transition-colors\"\n aria-label=\"Language switcher\"\n >\n <DropDown identifier={DROPDOWN_IDENTIFIER}>\n <DropDown.Trigger\n identifier={DROPDOWN_IDENTIFIER}\n aria-label=\"Language selector\"\n >\n <div className=\"flex w-full items-center justify-between\">\n <div className=\"px-2 ~~py-1~~\">{localeName}</div>\n <MoveVertical className=\"w-5 self-center\" />\n </div>\n </DropDown.Trigger>\n\n <DropDown.Panel identifier={DROPDOWN_IDENTIFIER} isOverable isFocusable>\n <Container\n className=\"min-w-28 p-1\"\n separator=\"y\"\n role=\"listbox\"\n aria-label=\"Language list\"\n >\n {localeList.map((lang) => (\n <ButtonItem\n key={lang}\n onClick={() => setLocale(lang)}\n aria-label={`Switch to ${lang}`}\n disabled={!(availableLocales ?? localeList).includes(lang)}\n role=\"option\"\n aria-selected={locale === lang}\n lang={lang}\n >\n {getLocaleName(lang)}\n </ButtonItem>\n ))}\n </Container>\n </DropDown.Panel>\n </DropDown>\n </div>\n );\n};\n"],"names":["jsx","getLocaleName","jsxs","DropDown","MoveVertical","Container"],"mappings":";;;;;;;AAOA,MAAM,aAA0D,CAAC;AAAA,EAC/D;AAAA,EACA,GAAG;AACL,MACEA,2BAAAA,kBAAAA,IAAC,OAAI,EAAA,WAAU,yBACb,UAAAA,2BAAA,kBAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,aAAU;AAAA,IACT,GAAG;AAAA,IAEH;AAAA,EAAA;AACH,EACF,CAAA;AAWF,MAAM,sBAAsB;AAErB,MAAM,iBAA0C,CAAC;AAAA,EACtD;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AACF,MAAM;AACJ,MAAI,aAAa;AAEjB,MAAI,QAAQ;AACV,iBAAa,iBAAiBC,KAAA,cAAc,MAAM,IAAI,OAAO;EAC/D;AAGE,SAAAD,2BAAA,kBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,cAAW;AAAA,MAEX,UAAAE,2BAAA,kBAAA,KAACC,0BAAS,UAAA,EAAA,YAAY,qBACpB,UAAA;AAAA,QAAAH,2BAAA,kBAAA;AAAA,UAACG,0BAAAA,SAAS;AAAA,UAAT;AAAA,YACC,YAAY;AAAA,YACZ,cAAW;AAAA,YAEX,UAAAD,2BAAA,kBAAA,KAAC,OAAI,EAAA,WAAU,4CACb,UAAA;AAAA,cAACF,2BAAA,kBAAA,IAAA,OAAA,EAAI,WAAU,~~aAAa~~,UAAW,YAAA;AAAA,~~cACvCA~~,2BAAAA,kBAAAA,IAACI,YAAa,cAAA,EAAA,WAAU,kBAAkB,CAAA;AAAA,YAAA,GAC5C;AAAA,UAAA;AAAA,QACF;AAAA,QAEAJ,2BAAAA,kBAAAA,IAACG,mCAAS,OAAT,EAAe,YAAY,qBAAqB,YAAU,MAAC,aAAW,MACrE,UAAAH,2BAAA,kBAAA;AAAA,UAACK,2BAAA;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,WAAU;AAAA,YACV,MAAK;AAAA,YACL,cAAW;AAAA,YAEV,UAAA,WAAW,IAAI,CAAC,SACfL,2BAAA,kBAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBAEC,SAAS,MAAM,UAAU,IAAI;AAAA,gBAC7B,cAAY,aAAa,IAAI;AAAA,gBAC7B,UAAU,EAAE,oBAAoB,YAAY,SAAS,IAAI;AAAA,gBACzD,MAAK;AAAA,gBACL,iBAAe,WAAW;AAAA,gBAC1B;AAAA,gBAEC,6BAAc,IAAI;AAAA,cAAA;AAAA,cARd;AAAA,YAAA,CAUR;AAAA,UAAA;AAAA,QAAA,GAEL;AAAA,MAAA,GACF;AAAA,IAAA;AAAA,EAAA;AAGN;;"}
1	+ {"version":3,"file":"LocaleSwitcher.cjs","sources":["../../../src/components/LocaleSwitcherDropDown/LocaleSwitcher.tsx"],"sourcesContent":["import type { Locales } from '@intlayer/config/client';\nimport { getLocaleName } from '@intlayer/core';\nimport { MoveVertical } from 'lucide-react';\nimport type { ButtonHTMLAttributes, FC } from 'react';\nimport { Container } from '../Container';\nimport { DropDown } from '../DropDown';\n\nconst ButtonItem: FC<ButtonHTMLAttributes<HTMLButtonElement>> = ({\n children,\n ...props\n}) => (\n <div className=\"relative w-full p-0.5\">\n <button\n className=\"hover:bg-text/10 focus:bg-text-opposite/20 aria-selected:bg-text/20 dark:hover:bg-text-opposite/10 dark:focus:bg-text-opposite/20 dark:aria-selected:bg-text-opposite/20 w-full cursor-pointer rounded-lg px-3 py-1 text-left focus:outline-none disabled:text-white/25 aria-selected:hover:cursor-default\"\n data-mode=\"system\"\n {...props}\n >\n {children}\n </button>\n </div>\n);\n\nexport type LocaleSwitcherProps = {\n locale?: Locales;\n localeList: Locales[];\n availableLocales?: Locales[];\n fullLocaleName?: boolean;\n setLocale: (locale: Locales) => void;\n};\n\nconst DROPDOWN_IDENTIFIER = 'locale-switcher';\n\nexport const LocaleSwitcher: FC<LocaleSwitcherProps> = ({\n locale,\n localeList,\n availableLocales,\n fullLocaleName = true,\n setLocale,\n}) => {\n let localeName = 'Select a locale';\n\n if (locale) {\n localeName = fullLocaleName ? getLocaleName(locale) : locale.toUpperCase();\n }\n\n return (\n <div\n className=\"border-text text-text dark:border-text-dark dark:text-text-dark rounded-xl border transition-colors\"\n aria-label=\"Language switcher\"\n >\n <DropDown identifier={DROPDOWN_IDENTIFIER}>\n <DropDown.Trigger\n identifier={DROPDOWN_IDENTIFIER}\n aria-label=\"Language selector\"\n >\n <div className=\"flex w-full items-center justify-between\">\n <div className=\"px-2\">{localeName}</div>\n <MoveVertical className=\"w-5 self-center\" />\n </div>\n </DropDown.Trigger>\n\n <DropDown.Panel identifier={DROPDOWN_IDENTIFIER} isOverable isFocusable>\n <Container\n className=\"min-w-28 p-1\"\n separator=\"y\"\n role=\"listbox\"\n aria-label=\"Language list\"\n >\n {localeList.map((lang) => (\n <ButtonItem\n key={lang}\n onClick={() => setLocale(lang)}\n aria-label={`Switch to ${lang}`}\n disabled={!(availableLocales ?? localeList).includes(lang)}\n role=\"option\"\n aria-selected={locale === lang}\n lang={lang}\n >\n {getLocaleName(lang)}\n </ButtonItem>\n ))}\n </Container>\n </DropDown.Panel>\n </DropDown>\n </div>\n );\n};\n"],"names":["jsx","getLocaleName","jsxs","DropDown","MoveVertical","Container"],"mappings":";;;;;;;AAOA,MAAM,aAA0D,CAAC;AAAA,EAC/D;AAAA,EACA,GAAG;AACL,MACEA,2BAAAA,kBAAAA,IAAC,OAAI,EAAA,WAAU,yBACb,UAAAA,2BAAA,kBAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,aAAU;AAAA,IACT,GAAG;AAAA,IAEH;AAAA,EAAA;AACH,EACF,CAAA;AAWF,MAAM,sBAAsB;AAErB,MAAM,iBAA0C,CAAC;AAAA,EACtD;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AACF,MAAM;AACJ,MAAI,aAAa;AAEjB,MAAI,QAAQ;AACV,iBAAa,iBAAiBC,KAAA,cAAc,MAAM,IAAI,OAAO;EAC/D;AAGE,SAAAD,2BAAA,kBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,cAAW;AAAA,MAEX,UAAAE,2BAAA,kBAAA,KAACC,0BAAS,UAAA,EAAA,YAAY,qBACpB,UAAA;AAAA,QAAAH,2BAAA,kBAAA;AAAA,UAACG,0BAAAA,SAAS;AAAA,UAAT;AAAA,YACC,YAAY;AAAA,YACZ,cAAW;AAAA,YAEX,UAAAD,2BAAA,kBAAA,KAAC,OAAI,EAAA,WAAU,4CACb,UAAA;AAAA,cAACF,2BAAA,kBAAA,IAAA,OAAA,EAAI,WAAU,QAAQ,UAAW,YAAA;AAAA,cAClCA,2BAAAA,kBAAAA,IAACI,YAAa,cAAA,EAAA,WAAU,kBAAkB,CAAA;AAAA,YAAA,GAC5C;AAAA,UAAA;AAAA,QACF;AAAA,QAEAJ,2BAAAA,kBAAAA,IAACG,mCAAS,OAAT,EAAe,YAAY,qBAAqB,YAAU,MAAC,aAAW,MACrE,UAAAH,2BAAA,kBAAA;AAAA,UAACK,2BAAA;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,WAAU;AAAA,YACV,MAAK;AAAA,YACL,cAAW;AAAA,YAEV,UAAA,WAAW,IAAI,CAAC,SACfL,2BAAA,kBAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBAEC,SAAS,MAAM,UAAU,IAAI;AAAA,gBAC7B,cAAY,aAAa,IAAI;AAAA,gBAC7B,UAAU,EAAE,oBAAoB,YAAY,SAAS,IAAI;AAAA,gBACzD,MAAK;AAAA,gBACL,iBAAe,WAAW;AAAA,gBAC1B;AAAA,gBAEC,6BAAc,IAAI;AAAA,cAAA;AAAA,cARd;AAAA,YAAA,CAUR;AAAA,UAAA;AAAA,QAAA,GAEL;AAAA,MAAA,GACF;AAAA,IAAA;AAAA,EAAA;AAGN;;"}

package/dist/components/LocaleSwitcherDropDown/LocaleSwitcher.mjs CHANGED Viewed

@@ -39,7 +39,7 @@ const LocaleSwitcher = ({
             identifier: DROPDOWN_IDENTIFIER,
             "aria-label": "Language selector",
             children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex w-full items-center justify-between", children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "px-2 py-1", children: localeName }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "px-2", children: localeName }),
               /* @__PURE__ */ jsxRuntimeExports.jsx(MoveVertical, { className: "w-5 self-center" })
             ] })
           }

package/dist/components/LocaleSwitcherDropDown/LocaleSwitcher.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LocaleSwitcher.mjs","sources":["../../../src/components/LocaleSwitcherDropDown/LocaleSwitcher.tsx"],"sourcesContent":["import type { Locales } from '@intlayer/config/client';\nimport { getLocaleName } from '@intlayer/core';\nimport { MoveVertical } from 'lucide-react';\nimport type { ButtonHTMLAttributes, FC } from 'react';\nimport { Container } from '../Container';\nimport { DropDown } from '../DropDown';\n\nconst ButtonItem: FC<ButtonHTMLAttributes<HTMLButtonElement>> = ({\n children,\n ...props\n}) => (\n <div className=\"relative w-full p-0.5\">\n <button\n className=\"hover:bg-text/10 focus:bg-text-opposite/20 aria-selected:bg-text/20 dark:hover:bg-text-opposite/10 dark:focus:bg-text-opposite/20 dark:aria-selected:bg-text-opposite/20 w-full cursor-pointer rounded-lg px-3 py-1 text-left focus:outline-none disabled:text-white/25 aria-selected:hover:cursor-default\"\n data-mode=\"system\"\n {...props}\n >\n {children}\n </button>\n </div>\n);\n\nexport type LocaleSwitcherProps = {\n locale?: Locales;\n localeList: Locales[];\n availableLocales?: Locales[];\n fullLocaleName?: boolean;\n setLocale: (locale: Locales) => void;\n};\n\nconst DROPDOWN_IDENTIFIER = 'locale-switcher';\n\nexport const LocaleSwitcher: FC<LocaleSwitcherProps> = ({\n locale,\n localeList,\n availableLocales,\n fullLocaleName = true,\n setLocale,\n}) => {\n let localeName = 'Select a locale';\n\n if (locale) {\n localeName = fullLocaleName ? getLocaleName(locale) : locale.toUpperCase();\n }\n\n return (\n <div\n className=\"border-text text-text dark:border-text-dark dark:text-text-dark rounded-xl border transition-colors\"\n aria-label=\"Language switcher\"\n >\n <DropDown identifier={DROPDOWN_IDENTIFIER}>\n <DropDown.Trigger\n identifier={DROPDOWN_IDENTIFIER}\n aria-label=\"Language selector\"\n >\n <div className=\"flex w-full items-center justify-between\">\n <div className=\"px-2 ~~py-1~~\">{localeName}</div>\n <MoveVertical className=\"w-5 self-center\" />\n </div>\n </DropDown.Trigger>\n\n <DropDown.Panel identifier={DROPDOWN_IDENTIFIER} isOverable isFocusable>\n <Container\n className=\"min-w-28 p-1\"\n separator=\"y\"\n role=\"listbox\"\n aria-label=\"Language list\"\n >\n {localeList.map((lang) => (\n <ButtonItem\n key={lang}\n onClick={() => setLocale(lang)}\n aria-label={`Switch to ${lang}`}\n disabled={!(availableLocales ?? localeList).includes(lang)}\n role=\"option\"\n aria-selected={locale === lang}\n lang={lang}\n >\n {getLocaleName(lang)}\n </ButtonItem>\n ))}\n </Container>\n </DropDown.Panel>\n </DropDown>\n </div>\n );\n};\n"],"names":["jsx","jsxs"],"mappings":";;;;;AAOA,MAAM,aAA0D,CAAC;AAAA,EAC/D;AAAA,EACA,GAAG;AACL,MACEA,kCAAAA,IAAC,OAAI,EAAA,WAAU,yBACb,UAAAA,kCAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,aAAU;AAAA,IACT,GAAG;AAAA,IAEH;AAAA,EAAA;AACH,EACF,CAAA;AAWF,MAAM,sBAAsB;AAErB,MAAM,iBAA0C,CAAC;AAAA,EACtD;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AACF,MAAM;AACJ,MAAI,aAAa;AAEjB,MAAI,QAAQ;AACV,iBAAa,iBAAiB,cAAc,MAAM,IAAI,OAAO;EAC/D;AAGE,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,cAAW;AAAA,MAEX,UAAAC,kCAAA,KAAC,UAAS,EAAA,YAAY,qBACpB,UAAA;AAAA,QAAAD,kCAAA;AAAA,UAAC,SAAS;AAAA,UAAT;AAAA,YACC,YAAY;AAAA,YACZ,cAAW;AAAA,YAEX,UAAAC,kCAAA,KAAC,OAAI,EAAA,WAAU,4CACb,UAAA;AAAA,cAACD,kCAAA,IAAA,OAAA,EAAI,WAAU,~~aAAa~~,UAAW,YAAA;AAAA,~~cACvCA~~,kCAAAA,IAAC,cAAa,EAAA,WAAU,kBAAkB,CAAA;AAAA,YAAA,GAC5C;AAAA,UAAA;AAAA,QACF;AAAA,QAEAA,kCAAAA,IAAC,SAAS,OAAT,EAAe,YAAY,qBAAqB,YAAU,MAAC,aAAW,MACrE,UAAAA,kCAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,WAAU;AAAA,YACV,MAAK;AAAA,YACL,cAAW;AAAA,YAEV,UAAA,WAAW,IAAI,CAAC,SACfA,kCAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBAEC,SAAS,MAAM,UAAU,IAAI;AAAA,gBAC7B,cAAY,aAAa,IAAI;AAAA,gBAC7B,UAAU,EAAE,oBAAoB,YAAY,SAAS,IAAI;AAAA,gBACzD,MAAK;AAAA,gBACL,iBAAe,WAAW;AAAA,gBAC1B;AAAA,gBAEC,wBAAc,IAAI;AAAA,cAAA;AAAA,cARd;AAAA,YAAA,CAUR;AAAA,UAAA;AAAA,QAAA,GAEL;AAAA,MAAA,GACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
1	+ {"version":3,"file":"LocaleSwitcher.mjs","sources":["../../../src/components/LocaleSwitcherDropDown/LocaleSwitcher.tsx"],"sourcesContent":["import type { Locales } from '@intlayer/config/client';\nimport { getLocaleName } from '@intlayer/core';\nimport { MoveVertical } from 'lucide-react';\nimport type { ButtonHTMLAttributes, FC } from 'react';\nimport { Container } from '../Container';\nimport { DropDown } from '../DropDown';\n\nconst ButtonItem: FC<ButtonHTMLAttributes<HTMLButtonElement>> = ({\n children,\n ...props\n}) => (\n <div className=\"relative w-full p-0.5\">\n <button\n className=\"hover:bg-text/10 focus:bg-text-opposite/20 aria-selected:bg-text/20 dark:hover:bg-text-opposite/10 dark:focus:bg-text-opposite/20 dark:aria-selected:bg-text-opposite/20 w-full cursor-pointer rounded-lg px-3 py-1 text-left focus:outline-none disabled:text-white/25 aria-selected:hover:cursor-default\"\n data-mode=\"system\"\n {...props}\n >\n {children}\n </button>\n </div>\n);\n\nexport type LocaleSwitcherProps = {\n locale?: Locales;\n localeList: Locales[];\n availableLocales?: Locales[];\n fullLocaleName?: boolean;\n setLocale: (locale: Locales) => void;\n};\n\nconst DROPDOWN_IDENTIFIER = 'locale-switcher';\n\nexport const LocaleSwitcher: FC<LocaleSwitcherProps> = ({\n locale,\n localeList,\n availableLocales,\n fullLocaleName = true,\n setLocale,\n}) => {\n let localeName = 'Select a locale';\n\n if (locale) {\n localeName = fullLocaleName ? getLocaleName(locale) : locale.toUpperCase();\n }\n\n return (\n <div\n className=\"border-text text-text dark:border-text-dark dark:text-text-dark rounded-xl border transition-colors\"\n aria-label=\"Language switcher\"\n >\n <DropDown identifier={DROPDOWN_IDENTIFIER}>\n <DropDown.Trigger\n identifier={DROPDOWN_IDENTIFIER}\n aria-label=\"Language selector\"\n >\n <div className=\"flex w-full items-center justify-between\">\n <div className=\"px-2\">{localeName}</div>\n <MoveVertical className=\"w-5 self-center\" />\n </div>\n </DropDown.Trigger>\n\n <DropDown.Panel identifier={DROPDOWN_IDENTIFIER} isOverable isFocusable>\n <Container\n className=\"min-w-28 p-1\"\n separator=\"y\"\n role=\"listbox\"\n aria-label=\"Language list\"\n >\n {localeList.map((lang) => (\n <ButtonItem\n key={lang}\n onClick={() => setLocale(lang)}\n aria-label={`Switch to ${lang}`}\n disabled={!(availableLocales ?? localeList).includes(lang)}\n role=\"option\"\n aria-selected={locale === lang}\n lang={lang}\n >\n {getLocaleName(lang)}\n </ButtonItem>\n ))}\n </Container>\n </DropDown.Panel>\n </DropDown>\n </div>\n );\n};\n"],"names":["jsx","jsxs"],"mappings":";;;;;AAOA,MAAM,aAA0D,CAAC;AAAA,EAC/D;AAAA,EACA,GAAG;AACL,MACEA,kCAAAA,IAAC,OAAI,EAAA,WAAU,yBACb,UAAAA,kCAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,aAAU;AAAA,IACT,GAAG;AAAA,IAEH;AAAA,EAAA;AACH,EACF,CAAA;AAWF,MAAM,sBAAsB;AAErB,MAAM,iBAA0C,CAAC;AAAA,EACtD;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AACF,MAAM;AACJ,MAAI,aAAa;AAEjB,MAAI,QAAQ;AACV,iBAAa,iBAAiB,cAAc,MAAM,IAAI,OAAO;EAC/D;AAGE,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,cAAW;AAAA,MAEX,UAAAC,kCAAA,KAAC,UAAS,EAAA,YAAY,qBACpB,UAAA;AAAA,QAAAD,kCAAA;AAAA,UAAC,SAAS;AAAA,UAAT;AAAA,YACC,YAAY;AAAA,YACZ,cAAW;AAAA,YAEX,UAAAC,kCAAA,KAAC,OAAI,EAAA,WAAU,4CACb,UAAA;AAAA,cAACD,kCAAA,IAAA,OAAA,EAAI,WAAU,QAAQ,UAAW,YAAA;AAAA,cAClCA,kCAAAA,IAAC,cAAa,EAAA,WAAU,kBAAkB,CAAA;AAAA,YAAA,GAC5C;AAAA,UAAA;AAAA,QACF;AAAA,QAEAA,kCAAAA,IAAC,SAAS,OAAT,EAAe,YAAY,qBAAqB,YAAU,MAAC,aAAW,MACrE,UAAAA,kCAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,WAAU;AAAA,YACV,MAAK;AAAA,YACL,cAAW;AAAA,YAEV,UAAA,WAAW,IAAI,CAAC,SACfA,kCAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBAEC,SAAS,MAAM,UAAU,IAAI;AAAA,gBAC7B,cAAY,aAAa,IAAI;AAAA,gBAC7B,UAAU,EAAE,oBAAoB,YAAY,SAAS,IAAI;AAAA,gBACzD,MAAK;AAAA,gBACL,iBAAe,WAAW;AAAA,gBAC1B;AAAA,gBAEC,wBAAc,IAAI;AAAA,cAAA;AAAA,cARd;AAAA,YAAA,CAUR;AAAA,UAAA;AAAA,QAAA,GAEL;AAAA,MAAA,GACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Navbar/MobileNavbar.cjs CHANGED Viewed

@@ -51,7 +51,7 @@ const MobileNavbar = ({
     {
       className: utils_cn.cn(
         bgStyle,
-        "sticky top-0 z-50 flex w-screen flex-col  transition",
+        "sticky top-0 z-50 flex w-screen flex-col transition",
         isHidden ? "-translate-y-full" : "translate-y-0"
       ),
       id: "mobile-menu",
@@ -59,11 +59,11 @@ const MobileNavbar = ({
         /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
           "div",
           {
-            className: "flex w-full items-center justify-between gap-[10vw] px-4 py-3",
+            className: "flex w-full items-center justify-between gap-1 px-4 py-3 md:gap-[10vw]",
             ref: navRef,
             children: [
               logo,
-              /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "flex w-full items-center justify-end gap-6", children: [
+              /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "flex w-full flex-1 items-center justify-end gap-6", children: [
                 /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "flex w-full items-center justify-end gap-1", children: rightItems }),
                 isBurgerShowed && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
                   components_Navbar_Burger.Burger,

package/dist/components/Navbar/MobileNavbar.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MobileNavbar.cjs","sources":["../../../src/components/Navbar/MobileNavbar.tsx"],"sourcesContent":["'use client';\n\nimport { m, type Variants } from 'framer-motion';\nimport { useRef, useState, type ReactElement, type ReactNode } from 'react';\nimport { useScrollBlockage, useScrollDetection } from '../../hooks';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\nimport { TabProps } from '../TabSelector';\nimport { Burger } from './Burger';\n\ntype MobileNavbarProps<T extends TabProps> = {\n logo: ReactNode;\n topChildren?: ReactNode;\n topSections?: ReactElement<T>[];\n bottomChildren?: ReactNode;\n bottomSections?: ReactElement<T>[];\n rightItems?: ReactNode;\n};\n\nconst navVariants: Variants = {\n open: {\n transition: { staggerChildren: 0.07, delayChildren: 0.2 },\n },\n closed: {\n transition: { staggerChildren: 0.05, staggerDirection: -1 },\n },\n};\n\nconst bgStyle =\n 'bg-card/95 dark:bg-card-dark/95 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur';\n\nexport const MobileNavbar = <T extends TabProps>({\n logo,\n topChildren,\n topSections = [],\n bottomChildren,\n bottomSections = [],\n rightItems,\n}: MobileNavbarProps<T>) => {\n const [isHidden, setIsHidden] = useState<boolean>(false);\n const [isUnrolled, setIsUnrolled] = useState<boolean>(false);\n\n const navRef = useRef<HTMLDivElement>(null);\n\n useScrollBlockage({\n disableScroll: isUnrolled,\n key: 'mobile_nav',\n });\n\n useScrollDetection({\n onScrollUp: () => setIsHidden(false),\n onScrollDown: () => setIsHidden(true),\n isEnabled: !isUnrolled,\n });\n\n const backDivHeight = !isHidden ? (navRef.current?.clientHeight ?? 0) : 0;\n\n const isBurgerShowed = topSections.length + bottomSections.length > 0;\n\n return (\n <nav\n className={cn(\n bgStyle,\n 'sticky top-0 z-50 flex w-screen flex-col transition',\n isHidden ? '-translate-y-full' : 'translate-y-0'\n )}\n id=\"mobile-menu\"\n >\n <div\n className=\"flex w-full items-center justify-between gap-~~[10vw]~~ px-4 py-3\"\n ref={navRef}\n >\n {logo}\n\n <div className=\"flex w-full items-center justify-end gap-6\">\n <div className=\"flex w-full items-center justify-end gap-1\">\n {rightItems}\n </div>\n\n {isBurgerShowed && (\n <Burger\n isActive={isUnrolled}\n onClick={() => setIsUnrolled((isUnrolled) => !isUnrolled)}\n />\n )}\n </div>\n </div>\n\n <div\n className={cn(\n bgStyle,\n 'absolute bottom-0 left-0 w-full translate-y-full'\n )}\n >\n <MaxHeightSmoother isHidden={!isUnrolled}>\n <m.div\n className=\"text-text dark:text-text-dark flex w-full flex-col pb-[20%] pt-10 text-lg tracking-wide\"\n onClick={() => setIsUnrolled(false)}\n animate={isUnrolled ? 'open' : 'closed'}\n variants={navVariants}\n style={{\n height: `calc(100vh - ${backDivHeight}px)`,\n }}\n >\n {topChildren}\n <div className=\"flex h-full flex-col justify-center\">\n {topSections}\n {bottomSections}\n </div>\n\n <div className=\"m-auto flex w-full max-w-[400px] items-center justify-center gap-1 px-5 py-3\">\n {bottomChildren}\n </div>\n </m.div>\n </MaxHeightSmoother>\n </div>\n </nav>\n );\n};\n"],"names":["useState","useRef","useScrollBlockage","useScrollDetection","jsxs","cn","jsx","Burger","isUnrolled","MaxHeightSmoother","m"],"mappings":";;;;;;;;;;;;;;;;;AAmBA,MAAM,cAAwB;AAAA,EAC5B,MAAM;AAAA,IACJ,YAAY,EAAE,iBAAiB,MAAM,eAAe,IAAI;AAAA,EAC1D;AAAA,EACA,QAAQ;AAAA,IACN,YAAY,EAAE,iBAAiB,MAAM,kBAAkB,GAAG;AAAA,EAC5D;AACF;AAEA,MAAM,UACJ;AAEK,MAAM,eAAe,CAAqB;AAAA,EAC/C;AAAA,EACA;AAAA,EACA,cAAc,CAAC;AAAA,EACf;AAAA,EACA,iBAAiB,CAAC;AAAA,EAClB;AACF,MAA4B;AAC1B,QAAM,CAAC,UAAU,WAAW,IAAIA,oBAAkB,KAAK;AACvD,QAAM,CAAC,YAAY,aAAa,IAAIA,oBAAkB,KAAK;AAErD,QAAA,SAASC,kBAAuB,IAAI;AAExBC,kDAAA;AAAA,IAChB,eAAe;AAAA,IACf,KAAK;AAAA,EAAA,CACN;AAEkBC,8CAAA;AAAA,IACjB,YAAY,MAAM,YAAY,KAAK;AAAA,IACnC,cAAc,MAAM,YAAY,IAAI;AAAA,IACpC,WAAW,CAAC;AAAA,EAAA,CACb;AAED,QAAM,gBAAgB,CAAC,WAAY,OAAO,SAAS,gBAAgB,IAAK;AAExE,QAAM,iBAAiB,YAAY,SAAS,eAAe,SAAS;AAGlE,SAAAC,2BAAA,kBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,SAAA;AAAA,QACT;AAAA,QACA;AAAA,QACA,WAAW,sBAAsB;AAAA,MACnC;AAAA,MACA,IAAG;AAAA,MAEH,UAAA;AAAA,QAAAD,2BAAA,kBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,KAAK;AAAA,YAEJ,UAAA;AAAA,cAAA;AAAA,cAEDA,2BAAAA,kBAAAA,KAAC,OAAI,EAAA,WAAU,~~8CACb~~,UAAA;AAAA,gBAACE,2BAAA,kBAAA,IAAA,OAAA,EAAI,WAAU,8CACZ,UACH,YAAA;AAAA,gBAEC,kBACCA,2BAAA,kBAAA;AAAA,kBAACC,yBAAA;AAAA,kBAAA;AAAA,oBACC,UAAU;AAAA,oBACV,SAAS,MAAM,cAAc,CAACC,gBAAe,CAACA,WAAU;AAAA,kBAAA;AAAA,gBAC1D;AAAA,cAAA,GAEJ;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,QAEAF,2BAAA,kBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWD,SAAA;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YAEA,UAACC,2BAAA,kBAAA,IAAAG,sDAAA,EAAkB,UAAU,CAAC,YAC5B,UAAAL,2BAAA,kBAAA;AAAA,cAACM,aAAAA,EAAE;AAAA,cAAF;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,MAAM,cAAc,KAAK;AAAA,gBAClC,SAAS,aAAa,SAAS;AAAA,gBAC/B,UAAU;AAAA,gBACV,OAAO;AAAA,kBACL,QAAQ,gBAAgB,aAAa;AAAA,gBACvC;AAAA,gBAEC,UAAA;AAAA,kBAAA;AAAA,kBACDN,2BAAAA,kBAAAA,KAAC,OAAI,EAAA,WAAU,uCACZ,UAAA;AAAA,oBAAA;AAAA,oBACA;AAAA,kBAAA,GACH;AAAA,kBAECE,2BAAA,kBAAA,IAAA,OAAA,EAAI,WAAU,gFACZ,UACH,gBAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,GAEJ;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;;"}
1	+ {"version":3,"file":"MobileNavbar.cjs","sources":["../../../src/components/Navbar/MobileNavbar.tsx"],"sourcesContent":["'use client';\n\nimport { m, type Variants } from 'framer-motion';\nimport { useRef, useState, type ReactElement, type ReactNode } from 'react';\nimport { useScrollBlockage, useScrollDetection } from '../../hooks';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\nimport { TabProps } from '../TabSelector';\nimport { Burger } from './Burger';\n\ntype MobileNavbarProps<T extends TabProps> = {\n logo: ReactNode;\n topChildren?: ReactNode;\n topSections?: ReactElement<T>[];\n bottomChildren?: ReactNode;\n bottomSections?: ReactElement<T>[];\n rightItems?: ReactNode;\n};\n\nconst navVariants: Variants = {\n open: {\n transition: { staggerChildren: 0.07, delayChildren: 0.2 },\n },\n closed: {\n transition: { staggerChildren: 0.05, staggerDirection: -1 },\n },\n};\n\nconst bgStyle =\n 'bg-card/95 dark:bg-card-dark/95 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur';\n\nexport const MobileNavbar = <T extends TabProps>({\n logo,\n topChildren,\n topSections = [],\n bottomChildren,\n bottomSections = [],\n rightItems,\n}: MobileNavbarProps<T>) => {\n const [isHidden, setIsHidden] = useState<boolean>(false);\n const [isUnrolled, setIsUnrolled] = useState<boolean>(false);\n\n const navRef = useRef<HTMLDivElement>(null);\n\n useScrollBlockage({\n disableScroll: isUnrolled,\n key: 'mobile_nav',\n });\n\n useScrollDetection({\n onScrollUp: () => setIsHidden(false),\n onScrollDown: () => setIsHidden(true),\n isEnabled: !isUnrolled,\n });\n\n const backDivHeight = !isHidden ? (navRef.current?.clientHeight ?? 0) : 0;\n\n const isBurgerShowed = topSections.length + bottomSections.length > 0;\n\n return (\n <nav\n className={cn(\n bgStyle,\n 'sticky top-0 z-50 flex w-screen flex-col transition',\n isHidden ? '-translate-y-full' : 'translate-y-0'\n )}\n id=\"mobile-menu\"\n >\n <div\n className=\"flex w-full items-center justify-between gap-1 px-4 py-3 md:gap-[10vw]\"\n ref={navRef}\n >\n {logo}\n\n <div className=\"flex w-full flex-1 items-center justify-end gap-6\">\n <div className=\"flex w-full items-center justify-end gap-1\">\n {rightItems}\n </div>\n\n {isBurgerShowed && (\n <Burger\n isActive={isUnrolled}\n onClick={() => setIsUnrolled((isUnrolled) => !isUnrolled)}\n />\n )}\n </div>\n </div>\n\n <div\n className={cn(\n bgStyle,\n 'absolute bottom-0 left-0 w-full translate-y-full'\n )}\n >\n <MaxHeightSmoother isHidden={!isUnrolled}>\n <m.div\n className=\"text-text dark:text-text-dark flex w-full flex-col pb-[20%] pt-10 text-lg tracking-wide\"\n onClick={() => setIsUnrolled(false)}\n animate={isUnrolled ? 'open' : 'closed'}\n variants={navVariants}\n style={{\n height: `calc(100vh - ${backDivHeight}px)`,\n }}\n >\n {topChildren}\n <div className=\"flex h-full flex-col justify-center\">\n {topSections}\n {bottomSections}\n </div>\n\n <div className=\"m-auto flex w-full max-w-[400px] items-center justify-center gap-1 px-5 py-3\">\n {bottomChildren}\n </div>\n </m.div>\n </MaxHeightSmoother>\n </div>\n </nav>\n );\n};\n"],"names":["useState","useRef","useScrollBlockage","useScrollDetection","jsxs","cn","jsx","Burger","isUnrolled","MaxHeightSmoother","m"],"mappings":";;;;;;;;;;;;;;;;;AAmBA,MAAM,cAAwB;AAAA,EAC5B,MAAM;AAAA,IACJ,YAAY,EAAE,iBAAiB,MAAM,eAAe,IAAI;AAAA,EAC1D;AAAA,EACA,QAAQ;AAAA,IACN,YAAY,EAAE,iBAAiB,MAAM,kBAAkB,GAAG;AAAA,EAC5D;AACF;AAEA,MAAM,UACJ;AAEK,MAAM,eAAe,CAAqB;AAAA,EAC/C;AAAA,EACA;AAAA,EACA,cAAc,CAAC;AAAA,EACf;AAAA,EACA,iBAAiB,CAAC;AAAA,EAClB;AACF,MAA4B;AAC1B,QAAM,CAAC,UAAU,WAAW,IAAIA,oBAAkB,KAAK;AACvD,QAAM,CAAC,YAAY,aAAa,IAAIA,oBAAkB,KAAK;AAErD,QAAA,SAASC,kBAAuB,IAAI;AAExBC,kDAAA;AAAA,IAChB,eAAe;AAAA,IACf,KAAK;AAAA,EAAA,CACN;AAEkBC,8CAAA;AAAA,IACjB,YAAY,MAAM,YAAY,KAAK;AAAA,IACnC,cAAc,MAAM,YAAY,IAAI;AAAA,IACpC,WAAW,CAAC;AAAA,EAAA,CACb;AAED,QAAM,gBAAgB,CAAC,WAAY,OAAO,SAAS,gBAAgB,IAAK;AAExE,QAAM,iBAAiB,YAAY,SAAS,eAAe,SAAS;AAGlE,SAAAC,2BAAA,kBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,SAAA;AAAA,QACT;AAAA,QACA;AAAA,QACA,WAAW,sBAAsB;AAAA,MACnC;AAAA,MACA,IAAG;AAAA,MAEH,UAAA;AAAA,QAAAD,2BAAA,kBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,KAAK;AAAA,YAEJ,UAAA;AAAA,cAAA;AAAA,cAEDA,2BAAAA,kBAAAA,KAAC,OAAI,EAAA,WAAU,qDACb,UAAA;AAAA,gBAACE,2BAAA,kBAAA,IAAA,OAAA,EAAI,WAAU,8CACZ,UACH,YAAA;AAAA,gBAEC,kBACCA,2BAAA,kBAAA;AAAA,kBAACC,yBAAA;AAAA,kBAAA;AAAA,oBACC,UAAU;AAAA,oBACV,SAAS,MAAM,cAAc,CAACC,gBAAe,CAACA,WAAU;AAAA,kBAAA;AAAA,gBAC1D;AAAA,cAAA,GAEJ;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,QAEAF,2BAAA,kBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWD,SAAA;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YAEA,UAACC,2BAAA,kBAAA,IAAAG,sDAAA,EAAkB,UAAU,CAAC,YAC5B,UAAAL,2BAAA,kBAAA;AAAA,cAACM,aAAAA,EAAE;AAAA,cAAF;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,MAAM,cAAc,KAAK;AAAA,gBAClC,SAAS,aAAa,SAAS;AAAA,gBAC/B,UAAU;AAAA,gBACV,OAAO;AAAA,kBACL,QAAQ,gBAAgB,aAAa;AAAA,gBACvC;AAAA,gBAEC,UAAA;AAAA,kBAAA;AAAA,kBACDN,2BAAAA,kBAAAA,KAAC,OAAI,EAAA,WAAU,uCACZ,UAAA;AAAA,oBAAA;AAAA,oBACA;AAAA,kBAAA,GACH;AAAA,kBAECE,2BAAA,kBAAA,IAAA,OAAA,EAAI,WAAU,gFACZ,UACH,gBAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,GAEJ;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;;"}

package/dist/components/Navbar/MobileNavbar.mjs CHANGED Viewed

@@ -49,7 +49,7 @@ const MobileNavbar = ({
     {
       className: cn(
         bgStyle,
-        "sticky top-0 z-50 flex w-screen flex-col  transition",
+        "sticky top-0 z-50 flex w-screen flex-col transition",
         isHidden ? "-translate-y-full" : "translate-y-0"
       ),
       id: "mobile-menu",
@@ -57,11 +57,11 @@ const MobileNavbar = ({
         /* @__PURE__ */ jsxRuntimeExports.jsxs(
           "div",
           {
-            className: "flex w-full items-center justify-between gap-[10vw] px-4 py-3",
+            className: "flex w-full items-center justify-between gap-1 px-4 py-3 md:gap-[10vw]",
             ref: navRef,
             children: [
               logo,
-              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex w-full items-center justify-end gap-6", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex w-full flex-1 items-center justify-end gap-6", children: [
                 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex w-full items-center justify-end gap-1", children: rightItems }),
                 isBurgerShowed && /* @__PURE__ */ jsxRuntimeExports.jsx(
                   Burger,

package/dist/components/Navbar/MobileNavbar.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MobileNavbar.mjs","sources":["../../../src/components/Navbar/MobileNavbar.tsx"],"sourcesContent":["'use client';\n\nimport { m, type Variants } from 'framer-motion';\nimport { useRef, useState, type ReactElement, type ReactNode } from 'react';\nimport { useScrollBlockage, useScrollDetection } from '../../hooks';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\nimport { TabProps } from '../TabSelector';\nimport { Burger } from './Burger';\n\ntype MobileNavbarProps<T extends TabProps> = {\n logo: ReactNode;\n topChildren?: ReactNode;\n topSections?: ReactElement<T>[];\n bottomChildren?: ReactNode;\n bottomSections?: ReactElement<T>[];\n rightItems?: ReactNode;\n};\n\nconst navVariants: Variants = {\n open: {\n transition: { staggerChildren: 0.07, delayChildren: 0.2 },\n },\n closed: {\n transition: { staggerChildren: 0.05, staggerDirection: -1 },\n },\n};\n\nconst bgStyle =\n 'bg-card/95 dark:bg-card-dark/95 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur';\n\nexport const MobileNavbar = <T extends TabProps>({\n logo,\n topChildren,\n topSections = [],\n bottomChildren,\n bottomSections = [],\n rightItems,\n}: MobileNavbarProps<T>) => {\n const [isHidden, setIsHidden] = useState<boolean>(false);\n const [isUnrolled, setIsUnrolled] = useState<boolean>(false);\n\n const navRef = useRef<HTMLDivElement>(null);\n\n useScrollBlockage({\n disableScroll: isUnrolled,\n key: 'mobile_nav',\n });\n\n useScrollDetection({\n onScrollUp: () => setIsHidden(false),\n onScrollDown: () => setIsHidden(true),\n isEnabled: !isUnrolled,\n });\n\n const backDivHeight = !isHidden ? (navRef.current?.clientHeight ?? 0) : 0;\n\n const isBurgerShowed = topSections.length + bottomSections.length > 0;\n\n return (\n <nav\n className={cn(\n bgStyle,\n 'sticky top-0 z-50 flex w-screen flex-col transition',\n isHidden ? '-translate-y-full' : 'translate-y-0'\n )}\n id=\"mobile-menu\"\n >\n <div\n className=\"flex w-full items-center justify-between gap-~~[10vw]~~ px-4 py-3\"\n ref={navRef}\n >\n {logo}\n\n <div className=\"flex w-full items-center justify-end gap-6\">\n <div className=\"flex w-full items-center justify-end gap-1\">\n {rightItems}\n </div>\n\n {isBurgerShowed && (\n <Burger\n isActive={isUnrolled}\n onClick={() => setIsUnrolled((isUnrolled) => !isUnrolled)}\n />\n )}\n </div>\n </div>\n\n <div\n className={cn(\n bgStyle,\n 'absolute bottom-0 left-0 w-full translate-y-full'\n )}\n >\n <MaxHeightSmoother isHidden={!isUnrolled}>\n <m.div\n className=\"text-text dark:text-text-dark flex w-full flex-col pb-[20%] pt-10 text-lg tracking-wide\"\n onClick={() => setIsUnrolled(false)}\n animate={isUnrolled ? 'open' : 'closed'}\n variants={navVariants}\n style={{\n height: `calc(100vh - ${backDivHeight}px)`,\n }}\n >\n {topChildren}\n <div className=\"flex h-full flex-col justify-center\">\n {topSections}\n {bottomSections}\n </div>\n\n <div className=\"m-auto flex w-full max-w-[400px] items-center justify-center gap-1 px-5 py-3\">\n {bottomChildren}\n </div>\n </m.div>\n </MaxHeightSmoother>\n </div>\n </nav>\n );\n};\n"],"names":["jsxs","jsx","isUnrolled"],"mappings":";;;;;;;;;;;;;;;AAmBA,MAAM,cAAwB;AAAA,EAC5B,MAAM;AAAA,IACJ,YAAY,EAAE,iBAAiB,MAAM,eAAe,IAAI;AAAA,EAC1D;AAAA,EACA,QAAQ;AAAA,IACN,YAAY,EAAE,iBAAiB,MAAM,kBAAkB,GAAG;AAAA,EAC5D;AACF;AAEA,MAAM,UACJ;AAEK,MAAM,eAAe,CAAqB;AAAA,EAC/C;AAAA,EACA;AAAA,EACA,cAAc,CAAC;AAAA,EACf;AAAA,EACA,iBAAiB,CAAC;AAAA,EAClB;AACF,MAA4B;AAC1B,QAAM,CAAC,UAAU,WAAW,IAAI,SAAkB,KAAK;AACvD,QAAM,CAAC,YAAY,aAAa,IAAI,SAAkB,KAAK;AAErD,QAAA,SAAS,OAAuB,IAAI;AAExB,oBAAA;AAAA,IAChB,eAAe;AAAA,IACf,KAAK;AAAA,EAAA,CACN;AAEkB,qBAAA;AAAA,IACjB,YAAY,MAAM,YAAY,KAAK;AAAA,IACnC,cAAc,MAAM,YAAY,IAAI;AAAA,IACpC,WAAW,CAAC;AAAA,EAAA,CACb;AAED,QAAM,gBAAgB,CAAC,WAAY,OAAO,SAAS,gBAAgB,IAAK;AAExE,QAAM,iBAAiB,YAAY,SAAS,eAAe,SAAS;AAGlE,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA,WAAW,sBAAsB;AAAA,MACnC;AAAA,MACA,IAAG;AAAA,MAEH,UAAA;AAAA,QAAAA,kCAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,KAAK;AAAA,YAEJ,UAAA;AAAA,cAAA;AAAA,cAEDA,kCAAAA,KAAC,OAAI,EAAA,WAAU,~~8CACb~~,UAAA;AAAA,gBAACC,kCAAA,IAAA,OAAA,EAAI,WAAU,8CACZ,UACH,YAAA;AAAA,gBAEC,kBACCA,kCAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,UAAU;AAAA,oBACV,SAAS,MAAM,cAAc,CAACC,gBAAe,CAACA,WAAU;AAAA,kBAAA;AAAA,gBAC1D;AAAA,cAAA,GAEJ;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,QAEAD,kCAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YAEA,UAACA,kCAAA,IAAA,mBAAA,EAAkB,UAAU,CAAC,YAC5B,UAAAD,kCAAA;AAAA,cAAC,EAAE;AAAA,cAAF;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,MAAM,cAAc,KAAK;AAAA,gBAClC,SAAS,aAAa,SAAS;AAAA,gBAC/B,UAAU;AAAA,gBACV,OAAO;AAAA,kBACL,QAAQ,gBAAgB,aAAa;AAAA,gBACvC;AAAA,gBAEC,UAAA;AAAA,kBAAA;AAAA,kBACDA,kCAAAA,KAAC,OAAI,EAAA,WAAU,uCACZ,UAAA;AAAA,oBAAA;AAAA,oBACA;AAAA,kBAAA,GACH;AAAA,kBAECC,kCAAA,IAAA,OAAA,EAAI,WAAU,gFACZ,UACH,gBAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,GAEJ;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
1	+ {"version":3,"file":"MobileNavbar.mjs","sources":["../../../src/components/Navbar/MobileNavbar.tsx"],"sourcesContent":["'use client';\n\nimport { m, type Variants } from 'framer-motion';\nimport { useRef, useState, type ReactElement, type ReactNode } from 'react';\nimport { useScrollBlockage, useScrollDetection } from '../../hooks';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\nimport { TabProps } from '../TabSelector';\nimport { Burger } from './Burger';\n\ntype MobileNavbarProps<T extends TabProps> = {\n logo: ReactNode;\n topChildren?: ReactNode;\n topSections?: ReactElement<T>[];\n bottomChildren?: ReactNode;\n bottomSections?: ReactElement<T>[];\n rightItems?: ReactNode;\n};\n\nconst navVariants: Variants = {\n open: {\n transition: { staggerChildren: 0.07, delayChildren: 0.2 },\n },\n closed: {\n transition: { staggerChildren: 0.05, staggerDirection: -1 },\n },\n};\n\nconst bgStyle =\n 'bg-card/95 dark:bg-card-dark/95 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur';\n\nexport const MobileNavbar = <T extends TabProps>({\n logo,\n topChildren,\n topSections = [],\n bottomChildren,\n bottomSections = [],\n rightItems,\n}: MobileNavbarProps<T>) => {\n const [isHidden, setIsHidden] = useState<boolean>(false);\n const [isUnrolled, setIsUnrolled] = useState<boolean>(false);\n\n const navRef = useRef<HTMLDivElement>(null);\n\n useScrollBlockage({\n disableScroll: isUnrolled,\n key: 'mobile_nav',\n });\n\n useScrollDetection({\n onScrollUp: () => setIsHidden(false),\n onScrollDown: () => setIsHidden(true),\n isEnabled: !isUnrolled,\n });\n\n const backDivHeight = !isHidden ? (navRef.current?.clientHeight ?? 0) : 0;\n\n const isBurgerShowed = topSections.length + bottomSections.length > 0;\n\n return (\n <nav\n className={cn(\n bgStyle,\n 'sticky top-0 z-50 flex w-screen flex-col transition',\n isHidden ? '-translate-y-full' : 'translate-y-0'\n )}\n id=\"mobile-menu\"\n >\n <div\n className=\"flex w-full items-center justify-between gap-1 px-4 py-3 md:gap-[10vw]\"\n ref={navRef}\n >\n {logo}\n\n <div className=\"flex w-full flex-1 items-center justify-end gap-6\">\n <div className=\"flex w-full items-center justify-end gap-1\">\n {rightItems}\n </div>\n\n {isBurgerShowed && (\n <Burger\n isActive={isUnrolled}\n onClick={() => setIsUnrolled((isUnrolled) => !isUnrolled)}\n />\n )}\n </div>\n </div>\n\n <div\n className={cn(\n bgStyle,\n 'absolute bottom-0 left-0 w-full translate-y-full'\n )}\n >\n <MaxHeightSmoother isHidden={!isUnrolled}>\n <m.div\n className=\"text-text dark:text-text-dark flex w-full flex-col pb-[20%] pt-10 text-lg tracking-wide\"\n onClick={() => setIsUnrolled(false)}\n animate={isUnrolled ? 'open' : 'closed'}\n variants={navVariants}\n style={{\n height: `calc(100vh - ${backDivHeight}px)`,\n }}\n >\n {topChildren}\n <div className=\"flex h-full flex-col justify-center\">\n {topSections}\n {bottomSections}\n </div>\n\n <div className=\"m-auto flex w-full max-w-[400px] items-center justify-center gap-1 px-5 py-3\">\n {bottomChildren}\n </div>\n </m.div>\n </MaxHeightSmoother>\n </div>\n </nav>\n );\n};\n"],"names":["jsxs","jsx","isUnrolled"],"mappings":";;;;;;;;;;;;;;;AAmBA,MAAM,cAAwB;AAAA,EAC5B,MAAM;AAAA,IACJ,YAAY,EAAE,iBAAiB,MAAM,eAAe,IAAI;AAAA,EAC1D;AAAA,EACA,QAAQ;AAAA,IACN,YAAY,EAAE,iBAAiB,MAAM,kBAAkB,GAAG;AAAA,EAC5D;AACF;AAEA,MAAM,UACJ;AAEK,MAAM,eAAe,CAAqB;AAAA,EAC/C;AAAA,EACA;AAAA,EACA,cAAc,CAAC;AAAA,EACf;AAAA,EACA,iBAAiB,CAAC;AAAA,EAClB;AACF,MAA4B;AAC1B,QAAM,CAAC,UAAU,WAAW,IAAI,SAAkB,KAAK;AACvD,QAAM,CAAC,YAAY,aAAa,IAAI,SAAkB,KAAK;AAErD,QAAA,SAAS,OAAuB,IAAI;AAExB,oBAAA;AAAA,IAChB,eAAe;AAAA,IACf,KAAK;AAAA,EAAA,CACN;AAEkB,qBAAA;AAAA,IACjB,YAAY,MAAM,YAAY,KAAK;AAAA,IACnC,cAAc,MAAM,YAAY,IAAI;AAAA,IACpC,WAAW,CAAC;AAAA,EAAA,CACb;AAED,QAAM,gBAAgB,CAAC,WAAY,OAAO,SAAS,gBAAgB,IAAK;AAExE,QAAM,iBAAiB,YAAY,SAAS,eAAe,SAAS;AAGlE,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA,WAAW,sBAAsB;AAAA,MACnC;AAAA,MACA,IAAG;AAAA,MAEH,UAAA;AAAA,QAAAA,kCAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,KAAK;AAAA,YAEJ,UAAA;AAAA,cAAA;AAAA,cAEDA,kCAAAA,KAAC,OAAI,EAAA,WAAU,qDACb,UAAA;AAAA,gBAACC,kCAAA,IAAA,OAAA,EAAI,WAAU,8CACZ,UACH,YAAA;AAAA,gBAEC,kBACCA,kCAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,UAAU;AAAA,oBACV,SAAS,MAAM,cAAc,CAACC,gBAAe,CAACA,WAAU;AAAA,kBAAA;AAAA,gBAC1D;AAAA,cAAA,GAEJ;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,QAEAD,kCAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YAEA,UAACA,kCAAA,IAAA,mBAAA,EAAkB,UAAU,CAAC,YAC5B,UAAAD,kCAAA;AAAA,cAAC,EAAE;AAAA,cAAF;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,MAAM,cAAc,KAAK;AAAA,gBAClC,SAAS,aAAa,SAAS;AAAA,gBAC/B,UAAU;AAAA,gBACV,OAAO;AAAA,kBACL,QAAQ,gBAAgB,aAAa;AAAA,gBACvC;AAAA,gBAEC,UAAA;AAAA,kBAAA;AAAA,kBACDA,kCAAAA,KAAC,OAAI,EAAA,WAAU,uCACZ,UAAA;AAAA,oBAAA;AAAA,oBACA;AAAA,kBAAA,GACH;AAAA,kBAECC,kCAAA,IAAA,OAAA,EAAI,WAAU,gFACZ,UACH,gBAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,GAEJ;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/RightDrawer/RightDrawer.cjs CHANGED Viewed

@@ -4,6 +4,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("../../jsx-runtime-XHKiWCTo.cjs");
 const lucideReact = require("lucide-react");
 const require$$0 = require("react");
+const shallow = require("../../shallow-lhDIFtEp.cjs");
 const hooks_useDevice = require("../../hooks/useDevice.cjs");
 const hooks_useScrollBlockage_index = require("../../hooks/useScrollBlockage/index.cjs");
 const utils_isElementAtTopAndNotCovered = require("../../utils/isElementAtTopAndNotCovered.cjs");
@@ -23,10 +24,16 @@ const RightDrawer = ({
   const { isMobile } = hooks_useDevice.useDevice("md");
   const panelRef = require$$0.useRef(null);
   const childrenContainerRef = require$$0.useRef(null);
-  const { isOpen, close, open } = components_RightDrawer_useRightDrawerStore.useRightDrawerStore(identifier)();
+  const { close, open, isOpen } = components_RightDrawer_useRightDrawerStore.useRightDrawerStore(
+    shallow.useShallow((s) => ({
+      close: () => s.close(identifier),
+      open: () => s.open(identifier),
+      isOpen: s.isOpen(identifier)
+    }))
+  );
   hooks_useScrollBlockage_index.useScrollBlockage({
     disableScroll: isOpen,
-    key: identifier ? "right_drawer" : `right_drawer_${identifier}`
+    key: identifier ? `right_drawer_${identifier}` : "right_drawer"
   });
   require$$0.useEffect(() => {
     const handleClickOutside = (event) => {
@@ -41,7 +48,7 @@ const RightDrawer = ({
     };
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
-  }, [isOpen, close, onClose, closeOnOutsideClick]);
+  }, [isOpen, close, onClose, closeOnOutsideClick, identifier]);
   require$$0.useEffect(() => {
     if (isOpenProp !== void 0) {
       if (isOpenProp) {
@@ -51,7 +58,7 @@ const RightDrawer = ({
         onClose?.();
       }
     }
-  }, [close, open, onClose, isOpenProp]);
+  }, [close, open, onClose, isOpenProp, identifier]);
   const handleSpareSpaceClick = (e) => {
     if (e.target !== e.currentTarget) {
       return;

package/dist/components/RightDrawer/RightDrawer.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RightDrawer.cjs","sources":["../../../src/components/RightDrawer/RightDrawer.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-static-element-interactions /\n/ eslint-disable jsx-a11y/click-events-have-key-events */\n'use client';\n\nimport { ChevronLeft, X } from 'lucide-react';\nimport {\n type ReactNode,\n type FC,\n useEffect,\n useRef,\n type MouseEventHandler,\n} from 'react';\nimport { useDevice } from '../../hooks/useDevice';\nimport { useScrollBlockage } from '../../hooks/useScrollBlockage';\nimport { isElementAtTopAndNotCovered } from '../../utils/isElementAtTopAndNotCovered';\nimport { Container } from '../Container';\nimport { MaxWidthSmoother } from '../MaxWidthSmoother/index';\nimport { useRightDrawerStore } from './useRightDrawerStore';\n\ntype BackButtonProps = {\n onBack: () => void;\n text?: string;\n};\n\ntype RightDrawerProps = {\n title?: ReactNode;\n identifier: string;\n children?: ReactNode;\n header?: ReactNode;\n closeOnOutsideClick?: boolean;\n backButton?: BackButtonProps;\n isOpen?: boolean;\n onClose?: () => void;\n};\n\nexport const RightDrawer: FC<RightDrawerProps> = ({\n title,\n identifier,\n children,\n header,\n closeOnOutsideClick = true,\n backButton,\n isOpen: isOpenProp,\n onClose,\n}) => {\n const { isMobile } = useDevice('md');\n const panelRef = useRef<HTMLDivElement>(null);\n const childrenContainerRef = useRef<HTMLDivElement>(null);\n const { ~~isOpen,~~ close, open } = useRightDrawerStore(identifier)();\n\n useScrollBlockage({\n disableScroll: isOpen,\n key: identifier ? ~~'right_drawer' :~~ `right_drawer_${identifier}~~`,\~~n });\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (!panelRef.current) return;\n\n // Check if drawer is open and click outside is enabled\n const isClickAble = isOpen && closeOnOutsideClick;\n // Check if click is outside the drawer panel\n const isClickOutside = !panelRef.current.contains(event.target as Node);\n // Check if event propagation has been stopped\n const isAtTopAndVisible = isElementAtTopAndNotCovered(panelRef.current);\n\n if (isClickAble && isClickOutside && isAtTopAndVisible) {\n close();\n onClose?.();\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n return () => document.removeEventListener('mousedown', handleClickOutside);\n }, [isOpen, close, onClose, closeOnOutsideClick]); // Make sure the effect runs only if isOpen or close changes\n\n useEffect(() => {\n if (isOpenProp !== undefined) {\n if (isOpenProp) {\n open();\n } else {\n close();\n onClose?.();\n }\n }\n }, [close, open, onClose, isOpenProp]);\n\n const handleSpareSpaceClick: MouseEventHandler<HTMLDivElement> = (e) => {\n // Check if the click trigger the background\n if (e.target !== e.currentTarget) {\n return;\n }\n\n if (isMobile) {\n close();\n onClose?.();\n }\n };\n\n return (\n <div className=\"fixed right-0 top-0 z-50 flex h-full justify-end\">\n <MaxWidthSmoother isHidden={!isOpen} align=\"right\">\n <Container\n className=\"text-text dark:text-text-dark relative flex h-screen w-screen flex-col md:w-[400px]\"\n ref={panelRef}\n roundedSize=\"none\"\n >\n <div className=\"flex flex-col gap-3 p-6\">\n <div className=\"flex justify-between gap-3\">\n <div>\n {backButton && (\n <button\n className=\"flex cursor-pointer flex-row items-center gap-1 text-left\"\n onClick={backButton.onBack}\n >\n <ChevronLeft />\n {backButton?.text}\n </button>\n )}\n </div>\n <X className=\"ml-auto cursor-pointer\" onClick={close} />\n </div>\n <h2 className=\"flex items-center justify-center text-lg font-bold\">\n {title}\n </h2>\n {header}\n </div>\n\n <div className=\"flex h-full flex-col overflow-y-auto p-2\">\n <div\n className=\"flex-1\"\n onClick={handleSpareSpaceClick}\n ref={childrenContainerRef}\n >\n {children}\n </div>\n </div>\n </Container>\n </MaxWidthSmoother>\n </div>\n );\n};\n"],"names":["useDevice","useRef","useRightDrawerStore","useScrollBlockage","useEffect","isElementAtTopAndNotCovered","jsx","MaxWidthSmoother","jsxs","Container","ChevronLeft","X"],"mappings":"~~;;;;;;;;;;;;AAmCO~~,MAAM,cAAoC,CAAC;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,sBAAsB;AAAA,EACtB;AAAA,EACA,QAAQ;AAAA,EACR;AACF,MAAM;AACJ,QAAM,EAAE,SAAA,IAAaA,gBAAA,UAAU,IAAI;AAC7B,QAAA,WAAWC,kBAAuB,IAAI;AACtC,QAAA,uBAAuBA,kBAAuB,IAAI;AACxD,QAAM,EAAE,~~QAAQ,~~OAAO,~~KAAS~~,IAAAC,2CAAA,~~oBAAoB~~,UAAU;~~AAE5CC~~,kDAAA;AAAA,IAChB,eAAe;AAAA,IACf,KAAK,aAAa,~~iBAAiB,~~gBAAgB,UAAU;AAAA,EAAA,~~CAC9D~~;AAEDC,aAAAA,UAAU,MAAM;AACR,UAAA,qBAAqB,CAAC,UAAsB;AAC5C,UAAA,CAAC,SAAS,QAAS;AAGvB,YAAM,cAAc,UAAU;AAE9B,YAAM,iBAAiB,CAAC,SAAS,QAAQ,SAAS,MAAM,MAAc;AAEhE,YAAA,oBAAoBC,kCAAAA,4BAA4B,SAAS,OAAO;AAElE,UAAA,eAAe,kBAAkB,mBAAmB;AAChD;AACI;MACZ;AAAA,IAAA;AAGO,aAAA,iBAAiB,aAAa,kBAAkB;AACzD,WAAO,MAAM,SAAS,oBAAoB,aAAa,kBAAkB;AAAA,~~KACxE~~,CAAC,QAAQ,OAAO,SAAS,~~mBAAmB~~,CAAC;~~AAEhDD~~,aAAAA,UAAU,MAAM;AACd,QAAI,eAAe,QAAW;AAC5B,UAAI,YAAY;AACT;MAAA,OACA;AACC;AACI;MACZ;AAAA,IACF;AAAA,~~KACC~~,CAAC,OAAO,MAAM,SAAS,UAAU,CAAC;~~AAE/B~~,QAAA,wBAA2D,CAAC,MAAM;AAElE,QAAA,EAAE,WAAW,EAAE,eAAe;AAChC;AAAA,IACF;AAEA,QAAI,UAAU;AACN;AACI;IACZ;AAAA,EAAA;AAIA,SAAAE,2BAAAA,kBAAAA,IAAC,OAAI,EAAA,WAAU,oDACb,UAAAA,2BAAA,kBAAA,IAACC,sDAAiB,UAAU,CAAC,QAAQ,OAAM,SACzC,UAAAC,2BAAA,kBAAA;AAAA,IAACC,2BAAA;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,KAAK;AAAA,MACL,aAAY;AAAA,MAEZ,UAAA;AAAA,QAACD,2BAAAA,kBAAAA,KAAA,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,UAACA,2BAAAA,kBAAAA,KAAA,OAAA,EAAI,WAAU,8BACb,UAAA;AAAA,YAAAF,2BAAAA,kBAAAA,IAAC,SACE,UACC,cAAAE,2BAAA,kBAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,WAAW;AAAA,gBAEpB,UAAA;AAAA,kBAAAF,2BAAA,kBAAA,IAACI,YAAY,aAAA,EAAA;AAAA,kBACZ,YAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,GAGnB;AAAA,YACCJ,2BAAA,kBAAA,IAAAK,YAAA,GAAA,EAAE,WAAU,0BAAyB,SAAS,OAAO;AAAA,UAAA,GACxD;AAAA,UACCL,2BAAA,kBAAA,IAAA,MAAA,EAAG,WAAU,sDACX,UACH,OAAA;AAAA,UACC;AAAA,QAAA,GACH;AAAA,QAEAA,2BAAAA,kBAAAA,IAAC,OAAI,EAAA,WAAU,4CACb,UAAAA,2BAAA,kBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,SAAS;AAAA,YACT,KAAK;AAAA,YAEJ;AAAA,UAAA;AAAA,QAAA,GAEL;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,EAEJ,CAAA,EACF,CAAA;AAEJ;;"}
1	+ {"version":3,"file":"RightDrawer.cjs","sources":["../../../src/components/RightDrawer/RightDrawer.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-static-element-interactions /\n/ eslint-disable jsx-a11y/click-events-have-key-events */\n'use client';\n\nimport { ChevronLeft, X } from 'lucide-react';\nimport {\n type ReactNode,\n type FC,\n useEffect,\n useRef,\n type MouseEventHandler,\n} from 'react';\nimport { useShallow } from 'zustand/react/shallow';\nimport { useDevice } from '../../hooks/useDevice';\nimport { useScrollBlockage } from '../../hooks/useScrollBlockage';\nimport { isElementAtTopAndNotCovered } from '../../utils/isElementAtTopAndNotCovered';\nimport { Container } from '../Container';\nimport { MaxWidthSmoother } from '../MaxWidthSmoother/index';\nimport { useRightDrawerStore } from './useRightDrawerStore';\n\ntype BackButtonProps = {\n onBack: () => void;\n text?: string;\n};\n\ntype RightDrawerProps = {\n title?: ReactNode;\n identifier: string;\n children?: ReactNode;\n header?: ReactNode;\n closeOnOutsideClick?: boolean;\n backButton?: BackButtonProps;\n isOpen?: boolean;\n onClose?: () => void;\n};\n\nexport const RightDrawer: FC<RightDrawerProps> = ({\n title,\n identifier,\n children,\n header,\n closeOnOutsideClick = true,\n backButton,\n isOpen: isOpenProp,\n onClose,\n}) => {\n const { isMobile } = useDevice('md');\n const panelRef = useRef<HTMLDivElement>(null);\n const childrenContainerRef = useRef<HTMLDivElement>(null);\n const { close, open, isOpen } = useRightDrawerStore(\n useShallow((s) => ({\n close: () => s.close(identifier),\n open: () => s.open(identifier),\n isOpen: s.isOpen(identifier),\n }))\n );\n\n useScrollBlockage({\n disableScroll: isOpen,\n key: identifier ? `right_drawer_${identifier}` : 'right_drawer',\n });\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (!panelRef.current) return;\n\n // Check if drawer is open and click outside is enabled\n const isClickAble = isOpen && closeOnOutsideClick;\n // Check if click is outside the drawer panel\n const isClickOutside = !panelRef.current.contains(event.target as Node);\n // Check if event propagation has been stopped\n const isAtTopAndVisible = isElementAtTopAndNotCovered(panelRef.current);\n\n if (isClickAble && isClickOutside && isAtTopAndVisible) {\n close();\n onClose?.();\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n return () => document.removeEventListener('mousedown', handleClickOutside);\n }, [isOpen, close, onClose, closeOnOutsideClick, identifier]); // Make sure the effect runs only if isOpen or close changes\n\n useEffect(() => {\n if (isOpenProp !== undefined) {\n if (isOpenProp) {\n open();\n } else {\n close();\n onClose?.();\n }\n }\n }, [close, open, onClose, isOpenProp, identifier]);\n\n const handleSpareSpaceClick: MouseEventHandler<HTMLDivElement> = (e) => {\n // Check if the click trigger the background\n if (e.target !== e.currentTarget) {\n return;\n }\n\n if (isMobile) {\n close();\n onClose?.();\n }\n };\n\n return (\n <div className=\"fixed right-0 top-0 z-50 flex h-full justify-end\">\n <MaxWidthSmoother isHidden={!isOpen} align=\"right\">\n <Container\n className=\"text-text dark:text-text-dark relative flex h-screen w-screen flex-col md:w-[400px]\"\n ref={panelRef}\n roundedSize=\"none\"\n >\n <div className=\"flex flex-col gap-3 p-6\">\n <div className=\"flex justify-between gap-3\">\n <div>\n {backButton && (\n <button\n className=\"flex cursor-pointer flex-row items-center gap-1 text-left\"\n onClick={backButton.onBack}\n >\n <ChevronLeft />\n {backButton?.text}\n </button>\n )}\n </div>\n <X className=\"ml-auto cursor-pointer\" onClick={close} />\n </div>\n <h2 className=\"flex items-center justify-center text-lg font-bold\">\n {title}\n </h2>\n {header}\n </div>\n\n <div className=\"flex h-full flex-col overflow-y-auto p-2\">\n <div\n className=\"flex-1\"\n onClick={handleSpareSpaceClick}\n ref={childrenContainerRef}\n >\n {children}\n </div>\n </div>\n </Container>\n </MaxWidthSmoother>\n </div>\n );\n};\n"],"names":["useDevice","useRef","useRightDrawerStore","useShallow","useScrollBlockage","useEffect","isElementAtTopAndNotCovered","jsx","MaxWidthSmoother","jsxs","Container","ChevronLeft","X"],"mappings":";;;;;;;;;;;;;AAoCO,MAAM,cAAoC,CAAC;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,sBAAsB;AAAA,EACtB;AAAA,EACA,QAAQ;AAAA,EACR;AACF,MAAM;AACJ,QAAM,EAAE,SAAA,IAAaA,gBAAA,UAAU,IAAI;AAC7B,QAAA,WAAWC,kBAAuB,IAAI;AACtC,QAAA,uBAAuBA,kBAAuB,IAAI;AACxD,QAAM,EAAE,OAAO,MAAM,OAAW,IAAAC,2CAAA;AAAA,IAC9BC,QAAA,WAAW,CAAC,OAAO;AAAA,MACjB,OAAO,MAAM,EAAE,MAAM,UAAU;AAAA,MAC/B,MAAM,MAAM,EAAE,KAAK,UAAU;AAAA,MAC7B,QAAQ,EAAE,OAAO,UAAU;AAAA,IAAA,EAC3B;AAAA,EAAA;AAGcC,kDAAA;AAAA,IAChB,eAAe;AAAA,IACf,KAAK,aAAa,gBAAgB,UAAU,KAAK;AAAA,EAAA,CAClD;AAEDC,aAAAA,UAAU,MAAM;AACR,UAAA,qBAAqB,CAAC,UAAsB;AAC5C,UAAA,CAAC,SAAS,QAAS;AAGvB,YAAM,cAAc,UAAU;AAE9B,YAAM,iBAAiB,CAAC,SAAS,QAAQ,SAAS,MAAM,MAAc;AAEhE,YAAA,oBAAoBC,kCAAAA,4BAA4B,SAAS,OAAO;AAElE,UAAA,eAAe,kBAAkB,mBAAmB;AAChD;AACI;MACZ;AAAA,IAAA;AAGO,aAAA,iBAAiB,aAAa,kBAAkB;AACzD,WAAO,MAAM,SAAS,oBAAoB,aAAa,kBAAkB;AAAA,EAAA,GACxE,CAAC,QAAQ,OAAO,SAAS,qBAAqB,UAAU,CAAC;AAE5DD,aAAAA,UAAU,MAAM;AACd,QAAI,eAAe,QAAW;AAC5B,UAAI,YAAY;AACT;MAAA,OACA;AACC;AACI;MACZ;AAAA,IACF;AAAA,EAAA,GACC,CAAC,OAAO,MAAM,SAAS,YAAY,UAAU,CAAC;AAE3C,QAAA,wBAA2D,CAAC,MAAM;AAElE,QAAA,EAAE,WAAW,EAAE,eAAe;AAChC;AAAA,IACF;AAEA,QAAI,UAAU;AACN;AACI;IACZ;AAAA,EAAA;AAIA,SAAAE,2BAAAA,kBAAAA,IAAC,OAAI,EAAA,WAAU,oDACb,UAAAA,2BAAA,kBAAA,IAACC,sDAAiB,UAAU,CAAC,QAAQ,OAAM,SACzC,UAAAC,2BAAA,kBAAA;AAAA,IAACC,2BAAA;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,KAAK;AAAA,MACL,aAAY;AAAA,MAEZ,UAAA;AAAA,QAACD,2BAAAA,kBAAAA,KAAA,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,UAACA,2BAAAA,kBAAAA,KAAA,OAAA,EAAI,WAAU,8BACb,UAAA;AAAA,YAAAF,2BAAAA,kBAAAA,IAAC,SACE,UACC,cAAAE,2BAAA,kBAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,WAAW;AAAA,gBAEpB,UAAA;AAAA,kBAAAF,2BAAA,kBAAA,IAACI,YAAY,aAAA,EAAA;AAAA,kBACZ,YAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,GAGnB;AAAA,YACCJ,2BAAA,kBAAA,IAAAK,YAAA,GAAA,EAAE,WAAU,0BAAyB,SAAS,OAAO;AAAA,UAAA,GACxD;AAAA,UACCL,2BAAA,kBAAA,IAAA,MAAA,EAAG,WAAU,sDACX,UACH,OAAA;AAAA,UACC;AAAA,QAAA,GACH;AAAA,QAEAA,2BAAAA,kBAAAA,IAAC,OAAI,EAAA,WAAU,4CACb,UAAAA,2BAAA,kBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,SAAS;AAAA,YACT,KAAK;AAAA,YAEJ;AAAA,UAAA;AAAA,QAAA,GAEL;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,EAEJ,CAAA,EACF,CAAA;AAEJ;;"}

package/dist/components/RightDrawer/RightDrawer.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RightDrawer.d.ts","sourceRoot":"","sources":["../../../src/components/RightDrawer/RightDrawer.tsx"],"names":[],"mappings":"AAKA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,EAAE,EAIR,MAAM,OAAO,CAAC;~~AAQf~~,KAAK,eAAe,GAAG;IACrB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,~~CA0G5C~~,CAAC"}
1	+ {"version":3,"file":"RightDrawer.d.ts","sourceRoot":"","sources":["../../../src/components/RightDrawer/RightDrawer.tsx"],"names":[],"mappings":"AAKA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,EAAE,EAIR,MAAM,OAAO,CAAC;AASf,KAAK,eAAe,GAAG;IACrB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAgH5C,CAAC"}

package/dist/components/RightDrawer/RightDrawer.mjs CHANGED Viewed

@@ -2,6 +2,7 @@
 import { j as jsxRuntimeExports } from "../../jsx-runtime-DaNGiM0W.js";
 import { ChevronLeft, X } from "lucide-react";
 import { useRef, useEffect } from "react";
+import { u as useShallow } from "../../shallow-m9BpCkKh.js";
 import { useDevice } from "../../hooks/useDevice.mjs";
 import { useScrollBlockage } from "../../hooks/useScrollBlockage/index.mjs";
 import { isElementAtTopAndNotCovered } from "../../utils/isElementAtTopAndNotCovered.mjs";
@@ -21,10 +22,16 @@ const RightDrawer = ({
   const { isMobile } = useDevice("md");
   const panelRef = useRef(null);
   const childrenContainerRef = useRef(null);
-  const { isOpen, close, open } = useRightDrawerStore(identifier)();
+  const { close, open, isOpen } = useRightDrawerStore(
+    useShallow((s) => ({
+      close: () => s.close(identifier),
+      open: () => s.open(identifier),
+      isOpen: s.isOpen(identifier)
+    }))
+  );
   useScrollBlockage({
     disableScroll: isOpen,
-    key: identifier ? "right_drawer" : `right_drawer_${identifier}`
+    key: identifier ? `right_drawer_${identifier}` : "right_drawer"
   });
   useEffect(() => {
     const handleClickOutside = (event) => {
@@ -39,7 +46,7 @@ const RightDrawer = ({
     };
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
-  }, [isOpen, close, onClose, closeOnOutsideClick]);
+  }, [isOpen, close, onClose, closeOnOutsideClick, identifier]);
   useEffect(() => {
     if (isOpenProp !== void 0) {
       if (isOpenProp) {
@@ -49,7 +56,7 @@ const RightDrawer = ({
         onClose?.();
       }
     }
-  }, [close, open, onClose, isOpenProp]);
+  }, [close, open, onClose, isOpenProp, identifier]);
   const handleSpareSpaceClick = (e) => {
     if (e.target !== e.currentTarget) {
       return;

package/dist/components/RightDrawer/RightDrawer.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RightDrawer.mjs","sources":["../../../src/components/RightDrawer/RightDrawer.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-static-element-interactions /\n/ eslint-disable jsx-a11y/click-events-have-key-events */\n'use client';\n\nimport { ChevronLeft, X } from 'lucide-react';\nimport {\n type ReactNode,\n type FC,\n useEffect,\n useRef,\n type MouseEventHandler,\n} from 'react';\nimport { useDevice } from '../../hooks/useDevice';\nimport { useScrollBlockage } from '../../hooks/useScrollBlockage';\nimport { isElementAtTopAndNotCovered } from '../../utils/isElementAtTopAndNotCovered';\nimport { Container } from '../Container';\nimport { MaxWidthSmoother } from '../MaxWidthSmoother/index';\nimport { useRightDrawerStore } from './useRightDrawerStore';\n\ntype BackButtonProps = {\n onBack: () => void;\n text?: string;\n};\n\ntype RightDrawerProps = {\n title?: ReactNode;\n identifier: string;\n children?: ReactNode;\n header?: ReactNode;\n closeOnOutsideClick?: boolean;\n backButton?: BackButtonProps;\n isOpen?: boolean;\n onClose?: () => void;\n};\n\nexport const RightDrawer: FC<RightDrawerProps> = ({\n title,\n identifier,\n children,\n header,\n closeOnOutsideClick = true,\n backButton,\n isOpen: isOpenProp,\n onClose,\n}) => {\n const { isMobile } = useDevice('md');\n const panelRef = useRef<HTMLDivElement>(null);\n const childrenContainerRef = useRef<HTMLDivElement>(null);\n const { ~~isOpen,~~ close, open } = useRightDrawerStore(identifier)();\n\n useScrollBlockage({\n disableScroll: isOpen,\n key: identifier ? ~~'right_drawer' :~~ `right_drawer_${identifier}~~`,\~~n });\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (!panelRef.current) return;\n\n // Check if drawer is open and click outside is enabled\n const isClickAble = isOpen && closeOnOutsideClick;\n // Check if click is outside the drawer panel\n const isClickOutside = !panelRef.current.contains(event.target as Node);\n // Check if event propagation has been stopped\n const isAtTopAndVisible = isElementAtTopAndNotCovered(panelRef.current);\n\n if (isClickAble && isClickOutside && isAtTopAndVisible) {\n close();\n onClose?.();\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n return () => document.removeEventListener('mousedown', handleClickOutside);\n }, [isOpen, close, onClose, closeOnOutsideClick]); // Make sure the effect runs only if isOpen or close changes\n\n useEffect(() => {\n if (isOpenProp !== undefined) {\n if (isOpenProp) {\n open();\n } else {\n close();\n onClose?.();\n }\n }\n }, [close, open, onClose, isOpenProp]);\n\n const handleSpareSpaceClick: MouseEventHandler<HTMLDivElement> = (e) => {\n // Check if the click trigger the background\n if (e.target !== e.currentTarget) {\n return;\n }\n\n if (isMobile) {\n close();\n onClose?.();\n }\n };\n\n return (\n <div className=\"fixed right-0 top-0 z-50 flex h-full justify-end\">\n <MaxWidthSmoother isHidden={!isOpen} align=\"right\">\n <Container\n className=\"text-text dark:text-text-dark relative flex h-screen w-screen flex-col md:w-[400px]\"\n ref={panelRef}\n roundedSize=\"none\"\n >\n <div className=\"flex flex-col gap-3 p-6\">\n <div className=\"flex justify-between gap-3\">\n <div>\n {backButton && (\n <button\n className=\"flex cursor-pointer flex-row items-center gap-1 text-left\"\n onClick={backButton.onBack}\n >\n <ChevronLeft />\n {backButton?.text}\n </button>\n )}\n </div>\n <X className=\"ml-auto cursor-pointer\" onClick={close} />\n </div>\n <h2 className=\"flex items-center justify-center text-lg font-bold\">\n {title}\n </h2>\n {header}\n </div>\n\n <div className=\"flex h-full flex-col overflow-y-auto p-2\">\n <div\n className=\"flex-1\"\n onClick={handleSpareSpaceClick}\n ref={childrenContainerRef}\n >\n {children}\n </div>\n </div>\n </Container>\n </MaxWidthSmoother>\n </div>\n );\n};\n"],"names":["jsx","jsxs"],"mappings":"~~;;;;;;;;;;AAmCO~~,MAAM,cAAoC,CAAC;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,sBAAsB;AAAA,EACtB;AAAA,EACA,QAAQ;AAAA,EACR;AACF,MAAM;AACJ,QAAM,EAAE,SAAA,IAAa,UAAU,IAAI;AAC7B,QAAA,WAAW,OAAuB,IAAI;AACtC,QAAA,uBAAuB,OAAuB,IAAI;AACxD,QAAM,EAAE,QAAQ,OAAO,~~KAAS~~,IAAA,~~oBAAoB~~,~~UAAU~~;~~AAE5C~~,oBAAA;AAAA,IAChB,eAAe;AAAA,IACf,KAAK,aAAa,~~iBAAiB,~~gBAAgB,UAAU;AAAA,EAAA,~~CAC9D~~;AAED,YAAU,MAAM;AACR,UAAA,qBAAqB,CAAC,UAAsB;AAC5C,UAAA,CAAC,SAAS,QAAS;AAGvB,YAAM,cAAc,UAAU;AAE9B,YAAM,iBAAiB,CAAC,SAAS,QAAQ,SAAS,MAAM,MAAc;AAEhE,YAAA,oBAAoB,4BAA4B,SAAS,OAAO;AAElE,UAAA,eAAe,kBAAkB,mBAAmB;AAChD;AACI;MACZ;AAAA,IAAA;AAGO,aAAA,iBAAiB,aAAa,kBAAkB;AACzD,WAAO,MAAM,SAAS,oBAAoB,aAAa,kBAAkB;AAAA,~~KACxE~~,CAAC,QAAQ,OAAO,SAAS,~~mBAAmB~~,CAAC;~~AAEhD~~,YAAU,MAAM;AACd,QAAI,eAAe,QAAW;AAC5B,UAAI,YAAY;AACT;MAAA,OACA;AACC;AACI;MACZ;AAAA,IACF;AAAA,~~KACC~~,CAAC,OAAO,MAAM,SAAS,UAAU,CAAC;~~AAE/B~~,QAAA,wBAA2D,CAAC,MAAM;AAElE,QAAA,EAAE,WAAW,EAAE,eAAe;AAChC;AAAA,IACF;AAEA,QAAI,UAAU;AACN;AACI;IACZ;AAAA,EAAA;AAIA,SAAAA,kCAAAA,IAAC,OAAI,EAAA,WAAU,oDACb,UAAAA,kCAAA,IAAC,oBAAiB,UAAU,CAAC,QAAQ,OAAM,SACzC,UAAAC,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,KAAK;AAAA,MACL,aAAY;AAAA,MAEZ,UAAA;AAAA,QAACA,kCAAAA,KAAA,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,UAACA,kCAAAA,KAAA,OAAA,EAAI,WAAU,8BACb,UAAA;AAAA,YAAAD,kCAAAA,IAAC,SACE,UACC,cAAAC,kCAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,WAAW;AAAA,gBAEpB,UAAA;AAAA,kBAAAD,kCAAA,IAAC,aAAY,EAAA;AAAA,kBACZ,YAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,GAGnB;AAAA,YACCA,kCAAA,IAAA,GAAA,EAAE,WAAU,0BAAyB,SAAS,OAAO;AAAA,UAAA,GACxD;AAAA,UACCA,kCAAA,IAAA,MAAA,EAAG,WAAU,sDACX,UACH,OAAA;AAAA,UACC;AAAA,QAAA,GACH;AAAA,QAEAA,kCAAAA,IAAC,OAAI,EAAA,WAAU,4CACb,UAAAA,kCAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,SAAS;AAAA,YACT,KAAK;AAAA,YAEJ;AAAA,UAAA;AAAA,QAAA,GAEL;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,EAEJ,CAAA,EACF,CAAA;AAEJ;"}
1	+ {"version":3,"file":"RightDrawer.mjs","sources":["../../../src/components/RightDrawer/RightDrawer.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-static-element-interactions /\n/ eslint-disable jsx-a11y/click-events-have-key-events */\n'use client';\n\nimport { ChevronLeft, X } from 'lucide-react';\nimport {\n type ReactNode,\n type FC,\n useEffect,\n useRef,\n type MouseEventHandler,\n} from 'react';\nimport { useShallow } from 'zustand/react/shallow';\nimport { useDevice } from '../../hooks/useDevice';\nimport { useScrollBlockage } from '../../hooks/useScrollBlockage';\nimport { isElementAtTopAndNotCovered } from '../../utils/isElementAtTopAndNotCovered';\nimport { Container } from '../Container';\nimport { MaxWidthSmoother } from '../MaxWidthSmoother/index';\nimport { useRightDrawerStore } from './useRightDrawerStore';\n\ntype BackButtonProps = {\n onBack: () => void;\n text?: string;\n};\n\ntype RightDrawerProps = {\n title?: ReactNode;\n identifier: string;\n children?: ReactNode;\n header?: ReactNode;\n closeOnOutsideClick?: boolean;\n backButton?: BackButtonProps;\n isOpen?: boolean;\n onClose?: () => void;\n};\n\nexport const RightDrawer: FC<RightDrawerProps> = ({\n title,\n identifier,\n children,\n header,\n closeOnOutsideClick = true,\n backButton,\n isOpen: isOpenProp,\n onClose,\n}) => {\n const { isMobile } = useDevice('md');\n const panelRef = useRef<HTMLDivElement>(null);\n const childrenContainerRef = useRef<HTMLDivElement>(null);\n const { close, open, isOpen } = useRightDrawerStore(\n useShallow((s) => ({\n close: () => s.close(identifier),\n open: () => s.open(identifier),\n isOpen: s.isOpen(identifier),\n }))\n );\n\n useScrollBlockage({\n disableScroll: isOpen,\n key: identifier ? `right_drawer_${identifier}` : 'right_drawer',\n });\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (!panelRef.current) return;\n\n // Check if drawer is open and click outside is enabled\n const isClickAble = isOpen && closeOnOutsideClick;\n // Check if click is outside the drawer panel\n const isClickOutside = !panelRef.current.contains(event.target as Node);\n // Check if event propagation has been stopped\n const isAtTopAndVisible = isElementAtTopAndNotCovered(panelRef.current);\n\n if (isClickAble && isClickOutside && isAtTopAndVisible) {\n close();\n onClose?.();\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n return () => document.removeEventListener('mousedown', handleClickOutside);\n }, [isOpen, close, onClose, closeOnOutsideClick, identifier]); // Make sure the effect runs only if isOpen or close changes\n\n useEffect(() => {\n if (isOpenProp !== undefined) {\n if (isOpenProp) {\n open();\n } else {\n close();\n onClose?.();\n }\n }\n }, [close, open, onClose, isOpenProp, identifier]);\n\n const handleSpareSpaceClick: MouseEventHandler<HTMLDivElement> = (e) => {\n // Check if the click trigger the background\n if (e.target !== e.currentTarget) {\n return;\n }\n\n if (isMobile) {\n close();\n onClose?.();\n }\n };\n\n return (\n <div className=\"fixed right-0 top-0 z-50 flex h-full justify-end\">\n <MaxWidthSmoother isHidden={!isOpen} align=\"right\">\n <Container\n className=\"text-text dark:text-text-dark relative flex h-screen w-screen flex-col md:w-[400px]\"\n ref={panelRef}\n roundedSize=\"none\"\n >\n <div className=\"flex flex-col gap-3 p-6\">\n <div className=\"flex justify-between gap-3\">\n <div>\n {backButton && (\n <button\n className=\"flex cursor-pointer flex-row items-center gap-1 text-left\"\n onClick={backButton.onBack}\n >\n <ChevronLeft />\n {backButton?.text}\n </button>\n )}\n </div>\n <X className=\"ml-auto cursor-pointer\" onClick={close} />\n </div>\n <h2 className=\"flex items-center justify-center text-lg font-bold\">\n {title}\n </h2>\n {header}\n </div>\n\n <div className=\"flex h-full flex-col overflow-y-auto p-2\">\n <div\n className=\"flex-1\"\n onClick={handleSpareSpaceClick}\n ref={childrenContainerRef}\n >\n {children}\n </div>\n </div>\n </Container>\n </MaxWidthSmoother>\n </div>\n );\n};\n"],"names":["jsx","jsxs"],"mappings":";;;;;;;;;;;AAoCO,MAAM,cAAoC,CAAC;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,sBAAsB;AAAA,EACtB;AAAA,EACA,QAAQ;AAAA,EACR;AACF,MAAM;AACJ,QAAM,EAAE,SAAA,IAAa,UAAU,IAAI;AAC7B,QAAA,WAAW,OAAuB,IAAI;AACtC,QAAA,uBAAuB,OAAuB,IAAI;AACxD,QAAM,EAAE,OAAO,MAAM,OAAW,IAAA;AAAA,IAC9B,WAAW,CAAC,OAAO;AAAA,MACjB,OAAO,MAAM,EAAE,MAAM,UAAU;AAAA,MAC/B,MAAM,MAAM,EAAE,KAAK,UAAU;AAAA,MAC7B,QAAQ,EAAE,OAAO,UAAU;AAAA,IAAA,EAC3B;AAAA,EAAA;AAGc,oBAAA;AAAA,IAChB,eAAe;AAAA,IACf,KAAK,aAAa,gBAAgB,UAAU,KAAK;AAAA,EAAA,CAClD;AAED,YAAU,MAAM;AACR,UAAA,qBAAqB,CAAC,UAAsB;AAC5C,UAAA,CAAC,SAAS,QAAS;AAGvB,YAAM,cAAc,UAAU;AAE9B,YAAM,iBAAiB,CAAC,SAAS,QAAQ,SAAS,MAAM,MAAc;AAEhE,YAAA,oBAAoB,4BAA4B,SAAS,OAAO;AAElE,UAAA,eAAe,kBAAkB,mBAAmB;AAChD;AACI;MACZ;AAAA,IAAA;AAGO,aAAA,iBAAiB,aAAa,kBAAkB;AACzD,WAAO,MAAM,SAAS,oBAAoB,aAAa,kBAAkB;AAAA,EAAA,GACxE,CAAC,QAAQ,OAAO,SAAS,qBAAqB,UAAU,CAAC;AAE5D,YAAU,MAAM;AACd,QAAI,eAAe,QAAW;AAC5B,UAAI,YAAY;AACT;MAAA,OACA;AACC;AACI;MACZ;AAAA,IACF;AAAA,EAAA,GACC,CAAC,OAAO,MAAM,SAAS,YAAY,UAAU,CAAC;AAE3C,QAAA,wBAA2D,CAAC,MAAM;AAElE,QAAA,EAAE,WAAW,EAAE,eAAe;AAChC;AAAA,IACF;AAEA,QAAI,UAAU;AACN;AACI;IACZ;AAAA,EAAA;AAIA,SAAAA,kCAAAA,IAAC,OAAI,EAAA,WAAU,oDACb,UAAAA,kCAAA,IAAC,oBAAiB,UAAU,CAAC,QAAQ,OAAM,SACzC,UAAAC,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,KAAK;AAAA,MACL,aAAY;AAAA,MAEZ,UAAA;AAAA,QAACA,kCAAAA,KAAA,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,UAACA,kCAAAA,KAAA,OAAA,EAAI,WAAU,8BACb,UAAA;AAAA,YAAAD,kCAAAA,IAAC,SACE,UACC,cAAAC,kCAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,WAAW;AAAA,gBAEpB,UAAA;AAAA,kBAAAD,kCAAA,IAAC,aAAY,EAAA;AAAA,kBACZ,YAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,GAGnB;AAAA,YACCA,kCAAA,IAAA,GAAA,EAAE,WAAU,0BAAyB,SAAS,OAAO;AAAA,UAAA,GACxD;AAAA,UACCA,kCAAA,IAAA,MAAA,EAAG,WAAU,sDACX,UACH,OAAA;AAAA,UACC;AAAA,QAAA,GACH;AAAA,QAEAA,kCAAAA,IAAC,OAAI,EAAA,WAAU,4CACb,UAAAA,kCAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,SAAS;AAAA,YACT,KAAK;AAAA,YAEJ;AAAA,UAAA;AAAA,QAAA,GAEL;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,EAEJ,CAAA,EACF,CAAA;AAEJ;"}

package/dist/components/RightDrawer/useRightDrawerStore.cjs CHANGED Viewed

@@ -1,19 +1,21 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const zustand = require("zustand");
-const drawerStores = /* @__PURE__ */ new Map();
-const useRightDrawerStore = (key) => {
-  if (!drawerStores.has(key)) {
-    drawerStores.set(
-      key,
-      zustand.create((set) => ({
-        isOpen: false,
-        open: () => set({ isOpen: true }),
-        close: () => set({ isOpen: false })
-      }))
-    );
-  }
-  return drawerStores.get(key);
-};
+const useRightDrawerStore = zustand.create((set, get) => ({
+  drawers: {},
+  open: (key) => set((state) => ({
+    drawers: {
+      ...state.drawers,
+      [key]: true
+    }
+  })),
+  close: (key) => set((state) => ({
+    drawers: {
+      ...state.drawers,
+      [key]: false
+    }
+  })),
+  isOpen: (key) => get().drawers[key] ?? false
+}));
 exports.useRightDrawerStore = useRightDrawerStore;
 //# sourceMappingURL=useRightDrawerStore.cjs.map

package/dist/components/RightDrawer/useRightDrawerStore.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useRightDrawerStore.cjs","sources":["../../../src/components/RightDrawer/useRightDrawerStore.ts"],"sourcesContent":["import { create, ~~StoreApi, UseBoundStore~~ } from 'zustand';\n\ntype RightDrawerStore = {\n ~~isOpen~~: boolean;\n open: () => void;\n close: () => void;\n~~};\n\nconst~~ ~~drawerStores~~ = ~~new~~ ~~Map<\~~n ~~string,\n UseBoundStore<StoreApi<RightDrawerStore>>\n>()~~;\n\nexport const useRightDrawerStore = (~~key:~~ ~~string~~) => {\n if (~~!drawerStores.has(~~key)) {\n ~~drawerStores.~~set(~~\n key,\n create<RightDrawerStore>~~(~~(set~~) => ({\n ~~isOpen~~: ~~false~~,\n ~~open~~: ~~() => set({ isOpen:~~ true }),\n close: () => ~~set~~({ ~~isOpen~~: false }),\n }~~))\~~n );\n ~~}\n return~~ ~~drawerStores.~~get(key~~)!;\~~n};\n"],"names":["create"],"mappings":";;;~~AAQA~~,MAAM,~~mCAAmB;AAKZ~~,~~MAAA~~,~~sBAAsB~~,CAAC,~~QAAgB~~;~~AAClD~~,~~MAAI~~,CAAC,~~aAAa~~,IAAI,~~GAAG~~,~~GAAG~~;~~AACb~~,~~iBAAA~~;AAAA,~~MACX~~;AAAA,~~MACAA~~,~~QAAA~~,~~OAAyB~~,~~CAAC~~,~~SAAS~~;AAAA,~~QACjC~~,~~QAAQ~~;AAAA,~~QACR~~,~~MAAM~~,~~MAAM~~,IAAI,~~EAAE~~,~~QAAQ~~,~~MAAM~~;AAAA,~~QAChC~~,~~OAAO~~,MAAM,~~IAAI~~,~~EAAE~~,~~QAAQ~~,~~OAAO~~;AAAA,~~MAAA,EAClC~~;AAAA,~~IAAA~~;AAAA,~~EAEN;AACO~~,~~SAAA~~,~~aAAa~~,~~IAAI~~,GAAG;~~AAC7B~~;;"}
1	+ {"version":3,"file":"useRightDrawerStore.cjs","sources":["../../../src/components/RightDrawer/useRightDrawerStore.ts"],"sourcesContent":["import { create } from 'zustand';\n\ntype RightDrawerStore = {\n drawers: Record<string, boolean>;\n open: (key: string) => void;\n close: (key: string) => void;\n isOpen: (key: string) => boolean;\n};\n\nexport const useRightDrawerStore = create<RightDrawerStore>((set, get) => ({\n drawers: {},\n open: (key: string) =>\n set((state) => ({\n drawers: {\n ...state.drawers,\n [key]: true,\n },\n })),\n close: (key: string) =>\n set((state) => ({\n drawers: {\n ...state.drawers,\n [key]: false,\n },\n })),\n isOpen: (key: string) => get().drawers[key] ?? false,\n}));\n"],"names":["create"],"mappings":";;;AASO,MAAM,sBAAsBA,QAAA,OAAyB,CAAC,KAAK,SAAS;AAAA,EACzE,SAAS,CAAC;AAAA,EACV,MAAM,CAAC,QACL,IAAI,CAAC,WAAW;AAAA,IACd,SAAS;AAAA,MACP,GAAG,MAAM;AAAA,MACT,CAAC,GAAG,GAAG;AAAA,IACT;AAAA,EAAA,EACA;AAAA,EACJ,OAAO,CAAC,QACN,IAAI,CAAC,WAAW;AAAA,IACd,SAAS;AAAA,MACP,GAAG,MAAM;AAAA,MACT,CAAC,GAAG,GAAG;AAAA,IACT;AAAA,EAAA,EACA;AAAA,EACJ,QAAQ,CAAC,QAAgB,IAAM,EAAA,QAAQ,GAAG,KAAK;AACjD,EAAE;;"}

package/dist/components/RightDrawer/useRightDrawerStore.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
-import { StoreApi, UseBoundStore } from 'zustand';
 type RightDrawerStore = {
-    isOpen: boolean;
-    open: () => void;
-    close: () => void;
+    drawers: Record<string, boolean>;
+    open: (key: string) => void;
+    close: (key: string) => void;
+    isOpen: (key: string) => boolean;
 };
-export declare const useRightDrawerStore: (key: string) => UseBoundStore<StoreApi<RightDrawerStore>>;
+export declare const useRightDrawerStore: import('zustand').UseBoundStore<import('zustand').StoreApi<RightDrawerStore>>;
 export {};
 //# sourceMappingURL=useRightDrawerStore.d.ts.map