@fpkit/acss 0.4.19 → 0.5.2

package/dist/hooks.d.ts

@@ -1,32 +0,0 @@
-type Position = {
-    /**
-     * @description This is the top position of the popover.
-     * @default 0
-     */
-    top: number;
-    /**
-     * @description This is the left position of the popover.
-     * @default 0
-     */
-    left: number;
-};
-/**
- * @description This is the hook to show/hide the popover.
- * @param elementRef - This is the ref of the element on which the popover should be shown.
- * @param hoverRef - This is the ref of the element on which the popover should be shown.
- * @param spacing - This is the spacing between the element and the popover.
- * @example - const { isVisible, popoverPosition, handlePointerEvent, handlePointerLeave } = usePopover(hoverRef, popOverRef, 1)
- * @returns - This is the object of the following properties.
- * @returns - isVisible - This is the boolean value to show/hide the popover.
- * @returns - popoverPosition - This is the position of the popover.
- * @returns - handlePointerEvent - This is the function to handle the pointer event.
- * @returns - handlePointerLeave - This is the function to handle the pointer leave event.
- */
-declare const usePopover: (elementRef: React.RefObject<HTMLElement>, hoverRef: React.RefObject<HTMLElement>, spacing?: number) => {
-    isVisible: boolean;
-    popoverPosition: Position;
-    handlePointerEvent: (event: React.MouseEvent<HTMLButtonElement>) => void;
-    handlePointerLeave: () => void;
-};
-
-export { usePopover };

package/dist/hooks.js

@@ -1,8 +0,0 @@
-import './chunk-PCDUGD3C.js';
-import { useState } from 'react';
-
-const L=(e,P,n=1)=>{const[h,s]=useState(!1); const [d,m]=useState({top:0,left:0});return {isVisible:h,popoverPosition:d,handlePointerEvent:r=>{let i,c,p;r==null||r.stopPropagation();const t=((i=e.current)==null?void 0:i.offsetHeight)||40;if(e.current){const l=e.current.getBoundingClientRect(); const {scrollY:o,scrollX:v,innerHeight:a}=window; const u=l.bottom+o+n; const b=l.left+v; const H=u+t; const g=(p=(c=P.current)==null?void 0:c.offsetHeight)!=null?p:t; const E=H>o+a?Math.max(o+a-g-t-n,o)-t-n:u;m({top:E,left:b}),s(!0);}},handlePointerLeave:()=>{s(!1);}}};
-
-export { L as usePopover };
-// # sourceMappingURL=out.js.map
-// # sourceMappingURL=hooks.js.map

package/dist/hooks.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/hooks/popover/use-popover.tsx"],"names":["useState","usePopover","elementRef","hoverRef","spacing","isVisible","setIsVisible","popoverPosition","setPopoverPosition","event","_a","_b","_c","height","rect","scrollY","scrollX","innerHeight","popoverTop","popoverLeft","popoverBottom","popoverHeight","adjustedTop"],"mappings":"4BAAA,OAAS,YAAAA,MAAgB,QA2BlB,IAAMC,EAAa,CACxBC,EACAC,EACAC,EAAU,IACP,CACH,GAAM,CAACC,EAAWC,CAAY,EAAIN,EAAS,EAAK,EAC1C,CAACO,EAAiBC,CAAkB,EAAIR,EAAmB,CAC/D,IAAK,EACL,KAAM,CACR,CAAC,EAoCD,MAAO,CACL,UAAAK,EACA,gBAAAE,EACA,mBArC0BE,GAA+C,CAtC7E,IAAAC,EAAAC,EAAAC,EAuCIH,GAAA,MAAAA,EAAO,kBACP,IAAMI,IAASH,EAAAR,EAAW,UAAX,YAAAQ,EAAoB,eAAgB,GACnD,GAAIR,EAAW,QAAS,CACtB,IAAMY,EAAOZ,EAAW,QAAQ,sBAAsB,EAChD,CAAE,QAAAa,EAAS,QAAAC,EAAS,YAAAC,CAAY,EAAI,OAEpCC,EAAaJ,EAAK,OAASC,EAAUX,EACrCe,EAAcL,EAAK,KAAOE,EAC1BI,EAAgBF,EAAaL,EAC7BQ,GAAgBT,GAAAD,EAAAR,EAAS,UAAT,YAAAQ,EAAkB,eAAlB,KAAAC,EAAkCC,EAElDS,EACJF,EAAgBL,EAAUE,EACtB,KAAK,IACHF,EAAUE,EAAcI,EAAgBR,EAAST,EACjDW,CACF,EACAF,EACAT,EACAc,EAENV,EAAmB,CACjB,IAAKc,EACL,KAAMH,CACR,CAAC,EACDb,EAAa,EAAI,CACnB,CACF,EAUE,mBARyB,IAAM,CAC/BA,EAAa,EAAK,CACpB,CAOA,CACF","sourcesContent":["import { useState } from 'react'\n\ntype Position = {\n  /**\n   * @description This is the top position of the popover.\n   * @default 0\n   */\n  top: number\n  /**\n   * @description This is the left position of the popover.\n   * @default 0\n   */\n  left: number\n}\n\n/**\n * @description This is the hook to show/hide the popover.\n * @param elementRef - This is the ref of the element on which the popover should be shown.\n * @param hoverRef - This is the ref of the element on which the popover should be shown.\n * @param spacing - This is the spacing between the element and the popover.\n * @example - const { isVisible, popoverPosition, handlePointerEvent, handlePointerLeave } = usePopover(hoverRef, popOverRef, 1)\n * @returns - This is the object of the following properties.\n * @returns - isVisible - This is the boolean value to show/hide the popover.\n * @returns - popoverPosition - This is the position of the popover.\n * @returns - handlePointerEvent - This is the function to handle the pointer event.\n * @returns - handlePointerLeave - This is the function to handle the pointer leave event.\n */\nexport const usePopover = (\n  elementRef: React.RefObject<HTMLElement>,\n  hoverRef: React.RefObject<HTMLElement>,\n  spacing = 1,\n) => {\n  const [isVisible, setIsVisible] = useState(false)\n  const [popoverPosition, setPopoverPosition] = useState<Position>({\n    top: 0,\n    left: 0,\n  })\n\n  const handlePointerEvent = (event: React.MouseEvent<HTMLButtonElement>) => {\n    event?.stopPropagation()\n    const height = elementRef.current?.offsetHeight || 40\n    if (elementRef.current) {\n      const rect = elementRef.current.getBoundingClientRect()\n      const { scrollY, scrollX, innerHeight } = window\n\n      const popoverTop = rect.bottom + scrollY + spacing\n      const popoverLeft = rect.left + scrollX\n      const popoverBottom = popoverTop + height // Adjust the popover height as needed\n      const popoverHeight = hoverRef.current?.offsetHeight ?? height // Adjust the popover height as needed\n\n      const adjustedTop =\n        popoverBottom > scrollY + innerHeight\n          ? Math.max(\n              scrollY + innerHeight - popoverHeight - height - spacing,\n              scrollY,\n            ) -\n            height -\n            spacing\n          : popoverTop\n\n      setPopoverPosition({\n        top: adjustedTop,\n        left: popoverLeft,\n      })\n      setIsVisible(true)\n    }\n  }\n\n  const handlePointerLeave = () => {\n    setIsVisible(false)\n  }\n\n  return {\n    isVisible,\n    popoverPosition,\n    handlePointerEvent,\n    handlePointerLeave,\n  }\n}\n\nexport default usePopover\n"]}

package/dist/icon-e6044c73.d.ts

@@ -1,227 +0,0 @@
-import { ReactNode } from 'react';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-
-interface ComponentProps {
-    /**
-     * The default child content/component to render.
-     */
-    children?: ReactNode;
-    /**
-     * Use default component styles
-     */
-    renderStyles?: boolean;
-    /**
-     * Component id attribute
-     */
-    id?: string;
-    /**
-     * Styles object
-     */
-    styles?: {};
-    /**
-     * Default styles object
-     */
-    defaultStyles?: {};
-    /**
-     * Component class attribute
-     */
-    classes?: string;
-    /**
-     * Style value for [data-style] attribute
-     */
-    dataStyle?: string;
-}
-
-interface IconProps$1 extends Partial<ComponentProps> {
-    fill?: string;
-    size?: number;
-    strokeColor?: string;
-    strokeWidth?: string;
-    role?: string;
-    alt?: string;
-    width?: number;
-    height?: number;
-}
-
-declare function Star({ size, fill, strokeColor, styles, role, alt, ...props }: Pick<IconProps$1, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): react_jsx_runtime.JSX.Element;
-declare namespace Star {
-    var displayName: string;
-}
-
-interface IconProps extends Partial<ComponentProps> {
-    fill?: string;
-    size?: string;
-    viewBox?: string;
-    name?: string;
-}
-declare const defaultStyles: {
-    display: string;
-    direction: string;
-    gap: string;
-    placeItems: string;
-    width: string;
-};
-/**
- * Icon component wraps svg in a div.
- * @param {IconProps} props - The props object for the Icon component.
- * @param {React.ReactNode} props.children - The children of the Icon component.
- * @param {Object} props.styles - The styles object for the Icon component.
- * @returns {JSX.Element} - The Icon component.
- */
-declare const Icon: {
-    ({ children, styles, ...props }: IconProps): react_jsx_runtime.JSX.Element;
-    Add: {
-        ({ fill, size, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): JSX.Element;
-        styles: {
-            fill: string;
-            display: string;
-            alignItems: string;
-            width: string;
-        };
-        displayName: string;
-    };
-    ArrowDown: {
-        ({ fill, strokeColor, styles, size, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        styles: {
-            display: string;
-            alignItems: string;
-            width: string;
-        };
-        displayName: string;
-    };
-    ArrowLeft: {
-        ({ strokeColor, fill, size, styles, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        styles: {
-            display: string;
-            alignItems: string;
-            width: string;
-        };
-        displayName: string;
-    };
-    ArrowRight: {
-        ({ size, fill, strokeColor, styles, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        displayName: string;
-    };
-    ArrowUp: {
-        ({ fill, strokeColor, styles, size, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        displayName: string;
-        style: {
-            fill: string;
-            stroke: string;
-            display: string;
-            alignItems: string;
-            width: string;
-        };
-    };
-    Chat: {
-        ({ size, strokeColor, styles, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): JSX.Element;
-        styles: {
-            display: string;
-            alignItems: string;
-            width: string;
-        };
-        displayName: string;
-    };
-    Code: {
-        ({ strokeColor, fill, size, styles, role, alt, ...props }?: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        styles: {
-            fill: string;
-            stroke: string;
-            display: string;
-            alignItems: string;
-            width: string;
-        };
-    };
-    Copy: {
-        ({ size, strokeColor, styles, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): JSX.Element;
-        displayName: string;
-        styles: {
-            stroke: string;
-            display: string;
-            alignItems: string;
-            width: string;
-        };
-    };
-    displayName: string;
-    Home: {
-        ({ strokeColor, fill, size, styles, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        displayName: string;
-        styles: {
-            fill: string;
-            stroke: string;
-            display: string;
-            alignItems: string;
-            width: string;
-        };
-    };
-    Left: {
-        ({ fill, size, styles, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        displayName: string;
-        styles: {
-            fill: string;
-            display: string;
-            alignItems: string;
-            width: string;
-        };
-    };
-    Minus: {
-        ({ size, fill, styles, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        displayName: string;
-        styles: {
-            fill: string;
-        };
-    };
-    Remove: {
-        ({ size, fill, styles, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        displayName: string;
-        styles: {
-            fill: string;
-        };
-    };
-    Right: {
-        ({ size, fill, styles, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        displayName: string;
-        styles: {
-            fill: string;
-        };
-    };
-    Star: typeof Star;
-    styles: {
-        display: string;
-        direction: string;
-        gap: string;
-        placeItems: string;
-        width: string;
-    };
-    Up: {
-        ({ size, fill, styles, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        displayName: string;
-        styles: {
-            display: string;
-            alignItems: string;
-            width: string;
-        };
-    };
-    Down: {
-        ({ size, fill, styles, role, alt, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        displayName: string;
-        styles: {
-            display: string;
-            alignItems: string;
-            width: string;
-        };
-    };
-    User: {
-        ({ size, fill, strokeColor, styles, alt, role, ...props }: Pick<IconProps$1, "role" | "fill" | "alt" | "size" | "styles" | "strokeColor">): react_jsx_runtime.JSX.Element;
-        styles: {
-            fill: string;
-            stroke: string;
-            display: string;
-            alignItems: string;
-            width: string;
-        };
-        displayName: string;
-    };
-};
-
-export { ComponentProps as C, Icon as I, IconProps$1 as a, IconProps as b, defaultStyles as d };

package/dist/icons.cjs

@@ -1,73 +0,0 @@
-'use strict';
-
-var chunkD43FJIRQ_cjs = require('./chunk-D43FJIRQ.cjs');
-require('./chunk-77CZU5XZ.cjs');
-
-
-
-Object.defineProperty(exports, 'Add', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.d; }
-});
-Object.defineProperty(exports, 'ArrowDown', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.g; }
-});
-Object.defineProperty(exports, 'ArrowLeft', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.e; }
-});
-Object.defineProperty(exports, 'ArrowRight', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.i; }
-});
-Object.defineProperty(exports, 'ArrowUp', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.h; }
-});
-Object.defineProperty(exports, 'Chat', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.f; }
-});
-Object.defineProperty(exports, 'Code', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.b; }
-});
-Object.defineProperty(exports, 'Copy', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.o; }
-});
-Object.defineProperty(exports, 'Home', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.c; }
-});
-Object.defineProperty(exports, 'Icon', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.q; }
-});
-Object.defineProperty(exports, 'Left', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.l; }
-});
-Object.defineProperty(exports, 'Minus', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.m; }
-});
-Object.defineProperty(exports, 'Remove', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.n; }
-});
-Object.defineProperty(exports, 'Right', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.k; }
-});
-Object.defineProperty(exports, 'User', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.j; }
-});
-Object.defineProperty(exports, 'defaultStyles', {
-	enumerable: true,
-	get: function () { return chunkD43FJIRQ_cjs.p; }
-});
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=icons.cjs.map

package/dist/icons.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":""}

package/dist/icons.d.cts

@@ -1,252 +0,0 @@
-import { a as IconProps } from './icon-e6044c73.js';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import 'react';
-export { I as Icon, b as IconProps, d as defaultStyles } from './icon-e6044c73.js';
-
-/**
- * Renders a code icon.
- *
- * @param {string} strokeColor - The color of the icon's stroke.
- * @param {string} fill - The color of the icon's fill.
- * @param {string} size - The size of the icon.
- * @param {string} viewBox - The viewBox of the icon.
- * @param {React.CSSProperties} styles - The default styles of the icon.
- * @param {IconProps} props - Additional props to apply to the icon.
- * @returns {JSX.Element} - A React component that renders an SVG icon.
- */
-declare const Code: {
-    ({ strokeColor, fill, size, styles, role, alt, ...props }?: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): react_jsx_runtime.JSX.Element;
-    styles: {
-        fill: string;
-        stroke: string;
-        display: string;
-        alignItems: string;
-        width: string;
-    };
-};
-
-/**
- * Renders a home icon.
- *
- * @param {string} strokeColor - The color of the icon's stroke.
- * @param {string} fill - The color of the icon's fill.
- * @param {string} size - The size of the icon.
- * @param {string} viewBox - The viewBox of the icon.
- * @param {string} name - The name of the icon.
- * @param {Object} styles - The styles of the icon.
- * @param {Object} props - The props of the icon.
- * @returns {JSX.Element} - A home icon.
- */
-declare const Home: {
-    ({ strokeColor, fill, size, styles, role, alt, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): react_jsx_runtime.JSX.Element;
-    displayName: string;
-    styles: {
-        fill: string;
-        stroke: string;
-        display: string;
-        alignItems: string;
-        width: string;
-    };
-};
-
-/**
- * Add Icon component
- * @param {string} fill - Icon fill color (default: 'currentColor')
- * @param {string} size - Icon size (default: '24')
- * @param {IconProps} props - Other icon properties
- * @returns {JSX.Element} - Rendered component
- */
-declare const Add: {
-    ({ fill, size, role, alt, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): JSX.Element;
-    styles: {
-        fill: string;
-        display: string;
-        alignItems: string;
-        width: string;
-    };
-    displayName: string;
-};
-
-/**
- * Renders an arrow pointing to the left.
- *
- * @param {string} strokeColor - The color of the arrow's stroke.
- * @param {string} fill - The fill color of the arrow.
- * @param {string} size - The size of the arrow.
- * @param {object} styles - The styles to apply to the arrow.
- * @param {object} props - The additional props to pass to the SVG element.
- * @returns {JSX.Element} - A React component that renders an arrow pointing to the left.
- */
-declare const ArrowLeft: {
-    ({ strokeColor, fill, size, styles, role, alt, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): react_jsx_runtime.JSX.Element;
-    styles: {
-        display: string;
-        alignItems: string;
-        width: string;
-    };
-    displayName: string;
-};
-
-/**
- * @param {string} size - The width and height of the icon in pixels. Defaults to 24.
- * @param {string} strokeColor - The color of the icon stroke. Defaults to 'currentcolor'.
- * @param {React.CSSProperties} styles - Additional CSS styles to apply to the icon.
- * @param {IconProps} props - Additional props to pass to the SVG element.
- * @returns {JSX.Element} - A chat icon component that displays a speech bubble with lines representing text.
- */
-declare const Chat: {
-    ({ size, strokeColor, styles, role, alt, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): JSX.Element;
-    styles: {
-        display: string;
-        alignItems: string;
-        width: string;
-    };
-    displayName: string;
-};
-
-/**
- * ArrowDown icon component
- * @param fill - Icon fill color
- * @param strokeColor - Icon stroke color
- * @param styles - Icon styles
- * @param size - Icon size
- */
-declare const ArrowDown: {
-    ({ fill, strokeColor, styles, size, role, alt, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): react_jsx_runtime.JSX.Element;
-    styles: {
-        display: string;
-        alignItems: string;
-        width: string;
-    };
-    displayName: string;
-};
-
-/**
- * ArrowUp icon component
- * @param fill - Icon fill color
- * @param strokeColor - Icon stroke color
- * @param styles - Icon styles
- * @param size - Icon size
- */
-declare const ArrowUp: {
-    ({ fill, strokeColor, styles, size, role, alt, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): react_jsx_runtime.JSX.Element;
-    displayName: string;
-    style: {
-        fill: string;
-        stroke: string;
-        display: string;
-        alignItems: string;
-        width: string;
-    };
-};
-
-declare const ArrowRight: {
-    ({ size, fill, strokeColor, styles, role, alt, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-declare const User: {
-    ({ size, fill, strokeColor, styles, alt, role, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): react_jsx_runtime.JSX.Element;
-    styles: {
-        fill: string;
-        stroke: string;
-        display: string;
-        alignItems: string;
-        width: string;
-    };
-    displayName: string;
-};
-
-/**
- * Renders a right arrow icon.
- *
- * @param {string} size - The size of the icon.
- * @param {string} fill - The fill color of the icon.
- * @param {React.CSSProperties} styles - The styles to apply to the icon.
- * @param {IconProps} props - The props to pass down to the icon.
- * @returns {JSX.Element} - A right arrow icon.
- */
-declare const Right: {
-    ({ size, fill, styles, role, alt, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): react_jsx_runtime.JSX.Element;
-    displayName: string;
-    styles: {
-        fill: string;
-    };
-};
-
-/**
- * Left arrow icon
- * @param {string} fill - Icon fill color (default: 'currentColor')
- * @param {string} size - Icon size (default: '24')
- * @param {React.CSSProperties} styles - Icon styles (default: {})
- * @param {IconProps} props - Any other valid props for an SVG element
- * @returns {JSX.Element} - Rendered icon component
- */
-declare const Left: {
-    ({ fill, size, styles, role, alt, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): react_jsx_runtime.JSX.Element;
-    displayName: string;
-    styles: {
-        fill: string;
-        display: string;
-        alignItems: string;
-        width: string;
-    };
-};
-
-/**
- * Minus icon component
- * @param {string} size - Icon size (default: 24)
- * @param {string} fill - Icon fill color (default: 'currentColor')
- * @param {object} styles - Inline styles for the SVG element
- * @param {object} props - Any other SVG attributes
- * @returns {JSX.Element} - Rendered Minus icon component
- */
-declare const Minus: {
-    ({ size, fill, styles, role, alt, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): react_jsx_runtime.JSX.Element;
-    displayName: string;
-    styles: {
-        fill: string;
-    };
-};
-
-/**
- * Remove icon component
- * @param {string} size - The size of the icon
- * @param {string} fill - The fill color of the icon
- * @param {object} styles - The styles to apply to the icon
- * @param {object} props - The additional props to pass to the icon
- * @returns {JSX.Element} - The Remove icon component
- */
-declare const Remove: {
-    ({ size, fill, styles, role, alt, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): react_jsx_runtime.JSX.Element;
-    displayName: string;
-    styles: {
-        fill: string;
-    };
-};
-
-/**
- * Copy icon component
- * @param {string} size - The width and height of the icon
- * @param {string} strokeColor - The color of the icon stroke
- * @param {IconProps} props - The icon component props
- * @returns {JSX.Element} - A react JSX element representing the copy icon
- */
-declare const Copy: {
-    ({ size, strokeColor, styles, role, alt, ...props }: Pick<IconProps, 'strokeColor' | 'fill' | 'styles' | 'size' | 'role' | 'alt'>): JSX.Element;
-    displayName: string;
-    styles: {
-        stroke: string;
-        display: string;
-        alignItems: string;
-        width: string; /**
-         * Copy icon component
-         * @param {string} size - The width and height of the icon
-         * @param {string} strokeColor - The color of the icon stroke
-         * @param {IconProps} props - The icon component props
-         * @returns {JSX.Element} - A react JSX element representing the copy icon
-         */
-    };
-};
-
-export { Add, ArrowDown, ArrowLeft, ArrowRight, ArrowUp, Chat, Code, Copy, Home, Left, Minus, Remove, Right, User };