@g4rcez/components 5.0.1 → 5.0.3

package/dist/components/core/slot.jsx

@@ -0,0 +1,156 @@
+import * as React from "react";
+const REACT_LAZY_TYPE = Symbol.for("react.lazy");
+function setRef(ref, value) {
+    if (typeof ref === "function") {
+        return ref(value);
+    }
+    else if (ref !== null && ref !== undefined) {
+        ref.current = value;
+    }
+}
+function composeRefs(...refs) {
+    return (node) => {
+        let hasCleanup = false;
+        const cleanups = refs.map((ref) => {
+            const cleanup = setRef(ref, node);
+            if (!hasCleanup && typeof cleanup == "function") {
+                hasCleanup = true;
+            }
+            return cleanup;
+        });
+        if (hasCleanup) {
+            return () => {
+                for (let i = 0; i < cleanups.length; i++) {
+                    const cleanup = cleanups[i];
+                    if (typeof cleanup == "function") {
+                        cleanup();
+                    }
+                    else {
+                        setRef(refs[i], null);
+                    }
+                }
+            };
+        }
+    };
+}
+const use = React[" use ".trim().toString()];
+function isPromiseLike(value) {
+    return typeof value === "object" && value !== null && "then" in value;
+}
+function isLazyComponent(element) {
+    return (element != null &&
+        typeof element === "object" &&
+        "$$typeof" in element &&
+        element.$$typeof === REACT_LAZY_TYPE &&
+        "_payload" in element &&
+        isPromiseLike(element._payload));
+}
+export function createSlot(ownerName) {
+    const SlotClone = createSlotClone(ownerName);
+    const Slot = React.forwardRef((props, forwardedRef) => {
+        let { children, ...slotProps } = props;
+        if (isLazyComponent(children) && typeof use === "function") {
+            children = use(children._payload);
+        }
+        const childrenArray = React.Children.toArray(children);
+        const slottable = childrenArray.find(isSlottable);
+        if (slottable) {
+            // the new element to render is the one passed as a child of `Slottable`
+            const newElement = slottable.props.children;
+            const newChildren = childrenArray.map((child) => {
+                if (child === slottable) {
+                    // because the new element will be the one rendered, we are only interested
+                    // in grabbing its children (`newElement.props.children`)
+                    if (React.Children.count(newElement) > 1)
+                        return React.Children.only(null);
+                    return React.isValidElement(newElement) ? newElement.props.children : null;
+                }
+                else {
+                    return child;
+                }
+            });
+            return (<SlotClone {...slotProps} ref={forwardedRef}>
+                    {React.isValidElement(newElement) ? React.cloneElement(newElement, undefined, newChildren) : null}
+                </SlotClone>);
+        }
+        return (<SlotClone {...slotProps} ref={forwardedRef}>
+                {children}
+            </SlotClone>);
+    });
+    Slot.displayName = `${ownerName}.Slot`;
+    return Slot;
+}
+export const Slot = createSlot("Slot");
+function createSlotClone(ownerName) {
+    const SlotClone = React.forwardRef((props, forwardedRef) => {
+        let { children, ...slotProps } = props;
+        if (isLazyComponent(children) && typeof use === "function") {
+            children = use(children._payload);
+        }
+        if (React.isValidElement(children)) {
+            const childrenRef = getElementRef(children);
+            const props = mergeProps(slotProps, children.props);
+            // do not pass ref to React.Fragment for React 19 compatibility
+            if (children.type !== React.Fragment) {
+                props.ref = forwardedRef ? composeRefs(forwardedRef, childrenRef) : childrenRef;
+            }
+            return React.cloneElement(children, props);
+        }
+        return React.Children.count(children) > 1 ? React.Children.only(null) : null;
+    });
+    SlotClone.displayName = `${ownerName}.SlotClone`;
+    return SlotClone;
+}
+const SLOTTABLE_IDENTIFIER = Symbol("radix.slottable");
+export function createSlottable(ownerName) {
+    const Slottable = ({ children }) => {
+        return <>{children}</>;
+    };
+    Slottable.displayName = `${ownerName}.Slottable`;
+    Slottable.__radixId = SLOTTABLE_IDENTIFIER;
+    return Slottable;
+}
+const Slottable = createSlottable("Slottable");
+function isSlottable(child) {
+    return (React.isValidElement(child) && typeof child.type === "function" && "__radixId" in child.type && child.type.__radixId === SLOTTABLE_IDENTIFIER);
+}
+function mergeProps(slotProps, childProps) {
+    const overrideProps = { ...childProps };
+    for (const propName in childProps) {
+        const slotPropValue = slotProps[propName];
+        const childPropValue = childProps[propName];
+        const isHandler = /^on[A-Z]/.test(propName);
+        if (isHandler) {
+            if (slotPropValue && childPropValue) {
+                overrideProps[propName] = (...args) => {
+                    const result = childPropValue(...args);
+                    slotPropValue(...args);
+                    return result;
+                };
+            }
+            else if (slotPropValue) {
+                overrideProps[propName] = slotPropValue;
+            }
+        }
+        else if (propName === "style") {
+            overrideProps[propName] = { ...slotPropValue, ...childPropValue };
+        }
+        else if (propName === "className") {
+            overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(" ");
+        }
+    }
+    return { ...slotProps, ...overrideProps };
+}
+function getElementRef(element) {
+    let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get;
+    let mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
+    if (mayWarn) {
+        return element.ref;
+    }
+    getter = Object.getOwnPropertyDescriptor(element, "ref")?.get;
+    mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
+    if (mayWarn) {
+        return element.props.ref;
+    }
+    return element.props.ref || element.ref;
+}

package/dist/components/core/tag.d.ts

@@ -0,0 +1,35 @@
+import React from "react";
+import { CvaVariants, Label } from "../../types";
+import { PolymorphicProps } from "./polymorph";
+declare const variants: {
+    size: {
+        icon: string;
+        big: string;
+        default: string;
+        tiny: string;
+        small: string;
+    };
+    theme: {
+        custom: string;
+        info: string;
+        warn: string;
+        muted: string;
+        danger: string;
+        disabled: string;
+        primary: string;
+        success: string;
+        neutral: string;
+        secondary: string;
+        loading: string;
+    };
+};
+type Variants = CvaVariants<typeof variants>;
+type Themes = NonNullable<Variants["theme"]>;
+export type TagProps<T extends React.ElementType = "span"> = PolymorphicProps<CvaVariants<typeof variants> & Partial<{
+    icon: Label;
+    loading: boolean;
+    indicator: Themes | true;
+}>, T>;
+export declare const Tag: <T extends React.ElementType = "span">(_: TagProps<T>) => React.ReactNode;
+export {};
+//# sourceMappingURL=tag.d.ts.map

package/dist/components/core/tag.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../src/components/core/tag.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;CAqBb,CAAC;AAEF,KAAK,QAAQ,GAAG,WAAW,CAAC,OAAO,QAAQ,CAAC,CAAC;AAE7C,KAAK,MAAM,GAAG,WAAW,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;AAyB7C,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,IAAI,gBAAgB,CACzE,WAAW,CAAC,OAAO,QAAQ,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,OAAO,EAAE,OAAO,CAAC;IAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,CAAC,EACnG,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,GAAG,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,EAAE,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAwBQ,CAAC"}

package/dist/components/core/tag.js

@@ -1,6 +1,6 @@
 import { t as e } from "../../dom-Bn4wY_Zx.js";
 import { t } from "../../dist-NmFtbuK4.js";
-import { t as n } from "../../polymorph-BLXhrn9n.js";
+import { Polymorph as n } from "./polymorph.js";
 import { forwardRef as r } from "react";
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/components/core/tag.tsx

package/dist/components/core/tag.jsx

@@ -0,0 +1,53 @@
+import { cva } from "class-variance-authority";
+import React, { forwardRef } from "react";
+import { css } from "../../lib/dom";
+import { Polymorph } from "./polymorph";
+const variants = {
+    size: {
+        icon: "p-tag-padding-icon",
+        big: "h-tag-height-big px-tag-padding-x-big py-tag-padding-y-big",
+        default: "h-tag-height px-tag-padding-x py-tag-padding-y",
+        tiny: "h-tag-height-tiny px-tag-padding-x-tiny py-tag-padding-y-tiny text-typography-xs",
+        small: "h-tag-height-small px-tag-padding-x-small py-tag-padding-y-small text-typography-sm",
+    },
+    theme: {
+        custom: "",
+        info: "bg-tag-info-bg text-tag-info-text",
+        warn: "bg-tag-warn-bg text-tag-warn-text",
+        muted: "bg-tag-muted-bg text-tag-muted-text",
+        danger: "bg-tag-danger-bg text-tag-danger-text",
+        disabled: "bg-disabled duration-700 opacity-70",
+        primary: "bg-tag-primary-bg text-tag-primary-text",
+        success: "bg-tag-success-bg text-tag-success-text",
+        neutral: "bg-transparent border border-card-border",
+        secondary: "bg-tag-secondary-bg text-tag-secondary-text",
+        loading: "animate-pulse bg-disabled duration-700 opacity-70",
+    },
+};
+const indicatorVariant = cva("aspect-square size-tag-indicator-size rounded-full border-0", {
+    variants: {
+        theme: {
+            info: "bg-info",
+            warn: "bg-warn",
+            muted: "bg-muted",
+            danger: "bg-danger",
+            neutral: "bg-muted",
+            primary: "bg-primary",
+            success: "bg-success",
+            secondary: "bg-secondary",
+        },
+    },
+});
+const tagVariants = cva("inline-flex items-center justify-center gap-tag-gap whitespace-nowrap rounded-tag-radius border-0 align-middle transition-all duration-300 ease-linear", {
+    variants,
+    defaultVariants: { theme: "primary", size: "default" },
+});
+export const Tag = forwardRef(function Tag({ className, indicator = undefined, icon, loading, theme, size, ...props }, ref) {
+    return (<Polymorph {...props} ref={ref} data-theme={theme} data-component="tag" as={props.as ?? "span"} className={css(tagVariants({ size, theme: loading ? "loading" : theme }), className)}>
+            {indicator ? (<span aria-hidden="true" className={indicatorVariant({
+                theme: indicator === true ? theme : indicator,
+            })}/>) : null}
+            {icon}
+            {props.children}
+        </Polymorph>);
+});

package/dist/components/core/typography.d.ts

@@ -0,0 +1,25 @@
+import type { PropsWithChildren } from "react";
+import React, { type ComponentProps } from "react";
+import { Label } from "../../types";
+export declare const Paragraph: (props: ComponentProps<"p">) => React.JSX.Element;
+export declare const Description: (props: ComponentProps<"p">) => React.JSX.Element;
+export type InfoProps = {
+    info?: Label;
+    label: Label;
+    row?: boolean;
+    disabled?: Label;
+    className?: string;
+    infoDescription?: string;
+};
+export declare const Info: (props: React.PropsWithChildren<InfoProps>) => React.JSX.Element;
+export declare const PageTitle: (props: PropsWithChildren<{
+    title: string;
+}>) => React.JSX.Element;
+type PageHeaderProps = {
+    title: string;
+    description: Label;
+    containerProps?: React.ComponentProps<"header">;
+};
+export declare const PageHeader: (props: PropsWithChildren<PageHeaderProps>) => React.JSX.Element;
+export {};
+//# sourceMappingURL=typography.d.ts.map

package/dist/components/core/typography.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../../../src/components/core/typography.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,eAAO,MAAM,SAAS,GAAI,OAAO,cAAc,CAAC,GAAG,CAAC,sBAA2F,CAAC;AAEhJ,eAAO,MAAM,WAAW,GAAI,OAAO,cAAc,CAAC,GAAG,CAAC,sBAErD,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,KAAK,EAAE,KAAK,CAAC;IACb,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,IAAI,GAAI,OAAO,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,sBAO7D,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,OAAO,iBAAiB,CAAC;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,sBAKpE,CAAC;AAEF,KAAK,eAAe,GAAG;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,KAAK,CAAC;IACnB,cAAc,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;CACnD,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,iBAAiB,CAAC,eAAe,CAAC,sBAUnE,CAAC"}

package/dist/components/core/typography.js

@@ -0,0 +1,40 @@
+import { t as e } from "../../dom-Bn4wY_Zx.js";
+import "react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/core/typography.tsx
+var r = (n) => /* @__PURE__ */ t("p", {
+	...n,
+	className: e("text-typography-base leading-snug", n.className)
+}), i = (n) => /* @__PURE__ */ t("p", {
+	...n,
+	className: e("mb-kilo text-typography-sm text-secondary", n.className)
+}), a = (r) => /* @__PURE__ */ n("div", {
+	className: e(`flex ${r.row ? "flex-row items-center" : "flex-col"} gap-info-gap`, r.className),
+	children: [/* @__PURE__ */ t("span", {
+		className: "text-info-label-text font-medium tracking-wide",
+		children: r.row ? `${r.label}:` : r.label
+	}), /* @__PURE__ */ t("span", {
+		className: e(r.disabled ? "text-disabled" : "", r.row ? "w-fit text-info-value-text" : "w-full text-info-secondary-text"),
+		children: r.children
+	})]
+}), o = (e) => /* @__PURE__ */ n("div", { children: [/* @__PURE__ */ t("h2", {
+	className: "typography text-typography-3xl font-bold tracking-wide",
+	children: e.title
+}), /* @__PURE__ */ t("p", {
+	className: "typography text-secondary",
+	children: e.children
+})] }), s = (r) => /* @__PURE__ */ n("header", {
+	...r.containerProps,
+	className: e("gap-mega flex min-w-full flex-row flex-wrap items-center justify-between", r.containerProps?.className),
+	children: [/* @__PURE__ */ t(o, {
+		title: r.title,
+		children: r.description
+	}), /* @__PURE__ */ t("div", {
+		className: "gap-kilo flex flex-wrap items-center",
+		children: r.children
+	})]
+});
+//#endregion
+export { i as Description, a as Info, s as PageHeader, o as PageTitle, r as Paragraph };
+
+//# sourceMappingURL=typography.js.map

package/dist/components/core/typography.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.js","names":[],"sources":["../../../src/components/core/typography.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport React, { type ComponentProps } from \"react\";\nimport { css } from \"../../lib/dom\";\nimport { Label } from \"../../types\";\n\nexport const Paragraph = (props: ComponentProps<\"p\">) => <p {...props} className={css(\"text-typography-base leading-snug\", props.className)} />;\n\nexport const Description = (props: ComponentProps<\"p\">) => (\n    <p {...props} className={css(\"mb-kilo text-typography-sm text-secondary\", props.className)} />\n);\n\nexport type InfoProps = {\n    info?: Label;\n    label: Label;\n    row?: boolean;\n    disabled?: Label;\n    className?: string;\n    infoDescription?: string;\n};\n\nexport const Info = (props: React.PropsWithChildren<InfoProps>) => (\n    <div className={css(`flex ${props.row ? \"flex-row items-center\" : \"flex-col\"} gap-info-gap`, props.className)}>\n        <span className=\"text-info-label-text font-medium tracking-wide\">{props.row ? `${props.label}:` : props.label}</span>\n        <span className={css(props.disabled ? \"text-disabled\" : \"\", props.row ? \"w-fit text-info-value-text\" : \"w-full text-info-secondary-text\")}>\n            {props.children}\n        </span>\n    </div>\n);\n\nexport const PageTitle = (props: PropsWithChildren<{ title: string }>) => (\n    <div>\n        <h2 className=\"typography text-typography-3xl font-bold tracking-wide\">{props.title}</h2>\n        <p className=\"typography text-secondary\">{props.children}</p>\n    </div>\n);\n\ntype PageHeaderProps = {\n    title: string;\n    description: Label;\n    containerProps?: React.ComponentProps<\"header\">;\n};\n\nexport const PageHeader = (props: PropsWithChildren<PageHeaderProps>) => {\n    return (\n        <header\n            {...props.containerProps}\n            className={css(\"gap-mega flex min-w-full flex-row flex-wrap items-center justify-between\", props.containerProps?.className)}\n        >\n            <PageTitle title={props.title}>{props.description}</PageTitle>\n            <div className=\"gap-kilo flex flex-wrap items-center\">{props.children}</div>\n        </header>\n    );\n};\n"],"mappings":";;;;AAKA,IAAa,KAAa,MAA+B,kBAAC,KAAD;CAAG,GAAI;CAAO,WAAW,EAAI,qCAAqC,EAAM,SAAS;AAAI,CAAA,GAEjI,KAAe,MACxB,kBAAC,KAAD;CAAG,GAAI;CAAO,WAAW,EAAI,6CAA6C,EAAM,SAAS;AAAI,CAAA,GAYpF,KAAQ,MACjB,kBAAC,OAAD;CAAK,WAAW,EAAI,QAAQ,EAAM,MAAM,0BAA0B,WAAW,gBAAgB,EAAM,SAAS;WAA5G,CACI,kBAAC,QAAD;EAAM,WAAU;YAAkD,EAAM,MAAM,GAAG,EAAM,MAAM,KAAK,EAAM;CAAY,CAAA,GACpH,kBAAC,QAAD;EAAM,WAAW,EAAI,EAAM,WAAW,kBAAkB,IAAI,EAAM,MAAM,+BAA+B,iCAAiC;YACnI,EAAM;CACL,CAAA,CACL;IAGI,KAAa,MACtB,kBAAC,OAAD,EAAA,UAAA,CACI,kBAAC,MAAD;CAAI,WAAU;WAA0D,EAAM;AAAU,CAAA,GACxF,kBAAC,KAAD;CAAG,WAAU;WAA6B,EAAM;AAAY,CAAA,CAC3D,EAAA,CAAA,GASI,KAAc,MAEnB,kBAAC,UAAD;CACI,GAAI,EAAM;CACV,WAAW,EAAI,4EAA4E,EAAM,gBAAgB,SAAS;WAF9H,CAII,kBAAC,GAAD;EAAW,OAAO,EAAM;YAAQ,EAAM;CAAuB,CAAA,GAC7D,kBAAC,OAAD;EAAK,WAAU;YAAwC,EAAM;CAAc,CAAA,CACvE"}

package/dist/components/core/typography.jsx

@@ -0,0 +1,20 @@
+import React from "react";
+import { css } from "../../lib/dom";
+export const Paragraph = (props) => <p {...props} className={css("text-typography-base leading-snug", props.className)}/>;
+export const Description = (props) => (<p {...props} className={css("mb-kilo text-typography-sm text-secondary", props.className)}/>);
+export const Info = (props) => (<div className={css(`flex ${props.row ? "flex-row items-center" : "flex-col"} gap-info-gap`, props.className)}>
+        <span className="text-info-label-text font-medium tracking-wide">{props.row ? `${props.label}:` : props.label}</span>
+        <span className={css(props.disabled ? "text-disabled" : "", props.row ? "w-fit text-info-value-text" : "w-full text-info-secondary-text")}>
+            {props.children}
+        </span>
+    </div>);
+export const PageTitle = (props) => (<div>
+        <h2 className="typography text-typography-3xl font-bold tracking-wide">{props.title}</h2>
+        <p className="typography text-secondary">{props.children}</p>
+    </div>);
+export const PageHeader = (props) => {
+    return (<header {...props.containerProps} className={css("gap-mega flex min-w-full flex-row flex-wrap items-center justify-between", props.containerProps?.className)}>
+            <PageTitle title={props.title}>{props.description}</PageTitle>
+            <div className="gap-kilo flex flex-wrap items-center">{props.children}</div>
+        </header>);
+};

package/dist/components/display/alert.d.ts

@@ -0,0 +1,28 @@
+import { HTMLMotionProps } from "motion/react";
+import React, { PropsWithChildren } from "react";
+import { CvaVariants } from "../../types";
+import { PolymorphicProps } from "../core/polymorph";
+type CollapseProps = HTMLMotionProps<"section"> & {
+    open: boolean;
+};
+export declare const Collapse: (props: PropsWithChildren<CollapseProps>) => React.JSX.Element;
+declare const themeVariants: {
+    theme: {
+        primary: string;
+        danger: string;
+        info: string;
+        success: string;
+        secondary: string;
+        warn: string;
+        neutral: string;
+    };
+};
+export type AlertProps<T extends React.ElementType = "div"> = PolymorphicProps<CvaVariants<typeof themeVariants> & Partial<{
+    open?: boolean;
+    container: string;
+    Icon: React.ReactElement;
+    onClose: (nextState: boolean) => void;
+}>, T>;
+export declare const Alert: <T extends React.ElementType = "div">(props: AlertProps<T>) => React.ReactNode;
+export {};
+//# sourceMappingURL=alert.d.ts.map

package/dist/components/display/alert.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/components/display/alert.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAA2B,MAAM,cAAc,CAAC;AAExE,OAAO,KAAK,EAAE,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG7D,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAa,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAShE,KAAK,aAAa,GAAG,eAAe,CAAC,SAAS,CAAC,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC;AAEpE,eAAO,MAAM,QAAQ,GAAI,OAAO,iBAAiB,CAAC,aAAa,CAAC,sBAc/D,CAAC;AAEF,QAAA,MAAM,aAAa;;;;;;;;;;CAUlB,CAAC;AAOF,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CAC1E,WAAW,CAAC,OAAO,aAAa,CAAC,GAC7B,OAAO,CAAC;IACJ,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,OAAO,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACzC,CAAC,EACN,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAoD9E,CAAC"}

package/dist/components/display/alert.js

@@ -1,53 +1,40 @@
 "use client";
-import { r as e, t } from "../../proxy-BcJ_5Dwq.js";
-import { t as n } from "../../dom-Bn4wY_Zx.js";
-import { t as r } from "../../dist-NmFtbuK4.js";
-import { t as i } from "../../polymorph-BLXhrn9n.js";
-import { t as a } from "../../CheckCircle.es-BB91gLT-.js";
-import { t as o } from "../../Info.es-Dvln8pws.js";
-import { t as s } from "../../Warning.es-B_xCn-P5.js";
-import { t as c } from "../../X.es-Cjq2a_OA.js";
-import { t as l } from "../../use-translations-DTLfPE3_.js";
+import { t as e } from "../../dom-Bn4wY_Zx.js";
+import { t } from "../../dist-NmFtbuK4.js";
+import { Polymorph as n } from "../core/polymorph.js";
+import { t as r } from "../../CheckCircle.es-BB91gLT-.js";
+import { t as i } from "../../Info.es-Dvln8pws.js";
+import { t as a } from "../../Warning.es-B_xCn-P5.js";
+import { t as o } from "../../X.es-Cjq2a_OA.js";
+import { t as s } from "../../use-translations-BE4PuhLm.js";
+import { t as c } from "../../proxy-fP2NxmhM.js";
+import { Resizable as l } from "../core/resizable.js";
 import { forwardRef as u } from "react";
 import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region src/components/display/alert.tsx
 var p = {
-	true: {
-		opacity: 1,
-		height: "auto"
-	},
-	false: {
-		opacity: [
-			.7,
-			.3,
-			0
-		],
-		height: 0
-	}
-}, m = {
 	type: "tween",
-	duration: .7,
+	duration: .35,
 	ease: [
 		.04,
 		.62,
 		.23,
 		.98
 	]
-}, h = (e) => /* @__PURE__ */ d(t.div, {
-	...e,
-	layout: !0,
-	layoutRoot: !0,
-	layoutScroll: !0,
+}, m = (t) => /* @__PURE__ */ d(c.div, {
+	...t,
 	initial: !1,
-	variants: p,
-	exit: p.false,
-	transition: m,
-	"aria-hidden": !e.open,
+	animate: { opacity: +!!t.open },
+	transition: p,
+	"aria-hidden": !t.open,
 	"data-component": "collapse",
-	animate: e.open.toString(),
-	className: n("aria-hidden:pointer-events-none", e.className),
-	children: e.children
-}), g = r("text-typography-sm relative block w-full rounded-alert-radius border p-alert-p", {
+	className: e("aria-hidden:pointer-events-none", t.className),
+	children: /* @__PURE__ */ d(l, {
+		open: t.open,
+		destroyOnUnmount: !0,
+		children: t.children
+	})
+}), h = t("text-typography-sm relative block w-full rounded-alert-radius border p-alert-p", {
 	variants: { theme: {
 		primary: "bg-alert-primary-bg text-alert-primary-text border-alert-primary-border",
 		danger: "bg-alert-danger-bg text-alert-danger-text border-alert-danger-border",
@@ -58,77 +45,71 @@ var p = {
 		neutral: "bg-transparent border border-card-border text-alert-primary-text"
 	} },
 	defaultVariants: { theme: "neutral" }
-}), _ = u(function({ className: r, theme: u, Icon: p, onClose: m, open: _ = !0, ...v }, y) {
-	let b = l(), x = () => m?.(!1), S = u === "danger" || u === "warn" ? "alert" : "status";
-	return /* @__PURE__ */ d(e, {
-		presenceAffectsLayout: !0,
-		propagate: !0,
-		mode: "sync",
-		children: _ ? /* @__PURE__ */ d(t.div, {
-			"data-open": !!_,
-			"aria-hidden": !_,
-			"data-component": "alert",
-			className: n("isolate w-full", _ ? "pointer-events-auto" : "pointer-events-none"),
-			children: /* @__PURE__ */ d(h, {
-				"data-open": !!_,
-				open: !!_,
-				children: /* @__PURE__ */ d(i, {
-					...v,
-					ref: y,
-					role: S,
-					"data-theme": u,
-					as: v.as || "div",
-					className: n(g({ theme: u }), r),
-					children: /* @__PURE__ */ f("div", {
-						className: "flex flex-col gap-alert-gap",
-						children: [
-							m !== void 0 && _ ? /* @__PURE__ */ d("button", {
-								type: "button",
-								onClick: x,
-								"aria-label": b.closeButton,
-								className: "absolute right-alert-close-right top-alert-close-top text-foreground transition-colors duration-300 ease-in-out hover:text-danger",
-								children: /* @__PURE__ */ d(c, {
-									size: 20,
-									"aria-hidden": "true"
+}), g = u(function({ className: t, theme: c, Icon: l, onClose: u, open: p = !0, ...g }, _) {
+	let v = s(), y = () => u?.(!1), b = c === "danger" || c === "warn" ? "alert" : "status";
+	return /* @__PURE__ */ d("div", {
+		"data-open": !!p,
+		"aria-hidden": !p,
+		"data-component": "alert",
+		className: e("isolate w-full", p ? "pointer-events-auto" : "pointer-events-none"),
+		children: /* @__PURE__ */ d(m, {
+			open: !!p,
+			children: /* @__PURE__ */ d(n, {
+				...g,
+				ref: _,
+				role: b,
+				"data-theme": c,
+				as: g.as || "div",
+				className: e(h({ theme: c }), t),
+				children: /* @__PURE__ */ f("div", {
+					className: "flex flex-col gap-alert-gap",
+					children: [
+						u === void 0 ? null : /* @__PURE__ */ d("button", {
+							type: "button",
+							onClick: y,
+							"aria-label": v.closeButton,
+							className: "absolute right-alert-close-right top-alert-close-top text-foreground transition-colors duration-300 ease-in-out hover:text-danger",
+							children: /* @__PURE__ */ d(o, {
+								size: 20,
+								"aria-hidden": "true"
+							})
+						}),
+						/* @__PURE__ */ f("div", {
+							className: "flex items-center gap-alert-gap",
+							children: [
+								!l && c === "success" ? /* @__PURE__ */ d(r, {
+									"aria-hidden": "true",
+									size: 20
+								}) : null,
+								!l && c === "info" ? /* @__PURE__ */ d(i, {
+									"aria-hidden": "true",
+									size: 20
+								}) : null,
+								!l && c === "danger" ? /* @__PURE__ */ d(a, {
+									"aria-hidden": "true",
+									size: 20
+								}) : null,
+								l,
+								g.title ? /* @__PURE__ */ d("h4", {
+									className: "tracking-3 text-typography-lg text-balance font-semibold",
+									children: g.title
+								}) : /* @__PURE__ */ d("div", {
+									className: "w-full",
+									children: g.children
 								})
-							}) : null,
-							/* @__PURE__ */ f("div", {
-								className: "flex items-center gap-alert-gap",
-								children: [
-									!p && u === "success" ? /* @__PURE__ */ d(a, {
-										"aria-hidden": "true",
-										size: 20
-									}) : null,
-									!p && u === "info" ? /* @__PURE__ */ d(o, {
-										"aria-hidden": "true",
-										size: 20
-									}) : null,
-									!p && u === "danger" ? /* @__PURE__ */ d(s, {
-										"aria-hidden": "true",
-										size: 20
-									}) : null,
-									p,
-									v.title ? /* @__PURE__ */ d("h4", {
-										className: "tracking-3 text-typography-lg text-balance font-semibold",
-										children: v.title
-									}) : /* @__PURE__ */ d("div", {
-										className: "w-full",
-										children: v.children
-									})
-								]
-							}),
-							v.title ? /* @__PURE__ */ d("div", {
-								className: "w-full",
-								children: v.children
-							}) : null
-						]
-					})
+							]
+						}),
+						g.title ? /* @__PURE__ */ d("div", {
+							className: "w-full",
+							children: g.children
+						}) : null
+					]
 				})
 			})
-		}) : null
+		})
 	});
 });
 //#endregion
-export { _ as Alert, h as Collapse };
+export { g as Alert, m as Collapse };
 
 //# sourceMappingURL=alert.js.map