@zuzjs/ui 0.5.6 → 0.5.8

package/dist/comps/animate.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import With from "./base";
-const Animate = forwardRef((props, ref) => {
-    const { as, ...rest } = props;
-    return _jsx(With, { as: as, ...rest, ref: ref });
-});
-export default Animate;

package/dist/comps/avatar.d.ts

@@ -1,13 +0,0 @@
-import { BaseProps } from "../types/interfaces";
-import { AVATAR } from "../types/enums";
-export interface AvatarProps {
-    type?: AVATAR;
-    size?: number;
-    src: 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';
-}
-export interface AvatarHandler {
-}
-declare const Avatar: import("react").ForwardRefExoticComponent<AvatarProps & BaseProps & import("react").RefAttributes<AvatarHandler>>;
-export default Avatar;

package/dist/comps/avatar.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { AVATAR } from "../types/enums";
-import With from "./base";
-import { useImage } from "../hooks";
-const Avatar = forwardRef((props, ref) => {
-    const { src, size, type, crossOrigin, referrerPolicy, ...rest } = props;
-    const [img, imgStatus, imgError] = useImage(src, crossOrigin, referrerPolicy);
-    return _jsx(With, { tag: `img`, src: img, style: size ? { width: size, height: size } : {}, crossOrigin: crossOrigin, referrerPolicy: referrerPolicy, className: `--avatar --${(type || AVATAR.Circle).toLowerCase()}`, ...rest });
-});
-export default Avatar;

package/dist/comps/base.d.ts

@@ -1,15 +0,0 @@
-import { ComponentPropsWithoutRef, ElementType } from "react";
-import { SHIMMER } from "../types/enums";
-import { animationProps, Skeleton } from "../types/interfaces";
-interface BaseProps<T extends ElementType> {
-    tag?: T;
-    as?: string | string[];
-    animate?: animationProps;
-    className?: string;
-    propsToRemove?: string[];
-    skeleton?: Skeleton;
-    shimmer?: SHIMMER;
-}
-export type Props<T extends ElementType> = BaseProps<T> & Omit<ComponentPropsWithoutRef<T>, keyof BaseProps<T>>;
-declare const With: import("react").ForwardRefExoticComponent<Omit<Props<ElementType>, "ref"> & import("react").RefAttributes<Element>>;
-export default With;

package/dist/comps/base.js

@@ -1,68 +0,0 @@
-import { createElement, forwardRef } from "react";
-import { css, cleanProps } from "../funs";
-import { buildWithStyles, getAnimationCurve, getAnimationTransition } from "../funs/css";
-const buildSkeletonStyle = (s) => {
-    const makeValue = (v, unit = `px`) => {
-        return v ?
-            `string` == typeof v ? v : `${v}${unit}`
-            : `inherit`;
-    };
-    const style = {};
-    if (s.radius) {
-        style.borderRadius = makeValue(s.radius);
-    }
-    if (s.size) {
-        style.width = style.minWidth = style.maxWidth = style.height = style.minHeight = style.maxHeight = makeValue(s.size);
-    }
-    else if (s.width || s.height) {
-        if (s.width) {
-            style.width = style.minWidth = style.maxWidth = makeValue(s.width);
-        }
-        if (s.height) {
-            style.height = style.minHeight = style.maxHeight = makeValue(s.height);
-        }
-    }
-    else {
-        style.minWidth = style.minHeight = `100%`;
-    }
-    return style;
-};
-const With = forwardRef(({ tag, as, animate, className, propsToRemove, style, skeleton, ...rest }, ref) => {
-    const Comp = tag || 'div';
-    let cx = [];
-    if (as) {
-        cx = css().Build(`string` == typeof as ? as : as.join(` `)).cx;
-    }
-    const { transition, from, to, when, duration, delay, curve } = animate || {};
-    let _style = {};
-    const _transition = transition || (from && to) ? { transition: `all ${duration || `0.2`}s ${getAnimationCurve(curve)} ${delay || 0}s` } : {};
-    if (undefined === when) {
-        _style = transition ? getAnimationTransition(transition, true) : { ...from, ...to };
-    }
-    else if (true === when) {
-        _style = transition ? getAnimationTransition(transition, false) : { ...(to || {}) };
-    }
-    else {
-        _style = transition ? getAnimationTransition(transition, false, true) : from || {};
-    }
-    const { children, shimmer, ...restProps } = cleanProps(rest, propsToRemove ? [...propsToRemove, `skeleton`] : [`skeleton`]);
-    return createElement(Comp, {
-        style: {
-            ...buildWithStyles(_style),
-            ..._transition,
-            ...style,
-            ...(skeleton?.enabled ? buildSkeletonStyle(skeleton) : {})
-        },
-        className: [
-            className,
-            ...cx,
-            skeleton?.enabled ? `--skeleton` : ``,
-            shimmer ? `--shimmer --${shimmer.toLowerCase()}` : ``,
-        ].join(' ').trim(),
-        children: skeleton?.enabled ? ` `.repeat(6)
-            : children,
-        ...restProps,
-        ref
-    });
-});
-export default With;

package/dist/comps/box.d.ts

@@ -1,6 +0,0 @@
-import { Props } from "./useBase/base.types";
-export interface BoxProps extends Props<'div'> {
-    name?: string;
-}
-declare const Box: import("react").ForwardRefExoticComponent<BoxProps & import("react").RefAttributes<HTMLDivElement>>;
-export default Box;

package/dist/comps/box.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import useBase from "./useBase";
-const Box = forwardRef((props, ref) => {
-    const { style, ...pops } = props;
-    const { className, style: _style, rest } = useBase(pops);
-    return _jsx("div", { ref: ref, className: className, style: {
-            ..._style,
-            ...(style || {})
-        }, ...rest });
-});
-export default Box;

package/dist/comps/button.d.ts

@@ -1,7 +0,0 @@
-import { Props } from "./useBase/base.types";
-export interface ButtonProps extends Props<`button`> {
-    icon?: string;
-    withLabel?: boolean;
-}
-declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
-export default Button;

package/dist/comps/button.js

@@ -1,19 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
-// import With, { Props } from "./base";
-import useBase from "./useBase";
-const Button = forwardRef((props, ref) => {
-    const { icon, children, withLabel, ...pops } = props;
-    const { className, style, rest } = useBase(pops);
-    return _jsxs("button", { className: `${className} flex aic ${icon ? `ico-btn` : ``}`, style: style, ref: ref, ...rest, children: [icon && _jsx("div", { ...{ className: `icon-${icon}` } }), undefined == withLabel || withLabel == true ?
-                _jsx("span", { ...{ className: `b-label` }, children: children })
-                : children] });
-});
-// const Button = forwardRef<HTMLButtonElement, ButtonProps>((props, ref ) => {
-//     const { as, icon, ...rest } = props;
-//     return <With tag={`button`} as={as} className={`flex aic ${icon ? `ico-btn` : ``}`.trim()} {...rest} ref={ref}>
-//         {icon && <With className={`icon-${icon}`} />}
-//         <With tag={`span`} className={`b-label`}>{props.children}</With>
-//     </With>
-// });
-export default Button;

package/dist/comps/checkbox.d.ts

@@ -1,18 +0,0 @@
-import { CHECKBOX } from "../types/enums";
-import { animationProps } from "../types/interfaces";
-export interface CheckboxProps {
-    as?: string;
-    type?: CHECKBOX;
-    required?: boolean;
-    name?: string;
-    value?: string;
-    checked?: boolean;
-    onChange?: (checked: boolean, value: string | string[]) => void;
-    animate?: animationProps;
-}
-export interface CheckboxHandler {
-    setChecked: (mode: boolean, triggerChange?: boolean) => void;
-    toggle: (triggerChange?: boolean) => void;
-}
-declare const CheckBox: import("react").ForwardRefExoticComponent<CheckboxProps & import("react").RefAttributes<CheckboxHandler>>;
-export default CheckBox;

package/dist/comps/contextmenu.d.ts

@@ -1,15 +0,0 @@
-import { animationProps } from "../types/interfaces";
-export interface ContextMenuItem {
-    label: string;
-    labelColor?: string;
-    icon?: string;
-    iconColor?: string;
-    className?: string;
-    onSelect: () => void;
-}
-declare const ContextMenu: import("react").ForwardRefExoticComponent<{
-    as?: string;
-    items: ContextMenuItem[];
-    animate?: animationProps;
-} & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-export default ContextMenu;

package/dist/comps/contextmenu.js

@@ -1,9 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import With from "./base";
-const ContextMenu = forwardRef((props, ref) => {
-    const { as, items, ...rest } = props;
-    return _jsx(With, { as: as, className: `context-menu abs flex cols`, ...rest, ref: ref, children: items.map((item, index) => item.label == `-` ? _jsx(With, { as: `context-line` }, `${index}-line`) :
-            _jsxs(With, { onClick: item.onSelect, as: `button`, className: `context-menu-item flex aic ${item.className || ``}`.trim(), children: [_jsx(With, { as: `div`, className: `ico icon-${item.icon}`.trim(), style: item.iconColor ? { color: item.iconColor } : {} }), _jsx(With, { as: `h1`, className: `flex aic`, style: item.labelColor ? { color: item.labelColor } : {}, children: item.label })] }, `item-${item.label.replace(/\s/g, `-`)}-${index}`)) });
-});
-export default ContextMenu;

package/dist/comps/cover.d.ts

@@ -1,15 +0,0 @@
-import { ComponentPropsWithoutRef } from "react";
-import { SpinnerProps } from "./spinner";
-import { animationProps } from "../types/interfaces";
-export interface CoverProps extends ComponentPropsWithoutRef<`div`> {
-    tag?: string;
-    message?: string;
-    spinner?: SpinnerProps;
-    color?: string;
-    as?: string;
-    animate?: animationProps;
-    when?: boolean;
-    hideMessage?: boolean;
-}
-declare const Cover: import("react").ForwardRefExoticComponent<CoverProps & import("react").RefAttributes<HTMLDivElement>>;
-export default Cover;

package/dist/comps/cover.js

@@ -1,31 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import With from "./base";
-import Spinner from "./spinner";
-const Cover = forwardRef((props, ref) => {
-    const { spinner, message, color, as, when, hideMessage, ...rest } = props;
-    if (`when` in props && props.when == false) {
-        return null;
-    }
-    return (_jsxs(With, { className: `zuz-cover flex aic jcc cols abs fillx nope nous`, ref: ref, style: {
-            backgroundColor: `var(--cover-bg)`
-        }, as: as, ...rest, children: [_jsx(Spinner, { ...{
-                    ...spinner
-                } }), !hideMessage && _jsx(With, { tag: `h1`, className: `label`, style: { color: `var(--cover-label)` }, children: message || `loading` })] }));
-    // return (
-    //     <With 
-    //         className={`zuz-cover flex aic jcc cols abs fill nope nous`}
-    //         ref={ref} 
-    //         style={{
-    //             backgroundColor: color ? !color.startsWith(`#`) ? hexToRgba(color, .9) : color : hexToRgba(color || `var(--cover)`, .9)
-    //         }}    
-    //         as={as}
-    //         {...rest} 
-    //     >
-    //         {<Spinner {...spinner} />}
-    //         {<With tag={`h1`} className={`label`}>{message || `loading`}</With>}
-    //         {/* {message && <With tag={`h1`} className={`label`}>{message}</With>} */}
-    //     </With>
-    // );
-});
-export default Cover;

package/dist/comps/dialog.js

@@ -1 +0,0 @@
-"use strict";

package/dist/comps/editor.d.ts

@@ -1,12 +0,0 @@
-import { BaseProps } from "../types/interfaces";
-import { dynamicObject } from "../types";
-export interface EditorProps {
-    title: string;
-    attrs: dynamicObject;
-    element: string;
-}
-export interface EditorHandler {
-    show: () => void;
-}
-declare const ComponentEditor: import("react").ForwardRefExoticComponent<EditorProps & BaseProps & import("react").RefAttributes<EditorHandler>>;
-export default ComponentEditor;

package/dist/comps/editor.js

@@ -1,92 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useState } from "react";
-import With from "./base";
-import Pencil from "../media/edit-ui";
-import { TRANSITIONS } from "../types/enums";
-import Lexer from "../funs/lexer";
-import { copyToClipboard } from "../funs";
-import { useMounted } from "../hooks";
-const ComponentEditor = forwardRef((props, ref) => {
-    const [visible, setVisible] = useState(false);
-    const [code, setCode] = useState(false);
-    const { title, attrs, element } = props;
-    const mounted = useMounted(500);
-    const getVariable = (v) => {
-        // console.log(element!.current)
-        // const elm = document.querySelector(element!);
-        // return getComputedStyle(document.querySelector(element)!).getPropertyValue(`--${v}`).trim()
-        const a = getComputedStyle(document.querySelector(element)).getPropertyValue(`--${v}`).trim();
-        const b = getComputedStyle(document.body).getPropertyValue(`--${v}`).trim();
-        const d = getComputedStyle(document.documentElement).getPropertyValue(`--${v}`).trim();
-        return a || b || d;
-    };
-    const expandHex = (hex) => {
-        if (hex.length === 4) {
-            return `#${hex[1]}${hex[1]}${hex[2]}${hex[2]}${hex[3]}${hex[3]}`;
-        }
-        return hex;
-    };
-    const rangeSlider = (k, value, min, max, step, unit) => {
-        return _jsxs(_Fragment, { children: [_jsx(With, { tag: `input`, type: `range`, defaultValue: value, min: min, max: max, step: step, name: `editor-prop-range-${k}`, onChange: (e) => {
-                        // document.body.style.setProperty(`--${k}`,`${e.currentTarget.value}${unit || ``}`);
-                        document.querySelector(element).style.setProperty(`--${k}`, `${e.currentTarget.value}${unit || ``}`);
-                        document.querySelector(`input[name="editor-prop-num-${k}"]`).value = e.currentTarget.value;
-                    } }), _jsx(With, { tag: `input`, type: `number`, name: `editor-prop-num-${k}`, defaultValue: value, min: min, max: max, onChange: (e) => {
-                        document.querySelector(element).style.setProperty(`--${k}`, `${e.currentTarget.value}${unit || ``}`);
-                        // document.body.style.setProperty(`--${k}`,`${e.currentTarget.value}${unit || ``}`);
-                        document.querySelector(`input[name="editor-prop-range-${k}"]`).value = e.currentTarget.value;
-                    } })] });
-    };
-    const colorPicker = (k, value) => {
-        return _jsxs(_Fragment, { children: [_jsx(With, { tag: `input`, type: `color`, defaultValue: expandHex(value.toString()), name: `editor-prop-color-${k}`, onChange: (e) => {
-                        // document.body.style.setProperty(`--${k}`, e.currentTarget.value);
-                        document.querySelector(element).style.setProperty(`--${k}`, e.currentTarget.value);
-                        document.querySelector(`input[name="editor-prop-num-${k}"]`).value = e.currentTarget.value;
-                    } }), _jsx(With, { tag: `input`, name: `editor-prop-num-${k}`, defaultValue: expandHex(value.toString()), onChange: (e) => {
-                        document.querySelector(element).style.setProperty(`--${k}`, `${e.currentTarget.value}`);
-                        // document.body.style.setProperty(`--${k}`,`${e.currentTarget.value}px`);
-                        document.querySelector(`input[name="editor-prop-color-${k}"]`).value = e.currentTarget.value;
-                    } })] });
-    };
-    const build = (at) => {
-        const comps = [];
-        Object.keys(at)
-            .forEach((k) => {
-            if (k.startsWith('@group')) {
-                comps.push(_jsxs(With, { className: `group flex cols`, children: [_jsx(With, { tag: `h1`, as: `glabel`, children: at[k].label }), _jsx(With, { className: `gprops flex cols`, children: build(at[k].pops) })] }, `egroup-${k}`));
-            }
-            else {
-                const { label, value, min, max, type, step, unit } = Lexer(at[k]);
-                comps.push(_jsxs(With, { className: `prop flex aic`, children: [_jsxs(With, { className: `pop flex cols`, children: [_jsx(With, { tag: `h1`, as: `label`, children: label.split(`,`).join(` `) }), _jsx(With, { tag: `h1`, as: `l-k`, children: k })] }), _jsxs(With, { className: `pop flex aic`, children: [type == `range` && rangeSlider(k, value == `auto` ? parseFloat(getVariable(k)) : value, min, max, step || 1, unit), type == `color` && colorPicker(k, value == `auto` ? getVariable(k) : value)] })] }, `el-${k}-${label}`));
-            }
-        });
-        return comps;
-    };
-    const getCode = (at) => {
-        const c = [];
-        Object.keys(at)
-            .forEach((k) => {
-            if (k.startsWith('@group')) {
-                c.push(...getCode(at[k].pops));
-            }
-            else {
-                const { label, value, min, max, type, step, unit } = Lexer(at[k]);
-                c.push(`--${k}: ${value == `auto` ? type == `range` ? parseFloat(getVariable(k)) : getVariable(k) : value}${unit || ``};`);
-            }
-        });
-        return c; //.join(`\n`)
-    };
-    if (!mounted)
-        return null;
-    return _jsxs(With, { as: `comp-editor fixed`, children: [_jsx(With, { tag: `button`, as: `pencil`, onClick: (e) => setVisible(!visible), children: !visible ?
-                    _jsx(With, { tag: `img`, src: `data:image/png;base64,${Pencil}` })
-                    : _jsx(With, { tag: `span`, children: "\u00D7" }) }), _jsxs(With, { as: `editor-props fixed`, "aria-hidden": !visible, animate: {
-                    transition: TRANSITIONS.SlideInRight,
-                    when: visible,
-                    duration: 0.1,
-                }, children: [_jsxs(With, { as: `editor-head flex aic`, children: [_jsxs(With, { tag: `h1`, className: `head-label`, children: [title, " Editor"] }), _jsx(With, { className: `head-action`, children: _jsx(With, { tag: `button`, onClick: (e) => setCode(!code), children: code ? `Edit` : `Get Code` }) })] }), _jsx(With, { as: `editor-body flex cols rel`, children: code ? _jsxs(_Fragment, { children: [_jsx(With, { tag: `textarea`, children: getCode(attrs).join(`\n`) }), _jsx(With, { tag: `button`, className: `copy abs`, onClick: (e) => copyToClipboard(getCode(attrs).join(`\n`)).then(() => {
-                                        document.querySelector(`.comp-editor .editor-props .editor-body .copy`).textContent = `Copied`;
-                                        setTimeout(() => document.querySelector(`.comp-editor .editor-props .editor-body .copy`).textContent = `Copy`, 3000);
-                                    }), children: "Copy" })] }) : build(attrs) })] })] });
-});
-export default ComponentEditor;

package/dist/comps/grid/index.d.ts

@@ -1,10 +0,0 @@
-import { Props } from "../useBase/base.types";
-export declare enum GRID {
-    Default = 0
-}
-declare const Grid: import("react").ForwardRefExoticComponent<Props<"div"> & {
-    rows?: number;
-    cols?: number;
-    gap?: number;
-} & import("react").RefAttributes<HTMLInputElement>>;
-export default Grid;

package/dist/comps/grid/index.js

@@ -1,16 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import Box from "../box";
-import useBase from "../useBase";
-export var GRID;
-(function (GRID) {
-    GRID[GRID["Default"] = 0] = "Default";
-})(GRID || (GRID = {}));
-const Grid = forwardRef((props, ref) => {
-    const { animate, children, rows, cols, gap, ...pops } = props;
-    const { className, style } = useBase(props);
-    return _jsx(Box, { style: style, ...{
-            className: `--grid grid ${className}`.trim()
-        }, children: children });
-});
-export default Grid;

package/dist/comps/heading.d.ts

@@ -1,8 +0,0 @@
-import { ReactNode } from "react";
-import { Props } from "./useBase/base.types";
-export interface HeadingProps extends Props<"h1" | "h2" | "h3" | "h4" | "h5" | "h6"> {
-    h?: number | string;
-    html?: ReactNode | string;
-}
-declare const Heading: import("react").ForwardRefExoticComponent<HeadingProps & import("react").RefAttributes<HTMLHeadingElement>>;
-export default Heading;

package/dist/comps/heading.js

@@ -1,16 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createElement, forwardRef } from "react";
-import useBase from "./useBase";
-const Heading = forwardRef((props, ref) => {
-    const { h, html, children, ...pops } = props;
-    const { className, style, rest } = useBase(pops);
-    const Tag = `h${h || 1}`;
-    return createElement(Tag, {
-        ref,
-        style,
-        className,
-        ...rest,
-        children: html ? _jsx("span", { ...{ dangerouslySetInnerHTML: { __html: html } } }) : children
-    });
-});
-export default Heading;

package/dist/comps/icon.d.ts

@@ -1,7 +0,0 @@
-import { Props } from "./useBase/base.types";
-export interface IconProps extends Props<`div`> {
-    name: string;
-    pathCount?: number;
-}
-declare const Icon: import("react").ForwardRefExoticComponent<IconProps & import("react").RefAttributes<HTMLDivElement>>;
-export default Icon;

package/dist/comps/icon.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-// import With, { Props } from "./base";
-import Box from "./box";
-import useBase from "./useBase";
-import Span from "./span";
-const Icon = forwardRef((props, ref) => {
-    const { name, pathCount, ...pops } = props;
-    const { className, style, rest } = useBase(pops);
-    return _jsx(Box, { ...{
-            className: `${className} icon-${name}`,
-            style,
-            ...rest
-        }, children: Array(pathCount || 0).fill(0).map((p, i) => _jsx(Span, { ...{
-                className: `path${i + 1}`
-            } }, `${name}-layer-${i}`)) });
-    // return <With 
-    //     className={`icon-${name}`}
-    //     as={as} 
-    //     {...rest} 
-    //     ref={ref} />
-});
-export default Icon;

package/dist/comps/image.d.ts

@@ -1,13 +0,0 @@
-import React from "react";
-import { animationProps } from "../types/interfaces";
-interface ImageProps {
-    width: string | number;
-    height: string | number;
-    as?: string;
-    animate?: animationProps;
-    src: string;
-    alt: string;
-    crossover?: boolean;
-}
-declare const Image: React.ForwardRefExoticComponent<ImageProps & Omit<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export default Image;

package/dist/comps/image.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import With from "./base";
-const Image = forwardRef((props, ref) => {
-    const { as, width, height, ...rest } = props;
-    return _jsx(With, { tag: `img`, as: as, ...rest, ref: ref });
-});
-export default Image;

package/dist/comps/input.d.ts

@@ -1,6 +0,0 @@
-import { Props } from "./useBase/base.types";
-export interface InputProps extends Props<`input`> {
-    numeric?: boolean;
-}
-declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement>>;
-export default Input;

package/dist/comps/input.js

@@ -1,19 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, useEffect } from "react";
-import useBase from "./useBase";
-const Input = forwardRef((props, ref) => {
-    /**
-     * @internal
-     * const _innerRef = useRef<HTMLInputElement>(null)
-     */
-    const { numeric, ...pops } = props;
-    const handleInput = (event) => {
-        if (numeric) {
-            event.currentTarget.value = event.currentTarget.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');
-        }
-    };
-    const { className, style, rest } = useBase(pops);
-    useEffect(() => { }, []);
-    return _jsx("input", { className: `${className} --input`, style: style, ref: ref, onInput: handleInput, ...rest });
-});
-export default Input;

package/dist/comps/otp/index.d.ts

@@ -1,6 +0,0 @@
-import { Props } from "../useBase/base.types";
-declare const OTP: import("react").ForwardRefExoticComponent<Props<"input"> & {
-    mask?: boolean;
-    size?: number;
-} & import("react").RefAttributes<HTMLInputElement>>;
-export default OTP;

package/dist/comps/password.d.ts

@@ -1,3 +0,0 @@
-import { Props } from "./useBase/base.types";
-declare const Password: import("react").ForwardRefExoticComponent<Omit<Props<"input">, "type"> & import("react").RefAttributes<HTMLInputElement>>;
-export default Password;

package/dist/comps/password.js

@@ -1,30 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useState } from "react";
-import Input from "./input";
-import Box from "./box";
-import Button from "./button";
-import useBase from "./useBase";
-const Icons = {
-    on: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", children: [_jsx("path", { fill: "#333", d: "M12 20.5c-4.299 0-8.24-3.023-10.544-8.086a1 1 0 010-.828C3.759 6.523 7.701 3.5 12 3.5s8.24 3.023 10.544 8.086a1.001 1.001 0 010 .828 18.14 18.14 0 01-1.391 2.52 1 1 0 11-1.666-1.106A15.87 15.87 0 0020.529 12C18.543 7.92 15.379 5.5 12 5.5S5.457 7.92 3.471 12c1.986 4.08 5.15 6.5 8.529 6.5a7.964 7.964 0 005.036-1.92 1 1 0 111.265 1.55A9.94 9.94 0 0112 20.5z" }), _jsx("path", { fill: "#333", d: "M12 16a4.004 4.004 0 01-3.929-4.756 1 1 0 011.965.375A2 2 0 1014 12a2.034 2.034 0 00-2.053-1.999 1.04 1.04 0 01-1.043-.947.963.963 0 01.902-1.05L12 8a4 4 0 010 8z" })] }),
-    off: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", children: [_jsx("path", { fill: "#333", d: "M12 15c-4.132 0-7.98-1.214-10.294-3.249a1 1 0 111.32-1.502C4.986 11.972 8.34 13 12 13s7.014-1.028 8.974-2.751a1 1 0 111.32 1.502C19.98 13.786 16.132 15 12 15z" }), _jsx("path", { fill: "#333", d: "M12 18a1 1 0 01-1-1v-3a1 1 0 012 0v3a1 1 0 01-1 1zM7.749 17.667a.964.964 0 01-.17-.014 1 1 0 01-.817-1.155l.505-2.935a1 1 0 111.97.339l-.504 2.935a1 1 0 01-.984.83zM3.636 16.306a1.001 1.001 0 01-.942-1.336l.978-2.745a1 1 0 111.884.672l-.978 2.745a1 1 0 01-.942.664zM16.251 17.667a1 1 0 01-.984-.83l-.505-2.935a1 1 0 011.97-.339l.506 2.935a1 1 0 01-.816 1.155.964.964 0 01-.17.014zM20.364 16.306a1 1 0 01-.942-.664l-.978-2.745a1 1 0 111.884-.672l.978 2.745a1.001 1.001 0 01-.942 1.336z" })] })
-};
-const Password = forwardRef((props, ref) => {
-    const [visible, setVisible] = useState(false);
-    const { animate, ...pops } = props;
-    const { style } = useBase(props);
-    if (`type` in props) {
-        delete props[`type`];
-    }
-    return _jsxs(Box, { style: style, ...{
-            className: `--password flex aic rel`
-        }, children: [_jsx(Input, { ...{
-                    ref,
-                    type: visible ? 'text' : 'password',
-                    ...pops
-                } }), _jsx(Button, { ...{
-                    tabIndex: -1,
-                    onClick: e => setVisible(prev => !prev),
-                    className: `--toggle flex aic jcc abs`
-                }, children: visible ? Icons.on : Icons.off })] });
-});
-export default Password;

package/dist/comps/progressbar.d.ts

@@ -1,11 +0,0 @@
-import { BaseProps } from "../types/interfaces";
-import { PROGRESS } from "../types/enums";
-export interface ProgressBarProps {
-    progress: number;
-    type?: PROGRESS;
-}
-export interface ProgressHandler {
-    setWidth?: (w: number) => void;
-}
-declare const ProgressBar: import("react").ForwardRefExoticComponent<ProgressBarProps & BaseProps & import("react").RefAttributes<ProgressHandler>>;
-export default ProgressBar;

package/dist/comps/progressbar.js

@@ -1,14 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, useImperativeHandle, useRef } from "react";
-import With from "./base";
-const ProgressBar = forwardRef((props, ref) => {
-    const { as } = props;
-    const bar = useRef(null);
-    useImperativeHandle(ref, () => ({
-        setWidth: (progress) => {
-            bar.current.style.width = `${progress * 100}%`;
-        }
-    }), []);
-    return _jsx(With, { className: `--progress flex rel`, as: as, children: _jsx(With, { ref: bar, className: `--bar rel` }) });
-});
-export default ProgressBar;

package/dist/comps/search/index.d.ts

@@ -1,7 +0,0 @@
-import { Props } from "../useBase/base.types";
-declare const Search: import("react").ForwardRefExoticComponent<Props<"input"> & {
-    onSubmit?: (value: string) => void;
-    onChange?: (value: string) => void;
-    withStyle?: string;
-} & import("react").RefAttributes<HTMLInputElement>>;
-export default Search;