@refinn/core-ui 0.1.2 → 0.1.4

package/README.md

@@ -1,3 +1,24 @@
+## Design tokens
+
+`src/preset/theme.css` is **generated** — do not edit it by hand.
+
+- Base/semantic colors, radius, and shadows come from `tokens/*.json` (Figma export via the
+  [lukasoppermann/design-tokens](https://github.com/lukasoppermann/design-tokens) plugin).
+- Component-specific tokens (Button, Checkbox, Toast, typography scale, …) live in
+  `src/preset/theme.components.css` and are hand-written — edit that file instead.
+
+Workflow when the design team ships a new export:
+
+1. Replace `tokens/core.tokens.json` and `tokens/design.tokens.json` with the new files.
+2. Run `npm run build:tokens` and review the diff in `src/preset/theme.css`.
+3. Run `npm run check:tokens` (also runs in CI) — it fails if theme.css is stale or if a
+   component still references a `var(--...)` that no longer exists.
+4. Commit and open a PR. A new color family or an existing group's new keys flow through
+   automatically (with a console warning); a brand-new component group requires a small edit
+   to `scripts/build-theme.mjs` (see `PENDING_GROUPS`, `NAME_OVERRIDES`, `VALUE_OVERRIDES`).
+
+---
+
 This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
 
 ## Getting Started

package/dist/index.d.mts

@@ -16,11 +16,11 @@ interface AccordionProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'
 }
 declare const Accordion: react.ForwardRefExoticComponent<AccordionProps & react.RefAttributes<HTMLDivElement>>;
 
-type AlertVariant = 'none' | 'info' | 'danger' | 'warning' | 'success';
-type AlertMode = 'page' | 'section' | 'inline';
+type AlertVariant$1 = 'none' | 'info' | 'danger' | 'warning' | 'success';
+type AlertMode$1 = 'page' | 'section' | 'inline';
 interface AlertBannerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
-    variant?: AlertVariant;
-    mode?: AlertMode;
+    variant?: AlertVariant$1;
+    mode?: AlertMode$1;
     title?: ReactNode;
     description?: ReactNode;
     action?: [string?, string?];
@@ -54,8 +54,14 @@ interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
 }
 declare const Badge: react.ForwardRefExoticComponent<BadgeProps & react.RefAttributes<HTMLSpanElement>>;
 
-type ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'contrast' | 'transparent';
-type ButtonSize = 'small' | 'medium' | 'large' | 'extra-large';
+type BrandingType = "black" | "white" | "brand";
+interface BrandingProps extends HTMLAttributes<HTMLDivElement> {
+    type?: BrandingType;
+}
+declare const Branding: react.ForwardRefExoticComponent<BrandingProps & react.RefAttributes<HTMLDivElement>>;
+
+type ButtonVariant = "primary" | "secondary" | "tertiary" | "contrast" | "transparent";
+type ButtonSize = "sm" | "md" | "lg" | "xl";
 interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     variant?: ButtonVariant;
     size?: ButtonSize;
@@ -94,10 +100,25 @@ interface CheckboxProps extends InputHTMLAttributes<HTMLInputElement> {
 }
 declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<HTMLInputElement>>;
 
+type ChipSize = "sm" | "md" | "lg";
+interface ChipProps extends HTMLAttributes<HTMLDivElement> {
+    size?: ChipSize;
+    src?: string;
+    alt?: string;
+    label: string;
+    icon?: ReactNode;
+    isOutlined?: boolean;
+    isDark?: boolean;
+    defaultSelected?: boolean;
+    disabled?: boolean;
+}
+declare const Chip: react.ForwardRefExoticComponent<ChipProps & react.RefAttributes<HTMLDivElement>>;
+
 interface DialogProps extends HTMLAttributes<HTMLSpanElement> {
     isForceOpen?: boolean;
     setIsForceOpen?: (val: boolean) => void;
     isClosedAble?: boolean;
+    isCloseIcon?: boolean;
     children: ReactNode;
     startModalBtn?: ReactElement<{
         onClick?: (e: react__default.MouseEvent) => void;
@@ -107,9 +128,40 @@ interface DialogProps extends HTMLAttributes<HTMLSpanElement> {
     }>;
     afterStopBtn?: ReactElement<() => void>;
     p?: string;
+    maxW?: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl";
 }
 declare const Dialog: react__default.ForwardRefExoticComponent<DialogProps & react__default.RefAttributes<HTMLSpanElement>>;
 
+interface DropdownItemsInterface {
+    label: string;
+    value: string;
+}
+interface DropdownProps {
+    error?: string;
+    label?: string;
+    placeholder?: string;
+    isDisabled?: boolean;
+    isSearchable?: boolean;
+    isTextCenter?: boolean;
+    value: DropdownItemsInterface;
+    setValue: (value: DropdownItemsInterface) => void;
+    dropDownItems?: DropdownItemsInterface[];
+}
+declare const Dropdown: react__default.FC<DropdownProps>;
+
+type AlertVariant = 'info' | 'success' | 'warning' | 'danger' | 'common';
+type AlertMode = 'inline' | 'page';
+interface FinancialLogoProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    variant?: AlertVariant;
+    mode?: AlertMode;
+    title?: ReactNode;
+    description?: ReactNode;
+    action?: ReactNode;
+    icon?: ReactNode;
+    onClose?: () => void;
+}
+declare const FinancialLogo: react.ForwardRefExoticComponent<FinancialLogoProps & react.RefAttributes<HTMLDivElement>>;
+
 type IconSize = 16 | 20 | 24;
 type IconWeight = 100 | 200 | 300 | 400 | 500 | 600 | 700;
 type IconGrade = -25 | 0 | 200;
@@ -123,16 +175,46 @@ interface IconProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
 }
 declare const Icon: react.ForwardRefExoticComponent<IconProps & react.RefAttributes<HTMLSpanElement>>;
 
-type RadioSize = 'small' | 'medium';
-interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {
+type LinkVariant = 'xs' | 'sm' | 'md' | 'lg';
+type LinkStyle = 'brand' | 'white' | 'black' | 'brandLooped' | 'whiteLooped' | 'blackLooped';
+interface LinkProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    variant?: LinkVariant;
+    isInline?: boolean;
+    linkStyle?: LinkStyle;
+    text?: ReactNode;
+    href?: string;
+    icon?: boolean;
+}
+declare const Link: react.ForwardRefExoticComponent<LinkProps & react.RefAttributes<HTMLDivElement>>;
+
+type LoadingSize = "sm" | "lg";
+interface LoadingProps extends HTMLAttributes<HTMLDivElement> {
+    size?: LoadingSize;
+    isDark?: boolean;
+}
+declare const Loading: react.ForwardRefExoticComponent<LoadingProps & react.RefAttributes<HTMLDivElement>>;
+
+type RadioSize = "sm" | "md";
+interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> {
     size?: RadioSize;
     label?: ReactNode;
     description?: ReactNode;
     error?: boolean;
-    contrast?: boolean;
 }
 declare const Radio: react.ForwardRefExoticComponent<RadioProps & react.RefAttributes<HTMLInputElement>>;
 
+type SegmentControlSize = "sm" | "md" | "lg";
+interface SegmentControlProps extends HTMLAttributes<HTMLDivElement> {
+    size?: SegmentControlSize;
+    items: {
+        label: string;
+        value: string;
+    }[];
+    selected: string;
+    setSelected?: (value: string) => void;
+}
+declare const SegmentControl: react.ForwardRefExoticComponent<SegmentControlProps & react.RefAttributes<HTMLDivElement>>;
+
 type SliderSize = 'small' | 'medium' | 'large';
 interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'onChange'> {
     size?: SliderSize;
@@ -150,6 +232,54 @@ interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'
 }
 declare const Slider: react.ForwardRefExoticComponent<SliderProps & react.RefAttributes<HTMLInputElement>>;
 
+type TabSize = "md" | "lg";
+interface TabProps extends HTMLAttributes<HTMLDivElement> {
+    size?: TabSize;
+    label: string;
+    value: string;
+    isDisabled?: boolean;
+    selected: string;
+    setSelected?: (value: string) => void;
+}
+declare const Tab: react.ForwardRefExoticComponent<TabProps & react.RefAttributes<HTMLDivElement>>;
+
+interface TextAreaProps extends HTMLAttributes<HTMLTextAreaElement> {
+    maxText?: number;
+    height?: number;
+    error?: string;
+    label?: string;
+    placeholder?: string;
+    description?: string;
+    icon?: string;
+    isDisabled?: boolean;
+    isLoading?: boolean;
+    isVertify?: boolean;
+    isClearable?: boolean;
+    disabled?: boolean;
+    value?: string;
+    onChange?: (event: react__default.ChangeEvent<HTMLTextAreaElement>) => void;
+}
+declare const TextArea: react__default.ForwardRefExoticComponent<TextAreaProps & react__default.RefAttributes<HTMLTextAreaElement>>;
+
+type TextFieldSize = "md" | "lg";
+interface TextFieldProps extends HTMLAttributes<HTMLInputElement> {
+    inputSize?: TextFieldSize;
+    error?: string;
+    label?: string;
+    placeholder?: string;
+    description?: string;
+    icon?: string;
+    isDisabled?: boolean;
+    isLoading?: boolean;
+    isVertify?: boolean;
+    isUnrequired?: boolean;
+    isClearable?: boolean;
+    disabled?: boolean;
+    value?: string;
+    onChange?: (event: react__default.ChangeEvent<HTMLInputElement>) => void;
+}
+declare const TextField: react__default.ForwardRefExoticComponent<TextFieldProps & react__default.RefAttributes<HTMLInputElement>>;
+
 type ToastType = 'default' | 'progress' | 'error';
 interface ToastProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
     type?: ToastType;
@@ -160,4 +290,23 @@ interface ToastProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
 }
 declare const Toast: react.ForwardRefExoticComponent<ToastProps & react.RefAttributes<HTMLDivElement>>;
 
-export { Accordion, type AccordionItemData, type AccordionProps, AlertBanner, type AlertBannerProps, Avatar, type AvatarProps, Badge, type BadgeProps, BottomSheet, type BottomSheetProps, Button, type ButtonProps, Checkbox, type CheckboxProps, Dialog, type DialogProps, Icon, type IconProps, Radio, type RadioProps, Slider, type SliderProps, Toast, type ToastProps };
+interface ToggleSwitchProps extends HTMLAttributes<HTMLLabelElement> {
+    value: string;
+    isDisabled?: boolean;
+    isSelected: boolean;
+    setIsSelected?: (value: boolean) => void;
+}
+declare const ToggleSwitch: react.ForwardRefExoticComponent<ToggleSwitchProps & react.RefAttributes<HTMLLabelElement>>;
+
+type TooltipSize = "sm" | "md" | "lg";
+type TooltipPosition = "right" | "top" | "left" | "bottom";
+interface TooltipProps extends HTMLAttributes<HTMLDivElement> {
+    size?: TooltipSize;
+    children: ReactNode;
+    headText?: string;
+    text?: string;
+    position?: TooltipPosition;
+}
+declare const Tooltip: react__default.ForwardRefExoticComponent<TooltipProps & react__default.RefAttributes<HTMLDivElement>>;
+
+export { Accordion, type AccordionItemData, type AccordionProps, AlertBanner, type AlertBannerProps, Avatar, type AvatarProps, Badge, type BadgeProps, BottomSheet, type BottomSheetProps, Branding, type BrandingProps, Button, type ButtonProps, Checkbox, type CheckboxProps, Chip, type ChipProps, Dialog, type DialogProps, Dropdown, type DropdownItemsInterface, type DropdownProps, FinancialLogo, type FinancialLogoProps, Icon, type IconProps, Link, type LinkProps, Loading, type LoadingProps, Radio, type RadioProps, SegmentControl, type SegmentControlProps, Slider, type SliderProps, Tab, type TabProps, TextArea, type TextAreaProps, TextField, type TextFieldProps, Toast, type ToastProps, ToggleSwitch, type ToggleSwitchProps, Tooltip, type TooltipProps };

package/dist/index.d.ts

@@ -16,11 +16,11 @@ interface AccordionProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'
 }
 declare const Accordion: react.ForwardRefExoticComponent<AccordionProps & react.RefAttributes<HTMLDivElement>>;
 
-type AlertVariant = 'none' | 'info' | 'danger' | 'warning' | 'success';
-type AlertMode = 'page' | 'section' | 'inline';
+type AlertVariant$1 = 'none' | 'info' | 'danger' | 'warning' | 'success';
+type AlertMode$1 = 'page' | 'section' | 'inline';
 interface AlertBannerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
-    variant?: AlertVariant;
-    mode?: AlertMode;
+    variant?: AlertVariant$1;
+    mode?: AlertMode$1;
     title?: ReactNode;
     description?: ReactNode;
     action?: [string?, string?];
@@ -54,8 +54,14 @@ interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
 }
 declare const Badge: react.ForwardRefExoticComponent<BadgeProps & react.RefAttributes<HTMLSpanElement>>;
 
-type ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'contrast' | 'transparent';
-type ButtonSize = 'small' | 'medium' | 'large' | 'extra-large';
+type BrandingType = "black" | "white" | "brand";
+interface BrandingProps extends HTMLAttributes<HTMLDivElement> {
+    type?: BrandingType;
+}
+declare const Branding: react.ForwardRefExoticComponent<BrandingProps & react.RefAttributes<HTMLDivElement>>;
+
+type ButtonVariant = "primary" | "secondary" | "tertiary" | "contrast" | "transparent";
+type ButtonSize = "sm" | "md" | "lg" | "xl";
 interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     variant?: ButtonVariant;
     size?: ButtonSize;
@@ -94,10 +100,25 @@ interface CheckboxProps extends InputHTMLAttributes<HTMLInputElement> {
 }
 declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<HTMLInputElement>>;
 
+type ChipSize = "sm" | "md" | "lg";
+interface ChipProps extends HTMLAttributes<HTMLDivElement> {
+    size?: ChipSize;
+    src?: string;
+    alt?: string;
+    label: string;
+    icon?: ReactNode;
+    isOutlined?: boolean;
+    isDark?: boolean;
+    defaultSelected?: boolean;
+    disabled?: boolean;
+}
+declare const Chip: react.ForwardRefExoticComponent<ChipProps & react.RefAttributes<HTMLDivElement>>;
+
 interface DialogProps extends HTMLAttributes<HTMLSpanElement> {
     isForceOpen?: boolean;
     setIsForceOpen?: (val: boolean) => void;
     isClosedAble?: boolean;
+    isCloseIcon?: boolean;
     children: ReactNode;
     startModalBtn?: ReactElement<{
         onClick?: (e: react__default.MouseEvent) => void;
@@ -107,9 +128,40 @@ interface DialogProps extends HTMLAttributes<HTMLSpanElement> {
     }>;
     afterStopBtn?: ReactElement<() => void>;
     p?: string;
+    maxW?: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl";
 }
 declare const Dialog: react__default.ForwardRefExoticComponent<DialogProps & react__default.RefAttributes<HTMLSpanElement>>;
 
+interface DropdownItemsInterface {
+    label: string;
+    value: string;
+}
+interface DropdownProps {
+    error?: string;
+    label?: string;
+    placeholder?: string;
+    isDisabled?: boolean;
+    isSearchable?: boolean;
+    isTextCenter?: boolean;
+    value: DropdownItemsInterface;
+    setValue: (value: DropdownItemsInterface) => void;
+    dropDownItems?: DropdownItemsInterface[];
+}
+declare const Dropdown: react__default.FC<DropdownProps>;
+
+type AlertVariant = 'info' | 'success' | 'warning' | 'danger' | 'common';
+type AlertMode = 'inline' | 'page';
+interface FinancialLogoProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    variant?: AlertVariant;
+    mode?: AlertMode;
+    title?: ReactNode;
+    description?: ReactNode;
+    action?: ReactNode;
+    icon?: ReactNode;
+    onClose?: () => void;
+}
+declare const FinancialLogo: react.ForwardRefExoticComponent<FinancialLogoProps & react.RefAttributes<HTMLDivElement>>;
+
 type IconSize = 16 | 20 | 24;
 type IconWeight = 100 | 200 | 300 | 400 | 500 | 600 | 700;
 type IconGrade = -25 | 0 | 200;
@@ -123,16 +175,46 @@ interface IconProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
 }
 declare const Icon: react.ForwardRefExoticComponent<IconProps & react.RefAttributes<HTMLSpanElement>>;
 
-type RadioSize = 'small' | 'medium';
-interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {
+type LinkVariant = 'xs' | 'sm' | 'md' | 'lg';
+type LinkStyle = 'brand' | 'white' | 'black' | 'brandLooped' | 'whiteLooped' | 'blackLooped';
+interface LinkProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    variant?: LinkVariant;
+    isInline?: boolean;
+    linkStyle?: LinkStyle;
+    text?: ReactNode;
+    href?: string;
+    icon?: boolean;
+}
+declare const Link: react.ForwardRefExoticComponent<LinkProps & react.RefAttributes<HTMLDivElement>>;
+
+type LoadingSize = "sm" | "lg";
+interface LoadingProps extends HTMLAttributes<HTMLDivElement> {
+    size?: LoadingSize;
+    isDark?: boolean;
+}
+declare const Loading: react.ForwardRefExoticComponent<LoadingProps & react.RefAttributes<HTMLDivElement>>;
+
+type RadioSize = "sm" | "md";
+interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> {
     size?: RadioSize;
     label?: ReactNode;
     description?: ReactNode;
     error?: boolean;
-    contrast?: boolean;
 }
 declare const Radio: react.ForwardRefExoticComponent<RadioProps & react.RefAttributes<HTMLInputElement>>;
 
+type SegmentControlSize = "sm" | "md" | "lg";
+interface SegmentControlProps extends HTMLAttributes<HTMLDivElement> {
+    size?: SegmentControlSize;
+    items: {
+        label: string;
+        value: string;
+    }[];
+    selected: string;
+    setSelected?: (value: string) => void;
+}
+declare const SegmentControl: react.ForwardRefExoticComponent<SegmentControlProps & react.RefAttributes<HTMLDivElement>>;
+
 type SliderSize = 'small' | 'medium' | 'large';
 interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'onChange'> {
     size?: SliderSize;
@@ -150,6 +232,54 @@ interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'
 }
 declare const Slider: react.ForwardRefExoticComponent<SliderProps & react.RefAttributes<HTMLInputElement>>;
 
+type TabSize = "md" | "lg";
+interface TabProps extends HTMLAttributes<HTMLDivElement> {
+    size?: TabSize;
+    label: string;
+    value: string;
+    isDisabled?: boolean;
+    selected: string;
+    setSelected?: (value: string) => void;
+}
+declare const Tab: react.ForwardRefExoticComponent<TabProps & react.RefAttributes<HTMLDivElement>>;
+
+interface TextAreaProps extends HTMLAttributes<HTMLTextAreaElement> {
+    maxText?: number;
+    height?: number;
+    error?: string;
+    label?: string;
+    placeholder?: string;
+    description?: string;
+    icon?: string;
+    isDisabled?: boolean;
+    isLoading?: boolean;
+    isVertify?: boolean;
+    isClearable?: boolean;
+    disabled?: boolean;
+    value?: string;
+    onChange?: (event: react__default.ChangeEvent<HTMLTextAreaElement>) => void;
+}
+declare const TextArea: react__default.ForwardRefExoticComponent<TextAreaProps & react__default.RefAttributes<HTMLTextAreaElement>>;
+
+type TextFieldSize = "md" | "lg";
+interface TextFieldProps extends HTMLAttributes<HTMLInputElement> {
+    inputSize?: TextFieldSize;
+    error?: string;
+    label?: string;
+    placeholder?: string;
+    description?: string;
+    icon?: string;
+    isDisabled?: boolean;
+    isLoading?: boolean;
+    isVertify?: boolean;
+    isUnrequired?: boolean;
+    isClearable?: boolean;
+    disabled?: boolean;
+    value?: string;
+    onChange?: (event: react__default.ChangeEvent<HTMLInputElement>) => void;
+}
+declare const TextField: react__default.ForwardRefExoticComponent<TextFieldProps & react__default.RefAttributes<HTMLInputElement>>;
+
 type ToastType = 'default' | 'progress' | 'error';
 interface ToastProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
     type?: ToastType;
@@ -160,4 +290,23 @@ interface ToastProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
 }
 declare const Toast: react.ForwardRefExoticComponent<ToastProps & react.RefAttributes<HTMLDivElement>>;
 
-export { Accordion, type AccordionItemData, type AccordionProps, AlertBanner, type AlertBannerProps, Avatar, type AvatarProps, Badge, type BadgeProps, BottomSheet, type BottomSheetProps, Button, type ButtonProps, Checkbox, type CheckboxProps, Dialog, type DialogProps, Icon, type IconProps, Radio, type RadioProps, Slider, type SliderProps, Toast, type ToastProps };
+interface ToggleSwitchProps extends HTMLAttributes<HTMLLabelElement> {
+    value: string;
+    isDisabled?: boolean;
+    isSelected: boolean;
+    setIsSelected?: (value: boolean) => void;
+}
+declare const ToggleSwitch: react.ForwardRefExoticComponent<ToggleSwitchProps & react.RefAttributes<HTMLLabelElement>>;
+
+type TooltipSize = "sm" | "md" | "lg";
+type TooltipPosition = "right" | "top" | "left" | "bottom";
+interface TooltipProps extends HTMLAttributes<HTMLDivElement> {
+    size?: TooltipSize;
+    children: ReactNode;
+    headText?: string;
+    text?: string;
+    position?: TooltipPosition;
+}
+declare const Tooltip: react__default.ForwardRefExoticComponent<TooltipProps & react__default.RefAttributes<HTMLDivElement>>;
+
+export { Accordion, type AccordionItemData, type AccordionProps, AlertBanner, type AlertBannerProps, Avatar, type AvatarProps, Badge, type BadgeProps, BottomSheet, type BottomSheetProps, Branding, type BrandingProps, Button, type ButtonProps, Checkbox, type CheckboxProps, Chip, type ChipProps, Dialog, type DialogProps, Dropdown, type DropdownItemsInterface, type DropdownProps, FinancialLogo, type FinancialLogoProps, Icon, type IconProps, Link, type LinkProps, Loading, type LoadingProps, Radio, type RadioProps, SegmentControl, type SegmentControlProps, Slider, type SliderProps, Tab, type TabProps, TextArea, type TextAreaProps, TextField, type TextFieldProps, Toast, type ToastProps, ToggleSwitch, type ToggleSwitchProps, Tooltip, type TooltipProps };