@xanui/ui 1.0.0

package/Tabs/index.js

@@ -0,0 +1,188 @@
+'use strict';Object.defineProperty(exports,'__esModule',{value:true});var tslib=require('tslib'),jsxRuntime=require('react/jsx-runtime'),React=require('react'),core=require('@xanui/core');const getRect = (ele, parent) => {
+    const _rect = {};
+    const parentRect = parent.getBoundingClientRect();
+    const childRect = ele.getBoundingClientRect();
+    _rect.top = childRect.top - parentRect.top;
+    _rect.right = childRect.right - parentRect.right;
+    _rect.bottom = childRect.bottom - parentRect.bottom;
+    _rect.left = childRect.left - parentRect.left;
+    _rect.width = childRect.width;
+    _rect.height = childRect.height;
+    return _rect;
+};
+const Tabs = React.forwardRef((_a, ref) => {
+    var _b, _c, _d;
+    var { onChange, value, children } = _a, props = tslib.__rest(_a, ["onChange", "value", "children"]);
+    let [_e] = core.useInterface("Tabs", props, {}), { verticle, color, variant, indicatorSize, disableTransition, slotProps } = _e, rest = tslib.__rest(_e, ["verticle", "color", "variant", "indicatorSize", "disableTransition", "slotProps"]);
+    const _p = {};
+    if (variant)
+        _p.variant = variant;
+    if (color)
+        _p.color = color;
+    if (verticle)
+        _p.verticle = verticle;
+    if (disableTransition)
+        _p.disableTransition = disableTransition;
+    if (indicatorSize)
+        _p.indicatorSize = indicatorSize;
+    const p = core.useBreakpointProps(_p);
+    variant = (_b = p.variant) !== null && _b !== void 0 ? _b : "end-line";
+    color = (_c = p.color) !== null && _c !== void 0 ? _c : "brand";
+    verticle = p.verticle;
+    disableTransition = p.disableTransition;
+    indicatorSize = (_d = p.indicatorSize) !== null && _d !== void 0 ? _d : 3;
+    ref = ref || React.useRef(null);
+    const containerRef = React.useRef(null);
+    const [trans, setTrans] = React.useState();
+    const { childs, selectedIndex } = React.useMemo(() => {
+        let info = {
+            childs: null,
+            selectedIndex: 0
+        };
+        info.childs = React.Children.map(children, (child, idx) => {
+            let selected = child.props.value === value;
+            if (selected) {
+                info.selectedIndex = idx;
+            }
+            let btnProps = {};
+            if (variant === 'fill' && selected) {
+                btnProps = {
+                    sx: {
+                        bgcolor: "transparent!importnat",
+                        color: "#FFFFFF!important"
+                    }
+                };
+            }
+            else if (variant === 'alpha' && selected) {
+                btnProps = {
+                    sx: {
+                        bgcolor: "transparent!importnat",
+                    }
+                };
+            }
+            // delete child.props.value
+            return React.cloneElement(child, Object.assign(Object.assign(Object.assign({ corner: "square", value: undefined, onClick: () => {
+                    onChange && onChange(child.props.value);
+                }, border: 1, borderColor: "transparent" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.button), btnProps), { color: selected ? color : "default", variant: "text", classNames: [child.props.classNames, { "tab-selected": selected }] }));
+        });
+        return info;
+    }, [children, onChange, value, variant, color, verticle]);
+    React.useEffect(() => {
+        let con = containerRef.current;
+        const conChilds = con.children;
+        if (conChilds && conChilds[selectedIndex]) {
+            const selectedTab = con.querySelector(".tab-selected") || conChilds[0];
+            const prevRect = getRect(selectedTab, con);
+            const rect = getRect(conChilds[selectedIndex], con);
+            let anim = {};
+            if (verticle) {
+                anim = {
+                    from: {
+                        top: (prevRect === null || prevRect === void 0 ? void 0 : prevRect.top) || 0,
+                        height: (prevRect === null || prevRect === void 0 ? void 0 : prevRect.height) || 0,
+                    },
+                    to: {
+                        top: (rect === null || rect === void 0 ? void 0 : rect.top) || 0,
+                        height: (rect === null || rect === void 0 ? void 0 : rect.height) || 0,
+                    }
+                };
+                if (["fill", "alpha", "outline"].includes(variant)) {
+                    anim.from.width = prevRect === null || prevRect === void 0 ? void 0 : prevRect.width;
+                    anim.to.width = rect === null || rect === void 0 ? void 0 : rect.width;
+                }
+            }
+            else {
+                anim = {
+                    from: {
+                        left: (prevRect === null || prevRect === void 0 ? void 0 : prevRect.left) || 0,
+                        width: (prevRect === null || prevRect === void 0 ? void 0 : prevRect.width) || 0,
+                    },
+                    to: {
+                        left: (rect === null || rect === void 0 ? void 0 : rect.left) || 0,
+                        width: (rect === null || rect === void 0 ? void 0 : rect.width) || 0,
+                    },
+                };
+                if (["fill", "alpha", "outline"].includes(variant)) {
+                    anim.from.height = (prevRect === null || prevRect === void 0 ? void 0 : prevRect.height) || 0;
+                    anim.to.height = (rect === null || rect === void 0 ? void 0 : rect.height) || 0;
+                }
+            }
+            setTrans(anim);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [selectedIndex, variant, color, verticle]);
+    let indicatorProps = React.useMemo(() => {
+        let _indicatorProps = {};
+        switch (variant) {
+            case "start-line":
+                if (verticle) {
+                    _indicatorProps = {
+                        left: 0,
+                        width: indicatorSize
+                    };
+                }
+                else {
+                    _indicatorProps = {
+                        top: 0,
+                        height: indicatorSize
+                    };
+                }
+                break;
+            case "end-line":
+                if (verticle) {
+                    _indicatorProps = {
+                        right: 0,
+                        width: indicatorSize
+                    };
+                }
+                else {
+                    _indicatorProps = {
+                        bottom: 0,
+                        height: indicatorSize
+                    };
+                }
+                break;
+            case "fill":
+                _indicatorProps = {
+                    top: 0,
+                    bgcolor: color
+                };
+                break;
+            case "outline":
+                _indicatorProps = {
+                    top: 0,
+                    border: 1,
+                    borderColor: color,
+                    bgcolor: "transparent"
+                };
+                break;
+            case "alpha":
+                _indicatorProps = {
+                    top: 0,
+                    bgcolor: `${color}.alpha`
+                };
+                break;
+            case "text":
+                _indicatorProps = {
+                    display: "none"
+                };
+                break;
+        }
+        return _indicatorProps;
+    }, [selectedIndex, variant, color, verticle]);
+    return (jsxRuntime.jsxs(core.Tag, Object.assign({}, rest, { baseClass: 'tabs', ref: ref, sxr: {
+            position: "relative",
+            zIndex: 1,
+            display: "inline-block"
+        } }, { children: [jsxRuntime.jsx(core.Tag, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.content, { baseClass: 'tabs-content', sxr: {
+                    display: verticle ? "flex" : "inline-flex",
+                    flexDirection: verticle ? "column" : "row",
+                }, ref: containerRef }, { children: childs })), jsxRuntime.jsx(core.Transition, Object.assign({ open: !!trans, variant: trans || { from: {}, to: {} }, easing: "easeInOut", duration: trans ? (disableTransition ? 0 : 250) : 0 }, { children: jsxRuntime.jsx(core.Tag, Object.assign({ baseClass: 'tabs-indicator', 
+                    // className={classname}
+                    sxr: {
+                        position: "absolute",
+                        zIndex: -1,
+                        cursor: "pointer",
+                        bgcolor: color
+                    } }, indicatorProps)) }), !!trans ? "asd" : "qwe")] })));
+});exports.default=Tabs;//# sourceMappingURL=index.js.map

package/Tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../src/Tabs/index.tsx"],"sourcesContent":["\nimport React, { useEffect, ReactElement, useMemo, cloneElement, useState, Children, useRef } from 'react'\nimport { TabProps } from '../Tab'\nimport { Tag, TagProps, useBreakpointProps, ColorTemplateColors, useInterface, useBreakpointPropsType, Transition } from '@xanui/core'\nimport { ButtonProps } from '../Button'\n\n\ntype ValueType = string | number\nexport type TabsProps = Omit<TagProps, 'onChange'> & {\n    children: ReactElement<TabProps> | ReactElement<TabProps>[];\n    value?: ValueType;\n    onChange?: (value: ValueType) => void;\n    variant?: useBreakpointPropsType<\"start-line\" | \"end-line\" | \"fill\" | \"outline\" | \"text\" | \"alpha\">;\n    color?: useBreakpointPropsType<ColorTemplateColors>;\n    verticle?: useBreakpointPropsType<boolean>;\n    disableTransition?: useBreakpointPropsType<boolean>;\n    indicatorSize?: useBreakpointPropsType<number>;\n\n    slotProps?: {\n        content?: Omit<TagProps, \"children\">;\n        button?: Omit<ButtonProps, \"children\" | \"color\" | \"variant\" | \"classNames\">;\n    }\n}\n\nconst getRect = (ele: HTMLElement, parent: HTMLElement) => {\n    const _rect: any = {};\n    const parentRect = parent.getBoundingClientRect();\n    const childRect = ele.getBoundingClientRect();\n    _rect.top = childRect.top - parentRect.top;\n    _rect.right = childRect.right - parentRect.right;\n    _rect.bottom = childRect.bottom - parentRect.bottom;\n    _rect.left = childRect.left - parentRect.left;\n    _rect.width = childRect.width;\n    _rect.height = childRect.height;\n    return _rect\n}\n\nconst Tabs = React.forwardRef(({ onChange, value, children, ...props }: TabsProps, ref: any) => {\n    let [{ verticle, color, variant, indicatorSize, disableTransition, slotProps, ...rest }] = useInterface<any>(\"Tabs\", props, {})\n    const _p: any = {}\n    if (variant) _p.variant = variant\n    if (color) _p.color = color\n    if (verticle) _p.verticle = verticle\n    if (disableTransition) _p.disableTransition = disableTransition\n    if (indicatorSize) _p.indicatorSize = indicatorSize\n    const p: any = useBreakpointProps(_p)\n\n    variant = p.variant ?? \"end-line\"\n    color = p.color ?? \"brand\"\n    verticle = p.verticle\n    disableTransition = p.disableTransition\n    indicatorSize = p.indicatorSize ?? 3\n\n    ref = ref || useRef(null)\n    const containerRef: any = useRef(null)\n    const [trans, setTrans] = useState<any>()\n\n    const { childs, selectedIndex } = useMemo(() => {\n        let info: any = {\n            childs: null,\n            selectedIndex: 0\n        }\n        info.childs = Children.map(children, (child: any, idx: number) => {\n            let selected = child.props.value === value\n            if (selected) {\n                info.selectedIndex = idx\n            }\n\n            let btnProps: any = {}\n            if (variant === 'fill' && selected) {\n                btnProps = {\n                    sx: {\n                        bgcolor: \"transparent!importnat\",\n                        color: \"#FFFFFF!important\"\n                    }\n                }\n            } else if (variant === 'alpha' && selected) {\n                btnProps = {\n                    sx: {\n                        bgcolor: \"transparent!importnat\",\n                    }\n                }\n            }\n\n            // delete child.props.value\n            return cloneElement(child, {\n                corner: \"square\",\n                value: undefined,\n                onClick: () => {\n                    onChange && onChange(child.props.value)\n                },\n                border: 1,\n                borderColor: \"transparent\",\n                ...slotProps?.button,\n                ...btnProps,\n                color: selected ? color : \"default\",\n                variant: \"text\",\n                classNames: [child.props.classNames, { \"tab-selected\": selected }],\n            })\n        })\n        return info\n    }, [children, onChange, value, variant, color, verticle])\n\n    useEffect(() => {\n        let con = containerRef.current\n        const conChilds = con.children\n        if (conChilds && conChilds[selectedIndex]) {\n            const selectedTab = con.querySelector(\".tab-selected\") || conChilds[0]\n            const prevRect = getRect(selectedTab, con)\n            const rect = getRect(conChilds[selectedIndex], con)\n\n            let anim: any = {}\n            if (verticle) {\n                anim = {\n                    from: {\n                        top: prevRect?.top || 0,\n                        height: prevRect?.height || 0,\n                    },\n                    to: {\n                        top: rect?.top || 0,\n                        height: rect?.height || 0,\n                    }\n                }\n                if ([\"fill\", \"alpha\", \"outline\"].includes(variant)) {\n                    anim.from.width = prevRect?.width\n                    anim.to.width = rect?.width\n                }\n            } else {\n                anim = {\n                    from: {\n                        left: prevRect?.left || 0,\n                        width: prevRect?.width || 0,\n                    },\n                    to: {\n                        left: rect?.left || 0,\n                        width: rect?.width || 0,\n                    },\n                }\n                if ([\"fill\", \"alpha\", \"outline\"].includes(variant)) {\n                    anim.from.height = prevRect?.height || 0\n                    anim.to.height = rect?.height || 0\n                }\n            }\n            setTrans(anim)\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [selectedIndex, variant, color, verticle])\n\n    let indicatorProps: any = useMemo(() => {\n        let _indicatorProps: any = {}\n        switch (variant) {\n            case \"start-line\":\n                if (verticle) {\n                    _indicatorProps = {\n                        left: 0,\n                        width: indicatorSize\n                    }\n                } else {\n                    _indicatorProps = {\n                        top: 0,\n                        height: indicatorSize\n                    }\n                }\n                break;\n            case \"end-line\":\n                if (verticle) {\n                    _indicatorProps = {\n                        right: 0,\n                        width: indicatorSize\n                    }\n                } else {\n                    _indicatorProps = {\n                        bottom: 0,\n                        height: indicatorSize\n                    }\n                }\n                break;\n            case \"fill\":\n                _indicatorProps = {\n                    top: 0,\n                    bgcolor: color\n                }\n                break;\n            case \"outline\":\n                _indicatorProps = {\n                    top: 0,\n                    border: 1,\n                    borderColor: color,\n                    bgcolor: \"transparent\"\n                }\n                break;\n            case \"alpha\":\n                _indicatorProps = {\n                    top: 0,\n                    bgcolor: `${color}.alpha`\n                }\n                break;\n            case \"text\":\n                _indicatorProps = {\n                    display: \"none\"\n                }\n                break;\n        }\n        return _indicatorProps\n    }, [selectedIndex, variant, color, verticle])\n\n    return (\n        <Tag\n            {...rest}\n            baseClass='tabs'\n            ref={ref}\n            sxr={{\n                position: \"relative\",\n                zIndex: 1,\n                display: \"inline-block\"\n            }}\n        >\n            <Tag\n                {...slotProps?.content}\n                baseClass='tabs-content'\n                sxr={{\n                    display: verticle ? \"flex\" : \"inline-flex\",\n                    flexDirection: verticle ? \"column\" : \"row\",\n                }}\n                ref={containerRef}\n            >\n                {childs}\n            </Tag>\n            <Transition\n                key={!!trans ? \"asd\" : \"qwe\"}\n                open={!!trans}\n                variant={trans || { from: {}, to: {} }}\n                easing=\"easeInOut\"\n                duration={trans ? (disableTransition ? 0 : 250) : 0}\n            >\n                <Tag\n                    baseClass='tabs-indicator'\n                    // className={classname}\n                    sxr={{\n                        position: \"absolute\",\n                        zIndex: -1,\n                        cursor: \"pointer\",\n                        bgcolor: color\n                    }}\n                    {...indicatorProps}\n                >\n                </Tag>\n            </Transition>\n        </Tag>\n    )\n})\n\nexport default Tabs"],"names":["__rest","useInterface","useBreakpointProps","useRef","useState","useMemo","Children","cloneElement","useEffect","_jsxs","Tag","_jsx","Transition"],"mappings":"4LAwBA,MAAM,OAAO,GAAG,CAAC,GAAgB,EAAE,MAAmB,KAAI;IACtD,MAAM,KAAK,GAAQ,EAAE;AACrB,IAAA,MAAM,UAAU,GAAG,MAAM,CAAC,qBAAqB,EAAE;AACjD,IAAA,MAAM,SAAS,GAAG,GAAG,CAAC,qBAAqB,EAAE;IAC7C,KAAK,CAAC,GAAG,GAAG,SAAS,CAAC,GAAG,GAAG,UAAU,CAAC,GAAG;IAC1C,KAAK,CAAC,KAAK,GAAG,SAAS,CAAC,KAAK,GAAG,UAAU,CAAC,KAAK;IAChD,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,MAAM,GAAG,UAAU,CAAC,MAAM;IACnD,KAAK,CAAC,IAAI,GAAG,SAAS,CAAC,IAAI,GAAG,UAAU,CAAC,IAAI;AAC7C,IAAA,KAAK,CAAC,KAAK,GAAG,SAAS,CAAC,KAAK;AAC7B,IAAA,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,MAAM;AAC/B,IAAA,OAAO,KAAK;AAChB,CAAC;AAED,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAAkD,EAAE,GAAQ,KAAI;;QAAhE,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,OAAuB,EAAlB,KAAK,GAAAA,YAAA,CAAA,EAAA,EAArC,CAAA,UAAA,EAAA,OAAA,EAAA,UAAA,CAAuC,CAAF;AAChE,IAAA,IAAI,CAAA,EAAA,CAAA,GAAuFC,iBAAY,CAAM,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,EAA1H,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAA,GAAA,EAAW,EAAN,IAAI,GAAAD,YAAA,CAAA,EAAA,EAAhF,CAAA,UAAA,EAAA,OAAA,EAAA,SAAA,EAAA,eAAA,EAAA,mBAAA,EAAA,WAAA,CAAkF,CAAwC;IAC/H,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,OAAO;AAAE,QAAA,EAAE,CAAC,OAAO,GAAG,OAAO;AACjC,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,IAAI,QAAQ;AAAE,QAAA,EAAE,CAAC,QAAQ,GAAG,QAAQ;AACpC,IAAA,IAAI,iBAAiB;AAAE,QAAA,EAAE,CAAC,iBAAiB,GAAG,iBAAiB;AAC/D,IAAA,IAAI,aAAa;AAAE,QAAA,EAAE,CAAC,aAAa,GAAG,aAAa;AACnD,IAAA,MAAM,CAAC,GAAQE,uBAAkB,CAAC,EAAE,CAAC;AAErC,IAAA,OAAO,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,UAAU;AACjC,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,OAAO;AAC1B,IAAA,QAAQ,GAAG,CAAC,CAAC,QAAQ;AACrB,IAAA,iBAAiB,GAAG,CAAC,CAAC,iBAAiB;AACvC,IAAA,aAAa,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,aAAa,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,CAAC;AAEpC,IAAA,GAAG,GAAG,GAAG,IAAIC,YAAM,CAAC,IAAI,CAAC;AACzB,IAAA,MAAM,YAAY,GAAQA,YAAM,CAAC,IAAI,CAAC;IACtC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAGC,cAAQ,EAAO;IAEzC,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,GAAGC,aAAO,CAAC,MAAK;AAC3C,QAAA,IAAI,IAAI,GAAQ;AACZ,YAAA,MAAM,EAAE,IAAI;AACZ,YAAA,aAAa,EAAE;SAClB;AACD,QAAA,IAAI,CAAC,MAAM,GAAGC,cAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAU,EAAE,GAAW,KAAI;YAC7D,IAAI,QAAQ,GAAG,KAAK,CAAC,KAAK,CAAC,KAAK,KAAK,KAAK;AAC1C,YAAA,IAAI,QAAQ,EAAE;AACV,gBAAA,IAAI,CAAC,aAAa,GAAG,GAAG;AAC3B,YAAA;YAED,IAAI,QAAQ,GAAQ,EAAE;AACtB,YAAA,IAAI,OAAO,KAAK,MAAM,IAAI,QAAQ,EAAE;AAChC,gBAAA,QAAQ,GAAG;AACP,oBAAA,EAAE,EAAE;AACA,wBAAA,OAAO,EAAE,uBAAuB;AAChC,wBAAA,KAAK,EAAE;AACV;iBACJ;AACJ,YAAA;AAAM,iBAAA,IAAI,OAAO,KAAK,OAAO,IAAI,QAAQ,EAAE;AACxC,gBAAA,QAAQ,GAAG;AACP,oBAAA,EAAE,EAAE;AACA,wBAAA,OAAO,EAAE,uBAAuB;AACnC;iBACJ;AACJ,YAAA;;AAGD,YAAA,OAAOC,kBAAY,CAAC,KAAK,EAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EACrB,MAAM,EAAE,QAAQ,EAChB,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,MAAK;oBACV,QAAQ,IAAI,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC;gBAC3C,CAAC,EACD,MAAM,EAAE,CAAC,EACT,WAAW,EAAE,aAAa,EAAA,EACvB,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,MAAM,CAAA,EACjB,QAAQ,KACX,KAAK,EAAE,QAAQ,GAAG,KAAK,GAAG,SAAS,EACnC,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,EAAE,EAAE,cAAc,EAAE,QAAQ,EAAE,CAAC,EAAA,CAAA,CACpE;AACN,QAAA,CAAC,CAAC;AACF,QAAA,OAAO,IAAI;AACf,IAAA,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;IAEzDC,eAAS,CAAC,MAAK;AACX,QAAA,IAAI,GAAG,GAAG,YAAY,CAAC,OAAO;AAC9B,QAAA,MAAM,SAAS,GAAG,GAAG,CAAC,QAAQ;AAC9B,QAAA,IAAI,SAAS,IAAI,SAAS,CAAC,aAAa,CAAC,EAAE;AACvC,YAAA,MAAM,WAAW,GAAG,GAAG,CAAC,aAAa,CAAC,eAAe,CAAC,IAAI,SAAS,CAAC,CAAC,CAAC;YACtE,MAAM,QAAQ,GAAG,OAAO,CAAC,WAAW,EAAE,GAAG,CAAC;YAC1C,MAAM,IAAI,GAAG,OAAO,CAAC,SAAS,CAAC,aAAa,CAAC,EAAE,GAAG,CAAC;YAEnD,IAAI,IAAI,GAAQ,EAAE;AAClB,YAAA,IAAI,QAAQ,EAAE;AACV,gBAAA,IAAI,GAAG;AACH,oBAAA,IAAI,EAAE;wBACF,GAAG,EAAE,CAAA,QAAQ,KAAA,IAAA,IAAR,QAAQ,uBAAR,QAAQ,CAAE,GAAG,KAAI,CAAC;wBACvB,MAAM,EAAE,CAAA,QAAQ,KAAA,IAAA,IAAR,QAAQ,uBAAR,QAAQ,CAAE,MAAM,KAAI,CAAC;AAChC,qBAAA;AACD,oBAAA,EAAE,EAAE;wBACA,GAAG,EAAE,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,uBAAJ,IAAI,CAAE,GAAG,KAAI,CAAC;wBACnB,MAAM,EAAE,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,KAAI,CAAC;AAC5B;iBACJ;AACD,gBAAA,IAAI,CAAC,MAAM,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE;AAChD,oBAAA,IAAI,CAAC,IAAI,CAAC,KAAK,GAAG,QAAQ,KAAA,IAAA,IAAR,QAAQ,KAAA,MAAA,GAAA,MAAA,GAAR,QAAQ,CAAE,KAAK;AACjC,oBAAA,IAAI,CAAC,EAAE,CAAC,KAAK,GAAG,IAAI,KAAA,IAAA,IAAJ,IAAI,KAAA,MAAA,GAAA,MAAA,GAAJ,IAAI,CAAE,KAAK;AAC9B,gBAAA;AACJ,YAAA;AAAM,iBAAA;AACH,gBAAA,IAAI,GAAG;AACH,oBAAA,IAAI,EAAE;wBACF,IAAI,EAAE,CAAA,QAAQ,KAAA,IAAA,IAAR,QAAQ,uBAAR,QAAQ,CAAE,IAAI,KAAI,CAAC;wBACzB,KAAK,EAAE,CAAA,QAAQ,KAAA,IAAA,IAAR,QAAQ,uBAAR,QAAQ,CAAE,KAAK,KAAI,CAAC;AAC9B,qBAAA;AACD,oBAAA,EAAE,EAAE;wBACA,IAAI,EAAE,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,uBAAJ,IAAI,CAAE,IAAI,KAAI,CAAC;wBACrB,KAAK,EAAE,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,uBAAJ,IAAI,CAAE,KAAK,KAAI,CAAC;AAC1B,qBAAA;iBACJ;AACD,gBAAA,IAAI,CAAC,MAAM,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE;AAChD,oBAAA,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAA,QAAQ,KAAA,IAAA,IAAR,QAAQ,uBAAR,QAAQ,CAAE,MAAM,KAAI,CAAC;AACxC,oBAAA,IAAI,CAAC,EAAE,CAAC,MAAM,GAAG,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,KAAI,CAAC;AACrC,gBAAA;AACJ,YAAA;YACD,QAAQ,CAAC,IAAI,CAAC;AACjB,QAAA;;IAEL,CAAC,EAAE,CAAC,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;AAE7C,IAAA,IAAI,cAAc,GAAQH,aAAO,CAAC,MAAK;QACnC,IAAI,eAAe,GAAQ,EAAE;AAC7B,QAAA,QAAQ,OAAO;AACX,YAAA,KAAK,YAAY;AACb,gBAAA,IAAI,QAAQ,EAAE;AACV,oBAAA,eAAe,GAAG;AACd,wBAAA,IAAI,EAAE,CAAC;AACP,wBAAA,KAAK,EAAE;qBACV;AACJ,gBAAA;AAAM,qBAAA;AACH,oBAAA,eAAe,GAAG;AACd,wBAAA,GAAG,EAAE,CAAC;AACN,wBAAA,MAAM,EAAE;qBACX;AACJ,gBAAA;gBACD;AACJ,YAAA,KAAK,UAAU;AACX,gBAAA,IAAI,QAAQ,EAAE;AACV,oBAAA,eAAe,GAAG;AACd,wBAAA,KAAK,EAAE,CAAC;AACR,wBAAA,KAAK,EAAE;qBACV;AACJ,gBAAA;AAAM,qBAAA;AACH,oBAAA,eAAe,GAAG;AACd,wBAAA,MAAM,EAAE,CAAC;AACT,wBAAA,MAAM,EAAE;qBACX;AACJ,gBAAA;gBACD;AACJ,YAAA,KAAK,MAAM;AACP,gBAAA,eAAe,GAAG;AACd,oBAAA,GAAG,EAAE,CAAC;AACN,oBAAA,OAAO,EAAE;iBACZ;gBACD;AACJ,YAAA,KAAK,SAAS;AACV,gBAAA,eAAe,GAAG;AACd,oBAAA,GAAG,EAAE,CAAC;AACN,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,WAAW,EAAE,KAAK;AAClB,oBAAA,OAAO,EAAE;iBACZ;gBACD;AACJ,YAAA,KAAK,OAAO;AACR,gBAAA,eAAe,GAAG;AACd,oBAAA,GAAG,EAAE,CAAC;oBACN,OAAO,EAAE,CAAA,EAAG,KAAK,CAAA,MAAA;iBACpB;gBACD;AACJ,YAAA,KAAK,MAAM;AACP,gBAAA,eAAe,GAAG;AACd,oBAAA,OAAO,EAAE;iBACZ;gBACD;AACP;AACD,QAAA,OAAO,eAAe;IAC1B,CAAC,EAAE,CAAC,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;AAE7C,IAAA,QACII,eAAA,CAACC,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,IAAI,EAAA,EACR,SAAS,EAAC,MAAM,EAChB,GAAG,EAAE,GAAG,EACR,GAAG,EAAE;AACD,YAAA,QAAQ,EAAE,UAAU;AACpB,YAAA,MAAM,EAAE,CAAC;AACT,YAAA,OAAO,EAAE;AACZ,SAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAEDC,eAACD,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,OAAO,IACtB,SAAS,EAAC,cAAc,EACxB,GAAG,EAAE;oBACD,OAAO,EAAE,QAAQ,GAAG,MAAM,GAAG,aAAa;oBAC1C,aAAa,EAAE,QAAQ,GAAG,QAAQ,GAAG,KAAK;AAC7C,iBAAA,EACD,GAAG,EAAE,YAAY,EAAA,EAAA,EAAA,QAAA,EAEhB,MAAM,EAAA,CAAA,CACL,EACNC,cAAA,CAACC,eAAU,EAAA,MAAA,CAAA,MAAA,CAAA,EAEP,IAAI,EAAE,CAAC,CAAC,KAAK,EACb,OAAO,EAAE,KAAK,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EACtC,MAAM,EAAC,WAAW,EAClB,QAAQ,EAAE,KAAK,IAAI,iBAAiB,GAAG,CAAC,GAAG,GAAG,IAAI,CAAC,EAAA,EAAA,EAAA,QAAA,EAEnDD,cAAA,CAACD,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,EAAC,gBAAgB;;AAE1B,oBAAA,GAAG,EAAE;AACD,wBAAA,QAAQ,EAAE,UAAU;wBACpB,MAAM,EAAE,EAAE;AACV,wBAAA,MAAM,EAAE,SAAS;AACjB,wBAAA,OAAO,EAAE;AACZ,qBAAA,EAAA,EACG,cAAc,CAAA,CAEhB,EAAA,CAAA,EAjBD,CAAC,CAAC,KAAK,GAAG,KAAK,GAAG,KAAK,CAkBnB,CAAA,EAAA,CAAA,CACX;AAEd,CAAC"}

package/Tabs/index.mjs

@@ -0,0 +1,188 @@
+import {__rest}from'tslib';import {jsxs,jsx}from'react/jsx-runtime';import React,{useRef,useState,useMemo,Children,cloneElement,useEffect}from'react';import {useInterface,useBreakpointProps,Tag,Transition}from'@xanui/core';const getRect = (ele, parent) => {
+    const _rect = {};
+    const parentRect = parent.getBoundingClientRect();
+    const childRect = ele.getBoundingClientRect();
+    _rect.top = childRect.top - parentRect.top;
+    _rect.right = childRect.right - parentRect.right;
+    _rect.bottom = childRect.bottom - parentRect.bottom;
+    _rect.left = childRect.left - parentRect.left;
+    _rect.width = childRect.width;
+    _rect.height = childRect.height;
+    return _rect;
+};
+const Tabs = React.forwardRef((_a, ref) => {
+    var _b, _c, _d;
+    var { onChange, value, children } = _a, props = __rest(_a, ["onChange", "value", "children"]);
+    let [_e] = useInterface("Tabs", props, {}), { verticle, color, variant, indicatorSize, disableTransition, slotProps } = _e, rest = __rest(_e, ["verticle", "color", "variant", "indicatorSize", "disableTransition", "slotProps"]);
+    const _p = {};
+    if (variant)
+        _p.variant = variant;
+    if (color)
+        _p.color = color;
+    if (verticle)
+        _p.verticle = verticle;
+    if (disableTransition)
+        _p.disableTransition = disableTransition;
+    if (indicatorSize)
+        _p.indicatorSize = indicatorSize;
+    const p = useBreakpointProps(_p);
+    variant = (_b = p.variant) !== null && _b !== void 0 ? _b : "end-line";
+    color = (_c = p.color) !== null && _c !== void 0 ? _c : "brand";
+    verticle = p.verticle;
+    disableTransition = p.disableTransition;
+    indicatorSize = (_d = p.indicatorSize) !== null && _d !== void 0 ? _d : 3;
+    ref = ref || useRef(null);
+    const containerRef = useRef(null);
+    const [trans, setTrans] = useState();
+    const { childs, selectedIndex } = useMemo(() => {
+        let info = {
+            childs: null,
+            selectedIndex: 0
+        };
+        info.childs = Children.map(children, (child, idx) => {
+            let selected = child.props.value === value;
+            if (selected) {
+                info.selectedIndex = idx;
+            }
+            let btnProps = {};
+            if (variant === 'fill' && selected) {
+                btnProps = {
+                    sx: {
+                        bgcolor: "transparent!importnat",
+                        color: "#FFFFFF!important"
+                    }
+                };
+            }
+            else if (variant === 'alpha' && selected) {
+                btnProps = {
+                    sx: {
+                        bgcolor: "transparent!importnat",
+                    }
+                };
+            }
+            // delete child.props.value
+            return cloneElement(child, Object.assign(Object.assign(Object.assign({ corner: "square", value: undefined, onClick: () => {
+                    onChange && onChange(child.props.value);
+                }, border: 1, borderColor: "transparent" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.button), btnProps), { color: selected ? color : "default", variant: "text", classNames: [child.props.classNames, { "tab-selected": selected }] }));
+        });
+        return info;
+    }, [children, onChange, value, variant, color, verticle]);
+    useEffect(() => {
+        let con = containerRef.current;
+        const conChilds = con.children;
+        if (conChilds && conChilds[selectedIndex]) {
+            const selectedTab = con.querySelector(".tab-selected") || conChilds[0];
+            const prevRect = getRect(selectedTab, con);
+            const rect = getRect(conChilds[selectedIndex], con);
+            let anim = {};
+            if (verticle) {
+                anim = {
+                    from: {
+                        top: (prevRect === null || prevRect === void 0 ? void 0 : prevRect.top) || 0,
+                        height: (prevRect === null || prevRect === void 0 ? void 0 : prevRect.height) || 0,
+                    },
+                    to: {
+                        top: (rect === null || rect === void 0 ? void 0 : rect.top) || 0,
+                        height: (rect === null || rect === void 0 ? void 0 : rect.height) || 0,
+                    }
+                };
+                if (["fill", "alpha", "outline"].includes(variant)) {
+                    anim.from.width = prevRect === null || prevRect === void 0 ? void 0 : prevRect.width;
+                    anim.to.width = rect === null || rect === void 0 ? void 0 : rect.width;
+                }
+            }
+            else {
+                anim = {
+                    from: {
+                        left: (prevRect === null || prevRect === void 0 ? void 0 : prevRect.left) || 0,
+                        width: (prevRect === null || prevRect === void 0 ? void 0 : prevRect.width) || 0,
+                    },
+                    to: {
+                        left: (rect === null || rect === void 0 ? void 0 : rect.left) || 0,
+                        width: (rect === null || rect === void 0 ? void 0 : rect.width) || 0,
+                    },
+                };
+                if (["fill", "alpha", "outline"].includes(variant)) {
+                    anim.from.height = (prevRect === null || prevRect === void 0 ? void 0 : prevRect.height) || 0;
+                    anim.to.height = (rect === null || rect === void 0 ? void 0 : rect.height) || 0;
+                }
+            }
+            setTrans(anim);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [selectedIndex, variant, color, verticle]);
+    let indicatorProps = useMemo(() => {
+        let _indicatorProps = {};
+        switch (variant) {
+            case "start-line":
+                if (verticle) {
+                    _indicatorProps = {
+                        left: 0,
+                        width: indicatorSize
+                    };
+                }
+                else {
+                    _indicatorProps = {
+                        top: 0,
+                        height: indicatorSize
+                    };
+                }
+                break;
+            case "end-line":
+                if (verticle) {
+                    _indicatorProps = {
+                        right: 0,
+                        width: indicatorSize
+                    };
+                }
+                else {
+                    _indicatorProps = {
+                        bottom: 0,
+                        height: indicatorSize
+                    };
+                }
+                break;
+            case "fill":
+                _indicatorProps = {
+                    top: 0,
+                    bgcolor: color
+                };
+                break;
+            case "outline":
+                _indicatorProps = {
+                    top: 0,
+                    border: 1,
+                    borderColor: color,
+                    bgcolor: "transparent"
+                };
+                break;
+            case "alpha":
+                _indicatorProps = {
+                    top: 0,
+                    bgcolor: `${color}.alpha`
+                };
+                break;
+            case "text":
+                _indicatorProps = {
+                    display: "none"
+                };
+                break;
+        }
+        return _indicatorProps;
+    }, [selectedIndex, variant, color, verticle]);
+    return (jsxs(Tag, Object.assign({}, rest, { baseClass: 'tabs', ref: ref, sxr: {
+            position: "relative",
+            zIndex: 1,
+            display: "inline-block"
+        } }, { children: [jsx(Tag, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.content, { baseClass: 'tabs-content', sxr: {
+                    display: verticle ? "flex" : "inline-flex",
+                    flexDirection: verticle ? "column" : "row",
+                }, ref: containerRef }, { children: childs })), jsx(Transition, Object.assign({ open: !!trans, variant: trans || { from: {}, to: {} }, easing: "easeInOut", duration: trans ? (disableTransition ? 0 : 250) : 0 }, { children: jsx(Tag, Object.assign({ baseClass: 'tabs-indicator', 
+                    // className={classname}
+                    sxr: {
+                        position: "absolute",
+                        zIndex: -1,
+                        cursor: "pointer",
+                        bgcolor: color
+                    } }, indicatorProps)) }), !!trans ? "asd" : "qwe")] })));
+});export{Tabs as default};//# sourceMappingURL=index.mjs.map

package/Tabs/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../src/Tabs/index.tsx"],"sourcesContent":["\nimport React, { useEffect, ReactElement, useMemo, cloneElement, useState, Children, useRef } from 'react'\nimport { TabProps } from '../Tab'\nimport { Tag, TagProps, useBreakpointProps, ColorTemplateColors, useInterface, useBreakpointPropsType, Transition } from '@xanui/core'\nimport { ButtonProps } from '../Button'\n\n\ntype ValueType = string | number\nexport type TabsProps = Omit<TagProps, 'onChange'> & {\n    children: ReactElement<TabProps> | ReactElement<TabProps>[];\n    value?: ValueType;\n    onChange?: (value: ValueType) => void;\n    variant?: useBreakpointPropsType<\"start-line\" | \"end-line\" | \"fill\" | \"outline\" | \"text\" | \"alpha\">;\n    color?: useBreakpointPropsType<ColorTemplateColors>;\n    verticle?: useBreakpointPropsType<boolean>;\n    disableTransition?: useBreakpointPropsType<boolean>;\n    indicatorSize?: useBreakpointPropsType<number>;\n\n    slotProps?: {\n        content?: Omit<TagProps, \"children\">;\n        button?: Omit<ButtonProps, \"children\" | \"color\" | \"variant\" | \"classNames\">;\n    }\n}\n\nconst getRect = (ele: HTMLElement, parent: HTMLElement) => {\n    const _rect: any = {};\n    const parentRect = parent.getBoundingClientRect();\n    const childRect = ele.getBoundingClientRect();\n    _rect.top = childRect.top - parentRect.top;\n    _rect.right = childRect.right - parentRect.right;\n    _rect.bottom = childRect.bottom - parentRect.bottom;\n    _rect.left = childRect.left - parentRect.left;\n    _rect.width = childRect.width;\n    _rect.height = childRect.height;\n    return _rect\n}\n\nconst Tabs = React.forwardRef(({ onChange, value, children, ...props }: TabsProps, ref: any) => {\n    let [{ verticle, color, variant, indicatorSize, disableTransition, slotProps, ...rest }] = useInterface<any>(\"Tabs\", props, {})\n    const _p: any = {}\n    if (variant) _p.variant = variant\n    if (color) _p.color = color\n    if (verticle) _p.verticle = verticle\n    if (disableTransition) _p.disableTransition = disableTransition\n    if (indicatorSize) _p.indicatorSize = indicatorSize\n    const p: any = useBreakpointProps(_p)\n\n    variant = p.variant ?? \"end-line\"\n    color = p.color ?? \"brand\"\n    verticle = p.verticle\n    disableTransition = p.disableTransition\n    indicatorSize = p.indicatorSize ?? 3\n\n    ref = ref || useRef(null)\n    const containerRef: any = useRef(null)\n    const [trans, setTrans] = useState<any>()\n\n    const { childs, selectedIndex } = useMemo(() => {\n        let info: any = {\n            childs: null,\n            selectedIndex: 0\n        }\n        info.childs = Children.map(children, (child: any, idx: number) => {\n            let selected = child.props.value === value\n            if (selected) {\n                info.selectedIndex = idx\n            }\n\n            let btnProps: any = {}\n            if (variant === 'fill' && selected) {\n                btnProps = {\n                    sx: {\n                        bgcolor: \"transparent!importnat\",\n                        color: \"#FFFFFF!important\"\n                    }\n                }\n            } else if (variant === 'alpha' && selected) {\n                btnProps = {\n                    sx: {\n                        bgcolor: \"transparent!importnat\",\n                    }\n                }\n            }\n\n            // delete child.props.value\n            return cloneElement(child, {\n                corner: \"square\",\n                value: undefined,\n                onClick: () => {\n                    onChange && onChange(child.props.value)\n                },\n                border: 1,\n                borderColor: \"transparent\",\n                ...slotProps?.button,\n                ...btnProps,\n                color: selected ? color : \"default\",\n                variant: \"text\",\n                classNames: [child.props.classNames, { \"tab-selected\": selected }],\n            })\n        })\n        return info\n    }, [children, onChange, value, variant, color, verticle])\n\n    useEffect(() => {\n        let con = containerRef.current\n        const conChilds = con.children\n        if (conChilds && conChilds[selectedIndex]) {\n            const selectedTab = con.querySelector(\".tab-selected\") || conChilds[0]\n            const prevRect = getRect(selectedTab, con)\n            const rect = getRect(conChilds[selectedIndex], con)\n\n            let anim: any = {}\n            if (verticle) {\n                anim = {\n                    from: {\n                        top: prevRect?.top || 0,\n                        height: prevRect?.height || 0,\n                    },\n                    to: {\n                        top: rect?.top || 0,\n                        height: rect?.height || 0,\n                    }\n                }\n                if ([\"fill\", \"alpha\", \"outline\"].includes(variant)) {\n                    anim.from.width = prevRect?.width\n                    anim.to.width = rect?.width\n                }\n            } else {\n                anim = {\n                    from: {\n                        left: prevRect?.left || 0,\n                        width: prevRect?.width || 0,\n                    },\n                    to: {\n                        left: rect?.left || 0,\n                        width: rect?.width || 0,\n                    },\n                }\n                if ([\"fill\", \"alpha\", \"outline\"].includes(variant)) {\n                    anim.from.height = prevRect?.height || 0\n                    anim.to.height = rect?.height || 0\n                }\n            }\n            setTrans(anim)\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [selectedIndex, variant, color, verticle])\n\n    let indicatorProps: any = useMemo(() => {\n        let _indicatorProps: any = {}\n        switch (variant) {\n            case \"start-line\":\n                if (verticle) {\n                    _indicatorProps = {\n                        left: 0,\n                        width: indicatorSize\n                    }\n                } else {\n                    _indicatorProps = {\n                        top: 0,\n                        height: indicatorSize\n                    }\n                }\n                break;\n            case \"end-line\":\n                if (verticle) {\n                    _indicatorProps = {\n                        right: 0,\n                        width: indicatorSize\n                    }\n                } else {\n                    _indicatorProps = {\n                        bottom: 0,\n                        height: indicatorSize\n                    }\n                }\n                break;\n            case \"fill\":\n                _indicatorProps = {\n                    top: 0,\n                    bgcolor: color\n                }\n                break;\n            case \"outline\":\n                _indicatorProps = {\n                    top: 0,\n                    border: 1,\n                    borderColor: color,\n                    bgcolor: \"transparent\"\n                }\n                break;\n            case \"alpha\":\n                _indicatorProps = {\n                    top: 0,\n                    bgcolor: `${color}.alpha`\n                }\n                break;\n            case \"text\":\n                _indicatorProps = {\n                    display: \"none\"\n                }\n                break;\n        }\n        return _indicatorProps\n    }, [selectedIndex, variant, color, verticle])\n\n    return (\n        <Tag\n            {...rest}\n            baseClass='tabs'\n            ref={ref}\n            sxr={{\n                position: \"relative\",\n                zIndex: 1,\n                display: \"inline-block\"\n            }}\n        >\n            <Tag\n                {...slotProps?.content}\n                baseClass='tabs-content'\n                sxr={{\n                    display: verticle ? \"flex\" : \"inline-flex\",\n                    flexDirection: verticle ? \"column\" : \"row\",\n                }}\n                ref={containerRef}\n            >\n                {childs}\n            </Tag>\n            <Transition\n                key={!!trans ? \"asd\" : \"qwe\"}\n                open={!!trans}\n                variant={trans || { from: {}, to: {} }}\n                easing=\"easeInOut\"\n                duration={trans ? (disableTransition ? 0 : 250) : 0}\n            >\n                <Tag\n                    baseClass='tabs-indicator'\n                    // className={classname}\n                    sxr={{\n                        position: \"absolute\",\n                        zIndex: -1,\n                        cursor: \"pointer\",\n                        bgcolor: color\n                    }}\n                    {...indicatorProps}\n                >\n                </Tag>\n            </Transition>\n        </Tag>\n    )\n})\n\nexport default Tabs"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/Text/index.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { TagComponentType, TagProps, useBreakpointPropsType } from '@xanui/core';
+
+type TextProps<T extends TagComponentType = "p"> = TagProps<T> & {
+    variant?: useBreakpointPropsType<"text" | "button" | "small" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6">;
+};
+declare const Text: React.ForwardRefExoticComponent<Omit<TextProps<TagComponentType>, "ref"> & React.RefAttributes<any>>;
+
+export { Text as default };
+export type { TextProps };

package/Text/index.js

@@ -0,0 +1,10 @@
+'use strict';Object.defineProperty(exports,'__esModule',{value:true});var tslib=require('tslib'),jsxRuntime=require('react/jsx-runtime'),React=require('react'),core=require('@xanui/core');const Text = React.forwardRef((_a, ref) => {
+    var _b;
+    var { children, variant } = _a, props = tslib.__rest(_a, ["children", "variant"]);
+    const _p = {};
+    if (variant)
+        _p.variant = variant;
+    const p = core.useBreakpointProps(_p);
+    variant = (_b = p.variant) !== null && _b !== void 0 ? _b : 'text';
+    return (jsxRuntime.jsx(core.Tag, Object.assign({ component: (variant === 'text' || variant === 'small' ? "p" : variant) }, props, { sxr: Object.assign({ fontSize: variant, lineHeight: variant, fontWeight: variant, color: "text.primary" }, props === null || props === void 0 ? void 0 : props.sx), baseClass: 'text', ref: ref }, { children: children })));
+});exports.default=Text;//# sourceMappingURL=index.js.map

package/Text/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../src/Text/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\n\n\nexport type TextProps<T extends TagComponentType = \"p\"> = TagProps<T> & {\n    variant?: useBreakpointPropsType<\"text\" | \"button\" | \"small\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\">\n}\n\nconst Text = React.forwardRef(<T extends TagComponentType = \"p\">({ children, variant, ...props }: TextProps<T>, ref?: React.Ref<any>) => {\n    const _p: any = {}\n    if (variant) _p.variant = variant\n    const p: any = useBreakpointProps(_p)\n    variant = p.variant ?? 'text'\n\n    return (\n        <Tag\n            component={(variant === 'text' || variant === 'small' ? \"p\" : variant) as any}\n            {...props}\n            sxr={{\n                fontSize: variant,\n                lineHeight: variant,\n                fontWeight: variant,\n                color: \"text.primary\",\n                ...(props as any)?.sx\n            }}\n            baseClass='text'\n            ref={ref}\n        >{children}</Tag>\n    )\n})\n\nexport default Text\n"],"names":["__rest","useBreakpointProps","_jsx","Tag"],"mappings":"4LASA,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAAC,CAAmC,EAA6C,EAAE,GAAoB,KAAI;;QAAvE,EAAE,QAAQ,EAAE,OAAO,EAAA,GAAA,EAA0B,EAArB,KAAK,GAAAA,YAAA,CAAA,EAAA,EAA7B,uBAA+B,CAAF;IAC1F,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,OAAO;AAAE,QAAA,EAAE,CAAC,OAAO,GAAG,OAAO;AACjC,IAAA,MAAM,CAAC,GAAQC,uBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,OAAO,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,MAAM;AAE7B,IAAA,QACIC,cAAA,CAACC,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,GAAG,OAAO,KAAK,MAAM,IAAI,OAAO,KAAK,OAAO,GAAG,GAAG,GAAG,OAAO,CAAQ,EAAA,EACzE,KAAK,EAAA,EACT,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,QAAQ,EAAE,OAAO,EACjB,UAAU,EAAE,OAAO,EACnB,UAAU,EAAE,OAAO,EACnB,KAAK,EAAE,cAAc,EAAA,EACjB,KAAa,aAAb,KAAK,KAAA,MAAA,GAAA,MAAA,GAAL,KAAK,CAAU,EAAE,CAAA,EAEzB,SAAS,EAAC,MAAM,EAChB,GAAG,EAAE,GAAG,EAAA,EAAA,EAAA,QAAA,EACV,QAAQ,EAAA,CAAA,CAAO;AAEzB,CAAC"}

package/Text/index.mjs

@@ -0,0 +1,10 @@
+import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import React from'react';import {useBreakpointProps,Tag}from'@xanui/core';const Text = React.forwardRef((_a, ref) => {
+    var _b;
+    var { children, variant } = _a, props = __rest(_a, ["children", "variant"]);
+    const _p = {};
+    if (variant)
+        _p.variant = variant;
+    const p = useBreakpointProps(_p);
+    variant = (_b = p.variant) !== null && _b !== void 0 ? _b : 'text';
+    return (jsx(Tag, Object.assign({ component: (variant === 'text' || variant === 'small' ? "p" : variant) }, props, { sxr: Object.assign({ fontSize: variant, lineHeight: variant, fontWeight: variant, color: "text.primary" }, props === null || props === void 0 ? void 0 : props.sx), baseClass: 'text', ref: ref }, { children: children })));
+});export{Text as default};//# sourceMappingURL=index.mjs.map

package/Text/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../src/Text/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\n\n\nexport type TextProps<T extends TagComponentType = \"p\"> = TagProps<T> & {\n    variant?: useBreakpointPropsType<\"text\" | \"button\" | \"small\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\">\n}\n\nconst Text = React.forwardRef(<T extends TagComponentType = \"p\">({ children, variant, ...props }: TextProps<T>, ref?: React.Ref<any>) => {\n    const _p: any = {}\n    if (variant) _p.variant = variant\n    const p: any = useBreakpointProps(_p)\n    variant = p.variant ?? 'text'\n\n    return (\n        <Tag\n            component={(variant === 'text' || variant === 'small' ? \"p\" : variant) as any}\n            {...props}\n            sxr={{\n                fontSize: variant,\n                lineHeight: variant,\n                fontWeight: variant,\n                color: \"text.primary\",\n                ...(props as any)?.sx\n            }}\n            baseClass='text'\n            ref={ref}\n        >{children}</Tag>\n    )\n})\n\nexport default Text\n"],"names":["_jsx"],"mappings":"yIASA,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAAC,CAAmC,EAA6C,EAAE,GAAoB,KAAI;;QAAvE,EAAE,QAAQ,EAAE,OAAO,EAAA,GAAA,EAA0B,EAArB,KAAK,GAAA,MAAA,CAAA,EAAA,EAA7B,uBAA+B,CAAF;IAC1F,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,OAAO;AAAE,QAAA,EAAE,CAAC,OAAO,GAAG,OAAO;AACjC,IAAA,MAAM,CAAC,GAAQ,kBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,OAAO,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,MAAM;AAE7B,IAAA,QACIA,GAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,GAAG,OAAO,KAAK,MAAM,IAAI,OAAO,KAAK,OAAO,GAAG,GAAG,GAAG,OAAO,CAAQ,EAAA,EACzE,KAAK,EAAA,EACT,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,QAAQ,EAAE,OAAO,EACjB,UAAU,EAAE,OAAO,EACnB,UAAU,EAAE,OAAO,EACnB,KAAK,EAAE,cAAc,EAAA,EACjB,KAAa,aAAb,KAAK,KAAA,MAAA,GAAA,MAAA,GAAL,KAAK,CAAU,EAAE,CAAA,EAEzB,SAAS,EAAC,MAAM,EAChB,GAAG,EAAE,GAAG,EAAA,EAAA,EAAA,QAAA,EACV,QAAQ,EAAA,CAAA,CAAO;AAEzB,CAAC"}

package/ThemeProvider/RenderRoot.js

@@ -0,0 +1,22 @@
+'use strict';Object.defineProperty(exports,'__esModule',{value:true});var jsxRuntime=require('react/jsx-runtime'),React=require('react');const Renderar = {
+    components: {},
+    dispatch: () => { },
+    create: (id, component) => {
+        Renderar.components[id] = component;
+    },
+    delete: (id) => {
+        if (Renderar.components[id]) {
+            delete Renderar.components[id];
+            Renderar.dispatch();
+        }
+    }
+};
+const RenderComponents = () => {
+    const [, dispatch] = React.useState(0);
+    React.useEffect(() => {
+        Renderar.dispatch = () => {
+            dispatch(Math.random());
+        };
+    }, []);
+    return jsxRuntime.jsx(jsxRuntime.Fragment, { children: Object.values(Renderar.components).map((Render, idx) => jsxRuntime.jsx(Render, {}, "renderar" + idx)) });
+};exports.RenderComponents=RenderComponents;exports.default=Renderar;//# sourceMappingURL=RenderRoot.js.map

package/ThemeProvider/RenderRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderRoot.js","sources":["../../src/ThemeProvider/RenderRoot.tsx"],"sourcesContent":["import { ReactNode, useEffect, useState } from \"react\";\n\n\ntype Callback = () => ReactNode\n\n\nconst Renderar = {\n   components: {} as { [id: string]: Callback },\n   dispatch: () => { },\n   create: (id: string, component: Callback) => {\n      Renderar.components[id] = component\n   },\n   delete: (id: string) => {\n      if (Renderar.components[id]) {\n         delete Renderar.components[id]\n         Renderar.dispatch()\n      }\n   }\n}\n\nexport default Renderar\n\nexport const RenderComponents = () => {\n   const [, dispatch] = useState(0)\n   useEffect(() => {\n      Renderar.dispatch = () => {\n         dispatch(Math.random())\n      }\n   }, [])\n\n   return <>{Object.values(Renderar.components).map((Render: any, idx) => <Render key={\"renderar\" + idx} />)}</>\n}"],"names":["useState","useEffect","_jsx","_Fragment"],"mappings":"yIAMA,MAAM,QAAQ,GAAG;AACd,IAAA,UAAU,EAAE,EAAgC;AAC5C,IAAA,QAAQ,EAAE,MAAK,EAAG,CAAC;AACnB,IAAA,MAAM,EAAE,CAAC,EAAU,EAAE,SAAmB,KAAI;AACzC,QAAA,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,GAAG,SAAS;IACtC,CAAC;AACD,IAAA,MAAM,EAAE,CAAC,EAAU,KAAI;AACpB,QAAA,IAAI,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,EAAE;AAC1B,YAAA,OAAO,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC;YAC9B,QAAQ,CAAC,QAAQ,EAAE;AACrB,QAAA;IACJ;;AAKI,MAAM,gBAAgB,GAAG,MAAK;IAClC,MAAM,GAAG,QAAQ,CAAC,GAAGA,cAAQ,CAAC,CAAC,CAAC;IAChCC,eAAS,CAAC,MAAK;AACZ,QAAA,QAAQ,CAAC,QAAQ,GAAG,MAAK;AACtB,YAAA,QAAQ,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;AAC1B,QAAA,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,OAAOC,cAAA,CAAAC,mBAAA,EAAA,EAAA,QAAA,EAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,MAAW,EAAE,GAAG,KAAKD,cAAA,CAAC,MAAM,EAAA,EAAA,EAAM,UAAU,GAAG,GAAG,CAAI,CAAC,EAAA,CAAI;AAChH"}

package/ThemeProvider/RenderRoot.mjs

@@ -0,0 +1,22 @@
+import {jsx,Fragment}from'react/jsx-runtime';import {useState,useEffect}from'react';const Renderar = {
+    components: {},
+    dispatch: () => { },
+    create: (id, component) => {
+        Renderar.components[id] = component;
+    },
+    delete: (id) => {
+        if (Renderar.components[id]) {
+            delete Renderar.components[id];
+            Renderar.dispatch();
+        }
+    }
+};
+const RenderComponents = () => {
+    const [, dispatch] = useState(0);
+    useEffect(() => {
+        Renderar.dispatch = () => {
+            dispatch(Math.random());
+        };
+    }, []);
+    return jsx(Fragment, { children: Object.values(Renderar.components).map((Render, idx) => jsx(Render, {}, "renderar" + idx)) });
+};export{RenderComponents,Renderar as default};//# sourceMappingURL=RenderRoot.mjs.map

package/ThemeProvider/RenderRoot.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderRoot.mjs","sources":["../../src/ThemeProvider/RenderRoot.tsx"],"sourcesContent":["import { ReactNode, useEffect, useState } from \"react\";\n\n\ntype Callback = () => ReactNode\n\n\nconst Renderar = {\n   components: {} as { [id: string]: Callback },\n   dispatch: () => { },\n   create: (id: string, component: Callback) => {\n      Renderar.components[id] = component\n   },\n   delete: (id: string) => {\n      if (Renderar.components[id]) {\n         delete Renderar.components[id]\n         Renderar.dispatch()\n      }\n   }\n}\n\nexport default Renderar\n\nexport const RenderComponents = () => {\n   const [, dispatch] = useState(0)\n   useEffect(() => {\n      Renderar.dispatch = () => {\n         dispatch(Math.random())\n      }\n   }, [])\n\n   return <>{Object.values(Renderar.components).map((Render: any, idx) => <Render key={\"renderar\" + idx} />)}</>\n}"],"names":["_jsx","_Fragment"],"mappings":"oFAMA,MAAM,QAAQ,GAAG;AACd,IAAA,UAAU,EAAE,EAAgC;AAC5C,IAAA,QAAQ,EAAE,MAAK,EAAG,CAAC;AACnB,IAAA,MAAM,EAAE,CAAC,EAAU,EAAE,SAAmB,KAAI;AACzC,QAAA,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,GAAG,SAAS;IACtC,CAAC;AACD,IAAA,MAAM,EAAE,CAAC,EAAU,KAAI;AACpB,QAAA,IAAI,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,EAAE;AAC1B,YAAA,OAAO,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC;YAC9B,QAAQ,CAAC,QAAQ,EAAE;AACrB,QAAA;IACJ;;AAKI,MAAM,gBAAgB,GAAG,MAAK;IAClC,MAAM,GAAG,QAAQ,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC;IAChC,SAAS,CAAC,MAAK;AACZ,QAAA,QAAQ,CAAC,QAAQ,GAAG,MAAK;AACtB,YAAA,QAAQ,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;AAC1B,QAAA,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,OAAOA,GAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,MAAW,EAAE,GAAG,KAAKD,GAAA,CAAC,MAAM,EAAA,EAAA,EAAM,UAAU,GAAG,GAAG,CAAI,CAAC,EAAA,CAAI;AAChH"}

package/ThemeProvider/index.d.ts

@@ -0,0 +1,8 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ThemeProviderProps as ThemeProviderProps$1 } from '@xanui/core';
+
+type ThemeProviderProps = ThemeProviderProps$1 & {};
+declare const ThemeProvider: ({ children, ...props }: ThemeProviderProps) => react_jsx_runtime.JSX.Element;
+
+export { ThemeProvider as default };
+export type { ThemeProviderProps };

package/ThemeProvider/index.js

@@ -0,0 +1,4 @@
+'use strict';Object.defineProperty(exports,'__esModule',{value:true});var tslib=require('tslib'),jsxRuntime=require('react/jsx-runtime'),core=require('@xanui/core'),RenderRoot=require('./RenderRoot.js');const ThemeProvider = (_a) => {
+    var { children } = _a, props = tslib.__rest(_a, ["children"]);
+    return (jsxRuntime.jsx(core.ThemeProvider, Object.assign({}, props, { renderIsRoot: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [props.renderIsRoot, jsxRuntime.jsx(RenderRoot.RenderComponents, {})] }) }, { children: children })));
+};exports.default=ThemeProvider;//# sourceMappingURL=index.js.map

package/ThemeProvider/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../src/ThemeProvider/index.tsx"],"sourcesContent":["import { ThemeProvider as RootThemeProvider, ThemeProviderProps as RootThemeProviderProps } from '@xanui/core'\nimport { RenderComponents } from './RenderRoot'\n\nexport type ThemeProviderProps = RootThemeProviderProps & {\n\n}\n\nconst ThemeProvider = ({ children, ...props }: ThemeProviderProps) => {\n    return (\n        <RootThemeProvider\n            {...props}\n            renderIsRoot={<>\n                {props.renderIsRoot}\n                <RenderComponents />\n            </>}\n        >\n            {children}\n        </RootThemeProvider>\n    )\n}\n\nexport default ThemeProvider"],"names":["__rest","_jsx","RootThemeProvider","_jsxs","_Fragment","RenderComponents"],"mappings":"2MAOA,MAAM,aAAa,GAAG,CAAC,EAA0C,KAAI;AAA9C,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAgC,EAA3B,KAAK,GAAAA,YAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;IACvC,QACIC,eAACC,kBAAiB,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACV,KAAK,EAAA,EACT,YAAY,EAAEC,eAAA,CAAAC,mBAAA,EAAA,EAAA,QAAA,EAAA,CACT,KAAK,CAAC,YAAY,EACnBH,eAACI,2BAAgB,EAAA,EAAA,CAAG,IACrB,EAAA,EAAA,EAAA,QAAA,EAEF,QAAQ,EAAA,CAAA,CACO;AAE5B"}

package/ThemeProvider/index.mjs

@@ -0,0 +1,4 @@
+import {__rest}from'tslib';import {jsx,jsxs,Fragment}from'react/jsx-runtime';import {ThemeProvider as ThemeProvider$1}from'@xanui/core';import {RenderComponents}from'./RenderRoot.mjs';const ThemeProvider = (_a) => {
+    var { children } = _a, props = __rest(_a, ["children"]);
+    return (jsx(ThemeProvider$1, Object.assign({}, props, { renderIsRoot: jsxs(Fragment, { children: [props.renderIsRoot, jsx(RenderComponents, {})] }) }, { children: children })));
+};export{ThemeProvider as default};//# sourceMappingURL=index.mjs.map

package/ThemeProvider/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../src/ThemeProvider/index.tsx"],"sourcesContent":["import { ThemeProvider as RootThemeProvider, ThemeProviderProps as RootThemeProviderProps } from '@xanui/core'\nimport { RenderComponents } from './RenderRoot'\n\nexport type ThemeProviderProps = RootThemeProviderProps & {\n\n}\n\nconst ThemeProvider = ({ children, ...props }: ThemeProviderProps) => {\n    return (\n        <RootThemeProvider\n            {...props}\n            renderIsRoot={<>\n                {props.renderIsRoot}\n                <RenderComponents />\n            </>}\n        >\n            {children}\n        </RootThemeProvider>\n    )\n}\n\nexport default ThemeProvider"],"names":["_jsx","RootThemeProvider","_jsxs","_Fragment"],"mappings":"wLAOA,MAAM,aAAa,GAAG,CAAC,EAA0C,KAAI;AAA9C,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAgC,EAA3B,KAAK,GAAA,MAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;IACvC,QACIA,IAACC,eAAiB,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACV,KAAK,EAAA,EACT,YAAY,EAAEC,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACT,KAAK,CAAC,YAAY,EACnBH,IAAC,gBAAgB,EAAA,EAAA,CAAG,IACrB,EAAA,EAAA,EAAA,QAAA,EAEF,QAAQ,EAAA,CAAA,CACO;AAE5B"}

package/Toast/index.d.ts

@@ -0,0 +1,20 @@
+import { useBreakpointPropsType, ColorTemplateType, ColorTemplateColors } from '@xanui/core';
+import { ReactElement } from 'react';
+import { AlertProps } from '../Alert/index.js';
+
+type PlacementType = "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
+type ToastProps = {
+    title?: useBreakpointPropsType<string | ReactElement>;
+    content?: AlertProps['children'];
+    variant?: useBreakpointPropsType<ColorTemplateType>;
+    color?: useBreakpointPropsType<ColorTemplateColors>;
+    icon?: useBreakpointPropsType<"info" | "warning" | "success" | "error" | false | ReactElement>;
+    placement?: PlacementType;
+    closeable?: useBreakpointPropsType<boolean>;
+};
+declare const Toast: {
+    open: (props: ToastProps) => void;
+};
+
+export { Toast as default };
+export type { ToastProps };