@zuzjs/ui 0.10.6 → 0.10.7

package/dist/cjs/comps/Table/types.d.ts

@@ -1,153 +0,0 @@
-import { FC, ReactNode, RefObject } from "react";
-import { PubSub, SPINNER } from "../..";
-import { dynamicObject } from "../../types";
-import { BoxProps } from "../Box";
-import { PaginationCallback } from "../Pagination/types";
-export interface TableController {
-    setLoading: (mod: boolean) => void;
-}
-/**
- * Callback function for row selection.
- *
- * @template T - The type of data for each row.
- * @param {T} row - The row data.
- * @param {boolean} selected - Whether the row is selected.
- */
-export type RowSelectCallback<T> = (row: T, selected: boolean) => void;
-/**
- * Callback function for table sorting.
- *
- * @param {string} col - The column key to sort by.
- * @param {number} dir - The direction of sorting (1 for ascending, -1 for descending).
- */
-export type TableSortCallback = (col: string, dir: number) => void;
-/**
- * Represents a row in the table.
- *
- * @template T - The type of data for each row.
- *
- * @property {number} index - The index of the row.
- * @property {Column<T>[]} schema - The schema defining the columns of the row.
- * @property {dynamicObject} styles - The styles to apply to the row.
- * @property {string[]} [ids] - The IDs associated with the row.
- * @property {boolean} [animate] - Whether to animate the row.
- * @property {T} [data] - The data for the row.
- * @property {string} [rowClassName] - The CSS class name to apply to the row.
- * @property {boolean} [selectable] - Whether the row is selectable.
- * @property {string | null} [sortBy] - The column key to sort by.
- * @property {RowSelectCallback<T>} [onSelect] - Callback when the row's selection state changes.
- * @property {TableSortCallback} [onSort] - Callback when the row is sorted.
- * @property {PubSub} pubsub - The PubSub instance for event handling.
- * @property {RefObject<HTMLDivElement | null>} [tableRef] - The reference to the table element.
- * @property {(e: React.MouseEvent<HTMLDivElement, MouseEvent>, row: T) => void} [onContextMenu] - Callback for row context menu event.
- */
-export type Row<T> = {
-    index: number;
-    schema: Column<T>[];
-    styles: dynamicObject;
-    ids?: string[];
-    animate?: boolean;
-    data?: T;
-    rowClassName?: string;
-    selectable?: boolean;
-    sortBy?: string | null;
-    onSelect?: RowSelectCallback<T>;
-    onSort?: TableSortCallback;
-    onRowClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>, row: T) => void;
-    pubsub: PubSub;
-    loading: boolean;
-    tableRef?: RefObject<HTMLDivElement | null>;
-    onContextMenu?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>, row: T) => void;
-};
-/**
- * Represents a column in the table.
- *
- * @template T - The type of data for each row.
- *
- * @property {string | number} id - The unique identifier for the column.
- * @property {string | ReactNode | dynamicObject} [value] - The value to display in the column.
- * @property {number} [weight] - The weight of the column for layout purposes.
- * @property {number | string} [w] - The width of the column.
- * @property {number | string} [maxW] - The maximum width of the column.
- * @property {number | string} [minW] - The minimum width of the column.
- * @property {number | string} [h] - The height of the column.
- * @property {number | string} [maxH] - The maximum height of the column.
- * @property {number | string} [minH] - The minimum height of the column.
- * @property {boolean} [resize] - Whether the column is resizable.
- * @property {boolean} [sortable] - Whether the column is sortable.
- * @property {TableSortCallback} [onSort] - Callback when the column is sorted.
- * @property {string} [as] - The HTML tag to render the column as.
- * @property {boolean} [renderWhenHeader] - Whether to render the column when it is a header.
- * @property {(row: T, index: number) => ReactNode} [render] - Function to render the column content.
- */
-export type Column<T> = {
-    id: string | number;
-    value?: string | ReactNode | dynamicObject;
-    weight?: number;
-    w?: number | string;
-    maxW?: number | string;
-    minW?: number | string;
-    h?: number | string;
-    maxH?: number | string;
-    minH?: number | string;
-    resize?: boolean;
-    sortable?: boolean;
-    onSort?: TableSortCallback;
-    as?: string;
-    renderWhenHeader?: boolean;
-    render?: (row: T, index: number) => ReactNode;
-};
-/**
- * Props for the Table component.
- *
- * @template T - The type of data for each row.
- *
- * @extends BoxProps
- *
- * @property {Column<T>[]} schema - The schema defining the columns of the table.
- * @property {T[]} rows - The data rows to be displayed in the table.
- * @property {number} [rowCount] - The total number of rows.
- * @property {number} [rowsPerPage] - The number of rows to display per page.
- * @property {string} [rowClassName] - The CSS class name to apply to each row.
- * @property {number} [currentPage] - The current page number.
- * @property {boolean} [pagination] - Whether to enable pagination.
- * @property {number | null} [paginationHash] - A hash to force pagination update.
- * @property {boolean} [showPaginationOnZeroPageCount] - Whether to show pagination controls when there are zero pages.
- * @property {boolean} [animateRows] - Whether to animate rows on change.
- * @property {boolean} [header] - Whether to show the table header.
- * @property {string} [sortBy] - The column key to sort by.
- * @property {boolean} [selectableRows] - Whether rows are selectable.
- * @property {boolean} [hoverable] - Whether rows should have a hover effect.
- * @property {boolean} [loading] - Renders placeholder rows when true
- * @property {number} [loadingRowCount] - If greater than 0, shows loading number of empty rows with spinner.
- * @property {RowSelectCallback<T>} [onRowSelectToggle] - Callback when a row's selection state changes.
- * @property {(e: React.MouseEvent<HTMLDivElement, MouseEvent>, row: T) => void} [onRowContextMenu] - Callback for row context menu event.
- * @property {PaginationCallback} [onPageChange] - Callback when the page changes.
- * @property {TableSortCallback} [onSort] - Callback when the table is sorted.
- */
-export type TableProps<T> = BoxProps & {
-    schema: Column<T>[];
-    rows: T[];
-    rowCount?: number;
-    rowsPerPage?: number;
-    rowClassName?: string;
-    currentPage?: number;
-    pagination?: boolean;
-    paginationHash?: number | null;
-    showPaginationOnZeroPageCount?: boolean;
-    animateRows?: boolean;
-    header?: boolean;
-    sortBy?: string;
-    selectableRows?: boolean;
-    hoverable?: boolean;
-    loading?: boolean;
-    loadingRowCount?: number;
-    loadingMessage?: string;
-    spinner?: SPINNER;
-    emptyMessage?: ReactNode | FC;
-    onRowSelectToggle?: RowSelectCallback<T>;
-    onRowClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>, row: T) => void;
-    onRowContextMenu?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>, row: T) => void;
-    onPageChange?: PaginationCallback;
-    onSort?: TableSortCallback;
-};

package/dist/cjs/comps/Table/types.js

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

package/dist/cjs/comps/Text/index.d.ts

@@ -1,13 +0,0 @@
-import { HTMLAttributes, ReactNode } from 'react';
-import { Props } from '../../types';
-export type TextProps = Props<`h1` | `h2` | `h3` | `h4` | `h5` | `h6`> & {
-    h?: number;
-    html?: ReactNode | string;
-    lines?: number;
-};
-declare const Text: import("react").ForwardRefExoticComponent<import("../..").ZuzProps & Omit<Omit<import("react").DetailedHTMLProps<HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof import("../..").ZuzProps> & {
-    h?: number;
-    html?: ReactNode | string;
-    lines?: number;
-} & import("react").RefAttributes<HTMLHeadingElement>>;
-export default Text;

package/dist/cjs/comps/Text/index.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-import { useBase } from '../../hooks';
-import Span from '../Span';
-const Text = forwardRef((props, ref) => {
-    const { h, html, children, lines, ...pops } = props;
-    const { style, className, rest } = useBase(pops);
-    const Tag = `h${props.h || 1}`;
-    return _jsx(Tag, { ref: ref, style: style, className: className, ...rest, children: html ? _jsx(Span, { dangerouslySetInnerHTML: { __html: html } }) : children });
-});
-Text.displayName = `Zuz.Text`;
-export default Text;

package/dist/cjs/comps/TextArea/commands.d.ts

@@ -1,12 +0,0 @@
-import { FC } from "react";
-import { Command } from "../..";
-declare const CommandBox: FC<{
-    position: {
-        top: number;
-        left: number;
-    };
-    commands: Command[];
-    visible: boolean;
-    onSelect: (value: string) => void;
-}>;
-export default CommandBox;

package/dist/cjs/comps/TextArea/commands.js

@@ -1,16 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Icon, Text, TRANSITIONS } from "../..";
-import Box from "../Box";
-const CommandItem = ({ meta }) => {
-    return _jsxs(Button, { as: `flex aic --command-item`, children: [meta.icon && _jsx(Icon, { name: meta.icon, as: `--command-icon` }), _jsx(Text, { children: meta.label })] });
-};
-const CommandBox = ({ position, onSelect, commands, visible }) => {
-    return _jsx(Box, { "aria-hidden": !visible, fx: {
-            transition: TRANSITIONS.SlideInBottom,
-            duration: 0.1,
-            when: visible
-        }, className: `--command-box abs grid`, style: {
-            ...position
-        }, children: commands.map(c => _jsx(CommandItem, { meta: c }, `cmd-${c.label.replace(/\s+/, '-')}`)) });
-};
-export default CommandBox;

package/dist/cjs/comps/TextArea/index.d.ts

@@ -1,20 +0,0 @@
-import { Variant } from '../../types/enums';
-declare const TextArea: import("react").ForwardRefExoticComponent<import("../..").ZuzProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref">, keyof import("../..").ZuzProps> & {
-    autoResize?: boolean;
-    resize?: `none` | `block` | `both` | `horizontal` | `vertical`;
-    maxHeight?: number | string;
-    variant?: Variant;
-    command?: string;
-    commands?: import("../..").Command[];
-    cmd?: (value: string, textarea: HTMLTextAreaElement | HTMLInputElement) => void;
-    renderDropdown?: (props: {
-        show: boolean;
-        position: {
-            top: number;
-            left: number;
-        };
-        commands: import("../..").Command[];
-        onSelect: (value: string) => void;
-    }) => React.ReactNode;
-} & import("react").RefAttributes<HTMLTextAreaElement>>;
-export default TextArea;

package/dist/cjs/comps/TextArea/index.js

@@ -1,95 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useCallback, useEffect, useRef } from 'react';
-import { Box, useCommandActions } from "../..";
-import { useBase } from '../../hooks';
-import { Variant } from '../../types/enums';
-import CommandBox from "./commands";
-const TextArea = forwardRef((props, ref) => {
-    const { autoResize, maxHeight, variant = Variant.Small, resize = 'none', command, commands, onInput, cmd, renderDropdown, value: controlledValue, defaultValue, ...pops } = props;
-    const innerRef = useRef(null);
-    const frameRef = useRef(null);
-    const { style, className, rest } = useBase(pops);
-    const { showDropdown, dropdownPosition, handleKeyDown, handleInput: handleCommandInput, handleCommandSelect, } = useCommandActions({
-        command,
-        commands,
-        cmd,
-        ref: innerRef,
-    });
-    // ------------------------------------------------------------------
-    // Resize function (no state → direct DOM update)
-    // ------------------------------------------------------------------
-    const resizeTextArea = useCallback(() => {
-        const textarea = innerRef.current;
-        if (!textarea || !autoResize)
-            return;
-        // Cancel previous frame
-        if (frameRef.current) {
-            cancelAnimationFrame(frameRef.current);
-        }
-        // Schedule resize after paint
-        frameRef.current = requestAnimationFrame(() => {
-            textarea.style.height = 'auto';
-            let newHeight = textarea.scrollHeight;
-            if (maxHeight) {
-                const max = parseInt(maxHeight.toString(), 10);
-                if (!isNaN(max)) {
-                    newHeight = Math.min(newHeight, max);
-                }
-            }
-            textarea.style.height = `${newHeight}px`;
-            textarea.style.overflowY = maxHeight && newHeight >= parseInt(maxHeight.toString(), 10) ? 'auto' : 'hidden';
-        });
-    }, [autoResize, maxHeight]);
-    // ------------------------------------------------------------------
-    // Input handler
-    // ------------------------------------------------------------------
-    const handleInput = (e) => {
-        onInput?.(e);
-        handleCommandInput(e);
-        resizeTextArea();
-    };
-    // ------------------------------------------------------------------
-    // Initial resize + controlled value change
-    // ------------------------------------------------------------------
-    useEffect(() => {
-        resizeTextArea();
-    }, [controlledValue, defaultValue, resizeTextArea]);
-    // ------------------------------------------------------------------
-    // Resize on mount
-    // ------------------------------------------------------------------
-    useEffect(() => {
-        if (autoResize && innerRef.current) {
-            resizeTextArea();
-        }
-    }, [autoResize, resizeTextArea]);
-    // ------------------------------------------------------------------
-    // Cleanup
-    // ------------------------------------------------------------------
-    useEffect(() => {
-        return () => {
-            if (frameRef.current) {
-                cancelAnimationFrame(frameRef.current);
-            }
-        };
-    }, []);
-    return (_jsxs(Box, { as: "rel", children: [_jsx("textarea", { className: `--input --textarea --${variant} flex ${className}`.trim(), style: {
-                    ...style,
-                    resize,
-                    height: autoResize ? 'auto' : style?.height,
-                    overflow: 'hidden', // Always hidden unless maxHeight hit
-                    transition: autoResize ? 'none' : undefined, // Remove transition flicker
-                }, onKeyDown: handleKeyDown, onInput: handleInput, ref: (node) => {
-                    if (typeof ref === 'function')
-                        ref(node);
-                    else if (ref)
-                        ref.current = node;
-                    innerRef.current = node;
-                }, value: controlledValue, defaultValue: defaultValue, ...rest }), renderDropdown ? (renderDropdown({
-                show: showDropdown,
-                position: dropdownPosition,
-                commands: commands || [],
-                onSelect: handleCommandSelect,
-            })) : (commands && commands.length > 0 && (_jsx(CommandBox, { visible: showDropdown, commands: commands, onSelect: handleCommandSelect, position: dropdownPosition })))] }));
-});
-TextArea.displayName = 'Zuz.TextArea';
-export default TextArea;

package/dist/cjs/comps/TextArea/types.d.ts

@@ -1,21 +0,0 @@
-import { Command } from "../..";
-import { Props } from '../../types';
-import { Variant } from '../../types/enums';
-export type TextAreaProps = Props<`textarea`> & {
-    autoResize?: boolean;
-    resize?: `none` | `block` | `both` | `horizontal` | `vertical`;
-    maxHeight?: number | string;
-    variant?: Variant;
-    command?: string;
-    commands?: Command[];
-    cmd?: (value: string, textarea: HTMLTextAreaElement | HTMLInputElement) => void;
-    renderDropdown?: (props: {
-        show: boolean;
-        position: {
-            top: number;
-            left: number;
-        };
-        commands: Command[];
-        onSelect: (value: string) => void;
-    }) => React.ReactNode;
-};

package/dist/cjs/comps/TextArea/types.js

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

package/dist/cjs/comps/TextWheel/index.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import { TextWheelHandler } from './types';
-declare const TextWheel: React.ForwardRefExoticComponent<Omit<import("..").BoxProps, "name"> & {
-    value?: number | string;
-    color?: string;
-    direction?: `up` | `down`;
-    charDelay?: number | ((index: number) => number);
-    charDuration?: number | ((index: number) => number);
-} & React.RefAttributes<TextWheelHandler>>;
-export default TextWheel;

package/dist/cjs/comps/TextWheel/index.js

@@ -1,66 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
-import Box from '../Box'; // Assuming these are your custom components
-import Span from '../Span'; // Assuming these are your custom components
-const TextWheel = forwardRef((props, ref) => {
-    const { as, value, color, direction, ...rest } = props;
-    const divRef = useRef(null);
-    // Internal state to manage the displayed value
-    const [_value, _setValue] = useState(value || 0);
-    // Expose methods to parent components via ref
-    useImperativeHandle(ref, () => ({
-        // Updates the value without immediately triggering a full re-render of characters
-        // Useful for when the number of digits changes.
-        updateValue(v) {
-            if (_value.toString().length !== v.toString().length) {
-                _setValue(v);
-            }
-        },
-        // Sets the value and triggers the animation for each character
-        setValue(v) {
-            this.updateValue(v); // First, update the internal value to handle length changes
-            if (divRef.current) {
-                const chars = v.toString().split('');
-                divRef.current.querySelectorAll('.--wheel-char').forEach((charElement, index) => {
-                    const char = chars[index];
-                    if (charElement instanceof HTMLElement) {
-                        // Set the data-value attribute, which CSS can then use
-                        charElement.setAttribute('data-value', char);
-                        const track = charElement.querySelector('.--wheel-char-track');
-                        if (track instanceof HTMLElement) {
-                            // Directly update the CSS custom property for immediate animation
-                            track.style.setProperty('--v', char);
-                            // Force a reflow to ensure the transition plays even if the value is the same
-                            // This is a common trick for re-triggering CSS animations/transitions
-                            void track.offsetWidth;
-                        }
-                    }
-                });
-            }
-        }
-    }));
-    // Effect to update internal value when the prop `value` changes
-    useEffect(() => {
-        _setValue(value || 0);
-    }, [value]);
-    return (_jsxs(Box, { className: `--text-wheel flex aic rel`, "aria-hidden": true, as: as, ref: divRef, ...rest, children: [(_value || 0).toString().split('').map((char, index) => {
-                // Render non-numeric characters directly (e.g., decimal points)
-                if (isNaN(parseInt(char, 10))) {
-                    return _jsx(Span, { className: "--wheel-char wheel-char-symbol grid", children: char }, `wheel-char-symbol-${index}`);
-                }
-                // Render numeric characters with the wheel effect
-                return (_jsx(Span, { "data-value": char, className: `--wheel-char grid ${index > (_value || 0).toString().length - 3 ? '--wheel-fraction' : ''}`.trim(), children: _jsxs(Span, { className: `--wheel-char-track --wheel-track-${direction || `down`} grid`, style: {
-                            '--v': char // Set the custom property for the current character value
-                        }, children: [_jsx(Span, { children: !direction || direction === `down` ? 0 : 9 }), (!direction || direction === `down` ?
-                                [9, 8, 7, 6, 5, 4, 3, 2, 1, 0]
-                                : [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]).map((val, indx) => {
-                                return _jsx(Span, { children: val }, `${index}--${indx}`);
-                            }), _jsx(Span, { children: !direction || direction === `down` ? 9 : 0 })] }) }, `wheel-char-${index}`));
-            }), color && _jsx(Box, { className: `abs fillx`, style: {
-                    zIndex: 1,
-                    background: `linear-gradient(0deg, ${color}, transparent, transparent, transparent, ${color})`,
-                } })] }));
-});
-TextWheel.displayName = `Zuz.TextWheel`;
-export default TextWheel;

package/dist/cjs/comps/TextWheel/types.d.ts

@@ -1,12 +0,0 @@
-import { BoxProps } from "../Box";
-export type TextWheelProps = Omit<BoxProps, "name"> & {
-    value?: number | string;
-    color?: string;
-    direction?: `up` | `down`;
-    charDelay?: number | ((index: number) => number);
-    charDuration?: number | ((index: number) => number);
-};
-export interface TextWheelHandler {
-    setValue: (v: number | string) => void;
-    updateValue: (v: number | string) => void;
-}

package/dist/cjs/comps/TextWheel/types.js

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

package/dist/cjs/comps/Theme/index.js

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

package/dist/cjs/comps/Toast/index.d.ts

@@ -1,12 +0,0 @@
-import { FC, ReactNode } from "react";
-import { TRANSITION_CURVES } from "../../types/enums";
-import { ToastContextType } from "./types";
-export declare const ToastContext: import("react").Context<ToastContextType | null>;
-declare const ToastProvider: FC<{
-    children: ReactNode;
-    fx?: {
-        curve: TRANSITION_CURVES;
-        duration: number;
-    };
-}>;
-export default ToastProvider;

package/dist/cjs/comps/Toast/index.js

@@ -1,45 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { createContext, forwardRef, useImperativeHandle, useMemo, useRef, useState } from "react";
-import { TRANSITION_CURVES } from "../../types/enums";
-import Box from "../Box";
-import Toast from "./toast";
-import { ToastType } from "./types";
-export const ToastContext = createContext(null);
-const ToastRenderer = forwardRef((props, ref) => {
-    const [toasts, setToasts] = useState([]);
-    const id = useRef(0);
-    const nextId = () => ++id.current;
-    useImperativeHandle(ref, () => ({
-        add(toast) {
-            const toastId = nextId();
-            const fullToast = { id: toastId, ...toast };
-            setToasts(prev => [fullToast, ...prev.slice(0, 4)]); // max 5
-            if (toast.duration !== Infinity && toast.type != ToastType.Promise) {
-                setTimeout(() => this.remove(toastId), ((toast.duration ?? 4) + 1) * 1000);
-            }
-            return toastId;
-        },
-        remove(id) {
-            setToasts(t => t.filter(toast => toast.id !== id));
-        },
-        clear() {
-            setToasts([]);
-        }
-    }));
-    return _jsx(Box, { as: `--toast-wrapper rel`, children: toasts.map((toast, i) => _jsx(Toast, { index: i, ...toast }, `toast-${toast.id}`)) });
-});
-const ToastProvider = forwardRef(({ children, fx }, ref) => {
-    const toastController = useRef(null);
-    const contextValue = useMemo(() => ({
-        add: (toast) => toastController.current?.add(toast),
-        remove: (id) => toastController.current?.remove(id),
-        clear: () => toastController.current?.clear(),
-        fx: fx || {
-            curve: TRANSITION_CURVES.EaseInOut,
-            duration: 0.4
-        }
-    }), [toastController.current]);
-    return _jsxs(ToastContext.Provider, { value: contextValue, children: [children, _jsx(ToastRenderer, { ref: toastController })] });
-});
-export default ToastProvider;

package/dist/cjs/comps/Toast/toast.d.ts

@@ -1,6 +0,0 @@
-import { FC } from "react";
-import { ToastData } from "./types";
-declare const Toast: FC<ToastData & {
-    index: number;
-}>;
-export default Toast;

package/dist/cjs/comps/Toast/toast.js

@@ -1,49 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useContext } from "react";
-import { ToastContext } from ".";
-import { ToastDefaultTitle, TRANSITION_CURVES, TRANSITIONS, useDelayed } from "../..";
-import Box from "../Box";
-import Icon from "../Icon";
-import Text from "../Text";
-const Toast = ({ index, id, type, icon, title, message, duration }) => {
-    const mounted = useDelayed();
-    const expired = useDelayed(((duration || 4) - 1) * 1000);
-    const ctx = useContext(ToastContext);
-    return _jsxs(Box, { as: `--snack --${type} --snack-${id} ${index > 2 ? `--snacked` : ``} flex aic`, fx: {
-            from: { left: `50%`, x: `-50%`, top: -100, scale: 1, opacity: 0.5 },
-            to: { left: `50%`, x: `-50%`, top: 25, scale: 1, opacity: 1 },
-            // exit: { left: `50%`, x: `-50%`, top: 25, scale: 0, opacity: 0 },
-            curve: ctx?.fx.curve,
-            duration: ctx?.fx.duration,
-            when: mounted && !expired
-        }, children: [_jsx(Box, { as: `--ico flex aic jcc`, fx: {
-                    transition: TRANSITIONS.ScaleIn,
-                    curve: TRANSITION_CURVES.Spring,
-                    delay: 0.2,
-                    when: mounted && !expired
-                }, children: icon ? _jsx(Icon, { name: icon, fx: {
-                        transition: TRANSITIONS.ScaleIn,
-                        curve: TRANSITION_CURVES.Spring,
-                        delay: 0.4,
-                        duration: 0.5,
-                        when: mounted && !expired
-                    } }) : _jsx(Box, { as: `--no-icon`, fx: {
-                        transition: TRANSITIONS.ScaleIn,
-                        curve: TRANSITION_CURVES.Spring,
-                        delay: 0.4,
-                        duration: 0.5,
-                        when: mounted && !expired
-                    } }) }), _jsxs(Box, { as: `--meta`, children: [_jsx(Text, { as: `--tt`, fx: {
-                            transition: TRANSITIONS.SlideInTop,
-                            curve: TRANSITION_CURVES.Spring,
-                            delay: 0.3,
-                            when: mounted
-                        }, children: title || ToastDefaultTitle[type] }), _jsx(Text, { as: `--tm`, fx: {
-                            transition: TRANSITIONS.SlideInTop,
-                            curve: TRANSITION_CURVES.Spring,
-                            delay: 0.4,
-                            duration: 0.5,
-                            when: mounted
-                        }, children: message })] })] });
-};
-export default Toast;

package/dist/cjs/comps/Toast/types.d.ts

@@ -1,31 +0,0 @@
-import { ReactNode } from "react";
-import { dynamic } from "../..";
-import { TRANSITION_CURVES } from "../../types/enums";
-export declare enum ToastType {
-    Default = "default",
-    Success = "success",
-    Error = "error",
-    Warn = "warn",
-    Promise = "promise"
-}
-export declare const ToastDefaultTitle: dynamic;
-export interface ToastData {
-    id: number;
-    type: ToastType;
-    icon?: string;
-    title?: string | ReactNode;
-    message?: string | ReactNode;
-    duration?: number;
-    onClick?: () => void;
-}
-export interface ToastController {
-    add: (toast: Omit<ToastData, 'id'>) => number;
-    remove: (id: number) => void;
-    clear: () => void;
-}
-export interface ToastContextType extends ToastController {
-    fx: {
-        curve: TRANSITION_CURVES;
-        duration: number;
-    };
-}

package/dist/cjs/comps/Toast/types.js

@@ -1,14 +0,0 @@
-export var ToastType;
-(function (ToastType) {
-    ToastType["Default"] = "default";
-    ToastType["Success"] = "success";
-    ToastType["Error"] = "error";
-    ToastType["Warn"] = "warn";
-    ToastType["Promise"] = "promise";
-})(ToastType || (ToastType = {}));
-export const ToastDefaultTitle = {
-    success: "Action Successful",
-    error: "Something Went Wrong",
-    warn: "Heads Up",
-    default: "Notice"
-};

package/dist/cjs/comps/Tooltip/index.d.ts

@@ -1,6 +0,0 @@
-import { Position } from '../../types/enums';
-declare const ToolTip: import("react").ForwardRefExoticComponent<import("..").BoxProps & {
-    position?: Position;
-    margin?: number;
-} & import("react").RefAttributes<HTMLDivElement>>;
-export default ToolTip;