@zuzjs/ui 0.10.5 → 0.10.7

package/dist/esm/comps/KeyboardKeys/index.js

@@ -1,33 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useMemo } from "react";
-import { Variant } from "../../types/enums";
-import Box from "../Box";
-import Span from "../Span";
-import { isKeyCombination, KeysLabelMap, KeysMap } from "./types";
-const KeyBoardKeys = forwardRef(({ children, keys, variant }, ref) => {
-    const _meta = useMemo(() => {
-        if (isKeyCombination(keys)) {
-            let c = null;
-            let ks = String(keys).split(`+`)
-                .reduce((pa, ca, i, nxt) => {
-                if (nxt[i + 1]) {
-                    pa.push(ca);
-                }
-                else
-                    c = ca.toUpperCase();
-                return pa;
-            }, []);
-            return {
-                keys: ks,
-                children: c
-            };
-        }
-        return {
-            keys,
-            children: String(children).toUpperCase()
-        };
-    }, [keys]);
-    return _jsxs(Box, { as: `--keyboard-keys --${variant || Variant.Small} flex aic`, children: [(Array.isArray(_meta.keys) ? _meta.keys : [_meta.keys]).map((k) => _jsx("abbr", { title: KeysLabelMap[k], children: KeysMap[k] }, k)), _jsx(Span, { children: _meta?.children ?? children })] });
-});
-KeyBoardKeys.displayName = `Zuz.KeyboardKeys`;
-export default KeyBoardKeys;

package/dist/esm/comps/KeyboardKeys/types.d.ts

@@ -1,13 +0,0 @@
-import { ReactNode } from "react";
-import { Variant } from "../../types/enums";
-import { BoxProps } from "../Box";
-export type KeyboardKey = "command" | "shift" | "ctrl" | "option" | "enter" | "delete" | "escape" | "tab" | "capslock" | "up" | "right" | "down" | "left" | "pageup" | "pagedown" | "home" | "end" | "help" | "space" | "fn" | "win" | "alt";
-export type KeyCombination = `${KeyboardKey}+${KeyboardKey | string}`;
-export declare const isKeyCombination: (value: KeyboardKey | KeyboardKey[] | KeyCombination) => value is KeyCombination;
-export declare const KeysMap: Record<KeyboardKey, string>;
-export declare const KeysLabelMap: Record<KeyboardKey, string>;
-export type KeyboardKeyProps = BoxProps & {
-    keys: KeyboardKey | KeyboardKey[] | KeyCombination;
-    children?: ReactNode;
-    variant?: Variant;
-};

package/dist/esm/comps/KeyboardKeys/types.js

@@ -1,51 +0,0 @@
-export const isKeyCombination = (value) => {
-    return typeof value === "string" && value.includes("+");
-};
-export const KeysMap = {
-    command: "⌘",
-    shift: "⇧",
-    ctrl: "⌃",
-    option: "⌥",
-    enter: "↵",
-    delete: "⌫",
-    escape: "⎋",
-    tab: "⇥",
-    capslock: "⇪",
-    up: "↑",
-    right: "→",
-    down: "↓",
-    left: "←",
-    pageup: "⇞",
-    pagedown: "⇟",
-    home: "↖",
-    end: "↘",
-    help: "?",
-    space: "␣",
-    fn: "Fn",
-    win: "⌘",
-    alt: "⌥",
-};
-export const KeysLabelMap = {
-    command: "Command",
-    shift: "Shift",
-    ctrl: "Control",
-    option: "Option",
-    enter: "Enter",
-    delete: "Delete",
-    escape: "Escape",
-    tab: "Tab",
-    capslock: "Caps Lock",
-    up: "Up",
-    right: "Right",
-    down: "Down",
-    left: "Left",
-    pageup: "Page Up",
-    pagedown: "Page Down",
-    home: "Home",
-    end: "End",
-    help: "Help",
-    space: "Space",
-    fn: "Fn",
-    win: "Win",
-    alt: "Alt",
-};

package/dist/esm/comps/Label/index.d.ts

@@ -1,4 +0,0 @@
-import { Props } from '../../types';
-export type LabelProps = Props<`label`> & {};
-declare const Label: import("react").ForwardRefExoticComponent<import("../..").ZuzProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref">, keyof import("../..").ZuzProps> & import("react").RefAttributes<HTMLLabelElement>>;
-export default Label;

package/dist/esm/comps/Label/index.js

@@ -1,9 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-import { useBase } from '../../hooks';
-const Label = forwardRef((props, ref) => {
-    const { style, className, rest } = useBase(props);
-    return _jsx("label", { ref: ref, style: style, className: className, ...rest });
-});
-Label.displayName = `Zuz.Label`;
-export default Label;

package/dist/esm/comps/List/index.d.ts

@@ -1,10 +0,0 @@
-import { Size } from "../../types/enums";
-declare const List: import("react").ForwardRefExoticComponent<import("../..").ZuzProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, "ref"> | Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref">, keyof import("../..").ZuzProps> & {
-    size?: Size;
-    variant?: import("../..").Variant;
-    items: import("./types").ListItem[];
-    direction?: "cols" | "rows";
-    seperator?: import("react").ReactNode;
-    ol?: boolean;
-} & import("react").RefAttributes<HTMLOListElement | HTMLUListElement>>;
-export default List;

package/dist/esm/comps/List/index.js

@@ -1,22 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { MD5 } from "@zuzjs/core";
-import { createElement, forwardRef, Fragment, isValidElement } from "react";
-import { useBase } from "../../hooks";
-import { Size } from "../../types/enums";
-import Item from "./item";
-const List = forwardRef((props, ref) => {
-    const { items, size, direction, seperator, ol, ...pops } = props;
-    const { className, style, rest } = useBase(pops);
-    const Tag = ol == true ? 'ol' : 'ul';
-    return createElement(Tag, {
-        className: `--list --${size || Size.Small} flex ${direction ?? `cols`} ${className}`.trim(),
-        style, ref,
-        ...rest,
-        children: items.map((item, index, _items) => {
-            const _key = `${typeof item == `string` ? `li-${String(item)}` : isValidElement(item) ? `li-${item.key}` || `${index}-${MD5(item.toString())}` : item.label}-${index}`;
-            return _jsxs(Fragment, { children: [_jsx(Item, { meta: item }), seperator && _items[index + 1] ? _jsx("li", { className: `--list-seperator`, children: seperator }, `spt-${index + 1}-${_key}`) : null] }, _key);
-        })
-    });
-});
-List.displayName = `Zuz.List`;
-export default List;

package/dist/esm/comps/List/item.d.ts

@@ -1,8 +0,0 @@
-import { type ListItem } from "./types";
-declare const Item: {
-    (props: {
-        meta: ListItem;
-    }): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export default Item;

package/dist/esm/comps/List/item.js

@@ -1,21 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { isValidElement } from "react";
-import { useBase, useDelayed } from "../../hooks";
-const Item = (props) => {
-    const { meta } = props;
-    const mounted = useDelayed();
-    const { label, ...pops } = isValidElement(meta) ? {} : meta;
-    const { className, style, rest } = useBase({
-        ...pops,
-        ...(pops.animate ? { animate: {
-                ...pops.animate,
-                when: mounted
-            } } : {})
-    });
-    if (isValidElement(meta)) {
-        return _jsx("li", { style: style, className: className, children: meta });
-    }
-    return _jsx("li", { style: style, className: className, ...rest, children: typeof meta == `string` ? meta : label });
-};
-Item.displayName = `Zuz.ListItem`;
-export default Item;

package/dist/esm/comps/List/types.d.ts

@@ -1,21 +0,0 @@
-import { ReactNode } from "react";
-import { Props } from "../../types";
-import { Size, Variant } from "../../types/enums";
-import { animationProps } from "../../types/interfaces";
-export type ListItemObject = {
-    icon?: ReactNode;
-    label?: ReactNode;
-    action?: ReactNode;
-    className?: string;
-    animate?: animationProps;
-    onClick?: (event: any) => void;
-};
-export type ListItem = Props<`li`> & (ReactNode | ListItemObject);
-export type ListProps = Props<`ul` | `ol`> & {
-    size?: Size;
-    variant?: Variant;
-    items: ListItem[];
-    direction?: "cols" | "rows";
-    seperator?: ReactNode;
-    ol?: boolean;
-};

package/dist/esm/comps/List/types.js

@@ -1 +0,0 @@
-export {};

package/dist/esm/comps/Network/index.d.ts

@@ -1,7 +0,0 @@
-import { Size } from "../../types/enums";
-declare const NetworkManager: import("react").ForwardRefExoticComponent<import("..").BoxProps & {
-    size?: Size;
-    offlineMessage?: string;
-    onlineMessage?: string;
-} & import("react").RefAttributes<HTMLDivElement>>;
-export default NetworkManager;

package/dist/esm/comps/Network/index.js

@@ -1,21 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { useNetworkStatus } from "../../hooks";
-import { ALERT, Size, TRANSITION_CURVES } from "../../types/enums";
-import Box from "../Box";
-import SVGIcons from "../svgicons";
-import Text from "../Text";
-const NetworkManager = forwardRef((props, ref) => {
-    const isOnline = useNetworkStatus();
-    const { onlineMessage, offlineMessage, size } = props;
-    return _jsxs(Box, { fx: {
-            from: { x: `-50%`, y: 200, opacity: 0 },
-            to: { x: `-50%`, y: 0, opacity: 1 },
-            when: isOnline == false,
-            curve: TRANSITION_CURVES.Spring,
-            duration: 0.5,
-            delay: 2
-        }, className: `--network-manager --${isOnline == true ? `online` : `offline`} --${size || Size.Small} fixed flex`, children: [_jsx(Box, { className: `--ico`, children: isOnline ? SVGIcons[ALERT.Success] : SVGIcons[ALERT.Error] }), _jsx(Text, { as: `--message`, children: isOnline ? onlineMessage || `internet connection restored :)` : offlineMessage || `no internet connection` })] });
-});
-NetworkManager.displayName = `Zuz.NetWorkManager`;
-export default NetworkManager;

package/dist/esm/comps/Network/types.d.ts

@@ -1,7 +0,0 @@
-import { Size } from "../../types/enums";
-import { BoxProps } from "../Box";
-export type NetworkManagerprops = BoxProps & {
-    size?: Size;
-    offlineMessage?: string;
-    onlineMessage?: string;
-};

package/dist/esm/comps/Network/types.js

@@ -1 +0,0 @@
-export {};

package/dist/esm/comps/Overlay/index.d.ts

@@ -1,8 +0,0 @@
-import { BoxProps } from "../Box";
-export type OverlayProps = BoxProps & {
-    when?: boolean;
-};
-export declare const Overlay: import("react").ForwardRefExoticComponent<BoxProps & {
-    when?: boolean;
-} & import("react").RefAttributes<HTMLDivElement>>;
-export default Overlay;

package/dist/esm/comps/Overlay/index.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { TRANSITIONS } from "../../types/enums";
-import Box from "../Box";
-export const Overlay = forwardRef((props, ref) => {
-    const { when, ...pops } = props;
-    return _jsx(Box, { ref: ref, "aria-hidden": !when, className: `--overlay fixed fill`, animate: {
-            transition: TRANSITIONS.FadeIn,
-            when,
-        }, ...pops });
-});
-Overlay.displayName = `Zuz.Overlay`;
-export default Overlay;

package/dist/esm/comps/Pagination/index.d.ts

@@ -1,17 +0,0 @@
-import { PaginationStyle } from "./types";
-declare const Pagination: import("react").ForwardRefExoticComponent<import("..").BoxProps & {
-    itemCount: number;
-    itemsPerPage: number;
-    startPage?: number | string;
-    pageRange?: number;
-    paginationStyle?: PaginationStyle;
-    hash?: number | null;
-    seperator?: string;
-    loading?: boolean;
-    breakLabel?: string;
-    nextLabel?: string;
-    prevLabel?: string;
-    renderOnZeroPageCount?: boolean;
-    onPageChange?: import("./types").PaginationCallback;
-} & import("react").RefAttributes<HTMLDivElement>>;
-export default Pagination;

package/dist/esm/comps/Pagination/index.js

@@ -1,63 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useCallback, useMemo, useState } from "react";
-import { numberInRange, toHash } from "../..";
-import { useBase } from "../../hooks";
-import Box from "../Box";
-import Button from "../Button";
-import SVGIcons from "../svgicons";
-import { PaginationStyle } from "./types";
-const Pagination = forwardRef((props, ref) => {
-    const { itemCount, itemsPerPage, startPage, pageRange, paginationStyle, breakLabel, prevLabel, nextLabel, hash, loading, seperator, renderOnZeroPageCount, onPageChange, ...pops } = props;
-    const _hashKey = useMemo(() => toHash(numberInRange(4, 8)), []);
-    const _hash = useCallback((input) => `${toHash(input, hash || 6, _hashKey)}${seperator || ``}${_hashKey}`, [_hashKey]);
-    const _breakLabel = useMemo(() => breakLabel || `...`, [breakLabel]);
-    const [_currentPage, setCurrentPage] = useState({
-        id: hash ?
-            startPage ? `number` == typeof startPage ? _hash(startPage) : startPage
-                : 1 : startPage || 1,
-        label: startPage || 1
-    });
-    /**
-     * @internal
-     * const _pageType = useMemo(() => startPage ? `number` === startPage, [breakLabel])
-     */
-    const { style, className, rest } = useBase(pops);
-    const getPageValue = useCallback((p) => {
-        return (`number` === typeof p ? p : +p.label);
-    }, []);
-    if (!itemCount)
-        throw new Error(`"itemCount" prop is required`);
-    const totalPages = useMemo(() => Math.ceil(itemCount / itemsPerPage), [itemCount, itemsPerPage]);
-    const pages = useMemo(() => {
-        const _pages = [];
-        const prevs = Math.max(getPageValue(_currentPage) - (pageRange || 2), 1);
-        const nexts = Math.min(getPageValue(_currentPage) + (pageRange || 2), totalPages);
-        if (prevs > 1)
-            _pages.push({ id: hash ? _hash(1) : 1, label: 1 });
-        if (prevs > 2)
-            _pages.push({ id: -1, label: _breakLabel });
-        for (let i = prevs; i <= nexts; i++)
-            _pages.push({ id: hash ? _hash(i) : i, label: i });
-        if (nexts < totalPages - 1)
-            _pages.push({ id: -1, label: _breakLabel });
-        if (nexts < totalPages)
-            _pages.push({ id: hash ? _hash(totalPages) : totalPages, label: totalPages });
-        return _pages;
-    }, [_currentPage]);
-    const handlePage = useCallback((_newPage) => {
-        const newPage = _newPage;
-        if (+newPage.label < 1 || +newPage.label > totalPages)
-            return;
-        setCurrentPage(newPage);
-        onPageChange?.(newPage);
-    }, [itemCount, itemsPerPage, _currentPage]);
-    if (pages.length <= 1 && ((renderOnZeroPageCount == undefined ? false : renderOnZeroPageCount) === false))
-        return null;
-    return _jsxs(Box, { ref: ref, as: `--pagination --pgt-${paginationStyle || PaginationStyle.Table} flex aic w:100% jcc ${className}`, children: [_jsx(Box, { as: `flex flex:1 aic --pgt-btns`, children: (pages.length > 1 ? pages : [{ id: 1, label: 1 }, { id: -1, label: _breakLabel }]).map((page, index, items) => _jsx(Button, { disabled: page.id == -1 || getPageValue(_currentPage) == +page.label, className: (`string` == typeof page ? page : page.label) == getPageValue(_currentPage) ? `--current-page` : ``, onClick: (ev) => handlePage(page), children: `string` == typeof page ? page : page.label }, `--pg-${index}-${page.id}`)) }), _jsx(Box, { as: `flex aic jcc flex:1 --pagination-label`, children: [
-                    `Showing ${(getPageValue(_currentPage) - 1) * itemsPerPage + 1} - `,
-                    `${Math.min(getPageValue(_currentPage) * itemsPerPage, itemCount)} of ${itemCount} items`
-                ].join(` `) }), _jsxs(Box, { as: `flex aic jce flex:1 --pgt-btns --pgt-nav`, children: [_jsx(Button, { disabled: getPageValue(_currentPage) <= 1, onClick: (ev) => handlePage({ id: hash ? _hash(getPageValue(_currentPage) - 1) : getPageValue(_currentPage) - 1, label: getPageValue(_currentPage) - 1 }), children: SVGIcons.chevronLeftOutline }), _jsx(Button, { disabled: pages.length <= 1 || getPageValue(_currentPage) == getPageValue(pages[pages.length - 1]), onClick: (ev) => handlePage({ id: hash ? _hash(getPageValue(_currentPage) + 1) : getPageValue(_currentPage) + 1, label: getPageValue(_currentPage) + 1 }), children: SVGIcons.chevronRightOutline })] })] });
-});
-Pagination.displayName = `Zuz.Pagination`;
-export default Pagination;

package/dist/esm/comps/Pagination/types.d.ts

@@ -1,26 +0,0 @@
-import { BoxProps } from "../Box";
-export declare enum PaginationStyle {
-    Table = "table",
-    Gooey = "gooey"
-}
-export type PaginationPageItem = {
-    id: string | number;
-    label: string | number;
-};
-export type PaginationPage = number | PaginationPageItem;
-export type PaginationCallback = (page: PaginationPageItem) => void;
-export type PaginationProps = BoxProps & {
-    itemCount: number;
-    itemsPerPage: number;
-    startPage?: number | string;
-    pageRange?: number;
-    paginationStyle?: PaginationStyle;
-    hash?: number | null;
-    seperator?: string;
-    loading?: boolean;
-    breakLabel?: string;
-    nextLabel?: string;
-    prevLabel?: string;
-    renderOnZeroPageCount?: boolean;
-    onPageChange?: PaginationCallback;
-};

package/dist/esm/comps/Pagination/types.js

@@ -1,5 +0,0 @@
-export var PaginationStyle;
-(function (PaginationStyle) {
-    PaginationStyle["Table"] = "table";
-    PaginationStyle["Gooey"] = "gooey";
-})(PaginationStyle || (PaginationStyle = {}));

package/dist/esm/comps/Password/index.d.ts

@@ -1,8 +0,0 @@
-import { InputProps } from '../Input';
-export type PasswordProps = Omit<InputProps, `type` | `numeric`> & {
-    strenthMeter?: boolean;
-};
-declare const Password: import("react").ForwardRefExoticComponent<Omit<InputProps, "type" | "numeric"> & {
-    strenthMeter?: boolean;
-} & import("react").RefAttributes<HTMLInputElement>>;
-export default Password;

package/dist/esm/comps/Password/index.js

@@ -1,29 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useEffect, useMemo, useState } from 'react';
-import { checkPasswordStrength } from '../../funs';
-import { useBase, useDebounce } from '../../hooks';
-import Box from '../Box';
-import Button from '../Button';
-import Input from '../Input';
-import SVGIcons from '../svgicons';
-import Text from '../Text';
-const Password = forwardRef((props, ref) => {
-    const { strenthMeter, onChange, ...pops } = props;
-    if (`type` in pops) {
-        delete pops[`type`];
-    }
-    const { style, className, rest } = useBase(pops);
-    const [visible, setVisible] = useState(false);
-    const [passw, setPassw] = useState("");
-    const strenth = useMemo(() => checkPasswordStrength(passw), [passw]);
-    const debounce = useDebounce((ev) => {
-        if (strenthMeter)
-            setPassw(ev.target.value);
-        onChange && onChange(ev);
-    }, 100);
-    useEffect(() => { }, []);
-    return _jsxs(Box, { as: `w:100% flex cols`, children: [_jsxs(Box, { style: style, className: `--password flex aic rel`, children: [_jsx(Input, { ref: ref, type: visible ? 'text' : 'password', className: className, onChange: debounce, ...rest }), _jsx(Button, { tabIndex: -1, onClick: () => setVisible(prev => !prev), className: `--toggle flex aic jcc abs`, children: visible ? SVGIcons.eye : SVGIcons.eyeSlash })] }), strenthMeter && _jsxs(Box, { as: `flex aic --password-meter --pb-score-${strenth.score}`, style: style, children: [_jsxs(Box, { as: `--password-bars flex aic`, children: [_jsx(Box, { as: `--pbar ${strenth.score >= 1 ? `--pb-on` : ``}`.trim() }), _jsx(Box, { as: `--pbar ${strenth.score >= 2 ? `--pb-on` : ``}`.trim() }), _jsx(Box, { as: `--pbar ${strenth.score >= 3 ? `--pb-on` : ``}`.trim() }), _jsx(Box, { as: `--pbar ${strenth.score >= 4 ? `--pb-on` : ``}`.trim() }), _jsx(Box, { as: `--pbar ${strenth.score >= 5 ? `--pb-on` : ``}`.trim() })] }), _jsx(Text, { as: `--password-meter-label`, "aria-hidden": true, children: strenth.result })] })] });
-});
-Password.displayName = `Zuz.Password`;
-export default Password;

package/dist/esm/comps/PinInput/index.d.ts

@@ -1,18 +0,0 @@
-import { InputProps } from '../Input';
-export type PinInputProps = InputProps & {
-    mask?: boolean;
-    size?: number;
-    length?: number;
-};
-declare const PinInput: import("react").ForwardRefExoticComponent<import("../..").ZuzProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, keyof import("../..").ZuzProps> & {
-    numeric?: boolean;
-    size?: import("../..").Size;
-    variant?: import("../..").Variant;
-    with?: import("../..").FORMVALIDATION | `${import("../..").FORMVALIDATION}${string}`;
-    onConfirm?: (value: string) => void;
-} & {
-    mask?: boolean;
-    size?: number;
-    length?: number;
-} & import("react").RefAttributes<HTMLInputElement>>;
-export default PinInput;

package/dist/esm/comps/PinInput/index.js

@@ -1,48 +0,0 @@
-"use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, useEffect, useRef } from 'react';
-import { useBase } from '../../hooks';
-import Box from '../Box';
-import Input from '../Input';
-const PinInput = forwardRef((props, ref) => {
-    const { size, length, mask, ...pops } = props;
-    const inputs = useRef([]);
-    let name = `pinput`;
-    let required = false;
-    let _with = {};
-    if (`with` in pops) {
-        _with = { with: pops.with };
-        delete pops.with;
-    }
-    if (`type` in pops) {
-        delete pops.type;
-    }
-    if (`name` in pops) {
-        name = pops.name;
-        delete pops.name;
-    }
-    if (`required` in pops) {
-        required = true;
-        delete pops.required;
-    }
-    const { style } = useBase(pops);
-    const handleInput = (event) => {
-        const input = event.currentTarget;
-        const nextInput = inputs.current[parseInt(input.dataset.index) + 1];
-        const prevInput = inputs.current[parseInt(input.dataset.index) - 1];
-        if (input.value.length === 1 && nextInput) {
-            nextInput.focus();
-        }
-        else if (input.value.length === 0 && prevInput) {
-            prevInput.focus();
-        }
-    };
-    useEffect(() => {
-        inputs.current = inputs.current.slice(0, size || length);
-    }, [size || length]);
-    return _jsx(Box, { name: name, style: style, className: `--otp flex aic rel`, "data-required": required, "data-size": size || length || 4, ..._with, children: Array(size || length || 4).fill(1).map((a, i) => _jsx(Input, { autoComplete: "new-password", "data-index": i, ref: (el) => {
-                inputs.current[i] = el;
-            }, numeric: true, onChange: handleInput, maxLength: 1, placeholder: mask ? `·` : `0`, type: mask ? `password` : 'text', ...pops }, `pin-${i}`)) });
-});
-PinInput.displayName = `Zuz.PinInput`;
-export default PinInput;

package/dist/esm/comps/ProgressBar/index.d.ts

@@ -1,8 +0,0 @@
-import { BoxProps } from "../Box";
-import { ProgressHandler } from "./types";
-declare const ProgressBar: import("react").ForwardRefExoticComponent<BoxProps & {
-    progress?: number;
-    type?: import("../..").PROGRESS;
-    animated?: boolean;
-} & import("react").RefAttributes<ProgressHandler>>;
-export default ProgressBar;

package/dist/esm/comps/ProgressBar/index.js

@@ -1,27 +0,0 @@
-"use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, useEffect, useImperativeHandle, useRef } from "react";
-import { useBase } from "../../hooks";
-import Box from "../Box";
-const ProgressBar = forwardRef((props, ref) => {
-    const { progress, type, animated, ...pops } = props;
-    const bar = useRef(null);
-    useImperativeHandle(ref, () => ({
-        setProgress: (p) => {
-            bar.current.style.width = `${p * 100}%`;
-        }
-    }), []);
-    useEffect(() => {
-        if (progress && bar.current) {
-            if (animated) {
-                setTimeout(() => bar.current.style.width = `${progress * 100}%`, 500);
-            }
-            else
-                bar.current.style.width = `${progress * 100}%`;
-        }
-    }, [progress, bar.current]);
-    const { className, style, rest } = useBase(pops);
-    return _jsx(Box, { className: `--progress ${animated ? `--animated` : ``} flex rel ${className}`.trim(), style: style, ...rest, children: _jsx(Box, { ref: bar, className: `--bar rel` }) });
-});
-ProgressBar.displayName = `Zuz.ProgressBar`;
-export default ProgressBar;

package/dist/esm/comps/ProgressBar/types.d.ts

@@ -1,10 +0,0 @@
-import { PROGRESS } from "../../types/enums";
-import { BoxProps } from "../Box";
-export type ProgressBarProps = BoxProps & {
-    progress?: number;
-    type?: PROGRESS;
-    animated?: boolean;
-};
-export interface ProgressHandler {
-    setProgress?: (p: number) => void;
-}

package/dist/esm/comps/ProgressBar/types.js

@@ -1 +0,0 @@
-export {};

package/dist/esm/comps/Radio/index.d.ts

@@ -1,8 +0,0 @@
-import { RADIO, Size } from "../../types/enums";
-import { RadioHandler } from "./types";
-declare const Radio: import("react").ForwardRefExoticComponent<import("../..").ZuzProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, keyof import("../..").ZuzProps> & {
-    type?: RADIO;
-    size?: Size;
-    onSwitch?: (checked: boolean, value: string | number | readonly string[]) => void;
-} & import("react").RefAttributes<RadioHandler>>;
-export default Radio;

package/dist/esm/comps/Radio/index.js

@@ -1,19 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useRef, useState } from "react";
-import { RADIO, Size } from "../../types/enums";
-import Box from "../Box";
-import Input from "../Input";
-import Label from "../Label";
-const Radio = forwardRef((props, _ref) => {
-    const { children, className, name, required, type, value, size, checked: defaultCheck, onSwitch, ...pops } = props;
-    const [checked, _setChecked] = useState(defaultCheck || false);
-    const bRef = useRef(null);
-    return _jsxs(Label, { className: `${className} --${(type || RADIO.Default).toLowerCase()} --radio${!type || type == RADIO.Default ? `` : `card`} --${size || Size.Default} flex aic rel`.trim(), ...pops, children: [_jsx(Input, { ...{}, ref: bRef, defaultChecked: checked, value: value || `rd`, type: `radio`, className: `abs`, name: name, required: required || false, onChange: (e) => {
-                    if (onSwitch)
-                        onSwitch(e.target.checked, value || `cb`);
-                    _setChecked(e.target.checked);
-                } }), _jsx(Box, { className: `--dot rel`, children: _jsx(Box, { className: `--rod abs abc` }) }), _jsx(Box, { className: `--value`, children: children })] });
-});
-Radio.displayName = `Zuz.Radio`;
-export default Radio;

package/dist/esm/comps/Radio/types.d.ts

@@ -1,11 +0,0 @@
-import { Props } from "../../types";
-import { RADIO, Size } from "../../types/enums";
-export type RadioProps = Props<"input"> & {
-    type?: RADIO;
-    size?: Size;
-    onSwitch?: (checked: boolean, value: string | number | readonly string[]) => void;
-};
-export interface RadioHandler {
-    setChecked: (mode: boolean, triggerChange?: boolean) => void;
-    toggle: (triggerChange?: boolean) => void;
-}

package/dist/esm/comps/Radio/types.js

@@ -1 +0,0 @@
-export {};

package/dist/esm/comps/ScrollView/index.d.ts

@@ -1,5 +0,0 @@
-declare const ScrollView: import("react").ForwardRefExoticComponent<import("..").BoxProps & {
-    style?: import("react").CSSProperties;
-    speed?: number;
-} & import("react").RefAttributes<HTMLDivElement>>;
-export default ScrollView;

package/dist/esm/comps/ScrollView/index.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { useBase, useScrollbar } from "../../hooks";
-import Box from "../Box";
-const ScrollView = forwardRef((props, ref) => {
-    const { speed, style: _style, ...pops } = props;
-    const { rootRef, containerRef, thumbY, thumbX, onScrollY, onScrollX } = useScrollbar(speed || 1);
-    const { style, className, rest } = useBase(pops);
-    return _jsxs(Box, { ref: rootRef, className: className.trim(), as: `--scrollview rel`, children: [_jsx(Box, { as: `--scroll-content`, ref: containerRef, style: _style || {}, children: rest.children }), _jsx(Box, { as: `--scroll-track --track-y --abs`, children: _jsx(Box, { as: `--scroll-thumb --abs`, ref: thumbY, onMouseDown: onScrollY }) }), _jsx(Box, { as: `--scroll-track --track-x --abs`, children: _jsx(Box, { as: `--scroll-thumb --abs`, ref: thumbX, onMouseDown: onScrollX }) })] });
-});
-ScrollView.displayName = `Zuz.ScrollView`;
-export default ScrollView;

package/dist/esm/comps/ScrollView/types.d.ts

@@ -1,6 +0,0 @@
-import { CSSProperties } from "react";
-import { BoxProps } from "../Box";
-export type ScrollViewProps = BoxProps & {
-    style?: CSSProperties;
-    speed?: number;
-};

package/dist/esm/comps/ScrollView/types.js

@@ -1 +0,0 @@
-export {};