@xanui/ui 1.1.37 → 1.1.40

package/index.js

@@ -1,134 +1,65 @@
-'use strict';
-
-var index = require('./Accordion/index.js');
-var index$1 = require('./Autocomplete/index.js');
-var index$2 = require('./Alert/index.js');
-var index$3 = require('./Avatar/index.js');
-var index$4 = require('./Badge/index.js');
-var index$5 = require('./Box/index.js');
-var index$6 = require('./Button/index.js');
-var index$7 = require('./ButtonGroup/index.js');
-var index$8 = require('./Calendar/index.js');
-var index$9 = require('./CalendarInput/index.js');
-var index$a = require('./Checkbox/index.js');
-var index$b = require('./Chip/index.js');
-var index$c = require('./CircleProgress/index.js');
-var index$d = require('./ClickOutside/index.js');
-var index$e = require('./Collaps/index.js');
-var index$f = require('./Container/index.js');
-var index$g = require('./Datatable/index.js');
-var index$h = require('./DataFilter/index.js');
-var index$i = require('./Divider/index.js');
-var index$j = require('./Drawer/index.js');
-var index$k = require('./Form/index.js');
-var index$l = require('./GridContainer/index.js');
-var index$m = require('./GridItem/index.js');
-var index$n = require('./IconButton/index.js');
-var index$o = require('./Image/index.js');
-var index$p = require('./Input/index.js');
-var index$q = require('./Label/index.js');
-var index$r = require('./Layer/index.js');
-var index$s = require('./LineProgress/index.js');
-var index$t = require('./List/index.js');
-var index$u = require('./ListItem/index.js');
-var index$v = require('./LoadingBox/index.js');
-var index$w = require('./Menu/index.js');
-var index$x = require('./Modal/index.js');
-var index$y = require('./NoSSR/index.js');
-var index$z = require('./Option/index.js');
-var index$A = require('./Paper/index.js');
-var index$B = require('./Portal/index.js');
-var index$C = require('./Radio/index.js');
-var index$D = require('./Scrollbar/index.js');
-var index$E = require('./Select/index.js');
-var index$F = require('./Stack/index.js');
-var index$G = require('./Switch/index.js');
-var index$H = require('./Tab/index.js');
-var index$I = require('./Table/index.js');
-var index$J = require('./TableBody/index.js');
-var index$K = require('./TableCell/index.js');
-var index$L = require('./TableFooter/index.js');
-var index$M = require('./TableHead/index.js');
-var index$N = require('./TablePagination/index.js');
-var index$O = require('./TableRow/index.js');
-var index$P = require('./Tabs/index.js');
-var index$Q = require('./Text/index.js');
-var index$R = require('./Toast/index.js');
-var index$S = require('./Tooltip/index.js');
-var index$T = require('./useCorner/index.js');
-var index$U = require('./ViewBox/index.js');
-var SelectFilter = require('./DataFilter/options/SelectFilter.js');
-var MultiSelectFilter = require('./DataFilter/options/MultiSelectFilter.js');
-var NumberFilter = require('./DataFilter/options/NumberFilter.js');
-var TextFilter = require('./DataFilter/options/TextFilter.js');
-var NumberRangeFilter = require('./DataFilter/options/NumberRangeFilter.js');
-var DateFilter = require('./DataFilter/options/DateFilter.js');
-var DateRangeFilter = require('./DataFilter/options/DateRangeFilter.js');
-
-
-
-exports.Accordion = index;
-exports.Autocomplete = index$1;
-exports.Alert = index$2;
-exports.Avatar = index$3;
-exports.Badge = index$4;
-exports.Box = index$5;
-exports.Button = index$6;
-exports.ButtonGroup = index$7;
-exports.Calendar = index$8;
-exports.CalendarInput = index$9;
-exports.Checkbox = index$a;
-exports.Chip = index$b;
-exports.CircleProgress = index$c;
-exports.ClickOutside = index$d;
-exports.Collaps = index$e;
-exports.Container = index$f;
-exports.Datatable = index$g;
-exports.DataFilter = index$h.default;
-exports.Divider = index$i;
-exports.Drawer = index$j;
-exports.Form = index$k;
-exports.GridContainer = index$l;
-exports.GridItem = index$m;
-exports.IconButton = index$n;
-exports.Image = index$o;
-exports.Input = index$p;
-exports.Label = index$q;
-exports.Layer = index$r;
-exports.LineProgress = index$s;
-exports.List = index$t;
-exports.ListItem = index$u;
-exports.LoadingBox = index$v;
-exports.Menu = index$w;
-exports.Modal = index$x;
-exports.NoSSR = index$y;
-exports.Option = index$z;
-exports.Paper = index$A;
-exports.Portal = index$B;
-exports.Radio = index$C;
-exports.Scrollbar = index$D;
-exports.Select = index$E;
-exports.Stack = index$F;
-exports.Switch = index$G;
-exports.Tab = index$H;
-exports.Table = index$I;
-exports.TableBody = index$J;
-exports.TableCell = index$K;
-exports.TableFooter = index$L;
-exports.TableHead = index$M;
-exports.TablePagination = index$N;
-exports.TableRow = index$O;
-exports.Tabs = index$P;
-exports.Text = index$Q;
-exports.Toast = index$R;
-exports.Tooltip = index$S;
-exports.useCorner = index$T;
-exports.ViewBox = index$U;
-exports.SelectFilter = SelectFilter;
-exports.MultiSelectFilter = MultiSelectFilter;
-exports.NumberFilter = NumberFilter;
-exports.TextFilter = TextFilter;
-exports.NumberRangeFilter = NumberRangeFilter;
-exports.DateFilter = DateFilter;
-exports.DateRangeFilter = DateRangeFilter;
+export { default as Accordion } from './Accordion/index.js';
+export { default as Autocomplete } from './Autocomplete/index.js';
+export { default as Alert } from './Alert/index.js';
+export { default as Avatar } from './Avatar/index.js';
+export { default as Badge } from './Badge/index.js';
+export { default as Box } from './Box/index.js';
+export { default as Button } from './Button/index.js';
+export { default as ButtonGroup } from './ButtonGroup/index.js';
+export { default as Calendar } from './Calendar/index.js';
+export { default as CalendarInput } from './CalendarInput/index.js';
+export { default as Checkbox } from './Checkbox/index.js';
+export { default as Chip } from './Chip/index.js';
+export { default as CircleProgress } from './CircleProgress/index.js';
+export { default as ClickOutside } from './ClickOutside/index.js';
+export { default as Collaps } from './Collaps/index.js';
+export { default as Container } from './Container/index.js';
+export { default as Datatable } from './Datatable/index.js';
+export { default as DataFilter } from './DataFilter/index.js';
+export { default as Divider } from './Divider/index.js';
+export { default as Drawer } from './Drawer/index.js';
+export { default as Form } from './Form/index.js';
+export { default as GridContainer } from './GridContainer/index.js';
+export { default as GridItem } from './GridItem/index.js';
+export { default as IconButton } from './IconButton/index.js';
+export { default as Image } from './Image/index.js';
+export { default as Input } from './Input/index.js';
+export { default as Label } from './Label/index.js';
+export { default as Layer } from './Layer/index.js';
+export { default as LineProgress } from './LineProgress/index.js';
+export { default as List } from './List/index.js';
+export { default as ListItem } from './ListItem/index.js';
+export { default as LoadingBox } from './LoadingBox/index.js';
+export { default as Menu } from './Menu/index.js';
+export { default as Modal } from './Modal/index.js';
+export { default as NoSSR } from './NoSSR/index.js';
+export { default as Option } from './Option/index.js';
+export { default as Paper } from './Paper/index.js';
+export { default as Portal } from './Portal/index.js';
+export { default as Radio } from './Radio/index.js';
+export { default as Scrollbar } from './Scrollbar/index.js';
+export { default as Select } from './Select/index.js';
+export { default as Stack } from './Stack/index.js';
+export { default as Switch } from './Switch/index.js';
+export { default as Tab } from './Tab/index.js';
+export { default as Table } from './Table/index.js';
+export { default as TableBody } from './TableBody/index.js';
+export { default as TableCell } from './TableCell/index.js';
+export { default as TableFooter } from './TableFooter/index.js';
+export { default as TableHead } from './TableHead/index.js';
+export { default as TablePagination } from './TablePagination/index.js';
+export { default as TableRow } from './TableRow/index.js';
+export { default as Tabs } from './Tabs/index.js';
+export { default as Text } from './Text/index.js';
+export { default as Toast } from './Toast/index.js';
+export { default as Tooltip } from './Tooltip/index.js';
+export { default as useCorner } from './useCorner/index.js';
+export { default as ViewBox } from './ViewBox/index.js';
+export { default as SelectFilter } from './DataFilter/options/SelectFilter.js';
+export { default as MultiSelectFilter } from './DataFilter/options/MultiSelectFilter.js';
+export { default as NumberFilter } from './DataFilter/options/NumberFilter.js';
+export { default as TextFilter } from './DataFilter/options/TextFilter.js';
+export { default as NumberRangeFilter } from './DataFilter/options/NumberRangeFilter.js';
+export { default as DateFilter } from './DataFilter/options/DateFilter.js';
+export { default as DateRangeFilter } from './DataFilter/options/DateRangeFilter.js';
 //# sourceMappingURL=index.js.map

package/index.js.map

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

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@xanui/ui",
-  "version": "1.1.37",
-  "description": "",
+  "version": "1.1.40",
+  "description": "Xanui - A React Component Library",
   "private": false,
   "dependencies": {
     "@xanui/core": "^1.2.39",
@@ -14,7 +14,7 @@
   "exports": {
     "./*": {
       "import": "./*/index.js",
-      "require": "./*/index.js",
+      "require": "./*/index.cjs",
       "types": "./*/index.d.ts"
     }
   },

package/readme.md

@@ -1,6 +1,6 @@
-# XanUI UI Library
+# Xanui Library
 
-XanUI is a React design-system toolkit powered by `@xanui/core`. It combines low-level primitives (e.g., `Box`, `Stack`, `Layer`) with application-ready components (e.g., `Accordion`, `Modal`, `Datatable`, `Toast`) so product teams can build polished surfaces quickly while keeping full control over styling tokens.
+Xanui is a React design-system toolkit powered by `@xanui/core`. It combines low-level primitives (e.g., `Box`, `Stack`, `Layer`) with application-ready components (e.g., `Accordion`, `Modal`, `Datatable`, `Toast`) so product teams can build polished surfaces quickly while keeping full control over styling tokens.
 
 ## Highlights
 
@@ -17,7 +17,7 @@ npm install @xanui/ui
 
 ```
 
-Required peer packages (`react`, `react-dom`, `@xanui/core`, `@xanui/icons`) should already exist in your project; otherwise, install them alongside XanUI.
+Required peer packages (`react`, `react-dom`, `@xanui/core`, `@xanui/icons`) should already exist in your project; otherwise, install them alongside Xanui.
 
 ## Quick Start
 
@@ -31,7 +31,7 @@ export default function App() {
     <ThemeProvider theme="light">
       <Box p={3} gap={2} display="flex" flexDirection="column">
         <h1>Welcome</h1>
-        <Button color="brand" onClick={() => alert('Hello from XanUI!')}>
+        <Button color="brand" onClick={() => alert('Hello from Xanui!')}>
           Get Started
         </Button>
       </Box>

package/useAlert/index.cjs

@@ -0,0 +1,94 @@
+"use client";
+'use strict';
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@xanui/core');
+var index$2 = require('../Button/index.cjs');
+var index = require('../useModal/index.cjs');
+var index$1 = require('../Alert/index.cjs');
+var React = require('react');
+
+const useAlert = (props) => {
+    const [loading, setLoading] = React.useState(false);
+    let { content, size, color, direction, variant, closeButton, clickOutsideToClose, okButtonText, cancelButtonText, hideOkButton, hideCancelButton, buttonPlacement, onConfirm, onCancel, transition, blurMode, slotProps } = props, rest = tslib.__rest(props, ["content", "size", "color", "direction", "variant", "closeButton", "clickOutsideToClose", "okButtonText", "cancelButtonText", "hideOkButton", "hideCancelButton", "buttonPlacement", "onConfirm", "onCancel", "transition", "blurMode", "slotProps"]);
+    hideOkButton !== null && hideOkButton !== void 0 ? hideOkButton : (hideOkButton = false);
+    hideCancelButton !== null && hideCancelButton !== void 0 ? hideCancelButton : (hideCancelButton = false);
+    size !== null && size !== void 0 ? size : (size = "small");
+    color !== null && color !== void 0 ? color : (color = 'default');
+    variant !== null && variant !== void 0 ? variant : (variant = "text");
+    direction !== null && direction !== void 0 ? direction : (direction = "column");
+    buttonPlacement !== null && buttonPlacement !== void 0 ? buttonPlacement : (buttonPlacement = "end");
+    let sx = {};
+    switch (buttonPlacement) {
+        case "start":
+            sx.justifyContent = 'flex-start';
+            break;
+        case "end":
+            sx.justifyContent = 'flex-end';
+            break;
+        case "between":
+            sx.justifyContent = 'space-between';
+            break;
+        case "full":
+            sx = {
+                "& button": {
+                    flex: 1
+                }
+            };
+            break;
+    }
+    let sizes = {
+        small: 320,
+        medium: 400,
+        large: 600
+    };
+    let okcolor = color;
+    let closecolor = color;
+    if (color === 'default') {
+        okcolor = 'brand';
+        closecolor = 'default';
+        variant = 'text';
+    }
+    else {
+        if (variant === 'fill') {
+            okcolor = 'default';
+            closecolor = 'default';
+        }
+        else {
+            okcolor = color;
+            closecolor = 'default';
+        }
+    }
+    const modal = index(jsxRuntime.jsxs(index$1, Object.assign({ direction: direction, sx: {
+            px: 2,
+            py: 1,
+            pt: direction === 'row' ? 1 : 2
+        }, color: color, variant: variant, onClose: closeButton ? close : undefined }, rest, { children: [typeof content === "function" ? content({
+                open: () => modal.open(),
+                close: () => modal.close(),
+                loading: (is) => setLoading(is),
+                isLoading: () => loading
+            }) : content, jsxRuntime.jsxs(core.Tag, { sxr: Object.assign({ display: "flex", gap: 1, pt: 4, flexDirection: "row" }, sx), children: [!hideCancelButton && jsxRuntime.jsx(index$2, Object.assign({ disabled: loading, color: closecolor, variant: "fill" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.closeButton, { onClick: async () => {
+                            setLoading(true);
+                            onCancel && await onCancel();
+                            setLoading(false);
+                            modal.close();
+                        }, children: cancelButtonText || "Close" })), jsxRuntime.jsx(index$2, Object.assign({ loading: loading, color: okcolor, variant: "fill" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.okButton, { onClick: async () => {
+                            setLoading(true);
+                            onConfirm && await onConfirm();
+                            setLoading(false);
+                            modal.close();
+                        }, children: okButtonText || "OK" }))] })] })), Object.assign(Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.modal), { size: sizes[size] || size, blur: 40, blurMode: blurMode || "transparent", transition: transition || "zoom", onClickOutside: async () => {
+            if (clickOutsideToClose && !loading) {
+                setLoading(true);
+                onCancel && await onCancel();
+                setLoading(false);
+                modal.close();
+            }
+        } }));
+    return Object.assign(Object.assign({}, modal), { loading: (is) => setLoading(is), isLoading: () => loading });
+};
+
+module.exports = useAlert;
+//# sourceMappingURL=index.cjs.map

package/useAlert/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../src/useAlert/index.tsx"],"sourcesContent":["'use client'\r\n\r\nimport { Tag, UseTransitionVariantTypes } from \"@xanui/core\"\r\nimport Button, { ButtonProps } from \"../Button\";\r\nimport useModal, { UseModalProps } from \"../useModal\";\r\nimport Alert, { AlertProps } from \"../Alert\";\r\nimport React from \"react\";\r\nexport type UseAlertContentProps = {\r\n    open: () => void;\r\n    close: () => void;\r\n    loading: (is: boolean) => void;\r\n    isLoading: () => boolean;\r\n}\r\n\r\nexport type UseAlertContent = React.ReactElement | ((props: UseAlertContentProps) => React.ReactElement)\r\n\r\nexport type UseAlerProps = Omit<AlertProps, 'children' | 'onClose' | 'variant' | \"size\"> & {\r\n    content: string | UseAlertContent,\r\n    size?: \"small\" | \"medium\" | \"large\" | number;\r\n    closeButton?: boolean;\r\n    clickOutsideToClose?: boolean;\r\n    okButtonText?: string;\r\n    cancelButtonText?: string;\r\n    hideOkButton?: boolean;\r\n    hideCancelButton?: boolean;\r\n    buttonPlacement?: \"start\" | \"end\" | \"between\" | \"full\";\r\n    variant?: \"text\" | \"fill\"\r\n    onConfirm?: () => Promise<void> | void;\r\n    onCancel?: () => Promise<void> | void;\r\n    transition?: UseTransitionVariantTypes;\r\n    blurMode?: UseModalProps['blurMode'];\r\n    slotProps?: {\r\n        modal?: UseModalProps;\r\n        okButton?: Omit<ButtonProps, \"children\">;\r\n        closeButton?: Omit<ButtonProps, \"children\">;\r\n    }\r\n}\r\n\r\n\r\nconst useAlert = (props: UseAlerProps) => {\r\n    const [loading, setLoading] = React.useState(false)\r\n    let {\r\n        content,\r\n        size,\r\n        color,\r\n        direction,\r\n        variant,\r\n        closeButton,\r\n        clickOutsideToClose,\r\n        okButtonText,\r\n        cancelButtonText,\r\n        hideOkButton,\r\n        hideCancelButton,\r\n        buttonPlacement,\r\n        onConfirm,\r\n        onCancel,\r\n        transition,\r\n        blurMode,\r\n        slotProps,\r\n        ...rest\r\n    } = props\r\n\r\n    hideOkButton ??= false\r\n    hideCancelButton ??= false\r\n\r\n    size ??= \"small\"\r\n    color ??= 'default'\r\n    variant ??= \"text\"\r\n    direction ??= \"column\"\r\n    buttonPlacement ??= \"end\"\r\n    let sx: any = {};\r\n\r\n    switch (buttonPlacement) {\r\n        case \"start\":\r\n            sx.justifyContent = 'flex-start'\r\n            break;\r\n        case \"end\":\r\n            sx.justifyContent = 'flex-end'\r\n            break;\r\n        case \"between\":\r\n            sx.justifyContent = 'space-between'\r\n            break;\r\n        case \"full\":\r\n            sx = {\r\n                \"& button\": {\r\n                    flex: 1\r\n                }\r\n            }\r\n            break;\r\n    }\r\n\r\n    let sizes: any = {\r\n        small: 320,\r\n        medium: 400,\r\n        large: 600\r\n    }\r\n\r\n    let okcolor = color\r\n    let closecolor = color\r\n    if (color === 'default') {\r\n        okcolor = 'brand'\r\n        closecolor = 'default'\r\n        variant = 'text'\r\n    } else {\r\n        if (variant === 'fill') {\r\n            okcolor = 'default'\r\n            closecolor = 'default'\r\n        } else {\r\n            okcolor = color\r\n            closecolor = 'default'\r\n        }\r\n    }\r\n\r\n    const modal = useModal(<Alert\r\n        direction={direction}\r\n        sx={{\r\n            px: 2,\r\n            py: 1,\r\n            pt: direction === 'row' ? 1 : 2\r\n        }}\r\n        color={color}\r\n        variant={variant}\r\n        onClose={closeButton ? close : undefined}\r\n        {...rest}\r\n    >\r\n        {typeof content === \"function\" ? content({\r\n            open: () => modal.open(),\r\n            close: () => modal.close(),\r\n            loading: (is: boolean) => setLoading(is),\r\n            isLoading: () => loading\r\n        }) : content}\r\n        <Tag\r\n            sxr={{\r\n                display: \"flex\",\r\n                gap: 1,\r\n                pt: 4,\r\n                flexDirection: \"row\",\r\n                ...sx,\r\n            }}\r\n        >\r\n            {!hideCancelButton && <Button\r\n                disabled={loading}\r\n                color={closecolor}\r\n                variant=\"fill\"\r\n                {...slotProps?.closeButton}\r\n                onClick={async () => {\r\n                    setLoading(true)\r\n                    onCancel && await onCancel()\r\n                    setLoading(false)\r\n                    modal.close()\r\n                }}\r\n            >{cancelButtonText || \"Close\"}</Button>}\r\n            <Button\r\n                loading={loading}\r\n                color={okcolor}\r\n                variant=\"fill\"\r\n                {...slotProps?.okButton}\r\n\r\n                onClick={async () => {\r\n                    setLoading(true)\r\n                    onConfirm && await onConfirm()\r\n                    setLoading(false)\r\n                    modal.close()\r\n                }}\r\n            >{okButtonText || \"OK\"}</Button>\r\n        </Tag>\r\n    </Alert>, {\r\n        ...slotProps?.modal,\r\n        size: sizes[size] || size,\r\n        blur: 40,\r\n        blurMode: blurMode || \"transparent\",\r\n        transition: transition || \"zoom\",\r\n        onClickOutside: async () => {\r\n            if (clickOutsideToClose && !loading) {\r\n                setLoading(true)\r\n                onCancel && await onCancel()\r\n                setLoading(false)\r\n                modal.close()\r\n            }\r\n        }\r\n    })\r\n\r\n    return {\r\n        ...modal,\r\n        loading: (is: boolean) => setLoading(is),\r\n        isLoading: () => loading\r\n    }\r\n}\r\n\r\nexport default useAlert"],"names":[],"mappings":";;;;;;;;;;;AAuCA;AACI;AACA;;;;;;;;;;AAgCI;AACI;;AAEJ;AACI;;AAEJ;AACI;;AAEJ;AACI;AACI;AACI;AACH;;;;AAKb;AACI;AACA;AACA;;;;AAKJ;;;;;;AAKI;;;;;;;;;AASJ;AAGQ;AACA;;AAEH;AAOG;AACA;;AAEA;;;AAkBQ;;;AAGJ;;AAUI;;;;AAaR;;AAEI;;;;AAIR;;AAQR;;"}

package/useAlert/index.js

@@ -1,17 +1,15 @@
 "use client";
-'use strict';
-
-var tslib = require('tslib');
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@xanui/core');
-var index$2 = require('../Button/index.js');
-var index = require('../useModal/index.js');
-var index$1 = require('../Alert/index.js');
-var React = require('react');
+import { __rest } from 'tslib';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Tag } from '@xanui/core';
+import Button from '../Button/index.js';
+import useModal from '../useModal/index.js';
+import Alert from '../Alert/index.js';
+import React from 'react';
 
 const useAlert = (props) => {
     const [loading, setLoading] = React.useState(false);
-    let { content, size, color, direction, variant, closeButton, clickOutsideToClose, okButtonText, cancelButtonText, hideOkButton, hideCancelButton, buttonPlacement, onConfirm, onCancel, transition, blurMode, slotProps } = props, rest = tslib.__rest(props, ["content", "size", "color", "direction", "variant", "closeButton", "clickOutsideToClose", "okButtonText", "cancelButtonText", "hideOkButton", "hideCancelButton", "buttonPlacement", "onConfirm", "onCancel", "transition", "blurMode", "slotProps"]);
+    let { content, size, color, direction, variant, closeButton, clickOutsideToClose, okButtonText, cancelButtonText, hideOkButton, hideCancelButton, buttonPlacement, onConfirm, onCancel, transition, blurMode, slotProps } = props, rest = __rest(props, ["content", "size", "color", "direction", "variant", "closeButton", "clickOutsideToClose", "okButtonText", "cancelButtonText", "hideOkButton", "hideCancelButton", "buttonPlacement", "onConfirm", "onCancel", "transition", "blurMode", "slotProps"]);
     hideOkButton !== null && hideOkButton !== void 0 ? hideOkButton : (hideOkButton = false);
     hideCancelButton !== null && hideCancelButton !== void 0 ? hideCancelButton : (hideCancelButton = false);
     size !== null && size !== void 0 ? size : (size = "small");
@@ -60,7 +58,7 @@ const useAlert = (props) => {
             closecolor = 'default';
         }
     }
-    const modal = index(jsxRuntime.jsxs(index$1, Object.assign({ direction: direction, sx: {
+    const modal = useModal(jsxs(Alert, Object.assign({ direction: direction, sx: {
             px: 2,
             py: 1,
             pt: direction === 'row' ? 1 : 2
@@ -69,12 +67,12 @@ const useAlert = (props) => {
                 close: () => modal.close(),
                 loading: (is) => setLoading(is),
                 isLoading: () => loading
-            }) : content, jsxRuntime.jsxs(core.Tag, { sxr: Object.assign({ display: "flex", gap: 1, pt: 4, flexDirection: "row" }, sx), children: [!hideCancelButton && jsxRuntime.jsx(index$2, Object.assign({ disabled: loading, color: closecolor, variant: "fill" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.closeButton, { onClick: async () => {
+            }) : content, jsxs(Tag, { sxr: Object.assign({ display: "flex", gap: 1, pt: 4, flexDirection: "row" }, sx), children: [!hideCancelButton && jsx(Button, Object.assign({ disabled: loading, color: closecolor, variant: "fill" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.closeButton, { onClick: async () => {
                             setLoading(true);
                             onCancel && await onCancel();
                             setLoading(false);
                             modal.close();
-                        }, children: cancelButtonText || "Close" })), jsxRuntime.jsx(index$2, Object.assign({ loading: loading, color: okcolor, variant: "fill" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.okButton, { onClick: async () => {
+                        }, children: cancelButtonText || "Close" })), jsx(Button, Object.assign({ loading: loading, color: okcolor, variant: "fill" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.okButton, { onClick: async () => {
                             setLoading(true);
                             onConfirm && await onConfirm();
                             setLoading(false);
@@ -90,5 +88,5 @@ const useAlert = (props) => {
     return Object.assign(Object.assign({}, modal), { loading: (is) => setLoading(is), isLoading: () => loading });
 };
 
-module.exports = useAlert;
+export { useAlert as default };
 //# sourceMappingURL=index.js.map

package/useAlert/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/useAlert/index.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { Tag, UseTransitionVariantTypes } from \"@xanui/core\"\r\nimport Button, { ButtonProps } from \"../Button\";\r\nimport useModal, { UseModalProps } from \"../useModal\";\r\nimport Alert, { AlertProps } from \"../Alert\";\r\nimport React from \"react\";\r\nexport type UseAlertContentProps = {\r\n    open: () => void;\r\n    close: () => void;\r\n    loading: (is: boolean) => void;\r\n    isLoading: () => boolean;\r\n}\r\n\r\nexport type UseAlertContent = React.ReactElement | ((props: UseAlertContentProps) => React.ReactElement)\r\n\r\nexport type UseAlerProps = Omit<AlertProps, 'children' | 'onClose' | 'variant' | \"size\"> & {\r\n    content: string | UseAlertContent,\r\n    size?: \"small\" | \"medium\" | \"large\" | number;\r\n    closeButton?: boolean;\r\n    clickOutsideToClose?: boolean;\r\n    okButtonText?: string;\r\n    cancelButtonText?: string;\r\n    hideOkButton?: boolean;\r\n    hideCancelButton?: boolean;\r\n    buttonPlacement?: \"start\" | \"end\" | \"between\" | \"full\";\r\n    variant?: \"text\" | \"fill\"\r\n    onConfirm?: () => Promise<void> | void;\r\n    onCancel?: () => Promise<void> | void;\r\n    transition?: UseTransitionVariantTypes;\r\n    blurMode?: UseModalProps['blurMode'];\r\n    slotProps?: {\r\n        modal?: UseModalProps;\r\n        okButton?: Omit<ButtonProps, \"children\">;\r\n        closeButton?: Omit<ButtonProps, \"children\">;\r\n    }\r\n}\r\n\r\n\r\nconst useAlert = (props: UseAlerProps) => {\r\n    const [loading, setLoading] = React.useState(false)\r\n    let {\r\n        content,\r\n        size,\r\n        color,\r\n        direction,\r\n        variant,\r\n        closeButton,\r\n        clickOutsideToClose,\r\n        okButtonText,\r\n        cancelButtonText,\r\n        hideOkButton,\r\n        hideCancelButton,\r\n        buttonPlacement,\r\n        onConfirm,\r\n        onCancel,\r\n        transition,\r\n        blurMode,\r\n        slotProps,\r\n        ...rest\r\n    } = props\r\n\r\n    hideOkButton ??= false\r\n    hideCancelButton ??= false\r\n\r\n    size ??= \"small\"\r\n    color ??= 'default'\r\n    variant ??= \"text\"\r\n    direction ??= \"column\"\r\n    buttonPlacement ??= \"end\"\r\n    let sx: any = {};\r\n\r\n    switch (buttonPlacement) {\r\n        case \"start\":\r\n            sx.justifyContent = 'flex-start'\r\n            break;\r\n        case \"end\":\r\n            sx.justifyContent = 'flex-end'\r\n            break;\r\n        case \"between\":\r\n            sx.justifyContent = 'space-between'\r\n            break;\r\n        case \"full\":\r\n            sx = {\r\n                \"& button\": {\r\n                    flex: 1\r\n                }\r\n            }\r\n            break;\r\n    }\r\n\r\n    let sizes: any = {\r\n        small: 320,\r\n        medium: 400,\r\n        large: 600\r\n    }\r\n\r\n    let okcolor = color\r\n    let closecolor = color\r\n    if (color === 'default') {\r\n        okcolor = 'brand'\r\n        closecolor = 'default'\r\n        variant = 'text'\r\n    } else {\r\n        if (variant === 'fill') {\r\n            okcolor = 'default'\r\n            closecolor = 'default'\r\n        } else {\r\n            okcolor = color\r\n            closecolor = 'default'\r\n        }\r\n    }\r\n\r\n    const modal = useModal(<Alert\r\n        direction={direction}\r\n        sx={{\r\n            px: 2,\r\n            py: 1,\r\n            pt: direction === 'row' ? 1 : 2\r\n        }}\r\n        color={color}\r\n        variant={variant}\r\n        onClose={closeButton ? close : undefined}\r\n        {...rest}\r\n    >\r\n        {typeof content === \"function\" ? content({\r\n            open: () => modal.open(),\r\n            close: () => modal.close(),\r\n            loading: (is: boolean) => setLoading(is),\r\n            isLoading: () => loading\r\n        }) : content}\r\n        <Tag\r\n            sxr={{\r\n                display: \"flex\",\r\n                gap: 1,\r\n                pt: 4,\r\n                flexDirection: \"row\",\r\n                ...sx,\r\n            }}\r\n        >\r\n            {!hideCancelButton && <Button\r\n                disabled={loading}\r\n                color={closecolor}\r\n                variant=\"fill\"\r\n                {...slotProps?.closeButton}\r\n                onClick={async () => {\r\n                    setLoading(true)\r\n                    onCancel && await onCancel()\r\n                    setLoading(false)\r\n                    modal.close()\r\n                }}\r\n            >{cancelButtonText || \"Close\"}</Button>}\r\n            <Button\r\n                loading={loading}\r\n                color={okcolor}\r\n                variant=\"fill\"\r\n                {...slotProps?.okButton}\r\n\r\n                onClick={async () => {\r\n                    setLoading(true)\r\n                    onConfirm && await onConfirm()\r\n                    setLoading(false)\r\n                    modal.close()\r\n                }}\r\n            >{okButtonText || \"OK\"}</Button>\r\n        </Tag>\r\n    </Alert>, {\r\n        ...slotProps?.modal,\r\n        size: sizes[size] || size,\r\n        blur: 40,\r\n        blurMode: blurMode || \"transparent\",\r\n        transition: transition || \"zoom\",\r\n        onClickOutside: async () => {\r\n            if (clickOutsideToClose && !loading) {\r\n                setLoading(true)\r\n                onCancel && await onCancel()\r\n                setLoading(false)\r\n                modal.close()\r\n            }\r\n        }\r\n    })\r\n\r\n    return {\r\n        ...modal,\r\n        loading: (is: boolean) => setLoading(is),\r\n        isLoading: () => loading\r\n    }\r\n}\r\n\r\nexport default useAlert"],"names":[],"mappings":";;;;;;;;;;;AAuCA;AACI;AACA;;;;;;;;;;AAgCI;AACI;;AAEJ;AACI;;AAEJ;AACI;;AAEJ;AACI;AACI;AACI;AACH;;;;AAKb;AACI;AACA;AACA;;;;AAKJ;;;;;;AAKI;;;;;;;;;AASJ;AAGQ;AACA;;AAEH;AAOG;AACA;;AAEA;;;AAkBQ;;;AAGJ;;AAUI;;;;AAaR;;AAEI;;;;AAIR;;AAQR;;"}
+{"version":3,"file":"index.js","sources":["../../src/useAlert/index.tsx"],"sourcesContent":["'use client'\r\n\r\nimport { Tag, UseTransitionVariantTypes } from \"@xanui/core\"\r\nimport Button, { ButtonProps } from \"../Button\";\r\nimport useModal, { UseModalProps } from \"../useModal\";\r\nimport Alert, { AlertProps } from \"../Alert\";\r\nimport React from \"react\";\r\nexport type UseAlertContentProps = {\r\n    open: () => void;\r\n    close: () => void;\r\n    loading: (is: boolean) => void;\r\n    isLoading: () => boolean;\r\n}\r\n\r\nexport type UseAlertContent = React.ReactElement | ((props: UseAlertContentProps) => React.ReactElement)\r\n\r\nexport type UseAlerProps = Omit<AlertProps, 'children' | 'onClose' | 'variant' | \"size\"> & {\r\n    content: string | UseAlertContent,\r\n    size?: \"small\" | \"medium\" | \"large\" | number;\r\n    closeButton?: boolean;\r\n    clickOutsideToClose?: boolean;\r\n    okButtonText?: string;\r\n    cancelButtonText?: string;\r\n    hideOkButton?: boolean;\r\n    hideCancelButton?: boolean;\r\n    buttonPlacement?: \"start\" | \"end\" | \"between\" | \"full\";\r\n    variant?: \"text\" | \"fill\"\r\n    onConfirm?: () => Promise<void> | void;\r\n    onCancel?: () => Promise<void> | void;\r\n    transition?: UseTransitionVariantTypes;\r\n    blurMode?: UseModalProps['blurMode'];\r\n    slotProps?: {\r\n        modal?: UseModalProps;\r\n        okButton?: Omit<ButtonProps, \"children\">;\r\n        closeButton?: Omit<ButtonProps, \"children\">;\r\n    }\r\n}\r\n\r\n\r\nconst useAlert = (props: UseAlerProps) => {\r\n    const [loading, setLoading] = React.useState(false)\r\n    let {\r\n        content,\r\n        size,\r\n        color,\r\n        direction,\r\n        variant,\r\n        closeButton,\r\n        clickOutsideToClose,\r\n        okButtonText,\r\n        cancelButtonText,\r\n        hideOkButton,\r\n        hideCancelButton,\r\n        buttonPlacement,\r\n        onConfirm,\r\n        onCancel,\r\n        transition,\r\n        blurMode,\r\n        slotProps,\r\n        ...rest\r\n    } = props\r\n\r\n    hideOkButton ??= false\r\n    hideCancelButton ??= false\r\n\r\n    size ??= \"small\"\r\n    color ??= 'default'\r\n    variant ??= \"text\"\r\n    direction ??= \"column\"\r\n    buttonPlacement ??= \"end\"\r\n    let sx: any = {};\r\n\r\n    switch (buttonPlacement) {\r\n        case \"start\":\r\n            sx.justifyContent = 'flex-start'\r\n            break;\r\n        case \"end\":\r\n            sx.justifyContent = 'flex-end'\r\n            break;\r\n        case \"between\":\r\n            sx.justifyContent = 'space-between'\r\n            break;\r\n        case \"full\":\r\n            sx = {\r\n                \"& button\": {\r\n                    flex: 1\r\n                }\r\n            }\r\n            break;\r\n    }\r\n\r\n    let sizes: any = {\r\n        small: 320,\r\n        medium: 400,\r\n        large: 600\r\n    }\r\n\r\n    let okcolor = color\r\n    let closecolor = color\r\n    if (color === 'default') {\r\n        okcolor = 'brand'\r\n        closecolor = 'default'\r\n        variant = 'text'\r\n    } else {\r\n        if (variant === 'fill') {\r\n            okcolor = 'default'\r\n            closecolor = 'default'\r\n        } else {\r\n            okcolor = color\r\n            closecolor = 'default'\r\n        }\r\n    }\r\n\r\n    const modal = useModal(<Alert\r\n        direction={direction}\r\n        sx={{\r\n            px: 2,\r\n            py: 1,\r\n            pt: direction === 'row' ? 1 : 2\r\n        }}\r\n        color={color}\r\n        variant={variant}\r\n        onClose={closeButton ? close : undefined}\r\n        {...rest}\r\n    >\r\n        {typeof content === \"function\" ? content({\r\n            open: () => modal.open(),\r\n            close: () => modal.close(),\r\n            loading: (is: boolean) => setLoading(is),\r\n            isLoading: () => loading\r\n        }) : content}\r\n        <Tag\r\n            sxr={{\r\n                display: \"flex\",\r\n                gap: 1,\r\n                pt: 4,\r\n                flexDirection: \"row\",\r\n                ...sx,\r\n            }}\r\n        >\r\n            {!hideCancelButton && <Button\r\n                disabled={loading}\r\n                color={closecolor}\r\n                variant=\"fill\"\r\n                {...slotProps?.closeButton}\r\n                onClick={async () => {\r\n                    setLoading(true)\r\n                    onCancel && await onCancel()\r\n                    setLoading(false)\r\n                    modal.close()\r\n                }}\r\n            >{cancelButtonText || \"Close\"}</Button>}\r\n            <Button\r\n                loading={loading}\r\n                color={okcolor}\r\n                variant=\"fill\"\r\n                {...slotProps?.okButton}\r\n\r\n                onClick={async () => {\r\n                    setLoading(true)\r\n                    onConfirm && await onConfirm()\r\n                    setLoading(false)\r\n                    modal.close()\r\n                }}\r\n            >{okButtonText || \"OK\"}</Button>\r\n        </Tag>\r\n    </Alert>, {\r\n        ...slotProps?.modal,\r\n        size: sizes[size] || size,\r\n        blur: 40,\r\n        blurMode: blurMode || \"transparent\",\r\n        transition: transition || \"zoom\",\r\n        onClickOutside: async () => {\r\n            if (clickOutsideToClose && !loading) {\r\n                setLoading(true)\r\n                onCancel && await onCancel()\r\n                setLoading(false)\r\n                modal.close()\r\n            }\r\n        }\r\n    })\r\n\r\n    return {\r\n        ...modal,\r\n        loading: (is: boolean) => setLoading(is),\r\n        isLoading: () => loading\r\n    }\r\n}\r\n\r\nexport default useAlert"],"names":[],"mappings":";;;;;;;;;AAuCA;AACI;AACA;;;;;;;;;;AAgCI;AACI;;AAEJ;AACI;;AAEJ;AACI;;AAEJ;AACI;AACI;AACI;AACH;;;;AAKb;AACI;AACA;AACA;;;;AAKJ;;;;;;AAKI;;;;;;;;;AASJ;AAGQ;AACA;;AAEH;AAOG;AACA;;AAEA;;;AAkBQ;;;AAGJ;;AAUI;;;;AAaR;;AAEI;;;;AAIR;;AAQR;;"}

package/useBlurCss/index.cjs

@@ -0,0 +1,19 @@
+'use strict';
+
+var React = require('react');
+var core = require('@xanui/core');
+
+let _d;
+const useBlurCss = (blur, mode) => {
+    return React.useMemo(() => {
+        let transparent = { bgcolor: core.alpha("#000000", blur / 100) };
+        if (typeof window === 'undefined' || mode === 'transparent') {
+            return transparent;
+        }
+        const d = _d || (_d = window.document.createElement("div").style);
+        return d['backdropFilter'] !== undefined ? { backdropFilter: `blur(${(blur / 100) * 10}px)` } : transparent;
+    }, [blur]);
+};
+
+module.exports = useBlurCss;
+//# sourceMappingURL=index.cjs.map

package/useBlurCss/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../src/useBlurCss/index.tsx"],"sourcesContent":["import { useMemo } from \"react\"\r\nimport { alpha } from \"@xanui/core\";\r\n\r\nlet _d: CSSStyleDeclaration;\r\n\r\nconst useBlurCss = (blur: number, mode?: \"transparent\" | \"blur\") => {\r\n   return useMemo(() => {\r\n      let transparent = { bgcolor: alpha(\"#000000\", blur / 100) }\r\n      if (typeof window === 'undefined' || mode === 'transparent') {\r\n         return transparent\r\n      }\r\n      const d = _d || (_d = window.document.createElement(\"div\").style)\r\n      return d['backdropFilter'] !== undefined ? { backdropFilter: `blur(${(blur / 100) * 10}px)` } : transparent\r\n   }, [blur])\r\n}\r\n\r\n\r\nexport default useBlurCss"],"names":["useMemo","alpha"],"mappings":";;;;;AAGA,IAAI,EAAuB;AAE3B,MAAM,UAAU,GAAG,CAAC,IAAY,EAAE,IAA6B,KAAI;IAChE,OAAOA,aAAO,CAAC,MAAK;AACjB,QAAA,IAAI,WAAW,GAAG,EAAE,OAAO,EAAEC,UAAK,CAAC,SAAS,EAAE,IAAI,GAAG,GAAG,CAAC,EAAE;QAC3D,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,IAAI,KAAK,aAAa,EAAE;AAC1D,YAAA,OAAO,WAAW;QACrB;AACA,QAAA,MAAM,CAAC,GAAG,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC;QACjE,OAAO,CAAC,CAAC,gBAAgB,CAAC,KAAK,SAAS,GAAG,EAAE,cAAc,EAAE,CAAA,KAAA,EAAQ,CAAC,IAAI,GAAG,GAAG,IAAI,EAAE,CAAA,GAAA,CAAK,EAAE,GAAG,WAAW;AAC9G,IAAA,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;AACb;;;;"}

package/useBlurCss/index.js

@@ -1,12 +1,10 @@
-'use strict';
-
-var React = require('react');
-var core = require('@xanui/core');
+import { useMemo } from 'react';
+import { alpha } from '@xanui/core';
 
 let _d;
 const useBlurCss = (blur, mode) => {
-    return React.useMemo(() => {
-        let transparent = { bgcolor: core.alpha("#000000", blur / 100) };
+    return useMemo(() => {
+        let transparent = { bgcolor: alpha("#000000", blur / 100) };
         if (typeof window === 'undefined' || mode === 'transparent') {
             return transparent;
         }
@@ -15,5 +13,5 @@ const useBlurCss = (blur, mode) => {
     }, [blur]);
 };
 
-module.exports = useBlurCss;
+export { useBlurCss as default };
 //# sourceMappingURL=index.js.map

package/useBlurCss/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/useBlurCss/index.tsx"],"sourcesContent":["import { useMemo } from \"react\"\r\nimport { alpha } from \"@xanui/core\";\r\n\r\nlet _d: CSSStyleDeclaration;\r\n\r\nconst useBlurCss = (blur: number, mode?: \"transparent\" | \"blur\") => {\r\n   return useMemo(() => {\r\n      let transparent = { bgcolor: alpha(\"#000000\", blur / 100) }\r\n      if (typeof window === 'undefined' || mode === 'transparent') {\r\n         return transparent\r\n      }\r\n      const d = _d || (_d = window.document.createElement(\"div\").style)\r\n      return d['backdropFilter'] !== undefined ? { backdropFilter: `blur(${(blur / 100) * 10}px)` } : transparent\r\n   }, [blur])\r\n}\r\n\r\n\r\nexport default useBlurCss"],"names":["useMemo","alpha"],"mappings":";;;;;AAGA,IAAI,EAAuB;AAE3B,MAAM,UAAU,GAAG,CAAC,IAAY,EAAE,IAA6B,KAAI;IAChE,OAAOA,aAAO,CAAC,MAAK;AACjB,QAAA,IAAI,WAAW,GAAG,EAAE,OAAO,EAAEC,UAAK,CAAC,SAAS,EAAE,IAAI,GAAG,GAAG,CAAC,EAAE;QAC3D,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,IAAI,KAAK,aAAa,EAAE;AAC1D,YAAA,OAAO,WAAW;QACrB;AACA,QAAA,MAAM,CAAC,GAAG,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC;QACjE,OAAO,CAAC,CAAC,gBAAgB,CAAC,KAAK,SAAS,GAAG,EAAE,cAAc,EAAE,CAAA,KAAA,EAAQ,CAAC,IAAI,GAAG,GAAG,IAAI,EAAE,CAAA,GAAA,CAAK,EAAE,GAAG,WAAW;AAC9G,IAAA,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;AACb;;;;"}
+{"version":3,"file":"index.js","sources":["../../src/useBlurCss/index.tsx"],"sourcesContent":["import { useMemo } from \"react\"\r\nimport { alpha } from \"@xanui/core\";\r\n\r\nlet _d: CSSStyleDeclaration;\r\n\r\nconst useBlurCss = (blur: number, mode?: \"transparent\" | \"blur\") => {\r\n   return useMemo(() => {\r\n      let transparent = { bgcolor: alpha(\"#000000\", blur / 100) }\r\n      if (typeof window === 'undefined' || mode === 'transparent') {\r\n         return transparent\r\n      }\r\n      const d = _d || (_d = window.document.createElement(\"div\").style)\r\n      return d['backdropFilter'] !== undefined ? { backdropFilter: `blur(${(blur / 100) * 10}px)` } : transparent\r\n   }, [blur])\r\n}\r\n\r\n\r\nexport default useBlurCss"],"names":[],"mappings":";;;AAGA,IAAI,EAAuB;AAE3B,MAAM,UAAU,GAAG,CAAC,IAAY,EAAE,IAA6B,KAAI;IAChE,OAAO,OAAO,CAAC,MAAK;AACjB,QAAA,IAAI,WAAW,GAAG,EAAE,OAAO,EAAE,KAAK,CAAC,SAAS,EAAE,IAAI,GAAG,GAAG,CAAC,EAAE;QAC3D,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,IAAI,KAAK,aAAa,EAAE;AAC1D,YAAA,OAAO,WAAW;QACrB;AACA,QAAA,MAAM,CAAC,GAAG,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC;QACjE,OAAO,CAAC,CAAC,gBAAgB,CAAC,KAAK,SAAS,GAAG,EAAE,cAAc,EAAE,CAAA,KAAA,EAAQ,CAAC,IAAI,GAAG,GAAG,IAAI,EAAE,CAAA,GAAA,CAAK,EAAE,GAAG,WAAW;AAC9G,IAAA,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;AACb;;;;"}

package/useCorner/index.cjs

@@ -0,0 +1,22 @@
+'use strict';
+
+const useCorner = (type) => {
+    switch (type) {
+        case 'square':
+            return {
+                radius: 0
+            };
+        case 'rounded':
+            return {
+                radius: 1
+            };
+        case 'circle':
+            return {
+                radius: 100
+            };
+    }
+    return {};
+};
+
+module.exports = useCorner;
+//# sourceMappingURL=index.cjs.map

package/useCorner/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../src/useCorner/index.ts"],"sourcesContent":["\r\nexport type UseCornerTypes = \"square\" | \"rounded\" | \"circle\"\r\nconst useCorner = (type?: UseCornerTypes): object => {\r\n    switch (type) {\r\n        case 'square':\r\n            return {\r\n                radius: 0\r\n            }\r\n        case 'rounded':\r\n            return {\r\n                radius: 1\r\n            }\r\n        case 'circle':\r\n            return {\r\n                radius: 100\r\n            }\r\n    }\r\n    return {}\r\n}\r\n\r\nexport default useCorner"],"names":[],"mappings":";;AAEA,MAAM,SAAS,GAAG,CAAC,IAAqB,KAAY;IAChD,QAAQ,IAAI;AACR,QAAA,KAAK,QAAQ;YACT,OAAO;AACH,gBAAA,MAAM,EAAE;aACX;AACL,QAAA,KAAK,SAAS;YACV,OAAO;AACH,gBAAA,MAAM,EAAE;aACX;AACL,QAAA,KAAK,QAAQ;YACT,OAAO;AACH,gBAAA,MAAM,EAAE;aACX;;AAET,IAAA,OAAO,EAAE;AACb;;;;"}

package/useCorner/index.js

@@ -1,5 +1,3 @@
-'use strict';
-
 const useCorner = (type) => {
     switch (type) {
         case 'square':
@@ -18,5 +16,5 @@ const useCorner = (type) => {
     return {};
 };
 
-module.exports = useCorner;
+export { useCorner as default };
 //# sourceMappingURL=index.js.map

package/useCorner/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/useCorner/index.ts"],"sourcesContent":["\r\nexport type UseCornerTypes = \"square\" | \"rounded\" | \"circle\"\r\nconst useCorner = (type?: UseCornerTypes): object => {\r\n    switch (type) {\r\n        case 'square':\r\n            return {\r\n                radius: 0\r\n            }\r\n        case 'rounded':\r\n            return {\r\n                radius: 1\r\n            }\r\n        case 'circle':\r\n            return {\r\n                radius: 100\r\n            }\r\n    }\r\n    return {}\r\n}\r\n\r\nexport default useCorner"],"names":[],"mappings":";;AAEA,MAAM,SAAS,GAAG,CAAC,IAAqB,KAAY;IAChD,QAAQ,IAAI;AACR,QAAA,KAAK,QAAQ;YACT,OAAO;AACH,gBAAA,MAAM,EAAE;aACX;AACL,QAAA,KAAK,SAAS;YACV,OAAO;AACH,gBAAA,MAAM,EAAE;aACX;AACL,QAAA,KAAK,QAAQ;YACT,OAAO;AACH,gBAAA,MAAM,EAAE;aACX;;AAET,IAAA,OAAO,EAAE;AACb;;;;"}
+{"version":3,"file":"index.js","sources":["../../src/useCorner/index.ts"],"sourcesContent":["\r\nexport type UseCornerTypes = \"square\" | \"rounded\" | \"circle\"\r\nconst useCorner = (type?: UseCornerTypes): object => {\r\n    switch (type) {\r\n        case 'square':\r\n            return {\r\n                radius: 0\r\n            }\r\n        case 'rounded':\r\n            return {\r\n                radius: 1\r\n            }\r\n        case 'circle':\r\n            return {\r\n                radius: 100\r\n            }\r\n    }\r\n    return {}\r\n}\r\n\r\nexport default useCorner"],"names":[],"mappings":"AAEA,MAAM,SAAS,GAAG,CAAC,IAAqB,KAAY;IAChD,QAAQ,IAAI;AACR,QAAA,KAAK,QAAQ;YACT,OAAO;AACH,gBAAA,MAAM,EAAE;aACX;AACL,QAAA,KAAK,SAAS;YACV,OAAO;AACH,gBAAA,MAAM,EAAE;aACX;AACL,QAAA,KAAK,QAAQ;YACT,OAAO;AACH,gBAAA,MAAM,EAAE;aACX;;AAET,IAAA,OAAO,EAAE;AACb;;;;"}

package/useLayer/index.cjs

@@ -0,0 +1,38 @@
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@xanui/core');
+var React = require('react');
+var index = require('../Layer/index.cjs');
+
+const useLayer = (children, props) => {
+    var _a;
+    const [open, setOpen] = React.useState(false);
+    const portalProps = ((_a = props === null || props === void 0 ? void 0 : props.slotProps) === null || _a === void 0 ? void 0 : _a.portal) || {};
+    const portal = core.usePortal(jsxRuntime.jsx(index, Object.assign({ blur: 20 }, props, { open: open, onClosed: () => {
+            portal.unmount();
+            if (props === null || props === void 0 ? void 0 : props.onClosed) {
+                props.onClosed();
+            }
+        }, onClickOutside: () => {
+            if (props === null || props === void 0 ? void 0 : props.onClickOutside) {
+                props.onClickOutside();
+            }
+            else {
+                setOpen(false);
+            }
+        }, children: typeof children === "function" ? children({ open: () => setOpen(true), close: () => setOpen(false) }) : children })), portalProps);
+    return {
+        open: () => {
+            portal.mount();
+            setOpen(true);
+        },
+        close: () => {
+            setOpen(false);
+        },
+    };
+};
+
+module.exports = useLayer;
+//# sourceMappingURL=index.cjs.map

package/useLayer/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../src/useLayer/index.tsx"],"sourcesContent":["'use client'\r\n\r\nimport { usePortal } from \"@xanui/core\"\r\nimport { useState } from \"react\"\r\nimport Layer, { LayerProps } from \"../Layer\"\r\nimport { UsePortalOptions } from \"@xanui/core/hooks/usePortal\"\r\n\r\nexport type UseLayerProps = Omit<LayerProps, \"open\" | \"children\" | \"slotProps\"> & {\r\n   slotProps?: LayerProps[\"slotProps\"] & {\r\n      portal?: UsePortalOptions\r\n   }\r\n}\r\n\r\nexport type UseLayerReturn = {\r\n   open: () => void;\r\n   close: () => void;\r\n}\r\n\r\nexport type UseLayerChildren = React.ReactElement | ((props: UseLayerReturn) => React.ReactElement)\r\n\r\nconst useLayer = (children: UseLayerChildren, props?: UseLayerProps): UseLayerReturn => {\r\n   const [open, setOpen] = useState(false)\r\n   const portalProps = props?.slotProps?.portal || {}\r\n   const portal = usePortal(<Layer\r\n      blur={20}\r\n      {...props}\r\n      open={open}\r\n      onClosed={() => {\r\n         portal.unmount()\r\n         if (props?.onClosed) {\r\n            props.onClosed()\r\n         }\r\n      }}\r\n      onClickOutside={() => {\r\n         if (props?.onClickOutside) {\r\n            props.onClickOutside()\r\n         } else {\r\n            setOpen(false)\r\n         }\r\n      }}\r\n   >\r\n      {typeof children === \"function\" ? children({ open: () => setOpen(true), close: () => setOpen(false) }) : children}\r\n   </Layer>, portalProps)\r\n\r\n   return {\r\n      open: () => {\r\n         portal.mount()\r\n         setOpen(true)\r\n      },\r\n      close: () => {\r\n         setOpen(false)\r\n      },\r\n   }\r\n}\r\n\r\nexport default useLayer"],"names":[],"mappings":";;;;;;;;AAoBA;;;AAEG;;;;;;AAUG;;;;;;;AAOA;;;;;;;;;;AAcN;;"}