@zuzjs/ui 0.10.6 → 0.10.8

package/dist/esm/index.d.ts

@@ -1,9 +0,0 @@
-export * from "./comps";
-export { withCSS as css } from "./funs";
-export * from "./funs";
-export { default as PubSub } from "./funs/events";
-export * from "./hooks";
-export * from "./types";
-export * from "./types/enums";
-export * from "./types/interfaces";
-export { default as SVGIcons } from "./comps/svgicons";

package/dist/esm/index.js

@@ -1,10 +0,0 @@
-String.prototype.trim = function () { return this.replace(/^\s+|\s+$/g, '').replace(/\s+/g, ' '); };
-export * from "./comps";
-export { withCSS as css } from "./funs";
-export * from "./funs";
-export { default as PubSub } from "./funs/events";
-export * from "./hooks";
-export * from "./types";
-export * from "./types/enums";
-export * from "./types/interfaces";
-export { default as SVGIcons } from "./comps/svgicons";

package/dist/esm/src/bin.d.ts

@@ -1,2 +0,0 @@
-#!/usr/bin/env node
-export {};

package/dist/esm/src/bin.js

@@ -1,173 +0,0 @@
-#!/usr/bin/env node
-import fs, { readdirSync, statSync } from "fs";
-import { program } from "commander";
-import chokidar from 'chokidar';
-import path from "path";
-import CSS from "./funs/css.js";
-import pc from "picocolors";
-import { FIELNAME_KEY } from "./funs/index.js";
-program
-    .option(`-d, --debug`)
-    .option(`-v, --version`)
-    .option(`-r, --root <char>`)
-    .option(`-f, --file <char>`)
-    .option(`-l, --lexer`)
-    .option(`-c, --classes`)
-    .option(`-h, --cache`)
-    .option(`-e, --cleaned`)
-    .option(`-t, --sheet`)
-    .option(`-m, --media`)
-    .option(`-s, --dark`);
-program.parse();
-const options = program.opts();
-// extendGlobals()
-const getAllFiles = (dir, extn, files, result, regex) => {
-    files = files || readdirSync(dir);
-    result = result || [];
-    regex = regex || new RegExp(`^(?!.*[/\\\\]node_modules[/\\\\]).*\\${extn}$`);
-    for (let i = 0; i < files.length; i++) {
-        let file = path.join(dir, files[i]);
-        if (statSync(file).isDirectory()) {
-            try {
-                result = getAllFiles(file, extn, readdirSync(file), result, regex);
-            }
-            catch (error) {
-                continue;
-            }
-        }
-        else {
-            if (regex.test(file)) {
-                result.push(file);
-            }
-        }
-    }
-    return result;
-};
-const rebuild = (f) => {
-    const raw = fs.readFileSync(f, `utf8`);
-    let _filePath = path.relative(process.cwd(), f);
-    if (!_filePath.startsWith(`/`))
-        _filePath = `/${_filePath}`;
-    const list = [`${FIELNAME_KEY}:${_filePath}`];
-    const processMatch = (matches, type) => {
-        const makeV2 = (v1) => {
-            let v2 = v1
-                .trim()
-                .slice(1, -1);
-            if (v2.includes(`\n`)) {
-                v2 = v2.split(`\n`).reduce((arr, v) => {
-                    if (v.trim() != ``) {
-                        v = v.trim().endsWith(`,`) ? v.slice(0, -1) : v;
-                        arr.push(v.trim());
-                    }
-                    return arr;
-                }, []).join(` `);
-                // 
-            }
-            if (v2.startsWith(`[`) && v2.endsWith(`]`))
-                v2 = v2.slice(1, -1);
-            return v2.trim();
-        };
-        if (matches && matches.length > 0) {
-            matches.map((m) => {
-                let v2;
-                // m = m.replace(/\s+|\n/gm, ` `)
-                if (type == `as`) {
-                    const [x, v1] = m.split(/as\s*=/);
-                    v2 = makeV2(v1);
-                }
-                else if (type == `css`) {
-                    const v1 = m.split(/css\s*\(/)[1].slice(0, -1);
-                    // console.log(v1)
-                    v2 = makeV2(v1.trim());
-                }
-                // console.log(`v2 ->`, `"${v2}"`)
-                list.push(v2);
-            });
-        }
-    };
-    /**
-     * match as={?}
-     */
-    // processMatch(raw.match(/as\s*=\s*\{([^{}]|{([^{}]|{[^{}]*})*})*\}/g), `as`)
-    processMatch(raw.match(/as\s*=\s*(?:\{([^{}]|{([^{}]|{[^{}]*})*})*\}|'([^']*)'|"([^"]*)")/g), `as`);
-    /**
-     * match css()
-     */
-    processMatch(raw.match(/css\(\s*(?:\[\s*([\s\S]*?)\s*\]|\s*`([\s\S]*?)`)\s*\)/g), `css`);
-    return list;
-};
-const rebuildAll = () => {
-    console.log(pc.gray(`○ Building Zuz CSS`));
-    const cssBuilder = new CSS({}, options);
-    const files = getAllFiles(process.cwd(), `.(jsx|tsx)`);
-    if (files.length > 0) {
-        const as = [];
-        if (options.file) {
-            const r = rebuild(files.filter(f => f.endsWith(options.file.replace(path.resolve(`./`), ``)))[0]);
-            if (r && r.length > 0) {
-                // console.log(r)
-                as.push(cssBuilder.Build([r], true, options.file).sheet);
-                // as.push(r)
-            }
-        }
-        else {
-            const mediaQueries = {};
-            let darkQueries = {};
-            files.map(f => {
-                // if ( f.endsWith(`header.jsx`) ){
-                const r = rebuild(f);
-                if (r && r.length > 0) {
-                    // as.push(cssBuilder.Build([r], true).sheet)
-                    // as.push( f.endsWith(`header.jsx`) ?
-                    //  `.header{${cssBuilder.Build([r], true).sheet}}`
-                    //  : cssBuilder.Build([r], true).sheet)
-                    const _built = cssBuilder.Build([r], true, f.replace(path.resolve(`./`), ``));
-                    as.push(_built.sheet);
-                    darkQueries = { ...darkQueries, ..._built.darkQueries };
-                    Object.keys(_built.mediaQuery).map(mq => {
-                        if (!mediaQueries[mq])
-                            mediaQueries[mq] = [];
-                        mediaQueries[mq] = [
-                            ...mediaQueries[mq],
-                            ..._built.mediaQuery[mq]
-                        ];
-                    });
-                    // as.push(new CSS().Build([[r]], true).sheet)
-                }
-                // }
-                // as.push(r)
-            });
-            as.push(cssBuilder.buildMediaQueries(mediaQueries));
-            as.push(cssBuilder.buildDarkModeQueries(darkQueries));
-        }
-        // console.log(as)
-        // const { sheet } = new CSS().Build(as, true)
-        // console.log(cache)
-        const sheet = as.join(`\n`);
-        if (!fs.existsSync(path.join(process.cwd(), `src`, `app`, `css`))) {
-            fs.mkdirSync(path.join(process.cwd(), `src`, `app`, `css`));
-        }
-        // console.log(sheet)
-        fs.writeFileSync(path.join(process.cwd(), `src`, `app`, `css`, `zuz.scss`), sheet, {
-            encoding: `utf8`,
-            flag: `w+`
-        });
-        console.log(pc.green(`✓ Zuz CSS Generated`));
-    }
-    else {
-        console.log(pc.red(`⨯ No tsx | jsx file found`));
-    }
-};
-const watchPaths = [
-    `${path.resolve(`./`)}/**/*.jsx`,
-    `${path.resolve(`./`)}/**/*.tsx`,
-];
-const watcher = chokidar.watch(watchPaths, {
-    ignored: (p) => p.includes(`/dist`) || p.includes('node_modules'),
-    persistent: true,
-    usePolling: true
-});
-if (options.file)
-    console.log(pc.gray(`○ Watching ${options.file}`));
-watcher.on(`change`, rebuildAll);

package/dist/esm/src/comps/Accordion/index.d.ts

@@ -1,6 +0,0 @@
-import { AccordionHandler } from "./types";
-declare const Accordion: import("react").ForwardRefExoticComponent<import("..").BoxProps & {
-    message?: string | import("react").ReactNode;
-    title: string | import("react").ReactNode | import("react").ReactNode[];
-} & import("react").RefAttributes<AccordionHandler>>;
-export default Accordion;

package/dist/esm/src/comps/Accordion/index.js

@@ -1,13 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useState } from "react";
-import Box from "../Box";
-import Text from "../Text";
-import SVGIcons from "../svgicons";
-import Button from "../Button";
-const Accordion = forwardRef((props, ref) => {
-    const { title, message, ...rest } = props;
-    const [visible, setVisible] = useState(false);
-    return _jsxs(Box, { className: `--accordion flex cols`, ...rest, children: [_jsxs(Button, { onClick: (e) => setVisible(!visible), className: `--toggle flex aic ${visible ? `--open` : ``}`.trim(), children: [_jsx(Text, { className: `--label flex`, children: title }), _jsx(Box, { className: `--arrow flex`, children: visible ? SVGIcons.arrowUp : SVGIcons.arrowDown })] }), visible && _jsx(Box, { className: `--detail`, children: message })] });
-});
-export default Accordion;

package/dist/esm/src/comps/Accordion/types.d.ts

@@ -1,10 +0,0 @@
-import { ReactNode } from "react";
-import { BoxProps } from "../Box";
-export type AccordionProps = BoxProps & {
-    message?: string | ReactNode;
-    title: string | ReactNode | ReactNode[];
-};
-export interface AccordionHandler {
-    open: () => void;
-    close: () => void;
-}

package/dist/esm/src/comps/Accordion/types.js

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

package/dist/esm/src/comps/Actionbar/index.d.ts

@@ -1,23 +0,0 @@
-import { BoxProps } from "../Box";
-import { ActionBarHandler } from "./types";
-import { Position } from "../../types/enums";
-/**
- * ActionBar renders a list of buttons with tooltips.
- *
- * @example
- * ```tsx
- * const items = [
- *   { label: 'Edit', icon: <EditIcon />, onClick: () => console.log('Edit clicked') },
- *   { label: 'Delete', icon: <DeleteIcon />, onClick: () => console.log('Delete clicked') }
- * ];
- *
- * <ActionBar items={items} />
- * ```
- */
-declare const ActionBar: import("react").ForwardRefExoticComponent<BoxProps & {
-    selected?: number | string;
-    onSwitch?: (tag: string) => void;
-    items: import("./types").ActionBarItem[];
-    position?: Position;
-} & import("react").RefAttributes<ActionBarHandler>>;
-export default ActionBar;

package/dist/esm/src/comps/Actionbar/index.js

@@ -1,62 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useCallback, useEffect, useRef, useState } from "react";
-import Box from "../Box";
-import { useBase } from "../../hooks";
-import ActionItem from "./item";
-import { Position } from "../../types/enums";
-/**
- * ActionBar renders a list of buttons with tooltips.
- *
- * @example
- * ```tsx
- * const items = [
- *   { label: 'Edit', icon: <EditIcon />, onClick: () => console.log('Edit clicked') },
- *   { label: 'Delete', icon: <DeleteIcon />, onClick: () => console.log('Delete clicked') }
- * ];
- *
- * <ActionBar items={items} />
- * ```
- */
-const ActionBar = forwardRef((props, ref) => {
-    const { items, name, selected, position, ...pops } = props;
-    const self = useRef(null);
-    const [_selected, setSelected] = useState(selected || items[0].tag || 0);
-    const track = useCallback(({ x, y }) => {
-        if (self.current) {
-            const bounds = self.current.getBoundingClientRect();
-            document.documentElement.style.setProperty(`--tip-x`, `${x - bounds.left}`);
-            document.documentElement.style.setProperty(`--tip-y`, `${y - bounds.top}`);
-            document.documentElement.style.setProperty(`--tip-s`, `1`);
-        }
-    }, []);
-    const tear = useCallback(() => {
-        if (self.current) {
-            self.current.removeEventListener(`pointerleave`, tear);
-            self.current.removeEventListener(`pointermove`, track);
-            document.documentElement.style.setProperty(`--tip-s`, `0`);
-        }
-    }, []);
-    const initTrack = useCallback(() => {
-        if (self.current) {
-            self.current.addEventListener(`pointerleave`, tear);
-            self.current.addEventListener(`pointermove`, track);
-        }
-    }, []);
-    useEffect(() => {
-        if (self.current) {
-            document.documentElement.style.setProperty(`--tip-w`, items.reduce((longest, item) => {
-                return item.label.length > longest.length ? item.label : longest;
-            }, '').length.toString());
-            document.documentElement.style.setProperty(`--tip-s`, `0`);
-            document.documentElement.style.setProperty(`--tip-l`, `${items.length}`);
-            self.current?.addEventListener(`pointerenter`, initTrack);
-        }
-    }, []);
-    const { className, style, rest } = useBase(pops);
-    return _jsxs(Box, { ref: self, style: style, className: [
-            `--actionbar flex aic ${className}`,
-            `${!position || position == Position.Auto ? `rel` : `--${position}`}`
-        ].join(` `).trim(), ...rest, children: [items.map((item, index) => _jsx(ActionItem, { selected: _selected === item.tag || selected == index, ...item, idx: index }, `actionbar-action-${item.label.toLowerCase().replace(/\s+/g, `-`)}`)), _jsx(Box, { className: `--tip abs`, children: _jsx(Box, { className: `--track flex aic`, children: items.map(({ label }) => _jsx(Box, { className: `--lb`, children: label }, `tool-tip-${label.toLowerCase().replace(/\s+/g, `-`)}`)) }) })] });
-});
-export default ActionBar;

package/dist/esm/src/comps/Actionbar/item.d.ts

@@ -1,6 +0,0 @@
-import { ActionBarItem } from './types';
-declare const ActionItem: ({ label, icon, onClick, idx, selected }: ActionBarItem & {
-    idx: number;
-    selected?: boolean;
-}) => import("react/jsx-runtime").JSX.Element;
-export default ActionItem;

package/dist/esm/src/comps/Actionbar/item.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import Button from '../Button';
-import Icon from '../Icon';
-const ActionItem = ({ label, icon, onClick, idx, selected }) => {
-    return _jsx(Button, { onClick: onClick, onMouseMove: e => document.documentElement.style.setProperty(`--tip-m`, `${idx}`), className: `--action ${selected ? `--selected` : ``} aic jcc rel`.trim(), children: typeof icon == `string` ? _jsx(Icon, { name: icon }) : icon });
-};
-export default ActionItem;

package/dist/esm/src/comps/Actionbar/types.d.ts

@@ -1,32 +0,0 @@
-import { ReactNode } from "react";
-import { BoxProps } from "../Box";
-import { Position } from "../../types/enums";
-export interface ActionBarHandler {
-    show: () => void;
-}
-/**
- * Represents an item in the ActionBar.
- */
-export interface ActionBarItem {
-    /** Specific tag for action item */
-    tag?: string;
-    /** The label of the action item */
-    label: string;
-    /** The icon to display for the action item */
-    icon: ReactNode;
-    /** The callback function to execute when the action item is clicked */
-    onClick: () => void;
-}
-/**
- * Props for the ActionBar component.
- */
-export type ActionBarProps = BoxProps & {
-    /** The index of the initially selected action item */
-    selected?: number | string;
-    /** Callback function to execute when an action item is clicked */
-    onSwitch?: (tag: string) => void;
-    /** Array of action items to display in the ActionBar */
-    items: ActionBarItem[];
-    /** Position of ActionBar */
-    position?: Position;
-};

package/dist/esm/src/comps/Actionbar/types.js

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

package/dist/esm/src/comps/Alert/index.d.ts

@@ -1,11 +0,0 @@
-import { AlertHandler } from "./types";
-import { ALERT } from "../../types/enums";
-import { BoxProps } from "../Box";
-declare const Alert: import("react").ForwardRefExoticComponent<BoxProps & {
-    type?: ALERT;
-    icon?: string;
-    iconSize?: number;
-    message?: string;
-    title: string;
-} & import("react").RefAttributes<AlertHandler>>;
-export default Alert;

package/dist/esm/src/comps/Alert/index.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { useBase } from "../../hooks";
-import { ALERT } from "../../types/enums";
-import Box from "../Box";
-import SVGIcons from "../svgicons";
-import Text from "../Text";
-const Alert = forwardRef((props, ref) => {
-    const { type, icon, title, message, iconSize, ...pops } = props;
-    const { className, style, rest } = useBase(pops);
-    return _jsxs(Box, { className: `--alert --${(type || ALERT.Info)} flex aic ${className}`.trim(), style: style, ...rest, children: [_jsx(Box, { className: `--icon icon-${icon || `auto-matic`}`, style: iconSize ? { width: iconSize, height: iconSize } : {}, children: !icon && SVGIcons[type || ALERT.Info] }), _jsxs(Box, { className: `--meta flex cols`, children: [_jsx(Text, { className: `--title ${message ? `--tm` : ``}`, children: title || `Lorem ipsum dolor sit amet, consectetur adipiscing elit.` }), message && _jsx(Text, { className: `--message`, h: 2, children: message })] })] });
-});
-export default Alert;

package/dist/esm/src/comps/Alert/types.d.ts

@@ -1,13 +0,0 @@
-import { ALERT } from "../../types/enums";
-import { BoxProps } from "../Box";
-export type AlertProps = BoxProps & {
-    type?: ALERT;
-    icon?: string;
-    iconSize?: number;
-    message?: string;
-    title: string;
-};
-export interface AlertHandler {
-    open: () => void;
-    close: () => void;
-}

package/dist/esm/src/comps/Alert/types.js

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

package/dist/esm/src/comps/AutoComplete/index.d.ts

@@ -1,12 +0,0 @@
-import { Size } from "../../types/enums";
-declare const AutoComplete: import("react").ForwardRefExoticComponent<import("../..").ZuzProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, keyof import("../..").ZuzProps> & {
-    numeric?: boolean;
-    size?: Size;
-    variant?: import("../..").Variant;
-    with?: import("../..").FORMVALIDATION;
-} & {
-    action?: string;
-    data?: string[];
-    withStyle?: string;
-} & import("react").RefAttributes<HTMLDivElement>>;
-export default AutoComplete;

package/dist/esm/src/comps/AutoComplete/index.js

@@ -1,174 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useEffect, useMemo, useRef, useState } from "react";
-import { useBase, useDebounce } from "../../hooks";
-import Box from "../Box";
-import { Size, TRANSITION_CURVES, TRANSITIONS } from "../../types/enums";
-import Input from "../Input";
-import SVGIcons from "../svgicons";
-import { clamp, isArray, uuid, withPost } from "../../funs";
-import List from "../List";
-const AutoComplete = forwardRef((props, ref) => {
-    const { animate, action, data, withStyle, onChange, ...pops } = props;
-    const { className: autoCompleteStyle } = useBase({ as: withStyle || `` });
-    const { style } = useBase(pops);
-    const [choosing, setChoosing] = useState(false);
-    const [items, setItems] = useState(data || []);
-    const innerRef = useRef(null);
-    const autoRef = useRef(null);
-    const suggestionRef = useRef(null);
-    const _id = useMemo(() => pops.name || uuid(), []);
-    const [highlightedIndex, setHighlightedIndex] = useState(null);
-    const [lastQuery, setLastQuery] = useState(null);
-    const [lastSuggestions, setLastSuggestions] = useState([]);
-    const handleChange = (e) => {
-        if (e.target.value == ``) {
-            setChoosing(false);
-            setItems([]);
-        }
-        else if (action && e.target.value.trim() != ``) {
-            withPost(action, { query: e.target.value })
-                .then((resp) => {
-                if (`items` in resp && isArray(resp.items)) {
-                    setItems(resp.items);
-                    setLastQuery(e.target.value);
-                    setLastSuggestions(resp.items);
-                }
-                else {
-                    console.error(`Action Response should contain items array`);
-                }
-                setHighlightedIndex(null);
-            })
-                .catch((err) => {
-                setHighlightedIndex(null);
-                setItems([]);
-            });
-        }
-    };
-    const debounce = useDebounce(handleChange, 250);
-    const handlePosition = () => {
-        if (autoRef.current) {
-            const boundingBox = autoRef.current.getBoundingClientRect();
-            const spaceBelow = window.innerHeight - boundingBox.bottom;
-            const spaceAbove = boundingBox.top;
-            if (suggestionRef.current) {
-                const suggestionList = suggestionRef.current;
-                if (spaceBelow < suggestionList.offsetHeight && spaceAbove > spaceBelow) {
-                    suggestionList.style.top = 'auto';
-                    suggestionList.style.bottom = `${boundingBox.height}px`;
-                    suggestionList.style.maxHeight = `${spaceAbove - 150}px`;
-                }
-                else {
-                    suggestionList.style.top = `${boundingBox.height + 5}px`;
-                    suggestionList.style.bottom = 'auto';
-                    suggestionList.style.maxHeight = `${spaceBelow - 150}px`;
-                }
-            }
-        }
-    };
-    const handleKeyDown = (e) => {
-        if (items.length > 0) {
-            if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {
-                e.preventDefault();
-                e.stopPropagation();
-            }
-            if (e.key === 'Escape') {
-                setHighlightedIndex(null);
-                setChoosing(false);
-                setItems([]);
-            }
-            else if (e.key === 'ArrowDown') {
-                setHighlightedIndex((prevIndex) => {
-                    const newIndex = prevIndex === null || prevIndex === items.length - 1 ? 0 : prevIndex + 1;
-                    updateInputValue(newIndex);
-                    return newIndex;
-                });
-            }
-            else if (e.key === 'ArrowUp') {
-                setHighlightedIndex((prevIndex) => {
-                    const newIndex = prevIndex === null || prevIndex === 0 ? items.length - 1 : prevIndex - 1;
-                    updateInputValue(newIndex);
-                    return newIndex;
-                });
-            }
-            else if (e.key === 'Enter' && highlightedIndex !== null) {
-                const selectedItem = items[highlightedIndex];
-                if (innerRef.current) {
-                    innerRef.current.value = selectedItem;
-                    setChoosing(false);
-                    setItems([]);
-                    // if (onChange) {
-                    //     onChange(selectedItem);
-                    // }
-                }
-            }
-        }
-    };
-    const handleMouseSelect = (item) => {
-        if (innerRef.current) {
-            innerRef.current.value = item;
-            setChoosing(false);
-            setItems([]);
-            // if (onChange) {
-            //     onChange(item);
-            // }
-        }
-    };
-    const updateInputValue = (index) => {
-        const selectedItem = items[index];
-        if (selectedItem && innerRef.current) {
-            innerRef.current.value = selectedItem;
-            // Move cursor to the end of the input value
-            innerRef.current.setSelectionRange(selectedItem.length, selectedItem.length);
-        }
-        // Auto-scroll the suggestion list to the selected index
-        if (suggestionRef.current) {
-            const suggestionList = suggestionRef.current;
-            const selectedItemElement = suggestionList.children[index];
-            if (selectedItemElement) {
-                selectedItemElement.scrollIntoView({ block: 'nearest' });
-            }
-        }
-    };
-    const handleClickOutside = (event) => {
-        if (autoRef.current && !autoRef.current.contains(event.target)) {
-            setChoosing(false);
-            setItems([]);
-        }
-    };
-    const handleFocus = () => {
-        if (innerRef.current && innerRef.current.value === lastQuery) {
-            setItems(lastSuggestions);
-            setHighlightedIndex(null); // Reset highlighted index
-            handlePosition();
-        }
-    };
-    useEffect(() => {
-        window.addEventListener('resize', handlePosition);
-        window.addEventListener('scroll', handlePosition, true);
-        document.addEventListener('mousedown', handleClickOutside);
-        return () => {
-            window.removeEventListener('resize', handlePosition);
-            window.removeEventListener('scroll', handlePosition, true);
-            document.removeEventListener('mousedown', handleClickOutside);
-        };
-    }, []);
-    useEffect(() => {
-        handlePosition();
-    }, [items]);
-    return _jsxs(Box, { style: style, ref: autoRef, className: `--autocomplete --${props.size || Size.Small} flex aic rel ${autoCompleteStyle}`.trim(), children: [_jsx(Input, { ref: innerRef, autoComplete: "off", onChange: debounce, onKeyDown: handleKeyDown, onFocus: handleFocus, ...pops }), _jsx(Box, { className: `--arrow rel flex aic jcc`, children: items.length > 0 ? SVGIcons.arrowUp : SVGIcons.arrowDown }), items.length > 0 && _jsx(List, { id: _id, ref: suggestionRef, className: `--suggestion-list flex cols abs`, items: items.map((item, index) => ({
-                    label: item,
-                    onClick: (e) => {
-                        e.preventDefault();
-                        e.stopPropagation();
-                        handleMouseSelect(item);
-                    },
-                    className: highlightedIndex === index ? '--current' : '',
-                    animate: {
-                        transition: TRANSITIONS.SlideInBottom,
-                        curve: TRANSITION_CURVES.EaseInOut,
-                        delay: clamp(0.02 * index, 0.02, 0.5)
-                    }
-                })) })] });
-});
-export default AutoComplete;

package/dist/esm/src/comps/AutoComplete/types.d.ts

@@ -1,6 +0,0 @@
-import { InputProps } from "../Input";
-export type AutoCompleteProps = InputProps & {
-    action?: string;
-    data?: string[];
-    withStyle?: string;
-};

package/dist/esm/src/comps/AutoComplete/types.js

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

package/dist/esm/src/comps/Avatar/index.d.ts

@@ -1,12 +0,0 @@
-import { AVATAR } from "../../types/enums";
-import { AvatarHandler } from "./types";
-declare const Avatar: import("react").ForwardRefExoticComponent<import("../..").ZuzProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref">, keyof import("../..").ZuzProps> & {
-    type?: AVATAR;
-    size?: number;
-    variant?: import("../..").Variant;
-    src?: string;
-    color?: string;
-    crossOrigin?: "anonymous" | "use-credentials";
-    referrerPolicy?: "no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url";
-} & import("react").RefAttributes<AvatarHandler>>;
-export default Avatar;