pentatrion-design 1.0.0 → 1.0.2

package/README.md

@@ -46,19 +46,27 @@ export default defineConfig({
 
 Mettre à jour le fichier `src/index.css`
 
+Configuration recommandée
+
 ```css
 /* src/index.css */
 @import "tailwindcss";
 
-@source "./node_modules/pentatrion-design/dist/lib";
 @source "./node_modules/pentatrion-design/dist/components";
-@source "./node_modules/pentatrion-design/dist/hooks";
-@source "./node_modules/pentatrion-design/dist/redux";
 
-@import "pentatrion-design/tailwind/index.css";
+@import "pentatrion-design/tailwind";
 
 /* facultatif */
 @import "pentatrion-design/tailwind/prose.css";
+
+html {
+  font-size: 16px;
+  line-height: 24px;
+  color-scheme: normal;
+}
+body {
+  @apply bg-gray-0 text-gray-7 font-sans;
+}
 ```
 
 si on désire plus de contrôle sur nos imports
@@ -67,24 +75,13 @@ si on désire plus de contrôle sur nos imports
 /* src/index.css */
 @import "tailwindcss";
 
-@source "./node_modules/pentatrion-design/dist/lib";
 @source "./node_modules/pentatrion-design/dist/components";
-@source "./node_modules/pentatrion-design/dist/hooks";
-@source "./node_modules/pentatrion-design/dist/redux";
 
+@import "pentatrion-design/tailwind/theme.css";
 @import "pentatrion-design/tailwind/variants.css";
-
-@import "pentatrion-design/tailwind/theme.css" layer(theme);
-@import "pentatrion-design/tailwind/base.css" layer(base);
-
-@import "pentatrion-design/tailwind/components-input-outline.css" layer(components);
-@import "pentatrion-design/tailwind/components-range.css" layer(components);
-@import "pentatrion-design/tailwind/components-resize-area.css" layer(components);
-@import "pentatrion-design/tailwind/components-step.css" layer(components);
-@import "pentatrion-design/tailwind/components.css" layer(components);
-
 @import "pentatrion-design/tailwind/utilities.css";
-@import "pentatrion-design/tailwind/utilities-dialog.css" layer(utilities);
+@import "pentatrion-design/tailwind/base.css" layer(base);
+@import "pentatrion-design/tailwind/components/index.css" layer(components);
 
 @import "pentatrion-design/tailwind/prose.css";
 ```
@@ -132,19 +129,6 @@ Create a `.vscode/settings.json` file
 }
 ```
 
-## Développement avec watch
-
-anciennement dans le `package.json`. plus nécessaire pour le moment
-
-```json
-{
-  "scripts": {
-    "dev:tsc": "tsc -w -p tsconfig.build.json",
-    "dev:alias": "tsc-alias -w -p tsconfig.build.json",
-    "dev": "run-p dev:tsc dev:alias",
-  }
-}
-```
 
 ## Inclure le design-system dans un autre projet sans dépendance npm
 

package/dist/components/accordion/AccordionItem.d.ts

@@ -0,0 +1,7 @@
+import { ComponentProps } from "react";
+interface Props extends ComponentProps<"div"> {
+    name: string;
+}
+export declare function AccordionItem({ name, children, ...rest }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=AccordionItem.d.ts.map

package/dist/components/accordion/AccordionItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/AccordionItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAIvC,UAAU,KAAM,SAAQ,cAAc,CAAC,KAAK,CAAC;IAC3C,IAAI,EAAE,MAAM,CAAC;CACd;AAED,wBAAgB,aAAa,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,KAAK,2CAQ/D"}

package/dist/components/accordion/AccordionItem.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useAccordion } from "./useAccordion";
+import clsx from "clsx";
+export function AccordionItem({ name, children, ...rest }) {
+    const { value } = useAccordion();
+    return (_jsx("div", { ...rest, className: clsx(value !== name && "hidden"), children: children }));
+}

package/dist/components/badge/Badge.d.ts

@@ -5,7 +5,7 @@ interface Props {
     className?: string;
     tooltip?: string;
     url?: string;
-    color?: ThemeColor;
+    color?: ThemeColor | "yellow-alpha" | "gray-alpha";
     onClick?: () => void;
     onRemove?: () => void;
 }

package/dist/components/badge/Badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAOzC,UAAU,KAAK;IACb,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,KAAK,CAAC,EACpB,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,OAAO,EACP,OAAO,EACP,GAAG,EACH,KAAgB,GACjB,EAAE,KAAK,2CA0CP"}
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAMzC,UAAU,KAAK;IACb,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,UAAU,GAAG,cAAc,GAAG,YAAY,CAAC;IACnD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,KAAK,CAAC,EACpB,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,OAAO,EACP,OAAO,EACP,GAAG,EACH,KAAgB,GACjB,EAAE,KAAK,2CAyCP"}

package/dist/components/badge/Badge.js

@@ -1,17 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import clsx from "clsx";
-import { buttonVariants } from "../button/Button";
 import { Tooltip } from "../tooltip/Tooltip";
 import { TooltipContent } from "../tooltip/TooltipContent";
 import { TooltipTrigger } from "../tooltip/TooltipTrigger";
 export function Badge({ children, className, onRemove, onClick, tooltip, url, color = "yellow", }) {
-    const badge = (_jsxs("span", { "data-color": color, className: clsx("text-body-xs w-fit rounded-full", buttonVariants({
-            variant: "contained",
-            icon: null,
-            size: null,
-            clickable: onClick !== undefined,
-            width: "custom",
-        }), className), children: [onClick ? (_jsx("button", { className: "px-2", onClick: onClick, children: children })) : (_jsx("span", { className: "px-2", children: children })), onRemove && (_jsx("button", { className: "remove rounded-r-full pr-1 pl-0.5", onClick: onRemove, children: _jsx("i", { className: "fe-cancel" }) }))] }));
+    const clickable = onClick !== undefined || url !== undefined;
+    const badge = (_jsxs("span", { "data-color": color, className: clsx("bg-custom-2/50 text-gray-text relative box-border inline-flex h-(--h-button) items-center truncate leading-5 no-underline [--h-button:1.5rem]", clickable && "cursor-pointer active:translate-y-[1px]", "text-body-xs w-fit rounded-full", className), children: [onClick ? (_jsx("button", { className: "cursor-pointer px-2", onClick: onClick, children: children })) : (_jsx("span", { className: "px-2", children: children })), onRemove && (_jsx("button", { className: "remove cursor-pointer rounded-r-full pr-1 pl-0.5 active:translate-y-[1px]", onClick: onRemove, children: _jsx("i", { className: "fe-cancel" }) }))] }));
     const wrappedBadge = url ? _jsx("a", { href: url, children: badge }) : badge;
     if (!tooltip) {
         return wrappedBadge;

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

@@ -3,7 +3,7 @@ import { ThemeColor } from "../../types";
 export interface ButtonProps extends Omit<ComponentProps<"button">, "color"> {
     withRipple?: boolean;
     variant?: "contained" | "light" | "outlined" | "text" | "ghost";
-    size?: "small" | "medium" | "large" | "custom" | "input";
+    size?: "small" | "medium" | "large" | "custom" | "input" | "scalable";
     color?: ThemeColor | "yellow-alpha" | "gray-alpha";
     width?: "fit" | "full" | "custom";
     loading?: boolean;
@@ -19,10 +19,10 @@ export interface ButtonProps extends Omit<ComponentProps<"button">, "color"> {
 }
 export declare const buttonVariants: (props?: ({
     clickable?: boolean | null | undefined;
-    size?: "small" | "input" | "medium" | "large" | "custom" | null | undefined;
+    size?: "small" | "input" | "medium" | "large" | "custom" | "scalable" | null | undefined;
     icon?: boolean | "custom" | null | undefined;
     width?: "custom" | "fit" | "full" | null | undefined;
-    variant?: "light" | "text" | "contained" | "outlined" | "ghost" | null | undefined;
+    variant?: "light" | "text" | "ghost" | "contained" | "outlined" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export declare function Button({ withRipple, variant, loading, color, size, focusable, className, disabled, children, selected, icon, asChild, width, ref, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Button.d.ts.map

package/dist/components/button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AAM/E,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAazC,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC1E,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,OAAO,CAAC,EAAE,WAAW,GAAG,OAAO,GAAG,UAAU,GAAG,MAAM,GAAG,OAAO,CAAC;IAEhE,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAEzD,KAAK,CAAC,EAAE,UAAU,GAAG,cAAc,GAAG,YAAY,CAAC;IAEnD,KAAK,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,QAAQ,CAAC;IAElC,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,GAAG,CAAC,EAAE,SAAS,CAAC,iBAAiB,CAAC,CAAC;CACpC;AAED,eAAO,MAAM,cAAc;;;;;;8EAoD1B,CAAC;AAEF,wBAAgB,MAAM,CAAC,EACrB,UAAiB,EACjB,OAAqB,EACrB,OAAe,EACf,KAAgB,EAChB,IAAe,EACf,SAAgB,EAChB,SAAS,EACT,QAAgB,EAChB,QAAQ,EACR,QAAgB,EAChB,IAAY,EACZ,OAAe,EACf,KAAa,EACb,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,2CAyDb"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AAM/E,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAazC,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC1E,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,OAAO,CAAC,EAAE,WAAW,GAAG,OAAO,GAAG,UAAU,GAAG,MAAM,GAAG,OAAO,CAAC;IAEhE,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,CAAC;IAEtE,KAAK,CAAC,EAAE,UAAU,GAAG,cAAc,GAAG,YAAY,CAAC;IAEnD,KAAK,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,QAAQ,CAAC;IAElC,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,GAAG,CAAC,EAAE,SAAS,CAAC,iBAAiB,CAAC,CAAC;CACpC;AAED,eAAO,MAAM,cAAc;;;;;;8EAqD1B,CAAC;AAEF,wBAAgB,MAAM,CAAC,EACrB,UAAiB,EACjB,OAAqB,EACrB,OAAe,EACf,KAAgB,EAChB,IAAe,EACf,SAAgB,EAChB,SAAS,EACT,QAAgB,EAChB,QAAQ,EACR,QAAgB,EAChB,IAAY,EACZ,OAAe,EACf,KAAa,EACb,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,2CAyDb"}

package/dist/components/button/Button.js

@@ -15,21 +15,22 @@ function loaderColor(color) {
             return color;
     }
 }
-export const buttonVariants = cva("relative box-border inline-flex items-center leading-5 no-underline focus-visible-has:outline-2 truncate", {
+export const buttonVariants = cva("relative box-border inline-flex items-center leading-5 no-underline focus-visible-has:outline-2", {
     variants: {
         clickable: {
             true: "cursor-pointer active:translate-y-[1px] focus-visible-has:z-10",
             false: "pointer-events-none",
         },
         size: {
-            small: "[--h-button:1.5rem] h-(--h-button)",
-            medium: "[--h-button:2rem] h-(--h-button)",
-            large: "[--h-button:3rem] h-(--h-button)",
-            input: "[--h-button:calc(var(--h-input)-2px)] h-(--h-button)",
-            custom: "",
+            small: "[--h-button:1.5rem] h-(--h-button) truncate",
+            medium: "[--h-button:2rem] h-(--h-button) truncate",
+            large: "[--h-button:3rem] h-(--h-button) truncate",
+            input: "[--h-button:calc(var(--h-input)-2px)] h-(--h-button) truncate",
+            custom: "truncate",
+            scalable: "",
         },
         icon: {
-            true: "rounded-[calc(var(--h-button)/2)] min-w-(--h-button) [&_i,&_img,&_svg]:w-(--h-button) justify-center [&_:last-child:not(i,img,svg)]:pr-4",
+            true: "rounded-[calc(var(--h-button)/2)] min-w-(--h-button) [&_i,&_img,&_svg]:w-(--h-button) justify-center [&_:last-child:not(i,img,svg,strong)]:pr-4",
             false: "rounded-2xl px-4",
             custom: "",
         },

package/dist/components/button/LinkButton.d.ts

@@ -1,4 +1,7 @@
-import { ComponentPropsWithRef } from "react";
-import { ButtonProps } from "./Button.js";
-export type LinkButtonProps = ComponentPropsWithRef<"a"> & Pick<ButtonProps, "withRipple" | "variant" | "size" | "color" | "selected" | "icon" | "disabled" | "width">;
-export declare const LinkButton: (props: import("react").ClassAttributes<HTMLAnchorElement> & import("react").AnchorHTMLAttributes<HTMLAnchorElement> & Pick<ButtonProps, "color" | "selected" | "disabled" | "size" | "width" | "icon" | "withRipple" | "variant"> & import("react").RefAttributes<HTMLAnchorElement>) => React.ReactElement | null;
+import { ComponentProps, RefObject } from "react";
+import { ButtonProps } from "./Button";
+export type HrefButtonProps = ComponentProps<"a"> & Pick<ButtonProps, "withRipple" | "variant" | "size" | "color" | "selected" | "icon" | "disabled" | "width"> & {
+    ref?: RefObject<HTMLAnchorElement>;
+};
+export declare function HrefButton({ withRipple, variant, color, size, width, className, disabled, children, selected, icon, href, ref, ...props }: HrefButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=LinkButton.d.ts.map

package/dist/components/button/LinkButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkButton.d.ts","sourceRoot":"","sources":["../../../src/components/button/LinkButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AAG/E,OAAO,EAAE,WAAW,EAAkB,MAAM,UAAU,CAAC;AAEvD,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,GAAG,CAAC,GAC/C,IAAI,CACF,WAAW,EACX,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,MAAM,GAAG,UAAU,GAAG,OAAO,CACzF,GAAG;IAAE,GAAG,CAAC,EAAE,SAAS,CAAC,iBAAiB,CAAC,CAAA;CAAE,CAAC;AAE7C,wBAAgB,UAAU,CAAC,EACzB,UAAiB,EACjB,OAAqB,EACrB,KAAgB,EAChB,IAAe,EACf,KAAa,EACb,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,QAAgB,EAChB,IAAY,EACZ,IAAI,EACJ,GAAG,EACH,GAAG,KAAK,EACT,EAAE,eAAe,2CA8BjB"}

package/dist/components/button/LinkButton.js

@@ -1,11 +1,11 @@
 import { jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useImperativeHandle, useRef } from "react";
+import { useImperativeHandle, useRef } from "react";
 import clsx from "clsx";
-import { useRipple } from "../../hooks/useRipple.js";
-import { buttonVariants } from "./Button.js";
-export const LinkButton = forwardRef(function LinkButton({ withRipple = true, variant = "contained", color = "yellow", size = "medium", width = "fit", className, disabled, children, selected = false, icon = false, href, ...props }, ref) {
+import { useRipple } from "../../hooks/useRipple";
+import { buttonVariants } from "./Button";
+export function HrefButton({ withRipple = true, variant = "contained", color = "yellow", size = "medium", width = "fit", className, disabled, children, selected = false, icon = false, href, ref, ...props }) {
     const anchorRef = useRef(null);
     useImperativeHandle(ref, () => anchorRef.current);
     const ripples = useRipple(anchorRef);
     return (_jsxs("a", { role: "button", href: href, ref: anchorRef, className: clsx(buttonVariants({ variant, size, width, icon: size === "custom" ? "custom" : icon }), className, selected && "active"), "data-color": color, "data-variant": variant, "aria-checked": selected, "aria-disabled": disabled, ...props, children: [!disabled && withRipple && ripples, children] }));
-});
+}

package/dist/components/dropdown-menu/DropdownMenu.d.ts

@@ -6,6 +6,6 @@ type DropdownMenuProps = ComponentProps<"div"> & UseDropdownMenuOptions & {
     ref?: RefObject<HTMLDivElement>;
     listClassName?: string;
 };
-export declare const DropdownMenu: ({ trigger, initialOpen, placement, open, onOpen, color, modal, style, className, listClassName, children, ref, ...props }: DropdownMenuProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DropdownMenu: ({ trigger, initialOpen, placement, open, onOpen, color, modal, presentation, style, className, listClassName, children, ref, ...props }: DropdownMenuProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=DropdownMenu.d.ts.map

package/dist/components/dropdown-menu/DropdownMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/DropdownMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG7C,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAUvC,OAAO,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAErD,KAAK,iBAAiB,GAAG,cAAc,CAAC,KAAK,CAAC,GAC5C,sBAAsB,GAAG;IACvB,OAAO,EAAE,SAAS,CAAC;IACnB,GAAG,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IAChC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEJ,eAAO,MAAM,YAAY,GAAI,2HAiB1B,iBAAiB,4CA0CnB,CAAC"}
+{"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/DropdownMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG7C,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAUvC,OAAO,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAErD,KAAK,iBAAiB,GAAG,cAAc,CAAC,KAAK,CAAC,GAC5C,sBAAsB,GAAG;IACvB,OAAO,EAAE,SAAS,CAAC;IACnB,GAAG,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IAChC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEJ,eAAO,MAAM,YAAY,GAAI,yIAkB1B,iBAAiB,4CA6CnB,CAAC"}

package/dist/components/dropdown-menu/DropdownMenu.js

@@ -7,12 +7,12 @@ import { Dialog } from "../dialog";
 import { Slot } from "../slot";
 export const DropdownMenu = ({ 
 // options
-trigger, initialOpen, placement, open, onOpen, color, modal, 
+trigger, initialOpen, placement, open, onOpen, color, modal, presentation, 
 // ComponentProps
 style, className, listClassName, children, ref, ...props }) => {
-    const options = { initialOpen, placement, open, onOpen, color, modal };
+    const options = { initialOpen, placement, open, onOpen, color, modal, presentation };
     const popover = useDropdownMenu(options);
     const floatingContext = popover.context;
     const mergedRef = useMergeRefs([popover.refs.setFloating, ref]);
-    return (_jsxs(DropdownMenuContext.Provider, { value: popover, children: [_jsx(Slot, { ref: popover.refs.setReference, "data-state": popover.open ? "open" : "closed", ...popover.getReferenceProps(), children: trigger }), popover.open && (_jsx(FloatingPortal, { children: _jsx(FloatingFocusManager, { context: floatingContext, modal: popover.modal, children: _jsx("div", { ref: mergedRef, className: clsx("z-dialog outline-hidden", className), style: { ...popover.floatingStyles, ...style }, ...popover.getFloatingProps(props), children: _jsx(Dialog, { placement: popover.placement, color: popover.color, className: "motion-safe:animate-fade-in p-1", children: _jsx("div", { className: clsx("box", listClassName), children: _jsx(FloatingList, { elementsRef: popover.elementsRef, labelsRef: popover.labelsRef, children: children }) }) }) }) }) }))] }));
+    return (_jsxs(DropdownMenuContext.Provider, { value: popover, children: [_jsx(Slot, { ref: popover.refs.setReference, "data-state": popover.open ? "open" : "closed", ...popover.getReferenceProps(), children: trigger }), popover.open && (_jsx(FloatingPortal, { children: _jsx(FloatingFocusManager, { context: floatingContext, modal: popover.modal, children: _jsx("div", { ref: mergedRef, className: clsx("z-dialog outline-hidden", className), style: { ...popover.floatingStyles, ...style }, ...popover.getFloatingProps(props), children: _jsx(Dialog, { placement: popover.placement, color: popover.color, className: clsx("motion-safe:animate-fade-in", popover.presentation === "large" && "p-1"), children: _jsx("div", { className: clsx("box", listClassName), children: _jsx(FloatingList, { elementsRef: popover.elementsRef, labelsRef: popover.labelsRef, children: children }) }) }) }) }) }))] }));
 };

package/dist/components/dropdown-menu/DropdownMenuItem.js

@@ -4,11 +4,11 @@ import clsx from "clsx";
 import { useDropdownMenuContext } from "./useDropdownMenuContext";
 import { Slot } from "../slot";
 export function DropdownMenuItem({ children, className, onClick, type, asChild = false, ...rest }) {
-    const { activeIndex, getItemProps, handleSelect } = useDropdownMenuContext();
+    const { activeIndex, getItemProps, handleSelect, presentation } = useDropdownMenuContext();
     const { ref, index } = useListItem({ label: children?.toString() });
     const isActive = activeIndex === index;
     const Comp = asChild ? Slot : "button";
-    return (_jsx(Comp, { className: clsx("option", isActive && "bg-gray-1", className), ref: ref, role: "menuitem", "data-presentation": "large", "aria-selected": isActive, tabIndex: isActive ? 0 : -1, ...getItemProps({
+    return (_jsx(Comp, { className: clsx("option", isActive && "bg-gray-1", className), ref: ref, role: "menuitem", "data-presentation": presentation, "aria-selected": isActive, tabIndex: isActive ? 0 : -1, ...getItemProps({
             ...rest,
             onClick: (e) => {
                 onClick?.(e);

package/dist/components/dropdown-menu/interface.d.ts

@@ -7,5 +7,6 @@ export interface UseDropdownMenuOptions {
     onOpen?: (open: boolean) => void;
     color?: ThemeColor;
     modal?: boolean;
+    presentation?: "compact" | "large";
 }
 //# sourceMappingURL=interface.d.ts.map

package/dist/components/dropdown-menu/interface.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interface.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/interface.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEzC,MAAM,WAAW,sBAAsB;IACrC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB"}
+{"version":3,"file":"interface.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/interface.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEzC,MAAM,WAAW,sBAAsB;IACrC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,YAAY,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;CACpC"}

package/dist/components/dropdown-menu/useDropdownMenu.d.ts

@@ -1,11 +1,12 @@
 import type { UseDropdownMenuOptions } from "./interface";
-export declare function useDropdownMenu({ initialOpen, placement, open: controlledOpen, onOpen: setControlledOpen, color, modal, }: UseDropdownMenuOptions): {
+export declare function useDropdownMenu({ initialOpen, placement, open: controlledOpen, onOpen: setControlledOpen, color, modal, presentation, }: UseDropdownMenuOptions): {
     elementsRef: import("react").RefObject<(HTMLElement | null)[]>;
     labelsRef: import("react").RefObject<(string | null)[]>;
     color: import("../../types").ThemeColor | undefined;
     modal: boolean;
     activeIndex: number | null;
     handleSelect: () => void;
+    presentation: "large" | "compact";
     placement: import("@floating-ui/react-dom").Placement;
     strategy: import("@floating-ui/react-dom").Strategy;
     middlewareData: import("@floating-ui/react-dom").MiddlewareData;

package/dist/components/dropdown-menu/useDropdownMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useDropdownMenu.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/useDropdownMenu.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAiB1D,wBAAgB,eAAe,CAAC,EAC9B,WAAmB,EACnB,SAAoB,EACpB,IAAI,EAAE,cAAc,EACpB,MAAM,EAAE,iBAAiB,EACzB,KAAK,EACL,KAAa,GACd,EAAE,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA0F2mhC,CAAC;gCAAyF,CAAC;4BAAyF,CAAC;;;;;;EADxzhC"}
+{"version":3,"file":"useDropdownMenu.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/useDropdownMenu.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAiB1D,wBAAgB,eAAe,CAAC,EAC9B,WAAmB,EACnB,SAAoB,EACpB,IAAI,EAAE,cAAc,EACpB,MAAM,EAAE,iBAAiB,EACzB,KAAK,EACL,KAAa,EACb,YAAsB,GACvB,EAAE,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA4F6xjC,CAAC;gCAAyF,CAAC;4BAAyF,CAAC;;;;;;EAD1+jC"}

package/dist/components/dropdown-menu/useDropdownMenu.js

@@ -1,7 +1,7 @@
 import { useCallback, useMemo, useRef, useState } from "react";
 import { autoUpdate, flip, offset, shift, useClick, useDismiss, useFloating, useInteractions, useListNavigation, useRole, useTypeahead, } from "@floating-ui/react";
 const arrowWidth = 12;
-export function useDropdownMenu({ initialOpen = false, placement = "bottom", open: controlledOpen, onOpen: setControlledOpen, color, modal = false, }) {
+export function useDropdownMenu({ initialOpen = false, placement = "bottom", open: controlledOpen, onOpen: setControlledOpen, color, modal = false, presentation = "large", }) {
     const [uncontrolledOpen, setUncontrolledOpen] = useState(initialOpen);
     const isUncontrolled = controlledOpen === null || controlledOpen === undefined;
     const open = isUncontrolled ? uncontrolledOpen : controlledOpen;
@@ -65,6 +65,7 @@ export function useDropdownMenu({ initialOpen = false, placement = "bottom", ope
         modal,
         activeIndex,
         handleSelect,
+        presentation,
     }), [
         open,
         setOpen,
@@ -75,5 +76,6 @@ export function useDropdownMenu({ initialOpen = false, placement = "bottom", ope
         activeIndex,
         // getItemProps,
         handleSelect,
+        presentation,
     ]);
 }

package/dist/components/dropdown-menu/useDropdownMenuContext.d.ts

@@ -8,6 +8,7 @@ export declare function useDropdownMenuContext(): {
     modal: boolean;
     activeIndex: number | null;
     handleSelect: () => void;
+    presentation: "large" | "compact";
     placement: import("@floating-ui/react-dom").Placement;
     strategy: import("@floating-ui/react-dom").Strategy;
     middlewareData: import("@floating-ui/react-dom").MiddlewareData;

package/dist/components/dropdown-menu/useDropdownMenuContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useDropdownMenuContext.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/useDropdownMenuContext.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,KAAK,WAAW,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,GAAG,IAAI,CAAC;AAE7D,eAAO,MAAM,mBAAmB,sCAAmC,CAAC;AAEpE,wBAAgB,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCASiolC,CAAC;gCAAyF,CAAC;4BAAyF,CAAC;;;;;;EAD31lC"}
+{"version":3,"file":"useDropdownMenuContext.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/useDropdownMenuContext.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,KAAK,WAAW,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,GAAG,IAAI,CAAC;AAE7D,eAAO,MAAM,mBAAmB,sCAAmC,CAAC;AAEpE,wBAAgB,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCASq3nC,CAAC;gCAAyF,CAAC;4BAAyF,CAAC;;;;;;EAD/koC"}

package/dist/components/flash/Flash.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Flash.d.ts","sourceRoot":"","sources":["../../../src/components/flash/Flash.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAIzC,UAAU,KAAK;IACb,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,KAAK,CAAC,EAAE,KAAgB,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,KAAK,2CAcrE"}
+{"version":3,"file":"Flash.d.ts","sourceRoot":"","sources":["../../../src/components/flash/Flash.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAGzC,UAAU,KAAK;IACb,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,KAAK,CAAC,EAAE,KAAgB,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,KAAK,2CAcrE"}

package/dist/components/flash/Flash.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import clsx from "clsx";
-import { colorVariants } from "../../lib/tailwindVariants";
 export function Flash({ color = "yellow", children, className }) {
-    return (_jsx("div", { className: clsx("bg-gray-0 dark:shadow-dark border-l-4 p-2 shadow-sm [&_p]:m-0", colorVariants[color].border, className), "aria-live": color !== "red" ? "polite" : "assertive", role: color !== "red" ? "status" : "alert", children: children }));
+    return (_jsx("div", { "data-color": color, className: clsx("bg-gray-0 dark:shadow-dark border-custom-3 border-l-4 p-2 shadow-sm [&_p]:m-0", className), "aria-live": color !== "red" ? "polite" : "assertive", role: color !== "red" ? "status" : "alert", children: children }));
 }

package/dist/components/form/InputField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputField.d.ts","sourceRoot":"","sources":["../../../src/components/form/InputField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkB,SAAS,EAAS,MAAM,OAAO,CAAC;AAIzD,MAAM,WAAW,eAAe;IAC9B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC7B,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,IAAI,EACJ,WAAW,EACX,MAAM,EACN,OAAO,EACP,EAAE,EAAE,UAAU,EACd,QAAQ,EACR,iBAAwB,EACxB,aAAa,EAAE,UAAU,EACzB,SAAS,GACV,EAAE,eAAe,2CAuDjB"}
+{"version":3,"file":"InputField.d.ts","sourceRoot":"","sources":["../../../src/components/form/InputField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkB,SAAS,EAAS,MAAM,OAAO,CAAC;AAIzD,MAAM,WAAW,eAAe;IAC9B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC7B,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,IAAI,EACJ,WAAW,EACX,MAAM,EACN,OAAO,EACP,EAAE,EAAE,UAAU,EACd,QAAQ,EACR,iBAAwB,EACxB,aAAa,EAAE,UAAU,EACzB,SAAS,GACV,EAAE,eAAe,2CAyDjB"}

package/dist/components/form/InputField.js

@@ -13,6 +13,7 @@ export function InputField({ label, hint, description, errors, warning, id: prov
     const color = errors ? "red" : warning ? "orange" : "yellow";
     const showLabel = preventLayerShift || label || hint;
     const showFooter = preventLayerShift || errorsElement || warningElement;
-    return (_jsxs("div", { role: "group", className: className, children: [showLabel &&
+    const testIdProp = dataTestId ? { "data-testid": `input-field-${dataTestId}` } : {};
+    return (_jsxs("div", { role: "group", className: className, ...testIdProp, children: [showLabel &&
                 (label || hint ? (_jsxs("label", { className: "mb-1 flex flex-wrap items-center justify-between", htmlFor: id, children: [labelElement, hintElement] })) : (_jsx("label", { htmlFor: id, className: "invisible" }))), description && _jsx("div", { className: "text-body-sm text-gray-6 mb-2", children: description }), _jsx(Slot, { id: id, color: color, children: children }), showFooter && (_jsx("div", { className: "text-body-sm text-gray-6 mt-1 min-h-5", children: errorsElement || warningElement }))] }));
 }

package/dist/components/input/Checkbox.d.ts

@@ -11,12 +11,13 @@ export declare function Checkbox({ color, indeterminate, disabled, className, ch
 interface CheckboxButtonProps extends Omit<ComponentProps<"input">, "size"> {
     disabled?: boolean;
     color?: ButtonProps["color"];
-    variant?: "contained" | "light" | "outlined" | "text" | "ghost";
-    size?: "small" | "medium" | "large" | "custom";
-    width?: "fit" | "full" | "custom";
+    variant?: ButtonProps["variant"];
+    size?: ButtonProps["size"];
+    width?: ButtonProps["width"];
     icon?: boolean;
+    showInput?: boolean;
     ref?: RefObject<HTMLInputElement>;
 }
-export declare function CheckboxButton({ color, disabled, width, size, icon, variant, className, children, ref, ...rest }: CheckboxButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function CheckboxButton({ color, disabled, width, size, icon, showInput, variant, className, children, ref, ...rest }: CheckboxButtonProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=Checkbox.d.ts.map

package/dist/components/input/Checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/input/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,OAAO,EAAE,WAAW,EAAkB,MAAM,WAAW,CAAC;AAExD,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,OAAO,CAAC;IAC5D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,GAAG,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;CACnC;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAgB,EAChB,aAAa,EACb,QAAgB,EAChB,SAAS,EACT,QAAQ,EACR,GAAG,EACH,GAAG,IAAI,EACR,EAAE,aAAa,2CAmBf;AAED,UAAU,mBAAoB,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IACzE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,WAAW,GAAG,OAAO,GAAG,UAAU,GAAG,MAAM,GAAG,OAAO,CAAC;IAChE,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;IAC/C,KAAK,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,QAAQ,CAAC;IAClC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,GAAG,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;CACnC;AACD,wBAAgB,cAAc,CAAC,EAC7B,KAAgB,EAChB,QAAgB,EAChB,KAAa,EACb,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,SAAS,EACT,QAAQ,EACR,GAAG,EACH,GAAG,IAAI,EACR,EAAE,mBAAmB,2CAiBrB"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/input/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,OAAO,EAAE,WAAW,EAAkB,MAAM,WAAW,CAAC;AAExD,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,OAAO,CAAC;IAC5D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,GAAG,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;CACnC;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAgB,EAChB,aAAa,EACb,QAAgB,EAChB,SAAS,EACT,QAAQ,EACR,GAAG,EACH,GAAG,IAAI,EACR,EAAE,aAAa,2CAmBf;AAED,UAAU,mBAAoB,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IACzE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACjC,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;IAC7B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,GAAG,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;CACnC;AACD,wBAAgB,cAAc,CAAC,EAC7B,KAAgB,EAChB,QAAgB,EAChB,KAAa,EACb,IAAI,EACJ,IAAI,EACJ,SAAS,EACT,OAAO,EACP,SAAS,EACT,QAAQ,EACR,GAAG,EACH,GAAG,IAAI,EACR,EAAE,mBAAmB,2CA2BrB"}

package/dist/components/input/Checkbox.js

@@ -4,6 +4,10 @@ import { buttonVariants } from "../button";
 export function Checkbox({ color = "yellow", indeterminate, disabled = false, className, children, ref, ...rest }) {
     return (_jsxs("label", { "aria-disabled": disabled, className: clsx("flex cursor-pointer items-center"), children: [_jsx("input", { "data-color": color, ref: ref, disabled: disabled, type: "checkbox", className: clsx("p8n-input-checkbox", "my-1 mr-2 inline-block h-6 w-6 shrink-0 cursor-pointer appearance-none rounded-sm bg-origin-border p-0 outline-offset-0 select-none", indeterminate && "indeterminate", className), ...rest }), children] }));
 }
-export function CheckboxButton({ color = "yellow", disabled = false, width = "fit", size, icon, variant, className, children, ref, ...rest }) {
-    return (_jsxs("label", { "aria-disabled": disabled, className: clsx(className, buttonVariants({ variant, size, icon, width })), "data-color": color, children: [_jsx("input", { ref: ref, disabled: disabled, type: "checkbox", className: "h-0 w-0 -translate-x-[9999px] overflow-hidden", ...rest }), children] }));
+export function CheckboxButton({ color = "yellow", disabled = false, width = "fit", size, icon, showInput, variant, className, children, ref, ...rest }) {
+    return (_jsxs("label", { "aria-disabled": disabled, className: clsx(className, showInput && "pr-2 pl-1", buttonVariants({ variant, size, icon: icon || showInput, width })), "data-color": color, children: [_jsx("input", { ref: ref, disabled: disabled, type: "checkbox", className: clsx(showInput
+                    ? "p8n-input-checkbox my-1 mr-2 inline-block h-6 w-6 shrink-0 cursor-pointer appearance-none rounded-2xl bg-origin-border p-0 outline-offset-0 select-none"
+                    : "h-0 w-0 -translate-x-[9999px] overflow-hidden", 
+                //indeterminate && "indeterminate",
+                className), ...rest }), children] }));
 }

package/dist/components/input/Color.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Color.d.ts","sourceRoot":"","sources":["../../../src/components/input/Color.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AAC/E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAI9C,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAC,QAAQ,CAAC;IAC1D,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,SAAS,CAAC,iBAAiB,CAAC,CAAC;CACpC;AAED,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,UAAiB,EACjB,KAAgB,EAChB,KAAK,EACL,SAAiB,EACjB,SAAS,EACT,GAAG,EACH,GAAG,IAAI,EACR,EAAE,UAAU,2CAgCZ"}
+{"version":3,"file":"Color.d.ts","sourceRoot":"","sources":["../../../src/components/input/Color.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AAC/E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAI9C,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAC,QAAQ,CAAC;IAC1D,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,SAAS,CAAC,iBAAiB,CAAC,CAAC;CACpC;AAED,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,UAAiB,EACjB,KAAgB,EAChB,KAAK,EACL,SAAiB,EACjB,SAAS,EACT,GAAG,EACH,GAAG,IAAI,EACR,EAAE,UAAU,2CAuCZ"}

package/dist/components/input/Color.js

@@ -7,5 +7,5 @@ export function Color({ value, withRipple = true, color = "yellow", label, showV
     const buttonRef = useRef(null);
     useImperativeHandle(ref, () => buttonRef.current);
     const ripples = useRipple(buttonRef);
-    return (_jsxs("button", { ref: buttonRef, "data-color": color, className: "p8n-input-text relative flex h-8 overflow-clip rounded-2xl p-1 outline-offset-[-1px]", ...rest, children: [withRipple && ripples, _jsx("span", { className: clsx("flex h-full items-center justify-center rounded-2xl px-2", valueToShow === null && "min-w-12", className), style: { backgroundColor: value }, children: valueToShow })] }));
+    return (_jsxs("button", { ref: buttonRef, "data-color": color, className: "p8n-input-text group relative flex h-8 cursor-pointer overflow-clip rounded-2xl p-1 outline-offset-[-1px] active:translate-y-[1px]", ...rest, children: [withRipple && ripples, _jsx("span", { className: clsx("absolute inset-1 flex items-center justify-center rounded-2xl transition-transform group-hover:scale-150", valueToShow === null && "min-w-12", className), style: { backgroundColor: value } }), _jsx("span", { className: clsx("relative flex h-full items-center justify-center px-2", valueToShow === null && "min-w-12", className), children: valueToShow })] }));
 }

package/dist/components/input/TotpInput.d.ts

@@ -5,7 +5,8 @@ interface TotpInputProps {
     type?: "number" | "alphabet";
     autoFocus?: boolean;
     autoComplete?: "one-time-code";
+    name?: string;
 }
-export declare function TotpInput({ value, length, onValue, type, autoFocus, }: TotpInputProps): import("react/jsx-runtime").JSX.Element;
+export declare function TotpInput({ value, length, onValue, type, autoFocus, name, }: TotpInputProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=TotpInput.d.ts.map

package/dist/components/input/TotpInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TotpInput.d.ts","sourceRoot":"","sources":["../../../src/components/input/TotpInput.tsx"],"names":[],"mappings":"AAIA,UAAU,cAAc;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,IAAI,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,eAAe,CAAC;CAChC;AAWD,wBAAgB,SAAS,CAAC,EACxB,KAAU,EACV,MAAM,EACN,OAAO,EACP,IAAiB,EACjB,SAAS,GACV,EAAE,cAAc,2CAsIhB"}
+{"version":3,"file":"TotpInput.d.ts","sourceRoot":"","sources":["../../../src/components/input/TotpInput.tsx"],"names":[],"mappings":"AAIA,UAAU,cAAc;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,IAAI,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,eAAe,CAAC;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAWD,wBAAgB,SAAS,CAAC,EACxB,KAAU,EACV,MAAM,EACN,OAAO,EACP,IAAiB,EACjB,SAAS,EACT,IAAI,GACL,EAAE,cAAc,2CAuIhB"}

package/dist/components/input/TotpInput.js

@@ -9,7 +9,7 @@ const getIsValidValue = (value, type) => {
     }
     return /[0-9A-Za-z]/.test(value);
 };
-export function TotpInput({ value = "", length, onValue, type = "alphabet", autoFocus, }) {
+export function TotpInput({ value = "", length, onValue, type = "alphabet", autoFocus, name, }) {
     const list = useMemo(() => Array.from({ length }), [length]);
     const splitValues = value.split("");
     const values = list.map((_, i) => {
@@ -51,7 +51,7 @@ export function TotpInput({ value = "", length, onValue, type = "alphabet", auto
             // trim only for replacing ' ' with ''
             const value = values[i].trim();
             const isValidValue = getIsValidValue(value, type);
-            return (_jsx(Fragment, { children: _jsx(Input, { size: "custom", autoFocus: i === focusIndex ? autoFocus : undefined, type: type === "number" ? "tel" : "text", inputMode: type === "number" ? "numeric" : undefined, className: clsx("2sm:w-16 h-(--h-input) w-12 shrink-0 p-0 [--h-input:72px]"), inputClassName: "text-center text-body-3xl", autoCapitalize: "off", autoCorrect: "off", spellCheck: "false", ref: (ref) => {
+            return (_jsx(Fragment, { children: _jsx(Input, { name: name ? `${name}-chars[${i}]` : undefined, size: "custom", autoFocus: i === focusIndex ? autoFocus : undefined, type: type === "number" ? "tel" : "text", inputMode: type === "number" ? "numeric" : undefined, className: clsx("2sm:w-16 h-(--h-input) w-12 shrink-0 p-0 [--h-input:72px]"), inputClassName: "text-center text-body-3xl", autoCapitalize: "none", autoCorrect: "off", spellCheck: "false", ref: (ref) => {
                         refArray.current[i] = ref;
                     }, value: value, onFocus: (event) => {
                         event.currentTarget.select();

package/dist/components/loader/Loader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Loader.d.ts","sourceRoot":"","sources":["../../../src/components/loader/Loader.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,wBAAwB,EAAE,SAAS,EAAS,MAAM,OAAO,CAAC;AAClF,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAIzC,UAAU,KAAM,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IACrD,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAC;IAC9C,KAAK,CAAC,EAAE,UAAU,GAAG,QAAQ,CAAC;IAC9B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;CACtC;AA0BD,wBAAgB,MAAM,CAAC,EACrB,IAAe,EACf,KAAc,EACd,OAAc,EACd,SAAS,EACT,QAAqB,EACrB,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,KAAK,2CAuCP"}
+{"version":3,"file":"Loader.d.ts","sourceRoot":"","sources":["../../../src/components/loader/Loader.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,wBAAwB,EAAE,SAAS,EAAS,MAAM,OAAO,CAAC;AAClF,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAGzC,UAAU,KAAM,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IACrD,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAC;IAC9C,KAAK,CAAC,EAAE,UAAU,GAAG,QAAQ,CAAC;IAC9B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;CACtC;AA0BD,wBAAgB,MAAM,CAAC,EACrB,IAAe,EACf,KAAc,EACd,OAAc,EACd,SAAS,EACT,QAAqB,EACrB,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,KAAK,2CAwCP"}

package/dist/components/loader/Loader.js

@@ -1,7 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useId } from "react";
 import clsx from "clsx";
-import { colorVariants } from "../../lib/tailwindVariants";
 const sizeConfig = {
     small: "[--h-button:1.5rem]",
     medium: "[--h-button:2rem]",
@@ -25,5 +24,5 @@ const circleStyle = {
 };
 export function Loader({ size = "medium", color = "blue", loading = true, className, position = "relative", children, ...rest }) {
     const id = useId();
-    return (_jsxs("div", { className: clsx("inline-block h-(--h-button) w-(--h-button)", position, sizeConfig[size], className), ...rest, children: [loading && (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", className: clsx("inline-block h-(--h-button) w-(--h-button)", color !== "custom" && colorVariants[color].text), viewBox: "0 0 16 16", children: [_jsx("defs", { children: _jsx("circle", { id: id, cx: "8", cy: "8", r: "7" }) }), _jsx("use", { href: `#${id}`, className: "fill-none stroke-current opacity-25", style: trackStyle }), _jsx("use", { href: `#${id}`, className: "animate-loader-stroke fill-none stroke-current", style: circleStyle })] })), children && (_jsx("div", { className: "absolute top-0 left-0 inline-flex h-(--h-button) w-(--h-button) items-center justify-center", children: children }))] }));
+    return (_jsxs("div", { "data-color": color, className: clsx("inline-block h-(--h-button) w-(--h-button)", position, sizeConfig[size], className), ...rest, children: [loading && (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", className: clsx("inline-block h-(--h-button) w-(--h-button)", color !== "custom" && "text-custom-4"), viewBox: "0 0 16 16", children: [_jsx("defs", { children: _jsx("circle", { id: id, cx: "8", cy: "8", r: "7" }) }), _jsx("use", { href: `#${id}`, className: "fill-none stroke-current opacity-25", style: trackStyle }), _jsx("use", { href: `#${id}`, className: "animate-loader-stroke fill-none stroke-current", style: circleStyle })] })), children && (_jsx("div", { className: "absolute top-0 left-0 inline-flex h-(--h-button) w-(--h-button) items-center justify-center", children: children }))] }));
 }

package/dist/components/media-preview/util.d.ts

@@ -1,3 +1,3 @@
 import { BasicMedia, BasicMediaImage } from "./types";
-export declare function isMediaImage(media: BasicMedia | null): media is BasicMediaImage;
+export declare function isMediaImage(media: BasicMedia | null | undefined): media is BasicMediaImage;
 //# sourceMappingURL=util.d.ts.map

package/dist/components/media-preview/util.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../src/components/media-preview/util.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAEtD,wBAAgB,YAAY,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,GAAG,KAAK,IAAI,eAAe,CAQ/E"}
+{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../src/components/media-preview/util.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAEtD,wBAAgB,YAAY,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,GAAG,SAAS,GAAG,KAAK,IAAI,eAAe,CAQ3F"}

package/dist/components/modal/ModalContent.d.ts

@@ -1,7 +1,8 @@
 import { ComponentProps, RefObject } from "react";
 interface Props extends ComponentProps<"div"> {
     ref?: RefObject<HTMLInputElement>;
+    zClassName?: string;
 }
-export declare function ModalContent({ style, className, children, ref, ...props }: Props): import("react/jsx-runtime").JSX.Element | null;
+export declare function ModalContent({ zClassName, style, className, children, ref, ...props }: Props): import("react/jsx-runtime").JSX.Element | null;
 export {};
 //# sourceMappingURL=ModalContent.d.ts.map

package/dist/components/modal/ModalContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalContent.d.ts","sourceRoot":"","sources":["../../../src/components/modal/ModalContent.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKlD,UAAU,KAAM,SAAQ,cAAc,CAAC,KAAK,CAAC;IAC3C,GAAG,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;CACnC;AAED,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,kDA8BhF"}
+{"version":3,"file":"ModalContent.d.ts","sourceRoot":"","sources":["../../../src/components/modal/ModalContent.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKlD,UAAU,KAAM,SAAQ,cAAc,CAAC,KAAK,CAAC;IAC3C,GAAG,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,YAAY,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,kDAiC5F"}

package/dist/components/modal/ModalContent.js

@@ -3,12 +3,12 @@ import { FloatingFocusManager, FloatingOverlay, FloatingPortal, useMergeRefs, }
 import { useModalContext } from "./useModalContext";
 import clsx from "clsx";
 import { Dialog } from "../dialog/Dialog";
-export function ModalContent({ style, className, children, ref, ...props }) {
+export function ModalContent({ zClassName, style, className, children, ref, ...props }) {
     const context = useModalContext();
     const floatingContext = context.context;
     const mergedRef = useMergeRefs([context.refs.setFloating, ref]);
     if (!context.open) {
         return null;
     }
-    return (_jsx(FloatingPortal, { children: _jsx(FloatingOverlay, { className: "flex-center z-overlay bg-gray-7/40 motion-safe:animate-fade-in-opacity", lockScroll: true, children: _jsx(FloatingFocusManager, { context: floatingContext, children: _jsx(Dialog, { color: context.color, className: clsx("motion-safe:animate-fade-in mx-4", className), style: style, "aria-labelledby": context.labelId, "aria-describedby": context.descriptionId, ...context.getFloatingProps(props), children: _jsx("div", { ref: mergedRef, children: children }) }) }) }) }));
+    return (_jsx(FloatingPortal, { children: _jsx(FloatingOverlay, { className: clsx("flex-center bg-gray-7/40 motion-safe:animate-fade-in-opacity", zClassName ?? "z-overlay"), lockScroll: true, children: _jsx(FloatingFocusManager, { context: floatingContext, children: _jsx(Dialog, { color: context.color, className: clsx("motion-safe:animate-fade-in mx-4", className), style: style, "aria-labelledby": context.labelId, "aria-describedby": context.descriptionId, ...context.getFloatingProps(props), children: _jsx("div", { ref: mergedRef, children: children }) }) }) }) }));
 }

package/dist/components/modal/useModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useModal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/useModal.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAqB,MAAM,OAAO,CAAC;AACpE,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAG3C,wBAAgB,QAAQ,CAAC,EACvB,WAAmB,EACnB,IAAI,EAAE,cAAc,EACpB,MAAM,EAAE,iBAAiB,EACzB,KAAK,GACN,GAAE,YAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCAuC+vjC,CAAC;gCAAyF,CAAC;4BAAyF,CAAC;;;;;;EADv8jC"}
+{"version":3,"file":"useModal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/useModal.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAqB,MAAM,OAAO,CAAC;AACpE,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAG3C,wBAAgB,QAAQ,CAAC,EACvB,WAAmB,EACnB,IAAI,EAAE,cAAc,EACpB,MAAM,EAAE,iBAAiB,EACzB,KAAK,GACN,GAAE,YAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCAuCm/lC,CAAC;gCAAyF,CAAC;4BAAyF,CAAC;;;;;;EAD3rmC"}

package/dist/components/modal/useModalContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useModalContext.d.ts","sourceRoot":"","sources":["../../../src/components/modal/useModalContext.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,KAAK,WAAW,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,GAAG,IAAI,CAAC;AAEtD,eAAO,MAAM,YAAY,sCAAmC,CAAC;AAE7D,wBAAgB,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCASgslC,CAAC;gCAAyF,CAAC;4BAAyF,CAAC;;;;;;EADn5lC"}
+{"version":3,"file":"useModalContext.d.ts","sourceRoot":"","sources":["../../../src/components/modal/useModalContext.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,KAAK,WAAW,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,GAAG,IAAI,CAAC;AAEtD,eAAO,MAAM,YAAY,sCAAmC,CAAC;AAE7D,wBAAgB,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCASo7nC,CAAC;gCAAyF,CAAC;4BAAyF,CAAC;;;;;;EADvooC"}