@xanui/ui 1.1.14 → 1.1.16

package/Input/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/Input/index.tsx"],"sourcesContent":["\nimport React, { MutableRefObject, ReactElement, useEffect, useMemo, useRef, useState } from 'react';\nimport { Tag, TagProps, TagComponentType, UseColorTemplateColor, useBreakpointPropsType, useInterface, useBreakpointProps } from '@xanui/core';\nimport Text from '../Text';\n\n\n\nexport type InputProps<T extends TagComponentType = \"input\"> = Omit<TagProps<T>, \"size\" | \"color\"> & {\n    startIcon?: useBreakpointPropsType<ReactElement>;\n    endIcon?: useBreakpointPropsType<ReactElement>;\n    iconPlacement?: useBreakpointPropsType<\"start\" | \"center\" | \"end\">;\n    focused?: boolean;\n    color?: useBreakpointPropsType<Omit<UseColorTemplateColor, \"default\">>;\n    containerRef?: MutableRefObject<HTMLDivElement | undefined>;\n    variant?: useBreakpointPropsType<\"fill\" | \"outline\" | \"text\">;\n    error?: boolean;\n    helperText?: useBreakpointPropsType<string>;\n    multiline?: boolean;\n    size?: useBreakpointPropsType<\"small\" | \"medium\" | \"large\">;\n    rows?: useBreakpointPropsType<number>;\n    minRows?: useBreakpointPropsType<number>;\n    maxRows?: useBreakpointPropsType<number>;\n    slotProps?: {\n        container?: Omit<TagProps<\"div\">, \"children\">\n    }\n}\n\nconst Input = React.forwardRef(<T extends TagComponentType = \"input\">({ value, ...props }: InputProps<T>, ref?: React.Ref<any>) => {\n    let [{\n        startIcon,\n        endIcon,\n        iconPlacement,\n        onFocus,\n        color,\n        onBlur,\n        focused,\n        containerRef,\n        disabled,\n        variant,\n        error,\n        helperText,\n        multiline,\n        size,\n        rows,\n        minRows,\n        maxRows,\n        slotProps,\n        ...rest\n    }, theme] = useInterface<any>(\"Input\", props, {})\n\n    const _p: any = {}\n    if (startIcon) _p.startIcon = startIcon\n    if (endIcon) _p.endIcon = endIcon\n    if (iconPlacement) _p.iconPlacement = iconPlacement\n    if (color) _p.color = color\n    if (variant) _p.variant = variant\n    if (helperText) _p.helperText = helperText\n    if (size) _p.size = size\n    if (rows) _p.rows = rows\n    if (minRows) _p.minRows = minRows\n    if (maxRows) _p.maxRows = maxRows\n    const p: any = useBreakpointProps(_p)\n    startIcon = p.startIcon\n    endIcon = p.endIcon\n    iconPlacement = p.iconPlacement\n    color = p.color ?? \"brand\"\n    variant = p.variant ?? \"fill\"\n    helperText = p.helperText\n    size = p.size ?? 'medium'\n    rows = p.rows\n    minRows = p.minRows\n    maxRows = p.maxRows\n\n    ref ??= useRef(null);\n    iconPlacement ??= multiline ? \"end\" : \"center\"\n    if (!value) iconPlacement = 'center'\n\n    const [_focused, setFocused] = useState(false)\n    const conRef: any = useRef(null)\n    let _focus = focused || _focused\n\n    useEffect(() => {\n        if (containerRef) {\n            (containerRef as any).current = conRef?.current\n        }\n    }, [containerRef])\n\n    let _rows = useMemo(() => {\n        if (rows) return rows\n        if (value && multiline) {\n            let lines = (value as string).split(`\\n`).length\n            if (minRows && minRows > lines) {\n                return minRows\n            } else if (maxRows && maxRows < lines) {\n                return maxRows\n            } else {\n                return lines\n            }\n        }\n    }, [value]) || 1\n\n    const sizes: any = {\n        small: {\n            height: 40,\n            gap: .5,\n            fontSize: 'button',\n        },\n        medium: {\n            height: 48,\n            gap: 1,\n            fontSize: \"text\"\n        },\n        large: {\n            height: 52,\n            gap: 1,\n            fontSize: 'big'\n        }\n    }\n\n    const _size = sizes[size]\n    let borderColor = _focus ? color : (variant === \"fill\" ? \"transparent\" : \"divider\")\n    borderColor = error ? \"danger.primary\" : borderColor\n    let multiprops: any = {}\n    if (multiline) {\n        multiprops = {\n            rows: _rows,\n            sx: {\n                resize: \"none\"\n            }\n        }\n    }\n\n    useEffect(() => {\n        if ((ref as any).current) {\n            (ref as any).current.style.height = \"auto\";\n            (ref as any).current.style.height = `${(ref as any).current.scrollHeight}px`;\n        }\n    }, [value]);\n\n    return (\n        <Tag\n            baseClass={`input${_focus ? \" input-focused\" : \"\"}`}\n        >\n            <Tag\n                {...slotProps?.container}\n                sxr={{\n                    display: \"flex\",\n                    flexDirection: \"row\",\n                    alignItems: iconPlacement === 'center' ? iconPlacement : `flex-${iconPlacement}`,\n                    flexWrap: \"nowrap\",\n                    minWidth: 150,\n                    transitionProperty: \"border, box-shadow, background\",\n                    bgcolor: error ? \"danger.soft.primary\" : variant === \"fill\" ? \"background.secondary\" : \"background.primary\",\n                    border: variant === \"text\" ? 0 : \"1px solid\",\n                    borderColor: borderColor,\n                    borderRadius: 1,\n                    px: 1,\n                    py: .5,\n                }}\n                baseClass='input-container'\n                disabled={disabled || false}\n                ref={conRef}\n                {..._size}\n                height={multiline ? \"auto\" : _size.height}\n                minHeight={_size.height}\n            >\n                {startIcon && <Tag\n                    flex={\"0 0 auto\"}\n                    sxr={{\n                        height: \"100%\",\n                        alignItems: 'center',\n                        justifyContent: \"center\",\n                        display: \"flex\",\n                        color: error ? \"danger.primary\" : \"text.secondary\",\n                    }}\n                    baseClass=\"input-start-icon\"\n                >{startIcon}</Tag>}\n                <Tag\n                    flex={1}\n                    sxr={{\n                        display: \"flex\",\n                        alignItems: \"center\",\n                        flex: 1,\n                        minHeight: _size.height,\n                        \"& textarea\": {\n                            resize: \"none\"\n                        },\n                        \"& input:-webkit-autofill,& input:-webkit-autofill:hover, & input:-webkit-autofill:focus,& input:-webkit-autofill:active\": {\n                            \"-webkit-text-fill-color\": \"text.primary\",\n                            \"box-shadow\": `0 0 0px 1000px ${variant === \"fill\" ? theme.colors.background.secondary : theme.colors.background.primary} inset`,\n                            transition: \"background-color 5000s ease-in-out 0s\"\n                        } as any\n                    }}\n                >\n                    <Tag\n                        component={multiline ? 'textarea' : 'input'}\n                        {...multiprops}\n                        {...rest}\n                        sxr={{\n                            border: 0,\n                            outline: 0,\n                            bgcolor: \"transparent\",\n                            color: error ? \"danger.primary\" : \"text.primary\",\n                            fontSize: _size.fontSize,\n                            height: multiline ? \"auto\" : _size.height + \"px!important\",\n                            width: \"100%\",\n                            maxHeight: 200,\n                        }}\n                        value={value}\n                        baseClass='input-box'\n                        ref={ref}\n                        onFocus={(e: any) => {\n                            focused ?? setFocused(true)\n                            onFocus && onFocus(e)\n                        }}\n                        onBlur={(e: any) => {\n                            focused ?? setFocused(false)\n                            onBlur && onBlur(e)\n                        }}\n                    />\n                </Tag>\n                {endIcon && <Tag\n                    flex={\"0 0 auto\"}\n                    sxr={{\n                        height: \"100%\",\n                        alignItems: 'center',\n                        justifyContent: \"center\",\n                        display: 'flex',\n                        color: error ? \"danger.primary\" : \"text.secondary\",\n                    }}\n                    baseClass=\"input-end-icon\"\n                >{endIcon}</Tag>}\n            </Tag>\n            {helperText && <Text\n                pl={.5}\n                className=\"input-helper-text\"\n                fontSize=\"small\"\n                color={error ? \"danger.primary\" : \"text.primary\"}\n            >{helperText}</Text>}\n        </Tag>\n    )\n})\n\nexport default Input\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../src/Input/index.tsx"],"sourcesContent":["\"use client\";\r\nimport React, { MutableRefObject, ReactElement, useEffect, useMemo, useRef, useState } from 'react';\r\nimport { Tag, TagProps, TagComponentType, UseColorTemplateColor, useBreakpointPropsType, useInterface, useBreakpointProps } from '@xanui/core';\r\nimport Text from '../Text';\r\n\r\nexport type InputProps<T extends TagComponentType = \"input\"> = Omit<TagProps<T>, \"size\" | \"color\"> & {\r\n    startIcon?: useBreakpointPropsType<ReactElement>;\r\n    endIcon?: useBreakpointPropsType<ReactElement>;\r\n    iconPlacement?: useBreakpointPropsType<\"start\" | \"center\" | \"end\">;\r\n    focused?: boolean;\r\n    color?: useBreakpointPropsType<Omit<UseColorTemplateColor, \"default\">>;\r\n    containerRef?: MutableRefObject<HTMLDivElement | undefined>;\r\n    variant?: useBreakpointPropsType<\"fill\" | \"outline\" | \"text\">;\r\n    error?: boolean;\r\n    helperText?: useBreakpointPropsType<string>;\r\n    multiline?: boolean;\r\n    size?: useBreakpointPropsType<\"small\" | \"medium\" | \"large\">;\r\n    rows?: useBreakpointPropsType<number>;\r\n    minRows?: useBreakpointPropsType<number>;\r\n    maxRows?: useBreakpointPropsType<number>;\r\n    slotProps?: {\r\n        container?: Omit<TagProps<\"div\">, \"children\">\r\n    }\r\n}\r\n\r\nconst Input = React.forwardRef(<T extends TagComponentType = \"input\">({ value, ...props }: InputProps<T>, ref?: React.Ref<any>) => {\r\n    let [{\r\n        startIcon,\r\n        endIcon,\r\n        iconPlacement,\r\n        onFocus,\r\n        color,\r\n        onBlur,\r\n        focused,\r\n        containerRef,\r\n        disabled,\r\n        variant,\r\n        error,\r\n        helperText,\r\n        multiline,\r\n        size,\r\n        rows,\r\n        minRows,\r\n        maxRows,\r\n        slotProps,\r\n        ...rest\r\n    }, theme] = useInterface<any>(\"Input\", props, {})\r\n\r\n    const _p: any = {}\r\n    if (startIcon) _p.startIcon = startIcon\r\n    if (endIcon) _p.endIcon = endIcon\r\n    if (iconPlacement) _p.iconPlacement = iconPlacement\r\n    if (color) _p.color = color\r\n    if (variant) _p.variant = variant\r\n    if (helperText) _p.helperText = helperText\r\n    if (size) _p.size = size\r\n    if (rows) _p.rows = rows\r\n    if (minRows) _p.minRows = minRows\r\n    if (maxRows) _p.maxRows = maxRows\r\n    const p: any = useBreakpointProps(_p)\r\n    startIcon = p.startIcon\r\n    endIcon = p.endIcon\r\n    iconPlacement = p.iconPlacement\r\n    color = p.color ?? \"brand\"\r\n    variant = p.variant ?? \"fill\"\r\n    helperText = p.helperText\r\n    size = p.size ?? 'medium'\r\n    rows = p.rows\r\n    minRows = p.minRows\r\n    maxRows = p.maxRows\r\n\r\n    ref ??= useRef(null);\r\n    iconPlacement ??= multiline ? \"end\" : \"center\"\r\n    if (!value) iconPlacement = 'center'\r\n\r\n    const [_focused, setFocused] = useState(false)\r\n    const conRef: any = useRef(null)\r\n    let _focus = focused || _focused\r\n\r\n    useEffect(() => {\r\n        if (containerRef) {\r\n            (containerRef as any).current = conRef?.current\r\n        }\r\n    }, [containerRef])\r\n\r\n    let _rows = useMemo(() => {\r\n        if (rows) return rows\r\n        if (value && multiline) {\r\n            let lines = (value as string).split(`\\n`).length\r\n            if (minRows && minRows > lines) {\r\n                return minRows\r\n            } else if (maxRows && maxRows < lines) {\r\n                return maxRows\r\n            } else {\r\n                return lines\r\n            }\r\n        }\r\n    }, [value]) || 1\r\n\r\n    const sizes: any = {\r\n        small: {\r\n            height: 40,\r\n            gap: .5,\r\n            fontSize: 'button',\r\n        },\r\n        medium: {\r\n            height: 48,\r\n            gap: 1,\r\n            fontSize: \"text\"\r\n        },\r\n        large: {\r\n            height: 52,\r\n            gap: 1,\r\n            fontSize: 'big'\r\n        }\r\n    }\r\n\r\n    const _size = sizes[size]\r\n    let borderColor = _focus ? color : (variant === \"fill\" ? \"transparent\" : \"divider\")\r\n    borderColor = error ? \"danger.primary\" : borderColor\r\n    let multiprops: any = {}\r\n    if (multiline) {\r\n        multiprops = {\r\n            rows: _rows,\r\n            sx: {\r\n                resize: \"none\"\r\n            }\r\n        }\r\n    }\r\n\r\n    useEffect(() => {\r\n        if ((ref as any).current) {\r\n            (ref as any).current.style.height = \"auto\";\r\n            (ref as any).current.style.height = `${(ref as any).current.scrollHeight}px`;\r\n        }\r\n    }, [value]);\r\n\r\n    return (\r\n        <Tag\r\n            baseClass={`input${_focus ? \" input-focused\" : \"\"}`}\r\n        >\r\n            <Tag\r\n                {...slotProps?.container}\r\n                sxr={{\r\n                    display: \"flex\",\r\n                    flexDirection: \"row\",\r\n                    alignItems: iconPlacement === 'center' ? iconPlacement : `flex-${iconPlacement}`,\r\n                    flexWrap: \"nowrap\",\r\n                    // minWidth: 100,\r\n                    transitionProperty: \"border, box-shadow, background\",\r\n                    bgcolor: error ? \"danger.soft.primary\" : variant === \"fill\" ? \"background.secondary\" : \"background.primary\",\r\n                    border: variant === \"text\" ? 0 : \"1px solid\",\r\n                    borderColor: borderColor,\r\n                    borderRadius: 1,\r\n                    px: 1,\r\n                    py: .5,\r\n                }}\r\n                baseClass='input-container'\r\n                disabled={disabled || false}\r\n                ref={conRef}\r\n                {..._size}\r\n                height={multiline ? \"auto\" : _size.height}\r\n                minHeight={_size.height}\r\n            >\r\n                {startIcon && <Tag\r\n                    flex={\"0 0 auto\"}\r\n                    sxr={{\r\n                        height: \"100%\",\r\n                        alignItems: 'center',\r\n                        justifyContent: \"center\",\r\n                        display: \"flex\",\r\n                        color: error ? \"danger.primary\" : \"text.secondary\",\r\n                    }}\r\n                    baseClass=\"input-start-icon\"\r\n                >{startIcon}</Tag>}\r\n                <Tag\r\n                    flex={1}\r\n                    sxr={{\r\n                        display: \"flex\",\r\n                        alignItems: \"center\",\r\n                        flex: 1,\r\n                        minHeight: _size.height,\r\n                        \"& textarea\": {\r\n                            resize: \"none\"\r\n                        },\r\n                        \"& input:-webkit-autofill,& input:-webkit-autofill:hover, & input:-webkit-autofill:focus,& input:-webkit-autofill:active\": {\r\n                            \"-webkit-text-fill-color\": \"text.primary\",\r\n                            \"box-shadow\": `0 0 0px 1000px ${variant === \"fill\" ? theme.colors.background.secondary : theme.colors.background.primary} inset`,\r\n                            transition: \"background-color 5000s ease-in-out 0s\"\r\n                        } as any\r\n                    }}\r\n                >\r\n                    <Tag\r\n                        component={multiline ? 'textarea' : 'input'}\r\n                        {...multiprops}\r\n                        {...rest}\r\n                        sxr={{\r\n                            border: 0,\r\n                            outline: 0,\r\n                            bgcolor: \"transparent\",\r\n                            color: error ? \"danger.primary\" : \"text.primary\",\r\n                            fontSize: _size.fontSize,\r\n                            height: multiline ? \"auto\" : _size.height + \"px!important\",\r\n                            width: \"100%\",\r\n                            maxHeight: 200,\r\n                        }}\r\n                        value={value}\r\n                        baseClass='input-box'\r\n                        ref={ref}\r\n                        onFocus={(e: any) => {\r\n                            focused ?? setFocused(true)\r\n                            onFocus && onFocus(e)\r\n                        }}\r\n                        onBlur={(e: any) => {\r\n                            focused ?? setFocused(false)\r\n                            onBlur && onBlur(e)\r\n                        }}\r\n                    />\r\n                </Tag>\r\n                {endIcon && <Tag\r\n                    flex={\"0 0 auto\"}\r\n                    sxr={{\r\n                        height: \"100%\",\r\n                        alignItems: 'center',\r\n                        justifyContent: \"center\",\r\n                        display: 'flex',\r\n                        color: error ? \"danger.primary\" : \"text.secondary\",\r\n                    }}\r\n                    baseClass=\"input-end-icon\"\r\n                >{endIcon}</Tag>}\r\n            </Tag>\r\n            {helperText && <Text\r\n                pl={.5}\r\n                className=\"input-helper-text\"\r\n                fontSize=\"small\"\r\n                color={error ? \"danger.primary\" : \"text.primary\"}\r\n            >{helperText}</Text>}\r\n        </Tag>\r\n    )\r\n})\r\n\r\nexport default Input\r\n"],"names":[],"mappings":";;;;;;;AAyBA;;AAAsE;;;AAwBlE;AAAe;AACf;AAAa;AACb;AAAmB;AACnB;AAAW;AACX;AAAa;AACb;AAAgB;AAChB;AAAU;AACV;AAAU;AACV;AAAa;AACb;AAAa;AACb;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAGA;AACA;;;AAGA;AACA;;;;;AAMA;AAEA;AACI;AAAU;AACV;;AAEI;AACI;;AACG;AACH;;;AAEA;;;AAGZ;AAEA;AACI;AACI;AACA;AACA;AACH;AACD;AACI;AACA;AACA;AACH;AACD;AACI;AACA;AACA;AACH;;AAGL;;;;;AAKI;AACI;AACA;AACI;AACH;;;;AAKL;;AAEK;;AAET;AAEA;AAOgB;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAYI;AACA;AACA;AACA;;AAEH;AAMG;AACA;AACA;;AAEA;AACI;AACH;AACD;AACI;;AAEA;AACI;;AAQJ;AACA;AACA;;;AAGA;AACA;AACA;AACH;;AAMG;AACJ;;AAGI;AACJ;AAMA;AACA;AACA;AACA;;AAEH;AAYrB;;"}

package/Label/index.js

@@ -1,4 +1,11 @@
-'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 Label = React.forwardRef((_a, ref) => {
+'use strict';
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var core = require('@xanui/core');
+
+const Label = React.forwardRef((_a, ref) => {
     var { children } = _a, rest = tslib.__rest(_a, ["children"]);
     return jsxRuntime.jsx(core.Tag, Object.assign({ component: 'label' }, rest, { sxr: {
             display: "inline-flex",
@@ -11,4 +18,7 @@
             cursor: "pointer",
             fontWeight: "500",
         }, baseClass: 'label', ref: ref, children: children }));
-});exports.default=Label;//# sourceMappingURL=index.js.map
+});
+
+module.exports = Label;
+//# sourceMappingURL=index.js.map

package/Label/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/Label/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType } from '@xanui/core';\n\nexport type LabelProps<T extends TagComponentType = \"label\"> = TagProps<T>\n\nconst Label = React.forwardRef(<T extends TagComponentType = \"label\">({ children, ...rest }: LabelProps<T>, ref: React.Ref<any>) => {\n    return <Tag\n        component='label'\n        {...rest}\n        sxr={{\n            display: \"inline-flex\",\n            alignItems: \"center\",\n            verticalAlign: \"middle\",\n            fontSize: \"text\",\n            gap: .4,\n            color: \"text.primary\",\n            userSelect: \"none\",\n            cursor: \"pointer\",\n            fontWeight: \"500\",\n        }}\n        baseClass='label'\n        ref={ref}\n    >{children}</Tag>\n})\n\nexport default Label"],"names":["__rest","_jsx","Tag"],"mappings":"4LAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAuC,EAAoC,EAAE,GAAmB,KAAI;AAA7D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA0B,EAArB,IAAI,GAAAA,YAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;IACrF,OAAOC,cAAA,CAACC,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACP,SAAS,EAAC,OAAO,EAAA,EACb,IAAI,EAAA,EACR,GAAG,EAAE;AACD,YAAA,OAAO,EAAE,aAAa;AACtB,YAAA,UAAU,EAAE,QAAQ;AACpB,YAAA,aAAa,EAAE,QAAQ;AACvB,YAAA,QAAQ,EAAE,MAAM;AAChB,YAAA,GAAG,EAAE,EAAE;AACP,YAAA,KAAK,EAAE,cAAc;AACrB,YAAA,UAAU,EAAE,MAAM;AAClB,YAAA,MAAM,EAAE,SAAS;AACjB,YAAA,UAAU,EAAE,KAAK;SACpB,EACD,SAAS,EAAC,OAAO,EACjB,GAAG,EAAE,GAAG,EAAA,QAAA,EACV,QAAQ,EAAA,CAAA,CAAO;AACrB,CAAC"}
+{"version":3,"file":"index.js","sources":["../../src/Label/index.tsx"],"sourcesContent":["\r\nimport React from 'react';\r\nimport { Tag, TagProps, TagComponentType } from '@xanui/core';\r\n\r\nexport type LabelProps<T extends TagComponentType = \"label\"> = TagProps<T>\r\n\r\nconst Label = React.forwardRef(<T extends TagComponentType = \"label\">({ children, ...rest }: LabelProps<T>, ref: React.Ref<any>) => {\r\n    return <Tag\r\n        component='label'\r\n        {...rest}\r\n        sxr={{\r\n            display: \"inline-flex\",\r\n            alignItems: \"center\",\r\n            verticalAlign: \"middle\",\r\n            fontSize: \"text\",\r\n            gap: .4,\r\n            color: \"text.primary\",\r\n            userSelect: \"none\",\r\n            cursor: \"pointer\",\r\n            fontWeight: \"500\",\r\n        }}\r\n        baseClass='label'\r\n        ref={ref}\r\n    >{children}</Tag>\r\n})\r\n\r\nexport default Label"],"names":["__rest","_jsx","Tag"],"mappings":";;;;;;;AAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAuC,EAAoC,EAAE,GAAmB,KAAI;AAA7D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA0B,EAArB,IAAI,GAAAA,YAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;IACrF,OAAOC,cAAA,CAACC,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACP,SAAS,EAAC,OAAO,EAAA,EACb,IAAI,EAAA,EACR,GAAG,EAAE;AACD,YAAA,OAAO,EAAE,aAAa;AACtB,YAAA,UAAU,EAAE,QAAQ;AACpB,YAAA,aAAa,EAAE,QAAQ;AACvB,YAAA,QAAQ,EAAE,MAAM;AAChB,YAAA,GAAG,EAAE,EAAE;AACP,YAAA,KAAK,EAAE,cAAc;AACrB,YAAA,UAAU,EAAE,MAAM;AAClB,YAAA,MAAM,EAAE,SAAS;AACjB,YAAA,UAAU,EAAE,KAAK;SACpB,EACD,SAAS,EAAC,OAAO,EACjB,GAAG,EAAE,GAAG,EAAA,QAAA,EACV,QAAQ,EAAA,CAAA,CAAO;AACrB,CAAC;;;;"}

package/Label/index.mjs

@@ -1,4 +1,9 @@
-import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import React from'react';import {Tag}from'@xanui/core';const Label = React.forwardRef((_a, ref) => {
+import { __rest } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+import React from 'react';
+import { Tag } from '@xanui/core';
+
+const Label = React.forwardRef((_a, ref) => {
     var { children } = _a, rest = __rest(_a, ["children"]);
     return jsx(Tag, Object.assign({ component: 'label' }, rest, { sxr: {
             display: "inline-flex",
@@ -11,4 +16,7 @@ import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import React from
             cursor: "pointer",
             fontWeight: "500",
         }, baseClass: 'label', ref: ref, children: children }));
-});export{Label as default};//# sourceMappingURL=index.mjs.map
+});
+
+export { Label as default };
+//# sourceMappingURL=index.mjs.map

package/Label/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/Label/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType } from '@xanui/core';\n\nexport type LabelProps<T extends TagComponentType = \"label\"> = TagProps<T>\n\nconst Label = React.forwardRef(<T extends TagComponentType = \"label\">({ children, ...rest }: LabelProps<T>, ref: React.Ref<any>) => {\n    return <Tag\n        component='label'\n        {...rest}\n        sxr={{\n            display: \"inline-flex\",\n            alignItems: \"center\",\n            verticalAlign: \"middle\",\n            fontSize: \"text\",\n            gap: .4,\n            color: \"text.primary\",\n            userSelect: \"none\",\n            cursor: \"pointer\",\n            fontWeight: \"500\",\n        }}\n        baseClass='label'\n        ref={ref}\n    >{children}</Tag>\n})\n\nexport default Label"],"names":["_jsx"],"mappings":"sHAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAuC,EAAoC,EAAE,GAAmB,KAAI;AAA7D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA0B,EAArB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;IACrF,OAAOA,GAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACP,SAAS,EAAC,OAAO,EAAA,EACb,IAAI,EAAA,EACR,GAAG,EAAE;AACD,YAAA,OAAO,EAAE,aAAa;AACtB,YAAA,UAAU,EAAE,QAAQ;AACpB,YAAA,aAAa,EAAE,QAAQ;AACvB,YAAA,QAAQ,EAAE,MAAM;AAChB,YAAA,GAAG,EAAE,EAAE;AACP,YAAA,KAAK,EAAE,cAAc;AACrB,YAAA,UAAU,EAAE,MAAM;AAClB,YAAA,MAAM,EAAE,SAAS;AACjB,YAAA,UAAU,EAAE,KAAK;SACpB,EACD,SAAS,EAAC,OAAO,EACjB,GAAG,EAAE,GAAG,EAAA,QAAA,EACV,QAAQ,EAAA,CAAA,CAAO;AACrB,CAAC"}
+{"version":3,"file":"index.mjs","sources":["../../src/Label/index.tsx"],"sourcesContent":["\r\nimport React from 'react';\r\nimport { Tag, TagProps, TagComponentType } from '@xanui/core';\r\n\r\nexport type LabelProps<T extends TagComponentType = \"label\"> = TagProps<T>\r\n\r\nconst Label = React.forwardRef(<T extends TagComponentType = \"label\">({ children, ...rest }: LabelProps<T>, ref: React.Ref<any>) => {\r\n    return <Tag\r\n        component='label'\r\n        {...rest}\r\n        sxr={{\r\n            display: \"inline-flex\",\r\n            alignItems: \"center\",\r\n            verticalAlign: \"middle\",\r\n            fontSize: \"text\",\r\n            gap: .4,\r\n            color: \"text.primary\",\r\n            userSelect: \"none\",\r\n            cursor: \"pointer\",\r\n            fontWeight: \"500\",\r\n        }}\r\n        baseClass='label'\r\n        ref={ref}\r\n    >{children}</Tag>\r\n})\r\n\r\nexport default Label"],"names":["_jsx"],"mappings":";;;;;AAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAuC,EAAoC,EAAE,GAAmB,KAAI;AAA7D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA0B,EAArB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;IACrF,OAAOA,GAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACP,SAAS,EAAC,OAAO,EAAA,EACb,IAAI,EAAA,EACR,GAAG,EAAE;AACD,YAAA,OAAO,EAAE,aAAa;AACtB,YAAA,UAAU,EAAE,QAAQ;AACpB,YAAA,aAAa,EAAE,QAAQ;AACvB,YAAA,QAAQ,EAAE,MAAM;AAChB,YAAA,GAAG,EAAE,EAAE;AACP,YAAA,KAAK,EAAE,cAAc;AACrB,YAAA,UAAU,EAAE,MAAM;AAClB,YAAA,MAAM,EAAE,SAAS;AACjB,YAAA,UAAU,EAAE,KAAK;SACpB,EACD,SAAS,EAAC,OAAO,EACjB,GAAG,EAAE,GAAG,EAAA,QAAA,EACV,QAAQ,EAAA,CAAA,CAAO;AACrB,CAAC;;;;"}

package/Layer/index.js

@@ -1,4 +1,14 @@
-'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('../useBlurCss/index.js'),index$1=require('../ClickOutside/index.js');const Layer = (_a) => {
+"use client";
+'use strict';
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var core = require('@xanui/core');
+var index = require('../useBlurCss/index.js');
+var index$1 = require('../ClickOutside/index.js');
+
+const Layer = (_a) => {
     var _b, _c, _d;
     var { children, open } = _a, props = tslib.__rest(_a, ["children", "open"]);
     let [{ onClickOutside, placement, transition, zIndex, blur, blurMode, onOpen, onOpened, onClose, onClosed, slotProps }] = core.useInterface("Layer", props, {});
@@ -12,7 +22,7 @@
     blurMode = p.blurMode;
     const [closed, setClosed] = React.useState(!open);
     placement = placement || "bottom-left";
-    const blurCss = blur ? index.default(blur, blurMode) : {};
+    const blurCss = blur ? index(blur, blurMode) : {};
     React.useEffect(() => {
         if (closed && open) {
             setClosed(false);
@@ -26,7 +36,7 @@
             setClosed(true);
             onClosed && onClosed();
         }, children: children }));
-    return (jsxRuntime.jsx(core.Transition, { duration: duration, delay: delay, easing: "smooth", variant: "fade", open: open, children: jsxRuntime.jsx(core.Tag, Object.assign({ baseClass: "layer" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.root, { sxr: Object.assign(Object.assign(Object.assign({}, (_d = slotProps === null || slotProps === void 0 ? void 0 : slotProps.root) === null || _d === void 0 ? void 0 : _d.sx), { position: "fixed", zIndex: 1500 + (zIndex || 0), top: 0, left: 0, bottom: 0, right: 0, width: "100%", height: "100%" }), blurCss), children: onClickOutside ? jsxRuntime.jsx(index$1.default, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.clickOutside, { onClickOutside: onClickOutside || (() => { }), children: content })) : content })) }));
+    return (jsxRuntime.jsx(core.Transition, { duration: duration, delay: delay, easing: "smooth", variant: "fade", open: open, children: jsxRuntime.jsx(core.Tag, Object.assign({ baseClass: "layer" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.root, { sxr: Object.assign(Object.assign(Object.assign({}, (_d = slotProps === null || slotProps === void 0 ? void 0 : slotProps.root) === null || _d === void 0 ? void 0 : _d.sx), { position: "fixed", zIndex: 1500 + (zIndex || 0), top: 0, left: 0, bottom: 0, right: 0, width: "100%", height: "100%" }), blurCss), children: onClickOutside ? jsxRuntime.jsx(index$1, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.clickOutside, { onClickOutside: onClickOutside || (() => { }), children: content })) : content })) }));
 };
 Layer.open = (children, props) => {
     const l = core.Renderar.render(Layer, Object.assign(Object.assign({ open: true }, props), { children, onClosed: () => {
@@ -46,4 +56,7 @@ Layer.open = (children, props) => {
 };
 Layer.close = () => {
     core.Renderar.unrender(Layer);
-};exports.default=Layer;//# sourceMappingURL=index.js.map
+};
+
+module.exports = Layer;
+//# sourceMappingURL=index.js.map

package/Layer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/Layer/index.tsx"],"sourcesContent":["import { ReactNode, useEffect, useState } from 'react'\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\"\nimport useBlurCss from '../useBlurCss';\nimport { Renderar } from \"@xanui/core\";\nimport ClickOutside, { ClickOutsideProps } from '../ClickOutside';\n\nexport type LayerProps = {\n    open: boolean;\n    children: ReactNode;\n    transition?: TransitionProps['variant'];\n    zIndex?: number;\n    blur?: useBreakpointPropsType<number>\n    blurMode?: useBreakpointPropsType<\"blur\" | \"transparent\">\n    onClickOutside?: () => void;\n    onOpen?: Function;\n    onOpened?: Function;\n    onClose?: Function;\n    onClosed?: Function;\n    slotProps?: {\n        root?: Omit<TagProps<\"div\">, \"children\">;\n        transition?: Omit<TransitionProps, \"children\" | \"open\" | \"variant\" | \"onClose\" | \"onClosed\" | \"onOpen\" | \"onOpened\">;\n        content?: Omit<TagProps<\"div\">, \"children\">;\n        clickOutside?: Omit<ClickOutsideProps, \"children\">;\n    }\n}\n\nconst Layer = ({ children, open, ...props }: LayerProps) => {\n    let [{\n        onClickOutside,\n        placement,\n        transition,\n        zIndex,\n        blur,\n        blurMode,\n        onOpen,\n        onOpened,\n        onClose,\n        onClosed,\n        slotProps\n    }] = useInterface<any>(\"Layer\", props, {})\n\n    const _p: any = {}\n    if (blur) _p.blur = blur\n    if (blurMode) _p.blurMode = blurMode\n    const p: any = useBreakpointProps(_p)\n\n    blur = p.blur\n    blurMode = p.blurMode\n\n    const [closed, setClosed] = useState(!open)\n    placement = placement || \"bottom-left\"\n    const blurCss = blur ? useBlurCss(blur, blurMode) : {}\n\n    useEffect(() => {\n        if (closed && open) {\n            setClosed(false)\n        }\n    }, [open])\n\n    if (closed) return <></>\n    let duration = slotProps?.transition?.duration || 300\n    let delay = slotProps?.transition?.delay || 0\n\n    let content = <Transition\n        duration={duration}\n        delay={delay}\n        easing=\"standard\"\n        variant={transition || \"zoomOver\"}\n        {...slotProps?.transition}\n        open={open}\n        onOpen={onOpen}\n        onOpened={onOpened}\n        onClose={onClose}\n        onClosed={() => {\n            setClosed(true)\n            onClosed && onClosed()\n        }}\n    >\n        {children}\n    </Transition>\n\n    return (\n        <Transition\n            duration={duration}\n            delay={delay}\n            easing=\"smooth\"\n            variant={\"fade\"}\n            open={open}\n        >\n            <Tag\n                baseClass=\"layer\"\n                {...slotProps?.root}\n                sxr={{\n                    ...slotProps?.root?.sx,\n                    position: \"fixed\",\n                    zIndex: 1500 + (zIndex || 0),\n                    top: 0,\n                    left: 0,\n                    bottom: 0,\n                    right: 0,\n                    width: \"100%\",\n                    height: \"100%\",\n                    ...blurCss\n                }}\n            >\n                {\n                    onClickOutside ? <ClickOutside\n                        {...slotProps?.clickOutside}\n                        onClickOutside={onClickOutside || (() => { })}\n                    >\n                        {content}\n                    </ClickOutside> : content\n                }\n            </Tag>\n        </Transition>\n    )\n}\n\n\nLayer.open = (children: LayerProps['children'], props?: Partial<Omit<LayerProps, 'children'>>) => {\n    const l = Renderar.render(Layer as any, {\n        open: true,\n        ...props,\n        children,\n        onClosed: () => {\n            Renderar.unrender(Layer as any)\n            if (props?.onClosed) {\n                props.onClosed()\n            }\n        }\n    })\n    return {\n        open: () => {\n            l.updateProps({ open: true })\n        },\n        close: () => {\n            l.updateProps({ open: false })\n        },\n    }\n}\nLayer.close = () => {\n    Renderar.unrender(Layer as any)\n}\nexport default Layer"],"names":["__rest","useInterface","useBreakpointProps","useState","useBlurCss","useEffect","_jsx","Transition","Tag","ClickOutside","Renderar"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/Layer/index.tsx"],"sourcesContent":["\"use client\";\r\nimport { ReactNode, useEffect, useState } from 'react'\r\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\"\r\nimport useBlurCss from '../useBlurCss';\r\nimport { Renderar } from \"@xanui/core\";\r\nimport ClickOutside, { ClickOutsideProps } from '../ClickOutside';\r\n\r\nexport type LayerProps = {\r\n    open: boolean;\r\n    children: ReactNode;\r\n    transition?: TransitionProps['variant'];\r\n    zIndex?: number;\r\n    blur?: useBreakpointPropsType<number>\r\n    blurMode?: useBreakpointPropsType<\"blur\" | \"transparent\">\r\n    onClickOutside?: () => void;\r\n    onOpen?: Function;\r\n    onOpened?: Function;\r\n    onClose?: Function;\r\n    onClosed?: Function;\r\n    slotProps?: {\r\n        root?: Omit<TagProps<\"div\">, \"children\">;\r\n        transition?: Omit<TransitionProps, \"children\" | \"open\" | \"variant\" | \"onClose\" | \"onClosed\" | \"onOpen\" | \"onOpened\">;\r\n        content?: Omit<TagProps<\"div\">, \"children\">;\r\n        clickOutside?: Omit<ClickOutsideProps, \"children\">;\r\n    }\r\n}\r\n\r\nconst Layer = ({ children, open, ...props }: LayerProps) => {\r\n    let [{\r\n        onClickOutside,\r\n        placement,\r\n        transition,\r\n        zIndex,\r\n        blur,\r\n        blurMode,\r\n        onOpen,\r\n        onOpened,\r\n        onClose,\r\n        onClosed,\r\n        slotProps\r\n    }] = useInterface<any>(\"Layer\", props, {})\r\n\r\n    const _p: any = {}\r\n    if (blur) _p.blur = blur\r\n    if (blurMode) _p.blurMode = blurMode\r\n    const p: any = useBreakpointProps(_p)\r\n\r\n    blur = p.blur\r\n    blurMode = p.blurMode\r\n\r\n    const [closed, setClosed] = useState(!open)\r\n    placement = placement || \"bottom-left\"\r\n    const blurCss = blur ? useBlurCss(blur, blurMode) : {}\r\n\r\n    useEffect(() => {\r\n        if (closed && open) {\r\n            setClosed(false)\r\n        }\r\n    }, [open])\r\n\r\n    if (closed) return <></>\r\n    let duration = slotProps?.transition?.duration || 300\r\n    let delay = slotProps?.transition?.delay || 0\r\n\r\n    let content = <Transition\r\n        duration={duration}\r\n        delay={delay}\r\n        easing=\"standard\"\r\n        variant={transition || \"zoomOver\"}\r\n        {...slotProps?.transition}\r\n        open={open}\r\n        onOpen={onOpen}\r\n        onOpened={onOpened}\r\n        onClose={onClose}\r\n        onClosed={() => {\r\n            setClosed(true)\r\n            onClosed && onClosed()\r\n        }}\r\n    >\r\n        {children}\r\n    </Transition>\r\n\r\n    return (\r\n        <Transition\r\n            duration={duration}\r\n            delay={delay}\r\n            easing=\"smooth\"\r\n            variant={\"fade\"}\r\n            open={open}\r\n        >\r\n            <Tag\r\n                baseClass=\"layer\"\r\n                {...slotProps?.root}\r\n                sxr={{\r\n                    ...slotProps?.root?.sx,\r\n                    position: \"fixed\",\r\n                    zIndex: 1500 + (zIndex || 0),\r\n                    top: 0,\r\n                    left: 0,\r\n                    bottom: 0,\r\n                    right: 0,\r\n                    width: \"100%\",\r\n                    height: \"100%\",\r\n                    ...blurCss\r\n                }}\r\n            >\r\n                {\r\n                    onClickOutside ? <ClickOutside\r\n                        {...slotProps?.clickOutside}\r\n                        onClickOutside={onClickOutside || (() => { })}\r\n                    >\r\n                        {content}\r\n                    </ClickOutside> : content\r\n                }\r\n            </Tag>\r\n        </Transition>\r\n    )\r\n}\r\n\r\n\r\nLayer.open = (children: LayerProps['children'], props?: Partial<Omit<LayerProps, 'children'>>) => {\r\n    const l = Renderar.render(Layer as any, {\r\n        open: true,\r\n        ...props,\r\n        children,\r\n        onClosed: () => {\r\n            Renderar.unrender(Layer as any)\r\n            if (props?.onClosed) {\r\n                props.onClosed()\r\n            }\r\n        }\r\n    })\r\n    return {\r\n        open: () => {\r\n            l.updateProps({ open: true })\r\n        },\r\n        close: () => {\r\n            l.updateProps({ open: false })\r\n        },\r\n    }\r\n}\r\nLayer.close = () => {\r\n    Renderar.unrender(Layer as any)\r\n}\r\nexport default Layer"],"names":[],"mappings":";;;;;;;;;;AA2BA;;;AACI;;AAeA;AAAU;AACV;AAAc;AACd;AAEA;AACA;;AAGA;AACA;;AAGI;;;AAGJ;AAEA;AAAY;AACZ;AACA;;;;;AAoBA;AAmCJ;AAGA;AACI;AAKQ;;;;AAIJ;;;;;;;;;AAUR;AACA;AACI;AACJ;;"}

package/Layer/index.mjs

@@ -1,4 +1,12 @@
-import {__rest}from'tslib';import {jsx,Fragment}from'react/jsx-runtime';import {useState,useEffect}from'react';import {useInterface,useBreakpointProps,Transition,Tag,Renderar}from'@xanui/core';import useBlurCss from'../useBlurCss/index.mjs';import ClickOutside from'../ClickOutside/index.mjs';const Layer = (_a) => {
+"use client";
+import { __rest } from 'tslib';
+import { jsx, Fragment } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
+import { useInterface, useBreakpointProps, Transition, Tag, Renderar } from '@xanui/core';
+import useBlurCss from '../useBlurCss/index.mjs';
+import ClickOutside from '../ClickOutside/index.mjs';
+
+const Layer = (_a) => {
     var _b, _c, _d;
     var { children, open } = _a, props = __rest(_a, ["children", "open"]);
     let [{ onClickOutside, placement, transition, zIndex, blur, blurMode, onOpen, onOpened, onClose, onClosed, slotProps }] = useInterface("Layer", props, {});
@@ -46,4 +54,7 @@ Layer.open = (children, props) => {
 };
 Layer.close = () => {
     Renderar.unrender(Layer);
-};export{Layer as default};//# sourceMappingURL=index.mjs.map
+};
+
+export { Layer as default };
+//# sourceMappingURL=index.mjs.map

package/Layer/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/Layer/index.tsx"],"sourcesContent":["import { ReactNode, useEffect, useState } from 'react'\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\"\nimport useBlurCss from '../useBlurCss';\nimport { Renderar } from \"@xanui/core\";\nimport ClickOutside, { ClickOutsideProps } from '../ClickOutside';\n\nexport type LayerProps = {\n    open: boolean;\n    children: ReactNode;\n    transition?: TransitionProps['variant'];\n    zIndex?: number;\n    blur?: useBreakpointPropsType<number>\n    blurMode?: useBreakpointPropsType<\"blur\" | \"transparent\">\n    onClickOutside?: () => void;\n    onOpen?: Function;\n    onOpened?: Function;\n    onClose?: Function;\n    onClosed?: Function;\n    slotProps?: {\n        root?: Omit<TagProps<\"div\">, \"children\">;\n        transition?: Omit<TransitionProps, \"children\" | \"open\" | \"variant\" | \"onClose\" | \"onClosed\" | \"onOpen\" | \"onOpened\">;\n        content?: Omit<TagProps<\"div\">, \"children\">;\n        clickOutside?: Omit<ClickOutsideProps, \"children\">;\n    }\n}\n\nconst Layer = ({ children, open, ...props }: LayerProps) => {\n    let [{\n        onClickOutside,\n        placement,\n        transition,\n        zIndex,\n        blur,\n        blurMode,\n        onOpen,\n        onOpened,\n        onClose,\n        onClosed,\n        slotProps\n    }] = useInterface<any>(\"Layer\", props, {})\n\n    const _p: any = {}\n    if (blur) _p.blur = blur\n    if (blurMode) _p.blurMode = blurMode\n    const p: any = useBreakpointProps(_p)\n\n    blur = p.blur\n    blurMode = p.blurMode\n\n    const [closed, setClosed] = useState(!open)\n    placement = placement || \"bottom-left\"\n    const blurCss = blur ? useBlurCss(blur, blurMode) : {}\n\n    useEffect(() => {\n        if (closed && open) {\n            setClosed(false)\n        }\n    }, [open])\n\n    if (closed) return <></>\n    let duration = slotProps?.transition?.duration || 300\n    let delay = slotProps?.transition?.delay || 0\n\n    let content = <Transition\n        duration={duration}\n        delay={delay}\n        easing=\"standard\"\n        variant={transition || \"zoomOver\"}\n        {...slotProps?.transition}\n        open={open}\n        onOpen={onOpen}\n        onOpened={onOpened}\n        onClose={onClose}\n        onClosed={() => {\n            setClosed(true)\n            onClosed && onClosed()\n        }}\n    >\n        {children}\n    </Transition>\n\n    return (\n        <Transition\n            duration={duration}\n            delay={delay}\n            easing=\"smooth\"\n            variant={\"fade\"}\n            open={open}\n        >\n            <Tag\n                baseClass=\"layer\"\n                {...slotProps?.root}\n                sxr={{\n                    ...slotProps?.root?.sx,\n                    position: \"fixed\",\n                    zIndex: 1500 + (zIndex || 0),\n                    top: 0,\n                    left: 0,\n                    bottom: 0,\n                    right: 0,\n                    width: \"100%\",\n                    height: \"100%\",\n                    ...blurCss\n                }}\n            >\n                {\n                    onClickOutside ? <ClickOutside\n                        {...slotProps?.clickOutside}\n                        onClickOutside={onClickOutside || (() => { })}\n                    >\n                        {content}\n                    </ClickOutside> : content\n                }\n            </Tag>\n        </Transition>\n    )\n}\n\n\nLayer.open = (children: LayerProps['children'], props?: Partial<Omit<LayerProps, 'children'>>) => {\n    const l = Renderar.render(Layer as any, {\n        open: true,\n        ...props,\n        children,\n        onClosed: () => {\n            Renderar.unrender(Layer as any)\n            if (props?.onClosed) {\n                props.onClosed()\n            }\n        }\n    })\n    return {\n        open: () => {\n            l.updateProps({ open: true })\n        },\n        close: () => {\n            l.updateProps({ open: false })\n        },\n    }\n}\nLayer.close = () => {\n    Renderar.unrender(Layer as any)\n}\nexport default Layer"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../src/Layer/index.tsx"],"sourcesContent":["\"use client\";\r\nimport { ReactNode, useEffect, useState } from 'react'\r\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\"\r\nimport useBlurCss from '../useBlurCss';\r\nimport { Renderar } from \"@xanui/core\";\r\nimport ClickOutside, { ClickOutsideProps } from '../ClickOutside';\r\n\r\nexport type LayerProps = {\r\n    open: boolean;\r\n    children: ReactNode;\r\n    transition?: TransitionProps['variant'];\r\n    zIndex?: number;\r\n    blur?: useBreakpointPropsType<number>\r\n    blurMode?: useBreakpointPropsType<\"blur\" | \"transparent\">\r\n    onClickOutside?: () => void;\r\n    onOpen?: Function;\r\n    onOpened?: Function;\r\n    onClose?: Function;\r\n    onClosed?: Function;\r\n    slotProps?: {\r\n        root?: Omit<TagProps<\"div\">, \"children\">;\r\n        transition?: Omit<TransitionProps, \"children\" | \"open\" | \"variant\" | \"onClose\" | \"onClosed\" | \"onOpen\" | \"onOpened\">;\r\n        content?: Omit<TagProps<\"div\">, \"children\">;\r\n        clickOutside?: Omit<ClickOutsideProps, \"children\">;\r\n    }\r\n}\r\n\r\nconst Layer = ({ children, open, ...props }: LayerProps) => {\r\n    let [{\r\n        onClickOutside,\r\n        placement,\r\n        transition,\r\n        zIndex,\r\n        blur,\r\n        blurMode,\r\n        onOpen,\r\n        onOpened,\r\n        onClose,\r\n        onClosed,\r\n        slotProps\r\n    }] = useInterface<any>(\"Layer\", props, {})\r\n\r\n    const _p: any = {}\r\n    if (blur) _p.blur = blur\r\n    if (blurMode) _p.blurMode = blurMode\r\n    const p: any = useBreakpointProps(_p)\r\n\r\n    blur = p.blur\r\n    blurMode = p.blurMode\r\n\r\n    const [closed, setClosed] = useState(!open)\r\n    placement = placement || \"bottom-left\"\r\n    const blurCss = blur ? useBlurCss(blur, blurMode) : {}\r\n\r\n    useEffect(() => {\r\n        if (closed && open) {\r\n            setClosed(false)\r\n        }\r\n    }, [open])\r\n\r\n    if (closed) return <></>\r\n    let duration = slotProps?.transition?.duration || 300\r\n    let delay = slotProps?.transition?.delay || 0\r\n\r\n    let content = <Transition\r\n        duration={duration}\r\n        delay={delay}\r\n        easing=\"standard\"\r\n        variant={transition || \"zoomOver\"}\r\n        {...slotProps?.transition}\r\n        open={open}\r\n        onOpen={onOpen}\r\n        onOpened={onOpened}\r\n        onClose={onClose}\r\n        onClosed={() => {\r\n            setClosed(true)\r\n            onClosed && onClosed()\r\n        }}\r\n    >\r\n        {children}\r\n    </Transition>\r\n\r\n    return (\r\n        <Transition\r\n            duration={duration}\r\n            delay={delay}\r\n            easing=\"smooth\"\r\n            variant={\"fade\"}\r\n            open={open}\r\n        >\r\n            <Tag\r\n                baseClass=\"layer\"\r\n                {...slotProps?.root}\r\n                sxr={{\r\n                    ...slotProps?.root?.sx,\r\n                    position: \"fixed\",\r\n                    zIndex: 1500 + (zIndex || 0),\r\n                    top: 0,\r\n                    left: 0,\r\n                    bottom: 0,\r\n                    right: 0,\r\n                    width: \"100%\",\r\n                    height: \"100%\",\r\n                    ...blurCss\r\n                }}\r\n            >\r\n                {\r\n                    onClickOutside ? <ClickOutside\r\n                        {...slotProps?.clickOutside}\r\n                        onClickOutside={onClickOutside || (() => { })}\r\n                    >\r\n                        {content}\r\n                    </ClickOutside> : content\r\n                }\r\n            </Tag>\r\n        </Transition>\r\n    )\r\n}\r\n\r\n\r\nLayer.open = (children: LayerProps['children'], props?: Partial<Omit<LayerProps, 'children'>>) => {\r\n    const l = Renderar.render(Layer as any, {\r\n        open: true,\r\n        ...props,\r\n        children,\r\n        onClosed: () => {\r\n            Renderar.unrender(Layer as any)\r\n            if (props?.onClosed) {\r\n                props.onClosed()\r\n            }\r\n        }\r\n    })\r\n    return {\r\n        open: () => {\r\n            l.updateProps({ open: true })\r\n        },\r\n        close: () => {\r\n            l.updateProps({ open: false })\r\n        },\r\n    }\r\n}\r\nLayer.close = () => {\r\n    Renderar.unrender(Layer as any)\r\n}\r\nexport default Layer"],"names":[],"mappings":";;;;;;;;AA2BA;;;AACI;;AAeA;AAAU;AACV;AAAc;AACd;AAEA;AACA;;AAGA;AACA;;AAGI;;;AAGJ;AAEA;AAAY;AACZ;AACA;;;;;AAoBA;AAmCJ;AAGA;AACI;AAKQ;;;;AAIJ;;;;;;;;;AAUR;AACA;AACI;AACJ;;"}

package/LineProgress/index.js

@@ -1,4 +1,12 @@
-'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 LineProgress = React.forwardRef((_a, ref) => {
+"use client";
+'use strict';
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var core = require('@xanui/core');
+
+const LineProgress = React.forwardRef((_a, ref) => {
     var _b, _c;
     var { children } = _a, props = tslib.__rest(_a, ["children"]);
     const uid = "line-progress" + React.useId().replace(":", "");
@@ -45,4 +53,7 @@
                     "100%": { left: "100%", width: "100%" }
                 }
             } }) }));
-});exports.default=LineProgress;//# sourceMappingURL=index.js.map
+});
+
+module.exports = LineProgress;
+//# sourceMappingURL=index.js.map

package/LineProgress/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/LineProgress/index.tsx"],"sourcesContent":["\nimport React, { ReactElement, useId } from \"react\"\nimport { Tag, useBreakpointProps, UseColorTemplateColor, useInterface, useBreakpointPropsType } from '@xanui/core';\n\nexport type LineProgressProps = {\n    children?: ReactElement;\n    thumbSize?: useBreakpointPropsType<number>;\n    color?: useBreakpointPropsType<UseColorTemplateColor>;\n    value?: useBreakpointPropsType<number>;\n    hideTrack?: useBreakpointPropsType<boolean>;\n    speed?: useBreakpointPropsType<number>;\n}\n\n\nconst LineProgress = React.forwardRef(({ children, ...props }: LineProgressProps, ref: React.Ref<any>) => {\n    const uid = \"line-progress\" + useId().replace(\":\", \"\")\n    let [{ color, value, thumbSize, hideTrack, speed }] = useInterface<any>(\"LineProgress\", props, {})\n    const _p: any = {}\n    if (thumbSize) _p.thumbSize = thumbSize\n    if (color) _p.color = color\n    if (value) _p.value = value\n    if (hideTrack) _p.hideTrack = hideTrack\n    if (speed) _p.speed = speed\n    const p: any = useBreakpointProps(_p)\n\n    thumbSize = p.thumbSize ?? 4\n    color = p.color ?? \"brand\"\n    value = p.value\n    hideTrack = p.hideTrack\n    speed = p.speed\n\n    let isVal = typeof value === 'number'\n    if (isVal && (value as number) > 100) value = 100\n\n    return (\n        <Tag\n            baseClass='line-progress'\n            sxr={{\n                display: \"flex\",\n                alignItems: \"center\",\n                width: '100%',\n                height: thumbSize,\n                position: \"relative\",\n                overflow: \"hidden\",\n                bgcolor: hideTrack ? \"transparent\" : (color === 'default' ? `text.primary` : `${color}.soft.primary`),\n                radius: 2,\n            }}\n            ref={ref}\n        >\n            <Tag\n                component=\"span\"\n                baseClass=\"line-progress-thumb\"\n                sxr={{\n                    bgcolor: color === 'default' ? `divider` : `${color}`,\n                    width: isVal ? `${value}%` : \"50%\",\n                    height: thumbSize,\n                    position: \"absolute\",\n                    left: 0,\n                    animation: isVal ? \"none\" : `${uid} ${speed ?? 1}s linear infinite`,\n                    [`@keyframes ${uid}`]: {\n                        \"0%\": { left: \"-40%\" },\n                        \"50%\": { left: \"20%\", width: \"80%\" },\n                        \"100%\": { left: \"100%\", width: \"100%\" }\n                    }\n                }}\n            />\n        </Tag >\n    )\n})\n\nexport default LineProgress\n\n"],"names":["__rest","useId","useInterface","useBreakpointProps","_jsx","Tag"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/LineProgress/index.tsx"],"sourcesContent":["\"use client\";\r\nimport React, { ReactElement, useId } from \"react\"\r\nimport { Tag, useBreakpointProps, UseColorTemplateColor, useInterface, useBreakpointPropsType } from '@xanui/core';\r\n\r\nexport type LineProgressProps = {\r\n    children?: ReactElement;\r\n    thumbSize?: useBreakpointPropsType<number>;\r\n    color?: useBreakpointPropsType<UseColorTemplateColor>;\r\n    value?: useBreakpointPropsType<number>;\r\n    hideTrack?: useBreakpointPropsType<boolean>;\r\n    speed?: useBreakpointPropsType<number>;\r\n}\r\n\r\n\r\nconst LineProgress = React.forwardRef(({ children, ...props }: LineProgressProps, ref: React.Ref<any>) => {\r\n    const uid = \"line-progress\" + useId().replace(\":\", \"\")\r\n    let [{ color, value, thumbSize, hideTrack, speed }] = useInterface<any>(\"LineProgress\", props, {})\r\n    const _p: any = {}\r\n    if (thumbSize) _p.thumbSize = thumbSize\r\n    if (color) _p.color = color\r\n    if (value) _p.value = value\r\n    if (hideTrack) _p.hideTrack = hideTrack\r\n    if (speed) _p.speed = speed\r\n    const p: any = useBreakpointProps(_p)\r\n\r\n    thumbSize = p.thumbSize ?? 4\r\n    color = p.color ?? \"brand\"\r\n    value = p.value\r\n    hideTrack = p.hideTrack\r\n    speed = p.speed\r\n\r\n    let isVal = typeof value === 'number'\r\n    if (isVal && (value as number) > 100) value = 100\r\n\r\n    return (\r\n        <Tag\r\n            baseClass='line-progress'\r\n            sxr={{\r\n                display: \"flex\",\r\n                alignItems: \"center\",\r\n                width: '100%',\r\n                height: thumbSize,\r\n                position: \"relative\",\r\n                overflow: \"hidden\",\r\n                bgcolor: hideTrack ? \"transparent\" : (color === 'default' ? `text.primary` : `${color}.soft.primary`),\r\n                radius: 2,\r\n            }}\r\n            ref={ref}\r\n        >\r\n            <Tag\r\n                component=\"span\"\r\n                baseClass=\"line-progress-thumb\"\r\n                sxr={{\r\n                    bgcolor: color === 'default' ? `divider` : `${color}`,\r\n                    width: isVal ? `${value}%` : \"50%\",\r\n                    height: thumbSize,\r\n                    position: \"absolute\",\r\n                    left: 0,\r\n                    animation: isVal ? \"none\" : `${uid} ${speed ?? 1}s linear infinite`,\r\n                    [`@keyframes ${uid}`]: {\r\n                        \"0%\": { left: \"-40%\" },\r\n                        \"50%\": { left: \"20%\", width: \"80%\" },\r\n                        \"100%\": { left: \"100%\", width: \"100%\" }\r\n                    }\r\n                }}\r\n            />\r\n        </Tag >\r\n    )\r\n})\r\n\r\nexport default LineProgress\r\n\r\n"],"names":[],"mappings":";;;;;;;;AAcA;;AAAuC;AACnC;;;AAGA;AAAe;AACf;AAAW;AACX;AAAW;AACX;AAAe;AACf;AAAW;AACX;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;;;AAMY;AACA;AACA;AACA;AACA;AACA;;AAEA;AACH;AAOO;;AAEA;AACA;AACA;AACA;AACA;AACI;;;AAGH;;AAKrB;;"}

package/LineProgress/index.mjs

@@ -1,4 +1,10 @@
-import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import React,{useId}from'react';import {useInterface,useBreakpointProps,Tag}from'@xanui/core';const LineProgress = React.forwardRef((_a, ref) => {
+"use client";
+import { __rest } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+import React, { useId } from 'react';
+import { useInterface, useBreakpointProps, Tag } from '@xanui/core';
+
+const LineProgress = React.forwardRef((_a, ref) => {
     var _b, _c;
     var { children } = _a, props = __rest(_a, ["children"]);
     const uid = "line-progress" + useId().replace(":", "");
@@ -45,4 +51,7 @@ import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import React,{use
                     "100%": { left: "100%", width: "100%" }
                 }
             } }) }));
-});export{LineProgress as default};//# sourceMappingURL=index.mjs.map
+});
+
+export { LineProgress as default };
+//# sourceMappingURL=index.mjs.map

package/LineProgress/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/LineProgress/index.tsx"],"sourcesContent":["\nimport React, { ReactElement, useId } from \"react\"\nimport { Tag, useBreakpointProps, UseColorTemplateColor, useInterface, useBreakpointPropsType } from '@xanui/core';\n\nexport type LineProgressProps = {\n    children?: ReactElement;\n    thumbSize?: useBreakpointPropsType<number>;\n    color?: useBreakpointPropsType<UseColorTemplateColor>;\n    value?: useBreakpointPropsType<number>;\n    hideTrack?: useBreakpointPropsType<boolean>;\n    speed?: useBreakpointPropsType<number>;\n}\n\n\nconst LineProgress = React.forwardRef(({ children, ...props }: LineProgressProps, ref: React.Ref<any>) => {\n    const uid = \"line-progress\" + useId().replace(\":\", \"\")\n    let [{ color, value, thumbSize, hideTrack, speed }] = useInterface<any>(\"LineProgress\", props, {})\n    const _p: any = {}\n    if (thumbSize) _p.thumbSize = thumbSize\n    if (color) _p.color = color\n    if (value) _p.value = value\n    if (hideTrack) _p.hideTrack = hideTrack\n    if (speed) _p.speed = speed\n    const p: any = useBreakpointProps(_p)\n\n    thumbSize = p.thumbSize ?? 4\n    color = p.color ?? \"brand\"\n    value = p.value\n    hideTrack = p.hideTrack\n    speed = p.speed\n\n    let isVal = typeof value === 'number'\n    if (isVal && (value as number) > 100) value = 100\n\n    return (\n        <Tag\n            baseClass='line-progress'\n            sxr={{\n                display: \"flex\",\n                alignItems: \"center\",\n                width: '100%',\n                height: thumbSize,\n                position: \"relative\",\n                overflow: \"hidden\",\n                bgcolor: hideTrack ? \"transparent\" : (color === 'default' ? `text.primary` : `${color}.soft.primary`),\n                radius: 2,\n            }}\n            ref={ref}\n        >\n            <Tag\n                component=\"span\"\n                baseClass=\"line-progress-thumb\"\n                sxr={{\n                    bgcolor: color === 'default' ? `divider` : `${color}`,\n                    width: isVal ? `${value}%` : \"50%\",\n                    height: thumbSize,\n                    position: \"absolute\",\n                    left: 0,\n                    animation: isVal ? \"none\" : `${uid} ${speed ?? 1}s linear infinite`,\n                    [`@keyframes ${uid}`]: {\n                        \"0%\": { left: \"-40%\" },\n                        \"50%\": { left: \"20%\", width: \"80%\" },\n                        \"100%\": { left: \"100%\", width: \"100%\" }\n                    }\n                }}\n            />\n        </Tag >\n    )\n})\n\nexport default LineProgress\n\n"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../src/LineProgress/index.tsx"],"sourcesContent":["\"use client\";\r\nimport React, { ReactElement, useId } from \"react\"\r\nimport { Tag, useBreakpointProps, UseColorTemplateColor, useInterface, useBreakpointPropsType } from '@xanui/core';\r\n\r\nexport type LineProgressProps = {\r\n    children?: ReactElement;\r\n    thumbSize?: useBreakpointPropsType<number>;\r\n    color?: useBreakpointPropsType<UseColorTemplateColor>;\r\n    value?: useBreakpointPropsType<number>;\r\n    hideTrack?: useBreakpointPropsType<boolean>;\r\n    speed?: useBreakpointPropsType<number>;\r\n}\r\n\r\n\r\nconst LineProgress = React.forwardRef(({ children, ...props }: LineProgressProps, ref: React.Ref<any>) => {\r\n    const uid = \"line-progress\" + useId().replace(\":\", \"\")\r\n    let [{ color, value, thumbSize, hideTrack, speed }] = useInterface<any>(\"LineProgress\", props, {})\r\n    const _p: any = {}\r\n    if (thumbSize) _p.thumbSize = thumbSize\r\n    if (color) _p.color = color\r\n    if (value) _p.value = value\r\n    if (hideTrack) _p.hideTrack = hideTrack\r\n    if (speed) _p.speed = speed\r\n    const p: any = useBreakpointProps(_p)\r\n\r\n    thumbSize = p.thumbSize ?? 4\r\n    color = p.color ?? \"brand\"\r\n    value = p.value\r\n    hideTrack = p.hideTrack\r\n    speed = p.speed\r\n\r\n    let isVal = typeof value === 'number'\r\n    if (isVal && (value as number) > 100) value = 100\r\n\r\n    return (\r\n        <Tag\r\n            baseClass='line-progress'\r\n            sxr={{\r\n                display: \"flex\",\r\n                alignItems: \"center\",\r\n                width: '100%',\r\n                height: thumbSize,\r\n                position: \"relative\",\r\n                overflow: \"hidden\",\r\n                bgcolor: hideTrack ? \"transparent\" : (color === 'default' ? `text.primary` : `${color}.soft.primary`),\r\n                radius: 2,\r\n            }}\r\n            ref={ref}\r\n        >\r\n            <Tag\r\n                component=\"span\"\r\n                baseClass=\"line-progress-thumb\"\r\n                sxr={{\r\n                    bgcolor: color === 'default' ? `divider` : `${color}`,\r\n                    width: isVal ? `${value}%` : \"50%\",\r\n                    height: thumbSize,\r\n                    position: \"absolute\",\r\n                    left: 0,\r\n                    animation: isVal ? \"none\" : `${uid} ${speed ?? 1}s linear infinite`,\r\n                    [`@keyframes ${uid}`]: {\r\n                        \"0%\": { left: \"-40%\" },\r\n                        \"50%\": { left: \"20%\", width: \"80%\" },\r\n                        \"100%\": { left: \"100%\", width: \"100%\" }\r\n                    }\r\n                }}\r\n            />\r\n        </Tag >\r\n    )\r\n})\r\n\r\nexport default LineProgress\r\n\r\n"],"names":[],"mappings":";;;;;;AAcA;;AAAuC;AACnC;;;AAGA;AAAe;AACf;AAAW;AACX;AAAW;AACX;AAAe;AACf;AAAW;AACX;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;;;AAMY;AACA;AACA;AACA;AACA;AACA;;AAEA;AACH;AAOO;;AAEA;AACA;AACA;AACA;AACA;AACI;;;AAGH;;AAKrB;;"}

package/List/index.js

@@ -1,4 +1,11 @@
-'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 List = React.forwardRef((_a, ref) => {
+'use strict';
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var core = require('@xanui/core');
+
+const List = React.forwardRef((_a, ref) => {
     var _b, _c, _d, _e;
     var { children } = _a, rest = tslib.__rest(_a, ["children"]);
     let [_f] = core.useInterface("List", rest, {}), { sx, color, variant, hoverColor, hoverVariant } = _f, props = tslib.__rest(_f, ["sx", "color", "variant", "hoverColor", "hoverVariant"]);
@@ -46,4 +53,7 @@
                 }, "& .list-item-subtitle": {
                     color: template.primary.color
                 } }) }), (sx || {})), ref: ref, children: children })));
-});exports.default=List;//# sourceMappingURL=index.js.map
+});
+
+module.exports = List;
+//# sourceMappingURL=index.js.map

package/List/index.js.map

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

package/List/index.mjs

@@ -1,4 +1,9 @@
-import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import React from'react';import {useInterface,useBreakpointProps,useColorTemplate,Tag}from'@xanui/core';const List = React.forwardRef((_a, ref) => {
+import { __rest } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+import React from 'react';
+import { useInterface, useBreakpointProps, useColorTemplate, Tag } from '@xanui/core';
+
+const List = React.forwardRef((_a, ref) => {
     var _b, _c, _d, _e;
     var { children } = _a, rest = __rest(_a, ["children"]);
     let [_f] = useInterface("List", rest, {}), { sx, color, variant, hoverColor, hoverVariant } = _f, props = __rest(_f, ["sx", "color", "variant", "hoverColor", "hoverVariant"]);
@@ -46,4 +51,7 @@ import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import React from
                 }, "& .list-item-subtitle": {
                     color: template.primary.color
                 } }) }), (sx || {})), ref: ref, children: children })));
-});export{List as default};//# sourceMappingURL=index.mjs.map
+});
+
+export { List as default };
+//# sourceMappingURL=index.mjs.map

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

package/ListItem/index.js

@@ -1,4 +1,12 @@
-'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('../Text/index.js');const ListItem = React.forwardRef((_a, ref) => {
+'use strict';
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var core = require('@xanui/core');
+var index = require('../Text/index.js');
+
+const ListItem = React.forwardRef((_a, ref) => {
     var { children, startIcon, endIcon, subtitle } = _a, rest = tslib.__rest(_a, ["children", "startIcon", "endIcon", "subtitle"]);
     let [_b] = core.useInterface("ListItem", rest, {}), { selected } = _b, props = tslib.__rest(_b, ["selected"]);
     const _p = {};
@@ -22,5 +30,8 @@
             p: 1,
             whiteSpace: "nowrap",
             flexShrink: "0",
-        }, baseClass: 'list-item', classNames: [{ "list-item-selected": selected }, ...(props.classNames || [])], ref: ref, children: [startIcon && jsxRuntime.jsx(core.Tag, { mr: 1, component: "span", display: "inline-block", className: 'list-item-icon', children: startIcon }), jsxRuntime.jsxs(core.Tag, { flex: 1, children: [jsxRuntime.jsx(index.default, { variant: "text", className: 'list-item-text', component: typeof children === "string" || typeof children === "number" ? "p" : "div", children: children }), subtitle && jsxRuntime.jsx(index.default, { variant: "text", fontSize: "button", className: 'list-item-subtitle', component: typeof subtitle === "string" || typeof subtitle === "number" ? "p" : "div", children: subtitle })] }), endIcon && jsxRuntime.jsx(core.Tag, { ml: 1, component: "span", display: "inline-block", className: 'list-item-icon', children: endIcon })] })));
-});exports.default=ListItem;//# sourceMappingURL=index.js.map
+        }, baseClass: 'list-item', classNames: [{ "list-item-selected": selected }, ...(props.classNames || [])], ref: ref, children: [startIcon && jsxRuntime.jsx(core.Tag, { mr: 1, component: "span", display: "inline-block", className: 'list-item-icon', children: startIcon }), jsxRuntime.jsxs(core.Tag, { flex: 1, children: [jsxRuntime.jsx(index, { variant: "text", className: 'list-item-text', component: typeof children === "string" || typeof children === "number" ? "p" : "div", children: children }), subtitle && jsxRuntime.jsx(index, { variant: "text", fontSize: "button", className: 'list-item-subtitle', component: typeof subtitle === "string" || typeof subtitle === "number" ? "p" : "div", children: subtitle })] }), endIcon && jsxRuntime.jsx(core.Tag, { ml: 1, component: "span", display: "inline-block", className: 'list-item-icon', children: endIcon })] })));
+});
+
+module.exports = ListItem;
+//# sourceMappingURL=index.js.map

package/ListItem/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/ListItem/index.tsx"],"sourcesContent":["\nimport React, { ReactElement } from 'react'\nimport { Tag, TagProps, TagComponentType, useInterface, useBreakpointProps, useBreakpointPropsType } from '@xanui/core'\nimport Text from '../Text';\n\n\nexport type ListItemProps<T extends TagComponentType = \"li\"> = TagProps<T> & {\n    selected?: boolean;\n    subtitle?: useBreakpointPropsType<string | ReactElement>;\n    startIcon?: useBreakpointPropsType<ReactElement>;\n    endIcon?: useBreakpointPropsType<ReactElement>;\n}\n\nconst ListItem = React.forwardRef(<T extends TagComponentType = \"li\">({ children, startIcon, endIcon, subtitle, ...rest }: ListItemProps<T>, ref: React.Ref<any>) => {\n    let [{ selected, ...props }] = useInterface<any>(\"ListItem\", rest, {})\n    const _p: any = {}\n    if (subtitle) _p.subtitle = subtitle\n    if (startIcon) _p.startIcon = startIcon\n    if (endIcon) _p.endIcon = endIcon\n    const p: any = useBreakpointProps(_p)\n\n    subtitle = p.subtitle\n    startIcon = p.startIcon\n    endIcon = p.endIcon\n\n    return (\n        <Tag\n            component='li'\n            {...props}\n            sxr={{\n                alignItems: \"center\",\n                display: \"flex\",\n                flexDirection: \"row\",\n                userSelect: \"none\",\n                cursor: \"pointer\",\n                lineHeight: 1.4,\n                p: 1,\n                whiteSpace: \"nowrap\",\n                flexShrink: \"0\",\n            }}\n            baseClass='list-item'\n            classNames={[{ \"list-item-selected\": selected as boolean }, ...(props.classNames || [])]}\n            ref={ref}\n        >\n            {startIcon && <Tag mr={1} component=\"span\" display=\"inline-block\" className='list-item-icon'>{startIcon as any}</Tag>}\n            <Tag flex={1}>\n                <Text\n                    variant=\"text\"\n                    className='list-item-text'\n                    component={typeof children === \"string\" || typeof children === \"number\" ? \"p\" : \"div\"}\n                >\n                    {children}\n                </Text>\n                {\n                    subtitle && <Text\n                        variant=\"text\"\n                        fontSize=\"button\"\n                        className='list-item-subtitle'\n                        component={typeof subtitle === \"string\" || typeof subtitle === \"number\" ? \"p\" : \"div\"}\n                    >{subtitle as any}</Text>\n                }\n            </Tag>\n            {endIcon && <Tag ml={1} component=\"span\" display=\"inline-block\" className='list-item-icon'>{endIcon as any}</Tag>}\n        </Tag>\n    )\n})\n\nexport default ListItem"],"names":["__rest","useInterface","useBreakpointProps","_jsxs","Tag","_jsx","Text"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/ListItem/index.tsx"],"sourcesContent":["\r\nimport React, { ReactElement } from 'react'\r\nimport { Tag, TagProps, TagComponentType, useInterface, useBreakpointProps, useBreakpointPropsType } from '@xanui/core'\r\nimport Text from '../Text';\r\n\r\n\r\nexport type ListItemProps<T extends TagComponentType = \"li\"> = TagProps<T> & {\r\n    selected?: boolean;\r\n    subtitle?: useBreakpointPropsType<string | ReactElement>;\r\n    startIcon?: useBreakpointPropsType<ReactElement>;\r\n    endIcon?: useBreakpointPropsType<ReactElement>;\r\n}\r\n\r\nconst ListItem = React.forwardRef(<T extends TagComponentType = \"li\">({ children, startIcon, endIcon, subtitle, ...rest }: ListItemProps<T>, ref: React.Ref<any>) => {\r\n    let [{ selected, ...props }] = useInterface<any>(\"ListItem\", rest, {})\r\n    const _p: any = {}\r\n    if (subtitle) _p.subtitle = subtitle\r\n    if (startIcon) _p.startIcon = startIcon\r\n    if (endIcon) _p.endIcon = endIcon\r\n    const p: any = useBreakpointProps(_p)\r\n\r\n    subtitle = p.subtitle\r\n    startIcon = p.startIcon\r\n    endIcon = p.endIcon\r\n\r\n    return (\r\n        <Tag\r\n            component='li'\r\n            {...props}\r\n            sxr={{\r\n                alignItems: \"center\",\r\n                display: \"flex\",\r\n                flexDirection: \"row\",\r\n                userSelect: \"none\",\r\n                cursor: \"pointer\",\r\n                lineHeight: 1.4,\r\n                p: 1,\r\n                whiteSpace: \"nowrap\",\r\n                flexShrink: \"0\",\r\n            }}\r\n            baseClass='list-item'\r\n            classNames={[{ \"list-item-selected\": selected as boolean }, ...(props.classNames || [])]}\r\n            ref={ref}\r\n        >\r\n            {startIcon && <Tag mr={1} component=\"span\" display=\"inline-block\" className='list-item-icon'>{startIcon as any}</Tag>}\r\n            <Tag flex={1}>\r\n                <Text\r\n                    variant=\"text\"\r\n                    className='list-item-text'\r\n                    component={typeof children === \"string\" || typeof children === \"number\" ? \"p\" : \"div\"}\r\n                >\r\n                    {children}\r\n                </Text>\r\n                {\r\n                    subtitle && <Text\r\n                        variant=\"text\"\r\n                        fontSize=\"button\"\r\n                        className='list-item-subtitle'\r\n                        component={typeof subtitle === \"string\" || typeof subtitle === \"number\" ? \"p\" : \"div\"}\r\n                    >{subtitle as any}</Text>\r\n                }\r\n            </Tag>\r\n            {endIcon && <Tag ml={1} component=\"span\" display=\"inline-block\" className='list-item-icon'>{endIcon as any}</Tag>}\r\n        </Tag>\r\n    )\r\n})\r\n\r\nexport default ListItem"],"names":["__rest","useInterface","useBreakpointProps","_jsxs","Tag","_jsx","Text"],"mappings":"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"}

package/ListItem/index.mjs

@@ -1,4 +1,10 @@
-import {__rest}from'tslib';import {jsxs,jsx}from'react/jsx-runtime';import React from'react';import {useInterface,useBreakpointProps,Tag}from'@xanui/core';import Text from'../Text/index.mjs';const ListItem = React.forwardRef((_a, ref) => {
+import { __rest } from 'tslib';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import React from 'react';
+import { useInterface, useBreakpointProps, Tag } from '@xanui/core';
+import Text from '../Text/index.mjs';
+
+const ListItem = React.forwardRef((_a, ref) => {
     var { children, startIcon, endIcon, subtitle } = _a, rest = __rest(_a, ["children", "startIcon", "endIcon", "subtitle"]);
     let [_b] = useInterface("ListItem", rest, {}), { selected } = _b, props = __rest(_b, ["selected"]);
     const _p = {};
@@ -23,4 +29,7 @@ import {__rest}from'tslib';import {jsxs,jsx}from'react/jsx-runtime';import React
             whiteSpace: "nowrap",
             flexShrink: "0",
         }, baseClass: 'list-item', classNames: [{ "list-item-selected": selected }, ...(props.classNames || [])], ref: ref, children: [startIcon && jsx(Tag, { mr: 1, component: "span", display: "inline-block", className: 'list-item-icon', children: startIcon }), jsxs(Tag, { flex: 1, children: [jsx(Text, { variant: "text", className: 'list-item-text', component: typeof children === "string" || typeof children === "number" ? "p" : "div", children: children }), subtitle && jsx(Text, { variant: "text", fontSize: "button", className: 'list-item-subtitle', component: typeof subtitle === "string" || typeof subtitle === "number" ? "p" : "div", children: subtitle })] }), endIcon && jsx(Tag, { ml: 1, component: "span", display: "inline-block", className: 'list-item-icon', children: endIcon })] })));
-});export{ListItem as default};//# sourceMappingURL=index.mjs.map
+});
+
+export { ListItem as default };
+//# sourceMappingURL=index.mjs.map