@sanity/ui 3.0.0-static.34 → 3.0.0-static.36

package/dist/theme.d.cts

@@ -1,369 +1,501 @@
-import { ColorHues, ColorTint } from "@sanity/color";
-/** @public */
-declare const HUES: readonly ["gray", "blue", "purple", "magenta", "red", "orange", "yellow", "green", "cyan"];
-/** @public */
-declare const TINTS: readonly [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
-/** @public */
-declare const AVATAR_SIZE: readonly [0, 1, 2, 3];
-/** @public */
-declare const CONTAINER_SCALE: readonly [0, 1, 2, 3, 4, 5];
-/** @public */
-declare const CONTAINER: [...typeof CONTAINER_SCALE, "auto"];
-/** @public */
-declare const RADIUS: readonly [0, 1, 2, 3, 4, 5, 6];
-/** @public */
-declare const SPACE: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
-/** @public */
-declare const FONT_CODE_SIZE: readonly [0, 1, 2, 3, 4];
-/** @public */
-declare const FONT_HEADING_SIZE: readonly [0, 1, 2, 3, 4, 5];
-/** @public */
-declare const FONT_LABEL_SIZE: readonly [0, 1, 2, 3, 4, 5];
+import type {ColorHues} from '@sanity/color'
+import type {ColorTint} from '@sanity/color'
+
+/** @public */
+export declare const AVATAR_COLORS: readonly [
+  'gray',
+  'blue',
+  'purple',
+  'magenta',
+  'red',
+  'orange',
+  'yellow',
+  'green',
+  'cyan',
+]
+
+/** @public */
+export declare const AVATAR_SIZE: readonly [0, 1, 2, 3]
+
+/** @public */
+export declare type AvatarColor = (typeof AVATAR_COLORS)[number]
+
+/** @public */
+export declare interface AvatarColorProperties {
+  _hue: Hue
+  bg: ColorValue
+  fg: ColorValue
+}
+
+/** @public */
+export declare type AvatarsColor = Record<AvatarColor, AvatarColorProperties>
+
+/** @public */
+export declare type AvatarSize = (typeof AVATAR_SIZE)[number]
+
+/** @public */
+export declare type BoxShadow = [number, number, number, number]
+
+/** @public */
+export declare function buildTheme(options?: ThemeOptions): Theme
+
+/** @public */
+export declare const BUTTON_MODES: readonly ['default', 'ghost', 'bleed']
+
+/** @public */
+export declare type ButtonMode = (typeof BUTTON_MODES)[number]
+
+/** @public */
+export declare const CARD_TONES: readonly [
+  'transparent',
+  'default',
+  'neutral',
+  'primary',
+  'suggest',
+  'positive',
+  'caution',
+  'critical',
+]
+
+/** @public */
+export declare interface CardColorTokens {
+  _hue: Hue
+  avatar: AvatarsColor
+  backdrop: ColorValue
+  code: {
+    bg: ColorValue
+    fg: ColorValue
+    token: {
+      atrule: ColorValue
+      attrName: ColorValue
+      attrValue: ColorValue
+      attribute: ColorValue
+      boolean: ColorValue
+      builtin: ColorValue
+      cdata: ColorValue
+      char: ColorValue
+      class: ColorValue
+      className: ColorValue
+      comment: ColorValue
+      constant: ColorValue
+      deleted: ColorValue
+      doctype: ColorValue
+      entity: ColorValue
+      function: ColorValue
+      hexcode: ColorValue
+      id: ColorValue
+      important: ColorValue
+      inserted: ColorValue
+      keyword: ColorValue
+      number: ColorValue
+      operator: ColorValue
+      prolog: ColorValue
+      property: ColorValue
+      pseudoClass: ColorValue
+      pseudoElement: ColorValue
+      punctuation: ColorValue
+      regex: ColorValue
+      selector: ColorValue
+      string: ColorValue
+      symbol: ColorValue
+      tag: ColorValue
+      unit: ColorValue
+      url: ColorValue
+      variable: ColorValue
+    }
+  }
+  focusRing: ColorValue
+  link: {
+    fg: ColorValue
+  }
+  shadow: {
+    outline: ColorValue
+    umbra: ColorValue
+    penumbra: ColorValue
+    ambient: ColorValue
+  }
+  skeleton: {
+    from: ColorValue
+    to: ColorValue
+  }
+  variant: Record<ColorVariant, ElementsColorTokens>
+}
+
 /** @public */
-declare const FONT_TEXT_SIZE: readonly [0, 1, 2, 3, 4];
+export declare type CardTone = (typeof CARD_TONES)[number]
+
 /** @public */
-declare const SHADOW: readonly [0, 1, 2, 3, 4, 5];
+export declare type Color = Record<CardTone, CardColorTokens>
+
 /** @public */
-declare const COLOR_SCHEMES: readonly ["light", "dark"];
+export declare const COLOR_SCHEMES: readonly ['light', 'dark']
+
 /** @public */
-declare const COLOR_VARIANTS: readonly ["tinted", "solid"];
+export declare const COLOR_VARIANTS: readonly ['tinted', 'solid']
+
+/** @internal */
+export declare interface ColorInheritNode {
+  type: 'inherit'
+}
+
+/** @internal */
+export declare interface ColorNode {
+  type: 'color'
+  name: 'black' | 'white'
+  /** Between 0 and 1 */
+  opacity: number
+  /** Between 0 and 1 */
+  mix: number
+}
+
 /** @public */
-declare const AVATAR_COLORS: readonly ["gray", "blue", "purple", "magenta", "red", "orange", "yellow", "green", "cyan"];
+export declare type ColorScheme = (typeof COLOR_SCHEMES)[number]
+
+/** @internal */
+export declare interface ColorTintNode {
+  type: 'tint'
+  hue: Hue
+  tint: Tint
+  /** Between 0 and 1 */
+  opacity: number
+  /** Between 0 and 1 */
+  mix: number
+}
+
+/** @public */
+export declare type ColorToken =
+  | `inherit`
+  | `black`
+  | `black/${ColorTokenOpacityValue}`
+  | `white`
+  | `white/${ColorTokenOpacityValue}`
+  | `${Hue}-${Tint}`
+  | `${Hue}-${Tint}/${ColorTokenOpacityValue}`
+  | `${Hue}-${Tint} ${number}%`
+  | `${Tint}`
+  | `${Tint}/${ColorTokenOpacityValue}`
+  | `${Tint} ${number}%`
+
+/** @public */
+export declare type ColorTokenOpacityValue = `0` | `0.${number}` | `1`
+
+/** @public */
+export declare type ColorTokens = Record<'*' | CardTone, CardColorTokens>
+
+/**
+ * Theme color values are tuples of [light, dark] color tokens.
+ *
+ * @public
+ */
+export declare type ColorValue = [ColorToken, ColorToken]
+
+/** @public */
+export declare type ColorVariant = (typeof COLOR_VARIANTS)[number]
+
+/** @public */
+export declare const CONTAINER: [...typeof CONTAINER_SCALE, 'auto']
+
+/** @public */
+export declare const CONTAINER_SCALE: readonly [0, 1, 2, 3, 4, 5]
+
+/** @public */
+export declare type ContainerScale = (typeof CONTAINER_SCALE)[number]
+
+/** @public */
+export declare type ContainerWidth = (typeof CONTAINER)[number]
+
+/** @public */
+export declare const ELEMENT_TONES: readonly [
+  'default',
+  'neutral',
+  'primary',
+  'suggest',
+  'positive',
+  'caution',
+  'critical',
+]
+
+/** @public */
+export declare interface ElementColorTokens {
+  _hue: Hue
+  bg: {
+    0: ColorValue
+    4: ColorValue
+  }
+  border: {
+    0: ColorValue
+    4: ColorValue
+  }
+  fg: {
+    0: ColorValue
+    4: ColorValue
+  }
+}
+
 /** @public */
-declare const CARD_TONES: readonly ["transparent", "default", "neutral", "primary", "suggest", "positive", "caution", "critical"];
+export declare type ElementsColorTokens = Record<'*' | ElementTone, ElementColorTokens>
+
 /** @public */
-declare const ELEMENT_TONES: readonly ["default", "neutral", "primary", "suggest", "positive", "caution", "critical"];
+export declare type ElementTone = (typeof ELEMENT_TONES)[number]
+
 /** @public */
-declare const BUTTON_MODES: readonly ["default", "ghost", "bleed"];
+export declare interface FocusRing {
+  offset: number
+  width: number
+}
+
 /** @public */
-type Hue = (typeof HUES)[number];
+export declare interface Font {
+  family: string
+  featureSettings?: string
+  weight: FontWeights
+  scale: FontSize[]
+}
+
 /** @public */
-type Tint = (typeof TINTS)[number];
+export declare const FONT_CODE_SIZE: readonly [0, 1, 2, 3, 4]
+
 /** @public */
-type AvatarColor = (typeof AVATAR_COLORS)[number];
+export declare const FONT_HEADING_SIZE: readonly [0, 1, 2, 3, 4, 5]
+
 /** @public */
-type ColorTokenOpacityValue = `0` | `0.${number}` | `1`;
+export declare const FONT_LABEL_SIZE: readonly [0, 1, 2, 3, 4, 5]
+
 /** @public */
-type ColorToken = `inherit` | `black` | `black/${ColorTokenOpacityValue}` | `white` | `white/${ColorTokenOpacityValue}` | `${Hue}-${Tint}` | `${Hue}-${Tint}/${ColorTokenOpacityValue}` | `${Hue}-${Tint} ${number}%` | `${Tint}` | `${Tint}/${ColorTokenOpacityValue}` | `${Tint} ${number}%`;
+export declare const FONT_TEXT_SIZE: readonly [0, 1, 2, 3, 4]
+
 /** @public */
-interface ResolvedColorToken {
-  color: {
-    type: "inherit";
-  } | {
-    type: "black" | "white";
-  } | {
-    type: "hue";
-    hue: Hue;
-    tint: Tint;
-  };
-  opacity: number;
-  mix: number;
-}
+export declare type FontCodeSize = (typeof FONT_CODE_SIZE)[number]
+
 /** @public */
-type ColorTokens = Record<"*" | CardTone, CardColorTokens>;
+export declare type FontHeadingSize = (typeof FONT_HEADING_SIZE)[number]
+
 /** @public */
-interface Tokens {
-  color: ColorTokens;
-}
+export declare type FontLabelSize = (typeof FONT_LABEL_SIZE)[number]
+
 /** @public */
-type PartialTokens<T> = T extends [ColorToken, ColorToken] ? T : T extends {} ? { [P in keyof T]?: PartialTokens<T[P]> } : T;
-/**
-* Theme color values are tuples of [light, dark] color tokens.
-*
-* @public
-*/
-type ColorValue = [ColorToken, ColorToken];
-/** @public */
-interface AvatarColorProperties {
-  _hue: Hue;
-  bg: ColorValue;
-  fg: ColorValue;
+export declare interface Fonts {
+  code: Font
+  heading: Font
+  label: Font
+  text: Font
 }
-/** @public */
-type AvatarsColor = Record<AvatarColor, AvatarColorProperties>;
-/** @public */
-interface ElementColorTokens {
-  _hue: Hue;
-  bg: {
-    0: ColorValue;
-    4: ColorValue;
-  };
-  border: {
-    0: ColorValue;
-    4: ColorValue;
-  };
-  fg: {
-    0: ColorValue;
-    4: ColorValue;
-  };
+
+/** @public */
+export declare interface FontSize {
+  ascenderHeight: number
+  descenderHeight: number
+  fontSize: number
+  iconSize: number
+  letterSpacing: number
+  lineHeight: number
+  customIconSize: number
 }
+
 /** @public */
-type ElementsColorTokens = Record<"*" | ElementTone, ElementColorTokens>;
+export declare type FontTextSize = (typeof FONT_TEXT_SIZE)[number]
+
 /** @public */
-type ColorVariant = (typeof COLOR_VARIANTS)[number];
+export declare type FontWeight = 'regular' | 'medium' | 'semibold' | 'bold'
+
 /** @public */
-interface CardColorTokens {
-  _hue: Hue;
-  avatar: AvatarsColor;
-  backdrop: ColorValue;
-  code: {
-    bg: ColorValue;
-    fg: ColorValue;
-    token: {
-      atrule: ColorValue;
-      attrName: ColorValue;
-      attrValue: ColorValue;
-      attribute: ColorValue;
-      boolean: ColorValue;
-      builtin: ColorValue;
-      cdata: ColorValue;
-      char: ColorValue;
-      class: ColorValue;
-      className: ColorValue;
-      comment: ColorValue;
-      constant: ColorValue;
-      deleted: ColorValue;
-      doctype: ColorValue;
-      entity: ColorValue;
-      function: ColorValue;
-      hexcode: ColorValue;
-      id: ColorValue;
-      important: ColorValue;
-      inserted: ColorValue;
-      keyword: ColorValue;
-      number: ColorValue;
-      operator: ColorValue;
-      prolog: ColorValue;
-      property: ColorValue;
-      pseudoClass: ColorValue;
-      pseudoElement: ColorValue;
-      punctuation: ColorValue;
-      regex: ColorValue;
-      selector: ColorValue;
-      string: ColorValue;
-      symbol: ColorValue;
-      tag: ColorValue;
-      unit: ColorValue;
-      url: ColorValue;
-      variable: ColorValue;
-    };
-  };
-  focusRing: ColorValue;
-  link: {
-    fg: ColorValue;
-  };
-  shadow: {
-    outline: ColorValue;
-    umbra: ColorValue;
-    penumbra: ColorValue;
-    ambient: ColorValue;
-  };
-  skeleton: {
-    from: ColorValue;
-    to: ColorValue;
-  };
-  variant: Record<ColorVariant, ElementsColorTokens>;
+export declare interface FontWeights {
+  regular: number
+  medium: number
+  semibold: number
+  bold: number
 }
-/** @public */
-type Color = Record<CardTone, CardColorTokens>;
-/** @public */
-interface Input {
+
+/** @public */
+export declare type Hue = (typeof HUES)[number]
+
+/** @public */
+export declare const HUES: readonly [
+  'gray',
+  'blue',
+  'purple',
+  'magenta',
+  'red',
+  'orange',
+  'yellow',
+  'green',
+  'cyan',
+]
+
+/** @public */
+export declare interface Input {
   checkbox: {
-    size: number;
-    focusRing: FocusRing;
-  };
+    size: number
+    focusRing: FocusRing
+  }
   radio: {
-    size: number;
-    markSize: number;
-    focusRing: FocusRing;
-  };
+    size: number
+    markSize: number
+    focusRing: FocusRing
+  }
   switch: {
-    width: number;
-    height: number;
-    padding: number;
-    transitionDurationMs: number;
-    transitionTimingFunction: string;
-    focusRing: FocusRing;
-  };
+    width: number
+    height: number
+    padding: number
+    transitionDurationMs: number
+    transitionTimingFunction: string
+    focusRing: FocusRing
+  }
   border: {
-    width: number;
-  };
+    width: number
+  }
   select: {
-    focusRing: FocusRing;
-  };
+    focusRing: FocusRing
+  }
   text: {
-    focusRing: FocusRing;
-  };
+    focusRing: FocusRing
+  }
 }
+
 /** @public */
-type ColorScheme = (typeof COLOR_SCHEMES)[number];
-/** @public */
-type CardTone = (typeof CARD_TONES)[number];
-/** @public */
-type ElementTone = (typeof ELEMENT_TONES)[number];
-/** @public */
-type ButtonMode = (typeof BUTTON_MODES)[number];
-/** @public */
-interface ThemeAvatar {
-  sizes: {
-    /** Spacing between avatars in an <AvatarStack> component (px) */
-    distance: number;
-    /** Diameter of the avatar (px) */
-    size: number;
-  }[];
-  focusRing: FocusRing;
-}
-/** @public */
-type BoxShadow = [number, number, number, number];
-/** @public */
-interface ShadowProperties {
-  umbra: BoxShadow;
-  penumbra: BoxShadow;
-  ambient: BoxShadow;
-}
-/** @public */
-interface Layer {
+export declare interface Layer {
   dialog: {
-    zOffset: number;
-  };
+    zOffset: number
+  }
   popover: {
-    zOffset: number;
-  };
+    zOffset: number
+  }
   tooltip: {
-    zOffset: number;
-  };
+    zOffset: number
+  }
 }
+
 /** @public */
-interface FontWeights {
-  regular: number;
-  medium: number;
-  semibold: number;
-  bold: number;
+export declare interface Palette {
+  black: ColorTint
+  white: ColorTint
+  hues: ColorHues
 }
-/** @public */
-interface FocusRing {
-  offset: number;
-  width: number;
+
+/** @internal */
+export declare function _parseColorToken(
+  str: ColorToken,
+  options: {
+    defaultHue: Hue
+  },
+): TokenizeColorResult
+
+/** @public */
+export declare type PartialTokens<T> = T extends [ColorToken, ColorToken]
+  ? T
+  : T extends {}
+    ? {
+        [P in keyof T]?: PartialTokens<T[P]>
+      }
+    : T
+
+/** @public */
+export declare const RADIUS: readonly [0, 1, 2, 3, 4, 5, 6]
+
+/** @public */
+export declare type Radius = (typeof RADIUS)[number]
+
+/** @public */
+export declare interface ResolvedColorToken {
+  color:
+    | {
+        type: 'inherit'
+      }
+    | {
+        type: 'black' | 'white'
+      }
+    | {
+        type: 'hue'
+        hue: Hue
+        tint: Tint
+      }
+  opacity: number
+  mix: number
 }
+
+/** @internal */
+export declare function resolveTokens(tokens?: PartialTokens<Tokens>): Tokens
+
 /** @public */
-type AvatarSize = (typeof AVATAR_SIZE)[number];
-/** @public */
-type ContainerScale = (typeof CONTAINER_SCALE)[number];
-/** @public */
-type ContainerWidth = (typeof CONTAINER)[number];
-/** @public */
-type Radius = (typeof RADIUS)[number];
-/** @public */
-type Space = (typeof SPACE)[number];
-/** @public */
-type FontWeight = "regular" | "medium" | "semibold" | "bold";
-/** @public */
-type FontCodeSize = (typeof FONT_CODE_SIZE)[number];
-/** @public */
-type FontHeadingSize = (typeof FONT_HEADING_SIZE)[number];
-/** @public */
-type FontLabelSize = (typeof FONT_LABEL_SIZE)[number];
-/** @public */
-type FontTextSize = (typeof FONT_TEXT_SIZE)[number];
-/** @public */
-type Shadow = (typeof SHADOW)[number];
-/** @public */
-interface Options {
-  tokens?: PartialTokens<Tokens>;
-}
+export declare const SHADOW: readonly [0, 1, 2, 3, 4, 5]
+
 /** @public */
-interface Palette {
-  black: ColorTint;
-  white: ColorTint;
-  hues: ColorHues;
-}
+export declare type Shadow = (typeof SHADOW)[number]
+
 /** @public */
-interface FontSize {
-  ascenderHeight: number;
-  descenderHeight: number;
-  fontSize: number;
-  iconSize: number;
-  letterSpacing: number;
-  lineHeight: number;
-  customIconSize: number;
+export declare interface ShadowProperties {
+  umbra: BoxShadow
+  penumbra: BoxShadow
+  ambient: BoxShadow
 }
+
 /** @public */
-interface Font {
-  family: string;
-  featureSettings?: string;
-  weight: FontWeights;
-  scale: FontSize[];
-}
+export declare const SPACE: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
+
 /** @public */
-interface Fonts {
-  code: Font;
-  heading: Font;
-  label: Font;
-  text: Font;
-}
+export declare type Space = (typeof SPACE)[number]
+
 /** @public */
-interface Theme {
-  _version: 3;
-  _tokens: Tokens;
-  avatar: ThemeAvatar;
+export declare interface Theme {
+  _version: 3
+  _tokens: Tokens
+  avatar: ThemeAvatar
   button: {
     border: {
-      width: number;
-    };
-    focusRing: FocusRing;
-    textWeight: FontWeight;
-  };
+      width: number
+    }
+    focusRing: FocusRing
+    textWeight: FontWeight
+  }
   card: {
     border: {
-      width: number;
-    };
-    focusRing: FocusRing;
+      width: number
+    }
+    focusRing: FocusRing
     shadow: {
-      outline: number;
-    };
-  };
-  color: Color;
-  container: number[];
-  font: Fonts;
-  input: Input;
-  layer: Layer;
-  media: number[];
-  palette: Palette;
-  radius: Record<Radius, number>;
-  shadow: Record<Shadow, ShadowProperties | undefined>;
-  space: Record<Space, number>;
+      outline: number
+    }
+  }
+  color: Color
+  container: number[]
+  font: Fonts
+  input: Input
+  layer: Layer
+  media: number[]
+  palette: Palette
+  radius: Record<Radius, number>
+  shadow: Record<Shadow, ShadowProperties | undefined>
+  space: Record<Space, number>
 }
-/** @internal */
-interface ColorNode {
-  type: "color";
-  name: "black" | "white";
-  /** Between 0 and 1 */
-  opacity: number;
-  /** Between 0 and 1 */
-  mix: number;
-}
-/** @internal */
-interface ColorTintNode {
-  type: "tint";
-  hue: Hue;
-  tint: Tint;
-  /** Between 0 and 1 */
-  opacity: number;
-  /** Between 0 and 1 */
-  mix: number;
+
+/** @public */
+export declare interface ThemeAvatar {
+  sizes: {
+    /** Spacing between avatars in an <AvatarStack> component (px) */
+    distance: number
+    /** Diameter of the avatar (px) */
+    size: number
+  }[]
+  focusRing: FocusRing
 }
-/** @internal */
-interface ColorInheritNode {
-  type: "inherit";
+
+/** @public */
+export declare interface ThemeOptions {
+  tokens?: PartialTokens<Tokens>
 }
-/** @internal */
-type TokenizeColorResult = ColorNode | ColorTintNode | ColorInheritNode;
-/** @internal */
-declare function _parseColorToken(str: ColorToken, options: {
-  defaultHue: Hue;
-}): TokenizeColorResult;
+
 /** @public */
-declare function buildTheme(options?: Options): Theme;
+export declare type Tint = (typeof TINTS)[number]
+
+/** @public */
+export declare const TINTS: readonly [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950]
+
 /** @internal */
-declare function resolveTokens(tokens?: PartialTokens<Tokens>): Tokens;
-export { AVATAR_COLORS, AVATAR_SIZE, AvatarColor, AvatarColorProperties, AvatarSize, AvatarsColor, BUTTON_MODES, BoxShadow, ButtonMode, CARD_TONES, COLOR_SCHEMES, COLOR_VARIANTS, CONTAINER, CONTAINER_SCALE, CardColorTokens, CardTone, Color, ColorInheritNode, ColorNode, ColorScheme, ColorTintNode, ColorToken, ColorTokenOpacityValue, ColorTokens, ColorValue, ColorVariant, ContainerScale, ContainerWidth, ELEMENT_TONES, ElementColorTokens, ElementTone, ElementsColorTokens, FONT_CODE_SIZE, FONT_HEADING_SIZE, FONT_LABEL_SIZE, FONT_TEXT_SIZE, FocusRing, Font, FontCodeSize, FontHeadingSize, FontLabelSize, FontSize, FontTextSize, FontWeight, FontWeights, Fonts, HUES, Hue, Input, Layer, Options, Palette, PartialTokens, RADIUS, Radius, ResolvedColorToken, SHADOW, SPACE, Shadow, ShadowProperties, Space, TINTS, Theme, ThemeAvatar, Tint, TokenizeColorResult, Tokens, _parseColorToken, buildTheme, resolveTokens };
+export declare type TokenizeColorResult = ColorNode | ColorTintNode | ColorInheritNode
+
+/** @public */
+export declare interface Tokens {
+  color: ColorTokens
+}
+
+export {}