@zuzjs/ui 0.5.6 → 0.5.8

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

@@ -0,0 +1,21 @@
+import { BoxProps } from "../Box";
+import { SPINNER } from "../../types/enums";
+export type SpinnerProps = BoxProps & {
+    type?: SPINNER;
+    size?: number;
+    width?: number;
+    color?: string;
+    background?: string;
+    foreground?: string;
+    speed?: number;
+};
+declare const Spinner: import("react").ForwardRefExoticComponent<BoxProps & {
+    type?: SPINNER;
+    size?: number;
+    width?: number;
+    color?: string;
+    background?: string;
+    foreground?: string;
+    speed?: number;
+} & import("react").RefAttributes<HTMLDivElement>>;
+export default Spinner;

package/dist/comps/Spinner/index.js

@@ -0,0 +1,31 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import Box from "../Box";
+import { SPINNER } from "../../types/enums";
+import { useBase } from "../../hooks";
+import { hexToRgba } from "../../funs";
+const Spinner = forwardRef((props, ref) => {
+    const { type, size, width, speed, color, background, foreground, ...pops } = props;
+    const defaultColor = `#000000`;
+    const { className, style, rest } = useBase(pops);
+    const build = () => {
+        const c = color && color.startsWith(`var`) ? color : hexToRgba(color || defaultColor);
+        const bg = color && color.startsWith(`var`) ? color : hexToRgba(color || defaultColor, .3);
+        const _props = {
+            width: size || 30,
+            height: size || 30,
+            border: `${width || 3}px solid ${bg}`,
+            borderRadius: `50%`,
+            borderTopColor: c,
+            animationDuration: `${speed || .6}s`,
+            animationTimingFunction: `linear`
+        };
+        return _props;
+    };
+    return _jsx(Box, { className: `${className} --spinner --${(type || SPINNER.Simple).toLowerCase()}`.trim(), style: {
+            ...style,
+            ...build()
+        }, ...rest });
+});
+export default Spinner;

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

@@ -0,0 +1,7 @@
+import { CheckboxHandler } from "../CheckBox/types";
+import { CHECKBOX } from "../../types/enums";
+declare const Switch: import("react").ForwardRefExoticComponent<import("../..").ZuzProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, keyof import("../..").ZuzProps> & {
+    type?: CHECKBOX;
+    onChange?: (checked: boolean, value: string | number | readonly string[]) => void;
+} & import("react").RefAttributes<CheckboxHandler>>;
+export default Switch;

package/dist/comps/Switch/index.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import CheckBox from "../CheckBox";
+import { CHECKBOX } from "../../types/enums";
+const Switch = forwardRef((props, ref) => {
+    return _jsx(CheckBox, { type: CHECKBOX.Switch, ...props, ref: ref });
+});
+export default Switch;

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

@@ -0,0 +1,9 @@
+import { Tab, TabViewHandler } from "./types";
+import { BoxProps } from "../Box";
+declare const TabView: import("react").ForwardRefExoticComponent<BoxProps & {
+    onChange?: (tab: Tab, index: number) => void;
+    speed?: number;
+    tabs: Tab[];
+    prerender?: boolean;
+} & import("react").RefAttributes<TabViewHandler>>;
+export default TabView;

package/dist/comps/TabView/index.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useEffect, useMemo, useRef, useState } from "react";
+import { uuid } from "../../funs";
+import { useResizeObserver } from "../../hooks";
+import Box from "../Box";
+import TabItem from "./tab";
+const TabView = forwardRef((props, ref) => {
+    const { as, tabs: _tabs, speed, prerender, onChange, ...rest } = props;
+    const tabs = useMemo(() => _tabs.reduce((ts, t) => {
+        ts.push({
+            ...t,
+            key: t.key || uuid()
+        });
+        return ts;
+    }, []), [_tabs]);
+    const tabview = useRef(null);
+    const tabViewID = useMemo(() => uuid(), []);
+    const [activeTab, setActiveTab] = useState(0);
+    const size = useResizeObserver(tabview);
+    const render = useMemo(() => prerender == undefined || prerender == true ? true : false, []);
+    const handleTabClick = (index) => {
+        setActiveTab(index);
+    };
+    useEffect(() => {
+        onChange && onChange(tabs[0], 0);
+    }, []);
+    return _jsxs(Box, { ref: tabview, className: `--tabview flex cols`, children: [_jsx(Box, { className: `--head flex aic`, children: tabs.map((tab, index) => _jsx(TabItem, { tab: tab, index: index, activeTab: activeTab, onClick: idx => {
+                        handleTabClick(idx);
+                        tab.onSelect && tab.onSelect(tab, idx);
+                        onChange && onChange(tab, idx);
+                    } }, `tab-${tabViewID}-${tab.key || index}`)) }), _jsx(Box, { className: `--body rel`, children: _jsx(Box, { className: `--track flex aic`, style: {
+                        transition: `all ${speed || 0.3}s ease-in-out 0s`, transform: `translate(-${activeTab * size.width}px, 0)`
+                    }, children: tabs.map((tab, index) => _jsx(Box, { style: {
+                            width: size.width,
+                            minWidth: size.width,
+                            maxWidth: size.width,
+                            opacity: index === activeTab ? 1 : 0,
+                            transition: 'opacity 0.5s ease',
+                        }, className: `--content`, children: (render || activeTab == index) && tab.body })) }) })] });
+});
+export default TabView;

package/dist/comps/TabView/tab.d.ts

@@ -0,0 +1,3 @@
+import { TabProps } from "./types";
+declare const TabItem: ({ tab, index, activeTab, onClick }: TabProps) => import("react/jsx-runtime").JSX.Element;
+export default TabItem;

package/dist/comps/TabView/tab.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Button from "../Button";
+import Icon from "../Icon";
+import Text from "../Text";
+const TabItem = ({ tab, index, activeTab, onClick }) => {
+    const { icon, label } = tab;
+    return _jsxs(Button, { onClick: e => onClick(index), className: `--tab jcc ${index === activeTab ? '--active' : ''}`.trim(), children: [icon && (typeof icon === 'string' ? _jsx(Icon, { className: `--icon`, name: icon }) : icon), _jsx(Text, { className: `--label rel`, children: label })] });
+};
+export default TabItem;

package/dist/comps/{tabview.d.ts → TabView/types.d.ts}

@@ -1,21 +1,26 @@
 import { ReactNode } from "react";
-import { BaseProps } from "../types/interfaces";
+import { BoxProps } from "../Box";
 export interface Tab {
     onSelect: (tab: Tab, index: number) => void;
     tag?: string;
     key?: string;
+    icon?: string | ReactNode | ReactNode[];
     label: string | ReactNode | ReactNode[];
     body: string | ReactNode | ReactNode[];
     render?: boolean;
 }
-export interface TabViewProps {
+export type TabProps = {
+    tab: Tab;
+    index: number;
+    activeTab: number;
+    onClick: (index: number) => void;
+};
+export type TabViewProps = BoxProps & {
     onChange?: (tab: Tab, index: number) => void;
     speed?: number;
     tabs: Tab[];
     prerender?: boolean;
-}
+};
 export interface TabViewHandler {
     setTab: (index: number) => void;
 }
-declare const TabView: import("react").ForwardRefExoticComponent<TabViewProps & BaseProps & import("react").RefAttributes<TabViewHandler>>;
-export default TabView;

package/dist/comps/TabView/types.js

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

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

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

package/dist/comps/Text/index.js

@@ -0,0 +1,12 @@
+"use client";
+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, ...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 });
+});
+export default Text;

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

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

package/dist/comps/{textwheel.js → TextWheel/index.js}

@@ -1,14 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useImperativeHandle, useRef, useState } from 'react';
 import { forwardRef } from 'react';
-import With from "./base";
+import Box from '../Box';
+import Span from '../Span';
 const TextWheel = forwardRef((props, ref) => {
     const { as, value, color, direction, ...rest } = props;
     const divRef = useRef(null);
     const [_value, _setValue] = useState(value || 0);
     useImperativeHandle(ref, () => ({
         updateValue(v) {
-            // console.log(_value != v, _value.toString().length != v.toString().length)
             if (_value.toString().length != v.toString().length) {
                 _setValue(v);
             }
@@ -34,18 +34,18 @@ const TextWheel = forwardRef((props, ref) => {
         // console.log(value)
         _setValue(value || 0);
     }, [value]);
-    return _jsxs(With, { className: `text-wheel flex aic jcc rel`, "aria-hidden": true, as: as, ref: divRef, ...rest, children: [(_value || 0).toString().split('').map((char, index) => {
+    return _jsxs(Box, { className: `text-wheel flex aic jcc rel`, "aria-hidden": true, as: as, ref: divRef, ...rest, children: [(_value || 0).toString().split('').map((char, index) => {
                 if (isNaN(parseInt(char, 10))) {
-                    return _jsx(With, { tag: `span`, className: "wheel-char wheel-char-symbol grid", children: char }, `wheel-char-${index}`);
+                    return _jsx(Span, { className: "wheel-char wheel-char-symbol grid", children: char }, `wheel-char-${index}`);
                 }
-                return _jsx(With, { tag: `span`, "data-value": char, className: `wheel-char grid ${index > char.toString().split('').length - 3 ? 'wheel-fraction' : ''}`.trim(), children: _jsxs(With, { tag: `span`, className: `wheel-char-track wheel-track-${direction || `down`} grid`, style: {
+                return _jsx(Span, { "data-value": char, className: `wheel-char grid ${index > char.toString().split('').length - 3 ? 'wheel-fraction' : ''}`.trim(), children: _jsxs(Span, { className: `wheel-char-track wheel-track-${direction || `down`} grid`, style: {
                             '--v': char
-                        }, children: [_jsx(With, { tag: `span`, children: !direction || direction == `down` ? 0 : 9 }), (!direction || direction == `down` ?
+                        }, 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(With, { tag: `span`, children: val }, `${index}--${indx}`);
-                            }), _jsx(With, { tag: `span`, children: !direction || direction == `down` ? 9 : 0 })] }) }, `wheel-char-${index}`);
-            }), color && _jsx(With, { className: `abs fillx`, style: {
+                                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})`,
                 } })] });

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

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

package/dist/comps/TextWheel/types.js

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

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

@@ -0,0 +1,4 @@
+import { BoxProps } from '../Box';
+export type ToolTipProps = BoxProps & {};
+declare const ToolTip: import("react").ForwardRefExoticComponent<BoxProps & import("react").RefAttributes<HTMLDivElement>>;
+export default ToolTip;

package/dist/comps/Tooltip/index.js

@@ -0,0 +1,19 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useState } from 'react';
+import { useBase } from '../../hooks';
+import Box from '../Box';
+import Text from '../Text';
+import { TRANSITION_CURVES } from '../../types/enums';
+const ToolTip = forwardRef((props, ref) => {
+    const { title, children, ...pops } = props;
+    const { style, className, rest } = useBase(pops);
+    const [hovered, setHovered] = useState(false);
+    return _jsxs(Box, { className: `--with-tooltip rel`, onMouseEnter: e => setHovered(true), onMouseLeave: e => setHovered(false), children: [_jsx(Box, { className: `--tooltip abs ${className}`.trim(), animate: {
+                    from: { opacity: 0, x: `-50%`, y: -5 },
+                    to: { opacity: 1, x: `-50%`, y: 0 },
+                    curve: TRANSITION_CURVES.EaseInOut,
+                    when: hovered
+                }, children: _jsx(Text, { className: `--text rel`, children: title }) }), children] });
+});
+export default ToolTip;

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

@@ -0,0 +1,11 @@
+import { TreeViewHandler } from "./types";
+import { BoxProps } from "../Box";
+declare const TreeView: import("react").ForwardRefExoticComponent<Omit<BoxProps, "tag"> & {
+    tag?: string;
+    roots: string[];
+    nodes: import("./types").TreeNode[];
+    onSelect: (tag: string) => void;
+    icons?: import("./types").TreeNodeIcons;
+    selected?: string;
+} & import("react").RefAttributes<TreeViewHandler>>;
+export default TreeView;

package/dist/comps/{treeview → Treeview}/index.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useEffect, useImperativeHandle, useState } from "react";
-import With from "../base";
+import Box from "../Box";
 import TreeItem from "./item";
 const TreeView = forwardRef((props, ref) => {
     const { as, nodes, onSelect, tag: treeViewTag, icons, roots, selected: _selected, ...rest } = props;
@@ -17,8 +17,8 @@ const TreeView = forwardRef((props, ref) => {
             setSelected(_selected);
         }
     }, [_selected]);
-    return _jsx(With, { className: `treeview flex cols`, children: nodes
+    return _jsx(Box, { className: `--treeview flex cols`, children: nodes
             .filter(node => roots.includes(node.tag))
-            .map(node => _jsx(TreeItem, { treeTag: treeViewTag ? `-${treeViewTag}` : ``, selected: selected, onSelect: handleSelect, icons: icons, meta: node, nodes: nodes }, `tree-node-${node.tag}`)) });
+            .map(node => _jsx(TreeItem, { treeTag: treeViewTag ? `-${treeViewTag}` : ``, selected: selected, onSelect: e => handleSelect(e), icons: icons, meta: node, nodes: nodes }, `--node-${node.tag}`)) });
 });
 export default TreeView;

package/dist/comps/Treeview/item.d.ts

@@ -0,0 +1,11 @@
+import { TreeItemHandler } from "./types";
+import { BoxProps } from "../Box";
+declare const TreeItem: import("react").ForwardRefExoticComponent<BoxProps & {
+    treeTag: string;
+    meta: import("./types").TreeNode;
+    nodes: import("./types").TreeNode[];
+    onSelect: (tag: string) => void;
+    selected?: String;
+    icons?: import("./types").TreeNodeIcons;
+} & import("react").RefAttributes<TreeItemHandler>>;
+export default TreeItem;

package/dist/comps/Treeview/item.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useEffect, useState } from "react";
+import Box from "../Box";
+import Button from "../Button";
+import Icon from "../Icon";
+import Text from "../Text";
+const TreeItem = forwardRef((props, ref) => {
+    const { as, meta, nodes, icons, onSelect, treeTag, selected, ...rest } = props;
+    const { tag, label, under } = meta;
+    const [isOpen, setIsOpen] = useState(tag == `root`);
+    const toggle = () => {
+        localStorage.setItem(`--tn${treeTag}-${tag}`, isOpen ? `0` : `1`);
+        setIsOpen(!isOpen);
+    };
+    useEffect(() => {
+        if (tag == `root` && !localStorage.getItem(`--tn${treeTag}-${tag}`)) {
+            localStorage.setItem(`--tn${treeTag}-${tag}`, `1`);
+            setIsOpen(true);
+        }
+        else
+            setIsOpen(localStorage.getItem(`--tn${treeTag}-${tag}`) == `1`);
+    }, []);
+    const _nodes = nodes.filter(x => x.under == tag);
+    return _jsxs(Box, { className: `--treenode --treenode-${tag} flex cols`, children: [_jsxs(Box, { className: `--node --node-${tag} flex aic${selected == tag ? ` --selected` : ``}`, children: [_jsx(Button, { onClick: toggle, className: `--node-aro-btn`, children: _jsx(Icon, { className: `--node-aro-icon`, name: isOpen ? icons?.arrowOpen : icons?.arrowClose }) }), _jsxs(Button, { className: `--node-meta flex aic`, onClick: (e) => onSelect(tag), children: [_jsx(Icon, { className: `--node-icon`, name: isOpen ? icons?.dirOpen : icons?.dirClose }), _jsx(Text, { ...{ className: `--node-label` }, children: label })] })] }), isOpen && _nodes.length > 0 && _jsx(Box, { className: `--sub-node tree-sub-node-${tag} flex cols`, children: _nodes.map(node => _jsx(TreeItem, { treeTag: treeTag, selected: selected, onSelect: onSelect, icons: icons, meta: node, nodes: nodes }, `--node-${node.tag}`)) })] });
+});
+export default TreeItem;

package/dist/comps/{treeview/index.d.ts → Treeview/types.d.ts}

@@ -1,19 +1,19 @@
 import { ReactNode } from "react";
-import { BaseProps } from "../../types/interfaces";
+import { BoxProps } from "../Box";
 export interface TreeNodeIcons {
     dirOpen: ReactNode;
     dirClose: ReactNode;
     arrowOpen: ReactNode;
     arrowClose: ReactNode;
 }
-export interface TreeViewProps {
+export type TreeViewProps = Omit<BoxProps, `tag`> & {
     tag?: string;
     roots: string[];
     nodes: TreeNode[];
     onSelect: (tag: string) => void;
     icons?: TreeNodeIcons;
     selected?: string;
-}
+};
 export interface TreeViewHandler {
     getSelected?: () => String;
 }
@@ -24,5 +24,14 @@ export interface TreeNode {
     selected?: string;
     expanded?: boolean;
 }
-declare const TreeView: import("react").ForwardRefExoticComponent<TreeViewProps & BaseProps & import("react").RefAttributes<TreeViewHandler>>;
-export default TreeView;
+export type TreeItemProps = BoxProps & {
+    treeTag: string;
+    meta: TreeNode;
+    nodes: TreeNode[];
+    onSelect: (tag: string) => void;
+    selected?: String;
+    icons?: TreeNodeIcons;
+};
+export interface TreeItemHandler {
+    onSelect?: (v: TreeNode) => void;
+}

package/dist/comps/Treeview/types.js

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

package/dist/comps/index.d.ts

@@ -0,0 +1,48 @@
+/**Components */
+export { default as ActionBar } from './Actionbar';
+export * from './Actionbar/types';
+export { default as Accordion } from './Accordion';
+export * from './Accordion/types';
+export { type AvatarProps, default as Avatar } from './Avatar';
+export { type BoxProps, default as Box } from './Box';
+export { type ButtonProps, default as Button } from './Button';
+export { default as CheckBox } from './CheckBox';
+export * from './CheckBox/types';
+export { default as ContextMenu } from './ContextMenu';
+export * from './ContextMenu/types';
+export { type CoverProps, default as Cover } from './Cover';
+export { default as Drawer } from './Drawer';
+export * from './Drawer/types';
+/**Editor */
+export { default as ZuzBuilder } from './Editor';
+export { default as TimeLine } from './Editor/Timeline';
+export * from './Editor/types';
+export { default as withEditor } from './Editor/withEditor';
+export { type FormProps, default as Form } from './Form';
+export { type IconProps, default as Icon } from './Icon';
+export { type ImageProps, default as Image } from './Image';
+export { type InputProps, default as Input } from './Input';
+export { type LabelProps, default as Label } from './Label';
+export { type OverlayProps, default as Overlay } from './Overlay';
+export { type PasswordProps, default as Password } from './Password';
+export { type PinInputProps, default as PinInput } from './PinInput';
+export { default as ProgressBar } from './ProgressBar';
+export * from './ProgressBar/types';
+export { type SearchProps, default as Search } from './Search';
+export { default as SelectTabs } from './Segmented';
+export * from './Segmented/types';
+export { default as Select } from './Select';
+export * from './Select/types';
+export { type SheetProps, default as Sheet } from './Sheet';
+export { type SliderProps, default as Slider } from './Slider';
+export { type SpanProps, default as Span } from './Span';
+export { type SpinnerProps, default as Spinner } from './Spinner';
+export { default as Switch } from './Switch';
+export { default as TabView } from './TabView';
+export * from './TabView/types';
+export { type TextProps, default as Text } from './Text';
+export { default as TextWheel } from './TextWheel';
+export * from './TextWheel/types';
+export { type ToolTipProps, default as ToolTip } from './Tooltip';
+export { default as TreeView } from './Treeview';
+export * from './Treeview/types';

package/dist/comps/index.js

@@ -0,0 +1,48 @@
+/**Components */
+export { default as ActionBar } from './Actionbar';
+export * from './Actionbar/types';
+export { default as Accordion } from './Accordion';
+export * from './Accordion/types';
+export { default as Avatar } from './Avatar';
+export { default as Box } from './Box';
+export { default as Button } from './Button';
+export { default as CheckBox } from './CheckBox';
+export * from './CheckBox/types';
+export { default as ContextMenu } from './ContextMenu';
+export * from './ContextMenu/types';
+export { default as Cover } from './Cover';
+export { default as Drawer } from './Drawer';
+export * from './Drawer/types';
+/**Editor */
+export { default as ZuzBuilder } from './Editor';
+export { default as TimeLine } from './Editor/Timeline';
+export * from './Editor/types';
+export { default as withEditor } from './Editor/withEditor';
+export { default as Form } from './Form';
+export { default as Icon } from './Icon';
+export { default as Image } from './Image';
+export { default as Input } from './Input';
+export { default as Label } from './Label';
+export { default as Overlay } from './Overlay';
+export { default as Password } from './Password';
+export { default as PinInput } from './PinInput';
+export { default as ProgressBar } from './ProgressBar';
+export * from './ProgressBar/types';
+export { default as Search } from './Search';
+export { default as SelectTabs } from './Segmented';
+export * from './Segmented/types';
+export { default as Select } from './Select';
+export * from './Select/types';
+export { default as Sheet } from './Sheet';
+export { default as Slider } from './Slider';
+export { default as Span } from './Span';
+export { default as Spinner } from './Spinner';
+export { default as Switch } from './Switch';
+export { default as TabView } from './TabView';
+export * from './TabView/types';
+export { default as Text } from './Text';
+export { default as TextWheel } from './TextWheel';
+export * from './TextWheel/types';
+export { default as ToolTip } from './Tooltip';
+export { default as TreeView } from './Treeview';
+export * from './Treeview/types';

package/dist/comps/svgicons.d.ts

@@ -1,3 +1,27 @@
-import { dynamicObject } from "../types";
-declare const SVGIcons: dynamicObject;
+declare const SVGIcons: {
+    arrowDown: import("react/jsx-runtime").JSX.Element;
+    arrowUp: import("react/jsx-runtime").JSX.Element;
+    search: import("react/jsx-runtime").JSX.Element;
+    close: import("react/jsx-runtime").JSX.Element;
+    eye: import("react/jsx-runtime").JSX.Element;
+    eyeSlash: import("react/jsx-runtime").JSX.Element;
+    check: import("react/jsx-runtime").JSX.Element;
+    layers: import("react/jsx-runtime").JSX.Element;
+    play: import("react/jsx-runtime").JSX.Element;
+    pause: import("react/jsx-runtime").JSX.Element;
+    next: import("react/jsx-runtime").JSX.Element;
+    prev: import("react/jsx-runtime").JSX.Element;
+    add: import("react/jsx-runtime").JSX.Element;
+    chevronUp: import("react/jsx-runtime").JSX.Element;
+    chevronBottom: import("react/jsx-runtime").JSX.Element;
+    chevronRight: import("react/jsx-runtime").JSX.Element;
+    chevronLeft: import("react/jsx-runtime").JSX.Element;
+    chevronRightOutline: import("react/jsx-runtime").JSX.Element;
+    chevronLeftOutline: import("react/jsx-runtime").JSX.Element;
+    chevronUpOutline: import("react/jsx-runtime").JSX.Element;
+    chevronDownOutline: import("react/jsx-runtime").JSX.Element;
+    bezier: import("react/jsx-runtime").JSX.Element;
+    mouse: import("react/jsx-runtime").JSX.Element;
+    addKey: import("react/jsx-runtime").JSX.Element;
+};
 export default SVGIcons;

package/dist/comps/svgicons.js

@@ -1,8 +1,47 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const SVGIcons = {
-    ArrowDown: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: _jsx("path", { fill: "#292D32", d: "M17.919 8.18H6.079c-.96 0-1.44 1.16-.76 1.84l5.18 5.18c.83.83 2.18.83 3.01 0l1.97-1.97 3.21-3.21c.67-.68.19-1.84-.77-1.84z" }) }),
-    ArrowUp: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: _jsx("path", { fill: "#292D32", d: "M18.68 13.978l-3.21-3.21-1.96-1.97a2.13 2.13 0 00-3.01 0l-5.18 5.18c-.68.68-.19 1.84.76 1.84h11.84c.96 0 1.44-1.16.76-1.84z" }) }),
-    Search: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 34 34", children: _jsx("path", { d: "M27.414,24.586l-5.077-5.077C23.386,17.928,24,16.035,24,14c0-5.514-4.486-10-10-10S4,8.486,4,14  s4.486,10,10,10c2.035,0,3.928-0.614,5.509-1.663l5.077,5.077c0.78,0.781,2.048,0.781,2.828,0  C28.195,26.633,28.195,25.367,27.414,24.586z M7,14c0-3.86,3.14-7,7-7s7,3.14,7,7s-3.14,7-7,7S7,17.86,7,14z" }) }),
-    Close: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", children: _jsx("path", { d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }) }),
+    arrowDown: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: _jsx("path", { fill: "#292D32", d: "M17.919 8.18H6.079c-.96 0-1.44 1.16-.76 1.84l5.18 5.18c.83.83 2.18.83 3.01 0l1.97-1.97 3.21-3.21c.67-.68.19-1.84-.77-1.84z" }) }),
+    arrowUp: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: _jsx("path", { fill: "#292D32", d: "M18.68 13.978l-3.21-3.21-1.96-1.97a2.13 2.13 0 00-3.01 0l-5.18 5.18c-.68.68-.19 1.84.76 1.84h11.84c.96 0 1.44-1.16.76-1.84z" }) }),
+    search: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 34 34", children: _jsx("path", { d: "M27.414,24.586l-5.077-5.077C23.386,17.928,24,16.035,24,14c0-5.514-4.486-10-10-10S4,8.486,4,14  s4.486,10,10,10c2.035,0,3.928-0.614,5.509-1.663l5.077,5.077c0.78,0.781,2.048,0.781,2.828,0  C28.195,26.633,28.195,25.367,27.414,24.586z M7,14c0-3.86,3.14-7,7-7s7,3.14,7,7s-3.14,7-7,7S7,17.86,7,14z" }) }),
+    close: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: _jsx("path", { d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }) }),
+    eye: _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" })] }),
+    eyeSlash: _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" })] }),
+    check: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: [" ", _jsx("path", { d: "M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z" }), " "] }),
+    //Editor
+    layers: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", fill: "none", children: [_jsx("path", { d: "M19.3697 4.89109L13.5097 2.28109C12.6497 1.90109 11.3497 1.90109 10.4897 2.28109L4.62969 4.89109C3.14969 5.55109 2.92969 6.45109 2.92969 6.93109C2.92969 7.41109 3.14969 8.31109 4.62969 8.97109L10.4897 11.5811C10.9197 11.7711 11.4597 11.8711 11.9997 11.8711C12.5397 11.8711 13.0797 11.7711 13.5097 11.5811L19.3697 8.97109C20.8497 8.31109 21.0697 7.41109 21.0697 6.93109C21.0697 6.45109 20.8597 5.55109 19.3697 4.89109Z", fill: "#292D32" }), _jsx("path", { d: "M12.0003 17.04C11.6203 17.04 11.2403 16.96 10.8903 16.81L4.15031 13.81C3.12031 13.35 2.32031 12.12 2.32031 10.99C2.32031 10.58 2.65031 10.25 3.06031 10.25C3.47031 10.25 3.80031 10.58 3.80031 10.99C3.80031 11.53 4.25031 12.23 4.75031 12.45L11.4903 15.45C11.8103 15.59 12.1803 15.59 12.5003 15.45L19.2403 12.45C19.7403 12.23 20.1903 11.54 20.1903 10.99C20.1903 10.58 20.5203 10.25 20.9303 10.25C21.3403 10.25 21.6703 10.58 21.6703 10.99C21.6703 12.11 20.8703 13.35 19.8403 13.81L13.1003 16.81C12.7603 16.96 12.3803 17.04 12.0003 17.04Z", fill: "#292D32" }), _jsx("path", { d: "M12.0003 22.0009C11.6203 22.0009 11.2403 21.9209 10.8903 21.7709L4.15031 18.7709C3.04031 18.2809 2.32031 17.1709 2.32031 15.9509C2.32031 15.5409 2.65031 15.2109 3.06031 15.2109C3.47031 15.2109 3.80031 15.5409 3.80031 15.9509C3.80031 16.5809 4.17031 17.1509 4.75031 17.4109L11.4903 20.4109C11.8103 20.5509 12.1803 20.5509 12.5003 20.4109L19.2403 17.4109C19.8103 17.1609 20.1903 16.5809 20.1903 15.9509C20.1903 15.5409 20.5203 15.2109 20.9303 15.2109C21.3403 15.2109 21.6703 15.5409 21.6703 15.9509C21.6703 17.1709 20.9503 18.2709 19.8403 18.7709L13.1003 21.7709C12.7603 21.9209 12.3803 22.0009 12.0003 22.0009Z", fill: "#292D32" })] }),
+    play: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: _jsx("path", { d: "M8 5v14l11-7z" }) }),
+    pause: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: _jsx("path", { d: "M6 19h4V5H6zm8-14v14h4V5z" }) }),
+    next: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: _jsx("path", { d: "m6 18 8.5-6L6 6zM16 6v12h2V6z" }) }),
+    prev: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: _jsx("path", { d: "M6 6h2v12H6zm3.5 6 8.5 6V6z" }) }),
+    add: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: _jsx("path", { fill: "#292D32", d: "M12 2C6.49 2 2 6.49 2 12s4.49 10 10 10 10-4.49 10-10S17.51 2 12 2m4 10.75h-3.25V16c0 .41-.34.75-.75.75s-.75-.34-.75-.75v-3.25H8c-.41 0-.75-.34-.75-.75s.34-.75.75-.75h3.25V8c0-.41.34-.75.75-.75s.75.34.75.75v3.25H16c.41 0 .75.34.75.75s-.34.75-.75.75" }) }),
+    chevronUp: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", children: _jsx("path", { d: "m7 14 5-5 5 5z" }) }),
+    chevronBottom: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", children: _jsx("path", { d: "m7 10 5 5 5-5z" }) }),
+    chevronRight: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", children: _jsx("path", { d: "m10 17 5-5-5-5v10z" }) }),
+    chevronLeft: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", children: _jsx("path", { d: "m14 7-5 5 5 5V7z" }) }),
+    chevronRightOutline: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", children: _jsx("path", { d: "M8.59 16.59 13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z" }) }),
+    chevronLeftOutline: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", children: _jsx("path", { d: "M15.41 16.59 10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z" }) }),
+    chevronUpOutline: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", children: _jsx("path", { d: "M7.41 15.41 12 10.83l4.59 4.58L18 14l-6-6-6 6z" }) }),
+    chevronDownOutline: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", children: _jsx("path", { d: "M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z" }) }),
+    bezier: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", fill: "none", children: _jsx("path", { d: "M19.14 7.72C19.43 8.47 20.15 9 21 9C22.1 9 23 8.1 23 7C23 5.9 22.1 5 21 5C20.15 5 19.43 5.53 19.14 6.28C19.09 6.27 19.05 6.25 19 6.25H15V5.5C15 4.68 14.32 4 13.5 4H10.5C9.68 4 9 4.68 9 5.5V6.25H5C4.95 6.25 4.91 6.27 4.86 6.28C4.57 5.53 3.85 5 3 5C1.9 5 1 5.9 1 7C1 8.1 1.9 9 3 9C3.85 9 4.57 8.47 4.86 7.72C4.91 7.73 4.95 7.75 5 7.75H7.57C5.52 9.27 4.25 11.79 4.25 14.5C4.25 14.67 4.26 14.83 4.28 15H4C3.17 15 2.5 15.67 2.5 16.5V18.5C2.5 19.33 3.17 20 4 20H6C6.22 20 6.42 19.95 6.61 19.86C7.13 19.64 7.5 19.11 7.5 18.5V16.5C7.5 15.67 6.83 15 6 15H5.77C5.77 14.97 5.78 14.94 5.78 14.91C5.76 14.77 5.76 14.64 5.76 14.5C5.76 12.03 7.03 9.77 9.02 8.6C9.06 9.37 9.71 10 10.5 10H13.5C14.29 10 14.94 9.37 14.99 8.6C16.98 9.77 18.25 12.04 18.25 14.5C18.25 14.64 18.24 14.77 18.23 14.91C18.23 14.94 18.24 14.97 18.24 15H18C17.17 15 16.5 15.67 16.5 16.5V18.5C16.5 19.11 16.87 19.64 17.39 19.86C17.58 19.95 17.78 20 18 20H20C20.83 20 21.5 19.33 21.5 18.5V16.5C21.5 15.67 20.83 15 20 15H19.72C19.74 14.83 19.75 14.67 19.75 14.5C19.75 11.79 18.48 9.27 16.43 7.75H19C19.05 7.75 19.09 7.73 19.14 7.72Z", fill: "#292D32" }) }),
+    mouse: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", fill: "none", children: _jsx("path", { d: "M13.2978 2.11468C13.0064 2.06339 12.75 2.29593 12.75 2.59185V5.45262C12.75 5.65098 12.8709 5.82564 13.0359 5.93583C13.5391 6.27202 13.87 6.84597 13.87 7.49906V9.49906C13.87 10.5291 13.03 11.3791 12 11.3791C10.96 11.3791 10.12 10.5291 10.12 9.49906V7.49906C10.12 6.84578 10.4583 6.27168 10.9639 5.93554C11.1291 5.82572 11.25 5.65098 11.25 5.45262V2.59249C11.25 2.29634 10.9935 2.0637 10.7019 2.11513C9.15243 2.38834 7.76579 3.13327 6.7 4.19906C5.34 5.55906 4.5 7.43906 4.5 9.49906V14.4991C4.5 18.6291 7.87 21.9991 12 21.9991C16.13 21.9991 19.5 18.6291 19.5 14.4991V9.49906C19.5 5.80857 16.813 2.73328 13.2978 2.11468Z", fill: "#292D32" }) }),
+    addKey: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 24 24", fill: "none", children: _jsx("path", { d: "M20.9498 14.55L14.5598 20.94C13.1598 22.34 10.8598 22.34 9.44977 20.94L3.05977 14.55C1.65977 13.15 1.65977 10.85 3.05977 9.44L9.44977 3.05C10.8498 1.65 13.1498 1.65 14.5598 3.05L20.9498 9.44C22.3498 10.85 22.3498 13.15 20.9498 14.55Z", fill: "#292D32" }) }),
+    // animation: <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
+    //     <path fill="#292D32" d="m15.39 5.211 1.41 2.82c.19.39.7.76 1.13.84l2.55.42c1.63.27 2.01 1.45.84 2.63l-1.99 1.99c-.33.33-.52.98-.41 1.45l.57 2.46c.45 1.94-.59 2.7-2.3 1.68l-2.39-1.42c-.43-.26-1.15-.26-1.58 0l-2.39 1.42c-1.71 1.01-2.75.26-2.3-1.68l.57-2.46c.09-.48-.1-1.13-.43-1.46l-1.99-1.99c-1.17-1.17-.79-2.35.84-2.63l2.55-.42c.43-.07.94-.45 1.13-.84l1.41-2.82c.77-1.52 2.01-1.52 2.78.01M8 5.75H2c-.41 0-.75-.34-.75-.75s.34-.75.75-.75h6c.41 0 .75.34.75.75s-.34.75-.75.75M5 19.75H2c-.41 0-.75-.34-.75-.75s.34-.75.75-.75h3c.41 0 .75.34.75.75s-.34.75-.75.75M3 12.75H2c-.41 0-.75-.34-.75-.75s.34-.75.75-.75h1c.41 0 .75.34.75.75s-.34.75-.75.75" />
+    // </svg>,
+    // style: <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
+    //     <path fill="#292D32" d="M21.3 7.58h-5.58c-.39 0-.7-.31-.7-.7s.31-.7.7-.7h5.58c.39 0 .7.31.7.7s-.31.7-.7.7M6.42 7.58H2.7c-.39 0-.7-.31-.7-.7s.31-.7.7-.7h3.72c.39 0 .7.31.7.7s-.32.7-.7.7" />
+    //     <path fill="#292D32" d="M10.14 10.83a3.95 3.95 0 1 0 0-7.9 3.95 3.95 0 0 0 0 7.9M21.3 17.81h-3.72c-.39 0-.7-.31-.7-.7s.31-.7.7-.7h3.72c.39 0 .7.31.7.7s-.31.7-.7.7M8.28 17.81H2.7c-.39 0-.7-.31-.7-.7s.31-.7.7-.7h5.58c.39 0 .7.31.7.7s-.32.7-.7.7" />
+    //     <path fill="#292D32" d="M13.86 21.072a3.95 3.95 0 1 0 0-7.9 3.95 3.95 0 0 0 0 7.9" />
+    // </svg>,
+    // play: <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
+    //     <path fill="#292D32" d="M11.969 2c-5.52 0-10 4.48-10 10s4.48 10 10 10 10-4.48 10-10-4.47-10-10-10m3 12.23-2.9 1.67a2.28 2.28 0 0 1-2.3 0 2.29 2.29 0 0 1-1.15-2v-3.35c0-.83.43-1.58 1.15-2s1.58-.42 2.31 0l2.9 1.67c.72.42 1.15 1.16 1.15 2s-.43 1.59-1.16 2.01" />
+    // </svg>,
+    // pause: <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
+    //     <path fill="#292D32" d="M10.65 19.11V4.89c0-1.35-.57-1.89-2.01-1.89H5.01C3.57 3 3 3.54 3 4.89v14.22C3 20.46 3.57 21 5.01 21h3.63c1.44 0 2.01-.54 2.01-1.89M21.002 19.11V4.89c0-1.35-.57-1.89-2.01-1.89h-3.63c-1.43 0-2.01.54-2.01 1.89v14.22c0 1.35.57 1.89 2.01 1.89h3.63c1.44 0 2.01-.54 2.01-1.89" />
+    // </svg>,
+    // mouse: <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
+    //     <path fill="#292D32" d="M21 7.52v5.88c0 .34-.33.58-.65.48l-3.93-1.22a3.02 3.02 0 0 0-3.78 3.79l1.21 3.9c.1.32-.14.65-.48.65H7.52C4.07 21 2 18.94 2 15.48V7.52C2 4.06 4.07 2 7.52 2h7.96C18.93 2 21 4.06 21 7.52" />
+    //     <path fill="#292D32" d="m21.96 18.839-1.63.55c-.45.15-.81.5-.96.96l-.55 1.63c-.47 1.41-2.45 1.38-2.89-.03l-1.85-5.95c-.36-1.18.73-2.28 1.9-1.91l5.96 1.85c1.4.44 1.42 2.43.02 2.9" />
+    // </svg>,
 };
 export default SVGIcons;