@clickhouse/click-ui 0.0.235 → 0.0.237-sc-deprecation.1

package/dist/components/Accordion/Accordion.d.ts

@@ -17,6 +17,6 @@ export interface AccordionProps extends SizeProp, Omit<RadixAccordion.AccordionS
 interface SizeProp {
     size?: Size;
 }
-declare const SidebarAccordion: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<AccordionProps, never>> & string & Omit<({ title, size, color, icon, iconSize, gap, children, fillWidth, ...delegated }: AccordionProps) => import("react/jsx-runtime").JSX.Element, keyof import('react').Component<any, {}, any>>;
-declare const AccordionToExport: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<AccordionProps, never>> & string & Omit<({ title, size, color, icon, iconSize, gap, children, fillWidth, ...delegated }: AccordionProps) => import("react/jsx-runtime").JSX.Element, keyof import('react').Component<any, {}, any>>;
-export { AccordionToExport as Accordion, SidebarAccordion };
+declare const Accordion: ({ title, size, color, icon, iconSize, gap, children, fillWidth, className, ...delegated }: AccordionProps) => import("react/jsx-runtime").JSX.Element;
+declare const SidebarAccordion: (props: AccordionProps) => import("react/jsx-runtime").JSX.Element;
+export { Accordion, SidebarAccordion };

package/dist/components/AutoComplete/AutoComplete.d.ts

@@ -57,7 +57,6 @@ interface Props extends PopoverProps, Omit<DivProps, "onChange" | "dir" | "onSel
     allowCreateOption?: boolean;
 }
 export type AutoCompleteProps = (SelectOptionType & Props) | (SelectChildrenType & Props);
-export declare const SelectPopoverRoot: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<PopoverProps, never>> & string & Omit<import('react').FC<PopoverProps>, keyof import('react').Component<any, {}, any>>;
 export declare const AutoComplete: {
     ({ onSelect: onSelectProp, options, children, onOpenChange: onOpenChangeProp, disabled, value, placeholder, ...props }: AutoCompleteProps): import("react/jsx-runtime").JSX.Element;
     Group: import('react').ForwardRefExoticComponent<SelectGroupProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/Avatar/Avatar.d.ts

@@ -7,5 +7,5 @@ export interface AvatarProps extends RadixAvatarProps {
     src?: string;
     srcSet?: string;
 }
-declare const Avatar: ({ text, textSize, src, srcSet, ...delegated }: AvatarProps) => import("react/jsx-runtime").JSX.Element;
+declare const Avatar: ({ text, textSize, src, srcSet, className, ...delegated }: AvatarProps) => import("react/jsx-runtime").JSX.Element;
 export { Avatar };

package/dist/components/Badge/Badge.d.ts

@@ -23,4 +23,4 @@ export interface NonDismissibleBadge extends CommonBadgeProps {
     onClose?: never;
 }
 export type BadgeProps = NonDismissibleBadge | DismissibleBadge;
-export declare const Badge: ({ icon, iconDir, text, state, size, type, dismissible, onClose, ellipsisContent, ...props }: BadgeProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Badge: ({ icon, iconDir, text, state, size, type, dismissible, onClose, ellipsisContent, className, ...props }: BadgeProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/BigStat/BigStat.d.ts

@@ -16,4 +16,4 @@ export interface BigStatProps extends Omit<HTMLAttributes<HTMLDivElement>, "titl
     title: React.ReactNode;
     error?: boolean;
 }
-export declare const BigStat: ({ fillWidth, maxWidth, height, label, order, size, spacing, state, title, error, ...props }: BigStatProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BigStat: ({ fillWidth, maxWidth, height, label, order, size, spacing, state, title, error, style, ...props }: BigStatProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Button/Button.d.ts

@@ -15,5 +15,5 @@ export interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
     autoFocus?: boolean;
     showLabelWithLoading?: boolean;
 }
-export declare const Button: ({ type, iconLeft, iconRight, align, children, fillWidth, label, loading, disabled, showLabelWithLoading, ...delegated }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Button: ({ type, iconLeft, iconRight, align, children, fillWidth, label, loading, disabled, showLabelWithLoading, className, ...delegated }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/ButtonGroup/ButtonGroup.d.ts

@@ -12,5 +12,5 @@ export interface ButtonGroupProps extends Omit<HTMLAttributes<HTMLDivElement>, "
     fillWidth?: boolean;
     type?: ButtonGroupType;
 }
-export declare const ButtonGroup: ({ options, selected, fillWidth, onClick, type, ...props }: ButtonGroupProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ButtonGroup: ({ options, selected, fillWidth, onClick, type, className, ...props }: ButtonGroupProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/CardHorizontal/CardHorizontal.d.ts

@@ -2,22 +2,26 @@ import { HTMLAttributes, MouseEventHandler, ReactNode } from 'react';
 import { BadgeState, HorizontalDirection, IconName } from '..';
 
 type CardColor = "default" | "muted";
+export type CardSize = "sm" | "md";
 export interface CardHorizontalProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
     title?: ReactNode;
     icon?: IconName;
     disabled?: boolean;
     description?: ReactNode;
     infoUrl?: string;
+    /** Shows and hides the button */
     infoText?: string;
     isSelected?: boolean;
     isSelectable?: boolean;
     children?: ReactNode;
     color?: CardColor;
+    size?: CardSize;
+    /** Shows and hides the badge */
     badgeText?: string;
     badgeState?: BadgeState;
     badgeIcon?: IconName;
     badgeIconDir?: HorizontalDirection;
     onButtonClick?: MouseEventHandler<HTMLElement>;
 }
-export declare const CardHorizontal: ({ title, icon, description, disabled, infoText, infoUrl, isSelected, isSelectable, children, color, badgeText, badgeState, badgeIcon, badgeIconDir, onButtonClick, ...props }: CardHorizontalProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CardHorizontal: ({ title, icon, description, disabled, infoText, infoUrl, isSelected, isSelectable, children, color, size, badgeText, badgeState, badgeIcon, badgeIconDir, onButtonClick, className, ...props }: CardHorizontalProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/CardPrimary/CardPrimaryTopBadge.d.ts

@@ -1,4 +1,15 @@
-export declare const TopBadgeWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<Omit<any, never> & import('../Container/Container').ContainerProps<import('react').ElementType>, never>> & string & Omit<(<T extends import('react').ElementType = "div">(props: Omit<import('react').ComponentProps<T>, keyof T> & import('../Container/Container').ContainerProps<T>) => import('react').ReactNode), keyof import('react').Component<any, {}, any>>;
-export declare const CardPrimaryTopBadge: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('../Badge/Badge').DismissibleBadge | import('../Badge/Badge').NonDismissibleBadge, {
+import { CommonBadgeProps } from '../Badge/Badge';
+import { ContainerProps } from '../Container/Container';
+
+interface TopBadgeWrapperProps extends ContainerProps {
+    className?: string;
+}
+export declare const TopBadgeWrapper: ({ className, ...props }: TopBadgeWrapperProps) => import("react/jsx-runtime").JSX.Element;
+interface CardPrimaryTopBadgeProps extends CommonBadgeProps {
     $isSelected?: boolean;
-}>> & string & Omit<({ icon, iconDir, text, state, size, type, dismissible, onClose, ellipsisContent, ...props }: import('../Badge/Badge').BadgeProps) => import("react/jsx-runtime").JSX.Element, keyof import('react').Component<any, {}, any>>;
+    className?: string;
+    dismissible?: never;
+    onClose?: never;
+}
+export declare const CardPrimaryTopBadge: ({ $isSelected, className, ...props }: CardPrimaryTopBadgeProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/CardPromotion/CardPromotion.d.ts

@@ -6,4 +6,4 @@ export interface CardPromotionProps extends HTMLAttributes<HTMLDivElement> {
     icon: IconName;
     dismissible?: boolean;
 }
-export declare const CardPromotion: ({ label, icon, dismissible, ...props }: CardPromotionProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const CardPromotion: ({ label, icon, dismissible, className, ...props }: CardPromotionProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/components/CardSecondary/CardSecondary.d.ts

@@ -17,4 +17,4 @@ export interface CardSecondaryProps extends HTMLAttributes<HTMLDivElement> {
     infoIcon?: IconName;
     infoIconSize?: IconSize;
 }
-export declare const CardSecondary: ({ title, icon, iconUrl, badgeState, badgeText, hasShadow, disabled, description, infoUrl, infoText, infoIcon, infoIconSize, ...props }: CardSecondaryProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CardSecondary: ({ title, icon, iconUrl, badgeState, badgeText, hasShadow, disabled, description, infoUrl, infoText, infoIcon, infoIconSize, className, ...props }: CardSecondaryProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Checkbox/Checkbox.d.ts

@@ -7,4 +7,4 @@ export interface CheckboxProps extends RadixCheckbox.CheckboxProps {
     variant?: CheckboxVariants;
     dir?: "start" | "end";
 }
-export declare const Checkbox: ({ id, label, variant, disabled, orientation, dir, checked, ...delegated }: CheckboxProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Checkbox: ({ id, label, variant, disabled, orientation, dir, checked, className, ...delegated }: CheckboxProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/CodeBlock/CodeBlock.d.ts

@@ -11,5 +11,5 @@ interface Props extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "onCop
     onCopy?: (value: string) => void | Promise<void>;
     onCopyError?: (error: string) => void | Promise<void>;
 }
-export declare const CodeBlock: ({ children, language, theme, showLineNumbers, showWrapButton, wrapLines, onCopy, onCopyError, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const CodeBlock: ({ children, language, theme, showLineNumbers, showWrapButton, wrapLines, onCopy, onCopyError, className, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/CodeBlock/useColorStyle.d.ts

@@ -1,6 +1,6 @@
 import { CodeThemeType } from './CodeBlock';
 
-declare const useColorStyle: (defaultTheme?: CodeThemeType) => {
+declare const useColorStyle: (themeOverride?: CodeThemeType) => {
     hljs: {
         display: string;
         overflowX: string;

package/dist/components/Collapsible/Collapsible.d.ts

@@ -6,14 +6,14 @@ export interface CollapsibleProps extends HTMLAttributes<HTMLDivElement> {
     onOpenChange?: (value: boolean) => void;
 }
 export declare const Collapsible: {
-    ({ open: openProp, onOpenChange: onOpenChangeProp, children, ...props }: CollapsibleProps): import("react/jsx-runtime").JSX.Element;
+    ({ open: openProp, onOpenChange: onOpenChangeProp, children, className, ...props }: CollapsibleProps): import("react/jsx-runtime").JSX.Element;
     Header: import('react').ForwardRefExoticComponent<CollapsipleHeaderProps & import('react').RefAttributes<HTMLDivElement>>;
     Trigger: {
-        ({ onClick: onClickProp, children, indicatorDir, icon, iconDir, ...props }: CollapsipleTriggerProps): import("react/jsx-runtime").JSX.Element;
+        ({ onClick: onClickProp, children, indicatorDir, icon, iconDir, className, ...props }: CollapsipleTriggerProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
     Content: {
-        ({ indicatorDir, ...props }: HTMLAttributes<HTMLDivElement> & {
+        ({ indicatorDir, className, ...props }: HTMLAttributes<HTMLDivElement> & {
             indicatorDir?: HorizontalDirection;
         }): import("react/jsx-runtime").JSX.Element | undefined;
         displayName: string;

package/dist/components/Container/Container.d.ts

@@ -1,5 +1,6 @@
-import { ComponentProps, ElementType, ReactNode } from 'react';
-import { Orientation } from '..';
+import { ElementType } from 'react';
+import { Orientation } from '../types';
+import { PolymorphicComponent, PolymorphicComponentProps } from '../../utils/polymorphic';
 
 type AlignItemsOptions = "start" | "center" | "end" | "stretch";
 export type GapOptions = "none" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl";
@@ -7,8 +8,7 @@ type GrowShrinkOptions = "0" | "1" | "2" | "3" | "4" | "5" | "6";
 type JustifyContentOptions = "center" | "space-between" | "space-around" | "space-evenly" | "start" | "end" | "left" | "right";
 export type PaddingOptions = "none" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl";
 type WrapOptions = "nowrap" | "wrap" | "wrap-reverse";
-export interface ContainerProps<T extends ElementType = "div"> {
-    component?: T;
+export interface ContainerProps<T extends ElementType = "div"> extends PolymorphicComponentProps<T> {
     alignItems?: AlignItemsOptions;
     children?: React.ReactNode;
     fillWidth?: boolean;
@@ -27,6 +27,5 @@ export interface ContainerProps<T extends ElementType = "div"> {
     minHeight?: string;
     overflow?: string;
 }
-type ContainerPolymorphicComponent = <T extends ElementType = "div">(props: Omit<ComponentProps<T>, keyof T> & ContainerProps<T>) => ReactNode;
-export declare const Container: ContainerPolymorphicComponent;
+export declare const Container: PolymorphicComponent<ContainerProps>;
 export {};

package/dist/components/DatePicker/Common.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { default as React, ReactNode } from 'react';
 import { useCalendar, UseCalendarOptions } from '@h6s/calendar';
 
 interface DatePickerInputProps {
@@ -18,12 +18,17 @@ interface DateRangePickerInputProps {
     selectedStartDate?: Date;
 }
 export declare const DateRangePickerInput: ({ isActive, disabled, id, placeholder, selectedEndDate, selectedStartDate, }: DateRangePickerInputProps) => import("react/jsx-runtime").JSX.Element;
-export declare const DateTableCell: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, {
+interface DateTableCellProps {
     $isCurrentMonth?: boolean;
     $isDisabled?: boolean;
     $isSelected?: boolean;
     $isToday?: boolean;
-}>> & string;
+    children?: React.ReactNode;
+    onClick?: () => void;
+    onMouseEnter?: () => void;
+    onMouseLeave?: () => void;
+}
+export declare const DateTableCell: ({ $isCurrentMonth, $isDisabled, $isSelected, $isToday, children, onClick, onMouseEnter, onMouseLeave, ...props }: DateTableCellProps) => import("react/jsx-runtime").JSX.Element;
 export type Body = ReturnType<typeof useCalendar>["body"];
 interface CalendarRendererProps {
     calendarOptions?: UseCalendarOptions;

package/dist/components/Dialog/Dialog.d.ts

@@ -5,7 +5,7 @@ import * as RadixDialog from "@radix-ui/react-dialog";
 export declare const Dialog: {
     ({ children, ...props }: RadixDialog.DialogProps): import("react/jsx-runtime").JSX.Element;
     Trigger: {
-        ({ children, asChild, ...props }: RadixDialog.DialogTriggerProps): import("react/jsx-runtime").JSX.Element;
+        ({ children, asChild, className, ...props }: RadixDialog.DialogTriggerProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
     Close: {
@@ -13,7 +13,7 @@ export declare const Dialog: {
         displayName: string;
     };
     Content: {
-        ({ title, children, showClose, onClose, forceMount, container, showOverlay, reducePadding, ...props }: DialogContentProps): import("react/jsx-runtime").JSX.Element;
+        ({ title, children, showClose, onClose, forceMount, container, showOverlay, reducePadding, className, ...props }: DialogContentProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
 };

package/dist/components/EllipsisContent/EllipsisContent.d.ts

@@ -1,8 +1,6 @@
-import { ComponentProps, ElementType, ReactNode } from 'react';
+import { ElementType } from 'react';
+import { PolymorphicComponent, PolymorphicComponentProps } from '../../utils/polymorphic';
 
-export interface EllipsisContentProps<T extends ElementType = "div"> {
-    component?: T;
+export interface EllipsisContentProps<T extends ElementType = "div"> extends PolymorphicComponentProps<T> {
 }
-type EllipsisPolymorphicComponent = <T extends ElementType = "div">(props: Omit<ComponentProps<T>, keyof T> & EllipsisContentProps<T>) => ReactNode;
-export declare const EllipsisContent: EllipsisPolymorphicComponent;
-export {};
+export declare const EllipsisContent: PolymorphicComponent<EllipsisContentProps>;

package/dist/components/FileTabs/FileTabs.d.ts

@@ -29,7 +29,7 @@ export interface FileTabsProps extends Omit<ReactSortableProps<ItemInterface>, "
 export declare const FileTabs: {
     ({ selectedIndex, children, onReorderTab, onClose: onCloseProp, onSelect: onSelectProp, list: listProp, setList: setListProp, onEnd, direction, group, ...props }: FileTabsProps): import("react/jsx-runtime").JSX.Element;
     Tab: {
-        ({ text, index, icon, onMouseDown: onMouseDownProp, status, testId, preview, ...props }: FileTabProps): import("react/jsx-runtime").JSX.Element;
+        ({ text, index, icon, onMouseDown: onMouseDownProp, status, testId, preview, className, ...props }: FileTabProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
 };
@@ -38,5 +38,5 @@ interface FileTabElementProps extends HTMLAttributes<HTMLDivElement> {
     active?: boolean;
     preview?: boolean;
 }
-export declare const FileTabElement: ({ icon, children, active, preview, ...props }: FileTabElementProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FileTabElement: ({ icon, children, active, preview, className, ...props }: FileTabElementProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Flyout/Flyout.d.ts

@@ -32,7 +32,7 @@ export declare const Flyout: {
         displayName: string;
     };
     Footer: {
-        (props: FlyoutFooterProps): import("react/jsx-runtime").JSX.Element;
+        ({ type, ...props }: FlyoutFooterProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
     CodeBlock: ({ statement, language, wrapLines, showLineNumbers, showWrapButton, onCopy, onCopyError, ...props }: FlyoutCodeBlockProps & ElementProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/GenericMenu.d.ts

@@ -1,10 +1,22 @@
-export declare const GenericMenuPanel: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    $type: "popover" | "dropdown-menu" | "context-menu";
-    $showArrow?: boolean;
-}>> & string;
-export declare const GenericPopoverMenuPanel: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    $type: "popover" | "hover-card";
-    $showArrow?: boolean;
-}>> & string;
-export declare const Arrow: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').SVGProps<SVGSVGElement>, never>> & string;
-export declare const GenericMenuItem: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+import { default as React } from 'react';
+
+interface GenericMenuPanelProps extends React.HTMLAttributes<HTMLDivElement> {
+    type: "popover" | "dropdown-menu" | "context-menu";
+    showArrow?: boolean;
+    children: React.ReactNode;
+}
+export declare const GenericMenuPanel: React.FC<GenericMenuPanelProps>;
+interface GenericPopoverMenuPanelProps extends React.HTMLAttributes<HTMLDivElement> {
+    type: "popover" | "hover-card";
+    showArrow?: boolean;
+    children: React.ReactNode;
+}
+export declare const GenericPopoverMenuPanel: React.FC<GenericPopoverMenuPanelProps>;
+interface ArrowProps extends React.SVGAttributes<SVGSVGElement> {
+}
+export declare const Arrow: React.FC<ArrowProps>;
+interface GenericMenuItemProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+}
+export declare const GenericMenuItem: React.ForwardRefExoticComponent<GenericMenuItemProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/Grid/Cell.d.ts

@@ -1,8 +1,9 @@
+import { default as React } from 'react';
 import { GridChildComponentProps } from 'react-window';
 import { ItemDataType } from './types';
 
 type CellProps = GridChildComponentProps<ItemDataType> & {
     width: number;
 };
-export declare const Cell: import('react').MemoExoticComponent<({ data, rowIndex, columnIndex, style, ...props }: CellProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const Cell: React.MemoExoticComponent<({ data, rowIndex, columnIndex, style, ...props }: CellProps) => import("react/jsx-runtime").JSX.Element>;
 export {};

package/dist/components/Grid/StyledCell.d.ts

@@ -1,6 +1,7 @@
+import { default as React } from 'react';
 import { SelectionType } from './types';
 
-export declare const StyledCell: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+interface StyledCellProps extends React.HTMLAttributes<HTMLDivElement> {
     $isFocused: boolean;
     $selectionType: SelectionType;
     $isSelectedTop: boolean;
@@ -13,4 +14,6 @@ export declare const StyledCell: import('styled-components/dist/types').IStyledC
     $type?: "body" | "header";
     $showBorder: boolean;
     $rowAutoHeight?: boolean;
-}>> & string;
+}
+export declare const StyledCell: React.ForwardRefExoticComponent<StyledCellProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/Grid/types.d.ts

@@ -69,7 +69,7 @@ export interface RectangleSelection {
     anchor: SelectionPos;
 }
 export type SelectedRegion = EmptySelection | RowsSelection | ColumnsSelection | RectangleSelection;
-export type RoundedType = "none" | "lg" | "md" | "sm";
+export type RoundedType = "none" | "sm" | "md" | "lg" | "xl";
 export type KeyEventType = "keypress" | "click";
 export type onSelectFn = (action: SelectionAction, selction: SelectedRegion, focus: SelectionFocus) => void;
 type IsAllSelectedType = {

package/dist/components/GridContainer/GridContainer.d.ts

@@ -1,11 +1,11 @@
-import { ComponentProps, ElementType, ReactNode } from 'react';
+import { ElementType } from 'react';
+import { PolymorphicComponent, PolymorphicComponentProps } from '../../utils/polymorphic';
 
 export type FlowOptions = "row" | "column" | "row-dense" | "column-dense";
 type GapOptions = "none" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "unset";
 type ItemsOptions = "start" | "center" | "end" | "stretch";
 type ContentOptions = "center" | "space-between" | "space-around" | "space-evenly" | "start" | "stretch" | "end" | "left" | "right";
-export interface GridContainerProps<T extends ElementType = "div"> {
-    component?: T;
+export interface GridContainerProps<T extends ElementType = "div"> extends PolymorphicComponentProps<T> {
     alignItems?: ItemsOptions;
     alignContent?: ContentOptions;
     children?: React.ReactNode;
@@ -31,6 +31,5 @@ export interface GridContainerProps<T extends ElementType = "div"> {
     minWidth?: string;
     overflow?: string;
 }
-type GridContainerPolymorphicComponent = <T extends ElementType = "div">(props: Omit<ComponentProps<T>, keyof T> & GridContainerProps<T>) => ReactNode;
-export declare const GridContainer: GridContainerPolymorphicComponent;
+export declare const GridContainer: PolymorphicComponent<GridContainerProps>;
 export {};

package/dist/components/Icon/IconCommon.d.ts

@@ -53,6 +53,7 @@ export declare const ICONS_MAP: {
     "credit-card": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     data: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     database: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
+    "data-lakes": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     disk: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     display: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     document: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
@@ -82,7 +83,7 @@ export declare const ICONS_MAP: {
     hexagon: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     history: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     home: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
-    "horizontal-loading": import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').SVGAttributes<SVGElement>, never>> & string & Omit<(props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element, keyof import('react').Component<any, {}, any>>;
+    "horizontal-loading": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     http: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     "http-monitoring": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     "info-in-circle": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
@@ -99,8 +100,8 @@ export declare const ICONS_MAP: {
     "line-in-circle": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     "list-bulleted": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     "list-numbered": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
-    loading: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').SVGAttributes<SVGElement>, never>> & string & Omit<(props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element, keyof import('react').Component<any, {}, any>>;
-    "loading-animated": import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('styled-components').FastOmit<import('react').SVGAttributes<SVGElement>, never>, never>> & string;
+    loading: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
+    "loading-animated": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     lock: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     mcp: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     metrics: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/types.d.ts

@@ -6,11 +6,13 @@ import { PaymentName, PaymentProps } from '../icons/Payments';
 
 export type IconSize = "xs" | "sm" | "md" | "lg" | "xl" | "xxl";
 export type IconState = "default" | "success" | "warning" | "danger" | "info";
-export declare const ICON_NAMES: readonly ["activity", "alarm", "arrow-down", "arrow-left", "arrow-right", "arrow-triangle", "arrow-directions", "arrow-up", "auth-app", "auth-sms", "backups", "bar-chart", "bell", "beta", "blog", "bold", "book", "brackets", "briefcase", "building", "burger-menu", "calendar", "calendar-with-time", "cards", "cell-tower", "chat", "chart-area", "chart-bar-horizontal", "chart-donut", "chart-heatmap", "chart-scatter", "chart-stacked-horizontal", "chart-stacked-vertical", "check", "check-in-circle", "chevron-down", "chevron-left", "chevron-right", "chevron-up", "circle", "clock", "cloud", "cloud-keys", "code", "code-in-square", "connect", "connect-alt", "console", "copy", "cpu", "cross", "credit-card", "data", "database", "disk", "display", "document", "dot", "dots-horizontal", "dots-triangle", "dots-vertical", "dots-vertical-double", "double-check", "download", "download-in-circle", "email", "empty", "enter", "eye", "eye-closed", "filter", "fire", "flag", "flask", "folder-closed", "folder-open", "gear", "gift", "git-merge", "globe", "hexagon", "history", "horizontal-loading", "home", "http", "http-monitoring", "info-in-circle", "information", "insert-row", "integrations", "italic", "key", "keys", "lifebuoy", "light-bulb", "light-bulb-on", "lightening", "line-in-circle", "list-bulleted", "list-numbered", "loading", "loading-animated", "lock", "metrics", "metrics-alt", "minus", "mcp", "moon", "no-cloud", "pause", "payment", "pencil", "pie-chart", "pipe", "play", "play-in-circle", "plus", "popout", "puzzle-piece", "query", "question", "refresh", "rocket", "sandglass", "search", "secure", "server", "services", "settings", "share", "share-arrow", "share-network", "slide-in", "slide-out", "sort-alt", "sort", "sparkle", "speaker", "speed", "square", "star", "stop", "support", "table", "taxi", "text-slash", "trash", "tree-structure", "upgrade", "upload", "url", "user", "users", "underline", "warning", "waves"];
+export declare const ICON_NAMES: readonly ["activity", "alarm", "arrow-down", "arrow-left", "arrow-right", "arrow-triangle", "arrow-directions", "arrow-up", "auth-app", "auth-sms", "backups", "bar-chart", "bell", "beta", "blog", "bold", "book", "brackets", "briefcase", "building", "burger-menu", "calendar", "calendar-with-time", "cards", "cell-tower", "chat", "chart-area", "chart-bar-horizontal", "chart-donut", "chart-heatmap", "chart-scatter", "chart-stacked-horizontal", "chart-stacked-vertical", "check", "check-in-circle", "chevron-down", "chevron-left", "chevron-right", "chevron-up", "circle", "clock", "cloud", "cloud-keys", "code", "code-in-square", "connect", "connect-alt", "console", "copy", "cpu", "cross", "credit-card", "data", "database", "data-lakes", "disk", "display", "document", "dot", "dots-horizontal", "dots-triangle", "dots-vertical", "dots-vertical-double", "double-check", "download", "download-in-circle", "email", "empty", "enter", "eye", "eye-closed", "filter", "fire", "flag", "flask", "folder-closed", "folder-open", "gear", "gift", "git-merge", "globe", "hexagon", "history", "horizontal-loading", "home", "http", "http-monitoring", "info-in-circle", "information", "insert-row", "integrations", "italic", "key", "keys", "lifebuoy", "light-bulb", "light-bulb-on", "lightening", "line-in-circle", "list-bulleted", "list-numbered", "loading", "loading-animated", "lock", "metrics", "metrics-alt", "minus", "mcp", "moon", "no-cloud", "pause", "payment", "pencil", "pie-chart", "pipe", "play", "play-in-circle", "plus", "popout", "puzzle-piece", "query", "question", "refresh", "rocket", "sandglass", "search", "secure", "server", "services", "settings", "share", "share-arrow", "share-network", "slide-in", "slide-out", "sort-alt", "sort", "sparkle", "speaker", "speed", "square", "star", "stop", "support", "table", "taxi", "text-slash", "trash", "tree-structure", "upgrade", "upload", "url", "user", "users", "underline", "warning", "waves"];
 export type IconName = (typeof ICON_NAMES)[number];
 export interface IconProps extends SVGAttributes<HTMLOrSVGElement> {
     name: IconName;
     color?: string;
+    width?: string | number;
+    height?: string | number;
     size?: IconSize;
     state?: IconState;
 }

package/dist/components/IconWrapper/IconWrapper.d.ts

@@ -1,9 +1,9 @@
-import { ReactNode } from 'react';
+import { default as React, ReactNode } from 'react';
 import { HorizontalDirection, IconName } from '..';
 import { GapOptions } from '../Container/Container';
 import { IconSize } from '../Icon/types';
 
-interface IconWrapperProps {
+interface IconWrapperProps extends React.HTMLAttributes<HTMLDivElement> {
     icon?: IconName;
     iconDir?: HorizontalDirection;
     size?: IconSize;

package/dist/components/Input/InputWrapper.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { default as React, ReactNode } from 'react';
 
 export interface WrapperProps {
     className?: string;
@@ -13,20 +13,27 @@ export interface WrapperProps {
     resize?: "none" | "vertical" | "horizontal" | "both";
 }
 export declare const InputWrapper: ({ className, id, label, labelColor, error, disabled, children, orientation, dir, resize, }: WrapperProps) => import("react/jsx-runtime").JSX.Element;
-export declare const InputElement: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {
-    $hasStartContent?: boolean;
-    $hasEndContent?: boolean;
-}>> & string;
-export declare const NumberInputElement: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<Omit<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "$hasStartContent" | "$hasEndContent"> & {
-    $hasStartContent?: boolean;
-    $hasEndContent?: boolean;
-}, "ref"> & {
-    ref?: ((instance: HTMLInputElement | null) => void | import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import('react').RefObject<HTMLInputElement> | null | undefined;
-}, {
-    $hideControls?: boolean;
-}>> & string;
-export declare const TextAreaElement: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, never>> & string;
-export declare const IconButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
-export declare const IconWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').SVGProps<SVGSVGElement>, never>> & string;
-export declare const InputStartContent: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const InputEndContent: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export interface InputElementProps extends React.InputHTMLAttributes<HTMLInputElement> {
+    hasStartContent?: boolean;
+    hasEndContent?: boolean;
+}
+export declare const InputElement: React.ForwardRefExoticComponent<InputElementProps & React.RefAttributes<HTMLInputElement>>;
+export interface NumberInputElementProps extends InputElementProps {
+    hideControls?: boolean;
+}
+export declare const NumberInputElement: React.ForwardRefExoticComponent<NumberInputElementProps & React.RefAttributes<HTMLInputElement>>;
+export interface TextAreaElementProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
+}
+export declare const TextAreaElement: React.ForwardRefExoticComponent<TextAreaElementProps & React.RefAttributes<HTMLTextAreaElement>>;
+export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+}
+export declare const IconButton: ({ className, ...props }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
+export interface IconWrapperProps extends React.SVGAttributes<SVGElement> {
+}
+export declare const IconWrapper: ({ className, ...props }: IconWrapperProps) => import("react/jsx-runtime").JSX.Element;
+export interface InputStartContentProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+export declare const InputStartContent: ({ className, ...props }: InputStartContentProps) => import("react/jsx-runtime").JSX.Element;
+export interface InputEndContentProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+export declare const InputEndContent: ({ className, ...props }: InputEndContentProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Link/Link.d.ts

@@ -1,15 +1,13 @@
-import { ComponentProps, ElementType, ReactEventHandler, ReactNode } from 'react';
+import { ElementType, ReactEventHandler } from 'react';
 import { IconName } from '..';
 import { TextSize, TextWeight } from '../commonTypes';
+import { PolymorphicComponent, PolymorphicComponentProps } from '../../utils/polymorphic';
 
-export interface LinkProps<T extends ElementType = "a"> {
+export interface LinkProps<T extends ElementType = "a"> extends PolymorphicComponentProps<T> {
     size?: TextSize;
     weight?: TextWeight;
     onClick?: ReactEventHandler;
     children?: React.ReactNode;
     icon?: IconName;
-    component?: T;
 }
-type LinkPolymorphicComponent = <T extends ElementType = "a">(props: Omit<ComponentProps<T>, keyof T> & LinkProps<T>) => ReactNode;
-export declare const Link: LinkPolymorphicComponent;
-export {};
+export declare const Link: PolymorphicComponent<LinkProps, "a">;