@aws-amplify/ui 5.0.0 → 5.1.0

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

@@ -1,53 +1,63 @@
-import { BorderWidths, WebBorderWidths } from './borderWidths';
-import { Colors, WebColors } from './colors';
-import { ComponentTokens } from './components';
-import { Fonts, WebFonts } from './fonts';
-import { FontSizes, WebFontSizes } from './fontSizes';
-import { FontWeights, WebFontWeights } from './fontWeights';
-import { LineHeights, WebLineHeights } from './lineHeights';
-import { Opacities, WebOpacities } from './opacities';
-import { OutlineOffsets, WebOutlineOffsets } from './outlineOffsets';
-import { OutlineWidths, WebOutlineWidths } from './outlineWidths';
-import { Radii, WebRadii } from './radii';
-import { Shadows, WebShadows } from './shadows';
-import { Space, WebSpace } from './space';
-import { Time, WebTime } from './time';
-import { Transforms, WebTransforms } from './transforms';
-export interface Tokens {
-    components: ComponentTokens;
-    borderWidths: BorderWidths;
-    colors: Colors;
-    fonts: Fonts;
-    fontSizes: FontSizes;
-    fontWeights: FontWeights;
-    lineHeights: LineHeights;
-    opacities: Opacities;
-    outlineOffsets: OutlineOffsets;
-    outlineWidths: OutlineWidths;
-    radii: Radii;
-    shadows: Shadows;
-    space: Space;
-    time: Time;
-    transforms: Transforms;
+import { BorderWidths } from './borderWidths';
+import { Colors } from './colors';
+import { ComponentTokens, DefaultComponentTokens, WebComponentTokens } from './components';
+import { Fonts } from './fonts';
+import { FontSizes } from './fontSizes';
+import { FontWeights } from './fontWeights';
+import { LineHeights } from './lineHeights';
+import { Opacities } from './opacities';
+import { OutlineOffsets } from './outlineOffsets';
+import { OutlineWidths } from './outlineWidths';
+import { Radii } from './radii';
+import { Shadows } from './shadows';
+import { Space } from './space';
+import { Time } from './time';
+import { Transforms } from './transforms';
+import { OutputVariantKey } from './types/designToken';
+/**
+ * Used for custom themes
+ */
+interface BaseTokens<Output extends OutputVariantKey = unknown> {
+    borderWidths?: BorderWidths<Output>;
+    colors?: Colors<Output>;
+    fonts?: Fonts<Output>;
+    fontSizes?: FontSizes<Output>;
+    fontWeights?: FontWeights<Output>;
+    lineHeights?: LineHeights<Output>;
+    opacities?: Opacities<Output>;
+    outlineOffsets?: OutlineOffsets<Output>;
+    outlineWidths?: OutlineWidths<Output>;
+    radii?: Radii<Output>;
+    shadows?: Shadows<Output>;
+    space?: Space<Output>;
+    time?: Time<Output>;
+    transforms?: Transforms<Output>;
 }
+export declare type Tokens = BaseTokens<'optional'> & {
+    components?: ComponentTokens;
+};
+export declare type DefaultTokens = Required<BaseTokens<'default'>> & {
+    components: DefaultComponentTokens;
+};
 /**
  * The fully setup theme tokens. It has the same shape as Tokens
  * but each token has added fields.
  */
-export interface WebTokens extends Tokens {
-    borderWidths: WebBorderWidths;
-    colors: WebColors;
-    fonts: WebFonts;
-    fontSizes: WebFontSizes;
-    fontWeights: WebFontWeights;
-    lineHeights: WebLineHeights;
-    opacities: WebOpacities;
-    outlineOffsets: WebOutlineOffsets;
-    outlineWidths: WebOutlineWidths;
-    radii: WebRadii;
-    shadows: WebShadows;
-    space: WebSpace;
-    time: WebTime;
-    transform: WebTransforms;
-}
-export declare const tokens: Tokens;
+export declare type WebTokens = Required<BaseTokens<'required'>> & {
+    components: WebComponentTokens;
+};
+declare type ReactNative = 'react-native';
+declare type BaseReactNativeTokens<Output extends OutputVariantKey = unknown> = {
+    colors?: Colors<Output, ReactNative>;
+    borderWidths?: BorderWidths<Output, ReactNative>;
+    fontSizes?: Omit<FontSizes<Output, ReactNative>, 'xxxs' | 'xxxxl'>;
+    fontWeights?: FontWeights<Output, ReactNative>;
+    opacities?: Opacities<Output, ReactNative>;
+    radii?: Radii<Output, ReactNative>;
+    space?: Omit<Space<Output, ReactNative>, 'xxxs' | 'relative' | 'zero'>;
+    time?: Time<Output, ReactNative>;
+};
+export declare type ReactNativeTokens<Output extends OutputVariantKey> = Output extends 'required' | 'default' ? Required<BaseReactNativeTokens<Output>> : BaseReactNativeTokens<Output>;
+export declare const tokens: DefaultTokens;
+export declare const reactNativeTokens: ReactNativeTokens<'default'>;
+export {};

package/dist/types/theme/tokens/lineHeights.d.ts

@@ -1,10 +1,5 @@
-import { DesignToken, WebDesignToken, LineHeightValue } from './types/designToken';
-export declare type LineHeights = {
-    small: DesignToken<LineHeightValue>;
-    medium: DesignToken<LineHeightValue>;
-    large: DesignToken<LineHeightValue>;
-};
-export declare type WebLineHeights = {
-    [Property in keyof LineHeights]: WebDesignToken<LineHeightValue>;
-};
-export declare const lineHeights: LineHeights;
+import { DesignTokenValues, LineHeightValue, OutputVariantKey } from './types/designToken';
+declare type LineHeightSize = 'small' | 'medium' | 'large';
+export declare type LineHeights<Output extends OutputVariantKey = unknown, Platform = unknown> = DesignTokenValues<LineHeightSize, LineHeightValue, Output, Platform>;
+export declare const lineHeights: LineHeights<'default'>;
+export {};

package/dist/types/theme/tokens/opacities.d.ts

@@ -1,18 +1,5 @@
-import { DesignToken, WebDesignToken, OpacityValue } from './types/designToken';
-export declare type Opacities = {
-    0: DesignToken<OpacityValue>;
-    10: DesignToken<OpacityValue>;
-    20: DesignToken<OpacityValue>;
-    30: DesignToken<OpacityValue>;
-    40: DesignToken<OpacityValue>;
-    50: DesignToken<OpacityValue>;
-    60: DesignToken<OpacityValue>;
-    70: DesignToken<OpacityValue>;
-    80: DesignToken<OpacityValue>;
-    90: DesignToken<OpacityValue>;
-    100: DesignToken<OpacityValue>;
-};
-export declare type WebOpacities = {
-    [Property in keyof Opacities]: WebDesignToken<OpacityValue>;
-};
-export declare const opacities: Opacities;
+import { DesignTokenValues, OpacityValue, OutputVariantKey } from './types/designToken';
+declare type OpacityScale = 0 | 10 | 20 | 30 | 40 | 50 | 60 | 70 | 80 | 90 | 100;
+export declare type Opacities<Output extends OutputVariantKey = unknown, Platform = unknown> = DesignTokenValues<OpacityScale, OpacityValue<Platform, Output>, Output, Platform>;
+export declare const opacities: Opacities<'default'>;
+export {};

package/dist/types/theme/tokens/outlineOffsets.d.ts

@@ -1,10 +1,5 @@
-import { DesignToken, WebDesignToken, OutlineOffsetValue } from './types/designToken';
-export declare type OutlineOffsets = {
-    small: DesignToken<OutlineOffsetValue>;
-    medium: DesignToken<OutlineOffsetValue>;
-    large: DesignToken<OutlineOffsetValue>;
-};
-export declare type WebOutlineOffsets = {
-    [Property in keyof OutlineOffsets]: WebDesignToken<OutlineOffsetValue>;
-};
-export declare const outlineOffsets: OutlineOffsets;
+import { DesignTokenValues, OutlineOffsetValue, OutputVariantKey } from './types/designToken';
+declare type OutlineOffsetSize = 'small' | 'medium' | 'large';
+export declare type OutlineOffsets<Output extends OutputVariantKey = unknown, Platform = unknown> = DesignTokenValues<OutlineOffsetSize, OutlineOffsetValue, Output, Platform>;
+export declare const outlineOffsets: OutlineOffsets<'default'>;
+export {};

package/dist/types/theme/tokens/outlineWidths.d.ts

@@ -1,10 +1,5 @@
-import { DesignToken, WebDesignToken, OutlineWidthValue } from './types/designToken';
-export declare type OutlineWidths = {
-    small: DesignToken<OutlineWidthValue>;
-    medium: DesignToken<OutlineWidthValue>;
-    large: DesignToken<OutlineWidthValue>;
-};
-export declare type WebOutlineWidths = {
-    [Property in keyof OutlineWidths]: WebDesignToken<OutlineWidthValue>;
-};
-export declare const outlineWidths: OutlineWidths;
+import { DesignTokenValues, OutlineWidthValue, OutputVariantKey } from './types/designToken';
+declare type OutlineWidthSize = 'small' | 'medium' | 'large';
+export declare type OutlineWidths<Output extends OutputVariantKey = unknown, Platform = unknown> = DesignTokenValues<OutlineWidthSize, OutlineWidthValue, Output, Platform>;
+export declare const outlineWidths: OutlineWidths<'default'>;
+export {};

package/dist/types/theme/tokens/radii.d.ts

@@ -1,14 +1,5 @@
-import { DesignToken, WebDesignToken, RadiusValue } from './types/designToken';
-export declare type Radii = {
-    xs: DesignToken<RadiusValue>;
-    small: DesignToken<RadiusValue>;
-    medium: DesignToken<RadiusValue>;
-    large: DesignToken<RadiusValue>;
-    xl: DesignToken<RadiusValue>;
-    xxl: DesignToken<RadiusValue>;
-    xxxl: DesignToken<RadiusValue>;
-};
-export declare type WebRadii = {
-    [Property in keyof Radii]: WebDesignToken<RadiusValue>;
-};
-export declare const radii: Radii;
+import { DesignTokenValues, OutputVariantKey, RadiusValue } from './types/designToken';
+declare type RadiusSize = 'xs' | 'small' | 'medium' | 'large' | 'xl' | 'xxl' | 'xxxl';
+export declare type Radii<Output extends OutputVariantKey = unknown, Platform = unknown> = DesignTokenValues<RadiusSize, RadiusValue<Platform, Output>, Output, Platform>;
+export declare const radii: Radii<'default'>;
+export {};

package/dist/types/theme/tokens/shadows.d.ts

@@ -1,10 +1,5 @@
-import { DesignToken, WebDesignToken, ShadowValue } from './types/designToken';
-export declare type Shadows = {
-    small: DesignToken<ShadowValue>;
-    medium: DesignToken<ShadowValue>;
-    large: DesignToken<ShadowValue>;
-};
-export declare type WebShadows = {
-    [Property in keyof Shadows]: WebDesignToken<ShadowValue>;
-};
-export declare const shadows: Shadows;
+import { DesignTokenValues, OutputVariantKey, ShadowValue } from './types/designToken';
+declare type ShadowSize = 'small' | 'medium' | 'large';
+export declare type Shadows<Output extends OutputVariantKey = unknown, Platform = unknown> = DesignTokenValues<ShadowSize, ShadowValue, Output, Platform>;
+export declare const shadows: Shadows<'default'>;
+export {};

package/dist/types/theme/tokens/space.d.ts

@@ -1,26 +1,9 @@
-import { DesignToken, WebDesignToken, SpaceValue } from './types/designToken';
-export declare type SpaceSizes = {
-    xxxs: DesignToken<SpaceValue>;
-    xxs: DesignToken<SpaceValue>;
-    xs: DesignToken<SpaceValue>;
-    small: DesignToken<SpaceValue>;
-    medium: DesignToken<SpaceValue>;
-    large: DesignToken<SpaceValue>;
-    xl: DesignToken<SpaceValue>;
-    xxl: DesignToken<SpaceValue>;
-    xxxl: DesignToken<SpaceValue>;
+import { DesignTokenValues, OutputVariantKey, SpaceValue } from './types/designToken';
+declare type SpaceSize = 'xxxs' | 'xxs' | 'xs' | 'small' | 'medium' | 'large' | 'xl' | 'xxl' | 'xxxl';
+export declare type SpaceSizes<Output extends OutputVariantKey = unknown, Platform = unknown> = DesignTokenValues<SpaceSize | 'zero', SpaceValue<Platform>, Output, Platform>;
+declare type BaseSpace<Output extends OutputVariantKey = unknown, Platform = unknown> = SpaceSizes<Output, Platform> & {
+    relative?: DesignTokenValues<SpaceSize | 'full', SpaceValue, Output, Platform>;
 };
-export declare type Space = SpaceSizes & {
-    zero: DesignToken<SpaceValue>;
-    relative: SpaceSizes & {
-        full: DesignToken<SpaceValue>;
-    };
-};
-export declare type WebSpace = {
-    [Property in keyof Omit<Space, 'relative'>]: WebDesignToken<SpaceValue>;
-} & {
-    relative: {
-        [Property in keyof Space['relative']]: WebDesignToken<SpaceValue>;
-    };
-};
-export declare const space: Space;
+export declare type Space<Output extends OutputVariantKey = unknown, Platform = unknown> = Output extends 'required' | 'default' ? Required<BaseSpace<Output, Platform>> : BaseSpace<Output, Platform>;
+export declare const space: Space<'default'>;
+export {};

package/dist/types/theme/tokens/time.d.ts

@@ -1,10 +1,5 @@
-import { DesignToken, WebDesignToken, TimeValue } from './types/designToken';
-export declare type Time = {
-    short: DesignToken<TimeValue>;
-    medium: DesignToken<TimeValue>;
-    long: DesignToken<TimeValue>;
-};
-export declare type WebTime = {
-    [Property in keyof Time]: WebDesignToken<TimeValue>;
-};
-export declare const time: Time;
+import { DesignTokenValues, OutputVariantKey, TimeValue } from './types/designToken';
+declare type Duration = 'short' | 'medium' | 'long';
+export declare type Time<Output extends OutputVariantKey = unknown, Platform = unknown> = DesignTokenValues<Duration, TimeValue<Platform, Output>, Output, Platform>;
+export declare const time: Time<'default'>;
+export {};

package/dist/types/theme/tokens/transforms.d.ts

@@ -1,14 +1,8 @@
-import { DesignToken, WebDesignToken, TransformValue } from './types/designToken';
-export declare type Transforms = {
-    slideX: {
-        small: DesignToken<TransformValue>;
-        medium: DesignToken<TransformValue>;
-        large: DesignToken<TransformValue>;
-    };
+import { DesignTokenValues, OutputVariantKey, TransformValue } from './types/designToken';
+declare type TransformSize = 'small' | 'medium' | 'large';
+export declare type BaseTransforms<Output extends OutputVariantKey = unknown, Platform = unknown> = {
+    slideX?: DesignTokenValues<TransformSize, TransformValue, Output, Platform>;
 };
-export declare type WebTransforms = {
-    slideX: {
-        [Property in keyof Transforms['slideX']]: WebDesignToken<TransformValue>;
-    };
-};
-export declare const transforms: Transforms;
+export declare type Transforms<Output extends OutputVariantKey = unknown, Platform = unknown> = Output extends 'required' | 'default' ? Required<BaseTransforms<Output, Platform>> : BaseTransforms<Output, Platform>;
+export declare const transforms: Transforms<'default'>;
+export {};

package/dist/types/theme/tokens/types/designToken.d.ts

@@ -1,21 +1,14 @@
+import { Properties } from 'csstype';
 /**
- * Helper function to test if something is a design token or not.
- * Used in the React component style props.
- *
- * @param arg - thing to test if it is a design token or not
- * @returns boolean
+ * a DesignToken can be either an object with a `value` key of `ValueType` or the `ValueType` itself
  */
-export declare function isDesignToken(arg: unknown): arg is WebDesignToken;
-/**
- *
- */
-export declare type DesignToken<ValueType = any> = {
+export declare type DesignToken<ValueType = unknown> = {
     value: ValueType;
-};
+} | ValueType;
 /**
  * A fully setup design token ready to be used in web platform.
  */
-export declare type WebDesignToken<ValueType = any> = {
+export declare type WebDesignToken<ValueType = unknown> = {
     /**
      * Name of the design token
      */
@@ -33,7 +26,11 @@ export declare type WebDesignToken<ValueType = any> = {
      * `var(--amplify-colors-font-primary)`
      */
     toString(): string;
-} & DesignToken<ValueType>;
+    /**
+     * Token `ValueType`
+     */
+    value: ValueType;
+};
 export declare type AnimationDurationValue = string;
 export declare type AnimationTimingFunctionValue = string;
 export declare type AlignItemsValue = string;
@@ -43,7 +40,7 @@ export declare type BorderColorValue = ColorValue;
 export declare type BorderCollapseValue = string;
 export declare type BorderRadiusValue = RadiusValue;
 export declare type BorderStyleValue = string;
-export declare type BorderWidthValue = SpaceValue;
+export declare type BorderWidthValue<Platform extends PlatformKey = unknown, Output extends OutputVariantKey = unknown> = Output extends 'required' ? Platform extends 'react-native' ? number : SpaceValue : SpaceValue;
 export declare type BorderValue = string;
 export declare type BoxSizingValue = string;
 export declare type BoxShadowValue = ShadowValue;
@@ -54,22 +51,22 @@ export declare type DisplayValue = string;
 export declare type FlexDirectionValue = string;
 export declare type FlexValue = string;
 export declare type FlexWrapValue = string;
-export declare type FontSizeValue = string;
+export declare type FontSizeValue<Platform extends PlatformKey = unknown, Output extends OutputVariantKey = unknown> = Output extends 'required' ? Platform extends 'react-native' ? number : string : string;
 export declare type FontStyleValue = string;
 export declare type FontValue = string;
-export declare type FontWeightValue = string | number;
+export declare type FontWeightValue<Platform extends PlatformKey = unknown, Output extends OutputVariantKey = unknown> = Output extends 'required' ? Platform extends 'react-native' ? 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900' : string | number : string | number;
 export declare type GapValue = string;
 export declare type JustifyContentValue = string;
 export declare type LineHeightValue = string | number;
 export declare type ObjectFitValue = string;
-export declare type OpacityValue = string;
+export declare type OpacityValue<Platform extends PlatformKey = unknown, Output extends OutputVariantKey = unknown> = Output extends 'required' ? Platform extends 'react-native' ? number : string : string;
 export declare type OutlineOffsetValue = string;
 export declare type OutlineWidthValue = string;
 export declare type OutlineColorValue = string;
 export declare type OutlineStyleValue = string;
 export declare type PositionValue = string;
 export declare type PointerEventsValue = string;
-export declare type RadiusValue = string;
+export declare type RadiusValue<Platform extends PlatformKey = unknown, Output extends OutputVariantKey = unknown> = Output extends 'required' ? Platform extends 'react-native' ? number : string : string;
 export declare type ShadowValue = {
     offsetX: string;
     offsetY: string;
@@ -80,9 +77,10 @@ export declare type ShadowValue = {
 export declare type StrokeFilledValue = string;
 export declare type StrokeEmptyValue = string;
 export declare type StrokeLinecapValue = string;
-export declare type SpaceValue = string;
+export declare type StrokeWidthValue = string;
+export declare type SpaceValue<Platform extends PlatformKey = unknown> = Platform extends 'react-native' ? string | number : string;
 export declare type TextAlignValue = string;
-export declare type TimeValue = string;
+export declare type TimeValue<Platform extends PlatformKey = unknown, Output extends OutputVariantKey = unknown> = Output extends 'required' ? Platform extends 'react-native' ? number : string : string;
 export declare type TransformValue = string;
 export declare type TransitionDurationValue = string;
 export declare type TransitionPropertyValue = string;
@@ -90,3 +88,146 @@ export declare type TransitionTimingFunctionValue = string;
 export declare type VerticalAlignValue = string;
 export declare type WhiteSpaceValue = string;
 export declare type WordBreakValue = string;
+/**
+ * Mapping of design token value types to style property keys
+ */
+interface TokenStandardProperties {
+    animationDuration: AnimationDurationValue;
+    animationTimingFunction: AnimationTimingFunctionValue;
+    alignItems: AlignItemsValue;
+    alignContent: AlignContentValue;
+    backgroundColor: BackgroundColorValue;
+    borderBlockEnd: BorderValue;
+    borderBlockEndColor: ColorValue;
+    borderBlockStart: BorderValue;
+    borderCollapse: BorderCollapseValue;
+    borderColor: BorderColorValue;
+    borderInlineEnd: BorderValue;
+    borderInlineStart: BorderValue;
+    borderRadius: BorderRadiusValue;
+    borderStyle: BorderStyleValue;
+    borderWidth: BorderWidthValue;
+    border: BorderValue;
+    bottom: SpaceValue;
+    boxSizing: BoxSizingValue;
+    boxShadow: BoxShadowValue;
+    captionSide: CaptionSideValue;
+    color: ColorValue;
+    cursor: CursorValue;
+    display: DisplayValue;
+    fill: DesignToken<ColorValue>;
+    flexDirection: FlexDirectionValue;
+    flex: FlexValue;
+    flexWrap: FlexWrapValue;
+    fontStyle: FontStyleValue;
+    font: FontValue;
+    fontSize: FontSizeValue;
+    fontWeight: FontWeightValue;
+    gap: GapValue;
+    height: SpaceValue;
+    justifyContent: JustifyContentValue;
+    left: SpaceValue;
+    lineHeight: LineHeightValue;
+    margin: SpaceValue;
+    marginLeft: SpaceValue;
+    marginRight: SpaceValue;
+    marginBlockStart: SpaceValue;
+    maxHeight: SpaceValue;
+    maxWidth: SpaceValue;
+    minHeight: SpaceValue;
+    minWidth: SpaceValue;
+    objectFit: ObjectFitValue;
+    objectPosition: PositionValue;
+    opacity: OpacityValue;
+    outlineOffset: OutlineOffsetValue;
+    outlineWidth: OutlineWidthValue;
+    outlineColor: OutlineColorValue;
+    outlineStyle: OutlineStyleValue;
+    padding: SpaceValue;
+    paddingBlock: SpaceValue;
+    paddingBlockEnd: SpaceValue;
+    paddingBlockStart: SpaceValue;
+    paddingBottom: SpaceValue;
+    paddingInline: SpaceValue;
+    paddingInlineEnd: SpaceValue;
+    paddingInlineStart: SpaceValue;
+    paddingLeft: SpaceValue;
+    paddingRight: SpaceValue;
+    paddingTop: SpaceValue;
+    pointerEvents: PointerEventsValue;
+    position: PositionValue;
+    right: SpaceValue;
+    strokeLinecap: StrokeLinecapValue;
+    strokeWidth: StrokeWidthValue;
+    textAlign: TextAlignValue;
+    top: SpaceValue;
+    transform: TransformValue;
+    transitionDuration: TransitionDurationValue;
+    transitionProperty: TransitionPropertyValue;
+    transitionTimingFunction: TransitionTimingFunctionValue;
+    verticalAlign: VerticalAlignValue;
+    whiteSpace: WhiteSpaceValue;
+    width: SpaceValue;
+    wordBreak: WordBreakValue;
+}
+/**
+ * Custom style tokens with non-css property names
+ */
+interface TokenCustomProperties {
+    borderBottomLeftRadius: RadiusValue;
+    borderBottomRightRadius: RadiusValue;
+    borderEndEndRadius: RadiusValue;
+    borderEndStartRadius: RadiusValue;
+    borderStartEndRadius: RadiusValue;
+    borderStartStartRadius: RadiusValue;
+    borderTopLeftRadius: RadiusValue;
+    borderTopRightRadius: RadiusValue;
+    duration: TimeValue;
+    endColor: ColorValue;
+    marginTop: SpaceValue;
+    paddingHorizontal: SpaceValue;
+    paddingVertical: SpaceValue;
+    shadow: ShadowValue;
+    size: SpaceValue;
+    startColor: ColorValue;
+    strokeEmpty: StrokeEmptyValue;
+    strokeFilled: StrokeFilledValue;
+    time: TimeValue;
+}
+interface TokenProperties extends TokenStandardProperties, TokenCustomProperties {
+}
+declare type TokenProperty = keyof TokenProperties;
+declare type Property = Extract<keyof Properties, TokenProperty> | keyof TokenCustomProperties;
+export declare type OutputVariantKey = 'default' | 'optional' | 'required' | unknown;
+/**
+ * Return interface with all types optional for custom theme input
+ */
+declare type OptionalDesignTokenProperties<Keys extends Property> = Partial<{
+    [Key in Keys]?: DesignToken<TokenProperties[Key]>;
+}>;
+/**
+ * Return interface with all types required for strict theme output
+ */
+declare type RequiredDesignTokenProperties<Keys extends TokenProperty> = {
+    [Key in Keys]: WebDesignToken<TokenProperties[Key]>;
+};
+/**
+ * Return interface with all types required for strict theme output
+ */
+declare type DefaultDesignTokenProperties<Keys extends TokenProperty> = Required<{
+    [Key in Keys]: DesignToken<TokenProperties[Key]>;
+}>;
+/**
+ * Utility for creating interfaces for components from supported CSS property keys
+ */
+export declare type DesignTokenProperties<Keys extends TokenProperty, Output extends OutputVariantKey = unknown> = Output extends 'required' ? RequiredDesignTokenProperties<Keys> : Output extends 'optional' ? OptionalDesignTokenProperties<Keys> : DefaultDesignTokenProperties<Keys>;
+export declare type PlatformKey = 'web' | 'react-native' | 'android' | 'ios' | unknown;
+declare type PropKey = string | number;
+declare type RequiredTokenValues<PropertyValueKey extends PropKey, PropertyValue, Platform extends PlatformKey = unknown> = Record<PropertyValueKey, Platform extends 'react-native' ? PropertyValue : WebDesignToken<PropertyValue>>;
+declare type OptionalTokenValues<PropertyValueKey extends PropKey, PropertyValue, Platform extends PlatformKey = unknown> = Partial<Record<PropertyValueKey, DesignToken<PropertyValue>>>;
+declare type DefaultTokenValues<PropertyValueKey extends PropKey, PropertyValue, Platform extends PlatformKey = unknown> = Required<Record<PropertyValueKey, DesignToken<PropertyValue>>>;
+/**
+ * Utility for creating token interfaces in `Theme`
+ */
+export declare type DesignTokenValues<PropertyValueKey extends PropKey, PropertyValue, Output extends OutputVariantKey = unknown, Platform extends PlatformKey = unknown> = Output extends 'required' ? RequiredTokenValues<PropertyValueKey, PropertyValue, Platform> : Output extends 'optional' ? OptionalTokenValues<PropertyValueKey, PropertyValue, Platform> : DefaultTokenValues<PropertyValueKey, PropertyValue, Platform>;
+export {};

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

@@ -1,5 +1,5 @@
 import { PartialDeep } from 'type-fest';
-import { Tokens, WebTokens } from './tokens';
+import { DefaultTokens, Tokens, WebTokens } from './tokens';
 import { Breakpoints } from './breakpoints';
 export * from './tokens/types/designToken';
 export type { FontSizes } from './tokens/fontSizes';
@@ -87,7 +87,7 @@ export interface Theme {
      * multiple themes on a page.
      */
     name: string;
-    tokens?: PartialDeep<Tokens>;
+    tokens?: Tokens;
     breakpoints?: PartialDeep<Breakpoints>;
     /**
      * Overrides allow you to change design tokens in different contexts, like
@@ -98,19 +98,18 @@ export interface Theme {
     overrides?: Array<Override>;
 }
 /**
- * A BaseTheme has all tokens and breakpoints required
+ * A DefaultTheme has all tokens and breakpoints required
  */
-export interface BaseTheme extends Theme {
-    tokens: Tokens;
+export interface DefaultTheme extends Pick<Theme, 'name' | 'overrides'> {
+    tokens: DefaultTokens;
     breakpoints: Breakpoints;
-    overrides?: Array<Override>;
 }
 /**
  * WebTheme is a fully built theme that has cssText based
  * on the design tokens and all design tokens have added fields
  * to be used in Javascript/Typescript.
  */
-export interface WebTheme extends BaseTheme {
-    tokens: WebTokens;
+export interface WebTheme extends Pick<Theme, 'breakpoints' | 'name' | 'overrides'> {
     cssText: string;
+    tokens: WebTokens;
 }

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

@@ -1,8 +1,36 @@
-import { DesignToken } from './tokens/types/designToken';
+import { DesignToken, WebDesignToken } from './tokens/types/designToken';
 export declare const CSS_VARIABLE_PREFIX = "amplify";
-export declare function cssValue(token: DesignToken): any;
+export declare function cssValue(token: DesignToken<{
+    value: unknown;
+}>): unknown;
 interface NameTransformProps {
     path?: Array<string>;
 }
 export declare function cssNameTransform({ path }: NameTransformProps): string;
+/**
+ * Helper function to test if something is a design token or not.
+ * Used in the React component style props.
+ *
+ * @param value - thing to test if it is a design token or not
+ * @returns boolean
+ */
+export declare function isDesignToken(value: unknown): value is WebDesignToken;
+declare type SetupTokensProps = {
+    tokens: Record<string | number, any>;
+    path?: Array<string>;
+    setupToken: SetupToken;
+};
+export declare type SetupToken<ReturnType = any> = (args: {
+    token: BaseDesignToken;
+    path: Array<string>;
+}) => ReturnType;
+declare type BaseDesignToken = {
+    value: string | number;
+};
+/**
+ * Recursive function that will walk down the token object
+ * and perform the setupToken function on each token.
+ * Similar to what Style Dictionary does.
+ */
+export declare function setupTokens({ tokens, path, setupToken, }: SetupTokensProps): any;
 export {};

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

@@ -1,5 +1,6 @@
 export * from './validator';
 export * from './user';
+export * from './utils';
 export * from './form';
 export * from './attributes';
 export * from './stateMachine';

package/dist/types/types/authenticator/user.d.ts

@@ -30,6 +30,13 @@ export interface AmplifyUser extends CognitoUser {
  */
 export interface CognitoUserAmplify extends AmplifyUser {
 }
+/**
+ * Cognito user contact method types that have not been verified as valid
+ */
+export declare enum UnverifiedContactMethodType {
+    Email = "email",
+    PhoneNumber = "phone_number"
+}
 /**
  * Cognito user contact methods that have not been verified as valid
  */

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

@@ -0,0 +1 @@
+export declare const isUnverifiedContactMethodType: (value: string) => boolean;