welcome-ui 7.2.0 → 7.4.0

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

@@ -1,4 +1,5 @@
 import { default as React } from 'react';
+import { Size } from './theme';
 import { CreateWuiProps } from '../System';
 import * as S from './styles';
 type IconContent = {
@@ -9,7 +10,6 @@ type IconContent = {
     viewBox?: string;
     width?: number;
 };
-type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | number | string;
 export interface IconOptions {
     content?: IconContent;
     name?: string;

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

@@ -1,10 +1,7 @@
 import { ThemeValues } from '../../theme';
-export type ThemeIcons = {
-    lg: string;
-    md: string;
-    sm: string;
-    xl: string;
-    xs: string;
-    xxl: string;
-};
+import { LiteralUnion } from '../../utils';
+type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
+export type Size = LiteralUnion<IconSize, number | string>;
+export type ThemeIcons = Record<IconSize, string>;
 export declare const getIcons: ({ toRem }: ThemeValues) => ThemeIcons;
+export {};

package/dist/types/components/IconsFont/index.d.ts

@@ -1,7 +1,7 @@
 import { StyledIconProps } from './styles';
 import { IconProps } from '../Icon';
 export type IconsFontProps = StyledIconProps;
-export declare const IconsFontStyled: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, StyledIconProps, never>;
+export declare const IconsFontStyled: import('styled-components').StyledComponent<"i", import('@xstyled/system').Theme, StyledIconProps, never>;
 type FormatIconJSX<S extends string> = S extends `${infer F}${infer R}` ? F extends '_' ? FormatIconJSX<Capitalize<R>> : `${F}${FormatIconJSX<R>}` : '';
 declare const unicodeMap: {
     actions: string;

package/dist/types/components/IconsFont/styles.d.ts

@@ -4,4 +4,4 @@ export type StyledIconProps = {
     name: keyof typeof unicodeMap;
     size: IconOptions['size'];
 };
-export declare const Icon: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, StyledIconProps, never>;
+export declare const Icon: import('styled-components').StyledComponent<"i", import('@xstyled/system').Theme, StyledIconProps, never>;

package/dist/types/components/InputText/styles.d.ts

@@ -1,3 +1,3 @@
 import { InputTextOptions } from './index';
-export declare const InputText: import('styled-components').StyledComponent<"input", import('@xstyled/system').Theme, Pick<InputTextOptions, "transparent" | "size" | "variant" | "iconPlacement" | "isClearable">, never>;
-export declare const Wrapper: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const InputText: import('styled-components').StyledComponent<"input", import('@xstyled/system').Theme, Pick<InputTextOptions, "size" | "transparent" | "iconPlacement" | "isClearable" | "variant">, never>;
+export declare const Wrapper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;

package/dist/types/components/Label/styles.d.ts

@@ -2,4 +2,4 @@ export declare const Label: import('styled-components').StyledComponent<"label",
     required: boolean;
 }, never>;
 export declare const requiredStyles: import('styled-components').FlattenSimpleInterpolation;
-export declare const Disabled: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const Disabled: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;

package/dist/types/components/Loader/index.d.ts

@@ -1,6 +1,6 @@
 import { CSSObject } from '@xstyled/styled-components';
-import { CreateWuiProps, ExtraSize } from '../System';
-type Size = 'xs' | 'sm' | 'md' | 'lg' | ExtraSize;
+import { Size } from './theme';
+import { CreateWuiProps } from '../System';
 export interface LoaderOptions {
     color?: CSSObject['color'];
     /** Predefined size xs, sm, md, lg or custom size */
@@ -8,4 +8,3 @@ export interface LoaderOptions {
 }
 export type LoaderProps = CreateWuiProps<'div', LoaderOptions>;
 export declare const Loader: import('../System').CreateWuiComponent<"div", LoaderProps>;
-export {};

package/dist/types/components/Loader/theme.d.ts

@@ -1,8 +1,7 @@
 import { ThemeValues } from '../../theme';
-export type ThemeLoaders = {
-    lg: string;
-    md: string;
-    sm: string;
-    xs: string;
-};
+import { LiteralUnion } from '../../utils';
+type LoaderSize = 'xs' | 'sm' | 'md' | 'lg';
+export type Size = LiteralUnion<LoaderSize, string | number>;
+export type ThemeLoaders = Record<LoaderSize, string>;
 export declare const getLoaders: ({ toRem }: ThemeValues) => ThemeLoaders;
+export {};

package/dist/types/components/Logo/styles.d.ts

@@ -1 +1 @@
-export declare const Svg: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, import('@xstyled/util').Props<import('@xstyled/system').Theme> & import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
+export declare const Svg: import('styled-components').StyledComponent<"svg", import('@xstyled/system').Theme, import('@xstyled/util').Props<import('@xstyled/system').Theme> & import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;

package/dist/types/components/Modal/Assets/Iframe.d.ts

@@ -1,5 +1,6 @@
+import { default as React } from 'react';
 type IframeProps = {
     children: JSX.Element;
 };
-export declare const Iframe: ({ children }: IframeProps) => JSX.Element;
+export declare const Iframe: ({ children }: IframeProps) => React.JSX.Element;
 export {};

package/dist/types/components/Modal/Assets/index.d.ts

@@ -1,4 +1,4 @@
-export declare const Assets: string & import('styled-components').StyledComponentBase<string, import('@xstyled/system').Theme, {}, never> & import('hoist-non-react-statics').NonReactStatics<never, {}> & {
+export declare const Assets: string & import('styled-components').StyledComponentBase<"div", import('@xstyled/system').Theme, {}, never> & import('hoist-non-react-statics').NonReactStatics<never, {}> & {
     AssetWithTitle: import('../../System').CreateWuiComponent<"div", {
         children: React.ReactNode;
         customContent?: JSX.Element | string;
@@ -9,9 +9,9 @@ export declare const Assets: string & import('styled-components').StyledComponen
     Content: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
     Iframe: ({ children }: {
         children: JSX.Element;
-    }) => JSX.Element;
+    }) => import("react").JSX.Element;
     Title: import('styled-components').StyledComponent<import('../../System').CreateWuiComponent<"p", import('../../Text').TextProps>, import('@xstyled/system').Theme, {
         lines: 2;
         variant: "h4";
-    }, "lines" | "variant">;
+    }, "variant" | "lines">;
 };

package/dist/types/components/Modal/Assets/styles.d.ts

@@ -1,7 +1,7 @@
-export declare const Iframe: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const Iframe: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
 export declare const Content: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
-export declare const Dialog: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const Dialog: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
 export declare const Title: import('styled-components').StyledComponent<import('../../System').CreateWuiComponent<"p", import('../../Text').TextProps>, import('@xstyled/system').Theme, {
     lines: 2;
     variant: "h4";
-}, "lines" | "variant">;
+}, "variant" | "lines">;

package/dist/types/components/Modal/Close.d.ts

@@ -1,6 +1,7 @@
+import { default as React } from 'react';
 import { CloseButtonProps } from '../CloseButton';
 type CloseProps = CloseButtonProps & {
     isOnHeader?: boolean;
 };
-export declare const Close: ({ isOnHeader, ...rest }: CloseProps) => JSX.Element;
+export declare const Close: ({ isOnHeader, ...rest }: CloseProps) => React.JSX.Element;
 export {};

package/dist/types/components/Modal/index.d.ts

@@ -1,9 +1,9 @@
 import { default as React } from 'react';
+import { Size } from './theme';
 import { As, CreateWuiProps } from '../System';
 import { BoxProps } from '../Box';
 import { ShapeProps } from '../Shape';
 import * as Ariakit from '@ariakit/react';
-type Size = 'xs' | 'sm' | 'md' | 'lg' | 'auto';
 export interface ModalOptions extends Omit<Ariakit.DialogOptions<'div'>, 'as'> {
     ariaLabel: string;
     children: React.ReactElement;
@@ -33,7 +33,7 @@ export declare const Modal: import('../System').CreateWuiComponent<"div", ModalP
     Footer: import('../System').CreateWuiComponent<"div", import('./Footer').FooterProps>;
     Cover: React.FC<ShapeProps>;
 };
-export declare const AssetModal: string & import('styled-components').StyledComponentBase<string, import('@xstyled/system').Theme, {}, never> & import('hoist-non-react-statics').NonReactStatics<never, {}> & {
+export declare const AssetModal: string & import('styled-components').StyledComponentBase<"div", import('@xstyled/system').Theme, {}, never> & import('hoist-non-react-statics').NonReactStatics<never, {}> & {
     AssetWithTitle: import('../System').CreateWuiComponent<"div", {
         children: React.ReactNode;
         customContent?: JSX.Element | string;
@@ -44,10 +44,10 @@ export declare const AssetModal: string & import('styled-components').StyledComp
     Content: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
     Iframe: ({ children }: {
         children: JSX.Element;
-    }) => JSX.Element;
+    }) => React.JSX.Element;
     Title: import('styled-components').StyledComponent<import('../System').CreateWuiComponent<"p", import('../Text').TextProps>, import('@xstyled/system').Theme, {
         lines: 2;
         variant: "h4";
-    }, "lines" | "variant">;
+    }, "variant" | "lines">;
 };
 export {};

package/dist/types/components/Modal/theme.d.ts

@@ -1,6 +1,6 @@
 import { CSSObject } from '@xstyled/styled-components';
 import { ThemeValues } from '../../theme';
-type Sizes = 'xs' | 'sm' | 'md' | 'lg' | 'auto';
+export type Size = 'xs' | 'sm' | 'md' | 'lg' | 'auto';
 export type ThemeModals = {
     backdrop: CSSObject;
     body: CSSObject;
@@ -9,9 +9,8 @@ export type ThemeModals = {
     footer: CSSObject;
     gutter: string;
     header: CSSObject;
-    sizes: Record<Sizes, {
+    sizes: Record<Size, {
         width?: string;
     }>;
 };
 export declare const getModals: (theme: ThemeValues) => ThemeModals;
-export {};

package/dist/types/components/Pagination/styles.d.ts

@@ -1,7 +1,7 @@
-export declare const Pagination: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, import('@xstyled/util').Props<import('@xstyled/system').Theme> & import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
-export declare const List: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const Pagination: import('styled-components').StyledComponent<"nav", import('@xstyled/system').Theme, import('@xstyled/util').Props<import('@xstyled/system').Theme> & import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
+export declare const List: import('styled-components').StyledComponent<"ul", import('@xstyled/system').Theme, {}, never>;
 export declare const Item: import('styled-components').StyledComponent<"li", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
-export declare const Dots: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const Dots: import('styled-components').StyledComponent<"span", import('@xstyled/system').Theme, {}, never>;
 export declare const abstractLinkStyle: import('styled-components').FlattenInterpolation<import('styled-components').ThemeProps<import('@xstyled/system').Theme>>;
 export declare const ArrowLink: import('styled-components').StyledComponent<"a", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
 export declare const PageLink: import('styled-components').StyledComponent<"a", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;

package/dist/types/components/Popover/Arrow.d.ts

@@ -1,6 +1,7 @@
+import { default as React } from 'react';
 import { UsePopover } from './usePopover';
 type ArrowProps = {
     store: UsePopover;
 };
-export declare const Arrow: ({ store }: ArrowProps) => JSX.Element;
+export declare const Arrow: ({ store }: ArrowProps) => React.JSX.Element;
 export {};

package/dist/types/components/Popover/Content.d.ts

@@ -1,3 +1,4 @@
+import { default as React } from 'react';
 import { UsePopover, UsePopoverHover } from './usePopover';
 import { PopoverProps } from './Popover';
 export interface ContentOptions {
@@ -6,4 +7,4 @@ export interface ContentOptions {
     onClose?: () => void;
     store: UsePopover | UsePopoverHover;
 }
-export declare const Content: ({ children, onClose, store }: ContentOptions) => JSX.Element;
+export declare const Content: ({ children, onClose, store }: ContentOptions) => React.JSX.Element;

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

@@ -8,7 +8,7 @@ export interface PopoverOptions extends Ariakit.PopoverProps {
 }
 export type PopoverProps = CreateWuiProps<'div', PopoverOptions>;
 export declare const Popover: import('../System').CreateWuiComponent<"div", PopoverProps> & {
-    Content: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
-    Title: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+    Content: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
+    Title: import('styled-components').StyledComponent<"h6", import('@xstyled/system').Theme, {}, never>;
     Trigger: import('../System').CreateWuiComponent<"button", import('./Trigger').PopoverTriggerProps>;
 };

package/dist/types/components/Popover/PopoverHover.d.ts

@@ -8,7 +8,7 @@ export interface PopoverHoverOptions extends Ariakit.HovercardProps {
 }
 export type PopoverHoverProps = CreateWuiProps<'div', PopoverHoverOptions>;
 export declare const PopoverHover: import('../System').CreateWuiComponent<"div", PopoverHoverProps> & {
-    Content: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
-    Title: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+    Content: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
+    Title: import('styled-components').StyledComponent<"h6", import('@xstyled/system').Theme, {}, never>;
     Trigger: import('../System').CreateWuiComponent<"button", import('./Trigger').PopoverHoverTriggerProps>;
 };

package/dist/types/components/Popover/styles.d.ts

@@ -3,8 +3,8 @@ export declare const Arrow: import('styled-components').StyledComponent<(props:
 export declare const ArrowItem: import('styled-components').StyledComponent<"svg", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme> & {
     $transform: string;
 }, never>;
-export declare const Content: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
-export declare const Title: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const Content: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
+export declare const Title: import('styled-components').StyledComponent<"h6", import('@xstyled/system').Theme, {}, never>;
 export declare const Popover: import('styled-components').StyledComponent<(props: Ariakit.PopoverProps<"div">) => import("react/jsx-runtime").JSX.Element | null, import('@xstyled/system').Theme, {
     $withCloseButton: boolean;
 }, never>;

package/dist/types/components/Radio/styles.d.ts

@@ -2,6 +2,6 @@ import { RadioProps } from './index';
 import * as Ariakit from '@ariakit/react';
 export declare const Radio: import('styled-components').StyledComponent<(props: Ariakit.RadioProps) => import('react').ReactElement<any, string | import('react').JSXElementConstructor<any>>, import('@xstyled/system').Theme, RadioProps, never>;
 export declare const Label: import('styled-components').StyledComponent<import('../System').CreateWuiComponent<"label", import('../Label').LabelProps>, import('@xstyled/system').Theme, {}, never>;
-export declare const Input: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const Input: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
 export declare const Wrapper: import('styled-components').StyledComponent<import('../System').CreateWuiComponent<"div", import('../Box').BoxProps>, import('@xstyled/system').Theme, {}, never>;
-export declare const LabelWithHint: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const LabelWithHint: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;

package/dist/types/components/RadioTab/styles.d.ts

@@ -1,7 +1,7 @@
 import { WuiProps } from '../System';
 import * as Ariakit from '@ariakit/react';
 export declare const Radio: import('styled-components').StyledComponent<(props: Ariakit.RadioProps) => import('react').ReactElement<any, string | import('react').JSXElementConstructor<any>>, import('@xstyled/system').Theme, {}, never>;
-export declare const Label: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {
+export declare const Label: import('styled-components').StyledComponent<"label", import('@xstyled/system').Theme, {
     checked?: boolean;
     disabled?: boolean;
     disabledIcon?: React.ReactElement;
@@ -14,5 +14,5 @@ export declare const Label: import('styled-components').StyledComponent<string,
     transparent?: boolean;
     variant: "danger" | "success" | "warning";
 }>, never>;
-export declare const Input: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
-export declare const Content: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const Input: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
+export declare const Content: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;

package/dist/types/components/Search/styles.d.ts

@@ -1,15 +1,15 @@
 import { SearchOptions } from './index';
 export declare const Wrapper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, import('@xstyled/util').Props<import('@xstyled/system').Theme> & import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
-export declare const InputWrapper: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const InputWrapper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
 export declare const Input: import('styled-components').StyledComponent<"input", import('@xstyled/system').Theme, SearchOptions, never>;
-export declare const Menu: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
-export declare const Item: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {
+export declare const Menu: import('styled-components').StyledComponent<"ul", import('@xstyled/system').Theme, {}, never>;
+export declare const Item: import('styled-components').StyledComponent<"li", import('@xstyled/system').Theme, {
     isExisting?: boolean;
     isHighlighted?: boolean;
     isSelected?: boolean;
 }, never>;
-export declare const Indicators: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
-export declare const DropDownIndicator: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {
+export declare const Indicators: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
+export declare const DropDownIndicator: import('styled-components').StyledComponent<"button", import('@xstyled/system').Theme, {
     isOpen?: boolean;
     size: SearchOptions["size"];
 }, never>;

package/dist/types/components/Select/styles.d.ts

@@ -7,7 +7,7 @@ export declare const IconWrapper: import('styled-components').StyledComponent<"d
 export declare const Wrapper: import('styled-components').StyledComponent<import('../System').CreateWuiComponent<"div", import('../Box').BoxProps>, import('@xstyled/system').Theme, {
     disabled: boolean;
 }, never>;
-export declare const InputWrapper: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const InputWrapper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
 export declare const Input: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
     iconPlacement?: "both" | "right";
     isClearable?: boolean;
@@ -15,8 +15,8 @@ export declare const Input: import('styled-components').StyledComponent<"div", i
     transparent?: boolean;
     variant: SelectOptions["variant"];
 }, never>;
-export declare const Menu: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
-export declare const Item: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {
+export declare const Menu: import('styled-components').StyledComponent<"ul", import('@xstyled/system').Theme, {}, never>;
+export declare const Item: import('styled-components').StyledComponent<"li", import('@xstyled/system').Theme, {
     allowUnselectFromList: boolean;
     isDisabled?: boolean;
     isHighlighted: boolean;
@@ -26,7 +26,7 @@ export declare const Item: import('styled-components').StyledComponent<string, i
 export declare const Indicators: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme> & {
     size: DefaultFieldStylesProps["size"];
 }, never>;
-export declare const DropDownIndicator: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {
+export declare const DropDownIndicator: import('styled-components').StyledComponent<"button", import('@xstyled/system').Theme, {
     isOpen?: boolean;
 }, never>;
 export declare const Tags: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;

package/dist/types/components/Slider/styles.d.ts

@@ -2,8 +2,8 @@ type BorderProps = {
     borderSelectorColor?: string;
     disabled?: boolean;
 };
-export declare const Slider: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, BorderProps, never>;
-export declare const RangeInput: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, BorderProps, never>;
+export declare const Slider: import('styled-components').StyledComponent<"input", import('@xstyled/system').Theme, BorderProps, never>;
+export declare const RangeInput: import('styled-components').StyledComponent<"input", import('@xstyled/system').Theme, BorderProps, never>;
 export declare const Track: import('styled-components').StyledComponent<import('../System').CreateWuiComponent<"div", import('../Box').BoxProps>, import('@xstyled/system').Theme, {}, never>;
 type RangeProps = {
     disabled?: boolean;

package/dist/types/components/Swiper/index.d.ts

@@ -74,7 +74,7 @@ export type SwiperInitialProps = {
 };
 export type SwiperProps = CreateWuiProps<'div', SwiperInitialProps>;
 export declare const Swiper: {
-    ({ children, dataTestId, store, ...rest }: SwiperProps): JSX.Element;
+    ({ children, dataTestId, store, ...rest }: SwiperProps): React.JSX.Element;
     displayName: string;
 };
-export declare const StyledSwiper: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, CreateWuiProps<"div">, never>;
+export declare const StyledSwiper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, CreateWuiProps<"div">, never>;

package/dist/types/components/Swiper/styles.d.ts

@@ -1,5 +1,5 @@
 import { CreateWuiProps } from '../System';
-export declare const Swiper: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, CreateWuiProps<"div">, never>;
+export declare const Swiper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, CreateWuiProps<"div">, never>;
 export declare const Arrow: import('styled-components').StyledComponent<import('../System').CreateWuiComponent<"button", import('../Button').ButtonProps>, import('@xstyled/system').Theme, {
     disabled: boolean;
 } & Pick<{
@@ -68,7 +68,7 @@ export declare const Pagination: import('styled-components').StyledComponent<"di
     showLeftArrow: boolean;
     showRightArrow: boolean;
 }, "withPagination">, never>;
-export declare const Bullet: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {
+export declare const Bullet: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
     active: boolean;
 } & Pick<{
     centeredSlides: boolean;

package/dist/types/components/System/index.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from 'react';
+import { default as React, PropsWithoutRef } from 'react';
 import { SystemProps } from '@xstyled/styled-components';
 import { StyledConfig } from 'styled-components';
 import * as S from '@xstyled/styled-components';
@@ -36,5 +36,4 @@ export type CreateWuiComponent<Component extends As, Options = {}> = {
     (props: CreateWuiProps<Component, Options>): JSX.Element;
     displayName?: string;
 };
-export declare const forwardRef: <Component extends As, Props = {}>(component: React.ForwardRefRenderFunction<any, Props>) => CreateWuiComponent<Component, Props>;
-export type ExtraSize = number | string;
+export declare const forwardRef: <Component extends As, Props = {}>(component: React.ForwardRefRenderFunction<any, PropsWithoutRef<Props>>) => CreateWuiComponent<Component, Props>;

package/dist/types/components/Table/index.d.ts

@@ -12,7 +12,7 @@ export declare const Table: import('../System').CreateWuiComponent<"div", TableP
     Tbody: import('styled-components').StyledComponent<"tbody", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
     Th: import('styled-components').StyledComponent<"th", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
     Tr: import('styled-components').StyledComponent<"tr", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme> & {
-        variant?: "default" | "danger" | "warning" | "success" | "info";
+        variant?: "default" | "danger" | "warning" | "info" | "success";
     }, never>;
     Td: import('styled-components').StyledComponent<"td", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
 };

package/dist/types/components/Table/styles.d.ts

@@ -1,6 +1,6 @@
 import { TableOptions } from './index';
 export declare const Wrapper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme> & TableOptions, never>;
-export declare const Content: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const Content: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
 export declare const Table: import('styled-components').StyledComponent<"table", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
 export declare const Thead: import('styled-components').StyledComponent<"thead", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;
 export declare const Tbody: import('styled-components').StyledComponent<"tbody", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, never>;

package/dist/types/components/Tabs/styles.d.ts

@@ -4,6 +4,6 @@ import * as Ariakit from '@ariakit/react';
 export declare const TabList: import('styled-components').StyledComponent<(props: Ariakit.TabListProps) => import('react').ReactElement<any, string | import('react').JSXElementConstructor<any>>, import('@xstyled/system').Theme, {
     size: SizeOptions;
 }, never>;
-export declare const Tab: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const Tab: import('styled-components').StyledComponent<"button", import('@xstyled/system').Theme, {}, never>;
 export declare const TabPanel: import('styled-components').StyledComponent<(props: Ariakit.TabPanelProps) => import('react').ReactElement<any, string | import('react').JSXElementConstructor<any>>, import('@xstyled/system').Theme, Pick<Ariakit.TabStoreState, "orientation">, never>;
-export declare const ActiveBar: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, ActiveBarReturn, never>;
+export declare const ActiveBar: import('styled-components').StyledComponent<"span", import('@xstyled/system').Theme, ActiveBarReturn, never>;

package/dist/types/components/Tag/index.d.ts

@@ -11,4 +11,4 @@ export interface TagOptions {
 }
 export type TagProps = CreateWuiProps<'div', TagOptions>;
 export declare const Tag: import('../System').CreateWuiComponent<"div", TagProps>;
-export declare const StyledTag: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, S.StyledTagProps & import('../System').WuiProps, never>;
+export declare const StyledTag: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, S.StyledTagProps & import('../System').WuiProps, never>;

package/dist/types/components/Tag/styles.d.ts

@@ -8,7 +8,7 @@ export interface StyledTagProps {
     size: TagOptions['size'];
     variant: TagOptions['variant'];
 }
-export declare const Tag: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, StyledTagProps & WuiProps, never>;
+export declare const Tag: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, StyledTagProps & WuiProps, never>;
 export declare const ActionIcon: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme> & {
     size: TagOptions["size"];
 }, never>;

package/dist/types/components/Text/index.d.ts

@@ -1,3 +1,4 @@
+import { CSSProperties } from 'react';
 import { CreateWuiProps } from '../System';
 declare const TAG_NAMES: {
     h0: string;
@@ -19,6 +20,7 @@ export interface TextOptions {
     lines?: number;
     variant?: Variant;
     withDash?: boolean;
+    wordBreak?: CSSProperties['wordBreak'];
 }
 export type TextProps = CreateWuiProps<'p', TextOptions>;
 export declare const Text: import('../System').CreateWuiComponent<"p", TextProps>;

package/dist/types/components/Text/styles.d.ts

@@ -1,2 +1,2 @@
 import { TextOptions } from './index';
-export declare const Text: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, TextOptions, never>;
+export declare const Text: import('styled-components').StyledComponent<"p", import('@xstyled/system').Theme, TextOptions, never>;

package/dist/types/components/TimePicker/styles.d.ts

@@ -1 +1 @@
-export declare const Wrapper: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const Wrapper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;

package/dist/types/components/Toast/Growl.d.ts

@@ -1,9 +1,10 @@
+import { ToastVariant } from './theme';
 import { CreateWuiProps } from '../System';
 export interface GrowlOptions {
     hasCloseButton?: boolean;
     icon?: JSX.Element | null;
     onClose?: () => void;
-    variant?: 'default' | 'info' | 'success' | 'danger' | 'warning';
+    variant?: ToastVariant;
 }
 export type GrowlProps = CreateWuiProps<'div', GrowlOptions>;
 /**

package/dist/types/components/Toast/Snackbar.d.ts

@@ -1,3 +1,4 @@
+import { ToastVariant } from './theme';
 import { ButtonProps } from '../Button';
 import { CreateWuiProps } from '../System';
 export interface SnackbarOptions {
@@ -8,7 +9,7 @@ export interface SnackbarOptions {
     hasCloseButton?: boolean;
     icon?: JSX.Element | null;
     onClose?: () => void;
-    variant?: 'default' | 'info' | 'success' | 'danger' | 'warning';
+    variant?: ToastVariant;
 }
 export type SnackbarProps = CreateWuiProps<'div', SnackbarOptions>;
 /**

package/dist/types/components/Toast/theme.d.ts

@@ -1,5 +1,6 @@
 import { CSSObject } from '@xstyled/styled-components';
 import { ThemeValues } from '../../theme';
+export type ToastVariant = 'default' | 'info' | 'success' | 'danger' | 'warning';
 export type ThemeToasts = {
     bottom: CSSObject;
     default: CSSObject;

package/dist/types/components/Toggle/index.d.ts

@@ -1,6 +1,6 @@
+import { Size } from './theme';
 import { CheckboxProps } from '../Checkbox';
 import { CreateWuiProps } from '../System';
-type Size = 'xs' | 'sm' | 'md';
 export type ToggleOptions = Omit<CheckboxProps, 'Component' | 'iconPlacement' | 'indeterminate' | 'hasIcon' | 'transparent' | 'isClearable'> & {
     checkedIcon?: JSX.Element;
     size?: Size;
@@ -8,4 +8,3 @@ export type ToggleOptions = Omit<CheckboxProps, 'Component' | 'iconPlacement' |
 };
 export type ToggleProps = CreateWuiProps<'input', ToggleOptions>;
 export declare const Toggle: import('../System').CreateWuiComponent<"input", ToggleProps>;
-export {};

package/dist/types/components/Toggle/styles.d.ts

@@ -1,6 +1,6 @@
+import { Size } from './theme';
 import { ToggleOptions } from './index';
 import * as Ariakit from '@ariakit/react';
-type Size = 'xs' | 'sm' | 'md';
 export declare const Toggle: import('styled-components').StyledComponent<(props: Ariakit.CheckboxProps) => import('react').ReactElement<any, string | import('react').JSXElementConstructor<any>>, import('@xstyled/system').Theme, ToggleOptions, never>;
 export declare const Wrapper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme> & {
     onClick: React.MouseEventHandler<HTMLInputElement>;
@@ -9,4 +9,3 @@ export declare const IconWrapper: import('styled-components').StyledComponent<"d
     checked: boolean;
     size: Size;
 }, never>;
-export {};

package/dist/types/components/Toggle/theme.d.ts

@@ -1,10 +1,11 @@
 import { CSSObject } from '@xstyled/styled-components';
 import { ThemeValues } from '../../theme';
-type State = 'default' | 'checked' | 'disabled' | 'sizes';
+export type Size = 'xs' | 'sm' | 'md';
+type State = 'default' | 'checked' | 'disabled';
 export type ThemeToggles = {
-    after: Record<State, CSSObject>;
+    after: Record<State | 'sizes', CSSObject>;
     icon: Record<'sizes' | 'position', CSSObject>;
-    item: Record<State, CSSObject>;
+    item: Record<State | 'sizes', CSSObject>;
 };
 export declare const getToggles: (theme: ThemeValues) => ThemeToggles;
 export {};

package/dist/types/components/Tooltip/styles.d.ts

@@ -6,5 +6,5 @@ type FadeIn = {
     withArrow?: boolean;
 };
 export declare const FadeIn: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme> & FadeIn, never>;
-export declare const ChildItem: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, {}, never>;
+export declare const ChildItem: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
 export {};

package/dist/types/theme/index.d.ts

@@ -117,6 +117,7 @@ export interface ThemeValues extends XStyledTheme, StyledComponentsTheme {
     variantIcon: ThemeVariantIcon;
 }
 export type ThemeFontsUrl = 'https://cdn.welcome-ui.com/fonts' | 'https://cdn.welcometothejungle.com/fonts' | string;
+export type ThemeColorTokens = keyof ThemeColors;
 export type ThemeProps = {
     [param: string]: unknown;
     defaultFontFamily?: string;

package/dist/types/utils/index.d.ts

@@ -7,3 +7,4 @@ export * from './use-copy-text';
 export * from './use-fork-ref';
 export * from './use-isomorphic-layout-effect';
 export * from './use-viewport';
+export * from './ts-utils';