@astryx-vue/core 0.2.6 → 0.4.0

package/dist/{types-gKsEkk2g.d.ts → types-CsqwQkf1.d.ts}

@@ -1,5 +1,5 @@
 import { i as SyntaxThemeDefinition } from "./syntaxTheme-CwVEcVDk.js";
-import { t as SemanticIconMap } from "./semantic-CKH9XVqa.js";
+import { t as SemanticIconMap } from "./semantic-BF_AjLvk.js";
 import { Component } from "vue";
 //#region src/Indicator/types.d.ts
 /**
@@ -170,6 +170,92 @@ type TypeScaleTokens = Record<string, string>;
  */
 declare function expandTypeScale(config: TypeScaleConfig): TypeScaleTokens;
 //#endregion
+//#region src/Theme/adaptationTypes.d.ts
+/** Fixed names for viewport-width tier start points. */
+declare const WIDTH_BREAKPOINT_NAMES: readonly ["sm", "md", "lg", "xl", "2xl"];
+/** One fixed viewport-width breakpoint name. */
+type WidthBreakpointName = (typeof WIDTH_BREAKPOINT_NAMES)[number];
+/** A complete map of viewport-width tier start points, in CSS px. */
+type WidthBreakpoints = Record<WidthBreakpointName, number>;
+/** Default width tier start points, in CSS px. */
+declare const DEFAULT_WIDTH_BREAKPOINTS: Readonly<WidthBreakpoints>;
+/** `from` is inclusive, `below` is exclusive. */
+interface ThemeAdaptationWidthCondition {
+  from?: WidthBreakpointName;
+  below?: WidthBreakpointName;
+}
+/** Environment fields. Every field present must match. */
+interface ThemeAdaptationCondition {
+  /** Viewport width range, by named breakpoint. */
+  width?: ThemeAdaptationWidthCondition;
+  /** Primary pointer precision. */
+  pointer?: 'coarse' | 'fine';
+  /** `prefers-contrast`. */
+  contrast?: 'more' | 'less' | 'no-preference';
+  /** `prefers-reduced-motion`. */
+  motion?: 'reduce' | 'no-preference';
+}
+/** Typography inside a rule. A partial scale is completed from the root theme. */
+interface ThemeAdaptationTypographyConfig extends Omit<TypographyConfig, 'scale'> {
+  scale?: Partial<Pick<TypeScaleConfig, 'base' | 'ratio'>>;
+}
+/** Theme values one rule writes while its condition matches. */
+interface ThemeAdaptationValue {
+  /** Partial values are completed from the root theme's typography. */
+  typography?: ThemeAdaptationTypographyConfig;
+  /** Merged over the root theme's color config. */
+  color?: Partial<ColorScaleConfig>;
+  /** Completed from the root theme's radius config. */
+  radius?: Partial<RadiusScaleConfig>;
+  /** Completed from the root theme's motion config. */
+  motion?: Partial<MotionScaleConfig>;
+  /** Shared token writes. */
+  tokens?: ThemeTokens;
+  /** New values for theme-local tokens the root theme already declares. */
+  localTokens?: Record<string, ThemeTokenValue>;
+  /** Component style writes. */
+  components?: ComponentStyleMap;
+}
+/** One ordered condition-to-value rule. */
+interface ThemeAdaptationRule {
+  when: ThemeAdaptationCondition;
+  value: ThemeAdaptationValue;
+}
+/**
+ * Environment adaptations for `defineTheme({ adaptations })`.
+ *
+ * Rules are written in order after the root theme. When several match, the
+ * later rule wins, the same way later CSS wins.
+ */
+interface ThemeAdaptations {
+  /** Overrides for the five width points. On its own this writes no CSS. */
+  widthBreakpoints?: Partial<WidthBreakpoints>;
+  rules?: ThemeAdaptationRule[];
+}
+/** Validated adaptations kept on a theme, so a child theme can re-resolve them. */
+interface NormalizedThemeAdaptations {
+  widthBreakpoints: WidthBreakpoints;
+  rules: ThemeAdaptationRule[];
+}
+/** The root theme's generator configs. Rules complete their partial values from these. */
+interface ThemeGenerativeAxes {
+  typography?: TypographyConfig;
+  color?: ColorScaleConfig;
+  radius?: RadiusScaleConfig;
+  motion?: MotionScaleConfig;
+}
+/** One rule lowered to concrete writes, ready to compile. */
+interface ResolvedThemeAdaptationRule {
+  when: ThemeAdaptationCondition;
+  /** Media query text without the `@media` keyword. */
+  query: string;
+  /** Prefixed token writes. */
+  tokens: Record<string, string>;
+  /** Theme-local token writes, by exact name. */
+  localTokens?: Record<string, string>;
+  components?: ComponentStyleMap;
+}
+//#endregion
 //#region src/Theme/types.d.ts
 /** Color mode for a theme subtree. `system` follows the page and the OS. */
 type ThemeMode = 'light' | 'dark' | 'system';
@@ -182,9 +268,11 @@ type ThemeMode = 'light' | 'dark' | 'system';
 type ThemeTokenValue = string | readonly [string, string];
 /** CSS custom properties for a theme. Keys may omit the `--astryx-` prefix. */
 type ThemeTokens = Record<string, ThemeTokenValue>;
-/** Token overrides for one inverted surface. */
+/** Overrides for one inverted surface. Same shape as the theme's own. */
 interface ThemeSurfaceInput {
   tokens?: ThemeTokens;
+  /** Component styles for content on this surface. */
+  components?: ComponentStyleMap;
 }
 /**
  * CSS declarations for one component state.
@@ -196,9 +284,11 @@ type StyleOverrides = Record<string, string | Record<string, string>>;
 /**
  * Per-component style overrides.
  *
- * `base` matches the component root. `variant:secondary` matches that variant.
+ * Keys are theme targets named `<component-kebab>-<part>`, such as `button`,
+ * `card-header`, or `radio-indicator`. Under each target, `base` matches the
+ * target itself, `variant:secondary` matches `[data-variant="secondary"]`, a
+ * bare state such as `checked` matches `[data-checked="checked"]`, and
  * `variant:destructive+size:sm` matches both at once.
- * Component names are the public names, such as `button` or `radio-indicator`.
  */
 type ComponentStyleMap = Record<string, Record<string, StyleOverrides>>;
 /** One font role. Heading inherits body family and fallbacks when it omits them. */
@@ -229,6 +319,15 @@ interface DefineThemeInput {
   name: string;
   /** Semantic token overrides. These win over generated values, token by token. */
   tokens?: ThemeTokens;
+  /**
+   * Values only this theme family uses, keyed by their exact custom-property
+   * name, such as `--brand-ink`. No prefix is added or required.
+   *
+   * A shared token name (`--color-accent`) is refused here, so the two maps
+   * never hold the same name. A theme that extends this one inherits these
+   * and may replace their values. A reference cycle between them is an error.
+   */
+  localTokens?: Record<string, ThemeTokenValue>;
   /**
    * Accent palette. Neutrals, surfaces, text, icons, and borders come from the
    * seed. Explicit `tokens` still win.
@@ -249,10 +348,29 @@ interface DefineThemeInput {
   extends?: ThemeDefinition;
   /** Syntax colors for code in this subtree, unless a SyntaxTheme is closer. */
   syntax?: SyntaxThemeDefinition;
-  /** Extra tokens for content on a dark surface. */
+  /** Extra tokens and component styles for content on a dark surface. */
   onDark?: ThemeSurfaceInput;
-  /** Extra tokens for content on a light surface. */
+  /** Extra tokens and component styles for content on a light surface. */
   onLight?: ThemeSurfaceInput;
+  /**
+   * Values that apply only in some environments: a width range, a coarse
+   * pointer, a contrast or reduced-motion preference.
+   *
+   * Width points are named `sm`, `md`, `lg`, `xl`, `2xl` and default to 640,
+   * 768, 1024, 1280, 1536 CSS px. Fields inside one `when` must all match.
+   * Rules apply in order after the root theme; a later match wins.
+   *
+   * @example
+   * ```ts
+   * adaptations: {
+   *   rules: [{
+   *     when: { pointer: 'coarse', width: { below: 'lg' } },
+   *     value: { typography: { scale: { base: 16, ratio: 1.1736 } } },
+   *   }],
+   * }
+   * ```
+   */
+  adaptations?: ThemeAdaptations;
   /**
    * Semantic icon name to Iconify id.
    *
@@ -270,12 +388,18 @@ interface DefineThemeInput {
 }
 interface ThemeDefinition {
   name: string;
-  /** Token values already written as CSS. */
+  /** Token values already written as CSS, with the `--astryx-` prefix. */
   tokens: Readonly<Record<string, string>>;
+  /** Theme-local values by exact name. Absent when the theme family declares none. */
+  localTokens?: Readonly<Record<string, string>>;
   /** Extra tokens applied by MediaTheme when the surface is dark. */
   onDark: Readonly<Record<string, string>>;
   /** Extra tokens applied by MediaTheme when the surface is light. */
   onLight: Readonly<Record<string, string>>;
+  /** Component styles on a dark MediaTheme surface. */
+  onDarkComponents?: ComponentStyleMap;
+  /** Component styles on a light MediaTheme surface. */
+  onLightComponents?: ComponentStyleMap;
   syntax?: SyntaxThemeDefinition;
   /** Semantic icon overrides. Absent when this theme does not set any. */
   icons?: SemanticIconMap;
@@ -287,10 +411,19 @@ interface ThemeDefinition {
    */
   components?: ComponentStyleMap;
   /**
-   * Compiled component rules, scoped to `[data-astryx-theme="<name>"]`
-   * and placed in the `astryx.overrides` layer.
+   * Compiled rules, scoped to `[data-astryx-theme="<name>"]` and placed in
+   * the `astryx.overrides` layer: the body font, component styles,
+   * adaptations, then media-surface styles, in that cascade order.
    */
   css?: string;
+  /** Validated adaptations, kept so a child theme can re-resolve them. */
+  adaptations?: NormalizedThemeAdaptations;
+  /** Adaptation rules lowered to concrete writes. */
+  adaptationRules?: readonly ResolvedThemeAdaptationRule[];
+  /** The generator configs adaptation rules complete themselves from. */
+  axes?: ThemeGenerativeAxes;
+  /** Which theme in the lineage declared each local token. */
+  localTokenOwners?: Readonly<Record<string, string>>;
   readonly __astryxTheme: true;
 }
 interface ThemeProps {
@@ -317,4 +450,4 @@ interface MediaThemeProps {
   fallback?: 'dark' | 'light';
 }
 //#endregion
-export { IndicatorRegistry as A, IndicatorComponent as C, IndicatorName as D, IndicatorMap as E, IndicatorState as M, IndicatorPosition as O, CoreIndicatorName as S, IndicatorFamilyMap as T, expandRadiusScale as _, StyleOverrides as a, ColorScaleConfig as b, ThemeProps as c, ThemeTokens as d, TypographyConfig as f, RadiusScaleConfig as g, expandTypeScale as h, MediaThemeProps as i, IndicatorSize as j, IndicatorProps as k, ThemeSurfaceInput as l, TypeScaleConfig as m, DefineThemeInput as n, ThemeDefinition as o, TypographyRole as p, MediaThemeMode as r, ThemeMode as s, ComponentStyleMap as t, ThemeTokenValue as u, MotionScaleConfig as v, IndicatorFamily as w, expandColorScale as x, expandMotionScale as y };
+export { ColorScaleConfig as A, IndicatorRegistry as B, WidthBreakpoints as C, expandRadiusScale as D, RadiusScaleConfig as E, IndicatorFamilyMap as F, IndicatorState as H, IndicatorMap as I, IndicatorName as L, CoreIndicatorName as M, IndicatorComponent as N, MotionScaleConfig as O, IndicatorFamily as P, IndicatorPosition as R, WidthBreakpointName as S, expandTypeScale as T, IndicatorSize as V, ThemeAdaptationTypographyConfig as _, StyleOverrides as a, ThemeAdaptations as b, ThemeProps as c, ThemeTokens as d, TypographyConfig as f, ThemeAdaptationRule as g, ThemeAdaptationCondition as h, MediaThemeProps as i, expandColorScale as j, expandMotionScale as k, ThemeSurfaceInput as l, DEFAULT_WIDTH_BREAKPOINTS as m, DefineThemeInput as n, ThemeDefinition as o, TypographyRole as p, MediaThemeMode as r, ThemeMode as s, ComponentStyleMap as t, ThemeTokenValue as u, ThemeAdaptationValue as v, TypeScaleConfig as w, WIDTH_BREAKPOINT_NAMES as x, ThemeAdaptationWidthCondition as y, IndicatorProps as z };