@aws-amplify/ui 4.1.0 → 5.1.0

package/dist/types/theme/tokens/components/button.d.ts

@@ -1,83 +1,40 @@
-import { AlignItemsValue, BackgroundColorValue, BorderColorValue, BorderRadiusValue, BorderStyleValue, BorderWidthValue, BoxShadowValue, ColorValue, DesignToken, FontSizeValue, FontWeightValue, JustifyContentValue, LineHeightValue, SpaceValue, TransitionDurationValue } from '../types/designToken';
-export interface StateTokens {
-    color: DesignToken<ColorValue>;
-    backgroundColor: DesignToken<BackgroundColorValue>;
-    borderColor: DesignToken<BorderColorValue>;
-}
-interface StateWithShadowTokens extends StateTokens {
-    boxShadow: DesignToken<BoxShadowValue>;
-}
-interface MenuStateDisabledTokens extends Omit<StateTokens, 'borderColor' | 'backgroundColor'> {
-}
-interface MenuStateTokens extends Omit<StateTokens, 'borderColor'> {
-}
-interface PrimaryVariationTokens {
-    borderWidth: DesignToken<BorderWidthValue>;
-    borderStyle: DesignToken<BorderStyleValue>;
-    borderColor: DesignToken<BorderColorValue>;
-    backgroundColor: DesignToken<BackgroundColorValue>;
-    color: DesignToken<ColorValue>;
-    _disabled: StateTokens;
-    _loading: StateTokens;
-    _hover: StateTokens;
-    _focus: StateWithShadowTokens;
-    _active: StateTokens;
-}
-interface MenuVariationTokens {
-    borderWidth: DesignToken<BorderWidthValue>;
-    backgroundColor: DesignToken<BackgroundColorValue>;
-    justifyContent: DesignToken<JustifyContentValue>;
-    _hover: MenuStateTokens;
-    _focus: MenuStateTokens;
-    _active: MenuStateTokens;
-    _disabled: MenuStateDisabledTokens;
-}
-interface LinkVariationTokens {
-    backgroundColor: DesignToken<BackgroundColorValue>;
-    borderColor: DesignToken<BorderColorValue>;
-    borderWidth: DesignToken<BorderWidthValue>;
-    color: DesignToken<ColorValue>;
-    _hover: StateTokens;
-    _focus: StateWithShadowTokens;
-    _active: StateTokens;
-    _disabled: StateTokens;
-    _loading: StateTokens;
-}
-interface ButtonSizeTokens {
-    fontSize: DesignToken<FontSizeValue>;
-    paddingBlockStart: DesignToken<SpaceValue>;
-    paddingBlockEnd: DesignToken<SpaceValue>;
-    paddingInlineStart: DesignToken<SpaceValue>;
-    paddingInlineEnd: DesignToken<SpaceValue>;
-}
-export interface ButtonTokens {
-    fontWeight: DesignToken<FontWeightValue>;
-    transitionDuration: DesignToken<TransitionDurationValue>;
-    fontSize: DesignToken<FontSizeValue>;
-    lineHeight: DesignToken<LineHeightValue>;
-    paddingBlockStart: DesignToken<SpaceValue>;
-    paddingBlockEnd: DesignToken<SpaceValue>;
-    paddingInlineStart: DesignToken<SpaceValue>;
-    paddingInlineEnd: DesignToken<SpaceValue>;
-    borderColor: DesignToken<BorderColorValue>;
-    borderWidth: DesignToken<BorderWidthValue>;
-    borderStyle: DesignToken<BorderStyleValue>;
-    borderRadius: DesignToken<BorderRadiusValue>;
-    color: DesignToken<ColorValue>;
-    _hover: StateTokens;
-    _focus: StateWithShadowTokens;
-    _active: StateTokens;
-    _loading: StateTokens;
-    _disabled: StateTokens;
-    primary: PrimaryVariationTokens;
-    menu: MenuVariationTokens;
-    link: LinkVariationTokens;
-    small: ButtonSizeTokens;
-    large: ButtonSizeTokens;
-    loaderWrapper: {
-        alignItems: DesignToken<AlignItemsValue>;
-        gap: DesignToken<SpaceValue>;
-    };
-}
-export declare const button: ButtonTokens;
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+declare type StateTokens<Output> = DesignTokenProperties<'backgroundColor' | 'borderColor' | 'color', Output>;
+declare type StateWithShadowTokens<Output> = StateTokens<Output> & DesignTokenProperties<'boxShadow', Output>;
+declare type MenuStateTokens<Output> = Omit<StateTokens<Output>, 'borderColor'>;
+declare type PrimaryVariationTokens<Output> = StateTokens<Output> & DesignTokenProperties<'borderStyle' | 'borderWidth', Output> & {
+    _disabled?: StateTokens<Output>;
+    _loading?: StateTokens<Output>;
+    _hover?: StateTokens<Output>;
+    _focus?: StateWithShadowTokens<Output>;
+    _active?: StateTokens<Output>;
+};
+declare type MenuVariationTokens<Output> = DesignTokenProperties<'backgroundColor' | 'borderWidth' | 'justifyContent', Output> & {
+    _hover?: MenuStateTokens<Output>;
+    _focus?: MenuStateTokens<Output>;
+    _active?: MenuStateTokens<Output>;
+    _disabled?: Omit<StateTokens<Output>, 'borderColor' | 'backgroundColor'>;
+};
+declare type LinkVariationTokens<Output> = DesignTokenProperties<'backgroundColor' | 'borderColor' | 'borderWidth' | 'color', Output> & {
+    _hover?: StateTokens<Output>;
+    _focus?: StateWithShadowTokens<Output>;
+    _active?: StateTokens<Output>;
+    _disabled?: StateTokens<Output>;
+    _loading?: StateTokens<Output>;
+};
+declare type ButtonSizeTokens<Output> = DesignTokenProperties<'fontSize' | 'paddingBlockStart' | 'paddingBlockEnd' | 'paddingInlineStart' | 'paddingInlineEnd', Output>;
+export declare type ButtonTokens<Output extends OutputVariantKey> = DesignTokenProperties<'fontWeight' | 'transitionDuration' | 'fontSize' | 'lineHeight' | 'paddingBlockStart' | 'paddingBlockEnd' | 'paddingInlineStart' | 'paddingInlineEnd' | 'borderColor' | 'borderWidth' | 'borderStyle' | 'borderRadius' | 'color'> & {
+    _hover?: StateTokens<Output>;
+    _focus?: StateWithShadowTokens<Output>;
+    _active?: StateTokens<Output>;
+    _loading?: StateTokens<Output>;
+    _disabled?: StateTokens<Output>;
+    primary?: PrimaryVariationTokens<Output>;
+    menu?: MenuVariationTokens<Output>;
+    link?: LinkVariationTokens<Output>;
+    small?: ButtonSizeTokens<Output>;
+    large?: ButtonSizeTokens<Output>;
+    loaderWrapper: DesignTokenProperties<'alignItems' | 'gap', Output>;
+};
+export declare const button: Required<ButtonTokens<'default'>>;
 export {};

package/dist/types/theme/tokens/components/card.d.ts

@@ -1,16 +1,9 @@
-import { BackgroundColorValue, BorderColorValue, BorderRadiusValue, BorderStyleValue, BorderWidthValue, BoxShadowValue, DesignToken, SpaceValue } from '../types/designToken';
-interface CardVariationTokens {
-    backgroundColor: DesignToken<BackgroundColorValue>;
-    borderRadius: DesignToken<BorderRadiusValue>;
-    borderWidth: DesignToken<BorderWidthValue>;
-    borderStyle: DesignToken<BorderStyleValue>;
-    borderColor: DesignToken<BorderColorValue>;
-    boxShadow: DesignToken<BoxShadowValue>;
-}
-export declare type CardTokens = CardVariationTokens & {
-    padding: DesignToken<SpaceValue>;
-    outlined: CardVariationTokens;
-    elevated: CardVariationTokens;
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+declare type CardVariationStyleKey = 'backgroundColor' | 'borderRadius' | 'borderWidth' | 'borderStyle' | 'borderColor' | 'boxShadow';
+declare type CardVariationTokens<OutputType> = DesignTokenProperties<CardVariationStyleKey, OutputType>;
+export declare type CardTokens<OutputType extends OutputVariantKey> = CardVariationTokens<OutputType> & DesignTokenProperties<'padding', OutputType> & {
+    elevated?: CardVariationTokens<OutputType>;
+    outlined?: CardVariationTokens<OutputType>;
 };
-export declare const card: CardTokens;
+export declare const card: Required<CardTokens<'default'>>;
 export {};

package/dist/types/theme/tokens/components/checkbox.d.ts

@@ -1,81 +1,28 @@
-import { AlignItemsValue, BackgroundColorValue, BorderColorValue, BorderRadiusValue, BorderStyleValue, BorderWidthValue, BoxShadowValue, ColorValue, CursorValue, DesignToken, JustifyContentValue, OpacityValue, OutlineColorValue, OutlineOffsetValue, OutlineStyleValue, OutlineWidthValue, PositionValue, SpaceValue, TransformValue, TransitionDurationValue, TransitionPropertyValue, TransitionTimingFunctionValue } from '../types/designToken';
-interface DisableToken {
-    cursor: DesignToken<CursorValue>;
-}
-interface ButtonDisabledToken {
-    borderColor: DesignToken<BorderColorValue>;
-}
-interface ButtonErrorFocusToken {
-    borderColor: DesignToken<BorderColorValue>;
-    boxShadow: DesignToken<BoxShadowValue>;
-}
-interface ButtonErrorToken {
-    borderColor: DesignToken<BorderColorValue>;
-    _focus: ButtonErrorFocusToken;
-}
-interface ButtonFocusToken {
-    outlineColor: DesignToken<OutlineColorValue>;
-    outlineStyle: DesignToken<OutlineStyleValue>;
-    outlineWidth: DesignToken<OutlineWidthValue>;
-    outlineOffset: DesignToken<OutlineOffsetValue>;
-    borderColor: DesignToken<BorderColorValue>;
-    boxShadow: DesignToken<BoxShadowValue>;
-}
-interface BeforeToken {
-    width: DesignToken<SpaceValue>;
-    height: DesignToken<SpaceValue>;
-    borderWidth: DesignToken<BorderWidthValue>;
-    borderRadius: DesignToken<BorderRadiusValue>;
-    borderStyle: DesignToken<BorderStyleValue>;
-    borderColor: DesignToken<BorderColorValue>;
-}
-interface ButtonToken {
-    position: DesignToken<PositionValue>;
-    alignItems: DesignToken<AlignItemsValue>;
-    justifyContent: DesignToken<JustifyContentValue>;
-    color: DesignToken<ColorValue>;
-    before: BeforeToken;
-    _focus: ButtonFocusToken;
-    _disabled: ButtonDisabledToken;
-    _error: ButtonErrorToken;
-}
-interface IconCheckedDisabled {
-    backgroundColor: DesignToken<BackgroundColorValue>;
-}
-interface IconCheckedToken {
-    opacity: DesignToken<OpacityValue>;
-    transform: DesignToken<TransformValue>;
-    _disabled: IconCheckedDisabled;
-}
-interface IconIndeterminateToken {
-    opacity: DesignToken<OpacityValue>;
-    transform: DesignToken<TransformValue>;
-    _disabled: IconCheckedDisabled;
-}
-interface IconToken {
-    backgroundColor: DesignToken<BackgroundColorValue>;
-    borderRadius: DesignToken<BorderRadiusValue>;
-    opacity: DesignToken<OpacityValue>;
-    transform: DesignToken<TransformValue>;
-    transitionProperty: DesignToken<TransitionPropertyValue>;
-    transitionDuration: DesignToken<TransitionDurationValue>;
-    transitionTimingFunction: DesignToken<TransitionTimingFunctionValue>;
-    _checked: IconCheckedToken;
-    _indeterminate: IconIndeterminateToken;
-}
-interface LabelDisabledToken {
-    color: DesignToken<ColorValue>;
-}
-interface LabelToken {
-    _disabled: LabelDisabledToken;
-}
-export interface CheckboxTokens {
-    cursor: DesignToken<CursorValue>;
-    alignItems: DesignToken<AlignItemsValue>;
-    _disabled: DisableToken;
-    button: ButtonToken;
-    icon: IconToken;
-    label: LabelToken;
-}
-export declare const checkbox: CheckboxTokens;
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+declare type ButtonFocusToken<Output> = DesignTokenProperties<'outlineColor' | 'outlineStyle' | 'outlineWidth' | 'outlineOffset' | 'borderColor' | 'boxShadow', Output>;
+declare type BeforeToken<Output> = DesignTokenProperties<'width' | 'height' | 'borderWidth' | 'borderRadius' | 'borderStyle' | 'borderColor', Output>;
+declare type ButtonToken<Output> = DesignTokenProperties<'position' | 'alignItems' | 'justifyContent' | 'color', Output> & {
+    before: BeforeToken<Output>;
+    _focus: ButtonFocusToken<Output>;
+    _disabled: DesignTokenProperties<'borderColor', Output>;
+    _error: DesignTokenProperties<'borderColor', Output> & {
+        _focus: DesignTokenProperties<'borderColor' | 'boxShadow', Output>;
+    };
+};
+declare type IconCheckedStateToken<Output> = DesignTokenProperties<'opacity' | 'transform'> & {
+    _disabled?: DesignTokenProperties<'backgroundColor', Output>;
+};
+declare type IconToken<Output> = DesignTokenProperties<'backgroundColor' | 'borderRadius' | 'opacity' | 'transform' | 'transitionProperty' | 'transitionDuration' | 'transitionTimingFunction', Output> & {
+    _checked?: IconCheckedStateToken<Output>;
+    _indeterminate?: IconCheckedStateToken<Output>;
+};
+export declare type CheckboxTokens<Output extends OutputVariantKey> = DesignTokenProperties<'alignItems' | 'cursor', Output> & {
+    _disabled?: DesignTokenProperties<'cursor', Output>;
+    button?: ButtonToken<Output>;
+    icon?: IconToken<Output>;
+    label?: {
+        _disabled?: DesignTokenProperties<'color', Output>;
+    };
+};
+export declare const checkbox: Required<CheckboxTokens<'default'>>;
 export {};

package/dist/types/theme/tokens/components/checkboxField.d.ts

@@ -1,8 +1,3 @@
-import { AlignContentValue, AlignItemsValue, DesignToken, FlexDirectionValue, JustifyContentValue } from '../types/designToken';
-export interface CheckboxFieldTokens {
-    alignItems: DesignToken<AlignItemsValue>;
-    alignContent: DesignToken<AlignContentValue>;
-    flexDirection: DesignToken<FlexDirectionValue>;
-    justifyContent: DesignToken<JustifyContentValue>;
-}
-export declare const checkboxfield: CheckboxFieldTokens;
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+export declare type CheckboxFieldTokens<Output extends OutputVariantKey> = DesignTokenProperties<'alignItems' | 'alignContent' | 'flexDirection' | 'justifyContent', Output>;
+export declare const checkboxfield: Required<CheckboxFieldTokens<'default'>>;

package/dist/types/theme/tokens/components/collection.d.ts

@@ -1,32 +1,24 @@
-import { PaginationButtonDisabledTokens, PaginationButtonHoverTokens } from './pagination';
-import { StateTokens } from './button';
-import { BackgroundColorValue, ColorValue, DesignToken } from '../types/designToken';
-interface PaginationTokens {
-    current: {
-        color: DesignToken<ColorValue>;
-        backgroundColor: DesignToken<BackgroundColorValue>;
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+declare type StateTokens<Output> = DesignTokenProperties<'backgroundColor' | 'borderColor' | 'color', Output>;
+declare type PaginationTokens<Output> = {
+    current?: DesignTokenProperties<'color' | 'backgroundColor', Output>;
+    button?: DesignTokenProperties<'color', Output> & {
+        _hover?: DesignTokenProperties<'backgroundColor' | 'color', Output>;
+        _disabled?: DesignTokenProperties<'color', Output>;
     };
-    button: {
-        color: DesignToken<ColorValue>;
-        _hover: PaginationButtonHoverTokens;
-        _disabled: PaginationButtonDisabledTokens;
+};
+declare type SearchTokens<Output> = {
+    input: DesignTokenProperties<'color', Output>;
+    button: DesignTokenProperties<'color', Output> & {
+        _active: StateTokens<Output>;
+        _disabled: StateTokens<Output>;
+        _focus: StateTokens<Output>;
+        _hover: StateTokens<Output>;
     };
+};
+export interface CollectionTokens<Output extends OutputVariantKey> {
+    pagination: PaginationTokens<Output>;
+    search: SearchTokens<Output>;
 }
-export interface SearchTokens {
-    input: {
-        color: DesignToken<ColorValue>;
-    };
-    button: {
-        color: DesignToken<ColorValue>;
-        _active: StateTokens;
-        _disabled: StateTokens;
-        _focus: StateTokens;
-        _hover: StateTokens;
-    };
-}
-export interface CollectionTokens {
-    pagination: PaginationTokens;
-    search: SearchTokens;
-}
-export declare const collection: CollectionTokens;
+export declare const collection: Required<CollectionTokens<'default'>>;
 export {};

package/dist/types/theme/tokens/components/copy.d.ts

@@ -1,20 +1,8 @@
-import { ColorValue, DesignToken, FontSizeValue, SpaceValue } from '../types/designToken';
-interface CopySVGFillTokens {
-    fill: DesignToken<ColorValue>;
-}
-interface CopySVGTokens {
-    path: CopySVGFillTokens;
-}
-interface CopyToolTipTokens {
-    bottom: DesignToken<SpaceValue>;
-    color: DesignToken<ColorValue>;
-    fontSize: DesignToken<FontSizeValue>;
-}
-export interface CopyTokens {
-    fontSize: DesignToken<FontSizeValue>;
-    gap: DesignToken<SpaceValue>;
-    svg: CopySVGTokens;
-    toolTip: CopyToolTipTokens;
-}
-export declare const copy: CopyTokens;
-export {};
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+export declare type CopyTokens<Output extends OutputVariantKey> = DesignTokenProperties<'fontSize' | 'gap', Output> & {
+    svg?: {
+        path?: DesignTokenProperties<'fill', Output>;
+    };
+    toolTip?: DesignTokenProperties<'bottom' | 'color' | 'fontSize', Output>;
+};
+export declare const copy: Required<CopyTokens<'default'>>;

package/dist/types/theme/tokens/components/dialCodeSelect.d.ts

@@ -1,5 +1,3 @@
-import { DesignToken, SpaceValue } from '../types/designToken';
-export interface DialCodeSelectTokens {
-    height: DesignToken<SpaceValue>;
-}
-export declare const dialcodeselect: DialCodeSelectTokens;
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+export declare type DialCodeSelectTokens<Output extends OutputVariantKey> = DesignTokenProperties<'height', Output>;
+export declare const dialcodeselect: Required<DialCodeSelectTokens<'default'>>;

package/dist/types/theme/tokens/components/divider.d.ts

@@ -1,21 +1,9 @@
-import { BackgroundColorValue, BorderColorValue, BorderStyleValue, BorderWidthValue, ColorValue, DesignToken, FontSizeValue, OpacityValue, SpaceValue } from '../types/designToken';
-interface DividerSizeTokens {
-    borderWidth: DesignToken<BorderWidthValue>;
-}
-interface DividerLabelTokens {
-    color: DesignToken<ColorValue>;
-    paddingInline: DesignToken<SpaceValue>;
-    fontSize: DesignToken<FontSizeValue>;
-    backgroundColor: DesignToken<BackgroundColorValue>;
-}
-export interface DividerTokens {
-    borderStyle: DesignToken<BorderStyleValue>;
-    borderColor: DesignToken<BorderColorValue>;
-    borderWidth: DesignToken<BorderWidthValue>;
-    label: DividerLabelTokens;
-    small: DividerSizeTokens;
-    large: DividerSizeTokens;
-    opacity: DesignToken<OpacityValue>;
-}
-export declare const divider: DividerTokens;
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+declare type DividerSizeTokens<Output> = DesignTokenProperties<'borderWidth', Output>;
+export declare type DividerTokens<Output extends OutputVariantKey> = DesignTokenProperties<'borderStyle' | 'borderColor' | 'borderWidth' | 'opacity', Output> & {
+    label?: DesignTokenProperties<'color' | 'paddingInline' | 'fontSize' | 'backgroundColor', Output>;
+    small?: DividerSizeTokens<Output>;
+    large?: DividerSizeTokens<Output>;
+};
+export declare const divider: Required<DividerTokens<'default'>>;
 export {};

package/dist/types/theme/tokens/components/expander.d.ts

@@ -1,69 +1,22 @@
-import { AlignItemsValue, AnimationDurationValue, AnimationTimingFunctionValue, BackgroundColorValue, BorderRadiusValue, BoxShadowValue, ColorValue, DesignToken, DisplayValue, JustifyContentValue, RadiusValue, SpaceValue, TransitionDurationValue, TransitionTimingFunctionValue } from '../types/designToken';
-interface ExpanderItemFocusTokens {
-    boxShadow: DesignToken<BoxShadowValue>;
-}
-interface ExpanderItemTokens {
-    marginTop: DesignToken<SpaceValue>;
-    boxShadow: DesignToken<BoxShadowValue>;
-    borderBottomLeftRadius: DesignToken<RadiusValue>;
-    borderBottomRightRadius: DesignToken<RadiusValue>;
-    borderTopLeftRadius: DesignToken<RadiusValue>;
-    borderTopRightRadius: DesignToken<RadiusValue>;
-    borderStartStartRadius: DesignToken<RadiusValue>;
-    borderStartEndRadius: DesignToken<RadiusValue>;
-    borderEndStartRadius: DesignToken<RadiusValue>;
-    borderEndEndRadius: DesignToken<RadiusValue>;
-    _focus: ExpanderItemFocusTokens;
-}
-interface ExpanderHeaderTokens {
-    boxShadow: DesignToken<BoxShadowValue>;
-}
-interface ExpanderTriggerTokens {
-    minHeight: DesignToken<SpaceValue>;
-    paddingInlineStart: DesignToken<SpaceValue>;
-    paddingInlineEnd: DesignToken<SpaceValue>;
-    alignItems: DesignToken<AlignItemsValue>;
-    justifyContent: DesignToken<JustifyContentValue>;
-    _hover: ExpanderTriggerHoverTokens;
-}
-interface ExpanderTriggerHoverTokens {
-    backgroundColor: DesignToken<BackgroundColorValue>;
-}
-interface ExpanderContentTokens {
-    paddingInlineStart: DesignToken<SpaceValue>;
-    paddingInlineEnd: DesignToken<SpaceValue>;
-    text: ExpanderContentTextTokens;
-    _open: ExpanderContentOpenTokens;
-    _closed: ExpanderContentClosedTokens;
-}
-interface ExpanderContentTextTokens {
-    color: DesignToken<ColorValue>;
-    paddingBlockStart: DesignToken<SpaceValue>;
-    paddingBlockEnd: DesignToken<SpaceValue>;
-}
-interface ExpanderContentOpenTokens {
-    animationDuration: DesignToken<AnimationDurationValue>;
-    animationTimingFunction: DesignToken<AnimationTimingFunctionValue>;
-}
-interface ExpanderContentClosedTokens {
-    animationDuration: DesignToken<AnimationDurationValue>;
-    animationTimingFunction: DesignToken<AnimationTimingFunctionValue>;
-}
-interface ExpanderIconTokens {
-    transitionDuration: DesignToken<TransitionDurationValue>;
-    transitionTimingFunction: DesignToken<TransitionTimingFunctionValue>;
-}
-export interface ExpanderTokens {
-    display: DesignToken<DisplayValue>;
-    backgroundColor: DesignToken<BackgroundColorValue>;
-    borderRadius: DesignToken<BorderRadiusValue>;
-    boxShadow: DesignToken<BoxShadowValue>;
-    width: DesignToken<SpaceValue>;
-    item: ExpanderItemTokens;
-    header: ExpanderHeaderTokens;
-    trigger: ExpanderTriggerTokens;
-    content: ExpanderContentTokens;
-    icon: ExpanderIconTokens;
-}
-export declare const expander: ExpanderTokens;
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+declare type ExpanderItemTokens<Output> = DesignTokenProperties<'marginTop' | 'boxShadow' | 'borderBottomLeftRadius' | 'borderBottomRightRadius' | 'borderTopLeftRadius' | 'borderTopRightRadius' | 'borderStartStartRadius' | 'borderStartEndRadius' | 'borderEndStartRadius' | 'borderEndEndRadius', Output> & {
+    _focus?: DesignTokenProperties<'boxShadow', Output>;
+};
+declare type ExpanderTriggerTokens<Output> = DesignTokenProperties<'minHeight' | 'paddingInlineStart' | 'paddingInlineEnd' | 'alignItems' | 'justifyContent', Output> & {
+    _hover?: DesignTokenProperties<'backgroundColor', Output>;
+};
+declare type ExpanderContentStateTokens<Output> = DesignTokenProperties<'animationDuration' | 'animationTimingFunction', Output>;
+declare type ExpanderContentTokens<Output> = DesignTokenProperties<'paddingInlineStart' | 'paddingInlineEnd', Output> & {
+    text?: DesignTokenProperties<'color' | 'paddingBlockStart' | 'paddingBlockEnd', Output>;
+    _open?: ExpanderContentStateTokens<Output>;
+    _closed?: ExpanderContentStateTokens<Output>;
+};
+export declare type ExpanderTokens<Output extends OutputVariantKey> = DesignTokenProperties<'display' | 'backgroundColor' | 'borderRadius' | 'boxShadow' | 'width', Output> & {
+    content?: ExpanderContentTokens<Output>;
+    header?: DesignTokenProperties<'boxShadow', Output>;
+    item?: ExpanderItemTokens<Output>;
+    trigger?: ExpanderTriggerTokens<Output>;
+    icon?: DesignTokenProperties<'transitionDuration' | 'transitionTimingFunction', Output>;
+};
+export declare const expander: Required<ExpanderTokens<'default'>>;
 export {};

package/dist/types/theme/tokens/components/field.d.ts

@@ -1,17 +1,9 @@
-import { ColorValue, DesignToken, FontSizeValue, GapValue } from '../types/designToken';
-interface FieldSizeTokens {
-    gap: DesignToken<GapValue>;
-    fontSize: DesignToken<FontSizeValue>;
-}
-interface FieldLabelTokens {
-    color: DesignToken<ColorValue>;
-}
-export interface FieldTokens {
-    gap: DesignToken<GapValue>;
-    fontSize: DesignToken<FontSizeValue>;
-    small: FieldSizeTokens;
-    large: FieldSizeTokens;
-    label: FieldLabelTokens;
-}
-export declare const field: FieldTokens;
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+declare type FieldSizeTokens<Output> = DesignTokenProperties<'fontSize' | 'gap', Output>;
+export declare type FieldTokens<Output extends OutputVariantKey> = FieldSizeTokens<Output> & {
+    small?: FieldSizeTokens<Output>;
+    large?: FieldSizeTokens<Output>;
+    label?: DesignTokenProperties<'color', Output>;
+};
+export declare const field: Required<FieldTokens<'default'>>;
 export {};

package/dist/types/theme/tokens/components/fieldControl.d.ts

@@ -1,72 +1,23 @@
-import { BackgroundColorValue, BorderColorValue, BorderRadiusValue, BorderStyleValue, BorderValue, BorderWidthValue, BoxShadowValue, ColorValue, CursorValue, DesignToken, FontSizeValue, LineHeightValue, OutlineColorValue, OutlineOffsetValue, OutlineStyleValue, OutlineWidthValue, SpaceValue, TransitionDurationValue } from '../types/designToken';
-interface FieldControlSizeTokens {
-    fontSize: DesignToken<FontSizeValue>;
-    paddingBlockStart: DesignToken<SpaceValue>;
-    paddingBlockEnd: DesignToken<SpaceValue>;
-    paddingInlineStart: DesignToken<SpaceValue>;
-    paddingInlineEnd: DesignToken<SpaceValue>;
-}
-interface FieldControlFocusTokens {
-    borderColor: DesignToken<BorderColorValue>;
-    boxShadow: DesignToken<BoxShadowValue>;
-}
-interface FieldControlDisabledTokens {
-    color: DesignToken<ColorValue>;
-    cursor: DesignToken<CursorValue>;
-    borderColor: DesignToken<BorderColorValue>;
-    backgroundColor: DesignToken<BackgroundColorValue>;
-}
-interface FieldControlErrorTokens {
-    borderColor: DesignToken<BorderColorValue>;
-    _focus: FieldControlErrorFocusTokens;
-}
-interface FieldControlErrorFocusTokens {
-    boxShadow: DesignToken<BoxShadowValue>;
-}
-interface FieldControlQuietTokens {
-    borderStyle: DesignToken<BorderStyleValue>;
-    borderBlockEnd: DesignToken<BorderValue>;
-    borderInlineStart: DesignToken<BorderValue>;
-    borderInlineEnd: DesignToken<BorderValue>;
-    borderBlockStart: DesignToken<BorderValue>;
-    borderRadius: DesignToken<BorderRadiusValue>;
-    _focus: FieldControlQuietFocusTokens;
-    _error: FieldControlQuietErrorTokens;
-}
-interface FieldControlQuietFocusTokens {
-    borderBlockEndColor: DesignToken<ColorValue>;
-    boxShadow: DesignToken<BoxShadowValue>;
-}
-interface FieldControlQuietErrorTokens {
-    borderBlockEndColor: DesignToken<ColorValue>;
-    _focus: FieldControlQuietErrorFocusTokens;
-}
-interface FieldControlQuietErrorFocusTokens {
-    boxShadow: DesignToken<BoxShadowValue>;
-}
-export interface FieldControlTokens {
-    borderStyle: DesignToken<BorderStyleValue>;
-    borderColor: DesignToken<BorderColorValue>;
-    borderWidth: DesignToken<BorderWidthValue>;
-    borderRadius: DesignToken<BorderRadiusValue>;
-    color: DesignToken<ColorValue>;
-    paddingBlockStart: DesignToken<SpaceValue>;
-    paddingBlockEnd: DesignToken<SpaceValue>;
-    paddingInlineStart: DesignToken<SpaceValue>;
-    paddingInlineEnd: DesignToken<SpaceValue>;
-    fontSize: DesignToken<FontSizeValue>;
-    lineHeight: DesignToken<LineHeightValue>;
-    transitionDuration: DesignToken<TransitionDurationValue>;
-    outlineColor: DesignToken<OutlineColorValue>;
-    outlineStyle: DesignToken<OutlineStyleValue>;
-    outlineWidth: DesignToken<OutlineWidthValue>;
-    outlineOffset: DesignToken<OutlineOffsetValue>;
-    small: FieldControlSizeTokens;
-    large: FieldControlSizeTokens;
-    quiet: FieldControlQuietTokens;
-    _focus: FieldControlFocusTokens;
-    _disabled: FieldControlDisabledTokens;
-    _error: FieldControlErrorTokens;
-}
-export declare const fieldcontrol: FieldControlTokens;
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+declare type FieldControlSizeTokens<Output> = DesignTokenProperties<'fontSize' | 'paddingBlockStart' | 'paddingBlockEnd' | 'paddingInlineStart' | 'paddingInlineEnd', Output>;
+declare type FieldControlFocusTokens<Output> = DesignTokenProperties<'borderColor' | 'boxShadow', Output>;
+declare type FieldControlDisabledTokens<Output> = DesignTokenProperties<'color' | 'cursor' | 'borderColor' | 'backgroundColor', Output>;
+declare type FieldControlErrorTokens<Output> = DesignTokenProperties<'borderColor', Output> & {
+    _focus?: DesignTokenProperties<'boxShadow', Output>;
+};
+declare type FieldControlQuietTokens<Output> = DesignTokenProperties<'borderStyle' | 'borderInlineStart' | 'borderInlineEnd' | 'borderBlockStart' | 'borderRadius', Output> & {
+    _focus?: DesignTokenProperties<'borderBlockEndColor' | 'boxShadow', Output>;
+    _error?: DesignTokenProperties<'borderBlockEndColor', Output> & {
+        _focus?: DesignTokenProperties<'boxShadow', Output>;
+    };
+};
+export declare type FieldControlTokens<Output extends OutputVariantKey> = DesignTokenProperties<'borderStyle' | 'borderColor' | 'borderWidth' | 'borderRadius' | 'color' | 'paddingBlockStart' | 'paddingBlockEnd' | 'paddingInlineStart' | 'paddingInlineEnd' | 'fontSize' | 'lineHeight' | 'transitionDuration' | 'outlineColor' | 'outlineStyle' | 'outlineWidth' | 'outlineOffset', Output> & {
+    small?: FieldControlSizeTokens<Output>;
+    large?: FieldControlSizeTokens<Output>;
+    quiet?: FieldControlQuietTokens<Output>;
+    _focus?: FieldControlFocusTokens<Output>;
+    _disabled?: FieldControlDisabledTokens<Output>;
+    _error?: FieldControlErrorTokens<Output>;
+};
+export declare const fieldcontrol: Required<FieldControlTokens<'default'>>;
 export {};

package/dist/types/theme/tokens/components/fieldGroup.d.ts

@@ -1,14 +1,6 @@
-import { DesignToken, AlignItemsValue, GapValue } from '../types/designToken';
-interface FieldGroupVerticalTokens {
-    alignItems: DesignToken<AlignItemsValue>;
-}
-interface FieldGroupOuterTokens {
-    alignItems: DesignToken<AlignItemsValue>;
-}
-export interface FieldGroupTokens {
-    gap: DesignToken<GapValue>;
-    vertical: FieldGroupVerticalTokens;
-    outer: FieldGroupOuterTokens;
-}
-export declare const fieldgroup: FieldGroupTokens;
-export {};
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+export declare type FieldGroupTokens<Output extends OutputVariantKey> = DesignTokenProperties<'gap', Output> & {
+    vertical?: DesignTokenProperties<'alignItems', Output>;
+    outer?: DesignTokenProperties<'alignItems', Output>;
+};
+export declare const fieldgroup: Required<FieldGroupTokens<'default'>>;