@xanui/ui 1.1.6 → 1.1.7

package/List/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/List/index.tsx"],"sourcesContent":["\nimport React from 'react'\nimport { Tag, TagProps, TagComponentType, useInterface, useColorTemplate, ColorTemplateType, ColorTemplateColors, useBreakpointProps, useBreakpointPropsType } from '@xanui/core'\n\n\nexport type ListProps<T extends TagComponentType = \"ul\"> = Omit<TagProps<T>, 'color'> & {\n    color?: useBreakpointPropsType<ColorTemplateColors>;\n    variant?: useBreakpointPropsType<ColorTemplateType>;\n    hoverColor?: useBreakpointPropsType<ColorTemplateColors>;\n    hoverVariant?: useBreakpointPropsType<ColorTemplateType>;\n}\n\nconst List = React.forwardRef(<T extends TagComponentType = \"ul\">({ children, ...rest }: ListProps<T>, ref: React.Ref<any>) => {\n    let [{ sx, color, variant, hoverColor, hoverVariant, ...props }] = useInterface<any>(\"List\", rest, {})\n    const _p: any = {}\n    if (color) _p.color = color\n    if (variant) _p.variant = variant\n    if (hoverColor) _p.hoverColor = hoverColor\n    if (hoverVariant) _p.hoverVariant = hoverVariant\n    const p: any = useBreakpointProps(_p)\n\n    color = p.color ?? \"brand\"\n    variant = p.variant ?? \"fill\"\n    hoverColor = p.hoverColor ?? \"default\"\n    hoverVariant = p.hoverVariant ?? \"alpha\"\n\n    const template = { ...useColorTemplate(color, variant) }\n    const hoverTemplate = { ...useColorTemplate(hoverColor, hoverVariant) }\n    delete template.hover\n    delete hoverTemplate.hover\n\n    let sxOutline: any = {}\n    if (hoverVariant == 'outline' || variant === 'outline') {\n        sxOutline = {\n            \"& .list-item\": {\n                border: 1,\n                borderColor: \"transparent\"\n            }\n        }\n    }\n\n    return (\n        <Tag\n            component='ul'\n            {...props}\n            baseClass='list'\n            sxr={{\n                listStyle: \"none\",\n                p: 0,\n                m: 0,\n                ...sxOutline,\n                \"& .list-item-icon\": {\n                    color: \"text.secondary\"\n                },\n                \"& .list-item-text\": {\n                    color: \"text.primary\"\n                },\n                \"& .list-item-subtitle\": {\n                    color: \"text.secondary\"\n                },\n                \"& .xui-list-item:not(.list-item-selected):hover\": {\n                    ...hoverTemplate,\n                    \"& .list-item-icon\": {\n                        color: hoverTemplate.color\n                    },\n                    \"& .list-item-text\": {\n                        color: hoverTemplate.color\n                    },\n                    \"& .list-item-subtitle\": {\n                        color: hoverColor === 'default' ? \"text.secondary\" : hoverTemplate.color\n                    },\n                },\n                \"& .xui-list-item.list-item-selected\": {\n                    ...template,\n                    \"& .list-item-icon\": {\n                        color: template.color\n                    },\n                    \"& .list-item-text\": {\n                        color: template.color\n                    },\n                    \"& .list-item-subtitle\": {\n                        color: template.color\n                    },\n                },\n                ...(sx || {} as any)\n            }}\n            ref={ref}\n        >\n            {children}\n        </Tag>\n    )\n})\n\nexport default List"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../src/List/index.tsx"],"sourcesContent":["\nimport React from 'react'\nimport { Tag, TagProps, TagComponentType, useInterface, useColorTemplate, UseColorTemplateType, UseColorTemplateColor, useBreakpointProps, useBreakpointPropsType } from '@xanui/core'\n\n\nexport type ListProps<T extends TagComponentType = \"ul\"> = Omit<TagProps<T>, 'color'> & {\n    color?: useBreakpointPropsType<UseColorTemplateColor>;\n    variant?: useBreakpointPropsType<UseColorTemplateType>;\n    hoverColor?: useBreakpointPropsType<UseColorTemplateColor>;\n    hoverVariant?: useBreakpointPropsType<UseColorTemplateType>;\n}\n\nconst List = React.forwardRef(<T extends TagComponentType = \"ul\">({ children, ...rest }: ListProps<T>, ref: React.Ref<any>) => {\n    let [{ sx, color, variant, hoverColor, hoverVariant, ...props }] = useInterface<any>(\"List\", rest, {})\n    const _p: any = {}\n    if (color) _p.color = color\n    if (variant) _p.variant = variant\n    if (hoverColor) _p.hoverColor = hoverColor\n    if (hoverVariant) _p.hoverVariant = hoverVariant\n    const p: any = useBreakpointProps(_p)\n\n    color = p.color ?? \"brand\"\n    variant = p.variant ?? \"fill\"\n    hoverColor = p.hoverColor ?? \"default\"\n    hoverVariant = p.hoverVariant ?? \"soft\"\n\n    const template = useColorTemplate(color, variant)\n    const hoverTemplate = useColorTemplate(hoverColor, hoverVariant)\n\n    let sxOutline: any = {}\n    if (hoverVariant == 'outline' || variant === 'outline') {\n        sxOutline = {\n            \"& .list-item\": {\n                border: \"1px solid\",\n                borderColor: \"transparent\"\n            }\n        }\n    }\n\n    return (\n        <Tag\n            component='ul'\n            {...props}\n            baseClass='list'\n            sxr={{\n                listStyle: \"none\",\n                p: 0,\n                m: 0,\n                ...sxOutline,\n                \"& .list-item-icon\": {\n                    color: \"text.secondary\"\n                },\n                \"& .list-item-text\": {\n                    color: \"text.primary\"\n                },\n                \"& .list-item-subtitle\": {\n                    color: \"text.secondary\"\n                },\n                \"& .xui-list-item:not(.list-item-selected):hover\": {\n                    ...hoverTemplate.primary,\n                    \"& .list-item-icon\": {\n                        color: hoverTemplate.primary.color\n                    },\n                    \"& .list-item-text\": {\n                        color: hoverTemplate.primary.color\n                    },\n                    \"& .list-item-subtitle\": {\n                        color: hoverColor === 'default' ? \"text.secondary\" : hoverTemplate.primary.color\n                    },\n                },\n                \"& .xui-list-item.list-item-selected\": {\n                    ...template.primary,\n                    \"& .list-item-icon\": {\n                        color: template.primary.color\n                    },\n                    \"& .list-item-text\": {\n                        color: template.primary.color\n                    },\n                    \"& .list-item-subtitle\": {\n                        color: template.primary.color\n                    },\n                },\n                ...(sx || {} as any)\n            }}\n            ref={ref}\n        >\n            {children}\n        </Tag>\n    )\n})\n\nexport default List"],"names":["_jsx"],"mappings":"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"}

package/LoadingBox/index.d.ts

@@ -1,10 +1,10 @@
 import React from 'react';
-import { TagComponentType, TagProps, useBreakpointPropsType, ColorTemplateColors } from '@xanui/core';
+import { TagComponentType, TagProps, useBreakpointPropsType, UseColorTemplateColor } from '@xanui/core';
 import { CircleProgressProps } from '../CircleProgress/index.js';
 
 type LoadingBoxProps<T extends TagComponentType = "div"> = Omit<TagProps<T>, "color"> & {
     loading?: boolean;
-    color?: useBreakpointPropsType<ColorTemplateColors>;
+    color?: useBreakpointPropsType<UseColorTemplateColor>;
     slotProps?: {
         CircleProgress?: Omit<CircleProgressProps, "value">;
     };

package/LoadingBox/index.js

@@ -1,13 +1,13 @@
 'use strict';Object.defineProperty(exports,'__esModule',{value:true});var tslib=require('tslib'),jsxRuntime=require('react/jsx-runtime'),React=require('react'),core=require('@xanui/core'),index=require('../CircleProgress/index.js');const LoadingBox = React.forwardRef((_a, ref) => {
-    var _b, _c;
+    var _b;
     var { children } = _a, props = tslib.__rest(_a, ["children"]);
-    let [_d] = core.useInterface("LoadingBox", props, {}), { loading, color, slotProps } = _d, rest = tslib.__rest(_d, ["loading", "color", "slotProps"]);
+    let [_c] = core.useInterface("LoadingBox", props, {}), { loading, color, slotProps } = _c, rest = tslib.__rest(_c, ["loading", "color", "slotProps"]);
     const _p = {};
     if (color)
         _p.color = color;
     const p = core.useBreakpointProps(_p);
     color = (_b = p.color) !== null && _b !== void 0 ? _b : "brand";
-    return (jsxRuntime.jsxs(core.Tag, Object.assign({ baseClass: 'loading-box' }, rest, { sxr: Object.assign({ position: "relative", display: "inline-block" }, (rest.sx || {})), disabled: (_c = loading !== null && loading !== void 0 ? loading : rest.disabled) !== null && _c !== void 0 ? _c : false, ref: ref, children: [loading && jsxRuntime.jsx(core.Tag, { baseClass: "loading-box-container", sxr: {
+    return (jsxRuntime.jsxs(core.Tag, Object.assign({ baseClass: 'loading-box' }, rest, { sxr: Object.assign({ position: "relative", display: "inline-block", overflow: "hidden" }, (rest.sx || {})), ref: ref, children: [loading && jsxRuntime.jsx(core.Tag, { baseClass: "loading-box-container", sxr: {
                     position: "absolute",
                     top: 0,
                     left: 0,
@@ -17,6 +17,5 @@
                     display: "flex",
                     justifyContent: "center",
                     alignItems: "center",
-                    bgcolor: "background.alpha"
-                }, children: jsxRuntime.jsx(index.default, Object.assign({ color: "brand", hideTrack: true }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.CircleProgress)) }), children] })));
+                }, children: jsxRuntime.jsx(index.default, Object.assign({ color: "brand", hideTrack: true }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.CircleProgress)) }), jsxRuntime.jsx(core.Tag, { disabled: loading, children: children })] })));
 });exports.default=LoadingBox;//# sourceMappingURL=index.js.map

package/LoadingBox/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/LoadingBox/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, ColorTemplateColors, useInterface, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\nimport CircleProgress, { CircleProgressProps } from '../CircleProgress';\n\n\nexport type LoadingBoxProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n    loading?: boolean;\n    color?: useBreakpointPropsType<ColorTemplateColors>;\n    slotProps?: {\n        CircleProgress?: Omit<CircleProgressProps, \"value\">\n    }\n\n}\n\nconst LoadingBox = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...props }: LoadingBoxProps<T>, ref: React.Ref<any>) => {\n    let [{ loading, color, slotProps, ...rest }] = useInterface<any>(\"LoadingBox\", props, {})\n    const _p: any = {}\n    if (color) _p.color = color\n    const p: any = useBreakpointProps(_p)\n    color = p.color ?? \"brand\"\n\n    return (\n        <Tag\n            baseClass='loading-box'\n            {...rest}\n            sxr={{\n                position: \"relative\",\n                display: \"inline-block\",\n                ...((rest as any).sx || {})\n            }}\n            disabled={loading ?? rest.disabled ?? false}\n            ref={ref}\n        >\n            {loading && <Tag\n                baseClass=\"loading-box-container\"\n                sxr={{\n                    position: \"absolute\",\n                    top: 0,\n                    left: 0,\n                    right: 0,\n                    bottom: 0,\n                    zIndex: 1,\n                    display: \"flex\",\n                    justifyContent: \"center\",\n                    alignItems: \"center\",\n                    bgcolor: \"background.alpha\"\n                }}\n            >\n                <CircleProgress\n                    color=\"brand\"\n                    hideTrack\n                    {...slotProps?.CircleProgress}\n                />\n            </Tag>}\n            {children}\n        </Tag>\n    )\n})\n\nexport default LoadingBox\n\n"],"names":["__rest","useInterface","useBreakpointProps","_jsxs","Tag","_jsx","CircleProgress"],"mappings":"wOAeA,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAA0C,EAAE,GAAmB,KAAI;;AAAnE,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAgC,EAA3B,KAAK,GAAAA,YAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;IACzF,IAAI,CAAA,EAAA,CAAA,GAA2CC,iBAAY,CAAM,YAAY,EAAE,KAAK,EAAE,EAAE,CAAC,EAApF,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAA,GAAA,EAAW,EAAN,IAAI,GAAAD,YAAA,CAAA,EAAA,EAApC,CAAA,SAAA,EAAA,OAAA,EAAA,WAAA,CAAsC,CAA8C;IACzF,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,MAAM,CAAC,GAAQE,uBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,OAAO;IAE1B,QACIC,eAAA,CAACC,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,EAAC,aAAa,EAAA,EACnB,IAAI,EAAA,EACR,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,cAAc,EAAA,GAClB,IAAY,CAAC,EAAE,IAAI,EAAE,EAAC,EAE/B,QAAQ,EAAE,CAAA,EAAA,GAAA,OAAO,KAAA,IAAA,IAAP,OAAO,KAAA,MAAA,GAAP,OAAO,GAAI,IAAI,CAAC,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,KAAK,EAC3C,GAAG,EAAE,GAAG,EAAA,QAAA,EAAA,CAEP,OAAO,IAAIC,cAAA,CAACD,QAAG,EAAA,EACZ,SAAS,EAAC,uBAAuB,EACjC,GAAG,EAAE;AACD,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,GAAG,EAAE,CAAC;AACN,oBAAA,IAAI,EAAE,CAAC;AACP,oBAAA,KAAK,EAAE,CAAC;AACR,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,OAAO,EAAE,MAAM;AACf,oBAAA,cAAc,EAAE,QAAQ;AACxB,oBAAA,UAAU,EAAE,QAAQ;AACpB,oBAAA,OAAO,EAAE;iBACZ,EAAA,QAAA,EAEDC,cAAA,CAACC,aAAc,EAAA,MAAA,CAAA,MAAA,CAAA,EACX,KAAK,EAAC,OAAO,EACb,SAAS,EAAA,IAAA,EAAA,EACL,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,cAAc,CAAA,CAC/B,GACA,EACL,QAAQ,CAAA,EAAA,CAAA,CACP;AAEd,CAAC"}
+{"version":3,"file":"index.js","sources":["../../src/LoadingBox/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, UseColorTemplateColor, useInterface, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\nimport CircleProgress, { CircleProgressProps } from '../CircleProgress';\n\n\nexport type LoadingBoxProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n    loading?: boolean;\n    color?: useBreakpointPropsType<UseColorTemplateColor>;\n    slotProps?: {\n        CircleProgress?: Omit<CircleProgressProps, \"value\">\n    }\n\n}\n\nconst LoadingBox = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...props }: LoadingBoxProps<T>, ref: React.Ref<any>) => {\n    let [{ loading, color, slotProps, ...rest }] = useInterface<any>(\"LoadingBox\", props, {})\n    const _p: any = {}\n    if (color) _p.color = color\n    const p: any = useBreakpointProps(_p)\n    color = p.color ?? \"brand\"\n\n    return (\n        <Tag\n            baseClass='loading-box'\n            {...rest}\n            sxr={{\n                position: \"relative\",\n                display: \"inline-block\",\n                overflow: \"hidden\",\n                ...((rest as any).sx || {})\n            }}\n            ref={ref}\n        >\n            {loading && <Tag\n                baseClass=\"loading-box-container\"\n                sxr={{\n                    position: \"absolute\",\n                    top: 0,\n                    left: 0,\n                    right: 0,\n                    bottom: 0,\n                    zIndex: 1,\n                    display: \"flex\",\n                    justifyContent: \"center\",\n                    alignItems: \"center\",\n                }}\n            >\n                <CircleProgress\n                    color=\"brand\"\n                    hideTrack\n                    {...slotProps?.CircleProgress}\n                />\n            </Tag>}\n            <Tag\n                disabled={loading}\n            >\n                {children}\n            </Tag>\n        </Tag>\n    )\n})\n\nexport default LoadingBox\n\n"],"names":["__rest","useInterface","useBreakpointProps","_jsxs","Tag","_jsx","CircleProgress"],"mappings":"wOAeA,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAA0C,EAAE,GAAmB,KAAI;;AAAnE,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAgC,EAA3B,KAAK,GAAAA,YAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;IACzF,IAAI,CAAA,EAAA,CAAA,GAA2CC,iBAAY,CAAM,YAAY,EAAE,KAAK,EAAE,EAAE,CAAC,EAApF,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAA,GAAA,EAAW,EAAN,IAAI,GAAAD,YAAA,CAAA,EAAA,EAApC,CAAA,SAAA,EAAA,OAAA,EAAA,WAAA,CAAsC,CAA8C;IACzF,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,MAAM,CAAC,GAAQE,uBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,OAAO;IAE1B,QACIC,gBAACC,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,EAAC,aAAa,IACnB,IAAI,EAAA,EACR,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,cAAc,EACvB,QAAQ,EAAE,QAAQ,KACb,IAAY,CAAC,EAAE,IAAI,EAAE,EAAC,EAE/B,GAAG,EAAE,GAAG,aAEP,OAAO,IAAIC,eAACD,QAAG,EAAA,EACZ,SAAS,EAAC,uBAAuB,EACjC,GAAG,EAAE;AACD,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,GAAG,EAAE,CAAC;AACN,oBAAA,IAAI,EAAE,CAAC;AACP,oBAAA,KAAK,EAAE,CAAC;AACR,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,OAAO,EAAE,MAAM;AACf,oBAAA,cAAc,EAAE,QAAQ;AACxB,oBAAA,UAAU,EAAE,QAAQ;AACvB,iBAAA,EAAA,QAAA,EAEDC,cAAA,CAACC,aAAc,EAAA,MAAA,CAAA,MAAA,CAAA,EACX,KAAK,EAAC,OAAO,EACb,SAAS,EAAA,IAAA,EAAA,EACL,SAAS,KAAA,IAAA,IAAT,SAAS,uBAAT,SAAS,CAAE,cAAc,CAAA,CAC/B,EAAA,CACA,EACND,cAAA,CAACD,QAAG,EAAA,EACA,QAAQ,EAAE,OAAO,EAAA,QAAA,EAEhB,QAAQ,EAAA,CACP,CAAA,EAAA,CAAA,CACJ;AAEd,CAAC"}

package/LoadingBox/index.mjs

@@ -1,13 +1,13 @@
 import {__rest}from'tslib';import {jsxs,jsx}from'react/jsx-runtime';import React from'react';import {useInterface,useBreakpointProps,Tag}from'@xanui/core';import CircleProgress from'../CircleProgress/index.mjs';const LoadingBox = React.forwardRef((_a, ref) => {
-    var _b, _c;
+    var _b;
     var { children } = _a, props = __rest(_a, ["children"]);
-    let [_d] = useInterface("LoadingBox", props, {}), { loading, color, slotProps } = _d, rest = __rest(_d, ["loading", "color", "slotProps"]);
+    let [_c] = useInterface("LoadingBox", props, {}), { loading, color, slotProps } = _c, rest = __rest(_c, ["loading", "color", "slotProps"]);
     const _p = {};
     if (color)
         _p.color = color;
     const p = useBreakpointProps(_p);
     color = (_b = p.color) !== null && _b !== void 0 ? _b : "brand";
-    return (jsxs(Tag, Object.assign({ baseClass: 'loading-box' }, rest, { sxr: Object.assign({ position: "relative", display: "inline-block" }, (rest.sx || {})), disabled: (_c = loading !== null && loading !== void 0 ? loading : rest.disabled) !== null && _c !== void 0 ? _c : false, ref: ref, children: [loading && jsx(Tag, { baseClass: "loading-box-container", sxr: {
+    return (jsxs(Tag, Object.assign({ baseClass: 'loading-box' }, rest, { sxr: Object.assign({ position: "relative", display: "inline-block", overflow: "hidden" }, (rest.sx || {})), ref: ref, children: [loading && jsx(Tag, { baseClass: "loading-box-container", sxr: {
                     position: "absolute",
                     top: 0,
                     left: 0,
@@ -17,6 +17,5 @@ import {__rest}from'tslib';import {jsxs,jsx}from'react/jsx-runtime';import React
                     display: "flex",
                     justifyContent: "center",
                     alignItems: "center",
-                    bgcolor: "background.alpha"
-                }, children: jsx(CircleProgress, Object.assign({ color: "brand", hideTrack: true }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.CircleProgress)) }), children] })));
+                }, children: jsx(CircleProgress, Object.assign({ color: "brand", hideTrack: true }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.CircleProgress)) }), jsx(Tag, { disabled: loading, children: children })] })));
 });export{LoadingBox as default};//# sourceMappingURL=index.mjs.map

package/LoadingBox/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/LoadingBox/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, ColorTemplateColors, useInterface, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\nimport CircleProgress, { CircleProgressProps } from '../CircleProgress';\n\n\nexport type LoadingBoxProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n    loading?: boolean;\n    color?: useBreakpointPropsType<ColorTemplateColors>;\n    slotProps?: {\n        CircleProgress?: Omit<CircleProgressProps, \"value\">\n    }\n\n}\n\nconst LoadingBox = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...props }: LoadingBoxProps<T>, ref: React.Ref<any>) => {\n    let [{ loading, color, slotProps, ...rest }] = useInterface<any>(\"LoadingBox\", props, {})\n    const _p: any = {}\n    if (color) _p.color = color\n    const p: any = useBreakpointProps(_p)\n    color = p.color ?? \"brand\"\n\n    return (\n        <Tag\n            baseClass='loading-box'\n            {...rest}\n            sxr={{\n                position: \"relative\",\n                display: \"inline-block\",\n                ...((rest as any).sx || {})\n            }}\n            disabled={loading ?? rest.disabled ?? false}\n            ref={ref}\n        >\n            {loading && <Tag\n                baseClass=\"loading-box-container\"\n                sxr={{\n                    position: \"absolute\",\n                    top: 0,\n                    left: 0,\n                    right: 0,\n                    bottom: 0,\n                    zIndex: 1,\n                    display: \"flex\",\n                    justifyContent: \"center\",\n                    alignItems: \"center\",\n                    bgcolor: \"background.alpha\"\n                }}\n            >\n                <CircleProgress\n                    color=\"brand\"\n                    hideTrack\n                    {...slotProps?.CircleProgress}\n                />\n            </Tag>}\n            {children}\n        </Tag>\n    )\n})\n\nexport default LoadingBox\n\n"],"names":["_jsxs","_jsx"],"mappings":"mNAeA,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAA0C,EAAE,GAAmB,KAAI;;AAAnE,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAgC,EAA3B,KAAK,GAAA,MAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;IACzF,IAAI,CAAA,EAAA,CAAA,GAA2C,YAAY,CAAM,YAAY,EAAE,KAAK,EAAE,EAAE,CAAC,EAApF,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAA,GAAA,EAAW,EAAN,IAAI,GAAA,MAAA,CAAA,EAAA,EAApC,CAAA,SAAA,EAAA,OAAA,EAAA,WAAA,CAAsC,CAA8C;IACzF,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,MAAM,CAAC,GAAQ,kBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,OAAO;IAE1B,QACIA,IAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,EAAC,aAAa,EAAA,EACnB,IAAI,EAAA,EACR,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,cAAc,EAAA,GAClB,IAAY,CAAC,EAAE,IAAI,EAAE,EAAC,EAE/B,QAAQ,EAAE,CAAA,EAAA,GAAA,OAAO,KAAA,IAAA,IAAP,OAAO,KAAA,MAAA,GAAP,OAAO,GAAI,IAAI,CAAC,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,KAAK,EAC3C,GAAG,EAAE,GAAG,EAAA,QAAA,EAAA,CAEP,OAAO,IAAIC,GAAA,CAAC,GAAG,EAAA,EACZ,SAAS,EAAC,uBAAuB,EACjC,GAAG,EAAE;AACD,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,GAAG,EAAE,CAAC;AACN,oBAAA,IAAI,EAAE,CAAC;AACP,oBAAA,KAAK,EAAE,CAAC;AACR,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,OAAO,EAAE,MAAM;AACf,oBAAA,cAAc,EAAE,QAAQ;AACxB,oBAAA,UAAU,EAAE,QAAQ;AACpB,oBAAA,OAAO,EAAE;iBACZ,EAAA,QAAA,EAEDA,GAAA,CAAC,cAAc,EAAA,MAAA,CAAA,MAAA,CAAA,EACX,KAAK,EAAC,OAAO,EACb,SAAS,EAAA,IAAA,EAAA,EACL,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,cAAc,CAAA,CAC/B,GACA,EACL,QAAQ,CAAA,EAAA,CAAA,CACP;AAEd,CAAC"}
+{"version":3,"file":"index.mjs","sources":["../../src/LoadingBox/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, UseColorTemplateColor, useInterface, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\nimport CircleProgress, { CircleProgressProps } from '../CircleProgress';\n\n\nexport type LoadingBoxProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n    loading?: boolean;\n    color?: useBreakpointPropsType<UseColorTemplateColor>;\n    slotProps?: {\n        CircleProgress?: Omit<CircleProgressProps, \"value\">\n    }\n\n}\n\nconst LoadingBox = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...props }: LoadingBoxProps<T>, ref: React.Ref<any>) => {\n    let [{ loading, color, slotProps, ...rest }] = useInterface<any>(\"LoadingBox\", props, {})\n    const _p: any = {}\n    if (color) _p.color = color\n    const p: any = useBreakpointProps(_p)\n    color = p.color ?? \"brand\"\n\n    return (\n        <Tag\n            baseClass='loading-box'\n            {...rest}\n            sxr={{\n                position: \"relative\",\n                display: \"inline-block\",\n                overflow: \"hidden\",\n                ...((rest as any).sx || {})\n            }}\n            ref={ref}\n        >\n            {loading && <Tag\n                baseClass=\"loading-box-container\"\n                sxr={{\n                    position: \"absolute\",\n                    top: 0,\n                    left: 0,\n                    right: 0,\n                    bottom: 0,\n                    zIndex: 1,\n                    display: \"flex\",\n                    justifyContent: \"center\",\n                    alignItems: \"center\",\n                }}\n            >\n                <CircleProgress\n                    color=\"brand\"\n                    hideTrack\n                    {...slotProps?.CircleProgress}\n                />\n            </Tag>}\n            <Tag\n                disabled={loading}\n            >\n                {children}\n            </Tag>\n        </Tag>\n    )\n})\n\nexport default LoadingBox\n\n"],"names":["_jsxs","_jsx"],"mappings":"mNAeA,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAA0C,EAAE,GAAmB,KAAI;;AAAnE,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAgC,EAA3B,KAAK,GAAA,MAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;IACzF,IAAI,CAAA,EAAA,CAAA,GAA2C,YAAY,CAAM,YAAY,EAAE,KAAK,EAAE,EAAE,CAAC,EAApF,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAA,GAAA,EAAW,EAAN,IAAI,GAAA,MAAA,CAAA,EAAA,EAApC,CAAA,SAAA,EAAA,OAAA,EAAA,WAAA,CAAsC,CAA8C;IACzF,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,MAAM,CAAC,GAAQ,kBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,OAAO;IAE1B,QACIA,KAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,EAAC,aAAa,IACnB,IAAI,EAAA,EACR,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,cAAc,EACvB,QAAQ,EAAE,QAAQ,KACb,IAAY,CAAC,EAAE,IAAI,EAAE,EAAC,EAE/B,GAAG,EAAE,GAAG,aAEP,OAAO,IAAIC,IAAC,GAAG,EAAA,EACZ,SAAS,EAAC,uBAAuB,EACjC,GAAG,EAAE;AACD,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,GAAG,EAAE,CAAC;AACN,oBAAA,IAAI,EAAE,CAAC;AACP,oBAAA,KAAK,EAAE,CAAC;AACR,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,OAAO,EAAE,MAAM;AACf,oBAAA,cAAc,EAAE,QAAQ;AACxB,oBAAA,UAAU,EAAE,QAAQ;AACvB,iBAAA,EAAA,QAAA,EAEDA,GAAA,CAAC,cAAc,EAAA,MAAA,CAAA,MAAA,CAAA,EACX,KAAK,EAAC,OAAO,EACb,SAAS,EAAA,IAAA,EAAA,EACL,SAAS,KAAA,IAAA,IAAT,SAAS,uBAAT,SAAS,CAAE,cAAc,CAAA,CAC/B,EAAA,CACA,EACNA,GAAA,CAAC,GAAG,EAAA,EACA,QAAQ,EAAE,OAAO,EAAA,QAAA,EAEhB,QAAQ,EAAA,CACP,CAAA,EAAA,CAAA,CACJ;AAEd,CAAC"}

package/Menu/index.js

@@ -34,14 +34,14 @@
     }, [closed]);
     if (closed)
         return jsxRuntime.jsx(jsxRuntime.Fragment, {});
-    return (jsxRuntime.jsx(index.default, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.portal, { children: jsxRuntime.jsx(index$1.default, { baseClass: "menu", id: id, sx: {
-                position: "fixed",
-                zIndex: 1500 + (zIndex || 0)
-            }, onClickOutside: () => {
+    return (jsxRuntime.jsx(index.default, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.portal, { children: jsxRuntime.jsx(index$1.default, { onClickOutside: () => {
                 onClickOutside && onClickOutside();
-            }, children: jsxRuntime.jsx(core.Transition, Object.assign({ duration: 200, easing: "easeInOut", variant: "grow" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition, { open: isOpen, onClosed: () => {
-                    var _a, _b;
-                    setClosed(true);
-                    ((_a = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _a === void 0 ? void 0 : _a.onClosed) && ((_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _b === void 0 ? void 0 : _b.onClosed());
-                }, children: jsxRuntime.jsx(core.Tag, Object.assign({ baseClass: 'menu-content' }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.content, { sxr: Object.assign({ overflow: "hidden", bgcolor: "background.primary", shadow: 5, radius: 1, transformOrigin: getOrigin.getOrigin(placed) || "top" }, (_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.content) === null || _b === void 0 ? void 0 : _b.sx), children: children })) })) }) })));
+            }, children: jsxRuntime.jsx(core.Tag, { baseClass: "menu", id: id, sx: {
+                    position: "fixed",
+                    zIndex: 1500 + (zIndex || 0)
+                }, children: jsxRuntime.jsx(core.Transition, Object.assign({ duration: 200, easing: "easeInOut", variant: "grow" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition, { open: isOpen, onClosed: () => {
+                        var _a, _b;
+                        setClosed(true);
+                        ((_a = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _a === void 0 ? void 0 : _a.onClosed) && ((_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _b === void 0 ? void 0 : _b.onClosed());
+                    }, children: jsxRuntime.jsx(core.Tag, Object.assign({ baseClass: 'menu-content' }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.content, { sxr: Object.assign({ overflow: "hidden", bgcolor: "background.primary", shadow: 10, radius: 1, transformOrigin: getOrigin.getOrigin(placed) || "top" }, (_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.content) === null || _b === void 0 ? void 0 : _b.sx), children: children })) })) }) }) })));
 };exports.default=Menu;//# sourceMappingURL=index.js.map

package/Menu/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/Menu/index.tsx"],"sourcesContent":["import { ReactNode, useEffect, useId, useState } from 'react'\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\"\nimport { placedMenu, PlacementTypes } from \"./placedMenu\";\nimport Portal, { PortalProps } from \"../Portal\";\nimport { getOrigin } from './getOrigin';\nimport ClickOutside from '../ClickOutside';\n\n\nexport type MenuProps = {\n    children?: ReactNode;\n    target?: HTMLElement;\n    placement?: useBreakpointPropsType<PlacementTypes>;\n    zIndex?: number;\n    onClickOutside?: () => void;\n    slotProps?: {\n        transition?: Omit<TransitionProps, \"open\">;\n        portal?: Omit<PortalProps, \"children\">;\n        content?: Omit<TagProps<\"div\">, \"children\">;\n    }\n}\n\nconst Menu = ({ children, target, ...props }: MenuProps) => {\n    let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface<any>(\"Menu\", props, {})\n    const _p: any = {}\n    if (placement) _p.placement = placement\n    const p: any = useBreakpointProps(_p)\n    placement = p.placement\n\n    const isOpen = Boolean(target)\n    const [closed, setClosed] = useState(!isOpen)\n    let id = \"menu-\" + useId().replace(\":\", \"\")\n    const [placed, setPlaced] = useState<any>(placement)\n    placement = placement || \"bottom-left\"\n\n    useEffect(() => {\n        if (closed && isOpen) {\n            setClosed(false)\n        }\n    }, [isOpen])\n\n    useEffect(() => {\n        if (!closed) {\n            setTimeout(() => {\n                const ele = document.getElementById(id)\n                if (target && ele) {\n                    let p = placedMenu({\n                        place: placement as any,\n                        menu: ele,\n                        target\n                    })\n                    setPlaced(p)\n                }\n            }, 1);\n        }\n    }, [closed])\n\n    if (closed) return <></>\n\n    return (\n        <Portal {...slotProps?.portal}>\n            <ClickOutside\n                baseClass=\"menu\"\n                id={id}\n                sx={{\n                    position: \"fixed\",\n                    zIndex: 1500 + (zIndex || 0)\n                }}\n                onClickOutside={() => {\n                    onClickOutside && onClickOutside()\n                }}\n            >\n                <Transition\n                    duration={200}\n                    easing=\"easeInOut\"\n                    variant=\"grow\"\n                    {...slotProps?.transition}\n                    open={isOpen}\n                    onClosed={() => {\n                        setClosed(true)\n                        slotProps?.transition?.onClosed && slotProps?.transition?.onClosed()\n                    }}\n                >\n                    <Tag\n                        baseClass='menu-content'\n                        {...slotProps?.content}\n                        sxr={{\n                            overflow: \"hidden\",\n                            bgcolor: \"background.primary\",\n                            shadow: 5,\n                            radius: 1,\n                            transformOrigin: getOrigin(placed) || \"top\",\n                            ...slotProps?.content?.sx\n                        }}\n                    >\n                        {children}\n                    </Tag>\n                </Transition>\n            </ClickOutside>\n        </Portal>\n    )\n}\n\nexport default Menu"],"names":["__rest","useInterface","useBreakpointProps","useState","useId","useEffect","placedMenu","_jsx","Portal","ClickOutside","Transition","Tag","getOrigin"],"mappings":"sVAqBA,MAAM,IAAI,GAAG,CAAC,EAAyC,KAAI;;QAA7C,EAAE,QAAQ,EAAE,MAAM,EAAA,GAAA,EAAuB,EAAlB,KAAK,GAAAA,YAAA,CAAA,EAAA,EAA5B,sBAA8B,CAAF;IACtC,IAAI,CAAC,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,GAAGC,iBAAY,CAAM,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC;IAC7F,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,SAAS;AAAE,QAAA,EAAE,CAAC,SAAS,GAAG,SAAS;AACvC,IAAA,MAAM,CAAC,GAAQC,uBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,SAAS,GAAG,CAAC,CAAC,SAAS;AAEvB,IAAA,MAAM,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC;IAC9B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGC,cAAQ,CAAC,CAAC,MAAM,CAAC;AAC7C,IAAA,IAAI,EAAE,GAAG,OAAO,GAAGC,WAAK,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC;IAC3C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGD,cAAQ,CAAM,SAAS,CAAC;AACpD,IAAA,SAAS,GAAG,SAAS,IAAI,aAAa;IAEtCE,eAAS,CAAC,MAAK;AACX,QAAA,IAAI,MAAM,IAAI,MAAM,EAAE;YAClB,SAAS,CAAC,KAAK,CAAC;QACpB;AACJ,IAAA,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;IAEZA,eAAS,CAAC,MAAK;QACX,IAAI,CAAC,MAAM,EAAE;YACT,UAAU,CAAC,MAAK;gBACZ,MAAM,GAAG,GAAG,QAAQ,CAAC,cAAc,CAAC,EAAE,CAAC;AACvC,gBAAA,IAAI,MAAM,IAAI,GAAG,EAAE;oBACf,IAAI,CAAC,GAAGC,qBAAU,CAAC;AACf,wBAAA,KAAK,EAAE,SAAgB;AACvB,wBAAA,IAAI,EAAE,GAAG;wBACT;AACH,qBAAA,CAAC;oBACF,SAAS,CAAC,CAAC,CAAC;gBAChB;YACJ,CAAC,EAAE,CAAC,CAAC;QACT;AACJ,IAAA,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;AAEZ,IAAA,IAAI,MAAM;AAAE,QAAA,OAAOC,uCAAK;IAExB,QACIA,cAAA,CAACC,aAAM,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,aAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,MAAM,EAAA,EAAA,QAAA,EACzBD,eAACE,eAAY,EAAA,EACT,SAAS,EAAC,MAAM,EAChB,EAAE,EAAE,EAAE,EACN,EAAE,EAAE;AACA,gBAAA,QAAQ,EAAE,OAAO;AACjB,gBAAA,MAAM,EAAE,IAAI,IAAI,MAAM,IAAI,CAAC;aAC9B,EACD,cAAc,EAAE,MAAK;gBACjB,cAAc,IAAI,cAAc,EAAE;AACtC,YAAA,CAAC,EAAA,QAAA,EAEDF,cAAA,CAACG,eAAU,EAAA,MAAA,CAAA,MAAA,CAAA,EACP,QAAQ,EAAE,GAAG,EACb,MAAM,EAAC,WAAW,EAClB,OAAO,EAAC,MAAM,EAAA,EACV,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,UAAU,EAAA,EACzB,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,MAAK;;oBACX,SAAS,CAAC,IAAI,CAAC;oBACf,CAAA,CAAA,EAAA,GAAA,SAAS,KAAA,IAAA,IAAT,SAAS,uBAAT,SAAS,CAAE,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,MAAI,MAAA,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,EAAE,CAAA;AACxE,gBAAA,CAAC,EAAA,QAAA,EAEDH,cAAA,CAACI,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,EAAC,cAAc,EAAA,EACpB,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,OAAO,EAAA,EACtB,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,oBAAoB,EAC7B,MAAM,EAAE,CAAC,EACT,MAAM,EAAE,CAAC,EACT,eAAe,EAAEC,mBAAS,CAAC,MAAM,CAAC,IAAI,KAAK,EAAA,EACxC,CAAA,EAAA,GAAA,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,EAAE,CAAA,EAAA,QAAA,EAG5B,QAAQ,EAAA,CAAA,CACP,EAAA,CAAA,CACG,EAAA,CACF,EAAA,CAAA,CACV;AAEjB"}
+{"version":3,"file":"index.js","sources":["../../src/Menu/index.tsx"],"sourcesContent":["import { ReactNode, useEffect, useId, useState } from 'react'\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\"\nimport { placedMenu, PlacementTypes } from \"./placedMenu\";\nimport Portal, { PortalProps } from \"../Portal\";\nimport { getOrigin } from './getOrigin';\nimport ClickOutside from '../ClickOutside';\n\n\nexport type MenuProps = {\n    children?: ReactNode;\n    target?: HTMLElement;\n    placement?: useBreakpointPropsType<PlacementTypes>;\n    zIndex?: number;\n    onClickOutside?: () => void;\n    slotProps?: {\n        transition?: Omit<TransitionProps, \"open\">;\n        portal?: Omit<PortalProps, \"children\">;\n        content?: Omit<TagProps<\"div\">, \"children\">;\n    }\n}\n\nconst Menu = ({ children, target, ...props }: MenuProps) => {\n    let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface<any>(\"Menu\", props, {})\n    const _p: any = {}\n    if (placement) _p.placement = placement\n    const p: any = useBreakpointProps(_p)\n    placement = p.placement\n\n    const isOpen = Boolean(target)\n    const [closed, setClosed] = useState(!isOpen)\n    let id = \"menu-\" + useId().replace(\":\", \"\")\n    const [placed, setPlaced] = useState<any>(placement)\n    placement = placement || \"bottom-left\"\n\n    useEffect(() => {\n        if (closed && isOpen) {\n            setClosed(false)\n        }\n    }, [isOpen])\n\n    useEffect(() => {\n        if (!closed) {\n            setTimeout(() => {\n                const ele = document.getElementById(id)\n                if (target && ele) {\n                    let p = placedMenu({\n                        place: placement as any,\n                        menu: ele,\n                        target\n                    })\n                    setPlaced(p)\n                }\n            }, 1);\n        }\n    }, [closed])\n\n    if (closed) return <></>\n\n    return (\n        <Portal {...slotProps?.portal}>\n            <ClickOutside\n                onClickOutside={() => {\n                    onClickOutside && onClickOutside()\n                }}\n            >\n                <Tag\n                    baseClass=\"menu\"\n                    id={id}\n                    sx={{\n                        position: \"fixed\",\n                        zIndex: 1500 + (zIndex || 0)\n                    }}\n                >\n                    <Transition\n                        duration={200}\n                        easing=\"easeInOut\"\n                        variant=\"grow\"\n                        {...slotProps?.transition}\n                        open={isOpen}\n                        onClosed={() => {\n                            setClosed(true)\n                            slotProps?.transition?.onClosed && slotProps?.transition?.onClosed()\n                        }}\n                    >\n                        <Tag\n                            baseClass='menu-content'\n                            {...slotProps?.content}\n                            sxr={{\n                                overflow: \"hidden\",\n                                bgcolor: \"background.primary\",\n                                shadow: 10,\n                                radius: 1,\n                                transformOrigin: getOrigin(placed) || \"top\",\n                                ...slotProps?.content?.sx\n                            }}\n                        >\n                            {children}\n                        </Tag>\n                    </Transition>\n                </Tag>\n            </ClickOutside>\n        </Portal>\n    )\n}\n\nexport default Menu"],"names":["__rest","useInterface","useBreakpointProps","useState","useId","useEffect","placedMenu","_jsx","Portal","ClickOutside","Tag","Transition","getOrigin"],"mappings":"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"}

package/Menu/index.mjs

@@ -1,4 +1,4 @@
-import {__rest}from'tslib';import {jsx,Fragment}from'react/jsx-runtime';import {useState,useId,useEffect}from'react';import {useInterface,useBreakpointProps,Transition,Tag}from'@xanui/core';import {placedMenu}from'./placedMenu.mjs';import Portal from'../Portal/index.mjs';import {getOrigin}from'./getOrigin.mjs';import ClickOutside from'../ClickOutside/index.mjs';const Menu = (_a) => {
+import {__rest}from'tslib';import {jsx,Fragment}from'react/jsx-runtime';import {useState,useId,useEffect}from'react';import {useInterface,useBreakpointProps,Tag,Transition}from'@xanui/core';import {placedMenu}from'./placedMenu.mjs';import Portal from'../Portal/index.mjs';import {getOrigin}from'./getOrigin.mjs';import ClickOutside from'../ClickOutside/index.mjs';const Menu = (_a) => {
     var _b;
     var { children, target } = _a, props = __rest(_a, ["children", "target"]);
     let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface("Menu", props, {});
@@ -34,14 +34,14 @@ import {__rest}from'tslib';import {jsx,Fragment}from'react/jsx-runtime';import {
     }, [closed]);
     if (closed)
         return jsx(Fragment, {});
-    return (jsx(Portal, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.portal, { children: jsx(ClickOutside, { baseClass: "menu", id: id, sx: {
-                position: "fixed",
-                zIndex: 1500 + (zIndex || 0)
-            }, onClickOutside: () => {
+    return (jsx(Portal, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.portal, { children: jsx(ClickOutside, { onClickOutside: () => {
                 onClickOutside && onClickOutside();
-            }, children: jsx(Transition, Object.assign({ duration: 200, easing: "easeInOut", variant: "grow" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition, { open: isOpen, onClosed: () => {
-                    var _a, _b;
-                    setClosed(true);
-                    ((_a = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _a === void 0 ? void 0 : _a.onClosed) && ((_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _b === void 0 ? void 0 : _b.onClosed());
-                }, children: jsx(Tag, Object.assign({ baseClass: 'menu-content' }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.content, { sxr: Object.assign({ overflow: "hidden", bgcolor: "background.primary", shadow: 5, radius: 1, transformOrigin: getOrigin(placed) || "top" }, (_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.content) === null || _b === void 0 ? void 0 : _b.sx), children: children })) })) }) })));
+            }, children: jsx(Tag, { baseClass: "menu", id: id, sx: {
+                    position: "fixed",
+                    zIndex: 1500 + (zIndex || 0)
+                }, children: jsx(Transition, Object.assign({ duration: 200, easing: "easeInOut", variant: "grow" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition, { open: isOpen, onClosed: () => {
+                        var _a, _b;
+                        setClosed(true);
+                        ((_a = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _a === void 0 ? void 0 : _a.onClosed) && ((_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _b === void 0 ? void 0 : _b.onClosed());
+                    }, children: jsx(Tag, Object.assign({ baseClass: 'menu-content' }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.content, { sxr: Object.assign({ overflow: "hidden", bgcolor: "background.primary", shadow: 10, radius: 1, transformOrigin: getOrigin(placed) || "top" }, (_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.content) === null || _b === void 0 ? void 0 : _b.sx), children: children })) })) }) }) })));
 };export{Menu as default};//# sourceMappingURL=index.mjs.map

package/Menu/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/Menu/index.tsx"],"sourcesContent":["import { ReactNode, useEffect, useId, useState } from 'react'\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\"\nimport { placedMenu, PlacementTypes } from \"./placedMenu\";\nimport Portal, { PortalProps } from \"../Portal\";\nimport { getOrigin } from './getOrigin';\nimport ClickOutside from '../ClickOutside';\n\n\nexport type MenuProps = {\n    children?: ReactNode;\n    target?: HTMLElement;\n    placement?: useBreakpointPropsType<PlacementTypes>;\n    zIndex?: number;\n    onClickOutside?: () => void;\n    slotProps?: {\n        transition?: Omit<TransitionProps, \"open\">;\n        portal?: Omit<PortalProps, \"children\">;\n        content?: Omit<TagProps<\"div\">, \"children\">;\n    }\n}\n\nconst Menu = ({ children, target, ...props }: MenuProps) => {\n    let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface<any>(\"Menu\", props, {})\n    const _p: any = {}\n    if (placement) _p.placement = placement\n    const p: any = useBreakpointProps(_p)\n    placement = p.placement\n\n    const isOpen = Boolean(target)\n    const [closed, setClosed] = useState(!isOpen)\n    let id = \"menu-\" + useId().replace(\":\", \"\")\n    const [placed, setPlaced] = useState<any>(placement)\n    placement = placement || \"bottom-left\"\n\n    useEffect(() => {\n        if (closed && isOpen) {\n            setClosed(false)\n        }\n    }, [isOpen])\n\n    useEffect(() => {\n        if (!closed) {\n            setTimeout(() => {\n                const ele = document.getElementById(id)\n                if (target && ele) {\n                    let p = placedMenu({\n                        place: placement as any,\n                        menu: ele,\n                        target\n                    })\n                    setPlaced(p)\n                }\n            }, 1);\n        }\n    }, [closed])\n\n    if (closed) return <></>\n\n    return (\n        <Portal {...slotProps?.portal}>\n            <ClickOutside\n                baseClass=\"menu\"\n                id={id}\n                sx={{\n                    position: \"fixed\",\n                    zIndex: 1500 + (zIndex || 0)\n                }}\n                onClickOutside={() => {\n                    onClickOutside && onClickOutside()\n                }}\n            >\n                <Transition\n                    duration={200}\n                    easing=\"easeInOut\"\n                    variant=\"grow\"\n                    {...slotProps?.transition}\n                    open={isOpen}\n                    onClosed={() => {\n                        setClosed(true)\n                        slotProps?.transition?.onClosed && slotProps?.transition?.onClosed()\n                    }}\n                >\n                    <Tag\n                        baseClass='menu-content'\n                        {...slotProps?.content}\n                        sxr={{\n                            overflow: \"hidden\",\n                            bgcolor: \"background.primary\",\n                            shadow: 5,\n                            radius: 1,\n                            transformOrigin: getOrigin(placed) || \"top\",\n                            ...slotProps?.content?.sx\n                        }}\n                    >\n                        {children}\n                    </Tag>\n                </Transition>\n            </ClickOutside>\n        </Portal>\n    )\n}\n\nexport default Menu"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../src/Menu/index.tsx"],"sourcesContent":["import { ReactNode, useEffect, useId, useState } from 'react'\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\"\nimport { placedMenu, PlacementTypes } from \"./placedMenu\";\nimport Portal, { PortalProps } from \"../Portal\";\nimport { getOrigin } from './getOrigin';\nimport ClickOutside from '../ClickOutside';\n\n\nexport type MenuProps = {\n    children?: ReactNode;\n    target?: HTMLElement;\n    placement?: useBreakpointPropsType<PlacementTypes>;\n    zIndex?: number;\n    onClickOutside?: () => void;\n    slotProps?: {\n        transition?: Omit<TransitionProps, \"open\">;\n        portal?: Omit<PortalProps, \"children\">;\n        content?: Omit<TagProps<\"div\">, \"children\">;\n    }\n}\n\nconst Menu = ({ children, target, ...props }: MenuProps) => {\n    let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface<any>(\"Menu\", props, {})\n    const _p: any = {}\n    if (placement) _p.placement = placement\n    const p: any = useBreakpointProps(_p)\n    placement = p.placement\n\n    const isOpen = Boolean(target)\n    const [closed, setClosed] = useState(!isOpen)\n    let id = \"menu-\" + useId().replace(\":\", \"\")\n    const [placed, setPlaced] = useState<any>(placement)\n    placement = placement || \"bottom-left\"\n\n    useEffect(() => {\n        if (closed && isOpen) {\n            setClosed(false)\n        }\n    }, [isOpen])\n\n    useEffect(() => {\n        if (!closed) {\n            setTimeout(() => {\n                const ele = document.getElementById(id)\n                if (target && ele) {\n                    let p = placedMenu({\n                        place: placement as any,\n                        menu: ele,\n                        target\n                    })\n                    setPlaced(p)\n                }\n            }, 1);\n        }\n    }, [closed])\n\n    if (closed) return <></>\n\n    return (\n        <Portal {...slotProps?.portal}>\n            <ClickOutside\n                onClickOutside={() => {\n                    onClickOutside && onClickOutside()\n                }}\n            >\n                <Tag\n                    baseClass=\"menu\"\n                    id={id}\n                    sx={{\n                        position: \"fixed\",\n                        zIndex: 1500 + (zIndex || 0)\n                    }}\n                >\n                    <Transition\n                        duration={200}\n                        easing=\"easeInOut\"\n                        variant=\"grow\"\n                        {...slotProps?.transition}\n                        open={isOpen}\n                        onClosed={() => {\n                            setClosed(true)\n                            slotProps?.transition?.onClosed && slotProps?.transition?.onClosed()\n                        }}\n                    >\n                        <Tag\n                            baseClass='menu-content'\n                            {...slotProps?.content}\n                            sxr={{\n                                overflow: \"hidden\",\n                                bgcolor: \"background.primary\",\n                                shadow: 10,\n                                radius: 1,\n                                transformOrigin: getOrigin(placed) || \"top\",\n                                ...slotProps?.content?.sx\n                            }}\n                        >\n                            {children}\n                        </Tag>\n                    </Transition>\n                </Tag>\n            </ClickOutside>\n        </Portal>\n    )\n}\n\nexport default Menu"],"names":["_jsx"],"mappings":"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"}

package/Portal/index.d.ts

@@ -1,11 +1,12 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import React from 'react';
-import { TagComponentType, TagProps } from '@xanui/core';
 
-type PortalProps<T extends TagComponentType = "div"> = TagProps<T> & {
+type PortalProps = {
+    children?: React.ReactNode;
     appendTo?: HTMLElement;
     container?: HTMLElement;
 };
-declare const Portal: React.ForwardRefExoticComponent<Omit<PortalProps<TagComponentType>, "ref"> & React.RefAttributes<any>>;
+declare const Portal: ({ children, appendTo, container }: PortalProps) => react_jsx_runtime.JSX.Element;
 
 export { Portal as default };
 export type { PortalProps };

package/Portal/index.js

@@ -1,21 +1,14 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:true});var tslib=require('tslib'),jsxRuntime=require('react/jsx-runtime'),React=require('react'),ReactDOM=require('react-dom'),core=require('@xanui/core');const Portal = React.forwardRef((_a, ref) => {
-    var { children, component, appendTo, container } = _a, rest = tslib.__rest(_a, ["children", "component", "appendTo", "container"]);
+'use strict';Object.defineProperty(exports,'__esModule',{value:true});var jsxRuntime=require('react/jsx-runtime'),React=require('react'),ReactDOM=require('react-dom'),core=require('@xanui/core');const Portal = ({ children, appendTo, container }) => {
     const [_container, setContainer] = React.useState(container);
-    let props = core.useTagProps(rest);
     const theme = core.useTheme();
     React.useEffect(() => {
         appendTo = appendTo || document.body;
-        let _con = _container || document.createElement(component || "div");
+        let _con = _container || document.createElement("div");
         appendTo.appendChild(_con);
-        for (let prop in props) {
-            _con.setAttribute(prop, props[prop]);
-        }
+        _con.className = "xui-portal";
         if (!_container) {
             setContainer(_con);
         }
-        if (ref) {
-            ref.current = _con;
-        }
         return () => {
             appendTo.removeChild(_con);
         };
@@ -23,4 +16,4 @@
     if (!_container)
         return jsxRuntime.jsx(jsxRuntime.Fragment, {});
     return ReactDOM.createPortal(jsxRuntime.jsx(core.ThemeProvider, { theme: theme.name, children: children }), _container);
-});exports.default=Portal;//# sourceMappingURL=index.js.map
+};exports.default=Portal;//# sourceMappingURL=index.js.map

package/Portal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/Portal/index.tsx"],"sourcesContent":["\nimport React, { useEffect, useState } from 'react'\nimport ReactDOM from 'react-dom';\nimport { useTagProps, TagProps, TagComponentType, useTheme, ThemeProvider } from '@xanui/core';\nexport type PortalProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n    appendTo?: HTMLElement;\n    container?: HTMLElement;\n}\n\nconst Portal = React.forwardRef(<T extends TagComponentType = \"div\">({ children, component, appendTo, container, ...rest }: PortalProps<T>, ref?: React.Ref<any>) => {\n    const [_container, setContainer] = useState<HTMLElement | undefined>(container)\n    let props = useTagProps(rest)\n    const theme = useTheme()\n\n    useEffect(() => {\n        appendTo = appendTo || document.body\n        let _con: HTMLElement = _container || document.createElement(component as any || \"div\");\n        appendTo.appendChild(_con);\n        for (let prop in props) {\n            _con.setAttribute(prop, (props as any)[prop])\n        }\n        if (!_container) {\n            setContainer(_con)\n        }\n        if (ref) {\n            (ref as any).current = _con\n        }\n        return () => {\n            (appendTo as any).removeChild(_con);\n        }\n    }, [])\n\n    if (!_container) return <></>\n\n    return ReactDOM.createPortal(\n        <ThemeProvider theme={theme.name}>\n            {children}\n        </ThemeProvider>,\n        _container,\n    );\n})\n\nexport default Portal"],"names":["__rest","useState","useTagProps","useTheme","useEffect","_jsx","ThemeProvider"],"mappings":"0NASA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAqE,EAAE,GAAoB,KAAI;AAA/F,IAAA,IAAA,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAA,GAAA,EAA2B,EAAtB,IAAI,GAAAA,YAAA,CAAA,EAAA,EAAnD,CAAA,UAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,CAAqD,CAAF;IACpH,MAAM,CAAC,UAAU,EAAE,YAAY,CAAC,GAAGC,cAAQ,CAA0B,SAAS,CAAC;AAC/E,IAAA,IAAI,KAAK,GAAGC,gBAAW,CAAC,IAAI,CAAC;AAC7B,IAAA,MAAM,KAAK,GAAGC,aAAQ,EAAE;IAExBC,eAAS,CAAC,MAAK;AACX,QAAA,QAAQ,GAAG,QAAQ,IAAI,QAAQ,CAAC,IAAI;AACpC,QAAA,IAAI,IAAI,GAAgB,UAAU,IAAI,QAAQ,CAAC,aAAa,CAAC,SAAgB,IAAI,KAAK,CAAC;AACvF,QAAA,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;AAC1B,QAAA,KAAK,IAAI,IAAI,IAAI,KAAK,EAAE;YACpB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAG,KAAa,CAAC,IAAI,CAAC,CAAC;QACjD;QACA,IAAI,CAAC,UAAU,EAAE;YACb,YAAY,CAAC,IAAI,CAAC;QACtB;QACA,IAAI,GAAG,EAAE;AACJ,YAAA,GAAW,CAAC,OAAO,GAAG,IAAI;QAC/B;AACA,QAAA,OAAO,MAAK;AACP,YAAA,QAAgB,CAAC,WAAW,CAAC,IAAI,CAAC;AACvC,QAAA,CAAC;IACL,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAOC,uCAAK;AAE7B,IAAA,OAAO,QAAQ,CAAC,YAAY,CACxBA,cAAA,CAACC,kBAAa,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,EAAA,QAAA,EAC3B,QAAQ,GACG,EAChB,UAAU,CACb;AACL,CAAC"}
+{"version":3,"file":"index.js","sources":["../../src/Portal/index.tsx"],"sourcesContent":["\nimport React, { useEffect, useState } from 'react'\nimport ReactDOM from 'react-dom';\nimport { useTheme, ThemeProvider } from '@xanui/core';\nexport type PortalProps = {\n    children?: React.ReactNode;\n    appendTo?: HTMLElement;\n    container?: HTMLElement;\n}\n\nconst Portal = ({ children, appendTo, container }: PortalProps) => {\n    const [_container, setContainer] = useState<HTMLElement | undefined>(container)\n    const theme = useTheme()\n\n    useEffect(() => {\n        appendTo = appendTo || document.body\n        let _con: HTMLElement = _container || document.createElement(\"div\");\n        appendTo.appendChild(_con);\n        _con.className = \"xui-portal\"\n        if (!_container) {\n            setContainer(_con)\n        }\n\n        return () => {\n            (appendTo as any).removeChild(_con);\n        }\n    }, [])\n\n    if (!_container) return <></>\n\n    return ReactDOM.createPortal(\n        <ThemeProvider theme={theme.name}>\n            {children}\n        </ThemeProvider>,\n        _container,\n    );\n}\n\nexport default Portal"],"names":["useState","useTheme","useEffect","_jsx","ThemeProvider"],"mappings":"mMAUA,MAAM,MAAM,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAe,KAAI;IAC9D,MAAM,CAAC,UAAU,EAAE,YAAY,CAAC,GAAGA,cAAQ,CAA0B,SAAS,CAAC;AAC/E,IAAA,MAAM,KAAK,GAAGC,aAAQ,EAAE;IAExBC,eAAS,CAAC,MAAK;AACX,QAAA,QAAQ,GAAG,QAAQ,IAAI,QAAQ,CAAC,IAAI;QACpC,IAAI,IAAI,GAAgB,UAAU,IAAI,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;AACnE,QAAA,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;AAC1B,QAAA,IAAI,CAAC,SAAS,GAAG,YAAY;QAC7B,IAAI,CAAC,UAAU,EAAE;YACb,YAAY,CAAC,IAAI,CAAC;QACtB;AAEA,QAAA,OAAO,MAAK;AACP,YAAA,QAAgB,CAAC,WAAW,CAAC,IAAI,CAAC;AACvC,QAAA,CAAC;IACL,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAOC,uCAAK;AAE7B,IAAA,OAAO,QAAQ,CAAC,YAAY,CACxBA,cAAA,CAACC,kBAAa,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,EAAA,QAAA,EAC3B,QAAQ,GACG,EAChB,UAAU,CACb;AACL"}

package/Portal/index.mjs

@@ -1,21 +1,14 @@
-import {__rest}from'tslib';import {jsx,Fragment}from'react/jsx-runtime';import React,{useState,useEffect}from'react';import ReactDOM from'react-dom';import {useTagProps,useTheme,ThemeProvider}from'@xanui/core';const Portal = React.forwardRef((_a, ref) => {
-    var { children, component, appendTo, container } = _a, rest = __rest(_a, ["children", "component", "appendTo", "container"]);
+import {jsx,Fragment}from'react/jsx-runtime';import {useState,useEffect}from'react';import ReactDOM from'react-dom';import {useTheme,ThemeProvider}from'@xanui/core';const Portal = ({ children, appendTo, container }) => {
     const [_container, setContainer] = useState(container);
-    let props = useTagProps(rest);
     const theme = useTheme();
     useEffect(() => {
         appendTo = appendTo || document.body;
-        let _con = _container || document.createElement(component || "div");
+        let _con = _container || document.createElement("div");
         appendTo.appendChild(_con);
-        for (let prop in props) {
-            _con.setAttribute(prop, props[prop]);
-        }
+        _con.className = "xui-portal";
         if (!_container) {
             setContainer(_con);
         }
-        if (ref) {
-            ref.current = _con;
-        }
         return () => {
             appendTo.removeChild(_con);
         };
@@ -23,4 +16,4 @@ import {__rest}from'tslib';import {jsx,Fragment}from'react/jsx-runtime';import R
     if (!_container)
         return jsx(Fragment, {});
     return ReactDOM.createPortal(jsx(ThemeProvider, { theme: theme.name, children: children }), _container);
-});export{Portal as default};//# sourceMappingURL=index.mjs.map
+};export{Portal as default};//# sourceMappingURL=index.mjs.map

package/Portal/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/Portal/index.tsx"],"sourcesContent":["\nimport React, { useEffect, useState } from 'react'\nimport ReactDOM from 'react-dom';\nimport { useTagProps, TagProps, TagComponentType, useTheme, ThemeProvider } from '@xanui/core';\nexport type PortalProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n    appendTo?: HTMLElement;\n    container?: HTMLElement;\n}\n\nconst Portal = React.forwardRef(<T extends TagComponentType = \"div\">({ children, component, appendTo, container, ...rest }: PortalProps<T>, ref?: React.Ref<any>) => {\n    const [_container, setContainer] = useState<HTMLElement | undefined>(container)\n    let props = useTagProps(rest)\n    const theme = useTheme()\n\n    useEffect(() => {\n        appendTo = appendTo || document.body\n        let _con: HTMLElement = _container || document.createElement(component as any || \"div\");\n        appendTo.appendChild(_con);\n        for (let prop in props) {\n            _con.setAttribute(prop, (props as any)[prop])\n        }\n        if (!_container) {\n            setContainer(_con)\n        }\n        if (ref) {\n            (ref as any).current = _con\n        }\n        return () => {\n            (appendTo as any).removeChild(_con);\n        }\n    }, [])\n\n    if (!_container) return <></>\n\n    return ReactDOM.createPortal(\n        <ThemeProvider theme={theme.name}>\n            {children}\n        </ThemeProvider>,\n        _container,\n    );\n})\n\nexport default Portal"],"names":["_jsx"],"mappings":"kNASA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAqE,EAAE,GAAoB,KAAI;AAA/F,IAAA,IAAA,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAA,GAAA,EAA2B,EAAtB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnD,CAAA,UAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,CAAqD,CAAF;IACpH,MAAM,CAAC,UAAU,EAAE,YAAY,CAAC,GAAG,QAAQ,CAA0B,SAAS,CAAC;AAC/E,IAAA,IAAI,KAAK,GAAG,WAAW,CAAC,IAAI,CAAC;AAC7B,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;IAExB,SAAS,CAAC,MAAK;AACX,QAAA,QAAQ,GAAG,QAAQ,IAAI,QAAQ,CAAC,IAAI;AACpC,QAAA,IAAI,IAAI,GAAgB,UAAU,IAAI,QAAQ,CAAC,aAAa,CAAC,SAAgB,IAAI,KAAK,CAAC;AACvF,QAAA,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;AAC1B,QAAA,KAAK,IAAI,IAAI,IAAI,KAAK,EAAE;YACpB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAG,KAAa,CAAC,IAAI,CAAC,CAAC;QACjD;QACA,IAAI,CAAC,UAAU,EAAE;YACb,YAAY,CAAC,IAAI,CAAC;QACtB;QACA,IAAI,GAAG,EAAE;AACJ,YAAA,GAAW,CAAC,OAAO,GAAG,IAAI;QAC/B;AACA,QAAA,OAAO,MAAK;AACP,YAAA,QAAgB,CAAC,WAAW,CAAC,IAAI,CAAC;AACvC,QAAA,CAAC;IACL,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAOA,iBAAK;AAE7B,IAAA,OAAO,QAAQ,CAAC,YAAY,CACxBA,GAAA,CAAC,aAAa,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,EAAA,QAAA,EAC3B,QAAQ,GACG,EAChB,UAAU,CACb;AACL,CAAC"}
+{"version":3,"file":"index.mjs","sources":["../../src/Portal/index.tsx"],"sourcesContent":["\nimport React, { useEffect, useState } from 'react'\nimport ReactDOM from 'react-dom';\nimport { useTheme, ThemeProvider } from '@xanui/core';\nexport type PortalProps = {\n    children?: React.ReactNode;\n    appendTo?: HTMLElement;\n    container?: HTMLElement;\n}\n\nconst Portal = ({ children, appendTo, container }: PortalProps) => {\n    const [_container, setContainer] = useState<HTMLElement | undefined>(container)\n    const theme = useTheme()\n\n    useEffect(() => {\n        appendTo = appendTo || document.body\n        let _con: HTMLElement = _container || document.createElement(\"div\");\n        appendTo.appendChild(_con);\n        _con.className = \"xui-portal\"\n        if (!_container) {\n            setContainer(_con)\n        }\n\n        return () => {\n            (appendTo as any).removeChild(_con);\n        }\n    }, [])\n\n    if (!_container) return <></>\n\n    return ReactDOM.createPortal(\n        <ThemeProvider theme={theme.name}>\n            {children}\n        </ThemeProvider>,\n        _container,\n    );\n}\n\nexport default Portal"],"names":["_jsx"],"mappings":"qKAUA,MAAM,MAAM,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAe,KAAI;IAC9D,MAAM,CAAC,UAAU,EAAE,YAAY,CAAC,GAAG,QAAQ,CAA0B,SAAS,CAAC;AAC/E,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;IAExB,SAAS,CAAC,MAAK;AACX,QAAA,QAAQ,GAAG,QAAQ,IAAI,QAAQ,CAAC,IAAI;QACpC,IAAI,IAAI,GAAgB,UAAU,IAAI,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;AACnE,QAAA,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;AAC1B,QAAA,IAAI,CAAC,SAAS,GAAG,YAAY;QAC7B,IAAI,CAAC,UAAU,EAAE;YACb,YAAY,CAAC,IAAI,CAAC;QACtB;AAEA,QAAA,OAAO,MAAK;AACP,YAAA,QAAgB,CAAC,WAAW,CAAC,IAAI,CAAC;AACvC,QAAA,CAAC;IACL,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAOA,iBAAK;AAE7B,IAAA,OAAO,QAAQ,CAAC,YAAY,CACxBA,GAAA,CAAC,aAAa,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,EAAA,QAAA,EAC3B,QAAQ,GACG,EAChB,UAAU,CACb;AACL"}

package/Scrollbar/index.d.ts

@@ -1,11 +1,8 @@
-import { TagComponentType, TagProps, useBreakpointPropsType } from '@xanui/core';
+import { TagComponentType, TagProps } from '@xanui/core';
 import React, { ReactNode, UIEvent } from 'react';
 
 type ScrollbarProps<T extends TagComponentType = "div"> = TagProps<T> & {
     children?: ReactNode;
-    thumbSize?: useBreakpointPropsType<number>;
-    thumbColor?: useBreakpointPropsType<string>;
-    trackColor?: useBreakpointPropsType<string>;
     onScrollEnd?: (e: UIEvent<HTMLDivElement>) => void;
 };
 type ScrollbarHandle = {

package/Scrollbar/index.js

@@ -1,22 +1,6 @@
 'use strict';Object.defineProperty(exports,'__esModule',{value:true});var tslib=require('tslib'),jsxRuntime=require('react/jsx-runtime'),core=require('@xanui/core'),React=require('react');const Scrollbar = React.forwardRef((_a, ref) => {
     var { children } = _a, rest = tslib.__rest(_a, ["children"]);
     let [_b] = core.useInterface("Scrollbar", rest, {}), { thumbSize, thumbColor, trackColor, onScroll, onScrollEnd } = _b, props = tslib.__rest(_b, ["thumbSize", "thumbColor", "trackColor", "onScroll", "onScrollEnd"]);
-    const _p = {};
-    if (thumbSize)
-        _p.thumbSize = thumbSize;
-    if (thumbColor)
-        _p.thumbColor = thumbColor;
-    if (trackColor)
-        _p.trackColor = trackColor;
-    const p = core.useBreakpointProps(_p);
-    const theme = core.useTheme();
-    const sclass = core.useScrollbar({
-        themeName: theme.name,
-        thumbSize: p.thumbSize,
-        thumbColor: p.thumbColor,
-        trackColor: p.trackColor,
-    });
-    props.className = props.className ? `${props.className} ${sclass}` : sclass;
     const innerRef = React.useRef(null);
     React.useImperativeHandle(ref, () => ({
         scrollTo(pos) {

package/Scrollbar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/Scrollbar/index.tsx"],"sourcesContent":["\nimport { Tag, TagComponentType, TagProps, useBreakpointProps, useInterface, useBreakpointPropsType, useScrollbar, useTheme } from '@xanui/core';\n\nimport React, { ReactNode, UIEvent, useImperativeHandle, useRef } from 'react'\n\nexport type ScrollbarProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n    children?: ReactNode;\n    thumbSize?: useBreakpointPropsType<number>;\n    thumbColor?: useBreakpointPropsType<string>;\n    trackColor?: useBreakpointPropsType<string>;\n    onScrollEnd?: (e: UIEvent<HTMLDivElement>) => void;\n}\n\nexport type ScrollbarHandle = {\n    scrollTo: (pos: number) => void;\n    scrollToBottom: () => void;\n    scrollToTop: () => void;\n};\n\nconst Scrollbar = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: ScrollbarProps<T>, ref: React.Ref<ScrollbarHandle>) => {\n    let [{ thumbSize, thumbColor, trackColor, onScroll, onScrollEnd, ...props }] = useInterface<any>(\"Scrollbar\", rest, {})\n    const _p: any = {}\n    if (thumbSize) _p.thumbSize = thumbSize\n    if (thumbColor) _p.thumbColor = thumbColor\n    if (trackColor) _p.trackColor = trackColor\n    const p: any = useBreakpointProps(_p)\n    const theme = useTheme()\n    const sclass = useScrollbar({\n        themeName: theme.name,\n        thumbSize: p.thumbSize,\n        thumbColor: p.thumbColor,\n        trackColor: p.trackColor,\n    })\n\n    props.className = props.className ? `${props.className} ${sclass}` : sclass\n    const innerRef = useRef<HTMLDivElement>(null);\n\n\n    useImperativeHandle(ref, () => ({\n        scrollTo(pos: number) {\n            innerRef.current?.scrollTo({\n                top: pos,\n                behavior: \"smooth\"\n            });\n        },\n        scrollToBottom() {\n            if (!innerRef.current) return;\n            const ele = innerRef.current;\n            ele.scrollTo({\n                top: ele.scrollHeight,\n                behavior: \"smooth\"\n            });\n        },\n        scrollToTop() {\n            innerRef.current?.scrollTo({\n                top: 0,\n                behavior: \"smooth\"\n            });\n        }\n    }));\n\n    if (onScroll || onScrollEnd) {\n        props.onScroll = (e: UIEvent<HTMLDivElement>) => {\n            if (onScrollEnd) {\n                const ele: any = e.target\n                const scrollTop = ele.scrollTop\n                const scrollHeight = ele.scrollHeight\n                const clientHeight = ele.clientHeight\n                const isScrollDown = scrollHeight - scrollTop <= clientHeight + 1\n                isScrollDown && onScrollEnd(e)\n            }\n            onScroll && onScroll(e)\n        }\n    }\n\n\n\n    return (\n        <Tag\n            {...props}\n            ref={innerRef}\n            baseClass='scrollbar'\n            sxr={{\n                height: \"100%\",\n                width: \"100%\",\n                overflow: \"auto\",\n            }}\n        >\n            {children}\n        </Tag>\n    )\n})\n\nexport default Scrollbar "],"names":["__rest","useInterface","useBreakpointProps","useTheme","useScrollbar","useRef","useImperativeHandle","_jsx","Tag"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/Scrollbar/index.tsx"],"sourcesContent":["\nimport { Tag, TagComponentType, TagProps, useBreakpointProps, useInterface, useBreakpointPropsType, useScrollbar } from '@xanui/core';\n\nimport React, { ReactNode, UIEvent, useImperativeHandle, useRef } from 'react'\n\nexport type ScrollbarProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n    children?: ReactNode;\n    onScrollEnd?: (e: UIEvent<HTMLDivElement>) => void;\n}\n\nexport type ScrollbarHandle = {\n    scrollTo: (pos: number) => void;\n    scrollToBottom: () => void;\n    scrollToTop: () => void;\n};\n\nconst Scrollbar = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: ScrollbarProps<T>, ref: React.Ref<ScrollbarHandle>) => {\n    let [{ thumbSize, thumbColor, trackColor, onScroll, onScrollEnd, ...props }] = useInterface<any>(\"Scrollbar\", rest, {})\n    const _p: any = {}\n    if (thumbSize) _p.thumbSize = thumbSize\n    if (thumbColor) _p.thumbColor = thumbColor\n    if (trackColor) _p.trackColor = trackColor\n\n    const innerRef = useRef<HTMLDivElement>(null);\n\n\n    useImperativeHandle(ref, () => ({\n        scrollTo(pos: number) {\n            innerRef.current?.scrollTo({\n                top: pos,\n                behavior: \"smooth\"\n            });\n        },\n        scrollToBottom() {\n            if (!innerRef.current) return;\n            const ele = innerRef.current;\n            ele.scrollTo({\n                top: ele.scrollHeight,\n                behavior: \"smooth\"\n            });\n        },\n        scrollToTop() {\n            innerRef.current?.scrollTo({\n                top: 0,\n                behavior: \"smooth\"\n            });\n        }\n    }));\n\n    if (onScroll || onScrollEnd) {\n        props.onScroll = (e: UIEvent<HTMLDivElement>) => {\n            if (onScrollEnd) {\n                const ele: any = e.target\n                const scrollTop = ele.scrollTop\n                const scrollHeight = ele.scrollHeight\n                const clientHeight = ele.clientHeight\n                const isScrollDown = scrollHeight - scrollTop <= clientHeight + 1\n                isScrollDown && onScrollEnd(e)\n            }\n            onScroll && onScroll(e)\n        }\n    }\n\n    return (\n        <Tag\n            {...props}\n            ref={innerRef}\n            baseClass='scrollbar'\n            sxr={{\n                height: \"100%\",\n                width: \"100%\",\n                overflow: \"auto\",\n            }}\n        >\n            {children}\n        </Tag>\n    )\n})\n\nexport default Scrollbar "],"names":["__rest","useInterface","useRef","useImperativeHandle","_jsx","Tag"],"mappings":"4LAgBA,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAwC,EAAE,GAA+B,KAAI;AAA7E,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA8B,EAAzB,IAAI,GAAAA,YAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;IACvF,IAAI,CAAA,EAAA,CAAA,GAA2EC,iBAAY,CAAM,WAAW,EAAE,IAAI,EAAE,EAAE,CAAC,EAAlH,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAA,GAAA,EAAY,EAAP,KAAK,GAAAD,YAAA,CAAA,EAAA,EAApE,CAAA,WAAA,EAAA,YAAA,EAAA,YAAA,EAAA,UAAA,EAAA,aAAA,CAAsE,CAA4C;AAMvH,IAAA,MAAM,QAAQ,GAAGE,YAAM,CAAiB,IAAI,CAAC;AAG7C,IAAAC,yBAAmB,CAAC,GAAG,EAAE,OAAO;AAC5B,QAAA,QAAQ,CAAC,GAAW,EAAA;;AAChB,YAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC;AACvB,gBAAA,GAAG,EAAE,GAAG;AACR,gBAAA,QAAQ,EAAE;AACb,aAAA,CAAC;QACN,CAAC;QACD,cAAc,GAAA;YACV,IAAI,CAAC,QAAQ,CAAC,OAAO;gBAAE;AACvB,YAAA,MAAM,GAAG,GAAG,QAAQ,CAAC,OAAO;YAC5B,GAAG,CAAC,QAAQ,CAAC;gBACT,GAAG,EAAE,GAAG,CAAC,YAAY;AACrB,gBAAA,QAAQ,EAAE;AACb,aAAA,CAAC;QACN,CAAC;QACD,WAAW,GAAA;;AACP,YAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC;AACvB,gBAAA,GAAG,EAAE,CAAC;AACN,gBAAA,QAAQ,EAAE;AACb,aAAA,CAAC;QACN;AACH,KAAA,CAAC,CAAC;AAEH,IAAA,IAAI,QAAQ,IAAI,WAAW,EAAE;AACzB,QAAA,KAAK,CAAC,QAAQ,GAAG,CAAC,CAA0B,KAAI;YAC5C,IAAI,WAAW,EAAE;AACb,gBAAA,MAAM,GAAG,GAAQ,CAAC,CAAC,MAAM;AACzB,gBAAA,MAAM,SAAS,GAAG,GAAG,CAAC,SAAS;AAC/B,gBAAA,MAAM,YAAY,GAAG,GAAG,CAAC,YAAY;AACrC,gBAAA,MAAM,YAAY,GAAG,GAAG,CAAC,YAAY;gBACrC,MAAM,YAAY,GAAG,YAAY,GAAG,SAAS,IAAI,YAAY,GAAG,CAAC;AACjE,gBAAA,YAAY,IAAI,WAAW,CAAC,CAAC,CAAC;YAClC;AACA,YAAA,QAAQ,IAAI,QAAQ,CAAC,CAAC,CAAC;AAC3B,QAAA,CAAC;IACL;AAEA,IAAA,QACIC,cAAA,CAACC,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,KAAK,EAAA,EACT,GAAG,EAAE,QAAQ,EACb,SAAS,EAAC,WAAW,EACrB,GAAG,EAAE;AACD,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,KAAK,EAAE,MAAM;AACb,YAAA,QAAQ,EAAE,MAAM;SACnB,EAAA,QAAA,EAEA,QAAQ,EAAA,CAAA,CACP;AAEd,CAAC"}

package/Scrollbar/index.mjs

@@ -1,22 +1,6 @@
-import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import {useInterface,useBreakpointProps,useTheme,useScrollbar,Tag}from'@xanui/core';import React,{useRef,useImperativeHandle}from'react';const Scrollbar = React.forwardRef((_a, ref) => {
+import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import {useInterface,Tag}from'@xanui/core';import React,{useRef,useImperativeHandle}from'react';const Scrollbar = React.forwardRef((_a, ref) => {
     var { children } = _a, rest = __rest(_a, ["children"]);
     let [_b] = useInterface("Scrollbar", rest, {}), { thumbSize, thumbColor, trackColor, onScroll, onScrollEnd } = _b, props = __rest(_b, ["thumbSize", "thumbColor", "trackColor", "onScroll", "onScrollEnd"]);
-    const _p = {};
-    if (thumbSize)
-        _p.thumbSize = thumbSize;
-    if (thumbColor)
-        _p.thumbColor = thumbColor;
-    if (trackColor)
-        _p.trackColor = trackColor;
-    const p = useBreakpointProps(_p);
-    const theme = useTheme();
-    const sclass = useScrollbar({
-        themeName: theme.name,
-        thumbSize: p.thumbSize,
-        thumbColor: p.thumbColor,
-        trackColor: p.trackColor,
-    });
-    props.className = props.className ? `${props.className} ${sclass}` : sclass;
     const innerRef = useRef(null);
     useImperativeHandle(ref, () => ({
         scrollTo(pos) {

package/Scrollbar/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/Scrollbar/index.tsx"],"sourcesContent":["\nimport { Tag, TagComponentType, TagProps, useBreakpointProps, useInterface, useBreakpointPropsType, useScrollbar, useTheme } from '@xanui/core';\n\nimport React, { ReactNode, UIEvent, useImperativeHandle, useRef } from 'react'\n\nexport type ScrollbarProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n    children?: ReactNode;\n    thumbSize?: useBreakpointPropsType<number>;\n    thumbColor?: useBreakpointPropsType<string>;\n    trackColor?: useBreakpointPropsType<string>;\n    onScrollEnd?: (e: UIEvent<HTMLDivElement>) => void;\n}\n\nexport type ScrollbarHandle = {\n    scrollTo: (pos: number) => void;\n    scrollToBottom: () => void;\n    scrollToTop: () => void;\n};\n\nconst Scrollbar = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: ScrollbarProps<T>, ref: React.Ref<ScrollbarHandle>) => {\n    let [{ thumbSize, thumbColor, trackColor, onScroll, onScrollEnd, ...props }] = useInterface<any>(\"Scrollbar\", rest, {})\n    const _p: any = {}\n    if (thumbSize) _p.thumbSize = thumbSize\n    if (thumbColor) _p.thumbColor = thumbColor\n    if (trackColor) _p.trackColor = trackColor\n    const p: any = useBreakpointProps(_p)\n    const theme = useTheme()\n    const sclass = useScrollbar({\n        themeName: theme.name,\n        thumbSize: p.thumbSize,\n        thumbColor: p.thumbColor,\n        trackColor: p.trackColor,\n    })\n\n    props.className = props.className ? `${props.className} ${sclass}` : sclass\n    const innerRef = useRef<HTMLDivElement>(null);\n\n\n    useImperativeHandle(ref, () => ({\n        scrollTo(pos: number) {\n            innerRef.current?.scrollTo({\n                top: pos,\n                behavior: \"smooth\"\n            });\n        },\n        scrollToBottom() {\n            if (!innerRef.current) return;\n            const ele = innerRef.current;\n            ele.scrollTo({\n                top: ele.scrollHeight,\n                behavior: \"smooth\"\n            });\n        },\n        scrollToTop() {\n            innerRef.current?.scrollTo({\n                top: 0,\n                behavior: \"smooth\"\n            });\n        }\n    }));\n\n    if (onScroll || onScrollEnd) {\n        props.onScroll = (e: UIEvent<HTMLDivElement>) => {\n            if (onScrollEnd) {\n                const ele: any = e.target\n                const scrollTop = ele.scrollTop\n                const scrollHeight = ele.scrollHeight\n                const clientHeight = ele.clientHeight\n                const isScrollDown = scrollHeight - scrollTop <= clientHeight + 1\n                isScrollDown && onScrollEnd(e)\n            }\n            onScroll && onScroll(e)\n        }\n    }\n\n\n\n    return (\n        <Tag\n            {...props}\n            ref={innerRef}\n            baseClass='scrollbar'\n            sxr={{\n                height: \"100%\",\n                width: \"100%\",\n                overflow: \"auto\",\n            }}\n        >\n            {children}\n        </Tag>\n    )\n})\n\nexport default Scrollbar "],"names":["_jsx"],"mappings":"wMAmBA,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAwC,EAAE,GAA+B,KAAI;AAA7E,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA8B,EAAzB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;IACvF,IAAI,CAAA,EAAA,CAAA,GAA2E,YAAY,CAAM,WAAW,EAAE,IAAI,EAAE,EAAE,CAAC,EAAlH,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAA,GAAA,EAAY,EAAP,KAAK,GAAA,MAAA,CAAA,EAAA,EAApE,CAAA,WAAA,EAAA,YAAA,EAAA,YAAA,EAAA,UAAA,EAAA,aAAA,CAAsE,CAA4C;IACvH,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,SAAS;AAAE,QAAA,EAAE,CAAC,SAAS,GAAG,SAAS;AACvC,IAAA,IAAI,UAAU;AAAE,QAAA,EAAE,CAAC,UAAU,GAAG,UAAU;AAC1C,IAAA,IAAI,UAAU;AAAE,QAAA,EAAE,CAAC,UAAU,GAAG,UAAU;AAC1C,IAAA,MAAM,CAAC,GAAQ,kBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;IACxB,MAAM,MAAM,GAAG,YAAY,CAAC;QACxB,SAAS,EAAE,KAAK,CAAC,IAAI;QACrB,SAAS,EAAE,CAAC,CAAC,SAAS;QACtB,UAAU,EAAE,CAAC,CAAC,UAAU;QACxB,UAAU,EAAE,CAAC,CAAC,UAAU;AAC3B,KAAA,CAAC;IAEF,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,GAAG,CAAA,EAAG,KAAK,CAAC,SAAS,IAAI,MAAM,CAAA,CAAE,GAAG,MAAM;AAC3E,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC;AAG7C,IAAA,mBAAmB,CAAC,GAAG,EAAE,OAAO;AAC5B,QAAA,QAAQ,CAAC,GAAW,EAAA;;AAChB,YAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC;AACvB,gBAAA,GAAG,EAAE,GAAG;AACR,gBAAA,QAAQ,EAAE;AACb,aAAA,CAAC;QACN,CAAC;QACD,cAAc,GAAA;YACV,IAAI,CAAC,QAAQ,CAAC,OAAO;gBAAE;AACvB,YAAA,MAAM,GAAG,GAAG,QAAQ,CAAC,OAAO;YAC5B,GAAG,CAAC,QAAQ,CAAC;gBACT,GAAG,EAAE,GAAG,CAAC,YAAY;AACrB,gBAAA,QAAQ,EAAE;AACb,aAAA,CAAC;QACN,CAAC;QACD,WAAW,GAAA;;AACP,YAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC;AACvB,gBAAA,GAAG,EAAE,CAAC;AACN,gBAAA,QAAQ,EAAE;AACb,aAAA,CAAC;QACN;AACH,KAAA,CAAC,CAAC;AAEH,IAAA,IAAI,QAAQ,IAAI,WAAW,EAAE;AACzB,QAAA,KAAK,CAAC,QAAQ,GAAG,CAAC,CAA0B,KAAI;YAC5C,IAAI,WAAW,EAAE;AACb,gBAAA,MAAM,GAAG,GAAQ,CAAC,CAAC,MAAM;AACzB,gBAAA,MAAM,SAAS,GAAG,GAAG,CAAC,SAAS;AAC/B,gBAAA,MAAM,YAAY,GAAG,GAAG,CAAC,YAAY;AACrC,gBAAA,MAAM,YAAY,GAAG,GAAG,CAAC,YAAY;gBACrC,MAAM,YAAY,GAAG,YAAY,GAAG,SAAS,IAAI,YAAY,GAAG,CAAC;AACjE,gBAAA,YAAY,IAAI,WAAW,CAAC,CAAC,CAAC;YAClC;AACA,YAAA,QAAQ,IAAI,QAAQ,CAAC,CAAC,CAAC;AAC3B,QAAA,CAAC;IACL;AAIA,IAAA,QACIA,GAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,KAAK,EAAA,EACT,GAAG,EAAE,QAAQ,EACb,SAAS,EAAC,WAAW,EACrB,GAAG,EAAE;AACD,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,KAAK,EAAE,MAAM;AACb,YAAA,QAAQ,EAAE,MAAM;SACnB,EAAA,QAAA,EAEA,QAAQ,EAAA,CAAA,CACP;AAEd,CAAC"}
+{"version":3,"file":"index.mjs","sources":["../../src/Scrollbar/index.tsx"],"sourcesContent":["\nimport { Tag, TagComponentType, TagProps, useBreakpointProps, useInterface, useBreakpointPropsType, useScrollbar } from '@xanui/core';\n\nimport React, { ReactNode, UIEvent, useImperativeHandle, useRef } from 'react'\n\nexport type ScrollbarProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n    children?: ReactNode;\n    onScrollEnd?: (e: UIEvent<HTMLDivElement>) => void;\n}\n\nexport type ScrollbarHandle = {\n    scrollTo: (pos: number) => void;\n    scrollToBottom: () => void;\n    scrollToTop: () => void;\n};\n\nconst Scrollbar = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: ScrollbarProps<T>, ref: React.Ref<ScrollbarHandle>) => {\n    let [{ thumbSize, thumbColor, trackColor, onScroll, onScrollEnd, ...props }] = useInterface<any>(\"Scrollbar\", rest, {})\n    const _p: any = {}\n    if (thumbSize) _p.thumbSize = thumbSize\n    if (thumbColor) _p.thumbColor = thumbColor\n    if (trackColor) _p.trackColor = trackColor\n\n    const innerRef = useRef<HTMLDivElement>(null);\n\n\n    useImperativeHandle(ref, () => ({\n        scrollTo(pos: number) {\n            innerRef.current?.scrollTo({\n                top: pos,\n                behavior: \"smooth\"\n            });\n        },\n        scrollToBottom() {\n            if (!innerRef.current) return;\n            const ele = innerRef.current;\n            ele.scrollTo({\n                top: ele.scrollHeight,\n                behavior: \"smooth\"\n            });\n        },\n        scrollToTop() {\n            innerRef.current?.scrollTo({\n                top: 0,\n                behavior: \"smooth\"\n            });\n        }\n    }));\n\n    if (onScroll || onScrollEnd) {\n        props.onScroll = (e: UIEvent<HTMLDivElement>) => {\n            if (onScrollEnd) {\n                const ele: any = e.target\n                const scrollTop = ele.scrollTop\n                const scrollHeight = ele.scrollHeight\n                const clientHeight = ele.clientHeight\n                const isScrollDown = scrollHeight - scrollTop <= clientHeight + 1\n                isScrollDown && onScrollEnd(e)\n            }\n            onScroll && onScroll(e)\n        }\n    }\n\n    return (\n        <Tag\n            {...props}\n            ref={innerRef}\n            baseClass='scrollbar'\n            sxr={{\n                height: \"100%\",\n                width: \"100%\",\n                overflow: \"auto\",\n            }}\n        >\n            {children}\n        </Tag>\n    )\n})\n\nexport default Scrollbar "],"names":["_jsx"],"mappings":"+JAgBA,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAwC,EAAE,GAA+B,KAAI;AAA7E,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA8B,EAAzB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;IACvF,IAAI,CAAA,EAAA,CAAA,GAA2E,YAAY,CAAM,WAAW,EAAE,IAAI,EAAE,EAAE,CAAC,EAAlH,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAA,GAAA,EAAY,EAAP,KAAK,GAAA,MAAA,CAAA,EAAA,EAApE,CAAA,WAAA,EAAA,YAAA,EAAA,YAAA,EAAA,UAAA,EAAA,aAAA,CAAsE,CAA4C;AAMvH,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC;AAG7C,IAAA,mBAAmB,CAAC,GAAG,EAAE,OAAO;AAC5B,QAAA,QAAQ,CAAC,GAAW,EAAA;;AAChB,YAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC;AACvB,gBAAA,GAAG,EAAE,GAAG;AACR,gBAAA,QAAQ,EAAE;AACb,aAAA,CAAC;QACN,CAAC;QACD,cAAc,GAAA;YACV,IAAI,CAAC,QAAQ,CAAC,OAAO;gBAAE;AACvB,YAAA,MAAM,GAAG,GAAG,QAAQ,CAAC,OAAO;YAC5B,GAAG,CAAC,QAAQ,CAAC;gBACT,GAAG,EAAE,GAAG,CAAC,YAAY;AACrB,gBAAA,QAAQ,EAAE;AACb,aAAA,CAAC;QACN,CAAC;QACD,WAAW,GAAA;;AACP,YAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC;AACvB,gBAAA,GAAG,EAAE,CAAC;AACN,gBAAA,QAAQ,EAAE;AACb,aAAA,CAAC;QACN;AACH,KAAA,CAAC,CAAC;AAEH,IAAA,IAAI,QAAQ,IAAI,WAAW,EAAE;AACzB,QAAA,KAAK,CAAC,QAAQ,GAAG,CAAC,CAA0B,KAAI;YAC5C,IAAI,WAAW,EAAE;AACb,gBAAA,MAAM,GAAG,GAAQ,CAAC,CAAC,MAAM;AACzB,gBAAA,MAAM,SAAS,GAAG,GAAG,CAAC,SAAS;AAC/B,gBAAA,MAAM,YAAY,GAAG,GAAG,CAAC,YAAY;AACrC,gBAAA,MAAM,YAAY,GAAG,GAAG,CAAC,YAAY;gBACrC,MAAM,YAAY,GAAG,YAAY,GAAG,SAAS,IAAI,YAAY,GAAG,CAAC;AACjE,gBAAA,YAAY,IAAI,WAAW,CAAC,CAAC,CAAC;YAClC;AACA,YAAA,QAAQ,IAAI,QAAQ,CAAC,CAAC,CAAC;AAC3B,QAAA,CAAC;IACL;AAEA,IAAA,QACIA,GAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,KAAK,EAAA,EACT,GAAG,EAAE,QAAQ,EACb,SAAS,EAAC,WAAW,EACrB,GAAG,EAAE;AACD,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,KAAK,EAAE,MAAM;AACb,YAAA,QAAQ,EAAE,MAAM;SACnB,EAAA,QAAA,EAEA,QAAQ,EAAA,CAAA,CACP;AAEd,CAAC"}

package/Select/index.d.ts

@@ -3,15 +3,15 @@ import { InputProps } from '../Input/index.js';
 import { ListProps } from '../List/index.js';
 import { MenuProps } from '../Menu/index.js';
 import { OptionProps } from '../Option/index.js';
-import { useBreakpointPropsType, ColorTemplateColors, ColorTemplateType } from '@xanui/core';
+import { useBreakpointPropsType, UseColorTemplateColor, UseColorTemplateType } from '@xanui/core';
 
 type SelectProps = {
     value?: string | number;
     onChange?: (value: string | number) => void;
     children: ReactElement<OptionProps> | ReactElement<OptionProps>[];
     placeholder?: useBreakpointPropsType<string>;
-    color?: useBreakpointPropsType<ColorTemplateColors>;
-    variant?: useBreakpointPropsType<ColorTemplateType>;
+    color?: useBreakpointPropsType<UseColorTemplateColor>;
+    variant?: useBreakpointPropsType<UseColorTemplateType>;
     slotProps?: {
         menu?: Omit<MenuProps, 'children' | 'target'>;
         input?: Omit<InputProps, "onChange" | "value">;

package/Select/index.js

@@ -27,7 +27,7 @@
         };
     }, [children, value]);
     const toggleMenu = () => setTarget(target ? null : conRef.current);
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(index.default, Object.assign({ color: color, variant: variant === "alpha" ? "fill" : variant, endIcon: jsxRuntime.jsxs(index$1.default, { flexDirection: "row", component: "span", children: [" ", (target ? jsxRuntime.jsx(UpIcon, {}) : jsxRuntime.jsx(DownIcon, {}))] }), readOnly: true, value: typeof selectedProps.children === 'string' ? selectedProps.children : value, cursor: "pointer", userSelect: "none", startIcon: selectedProps.startIcon, focused: !!target, placeholder: placeholder }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.input, { slotProps: {
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(index.default, Object.assign({ color: color, variant: variant === "soft" ? "fill" : variant, endIcon: jsxRuntime.jsxs(index$1.default, { flexDirection: "row", component: "span", children: [" ", (target ? jsxRuntime.jsx(UpIcon, {}) : jsxRuntime.jsx(DownIcon, {}))] }), readOnly: true, value: typeof selectedProps.children === 'string' ? selectedProps.children : value, cursor: "pointer", userSelect: "none", startIcon: selectedProps.startIcon, focused: !!target, placeholder: placeholder }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.input, { slotProps: {
                     container: Object.assign(Object.assign({ cursor: "pointer", userSelect: "none" }, (((_c = (_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.input) === null || _b === void 0 ? void 0 : _b.slotProps) === null || _c === void 0 ? void 0 : _c.container) || {})), { onClick: toggleMenu })
                 }, containerRef: conRef, ref: ref })), jsxRuntime.jsx(index$2.default, Object.assign({ target: target, placement: "bottom" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.menu, { slotProps: {
                     content: Object.assign({ mt: .5, width: conRef && ((_d = conRef === null || conRef === void 0 ? void 0 : conRef.current) === null || _d === void 0 ? void 0 : _d.clientWidth) }, (_e = slotProps === null || slotProps === void 0 ? void 0 : slotProps.menu) === null || _e === void 0 ? void 0 : _e.content)