@xanui/ui 1.1.17 → 1.1.18

package/Menu/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/Menu/index.tsx"],"sourcesContent":["\"use client\";\nimport { ReactNode, useEffect, useState, useRef } from \"react\";\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\";\nimport Portal, { PortalProps } from \"../Portal\";\nimport ClickOutside from \"../ClickOutside\";\n\nexport type PlacementTypes =\n    | \"top\"\n    | \"top-left\"\n    | \"top-right\"\n    | \"bottom\"\n    | \"bottom-left\"\n    | \"bottom-right\"\n    | \"right\"\n    | \"right-top\"\n    | \"right-bottom\"\n    | \"left\"\n    | \"left-top\"\n    | \"left-bottom\";\n\nexport type MenuProps = {\n    children?: ReactNode;\n    target?: HTMLElement;\n    placement?: useBreakpointPropsType<PlacementTypes>;\n    zIndex?: number;\n    onClickOutside?: (e: MouseEvent) => void;\n    slotProps?: {\n        transition?: Omit<TransitionProps, \"open\">;\n        portal?: Omit<PortalProps, \"children\">;\n        content?: Omit<TagProps<\"div\">, \"children\">;\n    };\n};\n\nconst placements: PlacementTypes[] = [\n    \"top\",\n    \"top-left\",\n    \"top-right\",\n    \"bottom\",\n    \"bottom-left\",\n    \"bottom-right\",\n    \"right\",\n    \"right-top\",\n    \"right-bottom\",\n    \"left\",\n    \"left-top\",\n    \"left-bottom\",\n];\n\nconst getTransformOrigin = (placement: PlacementTypes) => {\n    switch (placement) {\n        case \"top\":\n            return \"bottom\";\n        case \"top-left\":\n            return \"bottom left\";\n        case \"top-right\":\n            return \"bottom right\";\n        case \"bottom\":\n            return \"top\";\n        case \"bottom-left\":\n            return \"top left\";\n        case \"bottom-right\":\n            return \"top right\";\n        case \"left\":\n            return \"right\";\n        case \"left-top\":\n            return \"top right\";\n        case \"left-bottom\":\n            return \"bottom right\";\n        case \"right\":\n            return \"left\";\n        case \"right-top\":\n            return \"top left\";\n        case \"right-bottom\":\n            return \"bottom left\";\n        default:\n            return \"top\";\n    }\n};\n\n// Compute coordinates for each placement\nconst computePosition = (\n    placement: PlacementTypes,\n    menu: HTMLElement,\n    target: HTMLElement\n) => {\n    const { width: mw, height: mh } = menu.getBoundingClientRect();\n    const {\n        top: tt,\n        left: tl,\n        bottom: tb,\n        right: tr,\n        width: tw,\n        height: th,\n    } = target.getBoundingClientRect();\n\n    const positions: Record<PlacementTypes, { top: number; left: number }> = {\n        \"bottom-left\": { top: tb, left: tl },\n        \"bottom-right\": { top: tb, left: tr - mw },\n        bottom: { top: tb, left: tl + (tw - mw) / 2 },\n\n        \"top-left\": { top: tt - mh, left: tl },\n        \"top-right\": { top: tt - mh, left: tr - mw },\n        top: { top: tt - mh, left: tl + (tw - mw) / 2 },\n\n        left: { top: tt + (th - mh) / 2, left: tl - mw },\n        \"left-top\": { top: tt, left: tl - mw },\n        \"left-bottom\": { top: tb - mh, left: tl - mw },\n\n        right: { top: tt + (th - mh) / 2, left: tr },\n        \"right-top\": { top: tt, left: tr },\n        \"right-bottom\": { top: tb - mh, left: tr },\n    };\n\n    return positions[placement];\n};\n\n\n// Check if menu is off-screen\nconst isOffScreen = (menu: HTMLElement) => {\n    const { x, y, width, height } = menu.getBoundingClientRect();\n    return x < 0 || y < 0 || x + width > window.innerWidth || y + height > window.innerHeight;\n};\n\n// Try to place menu and fallback if off-screen\nconst placeMenu = (placement: PlacementTypes, menu: HTMLElement, target: HTMLElement) => {\n    let pos = computePosition(placement, menu, target);\n    menu.style.top = pos.top + \"px\";\n    menu.style.left = pos.left + \"px\";\n\n    if (isOffScreen(menu)) {\n        for (const p of placements) {\n            const fallbackPos = computePosition(p, menu, target);\n            menu.style.top = fallbackPos.top + \"px\";\n            menu.style.left = fallbackPos.left + \"px\";\n            if (!isOffScreen(menu)) return p;\n        }\n    }\n    return placement;\n};\n\nconst Menu = ({ children, target, ...props }: MenuProps) => {\n    let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface<any>(\"Menu\", props, {});\n    const _p: any = {};\n    if (placement) _p.placement = placement;\n    const p: any = useBreakpointProps(_p);\n    placement = p.placement || \"bottom-left\";\n\n    const isOpen = Boolean(target);\n    const [closed, setClosed] = useState(!isOpen);\n    const [placed, setPlaced] = useState<PlacementTypes>(placement);\n    const menuRef = useRef<HTMLDivElement>(null);\n\n    // Open/close effect\n    useEffect(() => {\n        if (closed && isOpen) setClosed(false);\n    }, [isOpen]);\n\n\n    useEffect(() => {\n        if (!closed && target && menuRef.current) {\n            const updatePosition = () => {\n                if (menuRef.current && target) {\n                    const p = placeMenu(placement!, menuRef.current, target);\n                    setPlaced(p);\n                }\n            };\n\n            updatePosition();\n\n            window.addEventListener(\"resize\", updatePosition);\n            window.addEventListener(\"scroll\", updatePosition, true);\n\n            return () => {\n                window.removeEventListener(\"resize\", updatePosition);\n                window.removeEventListener(\"scroll\", updatePosition, true);\n            };\n        }\n        return undefined;\n    }, [closed, target, placement]);\n\n    if (closed) return null;\n\n    return (\n        <Portal {...slotProps?.portal}>\n            <ClickOutside\n                onClickOutside={(e: MouseEvent) => {\n                    if (e.target !== target) {\n                        onClickOutside && onClickOutside(e);\n                    }\n                }}\n                ref={menuRef}\n                sx={{ position: \"fixed\", zIndex: 1500 + (zIndex || 0) }}\n            >\n                <Transition\n                    duration={200}\n                    easing=\"fast\"\n                    variant=\"grow\"\n                    {...slotProps?.transition}\n                    open={isOpen}\n                    onClosed={() => {\n                        setClosed(true);\n                        slotProps?.transition?.onClosed?.();\n                    }}\n                >\n                    <Tag\n                        baseClass=\"menu-content\"\n                        {...slotProps?.content}\n                        sxr={{\n                            overflow: \"hidden\",\n                            bgcolor: \"background.primary\",\n                            shadow: 2,\n                            radius: 1,\n                            transformOrigin: getTransformOrigin(placed),\n                            ...slotProps?.content?.sx,\n                        }}\n                    >\n                        {children}\n                    </Tag>\n                </Transition>\n            </ClickOutside>\n        </Portal>\n    );\n};\n\nexport default Menu;\n"],"names":["__rest","useInterface","useBreakpointProps","useState","useRef","useEffect","_jsx","Portal","ClickOutside","Transition","Tag"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/Menu/index.tsx"],"sourcesContent":["\"use client\";\nimport { ReactNode, useEffect, useState, useRef } from \"react\";\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\";\nimport Portal, { PortalProps } from \"../Portal\";\nimport ClickOutside from \"../ClickOutside\";\n\nexport type PlacementTypes =\n    | \"top\"\n    | \"top-left\"\n    | \"top-right\"\n    | \"bottom\"\n    | \"bottom-left\"\n    | \"bottom-right\"\n    | \"right\"\n    | \"right-top\"\n    | \"right-bottom\"\n    | \"left\"\n    | \"left-top\"\n    | \"left-bottom\";\n\nexport type MenuProps = {\n    children?: ReactNode;\n    target?: HTMLElement;\n    placement?: useBreakpointPropsType<PlacementTypes>;\n    zIndex?: number;\n    onClickOutside?: (e: MouseEvent) => void;\n    slotProps?: {\n        transition?: Omit<TransitionProps, \"open\">;\n        portal?: Omit<PortalProps, \"children\">;\n        content?: Omit<TagProps<\"div\">, \"children\">;\n    };\n};\n\nconst placements: PlacementTypes[] = [\n    \"top\",\n    \"top-left\",\n    \"top-right\",\n    \"bottom\",\n    \"bottom-left\",\n    \"bottom-right\",\n    \"right\",\n    \"right-top\",\n    \"right-bottom\",\n    \"left\",\n    \"left-top\",\n    \"left-bottom\",\n];\n\nconst getTransformOrigin = (placement: PlacementTypes) => {\n    switch (placement) {\n        case \"top\":\n            return \"bottom\";\n        case \"top-left\":\n            return \"bottom left\";\n        case \"top-right\":\n            return \"bottom right\";\n        case \"bottom\":\n            return \"top\";\n        case \"bottom-left\":\n            return \"top left\";\n        case \"bottom-right\":\n            return \"top right\";\n        case \"left\":\n            return \"right\";\n        case \"left-top\":\n            return \"top right\";\n        case \"left-bottom\":\n            return \"bottom right\";\n        case \"right\":\n            return \"left\";\n        case \"right-top\":\n            return \"top left\";\n        case \"right-bottom\":\n            return \"bottom left\";\n        default:\n            return \"top\";\n    }\n};\n\n// Compute coordinates for each placement\nconst computePosition = (\n    placement: PlacementTypes,\n    menu: HTMLElement,\n    target: HTMLElement\n) => {\n    const { width: mw, height: mh } = menu.getBoundingClientRect();\n    const {\n        top: tt,\n        left: tl,\n        bottom: tb,\n        right: tr,\n        width: tw,\n        height: th,\n    } = target.getBoundingClientRect();\n\n    const positions: Record<PlacementTypes, { top: number; left: number }> = {\n        \"bottom-left\": { top: tb, left: tl },\n        \"bottom-right\": { top: tb, left: tr - mw },\n        bottom: { top: tb, left: tl + (tw - mw) / 2 },\n\n        \"top-left\": { top: tt - mh, left: tl },\n        \"top-right\": { top: tt - mh, left: tr - mw },\n        top: { top: tt - mh, left: tl + (tw - mw) / 2 },\n\n        left: { top: tt + (th - mh) / 2, left: tl - mw },\n        \"left-top\": { top: tt, left: tl - mw },\n        \"left-bottom\": { top: tb - mh, left: tl - mw },\n\n        right: { top: tt + (th - mh) / 2, left: tr },\n        \"right-top\": { top: tt, left: tr },\n        \"right-bottom\": { top: tb - mh, left: tr },\n    };\n\n    return positions[placement];\n};\n\n\n// Check if menu is off-screen\nconst isOffScreen = (menu: HTMLElement) => {\n    const { x, y, width, height } = menu.getBoundingClientRect();\n    return x < 0 || y < 0 || x + width > window.innerWidth || y + height > window.innerHeight;\n};\n\n// Try to place menu and fallback if off-screen\nconst placeMenu = (placement: PlacementTypes, menu: HTMLElement, target: HTMLElement) => {\n    let pos = computePosition(placement, menu, target);\n    menu.style.top = pos.top + \"px\";\n    menu.style.left = pos.left + \"px\";\n\n    if (isOffScreen(menu)) {\n        for (const p of placements) {\n            const fallbackPos = computePosition(p, menu, target);\n            menu.style.top = fallbackPos.top + \"px\";\n            menu.style.left = fallbackPos.left + \"px\";\n            if (!isOffScreen(menu)) return p;\n        }\n    }\n    return placement;\n};\n\nconst Menu = ({ children, target, ...props }: MenuProps) => {\n    let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface<any>(\"Menu\", props, {});\n    const _p: any = {};\n    if (placement) _p.placement = placement;\n    const p: any = useBreakpointProps(_p);\n    placement = p.placement || \"bottom-left\";\n\n    const isOpen = Boolean(target);\n    const [closed, setClosed] = useState(!isOpen);\n    const [placed, setPlaced] = useState<PlacementTypes>(placement);\n    const menuRef = useRef<HTMLDivElement>(null);\n\n    // Open/close effect\n    useEffect(() => {\n        if (closed && isOpen) setClosed(false);\n    }, [isOpen]);\n\n\n    useEffect(() => {\n        if (!closed && target && menuRef.current) {\n            const updatePosition = () => {\n                if (menuRef.current && target) {\n                    const p = placeMenu(placement!, menuRef.current, target);\n                    setPlaced(p);\n                }\n            };\n\n            updatePosition();\n\n            window.addEventListener(\"resize\", updatePosition);\n            window.addEventListener(\"scroll\", updatePosition, true);\n\n            return () => {\n                window.removeEventListener(\"resize\", updatePosition);\n                window.removeEventListener(\"scroll\", updatePosition, true);\n            };\n        }\n        return undefined;\n    }, [closed, target, placement]);\n\n    if (closed) return null;\n\n    return (\n        <Portal {...slotProps?.portal}>\n            <ClickOutside\n                onClickOutside={(e: MouseEvent) => {\n                    if (e.target !== target) {\n                        onClickOutside && onClickOutside(e);\n                    }\n                }}\n                ref={menuRef}\n                sx={{ position: \"fixed\", zIndex: 1500 + (zIndex || 0) }}\n            >\n                <Transition\n                    duration={200}\n                    easing=\"fast\"\n                    variant=\"grow\"\n                    {...slotProps?.transition}\n                    open={isOpen}\n                    onClosed={() => {\n                        setClosed(true);\n                        slotProps?.transition?.onClosed?.();\n                    }}\n                >\n                    <Tag\n                        baseClass=\"menu-content\"\n                        {...slotProps?.content}\n                        sxr={{\n                            overflow: \"hidden\",\n                            bgcolor: \"background.primary\",\n                            shadow: 2,\n                            radius: 1,\n                            transformOrigin: getTransformOrigin(placed),\n                            ...slotProps?.content?.sx,\n                        }}\n                    >\n                        {children}\n                    </Tag>\n                </Transition>\n            </ClickOutside>\n        </Portal>\n    );\n};\n\nexport default Menu;\n"],"names":[],"mappings":";;;;;;;;;;AAiCA;;;;;;;;;;;;;;AAeA;;AAEQ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;;AAEZ;AAEA;AACA;AAKI;AACA;AASA;;;AAGI;;AAGA;AACA;AAEA;;AAEA;AAEA;;;;AAKJ;AACJ;AAGA;AACA;AACI;;AAEJ;AAEA;AACA;;;;AAKI;AACI;;;;AAII;AAAwB;;;AAGhC;AACJ;AAEA;;;;;AAGI;AAAe;AACf;AACA;AAEA;;;AAGA;;;;;AAKA;;;;AAMY;AACI;;;AAGR;AAEA;AAEA;;AAGA;AACI;;AAEJ;;AAEJ;;AAGJ;AAAY;;AAMI;AACI;;;;;;;AAmCxB;;"}

package/Menu/index.mjs

@@ -1,4 +1,12 @@
-import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import {useState,useRef,useEffect}from'react';import {useInterface,useBreakpointProps,Transition,Tag}from'@xanui/core';import Portal from'../Portal/index.mjs';import ClickOutside from'../ClickOutside/index.mjs';const placements = [
+"use client";
+import { __rest } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+import { useState, useRef, useEffect } from 'react';
+import { useInterface, useBreakpointProps, Transition, Tag } from '@xanui/core';
+import Portal from '../Portal/index.mjs';
+import ClickOutside from '../ClickOutside/index.mjs';
+
+const placements = [
     "top",
     "top-left",
     "top-right",
@@ -130,4 +138,7 @@ const Menu = (_a) => {
                     setClosed(true);
                     (_b = (_a = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _a === void 0 ? void 0 : _a.onClosed) === null || _b === void 0 ? void 0 : _b.call(_a);
                 }, children: jsx(Tag, Object.assign({ baseClass: "menu-content" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.content, { sxr: Object.assign({ overflow: "hidden", bgcolor: "background.primary", shadow: 2, radius: 1, transformOrigin: getTransformOrigin(placed) }, (_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.content) === null || _b === void 0 ? void 0 : _b.sx), children: children })) })) }) })));
-};export{Menu as default};//# sourceMappingURL=index.mjs.map
+};
+
+export { Menu as default };
+//# sourceMappingURL=index.mjs.map

package/Menu/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/Menu/index.tsx"],"sourcesContent":["\"use client\";\nimport { ReactNode, useEffect, useState, useRef } from \"react\";\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\";\nimport Portal, { PortalProps } from \"../Portal\";\nimport ClickOutside from \"../ClickOutside\";\n\nexport type PlacementTypes =\n    | \"top\"\n    | \"top-left\"\n    | \"top-right\"\n    | \"bottom\"\n    | \"bottom-left\"\n    | \"bottom-right\"\n    | \"right\"\n    | \"right-top\"\n    | \"right-bottom\"\n    | \"left\"\n    | \"left-top\"\n    | \"left-bottom\";\n\nexport type MenuProps = {\n    children?: ReactNode;\n    target?: HTMLElement;\n    placement?: useBreakpointPropsType<PlacementTypes>;\n    zIndex?: number;\n    onClickOutside?: (e: MouseEvent) => void;\n    slotProps?: {\n        transition?: Omit<TransitionProps, \"open\">;\n        portal?: Omit<PortalProps, \"children\">;\n        content?: Omit<TagProps<\"div\">, \"children\">;\n    };\n};\n\nconst placements: PlacementTypes[] = [\n    \"top\",\n    \"top-left\",\n    \"top-right\",\n    \"bottom\",\n    \"bottom-left\",\n    \"bottom-right\",\n    \"right\",\n    \"right-top\",\n    \"right-bottom\",\n    \"left\",\n    \"left-top\",\n    \"left-bottom\",\n];\n\nconst getTransformOrigin = (placement: PlacementTypes) => {\n    switch (placement) {\n        case \"top\":\n            return \"bottom\";\n        case \"top-left\":\n            return \"bottom left\";\n        case \"top-right\":\n            return \"bottom right\";\n        case \"bottom\":\n            return \"top\";\n        case \"bottom-left\":\n            return \"top left\";\n        case \"bottom-right\":\n            return \"top right\";\n        case \"left\":\n            return \"right\";\n        case \"left-top\":\n            return \"top right\";\n        case \"left-bottom\":\n            return \"bottom right\";\n        case \"right\":\n            return \"left\";\n        case \"right-top\":\n            return \"top left\";\n        case \"right-bottom\":\n            return \"bottom left\";\n        default:\n            return \"top\";\n    }\n};\n\n// Compute coordinates for each placement\nconst computePosition = (\n    placement: PlacementTypes,\n    menu: HTMLElement,\n    target: HTMLElement\n) => {\n    const { width: mw, height: mh } = menu.getBoundingClientRect();\n    const {\n        top: tt,\n        left: tl,\n        bottom: tb,\n        right: tr,\n        width: tw,\n        height: th,\n    } = target.getBoundingClientRect();\n\n    const positions: Record<PlacementTypes, { top: number; left: number }> = {\n        \"bottom-left\": { top: tb, left: tl },\n        \"bottom-right\": { top: tb, left: tr - mw },\n        bottom: { top: tb, left: tl + (tw - mw) / 2 },\n\n        \"top-left\": { top: tt - mh, left: tl },\n        \"top-right\": { top: tt - mh, left: tr - mw },\n        top: { top: tt - mh, left: tl + (tw - mw) / 2 },\n\n        left: { top: tt + (th - mh) / 2, left: tl - mw },\n        \"left-top\": { top: tt, left: tl - mw },\n        \"left-bottom\": { top: tb - mh, left: tl - mw },\n\n        right: { top: tt + (th - mh) / 2, left: tr },\n        \"right-top\": { top: tt, left: tr },\n        \"right-bottom\": { top: tb - mh, left: tr },\n    };\n\n    return positions[placement];\n};\n\n\n// Check if menu is off-screen\nconst isOffScreen = (menu: HTMLElement) => {\n    const { x, y, width, height } = menu.getBoundingClientRect();\n    return x < 0 || y < 0 || x + width > window.innerWidth || y + height > window.innerHeight;\n};\n\n// Try to place menu and fallback if off-screen\nconst placeMenu = (placement: PlacementTypes, menu: HTMLElement, target: HTMLElement) => {\n    let pos = computePosition(placement, menu, target);\n    menu.style.top = pos.top + \"px\";\n    menu.style.left = pos.left + \"px\";\n\n    if (isOffScreen(menu)) {\n        for (const p of placements) {\n            const fallbackPos = computePosition(p, menu, target);\n            menu.style.top = fallbackPos.top + \"px\";\n            menu.style.left = fallbackPos.left + \"px\";\n            if (!isOffScreen(menu)) return p;\n        }\n    }\n    return placement;\n};\n\nconst Menu = ({ children, target, ...props }: MenuProps) => {\n    let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface<any>(\"Menu\", props, {});\n    const _p: any = {};\n    if (placement) _p.placement = placement;\n    const p: any = useBreakpointProps(_p);\n    placement = p.placement || \"bottom-left\";\n\n    const isOpen = Boolean(target);\n    const [closed, setClosed] = useState(!isOpen);\n    const [placed, setPlaced] = useState<PlacementTypes>(placement);\n    const menuRef = useRef<HTMLDivElement>(null);\n\n    // Open/close effect\n    useEffect(() => {\n        if (closed && isOpen) setClosed(false);\n    }, [isOpen]);\n\n\n    useEffect(() => {\n        if (!closed && target && menuRef.current) {\n            const updatePosition = () => {\n                if (menuRef.current && target) {\n                    const p = placeMenu(placement!, menuRef.current, target);\n                    setPlaced(p);\n                }\n            };\n\n            updatePosition();\n\n            window.addEventListener(\"resize\", updatePosition);\n            window.addEventListener(\"scroll\", updatePosition, true);\n\n            return () => {\n                window.removeEventListener(\"resize\", updatePosition);\n                window.removeEventListener(\"scroll\", updatePosition, true);\n            };\n        }\n        return undefined;\n    }, [closed, target, placement]);\n\n    if (closed) return null;\n\n    return (\n        <Portal {...slotProps?.portal}>\n            <ClickOutside\n                onClickOutside={(e: MouseEvent) => {\n                    if (e.target !== target) {\n                        onClickOutside && onClickOutside(e);\n                    }\n                }}\n                ref={menuRef}\n                sx={{ position: \"fixed\", zIndex: 1500 + (zIndex || 0) }}\n            >\n                <Transition\n                    duration={200}\n                    easing=\"fast\"\n                    variant=\"grow\"\n                    {...slotProps?.transition}\n                    open={isOpen}\n                    onClosed={() => {\n                        setClosed(true);\n                        slotProps?.transition?.onClosed?.();\n                    }}\n                >\n                    <Tag\n                        baseClass=\"menu-content\"\n                        {...slotProps?.content}\n                        sxr={{\n                            overflow: \"hidden\",\n                            bgcolor: \"background.primary\",\n                            shadow: 2,\n                            radius: 1,\n                            transformOrigin: getTransformOrigin(placed),\n                            ...slotProps?.content?.sx,\n                        }}\n                    >\n                        {children}\n                    </Tag>\n                </Transition>\n            </ClickOutside>\n        </Portal>\n    );\n};\n\nexport default Menu;\n"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../src/Menu/index.tsx"],"sourcesContent":["\"use client\";\nimport { ReactNode, useEffect, useState, useRef } from \"react\";\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\";\nimport Portal, { PortalProps } from \"../Portal\";\nimport ClickOutside from \"../ClickOutside\";\n\nexport type PlacementTypes =\n    | \"top\"\n    | \"top-left\"\n    | \"top-right\"\n    | \"bottom\"\n    | \"bottom-left\"\n    | \"bottom-right\"\n    | \"right\"\n    | \"right-top\"\n    | \"right-bottom\"\n    | \"left\"\n    | \"left-top\"\n    | \"left-bottom\";\n\nexport type MenuProps = {\n    children?: ReactNode;\n    target?: HTMLElement;\n    placement?: useBreakpointPropsType<PlacementTypes>;\n    zIndex?: number;\n    onClickOutside?: (e: MouseEvent) => void;\n    slotProps?: {\n        transition?: Omit<TransitionProps, \"open\">;\n        portal?: Omit<PortalProps, \"children\">;\n        content?: Omit<TagProps<\"div\">, \"children\">;\n    };\n};\n\nconst placements: PlacementTypes[] = [\n    \"top\",\n    \"top-left\",\n    \"top-right\",\n    \"bottom\",\n    \"bottom-left\",\n    \"bottom-right\",\n    \"right\",\n    \"right-top\",\n    \"right-bottom\",\n    \"left\",\n    \"left-top\",\n    \"left-bottom\",\n];\n\nconst getTransformOrigin = (placement: PlacementTypes) => {\n    switch (placement) {\n        case \"top\":\n            return \"bottom\";\n        case \"top-left\":\n            return \"bottom left\";\n        case \"top-right\":\n            return \"bottom right\";\n        case \"bottom\":\n            return \"top\";\n        case \"bottom-left\":\n            return \"top left\";\n        case \"bottom-right\":\n            return \"top right\";\n        case \"left\":\n            return \"right\";\n        case \"left-top\":\n            return \"top right\";\n        case \"left-bottom\":\n            return \"bottom right\";\n        case \"right\":\n            return \"left\";\n        case \"right-top\":\n            return \"top left\";\n        case \"right-bottom\":\n            return \"bottom left\";\n        default:\n            return \"top\";\n    }\n};\n\n// Compute coordinates for each placement\nconst computePosition = (\n    placement: PlacementTypes,\n    menu: HTMLElement,\n    target: HTMLElement\n) => {\n    const { width: mw, height: mh } = menu.getBoundingClientRect();\n    const {\n        top: tt,\n        left: tl,\n        bottom: tb,\n        right: tr,\n        width: tw,\n        height: th,\n    } = target.getBoundingClientRect();\n\n    const positions: Record<PlacementTypes, { top: number; left: number }> = {\n        \"bottom-left\": { top: tb, left: tl },\n        \"bottom-right\": { top: tb, left: tr - mw },\n        bottom: { top: tb, left: tl + (tw - mw) / 2 },\n\n        \"top-left\": { top: tt - mh, left: tl },\n        \"top-right\": { top: tt - mh, left: tr - mw },\n        top: { top: tt - mh, left: tl + (tw - mw) / 2 },\n\n        left: { top: tt + (th - mh) / 2, left: tl - mw },\n        \"left-top\": { top: tt, left: tl - mw },\n        \"left-bottom\": { top: tb - mh, left: tl - mw },\n\n        right: { top: tt + (th - mh) / 2, left: tr },\n        \"right-top\": { top: tt, left: tr },\n        \"right-bottom\": { top: tb - mh, left: tr },\n    };\n\n    return positions[placement];\n};\n\n\n// Check if menu is off-screen\nconst isOffScreen = (menu: HTMLElement) => {\n    const { x, y, width, height } = menu.getBoundingClientRect();\n    return x < 0 || y < 0 || x + width > window.innerWidth || y + height > window.innerHeight;\n};\n\n// Try to place menu and fallback if off-screen\nconst placeMenu = (placement: PlacementTypes, menu: HTMLElement, target: HTMLElement) => {\n    let pos = computePosition(placement, menu, target);\n    menu.style.top = pos.top + \"px\";\n    menu.style.left = pos.left + \"px\";\n\n    if (isOffScreen(menu)) {\n        for (const p of placements) {\n            const fallbackPos = computePosition(p, menu, target);\n            menu.style.top = fallbackPos.top + \"px\";\n            menu.style.left = fallbackPos.left + \"px\";\n            if (!isOffScreen(menu)) return p;\n        }\n    }\n    return placement;\n};\n\nconst Menu = ({ children, target, ...props }: MenuProps) => {\n    let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface<any>(\"Menu\", props, {});\n    const _p: any = {};\n    if (placement) _p.placement = placement;\n    const p: any = useBreakpointProps(_p);\n    placement = p.placement || \"bottom-left\";\n\n    const isOpen = Boolean(target);\n    const [closed, setClosed] = useState(!isOpen);\n    const [placed, setPlaced] = useState<PlacementTypes>(placement);\n    const menuRef = useRef<HTMLDivElement>(null);\n\n    // Open/close effect\n    useEffect(() => {\n        if (closed && isOpen) setClosed(false);\n    }, [isOpen]);\n\n\n    useEffect(() => {\n        if (!closed && target && menuRef.current) {\n            const updatePosition = () => {\n                if (menuRef.current && target) {\n                    const p = placeMenu(placement!, menuRef.current, target);\n                    setPlaced(p);\n                }\n            };\n\n            updatePosition();\n\n            window.addEventListener(\"resize\", updatePosition);\n            window.addEventListener(\"scroll\", updatePosition, true);\n\n            return () => {\n                window.removeEventListener(\"resize\", updatePosition);\n                window.removeEventListener(\"scroll\", updatePosition, true);\n            };\n        }\n        return undefined;\n    }, [closed, target, placement]);\n\n    if (closed) return null;\n\n    return (\n        <Portal {...slotProps?.portal}>\n            <ClickOutside\n                onClickOutside={(e: MouseEvent) => {\n                    if (e.target !== target) {\n                        onClickOutside && onClickOutside(e);\n                    }\n                }}\n                ref={menuRef}\n                sx={{ position: \"fixed\", zIndex: 1500 + (zIndex || 0) }}\n            >\n                <Transition\n                    duration={200}\n                    easing=\"fast\"\n                    variant=\"grow\"\n                    {...slotProps?.transition}\n                    open={isOpen}\n                    onClosed={() => {\n                        setClosed(true);\n                        slotProps?.transition?.onClosed?.();\n                    }}\n                >\n                    <Tag\n                        baseClass=\"menu-content\"\n                        {...slotProps?.content}\n                        sxr={{\n                            overflow: \"hidden\",\n                            bgcolor: \"background.primary\",\n                            shadow: 2,\n                            radius: 1,\n                            transformOrigin: getTransformOrigin(placed),\n                            ...slotProps?.content?.sx,\n                        }}\n                    >\n                        {children}\n                    </Tag>\n                </Transition>\n            </ClickOutside>\n        </Portal>\n    );\n};\n\nexport default Menu;\n"],"names":[],"mappings":";;;;;;;;AAiCA;;;;;;;;;;;;;;AAeA;;AAEQ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;AACJ;AACI;;AAEZ;AAEA;AACA;AAKI;AACA;AASA;;;AAGI;;AAGA;AACA;AAEA;;AAEA;AAEA;;;;AAKJ;AACJ;AAGA;AACA;AACI;;AAEJ;AAEA;AACA;;;;AAKI;AACI;;;;AAII;AAAwB;;;AAGhC;AACJ;AAEA;;;;;AAGI;AAAe;AACf;AACA;AAEA;;;AAGA;;;;;AAKA;;;;AAMY;AACI;;;AAGR;AAEA;AAEA;;AAGA;AACI;;AAEJ;;AAEJ;;AAGJ;AAAY;;AAMI;AACI;;;;;;;AAmCxB;;"}

package/Modal/index.js

@@ -1,7 +1,16 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:true});var tslib=require('tslib'),jsxRuntime=require('react/jsx-runtime'),React=require('react'),index=require('../useModal/index.js'),core=require('@xanui/core');const Modal = (_a) => {
+"use client";
+'use strict';
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var index = require('../useModal/index.js');
+var core = require('@xanui/core');
+
+const Modal = (_a) => {
     var { children, open } = _a, props = tslib.__rest(_a, ["children", "open"]);
     const ref = React.useRef(null);
-    const modal = index.default(jsxRuntime.jsx(jsxRuntime.Fragment, { children: children }), Object.assign(Object.assign({}, props), { onClickOutside: () => {
+    const modal = index(jsxRuntime.jsx(jsxRuntime.Fragment, { children: children }), Object.assign(Object.assign({}, props), { onClickOutside: () => {
             if (props === null || props === void 0 ? void 0 : props.onClickOutside) {
                 props.onClickOutside();
             }
@@ -44,4 +53,7 @@ Modal.open = (children, props) => {
 };
 Modal.close = () => {
     core.Renderar.unrender(ActionModal);
-};exports.default=Modal;//# sourceMappingURL=index.js.map
+};
+
+module.exports = Modal;
+//# sourceMappingURL=index.js.map

package/Modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/Modal/index.tsx"],"sourcesContent":["\"use client\";\nimport { ReactNode, useEffect, useRef } from \"react\";\nimport useModal, { UseModalProps } from \"../useModal\";\nimport { Renderar, Tag } from \"@xanui/core\";\n\nexport type ModalProps = UseModalProps & {\n   children: ReactNode;\n   open: boolean;\n}\n\nconst Modal = ({ children, open, ...props }: ModalProps) => {\n   const ref = useRef<HTMLDivElement>(null);\n\n   const modal = useModal(<>{children}</>, {\n      ...props,\n      onClickOutside: () => {\n         if (props?.onClickOutside) {\n            props.onClickOutside()\n         }\n      },\n      slotProps: {\n         layer: {\n            portal: {\n               container: ref?.current || undefined\n            }\n         }\n      }\n   })\n\n   useEffect(() => {\n      if (open) {\n         modal.open()\n      } else {\n         modal.close()\n      }\n   }, [open])\n   return <Tag ref={ref}></Tag>\n}\n\nconst ActionModal = ({ children, ...props }: ModalProps) => {\n   return (\n      <Modal {...props}>\n         {children}\n      </Modal>\n   )\n}\n\nModal.open = (children: ModalProps['children'], props?: Omit<ModalProps, 'children' | \"open\">) => {\n   const m = Renderar.render(ActionModal as any, {\n      open: true,\n      ...props,\n      children,\n      onClosed: () => {\n         m.unrender()\n         if (props?.onClosed) {\n            props.onClosed()\n         }\n      }\n   })\n\n   return {\n      open: () => {\n         m.updateProps({ open: true })\n      },\n      close: () => {\n         m.updateProps({ open: false })\n      },\n   }\n};\n\nModal.close = () => {\n   Renderar.unrender(ActionModal as any)\n}\n\nexport default Modal;"],"names":["__rest","useRef","useModal","_jsx","_Fragment","useEffect","Tag","Renderar"],"mappings":"kOAUA,MAAM,KAAK,GAAG,CAAC,EAAwC,KAAI;QAA5C,EAAE,QAAQ,EAAE,IAAI,EAAA,GAAA,EAAwB,EAAnB,KAAK,GAAAA,YAAA,CAAA,EAAA,EAA1B,oBAA4B,CAAF;AACtC,IAAA,MAAM,GAAG,GAAGC,YAAM,CAAiB,IAAI,CAAC;AAExC,IAAA,MAAM,KAAK,GAAGC,aAAQ,CAACC,cAAA,CAAAC,mBAAA,EAAA,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAI,EAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAChC,KAAK,CAAA,EAAA,EACR,cAAc,EAAE,MAAK;YAClB,IAAI,KAAK,aAAL,KAAK,KAAA,MAAA,GAAA,MAAA,GAAL,KAAK,CAAE,cAAc,EAAE;gBACxB,KAAK,CAAC,cAAc,EAAE;YACzB;QACH,CAAC,EACD,SAAS,EAAE;AACR,YAAA,KAAK,EAAE;AACJ,gBAAA,MAAM,EAAE;oBACL,SAAS,EAAE,CAAA,GAAG,KAAA,IAAA,IAAH,GAAG,uBAAH,GAAG,CAAE,OAAO,KAAI;AAC7B;AACH;AACH,SAAA,EAAA,CAAA,CACF;IAEFC,eAAS,CAAC,MAAK;QACZ,IAAI,IAAI,EAAE;YACP,KAAK,CAAC,IAAI,EAAE;QACf;aAAO;YACJ,KAAK,CAAC,KAAK,EAAE;QAChB;AACH,IAAA,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;AACV,IAAA,OAAOF,eAACG,QAAG,EAAA,EAAC,GAAG,EAAE,GAAG,GAAQ;AAC/B;AAEA,MAAM,WAAW,GAAG,CAAC,EAAkC,KAAI;AAAtC,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAwB,EAAnB,KAAK,GAAAN,YAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;IACtC,QACGG,eAAC,KAAK,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,KAAK,EAAA,EAAA,QAAA,EACZ,QAAQ,EAAA,CAAA,CACJ;AAEd,CAAC;AAED,KAAK,CAAC,IAAI,GAAG,CAAC,QAAgC,EAAE,KAA6C,KAAI;AAC9F,IAAA,MAAM,CAAC,GAAGI,aAAQ,CAAC,MAAM,CAAC,WAAkB,EAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EACzC,IAAI,EAAE,IAAI,EAAA,EACP,KAAK,CAAA,EAAA,EACR,QAAQ,EACR,QAAQ,EAAE,MAAK;YACZ,CAAC,CAAC,QAAQ,EAAE;YACZ,IAAI,KAAK,aAAL,KAAK,KAAA,MAAA,GAAA,MAAA,GAAL,KAAK,CAAE,QAAQ,EAAE;gBAClB,KAAK,CAAC,QAAQ,EAAE;YACnB;AACH,QAAA,CAAC,IACF;IAEF,OAAO;QACJ,IAAI,EAAE,MAAK;YACR,CAAC,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;QAChC,CAAC;QACD,KAAK,EAAE,MAAK;YACT,CAAC,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;QACjC,CAAC;KACH;AACJ,CAAC;AAED,KAAK,CAAC,KAAK,GAAG,MAAK;AAChB,IAAAA,aAAQ,CAAC,QAAQ,CAAC,WAAkB,CAAC;AACxC,CAAC"}
+{"version":3,"file":"index.js","sources":["../../src/Modal/index.tsx"],"sourcesContent":["\"use client\";\nimport { ReactNode, useEffect, useRef } from \"react\";\nimport useModal, { UseModalProps } from \"../useModal\";\nimport { Renderar, Tag } from \"@xanui/core\";\n\nexport type ModalProps = UseModalProps & {\n   children: ReactNode;\n   open: boolean;\n}\n\nconst Modal = ({ children, open, ...props }: ModalProps) => {\n   const ref = useRef<HTMLDivElement>(null);\n\n   const modal = useModal(<>{children}</>, {\n      ...props,\n      onClickOutside: () => {\n         if (props?.onClickOutside) {\n            props.onClickOutside()\n         }\n      },\n      slotProps: {\n         layer: {\n            portal: {\n               container: ref?.current || undefined\n            }\n         }\n      }\n   })\n\n   useEffect(() => {\n      if (open) {\n         modal.open()\n      } else {\n         modal.close()\n      }\n   }, [open])\n   return <Tag ref={ref}></Tag>\n}\n\nconst ActionModal = ({ children, ...props }: ModalProps) => {\n   return (\n      <Modal {...props}>\n         {children}\n      </Modal>\n   )\n}\n\nModal.open = (children: ModalProps['children'], props?: Omit<ModalProps, 'children' | \"open\">) => {\n   const m = Renderar.render(ActionModal as any, {\n      open: true,\n      ...props,\n      children,\n      onClosed: () => {\n         m.unrender()\n         if (props?.onClosed) {\n            props.onClosed()\n         }\n      }\n   })\n\n   return {\n      open: () => {\n         m.updateProps({ open: true })\n      },\n      close: () => {\n         m.updateProps({ open: false })\n      },\n   }\n};\n\nModal.close = () => {\n   Renderar.unrender(ActionModal as any)\n}\n\nexport default Modal;"],"names":[],"mappings":";;;;;;;;;AAUA;;AACG;AAEA;;;;;AAQM;AACG;;AAEC;AACH;AACH;;;;;;;;AASJ;AACA;AACH;AAEA;AAAqB;;AAMrB;AAEA;AACG;;;;;AASG;;;;;;;;;AAWN;AAEA;AACG;AACH;;"}

package/Modal/index.mjs

@@ -1,4 +1,11 @@
-import {__rest}from'tslib';import {jsx,Fragment}from'react/jsx-runtime';import {useRef,useEffect}from'react';import useModal from'../useModal/index.mjs';import {Tag,Renderar}from'@xanui/core';const Modal = (_a) => {
+"use client";
+import { __rest } from 'tslib';
+import { jsx, Fragment } from 'react/jsx-runtime';
+import { useRef, useEffect } from 'react';
+import useModal from '../useModal/index.mjs';
+import { Tag, Renderar } from '@xanui/core';
+
+const Modal = (_a) => {
     var { children, open } = _a, props = __rest(_a, ["children", "open"]);
     const ref = useRef(null);
     const modal = useModal(jsx(Fragment, { children: children }), Object.assign(Object.assign({}, props), { onClickOutside: () => {
@@ -44,4 +51,7 @@ Modal.open = (children, props) => {
 };
 Modal.close = () => {
     Renderar.unrender(ActionModal);
-};export{Modal as default};//# sourceMappingURL=index.mjs.map
+};
+
+export { Modal as default };
+//# sourceMappingURL=index.mjs.map

package/Modal/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/Modal/index.tsx"],"sourcesContent":["\"use client\";\nimport { ReactNode, useEffect, useRef } from \"react\";\nimport useModal, { UseModalProps } from \"../useModal\";\nimport { Renderar, Tag } from \"@xanui/core\";\n\nexport type ModalProps = UseModalProps & {\n   children: ReactNode;\n   open: boolean;\n}\n\nconst Modal = ({ children, open, ...props }: ModalProps) => {\n   const ref = useRef<HTMLDivElement>(null);\n\n   const modal = useModal(<>{children}</>, {\n      ...props,\n      onClickOutside: () => {\n         if (props?.onClickOutside) {\n            props.onClickOutside()\n         }\n      },\n      slotProps: {\n         layer: {\n            portal: {\n               container: ref?.current || undefined\n            }\n         }\n      }\n   })\n\n   useEffect(() => {\n      if (open) {\n         modal.open()\n      } else {\n         modal.close()\n      }\n   }, [open])\n   return <Tag ref={ref}></Tag>\n}\n\nconst ActionModal = ({ children, ...props }: ModalProps) => {\n   return (\n      <Modal {...props}>\n         {children}\n      </Modal>\n   )\n}\n\nModal.open = (children: ModalProps['children'], props?: Omit<ModalProps, 'children' | \"open\">) => {\n   const m = Renderar.render(ActionModal as any, {\n      open: true,\n      ...props,\n      children,\n      onClosed: () => {\n         m.unrender()\n         if (props?.onClosed) {\n            props.onClosed()\n         }\n      }\n   })\n\n   return {\n      open: () => {\n         m.updateProps({ open: true })\n      },\n      close: () => {\n         m.updateProps({ open: false })\n      },\n   }\n};\n\nModal.close = () => {\n   Renderar.unrender(ActionModal as any)\n}\n\nexport default Modal;"],"names":["_jsx","_Fragment"],"mappings":"gMAUA,MAAM,KAAK,GAAG,CAAC,EAAwC,KAAI;QAA5C,EAAE,QAAQ,EAAE,IAAI,EAAA,GAAA,EAAwB,EAAnB,KAAK,GAAA,MAAA,CAAA,EAAA,EAA1B,oBAA4B,CAAF;AACtC,IAAA,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC;AAExC,IAAA,MAAM,KAAK,GAAG,QAAQ,CAACA,GAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAI,EAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAChC,KAAK,CAAA,EAAA,EACR,cAAc,EAAE,MAAK;YAClB,IAAI,KAAK,aAAL,KAAK,KAAA,MAAA,GAAA,MAAA,GAAL,KAAK,CAAE,cAAc,EAAE;gBACxB,KAAK,CAAC,cAAc,EAAE;YACzB;QACH,CAAC,EACD,SAAS,EAAE;AACR,YAAA,KAAK,EAAE;AACJ,gBAAA,MAAM,EAAE;oBACL,SAAS,EAAE,CAAA,GAAG,KAAA,IAAA,IAAH,GAAG,uBAAH,GAAG,CAAE,OAAO,KAAI;AAC7B;AACH;AACH,SAAA,EAAA,CAAA,CACF;IAEF,SAAS,CAAC,MAAK;QACZ,IAAI,IAAI,EAAE;YACP,KAAK,CAAC,IAAI,EAAE;QACf;aAAO;YACJ,KAAK,CAAC,KAAK,EAAE;QAChB;AACH,IAAA,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;AACV,IAAA,OAAOD,IAAC,GAAG,EAAA,EAAC,GAAG,EAAE,GAAG,GAAQ;AAC/B;AAEA,MAAM,WAAW,GAAG,CAAC,EAAkC,KAAI;AAAtC,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAwB,EAAnB,KAAK,GAAA,MAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;IACtC,QACGA,IAAC,KAAK,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,KAAK,EAAA,EAAA,QAAA,EACZ,QAAQ,EAAA,CAAA,CACJ;AAEd,CAAC;AAED,KAAK,CAAC,IAAI,GAAG,CAAC,QAAgC,EAAE,KAA6C,KAAI;AAC9F,IAAA,MAAM,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,WAAkB,EAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EACzC,IAAI,EAAE,IAAI,EAAA,EACP,KAAK,CAAA,EAAA,EACR,QAAQ,EACR,QAAQ,EAAE,MAAK;YACZ,CAAC,CAAC,QAAQ,EAAE;YACZ,IAAI,KAAK,aAAL,KAAK,KAAA,MAAA,GAAA,MAAA,GAAL,KAAK,CAAE,QAAQ,EAAE;gBAClB,KAAK,CAAC,QAAQ,EAAE;YACnB;AACH,QAAA,CAAC,IACF;IAEF,OAAO;QACJ,IAAI,EAAE,MAAK;YACR,CAAC,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;QAChC,CAAC;QACD,KAAK,EAAE,MAAK;YACT,CAAC,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;QACjC,CAAC;KACH;AACJ,CAAC;AAED,KAAK,CAAC,KAAK,GAAG,MAAK;AAChB,IAAA,QAAQ,CAAC,QAAQ,CAAC,WAAkB,CAAC;AACxC,CAAC"}
+{"version":3,"file":"index.mjs","sources":["../../src/Modal/index.tsx"],"sourcesContent":["\"use client\";\nimport { ReactNode, useEffect, useRef } from \"react\";\nimport useModal, { UseModalProps } from \"../useModal\";\nimport { Renderar, Tag } from \"@xanui/core\";\n\nexport type ModalProps = UseModalProps & {\n   children: ReactNode;\n   open: boolean;\n}\n\nconst Modal = ({ children, open, ...props }: ModalProps) => {\n   const ref = useRef<HTMLDivElement>(null);\n\n   const modal = useModal(<>{children}</>, {\n      ...props,\n      onClickOutside: () => {\n         if (props?.onClickOutside) {\n            props.onClickOutside()\n         }\n      },\n      slotProps: {\n         layer: {\n            portal: {\n               container: ref?.current || undefined\n            }\n         }\n      }\n   })\n\n   useEffect(() => {\n      if (open) {\n         modal.open()\n      } else {\n         modal.close()\n      }\n   }, [open])\n   return <Tag ref={ref}></Tag>\n}\n\nconst ActionModal = ({ children, ...props }: ModalProps) => {\n   return (\n      <Modal {...props}>\n         {children}\n      </Modal>\n   )\n}\n\nModal.open = (children: ModalProps['children'], props?: Omit<ModalProps, 'children' | \"open\">) => {\n   const m = Renderar.render(ActionModal as any, {\n      open: true,\n      ...props,\n      children,\n      onClosed: () => {\n         m.unrender()\n         if (props?.onClosed) {\n            props.onClosed()\n         }\n      }\n   })\n\n   return {\n      open: () => {\n         m.updateProps({ open: true })\n      },\n      close: () => {\n         m.updateProps({ open: false })\n      },\n   }\n};\n\nModal.close = () => {\n   Renderar.unrender(ActionModal as any)\n}\n\nexport default Modal;"],"names":[],"mappings":";;;;;;;AAUA;;AACG;AAEA;;;;;AAQM;AACG;;AAEC;AACH;AACH;;;;;;;;AASJ;AACA;AACH;AAEA;AAAqB;;AAMrB;AAEA;AACG;;;;;AASG;;;;;;;;;AAWN;AAEA;AACG;AACH;;"}

package/NoSSR/index.js

@@ -1,7 +1,15 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:true});var React=require('react');const NoSSR = ({ children }) => {
+"use client";
+'use strict';
+
+var React = require('react');
+
+const NoSSR = ({ children }) => {
     const [isClient, setIsClient] = React.useState(false);
     React.useEffect(() => {
         setIsClient(true);
     }, []);
     return isClient ? children : null;
-};exports.default=NoSSR;//# sourceMappingURL=index.js.map
+};
+
+module.exports = NoSSR;
+//# sourceMappingURL=index.js.map

package/NoSSR/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/NoSSR/index.tsx"],"sourcesContent":["\"use client\";\nimport { useEffect, useState } from \"react\";\n\nconst NoSSR = ({ children }: any) => {\n    const [isClient, setIsClient] = useState(false);\n    useEffect(() => {\n        setIsClient(true);\n    }, [])\n    return isClient ? children : null\n}\n\nexport default NoSSR"],"names":["useState","useEffect"],"mappings":"iGAGA,MAAM,KAAK,GAAG,CAAC,EAAE,QAAQ,EAAO,KAAI;IAChC,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAGA,cAAQ,CAAC,KAAK,CAAC;IAC/CC,eAAS,CAAC,MAAK;QACX,WAAW,CAAC,IAAI,CAAC;IACrB,CAAC,EAAE,EAAE,CAAC;IACN,OAAO,QAAQ,GAAG,QAAQ,GAAG,IAAI;AACrC"}
+{"version":3,"file":"index.js","sources":["../../src/NoSSR/index.tsx"],"sourcesContent":["\"use client\";\nimport { useEffect, useState } from \"react\";\n\nconst NoSSR = ({ children }: any) => {\n    const [isClient, setIsClient] = useState(false);\n    useEffect(() => {\n        setIsClient(true);\n    }, [])\n    return isClient ? children : null\n}\n\nexport default NoSSR"],"names":[],"mappings":";;;;;AAGA;;;;;;AAMA;;"}

package/NoSSR/index.mjs

@@ -1,7 +1,13 @@
-import {useState,useEffect}from'react';const NoSSR = ({ children }) => {
+"use client";
+import { useState, useEffect } from 'react';
+
+const NoSSR = ({ children }) => {
     const [isClient, setIsClient] = useState(false);
     useEffect(() => {
         setIsClient(true);
     }, []);
     return isClient ? children : null;
-};export{NoSSR as default};//# sourceMappingURL=index.mjs.map
+};
+
+export { NoSSR as default };
+//# sourceMappingURL=index.mjs.map

package/NoSSR/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/NoSSR/index.tsx"],"sourcesContent":["\"use client\";\nimport { useEffect, useState } from \"react\";\n\nconst NoSSR = ({ children }: any) => {\n    const [isClient, setIsClient] = useState(false);\n    useEffect(() => {\n        setIsClient(true);\n    }, [])\n    return isClient ? children : null\n}\n\nexport default NoSSR"],"names":[],"mappings":"uCAGA,MAAM,KAAK,GAAG,CAAC,EAAE,QAAQ,EAAO,KAAI;IAChC,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IAC/C,SAAS,CAAC,MAAK;QACX,WAAW,CAAC,IAAI,CAAC;IACrB,CAAC,EAAE,EAAE,CAAC;IACN,OAAO,QAAQ,GAAG,QAAQ,GAAG,IAAI;AACrC"}
+{"version":3,"file":"index.mjs","sources":["../../src/NoSSR/index.tsx"],"sourcesContent":["\"use client\";\nimport { useEffect, useState } from \"react\";\n\nconst NoSSR = ({ children }: any) => {\n    const [isClient, setIsClient] = useState(false);\n    useEffect(() => {\n        setIsClient(true);\n    }, [])\n    return isClient ? children : null\n}\n\nexport default NoSSR"],"names":[],"mappings":";;;AAGA;;;;;;AAMA;;"}

package/Option/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'),index=require('../ListItem/index.js');const Option = React.forwardRef((_a, ref) => {
+'use strict';
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var index = require('../ListItem/index.js');
+
+const Option = React.forwardRef((_a, ref) => {
     var { value, children } = _a, props = tslib.__rest(_a, ["value", "children"]);
-    return (jsxRuntime.jsx(index.default, Object.assign({}, props, { ref: ref, children: children })));
-});exports.default=Option;//# sourceMappingURL=index.js.map
+    return (jsxRuntime.jsx(index, Object.assign({}, props, { ref: ref, children: children })));
+});
+
+module.exports = Option;
+//# sourceMappingURL=index.js.map

package/Option/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/Option/index.tsx"],"sourcesContent":["\nimport React from 'react'\nimport ListItem, { ListItemProps } from '../ListItem'\n\nexport type OptionProps = ListItemProps & {\n    value: string | number;\n}\n\nconst Option = React.forwardRef(({ value, children, ...props }: OptionProps, ref: React.Ref<any>) => {\n    return (\n        <ListItem {...props} ref={ref}>{children}</ListItem>\n    )\n})\n\nexport default Option"],"names":["__rest","_jsx","ListItem"],"mappings":"sMAQA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAA0C,EAAE,GAAmB,KAAI;QAAnE,EAAE,KAAK,EAAE,QAAQ,EAAA,GAAA,EAAyB,EAApB,KAAK,GAAAA,YAAA,CAAA,EAAA,EAA3B,qBAA6B,CAAF;AACxD,IAAA,QACIC,cAAA,CAACC,aAAQ,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,KAAK,EAAA,EAAE,GAAG,EAAE,GAAG,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAA,CAAY;AAE5D,CAAC"}
+{"version":3,"file":"index.js","sources":["../../src/Option/index.tsx"],"sourcesContent":["\nimport React from 'react'\nimport ListItem, { ListItemProps } from '../ListItem'\n\nexport type OptionProps = ListItemProps & {\n    value: string | number;\n}\n\nconst Option = React.forwardRef(({ value, children, ...props }: OptionProps, ref: React.Ref<any>) => {\n    return (\n        <ListItem {...props} ref={ref}>{children}</ListItem>\n    )\n})\n\nexport default Option"],"names":["__rest","_jsx","ListItem"],"mappings":";;;;;;;AAQA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAA0C,EAAE,GAAmB,KAAI;QAAnE,EAAE,KAAK,EAAE,QAAQ,EAAA,GAAA,EAAyB,EAApB,KAAK,GAAAA,YAAA,CAAA,EAAA,EAA3B,qBAA6B,CAAF;AACxD,IAAA,QACIC,cAAA,CAACC,KAAQ,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,KAAK,EAAA,EAAE,GAAG,EAAE,GAAG,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAA,CAAY;AAE5D,CAAC;;;;"}

package/Option/index.mjs

@@ -1,4 +1,12 @@
-import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import React from'react';import ListItem from'../ListItem/index.mjs';const Option = React.forwardRef((_a, ref) => {
+import { __rest } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+import React from 'react';
+import ListItem from '../ListItem/index.mjs';
+
+const Option = React.forwardRef((_a, ref) => {
     var { value, children } = _a, props = __rest(_a, ["value", "children"]);
     return (jsx(ListItem, Object.assign({}, props, { ref: ref, children: children })));
-});export{Option as default};//# sourceMappingURL=index.mjs.map
+});
+
+export { Option as default };
+//# sourceMappingURL=index.mjs.map

package/Option/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/Option/index.tsx"],"sourcesContent":["\nimport React from 'react'\nimport ListItem, { ListItemProps } from '../ListItem'\n\nexport type OptionProps = ListItemProps & {\n    value: string | number;\n}\n\nconst Option = React.forwardRef(({ value, children, ...props }: OptionProps, ref: React.Ref<any>) => {\n    return (\n        <ListItem {...props} ref={ref}>{children}</ListItem>\n    )\n})\n\nexport default Option"],"names":["_jsx"],"mappings":"oIAQA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAA0C,EAAE,GAAmB,KAAI;QAAnE,EAAE,KAAK,EAAE,QAAQ,EAAA,GAAA,EAAyB,EAApB,KAAK,GAAA,MAAA,CAAA,EAAA,EAA3B,qBAA6B,CAAF;AACxD,IAAA,QACIA,GAAA,CAAC,QAAQ,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,KAAK,EAAA,EAAE,GAAG,EAAE,GAAG,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAA,CAAY;AAE5D,CAAC"}
+{"version":3,"file":"index.mjs","sources":["../../src/Option/index.tsx"],"sourcesContent":["\nimport React from 'react'\nimport ListItem, { ListItemProps } from '../ListItem'\n\nexport type OptionProps = ListItemProps & {\n    value: string | number;\n}\n\nconst Option = React.forwardRef(({ value, children, ...props }: OptionProps, ref: React.Ref<any>) => {\n    return (\n        <ListItem {...props} ref={ref}>{children}</ListItem>\n    )\n})\n\nexport default Option"],"names":["_jsx"],"mappings":";;;;;AAQA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAA0C,EAAE,GAAmB,KAAI;QAAnE,EAAE,KAAK,EAAE,QAAQ,EAAA,GAAA,EAAyB,EAApB,KAAK,GAAA,MAAA,CAAA,EAAA,EAA3B,qBAA6B,CAAF;AACxD,IAAA,QACIA,GAAA,CAAC,QAAQ,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,KAAK,EAAA,EAAE,GAAG,EAAE,GAAG,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAA,CAAY;AAE5D,CAAC;;;;"}

package/Paper/index.js

@@ -1,5 +1,15 @@
-'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 Paper = 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 Paper = React.forwardRef((_a, ref) => {
     var { children } = _a, rest = tslib.__rest(_a, ["children"]);
     let [props] = core.useInterface("default", rest, {});
     return (jsxRuntime.jsx(core.Tag, Object.assign({}, props, { sxr: Object.assign({ radius: 1, p: 1.5, bgcolor: "background.secondary", color: "text.primary" }, props === null || props === void 0 ? void 0 : props.sx), baseClass: 'default', ref: ref, children: children })));
-});exports.default=Paper;//# sourceMappingURL=index.js.map
+});
+
+module.exports = Paper;
+//# sourceMappingURL=index.js.map

package/Paper/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/Paper/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface } from '@xanui/core';\n\nexport type PaperProps<T extends TagComponentType = \"div\"> = TagProps<T>\n\nconst Paper = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: PaperProps<T>, ref?: React.Ref<any>) => {\n    let [props] = useInterface<any>(\"default\", rest, {})\n    return (\n        <Tag\n            {...props}\n            sxr={{\n                radius: 1,\n                p: 1.5,\n                bgcolor: \"background.secondary\",\n                color: \"text.primary\",\n                ...props?.sx\n            }}\n            baseClass='default'\n            ref={ref}\n        >{children}</Tag>\n    )\n})\n\nexport default Paper\n"],"names":["__rest","useInterface","_jsx","Tag"],"mappings":"4LAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAoC,EAAE,GAAoB,KAAI;AAA9D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA0B,EAArB,IAAI,GAAAA,YAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;AACnF,IAAA,IAAI,CAAC,KAAK,CAAC,GAAGC,iBAAY,CAAM,SAAS,EAAE,IAAI,EAAE,EAAE,CAAC;AACpD,IAAA,QACIC,cAAA,CAACC,QAAG,oBACI,KAAK,EAAA,EACT,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,MAAM,EAAE,CAAC,EACT,CAAC,EAAE,GAAG,EACN,OAAO,EAAE,sBAAsB,EAC/B,KAAK,EAAE,cAAc,EAAA,EAClB,KAAK,KAAA,IAAA,IAAL,KAAK,uBAAL,KAAK,CAAE,EAAE,CAAA,EAEhB,SAAS,EAAC,SAAS,EACnB,GAAG,EAAE,GAAG,YACV,QAAQ,EAAA,CAAA,CAAO;AAEzB,CAAC"}
+{"version":3,"file":"index.js","sources":["../../src/Paper/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface } from '@xanui/core';\n\nexport type PaperProps<T extends TagComponentType = \"div\"> = TagProps<T>\n\nconst Paper = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: PaperProps<T>, ref?: React.Ref<any>) => {\n    let [props] = useInterface<any>(\"default\", rest, {})\n    return (\n        <Tag\n            {...props}\n            sxr={{\n                radius: 1,\n                p: 1.5,\n                bgcolor: \"background.secondary\",\n                color: \"text.primary\",\n                ...props?.sx\n            }}\n            baseClass='default'\n            ref={ref}\n        >{children}</Tag>\n    )\n})\n\nexport default Paper\n"],"names":["__rest","useInterface","_jsx","Tag"],"mappings":";;;;;;;AAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAoC,EAAE,GAAoB,KAAI;AAA9D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA0B,EAArB,IAAI,GAAAA,YAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;AACnF,IAAA,IAAI,CAAC,KAAK,CAAC,GAAGC,iBAAY,CAAM,SAAS,EAAE,IAAI,EAAE,EAAE,CAAC;AACpD,IAAA,QACIC,cAAA,CAACC,QAAG,oBACI,KAAK,EAAA,EACT,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,MAAM,EAAE,CAAC,EACT,CAAC,EAAE,GAAG,EACN,OAAO,EAAE,sBAAsB,EAC/B,KAAK,EAAE,cAAc,EAAA,EAClB,KAAK,KAAA,IAAA,IAAL,KAAK,uBAAL,KAAK,CAAE,EAAE,CAAA,EAEhB,SAAS,EAAC,SAAS,EACnB,GAAG,EAAE,GAAG,YACV,QAAQ,EAAA,CAAA,CAAO;AAEzB,CAAC;;;;"}

package/Paper/index.mjs

@@ -1,5 +1,13 @@
-import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import React from'react';import {useInterface,Tag}from'@xanui/core';const Paper = React.forwardRef((_a, ref) => {
+import { __rest } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+import React from 'react';
+import { useInterface, Tag } from '@xanui/core';
+
+const Paper = React.forwardRef((_a, ref) => {
     var { children } = _a, rest = __rest(_a, ["children"]);
     let [props] = useInterface("default", rest, {});
     return (jsx(Tag, Object.assign({}, props, { sxr: Object.assign({ radius: 1, p: 1.5, bgcolor: "background.secondary", color: "text.primary" }, props === null || props === void 0 ? void 0 : props.sx), baseClass: 'default', ref: ref, children: children })));
-});export{Paper as default};//# sourceMappingURL=index.mjs.map
+});
+
+export { Paper as default };
+//# sourceMappingURL=index.mjs.map

package/Paper/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/Paper/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface } from '@xanui/core';\n\nexport type PaperProps<T extends TagComponentType = \"div\"> = TagProps<T>\n\nconst Paper = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: PaperProps<T>, ref?: React.Ref<any>) => {\n    let [props] = useInterface<any>(\"default\", rest, {})\n    return (\n        <Tag\n            {...props}\n            sxr={{\n                radius: 1,\n                p: 1.5,\n                bgcolor: \"background.secondary\",\n                color: \"text.primary\",\n                ...props?.sx\n            }}\n            baseClass='default'\n            ref={ref}\n        >{children}</Tag>\n    )\n})\n\nexport default Paper\n"],"names":["_jsx"],"mappings":"mIAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAoC,EAAE,GAAoB,KAAI;AAA9D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA0B,EAArB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;AACnF,IAAA,IAAI,CAAC,KAAK,CAAC,GAAG,YAAY,CAAM,SAAS,EAAE,IAAI,EAAE,EAAE,CAAC;AACpD,IAAA,QACIA,GAAA,CAAC,GAAG,oBACI,KAAK,EAAA,EACT,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,MAAM,EAAE,CAAC,EACT,CAAC,EAAE,GAAG,EACN,OAAO,EAAE,sBAAsB,EAC/B,KAAK,EAAE,cAAc,EAAA,EAClB,KAAK,KAAA,IAAA,IAAL,KAAK,uBAAL,KAAK,CAAE,EAAE,CAAA,EAEhB,SAAS,EAAC,SAAS,EACnB,GAAG,EAAE,GAAG,YACV,QAAQ,EAAA,CAAA,CAAO;AAEzB,CAAC"}
+{"version":3,"file":"index.mjs","sources":["../../src/Paper/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface } from '@xanui/core';\n\nexport type PaperProps<T extends TagComponentType = \"div\"> = TagProps<T>\n\nconst Paper = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: PaperProps<T>, ref?: React.Ref<any>) => {\n    let [props] = useInterface<any>(\"default\", rest, {})\n    return (\n        <Tag\n            {...props}\n            sxr={{\n                radius: 1,\n                p: 1.5,\n                bgcolor: \"background.secondary\",\n                color: \"text.primary\",\n                ...props?.sx\n            }}\n            baseClass='default'\n            ref={ref}\n        >{children}</Tag>\n    )\n})\n\nexport default Paper\n"],"names":["_jsx"],"mappings":";;;;;AAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAoC,EAAE,GAAoB,KAAI;AAA9D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA0B,EAArB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;AACnF,IAAA,IAAI,CAAC,KAAK,CAAC,GAAG,YAAY,CAAM,SAAS,EAAE,IAAI,EAAE,EAAE,CAAC;AACpD,IAAA,QACIA,GAAA,CAAC,GAAG,oBACI,KAAK,EAAA,EACT,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,MAAM,EAAE,CAAC,EACT,CAAC,EAAE,GAAG,EACN,OAAO,EAAE,sBAAsB,EAC/B,KAAK,EAAE,cAAc,EAAA,EAClB,KAAK,KAAA,IAAA,IAAL,KAAK,uBAAL,KAAK,CAAE,EAAE,CAAA,EAEhB,SAAS,EAAC,SAAS,EACnB,GAAG,EAAE,GAAG,YACV,QAAQ,EAAA,CAAA,CAAO;AAEzB,CAAC;;;;"}

package/Portal/index.js

@@ -1,4 +1,12 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:true});var jsxRuntime=require('react/jsx-runtime'),React=require('react'),ReactDOM=require('react-dom'),core=require('@xanui/core');const Portal = ({ children, appendTo, container }) => {
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var ReactDOM = require('react-dom');
+var core = require('@xanui/core');
+
+const Portal = ({ children, appendTo, container }) => {
     const theme = core.useTheme();
     appendTo = appendTo || document.body;
     const c = React.useMemo(() => {
@@ -13,4 +21,7 @@
         };
     }, []);
     return ReactDOM.createPortal(jsxRuntime.jsx(core.ThemeProvider, { theme: theme.name, children: children }), c);
-};exports.default=Portal;//# sourceMappingURL=index.js.map
+};
+
+module.exports = Portal;
+//# sourceMappingURL=index.js.map

package/Portal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/Portal/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { useEffect, useMemo } from 'react'\nimport ReactDOM from 'react-dom';\nimport { useTheme, ThemeProvider } from '@xanui/core';\nexport type PortalProps = {\n    children?: React.ReactNode;\n    appendTo?: HTMLElement;\n    container?: HTMLElement;\n}\n\nconst Portal = ({ children, appendTo, container }: PortalProps) => {\n    const theme = useTheme()\n    appendTo = appendTo || document.body\n\n    const c = useMemo(() => {\n        let _con: HTMLElement = container || document.createElement(\"div\");\n        appendTo.appendChild(_con);\n        _con.className = \"xui-portal\"\n        return _con\n    }, [])\n\n    useEffect(() => {\n        return () => {\n            (appendTo as any).removeChild(c);\n        }\n    }, [])\n\n    return ReactDOM.createPortal(\n        <ThemeProvider theme={theme.name}>\n            {children}\n        </ThemeProvider>,\n        c,\n    );\n}\n\nexport default Portal"],"names":["useTheme","useMemo","useEffect","_jsx","ThemeProvider"],"mappings":"mMAUA,MAAM,MAAM,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAe,KAAI;AAC9D,IAAA,MAAM,KAAK,GAAGA,aAAQ,EAAE;AACxB,IAAA,QAAQ,GAAG,QAAQ,IAAI,QAAQ,CAAC,IAAI;AAEpC,IAAA,MAAM,CAAC,GAAGC,aAAO,CAAC,MAAK;QACnB,IAAI,IAAI,GAAgB,SAAS,IAAI,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;AAClE,QAAA,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;AAC1B,QAAA,IAAI,CAAC,SAAS,GAAG,YAAY;AAC7B,QAAA,OAAO,IAAI;IACf,CAAC,EAAE,EAAE,CAAC;IAENC,eAAS,CAAC,MAAK;AACX,QAAA,OAAO,MAAK;AACP,YAAA,QAAgB,CAAC,WAAW,CAAC,CAAC,CAAC;AACpC,QAAA,CAAC;IACL,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,OAAO,QAAQ,CAAC,YAAY,CACxBC,cAAA,CAACC,kBAAa,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,EAAA,QAAA,EAC3B,QAAQ,GACG,EAChB,CAAC,CACJ;AACL"}
+{"version":3,"file":"index.js","sources":["../../src/Portal/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { useEffect, useMemo } from 'react'\nimport ReactDOM from 'react-dom';\nimport { useTheme, ThemeProvider } from '@xanui/core';\nexport type PortalProps = {\n    children?: React.ReactNode;\n    appendTo?: HTMLElement;\n    container?: HTMLElement;\n}\n\nconst Portal = ({ children, appendTo, container }: PortalProps) => {\n    const theme = useTheme()\n    appendTo = appendTo || document.body\n\n    const c = useMemo(() => {\n        let _con: HTMLElement = container || document.createElement(\"div\");\n        appendTo.appendChild(_con);\n        _con.className = \"xui-portal\"\n        return _con\n    }, [])\n\n    useEffect(() => {\n        return () => {\n            (appendTo as any).removeChild(c);\n        }\n    }, [])\n\n    return ReactDOM.createPortal(\n        <ThemeProvider theme={theme.name}>\n            {children}\n        </ThemeProvider>,\n        c,\n    );\n}\n\nexport default Portal"],"names":[],"mappings":";;;;;;;;AAUA;AACI;AACA;AAEA;;AAEI;AACA;AACA;;;AAIA;AACK;AACL;;AAGJ;AAMJ;;"}

package/Portal/index.mjs

@@ -1,4 +1,10 @@
-import {jsx}from'react/jsx-runtime';import {useMemo,useEffect}from'react';import ReactDOM from'react-dom';import {useTheme,ThemeProvider}from'@xanui/core';const Portal = ({ children, appendTo, container }) => {
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { useMemo, useEffect } from 'react';
+import ReactDOM from 'react-dom';
+import { useTheme, ThemeProvider } from '@xanui/core';
+
+const Portal = ({ children, appendTo, container }) => {
     const theme = useTheme();
     appendTo = appendTo || document.body;
     const c = useMemo(() => {
@@ -13,4 +19,7 @@ import {jsx}from'react/jsx-runtime';import {useMemo,useEffect}from'react';import
         };
     }, []);
     return ReactDOM.createPortal(jsx(ThemeProvider, { theme: theme.name, children: children }), c);
-};export{Portal as default};//# sourceMappingURL=index.mjs.map
+};
+
+export { Portal as default };
+//# sourceMappingURL=index.mjs.map

package/Portal/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/Portal/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { useEffect, useMemo } from 'react'\nimport ReactDOM from 'react-dom';\nimport { useTheme, ThemeProvider } from '@xanui/core';\nexport type PortalProps = {\n    children?: React.ReactNode;\n    appendTo?: HTMLElement;\n    container?: HTMLElement;\n}\n\nconst Portal = ({ children, appendTo, container }: PortalProps) => {\n    const theme = useTheme()\n    appendTo = appendTo || document.body\n\n    const c = useMemo(() => {\n        let _con: HTMLElement = container || document.createElement(\"div\");\n        appendTo.appendChild(_con);\n        _con.className = \"xui-portal\"\n        return _con\n    }, [])\n\n    useEffect(() => {\n        return () => {\n            (appendTo as any).removeChild(c);\n        }\n    }, [])\n\n    return ReactDOM.createPortal(\n        <ThemeProvider theme={theme.name}>\n            {children}\n        </ThemeProvider>,\n        c,\n    );\n}\n\nexport default Portal"],"names":["_jsx"],"mappings":"2JAUA,MAAM,MAAM,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAe,KAAI;AAC9D,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;AACxB,IAAA,QAAQ,GAAG,QAAQ,IAAI,QAAQ,CAAC,IAAI;AAEpC,IAAA,MAAM,CAAC,GAAG,OAAO,CAAC,MAAK;QACnB,IAAI,IAAI,GAAgB,SAAS,IAAI,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;AAClE,QAAA,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;AAC1B,QAAA,IAAI,CAAC,SAAS,GAAG,YAAY;AAC7B,QAAA,OAAO,IAAI;IACf,CAAC,EAAE,EAAE,CAAC;IAEN,SAAS,CAAC,MAAK;AACX,QAAA,OAAO,MAAK;AACP,YAAA,QAAgB,CAAC,WAAW,CAAC,CAAC,CAAC;AACpC,QAAA,CAAC;IACL,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,OAAO,QAAQ,CAAC,YAAY,CACxBA,GAAA,CAAC,aAAa,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,EAAA,QAAA,EAC3B,QAAQ,GACG,EAChB,CAAC,CACJ;AACL"}
+{"version":3,"file":"index.mjs","sources":["../../src/Portal/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { useEffect, useMemo } from 'react'\nimport ReactDOM from 'react-dom';\nimport { useTheme, ThemeProvider } from '@xanui/core';\nexport type PortalProps = {\n    children?: React.ReactNode;\n    appendTo?: HTMLElement;\n    container?: HTMLElement;\n}\n\nconst Portal = ({ children, appendTo, container }: PortalProps) => {\n    const theme = useTheme()\n    appendTo = appendTo || document.body\n\n    const c = useMemo(() => {\n        let _con: HTMLElement = container || document.createElement(\"div\");\n        appendTo.appendChild(_con);\n        _con.className = \"xui-portal\"\n        return _con\n    }, [])\n\n    useEffect(() => {\n        return () => {\n            (appendTo as any).removeChild(c);\n        }\n    }, [])\n\n    return ReactDOM.createPortal(\n        <ThemeProvider theme={theme.name}>\n            {children}\n        </ThemeProvider>,\n        c,\n    );\n}\n\nexport default Portal"],"names":[],"mappings":";;;;;;AAUA;AACI;AACA;AAEA;;AAEI;AACA;AACA;;;AAIA;AACK;AACL;;AAGJ;AAMJ;;"}

package/Radio/index.js

@@ -1,4 +1,16 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:true});var jsxRuntime=require('react/jsx-runtime'),React=require('react'),core=require('@xanui/core'),CheckIcon=require('@xanui/icons/RadioButtonChecked'),UnCheckIcon=require('@xanui/icons/RadioButtonUnchecked'),index=require('../Checkbox/index.js');const Radio = React.forwardRef((props, ref) => {
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var core = require('@xanui/core');
+var CheckIcon = require('@xanui/icons/RadioButtonChecked');
+var UnCheckIcon = require('@xanui/icons/RadioButtonUnchecked');
+var index = require('../Checkbox/index.js');
+
+const Radio = React.forwardRef((props, ref) => {
     let [rest] = core.useInterface("Radio", props, {});
-    return jsxRuntime.jsx(index.default, Object.assign({ checkIcon: jsxRuntime.jsx(CheckIcon, {}), uncheckIcon: jsxRuntime.jsx(UnCheckIcon, {}) }, rest, { type: "radio", ref: ref, classNames: ['radio', ...((rest === null || rest === void 0 ? void 0 : rest.classNames) || [])] }));
-});exports.default=Radio;//# sourceMappingURL=index.js.map
+    return jsxRuntime.jsx(index, Object.assign({ checkIcon: jsxRuntime.jsx(CheckIcon, {}), uncheckIcon: jsxRuntime.jsx(UnCheckIcon, {}) }, rest, { type: "radio", ref: ref, classNames: ['radio', ...((rest === null || rest === void 0 ? void 0 : rest.classNames) || [])] }));
+});
+
+module.exports = Radio;
+//# sourceMappingURL=index.js.map

package/Radio/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/Radio/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { useInterface } from '@xanui/core';\nimport CheckIcon from '@xanui/icons/RadioButtonChecked'\nimport UnCheckIcon from '@xanui/icons/RadioButtonUnchecked'\nimport Checkbox, { CheckboxProps } from '../Checkbox';\n\nexport type RadioProps = CheckboxProps\nconst Radio = React.forwardRef((props: RadioProps, ref?: React.Ref<any>) => {\n    let [rest] = useInterface<any>(\"Radio\", props, {})\n    return <Checkbox\n        checkIcon={<CheckIcon />}\n        uncheckIcon={<UnCheckIcon />}\n        {...rest}\n        type=\"radio\"\n        ref={ref}\n        classNames={['radio', ...(rest?.classNames || [])]}\n    />\n})\n\nexport default Radio\n"],"names":["useInterface","_jsx","Checkbox"],"mappings":"yTAQA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,KAAiB,EAAE,GAAoB,KAAI;AACvE,IAAA,IAAI,CAAC,IAAI,CAAC,GAAGA,iBAAY,CAAM,OAAO,EAAE,KAAK,EAAE,EAAE,CAAC;IAClD,OAAOC,cAAA,CAACC,aAAQ,EAAA,MAAA,CAAA,MAAA,CAAA,EACZ,SAAS,EAAED,cAAA,CAAC,SAAS,KAAG,EACxB,WAAW,EAAEA,cAAA,CAAC,WAAW,KAAG,EAAA,EACxB,IAAI,IACR,IAAI,EAAC,OAAO,EACZ,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,CAAC,OAAO,EAAE,IAAI,CAAA,IAAI,aAAJ,IAAI,KAAA,MAAA,GAAA,MAAA,GAAJ,IAAI,CAAE,UAAU,KAAI,EAAE,CAAC,CAAC,EAAA,CAAA,CACpD;AACN,CAAC"}
+{"version":3,"file":"index.js","sources":["../../src/Radio/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { useInterface } from '@xanui/core';\nimport CheckIcon from '@xanui/icons/RadioButtonChecked'\nimport UnCheckIcon from '@xanui/icons/RadioButtonUnchecked'\nimport Checkbox, { CheckboxProps } from '../Checkbox';\n\nexport type RadioProps = CheckboxProps\nconst Radio = React.forwardRef((props: RadioProps, ref?: React.Ref<any>) => {\n    let [rest] = useInterface<any>(\"Radio\", props, {})\n    return <Checkbox\n        checkIcon={<CheckIcon />}\n        uncheckIcon={<UnCheckIcon />}\n        {...rest}\n        type=\"radio\"\n        ref={ref}\n        classNames={['radio', ...(rest?.classNames || [])]}\n    />\n})\n\nexport default Radio\n"],"names":["useInterface","_jsx","Checkbox"],"mappings":";;;;;;;;;AAQA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,KAAiB,EAAE,GAAoB,KAAI;AACvE,IAAA,IAAI,CAAC,IAAI,CAAC,GAAGA,iBAAY,CAAM,OAAO,EAAE,KAAK,EAAE,EAAE,CAAC;IAClD,OAAOC,cAAA,CAACC,KAAQ,EAAA,MAAA,CAAA,MAAA,CAAA,EACZ,SAAS,EAAED,cAAA,CAAC,SAAS,KAAG,EACxB,WAAW,EAAEA,cAAA,CAAC,WAAW,KAAG,EAAA,EACxB,IAAI,IACR,IAAI,EAAC,OAAO,EACZ,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,CAAC,OAAO,EAAE,IAAI,CAAA,IAAI,aAAJ,IAAI,KAAA,MAAA,GAAA,MAAA,GAAJ,IAAI,CAAE,UAAU,KAAI,EAAE,CAAC,CAAC,EAAA,CAAA,CACpD;AACN,CAAC;;;;"}

package/Radio/index.mjs

@@ -1,4 +1,14 @@
-import {jsx}from'react/jsx-runtime';import React from'react';import {useInterface}from'@xanui/core';import CheckIcon from'@xanui/icons/RadioButtonChecked';import UnCheckIcon from'@xanui/icons/RadioButtonUnchecked';import Checkbox from'../Checkbox/index.mjs';const Radio = React.forwardRef((props, ref) => {
+import { jsx } from 'react/jsx-runtime';
+import React from 'react';
+import { useInterface } from '@xanui/core';
+import CheckIcon from '@xanui/icons/RadioButtonChecked';
+import UnCheckIcon from '@xanui/icons/RadioButtonUnchecked';
+import Checkbox from '../Checkbox/index.mjs';
+
+const Radio = React.forwardRef((props, ref) => {
     let [rest] = useInterface("Radio", props, {});
     return jsx(Checkbox, Object.assign({ checkIcon: jsx(CheckIcon, {}), uncheckIcon: jsx(UnCheckIcon, {}) }, rest, { type: "radio", ref: ref, classNames: ['radio', ...((rest === null || rest === void 0 ? void 0 : rest.classNames) || [])] }));
-});export{Radio as default};//# sourceMappingURL=index.mjs.map
+});
+
+export { Radio as default };
+//# sourceMappingURL=index.mjs.map

package/Radio/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/Radio/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { useInterface } from '@xanui/core';\nimport CheckIcon from '@xanui/icons/RadioButtonChecked'\nimport UnCheckIcon from '@xanui/icons/RadioButtonUnchecked'\nimport Checkbox, { CheckboxProps } from '../Checkbox';\n\nexport type RadioProps = CheckboxProps\nconst Radio = React.forwardRef((props: RadioProps, ref?: React.Ref<any>) => {\n    let [rest] = useInterface<any>(\"Radio\", props, {})\n    return <Checkbox\n        checkIcon={<CheckIcon />}\n        uncheckIcon={<UnCheckIcon />}\n        {...rest}\n        type=\"radio\"\n        ref={ref}\n        classNames={['radio', ...(rest?.classNames || [])]}\n    />\n})\n\nexport default Radio\n"],"names":["_jsx"],"mappings":"kQAQA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,KAAiB,EAAE,GAAoB,KAAI;AACvE,IAAA,IAAI,CAAC,IAAI,CAAC,GAAG,YAAY,CAAM,OAAO,EAAE,KAAK,EAAE,EAAE,CAAC;IAClD,OAAOA,GAAA,CAAC,QAAQ,EAAA,MAAA,CAAA,MAAA,CAAA,EACZ,SAAS,EAAEA,GAAA,CAAC,SAAS,KAAG,EACxB,WAAW,EAAEA,GAAA,CAAC,WAAW,KAAG,EAAA,EACxB,IAAI,IACR,IAAI,EAAC,OAAO,EACZ,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,CAAC,OAAO,EAAE,IAAI,CAAA,IAAI,aAAJ,IAAI,KAAA,MAAA,GAAA,MAAA,GAAJ,IAAI,CAAE,UAAU,KAAI,EAAE,CAAC,CAAC,EAAA,CAAA,CACpD;AACN,CAAC"}
+{"version":3,"file":"index.mjs","sources":["../../src/Radio/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { useInterface } from '@xanui/core';\nimport CheckIcon from '@xanui/icons/RadioButtonChecked'\nimport UnCheckIcon from '@xanui/icons/RadioButtonUnchecked'\nimport Checkbox, { CheckboxProps } from '../Checkbox';\n\nexport type RadioProps = CheckboxProps\nconst Radio = React.forwardRef((props: RadioProps, ref?: React.Ref<any>) => {\n    let [rest] = useInterface<any>(\"Radio\", props, {})\n    return <Checkbox\n        checkIcon={<CheckIcon />}\n        uncheckIcon={<UnCheckIcon />}\n        {...rest}\n        type=\"radio\"\n        ref={ref}\n        classNames={['radio', ...(rest?.classNames || [])]}\n    />\n})\n\nexport default Radio\n"],"names":["_jsx"],"mappings":";;;;;;;AAQA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,KAAiB,EAAE,GAAoB,KAAI;AACvE,IAAA,IAAI,CAAC,IAAI,CAAC,GAAG,YAAY,CAAM,OAAO,EAAE,KAAK,EAAE,EAAE,CAAC;IAClD,OAAOA,GAAA,CAAC,QAAQ,EAAA,MAAA,CAAA,MAAA,CAAA,EACZ,SAAS,EAAEA,GAAA,CAAC,SAAS,KAAG,EACxB,WAAW,EAAEA,GAAA,CAAC,WAAW,KAAG,EAAA,EACxB,IAAI,IACR,IAAI,EAAC,OAAO,EACZ,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,CAAC,OAAO,EAAE,IAAI,CAAA,IAAI,aAAJ,IAAI,KAAA,MAAA,GAAA,MAAA,GAAJ,IAAI,CAAE,UAAU,KAAI,EAAE,CAAC,CAAC,EAAA,CAAA,CACpD;AACN,CAAC;;;;"}

package/Scrollbar/index.js

@@ -1,4 +1,12 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:true});var tslib=require('tslib'),jsxRuntime=require('react/jsx-runtime'),core=require('@xanui/core'),React=require('react');const Scrollbar = React.forwardRef((_a, ref) => {
+"use client";
+'use strict';
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@xanui/core');
+var React = require('react');
+
+const Scrollbar = React.forwardRef((_a, ref) => {
     var { children } = _a, rest = tslib.__rest(_a, ["children"]);
     let [_b] = core.useInterface("Scrollbar", rest, {}), { onScroll, onScrollEnd } = _b, props = tslib.__rest(_b, ["onScroll", "onScrollEnd"]);
     const innerRef = React.useRef(null);
@@ -45,4 +53,7 @@
             width: "100%",
             overflow: "auto",
         }, children: children })));
-});exports.default=Scrollbar;//# sourceMappingURL=index.js.map
+});
+
+module.exports = Scrollbar;
+//# sourceMappingURL=index.js.map

package/Scrollbar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/Scrollbar/index.tsx"],"sourcesContent":["\"use client\";\n\nimport { Tag, TagComponentType, TagProps, useInterface } from '@xanui/core';\nimport React, { ReactNode, UIEvent, useImperativeHandle, useRef } from 'react'\n\nexport type ScrollbarProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n    children?: ReactNode;\n    onScrollEnd?: (e: UIEvent<HTMLDivElement>) => void;\n}\n\nexport type ScrollbarHandle = {\n    scrollTo: (pos: number) => void;\n    scrollToBottom: () => void;\n    scrollToTop: () => void;\n};\n\nconst Scrollbar = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: ScrollbarProps<T>, ref: React.Ref<ScrollbarHandle>) => {\n    let [{ onScroll, onScrollEnd, ...props }] = useInterface<any>(\"Scrollbar\", rest, {})\n    const innerRef = useRef<HTMLDivElement>(null);\n\n    useImperativeHandle(ref, () => ({\n        scrollTo(pos: number) {\n            innerRef.current?.scrollTo({\n                top: pos,\n                behavior: \"smooth\"\n            });\n        },\n        scrollToBottom() {\n            if (!innerRef.current) return;\n            const ele = innerRef.current;\n            ele.scrollTo({\n                top: ele.scrollHeight,\n                behavior: \"smooth\"\n            });\n        },\n        scrollToTop() {\n            innerRef.current?.scrollTo({\n                top: 0,\n                behavior: \"smooth\"\n            });\n        }\n    }));\n\n    if (onScroll || onScrollEnd) {\n        props.onScroll = (e: UIEvent<HTMLDivElement>) => {\n            if (onScrollEnd) {\n                const ele: any = e.target\n                const scrollTop = ele.scrollTop\n                const scrollHeight = ele.scrollHeight\n                const clientHeight = ele.clientHeight\n                const isScrollDown = scrollHeight - scrollTop <= clientHeight + 1\n                isScrollDown && onScrollEnd(e)\n            }\n            onScroll && onScroll(e)\n        }\n    }\n\n    return (\n        <Tag\n            {...props}\n            ref={innerRef}\n            baseClass='scrollbar'\n            sxr={{\n                height: \"100%\",\n                width: \"100%\",\n                overflow: \"auto\",\n            }}\n        >\n            {children}\n        </Tag>\n    )\n})\n\nexport default Scrollbar "],"names":["__rest","useInterface","useRef","useImperativeHandle","_jsx","Tag"],"mappings":"4LAgBA,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAwC,EAAE,GAA+B,KAAI;AAA7E,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA8B,EAAzB,IAAI,GAAAA,YAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;IACvF,IAAI,CAAA,EAAA,CAAA,GAAwCC,iBAAY,CAAM,WAAW,EAAE,IAAI,EAAE,EAAE,CAAC,EAA/E,EAAE,QAAQ,EAAE,WAAW,EAAA,GAAA,EAAY,EAAP,KAAK,GAAAD,YAAA,CAAA,EAAA,EAAjC,CAAA,UAAA,EAAA,aAAA,CAAmC,CAA4C;AACpF,IAAA,MAAM,QAAQ,GAAGE,YAAM,CAAiB,IAAI,CAAC;AAE7C,IAAAC,yBAAmB,CAAC,GAAG,EAAE,OAAO;AAC5B,QAAA,QAAQ,CAAC,GAAW,EAAA;;AAChB,YAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC;AACvB,gBAAA,GAAG,EAAE,GAAG;AACR,gBAAA,QAAQ,EAAE;AACb,aAAA,CAAC;QACN,CAAC;QACD,cAAc,GAAA;YACV,IAAI,CAAC,QAAQ,CAAC,OAAO;gBAAE;AACvB,YAAA,MAAM,GAAG,GAAG,QAAQ,CAAC,OAAO;YAC5B,GAAG,CAAC,QAAQ,CAAC;gBACT,GAAG,EAAE,GAAG,CAAC,YAAY;AACrB,gBAAA,QAAQ,EAAE;AACb,aAAA,CAAC;QACN,CAAC;QACD,WAAW,GAAA;;AACP,YAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC;AACvB,gBAAA,GAAG,EAAE,CAAC;AACN,gBAAA,QAAQ,EAAE;AACb,aAAA,CAAC;QACN;AACH,KAAA,CAAC,CAAC;AAEH,IAAA,IAAI,QAAQ,IAAI,WAAW,EAAE;AACzB,QAAA,KAAK,CAAC,QAAQ,GAAG,CAAC,CAA0B,KAAI;YAC5C,IAAI,WAAW,EAAE;AACb,gBAAA,MAAM,GAAG,GAAQ,CAAC,CAAC,MAAM;AACzB,gBAAA,MAAM,SAAS,GAAG,GAAG,CAAC,SAAS;AAC/B,gBAAA,MAAM,YAAY,GAAG,GAAG,CAAC,YAAY;AACrC,gBAAA,MAAM,YAAY,GAAG,GAAG,CAAC,YAAY;gBACrC,MAAM,YAAY,GAAG,YAAY,GAAG,SAAS,IAAI,YAAY,GAAG,CAAC;AACjE,gBAAA,YAAY,IAAI,WAAW,CAAC,CAAC,CAAC;YAClC;AACA,YAAA,QAAQ,IAAI,QAAQ,CAAC,CAAC,CAAC;AAC3B,QAAA,CAAC;IACL;AAEA,IAAA,QACIC,cAAA,CAACC,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,KAAK,EAAA,EACT,GAAG,EAAE,QAAQ,EACb,SAAS,EAAC,WAAW,EACrB,GAAG,EAAE;AACD,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,KAAK,EAAE,MAAM;AACb,YAAA,QAAQ,EAAE,MAAM;SACnB,EAAA,QAAA,EAEA,QAAQ,EAAA,CAAA,CACP;AAEd,CAAC"}
+{"version":3,"file":"index.js","sources":["../../src/Scrollbar/index.tsx"],"sourcesContent":["\"use client\";\n\nimport { Tag, TagComponentType, TagProps, useInterface } from '@xanui/core';\nimport React, { ReactNode, UIEvent, useImperativeHandle, useRef } from 'react'\n\nexport type ScrollbarProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n    children?: ReactNode;\n    onScrollEnd?: (e: UIEvent<HTMLDivElement>) => void;\n}\n\nexport type ScrollbarHandle = {\n    scrollTo: (pos: number) => void;\n    scrollToBottom: () => void;\n    scrollToTop: () => void;\n};\n\nconst Scrollbar = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: ScrollbarProps<T>, ref: React.Ref<ScrollbarHandle>) => {\n    let [{ onScroll, onScrollEnd, ...props }] = useInterface<any>(\"Scrollbar\", rest, {})\n    const innerRef = useRef<HTMLDivElement>(null);\n\n    useImperativeHandle(ref, () => ({\n        scrollTo(pos: number) {\n            innerRef.current?.scrollTo({\n                top: pos,\n                behavior: \"smooth\"\n            });\n        },\n        scrollToBottom() {\n            if (!innerRef.current) return;\n            const ele = innerRef.current;\n            ele.scrollTo({\n                top: ele.scrollHeight,\n                behavior: \"smooth\"\n            });\n        },\n        scrollToTop() {\n            innerRef.current?.scrollTo({\n                top: 0,\n                behavior: \"smooth\"\n            });\n        }\n    }));\n\n    if (onScroll || onScrollEnd) {\n        props.onScroll = (e: UIEvent<HTMLDivElement>) => {\n            if (onScrollEnd) {\n                const ele: any = e.target\n                const scrollTop = ele.scrollTop\n                const scrollHeight = ele.scrollHeight\n                const clientHeight = ele.clientHeight\n                const isScrollDown = scrollHeight - scrollTop <= clientHeight + 1\n                isScrollDown && onScrollEnd(e)\n            }\n            onScroll && onScroll(e)\n        }\n    }\n\n    return (\n        <Tag\n            {...props}\n            ref={innerRef}\n            baseClass='scrollbar'\n            sxr={{\n                height: \"100%\",\n                width: \"100%\",\n                overflow: \"auto\",\n            }}\n        >\n            {children}\n        </Tag>\n    )\n})\n\nexport default Scrollbar "],"names":[],"mappings":";;;;;;;;AAgBA;AAAwE;;AAEpE;AAEA;AACI;;AACI;AACI;AACA;AACH;;;;;AAID;;;AAGI;AACH;;;;AAGD;AACI;AACA;AACH;;AAER;AAED;AACI;;AAEQ;AACA;AACA;AACA;;AAEA;;AAEJ;AACJ;;AAGJ;AAMY;AACA;AACA;;AAMhB;;"}

package/Scrollbar/index.mjs

@@ -1,4 +1,10 @@
-import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import {useInterface,Tag}from'@xanui/core';import React,{useRef,useImperativeHandle}from'react';const Scrollbar = React.forwardRef((_a, ref) => {
+"use client";
+import { __rest } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+import { useInterface, Tag } from '@xanui/core';
+import React, { useRef, useImperativeHandle } from 'react';
+
+const Scrollbar = React.forwardRef((_a, ref) => {
     var { children } = _a, rest = __rest(_a, ["children"]);
     let [_b] = useInterface("Scrollbar", rest, {}), { onScroll, onScrollEnd } = _b, props = __rest(_b, ["onScroll", "onScrollEnd"]);
     const innerRef = useRef(null);
@@ -45,4 +51,7 @@ import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import {useInterf
             width: "100%",
             overflow: "auto",
         }, children: children })));
-});export{Scrollbar as default};//# sourceMappingURL=index.mjs.map
+});
+
+export { Scrollbar as default };
+//# sourceMappingURL=index.mjs.map