@multiplatform.one/theme 6.1.0 → 6.4.0

package/types/theme/cookies.d.ts

@@ -0,0 +1,76 @@
+/**
+ * Cookie utilities for the semantic component theming system.
+ *
+ * Uses two cookie families:
+ *   - `mp.preset` — preset name string
+ *   - `mp.ov.0`, `mp.ov.1`, … — JSON of only changed knobs (partial Knobs),
+ *     chunked to stay under 4 KB per cookie
+ *
+ * Old cookie formats (`mp.overrides`, `mp.overrides0`, …) are NOT migrated —
+ * stale cookies are silently ignored/overwritten.
+ */
+import type { Knobs } from "./knobs";
+/** Cookie key for the active preset name. */
+export declare const cookiePreset = "mp.preset";
+/** Cookie key prefix for knob overrides (chunked). */
+export declare const cookieOverridesPrefix = "mp.ov";
+/**
+ * Split a cookie value string into chunks if it exceeds the threshold.
+ * Returns an array of chunks — if the value is small enough, the array
+ * contains a single element.
+ */
+export declare function splitCookieValue(value: string): string[];
+/**
+ * Reconstruct a cookie value from its split chunks.
+ */
+export declare function joinSplitCookieValues(chunks: string[]): string;
+/**
+ * Read the overrides cookie value, handling chunked cookies.
+ * Accepts the cookies object from `useCookies()`.
+ */
+export declare function readOverridesCookie(cookies: Record<string, string | undefined>): Partial<Knobs>;
+/**
+ * Read the preset name from the cookie.
+ */
+export declare function readPresetCookie(cookies: Record<string, string | undefined>): string | undefined;
+/**
+ * Write the preset name cookie.
+ * Returns the cookie key and value for the caller to pass to setCookie.
+ */
+export declare function writePresetCookie(presetName: string): {
+    key: string;
+    value: string;
+};
+/**
+ * Write overrides cookie, splitting if necessary.
+ * Returns an array of { key, value } pairs for the caller to pass to setCookie.
+ * Also returns keys to remove (old split cookies that are no longer needed).
+ */
+export declare function writeOverridesCookie(overrides: Partial<Knobs>): {
+    toSet: Array<{
+        key: string;
+        value: string;
+    }>;
+    toRemove: string[];
+};
+/**
+ * Compute the diff between a base knobs object and the current knobs to
+ * produce minimal overrides. Only includes keys where the value differs.
+ */
+export declare function computeOverrides(base: Knobs, current: Knobs): Partial<Knobs>;
+/**
+ * Build the list of cookie keys to watch for react-cookie.
+ */
+export declare function getCookieWatchList(): string[];
+/**
+ * Persist knob overrides to document cookies directly (no react-cookie).
+ * Useful outside of React component trees.
+ */
+export declare function persistPresetOverrides(overrides: Partial<Knobs>): void;
+/**
+ * Load knob overrides from document cookies directly (no react-cookie).
+ * Useful outside of React component trees and during SSR when given raw
+ * cookie headers.
+ */
+export declare function loadPresetOverrides(rawCookies?: Record<string, string | undefined>): Partial<Knobs>;
+//# sourceMappingURL=cookies.d.ts.map

package/types/theme/cookies.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cookies.d.ts","sourceRoot":"","sources":["../../src/theme/cookies.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAGH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAMrC,6CAA6C;AAC7C,eAAO,MAAM,YAAY,cAAc,CAAC;AAExC,sDAAsD;AACtD,eAAO,MAAM,qBAAqB,UAAU,CAAC;AAY7C;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,CASxD;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,MAAM,CAE9D;AAeD;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC,GAAG,OAAO,CAAC,KAAK,CAAC,CAiB/F;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC,GAAG,MAAM,GAAG,SAAS,CAEhG;AAMD;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,UAAU,EAAE,MAAM,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAEpF;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,SAAS,EAAE,OAAO,CAAC,KAAK,CAAC,GAAG;IAC/D,KAAK,EAAE,KAAK,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC7C,QAAQ,EAAE,MAAM,EAAE,CAAC;CACpB,CAgBA;AAMD;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,CAQ5E;AAMD;;GAEG;AACH,wBAAgB,kBAAkB,IAAI,MAAM,EAAE,CAM7C;AAED;;;GAGG;AACH,wBAAgB,sBAAsB,CAAC,SAAS,EAAE,OAAO,CAAC,KAAK,CAAC,GAAG,IAAI,CAQtE;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CACjC,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC,GAC9C,OAAO,CAAC,KAAK,CAAC,CAGhB"}

package/types/theme/cornerSmoothing.d.ts

@@ -0,0 +1,31 @@
+/**
+ * OPTICS corner smoothing (Axiom 15): `cornerSmoothing: "smooth"` upgrades
+ * circular-arc corners to continuous curvature — CSS
+ * `corner-shape: squircle` (≡ `superellipse(2)`, ≈ Apple's continuous
+ * corners / Figma smoothing 0.6) — as a WEB PROGRESSIVE ENHANCEMENT.
+ * Chromium 139+ paints it; every other engine drops the unknown declaration
+ * and keeps today's plain `border-radius` arc, so no `@supports` gate is
+ * needed for correctness.
+ *
+ * Delivery is a class + one mounted stylesheet (the hairline pattern):
+ * Tamagui strips unknown keys from the `style` prop (`style` is in
+ * skipProps and `cornerShape` is not a valid style key), but merges
+ * `className` into its atomic classes — so `resolveKnobs` attaches
+ * `className: cornerSmoothClassName` to every radius-bearing fragment when
+ * the knob is `smooth`, and this module owns the CSS those classes resolve
+ * against.
+ *
+ * Native twin: `cornerSmoothing.native.ts` (no CSS classes — native resolves
+ * to `round` until a SquircleView adoption lands, phase 2).
+ */
+/** Class attached to radius-bearing knob fragments at `cornerSmoothing: "smooth"`. */
+export declare const cornerSmoothClassName = "mp-corner-smooth";
+/**
+ * The squircle declaration. `corner-shape` composes with the element's
+ * existing `border-radius` (it reshapes the same corner box), so the
+ * fallback in non-supporting engines is automatic. Exported for unit tests.
+ */
+export declare const cornerSmoothingCss = ".mp-corner-smooth { corner-shape: squircle; }";
+/** Idempotently mount the corner-smoothing stylesheet (no-op off-DOM). */
+export declare function ensureCornerSmoothingStyles(): void;
+//# sourceMappingURL=cornerSmoothing.d.ts.map

package/types/theme/cornerSmoothing.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cornerSmoothing.d.ts","sourceRoot":"","sources":["../../src/theme/cornerSmoothing.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,sFAAsF;AACtF,eAAO,MAAM,qBAAqB,qBAAqB,CAAC;AAIxD;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,kDAA0D,CAAC;AAE1F,0EAA0E;AAC1E,wBAAgB,2BAA2B,IAAI,IAAI,CAOlD"}

package/types/theme/cornerSmoothing.native.d.ts

@@ -0,0 +1,14 @@
+/**
+ * OPTICS corner smoothing (Axiom 15) — native twin of `cornerSmoothing.ts`.
+ *
+ * React Native has no `corner-shape`; native resolves `cornerSmoothing` to
+ * `round` (resolveKnobs emits no class on native) until a SquircleView
+ * adoption lands (phase 2). Exports stay shape-compatible for shared code.
+ */
+/** Class attached on web only — never emitted into native fragments. */
+export declare const cornerSmoothClassName = "mp-corner-smooth";
+/** Web-only stylesheet — empty on native. */
+export declare const cornerSmoothingCss = "";
+/** Web-only stylesheet mount — no-op on native. */
+export declare function ensureCornerSmoothingStyles(): void;
+//# sourceMappingURL=cornerSmoothing.native.d.ts.map

package/types/theme/cornerSmoothing.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cornerSmoothing.native.d.ts","sourceRoot":"","sources":["../../src/theme/cornerSmoothing.native.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,wEAAwE;AACxE,eAAO,MAAM,qBAAqB,qBAAqB,CAAC;AAExD,6CAA6C;AAC7C,eAAO,MAAM,kBAAkB,KAAK,CAAC;AAErC,mDAAmD;AACnD,wBAAgB,2BAA2B,IAAI,IAAI,CAAG"}

package/types/theme/createDefaultThemeConfig.d.ts

@@ -0,0 +1,37 @@
+import type { CreateTamaguiProps, GenericFont } from "tamagui";
+import { type BaseThemeBuilderDefinition, type CreateThemesBuilderOptions, type ThemeBuilderDefinition } from "./createThemes";
+import type { Preset } from "./preset.types";
+import { type ThemeConfig } from "./shared";
+export interface CreateDefaultThemeConfigOptions {
+    /** Base theme palette (dark/light with optional shadows; defaults to the built-in neutral ramps) */
+    base?: BaseThemeBuilderDefinition;
+    /** Accent theme palette (defaults to the built-in accent ramps) */
+    accent?: ThemeBuilderDefinition;
+    /** Map of extra named themes with their palettes */
+    additionalThemes?: Record<string, ThemeBuilderDefinition>;
+    /** Font definitions (merged over the default heading/body fonts) */
+    fonts?: Record<string, GenericFont>;
+    /** Animation config (defaults to framework reanimated animations) */
+    animations?: CreateTamaguiProps["animations"];
+    /** Options for the theme builder (grandChildrenThemes, getTheme) */
+    builderOptions?: CreateThemesBuilderOptions;
+    /** Override tamagui settings */
+    settings?: Partial<NonNullable<CreateTamaguiProps["settings"]>>;
+    /** Override any top-level tamagui config property */
+    tamagui?: Partial<CreateTamaguiProps>;
+    /** Named theme presets for the preset system */
+    presets?: Record<string, Preset>;
+    /** Default preset name to use when no `mp.preset` cookie is set */
+    defaultPreset?: string;
+}
+/**
+ * Builds a complete Tamagui theme config with batteries included: calling it
+ * with zero options yields the framework's polished defaults — the neutral
+ * Radix-mauve-curve base ramps, the solid-surface brand accent ramps, Inter
+ * heading/body fonts and the interaction-ramp `getTheme` theme builder.
+ * Every option overrides its piece independently: `base`, `accent` and
+ * `builderOptions` each replace their default, while `fonts` are spread OVER
+ * the defaults so a partial font map keeps the default heading/body.
+ */
+export declare function createDefaultThemeConfig(options?: CreateDefaultThemeConfigOptions): ThemeConfig;
+//# sourceMappingURL=createDefaultThemeConfig.d.ts.map

package/types/theme/createDefaultThemeConfig.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createDefaultThemeConfig.d.ts","sourceRoot":"","sources":["../../src/theme/createDefaultThemeConfig.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE/D,OAAO,EACL,KAAK,0BAA0B,EAC/B,KAAK,0BAA0B,EAC/B,KAAK,sBAAsB,EAE5B,MAAM,gBAAgB,CAAC;AAKxB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,KAAK,WAAW,EAAqB,MAAM,UAAU,CAAC;AAE/D,MAAM,WAAW,+BAA+B;IAC9C,oGAAoG;IACpG,IAAI,CAAC,EAAE,0BAA0B,CAAC;IAClC,mEAAmE;IACnE,MAAM,CAAC,EAAE,sBAAsB,CAAC;IAChC,oDAAoD;IACpD,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,sBAAsB,CAAC,CAAC;IAC1D,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IACpC,qEAAqE;IACrE,UAAU,CAAC,EAAE,kBAAkB,CAAC,YAAY,CAAC,CAAC;IAC9C,oEAAoE;IACpE,cAAc,CAAC,EAAE,0BAA0B,CAAC;IAC5C,gCAAgC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,kBAAkB,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IAChE,qDAAqD;IACrD,OAAO,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACtC,gDAAgD;IAChD,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACjC,mEAAmE;IACnE,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;GAQG;AACH,wBAAgB,wBAAwB,CACtC,OAAO,GAAE,+BAAoC,GAC5C,WAAW,CAyDb"}

package/types/theme/createThemes.d.ts

@@ -0,0 +1,38 @@
+import { type CreateThemesProps } from "@tamagui/theme-builder";
+export interface Shadows {
+    shadow1: string;
+    shadow2: string;
+    shadow3: string;
+    shadow4: string;
+    shadow5: string;
+    shadow6: string;
+}
+export interface ThemeBuilderDefinition<DarkPalette extends string[] = string[], LightPalette extends string[] = string[]> {
+    darkPalette: DarkPalette;
+    lightPalette: LightPalette;
+}
+export interface BaseThemeBuilderDefinition<DarkPalette extends string[] = string[], LightPalette extends string[] = string[], DarkShadows extends Shadows = Shadows, LightShadows extends Shadows = Shadows> extends ThemeBuilderDefinition<DarkPalette, LightPalette> {
+    darkShadows?: DarkShadows;
+    lightShadows?: LightShadows;
+}
+export interface GetThemeProps {
+    name: string;
+    theme: Record<string, string>;
+    scheme?: "light" | "dark";
+    parentName: string;
+    parentNames: string[];
+    level: number;
+    palette?: string[];
+}
+export interface CreateThemesBuilderOptions {
+    grandChildrenThemes?: CreateThemesProps["grandChildrenThemes"];
+    getTheme?: (props: GetThemeProps) => Record<string, string | number>;
+}
+export declare const tintHueNames: Set<string>;
+export declare function createThemesBuilder(baseTheme: BaseThemeBuilderDefinition, accentTheme: ThemeBuilderDefinition, options?: CreateThemesBuilderOptions): {
+    themes(): Record<string, Record<string, string>>;
+    addTheme<K extends string>(name: K, theme: ThemeBuilderDefinition): Record<`dark_${K}` | `light_${K}`, {
+        [x: string]: string;
+    } & Record<string, string>>;
+};
+//# sourceMappingURL=createThemes.d.ts.map

package/types/theme/createThemes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createThemes.d.ts","sourceRoot":"","sources":["../../src/theme/createThemes.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,wBAAwB,CAAC;AAchC,MAAM,WAAW,OAAO;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,sBAAsB,CACrC,WAAW,SAAS,MAAM,EAAE,GAAG,MAAM,EAAE,EACvC,YAAY,SAAS,MAAM,EAAE,GAAG,MAAM,EAAE;IAExC,WAAW,EAAE,WAAW,CAAC;IACzB,YAAY,EAAE,YAAY,CAAC;CAC5B;AAED,MAAM,WAAW,0BAA0B,CACzC,WAAW,SAAS,MAAM,EAAE,GAAG,MAAM,EAAE,EACvC,YAAY,SAAS,MAAM,EAAE,GAAG,MAAM,EAAE,EACxC,WAAW,SAAS,OAAO,GAAG,OAAO,EACrC,YAAY,SAAS,OAAO,GAAG,OAAO,CACtC,SAAQ,sBAAsB,CAAC,WAAW,EAAE,YAAY,CAAC;IACzD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC9B,MAAM,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC1B,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB;AAED,MAAM,WAAW,0BAA0B;IACzC,mBAAmB,CAAC,EAAE,iBAAiB,CAAC,qBAAqB,CAAC,CAAC;IAC/D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;CACtE;AAQD,eAAO,MAAM,YAAY,aA6BvB,CAAC;AA0DH,wBAAgB,mBAAmB,CACjC,SAAS,EAAE,0BAA0B,EACrC,WAAW,EAAE,sBAAsB,EACnC,OAAO,CAAC,EAAE,0BAA0B;;aAkLzB,CAAC,SAAS,MAAM,QAAQ,CAAC,SAAS,sBAAsB,GAuB1D,MAAM,CAAC,QAAQ,CAAC,EAAE,GAAG,SAAS,CAAC,EAAE;;+BAAkC;EAG7E"}

package/types/theme/defaults/accent.d.ts

@@ -0,0 +1,3 @@
+import type { ThemeBuilderDefinition } from "../createThemes";
+export declare const defaultAccentTheme: ThemeBuilderDefinition;
+//# sourceMappingURL=accent.d.ts.map

package/types/theme/defaults/accent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accent.d.ts","sourceRoot":"","sources":["../../../src/theme/defaults/accent.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAE9D,eAAO,MAAM,kBAAkB,EAAE,sBAoChC,CAAC"}

package/types/theme/defaults/base.d.ts

@@ -0,0 +1,3 @@
+import type { BaseThemeBuilderDefinition } from "../createThemes";
+export declare const defaultBaseTheme: BaseThemeBuilderDefinition;
+//# sourceMappingURL=base.d.ts.map

package/types/theme/defaults/base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../src/theme/defaults/base.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,iBAAiB,CAAC;AAElE,eAAO,MAAM,gBAAgB,EAAE,0BA4D9B,CAAC"}

package/types/theme/defaults/builderOptions.d.ts

@@ -0,0 +1,3 @@
+import type { CreateThemesBuilderOptions } from "../createThemes";
+export declare const defaultBuilderOptions: CreateThemesBuilderOptions;
+//# sourceMappingURL=builderOptions.d.ts.map

package/types/theme/defaults/builderOptions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"builderOptions.d.ts","sourceRoot":"","sources":["../../../src/theme/defaults/builderOptions.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,0BAA0B,EAAiB,MAAM,iBAAiB,CAAC;AA+GjF,eAAO,MAAM,qBAAqB,EAAE,0BA8DnC,CAAC"}

package/types/theme/defaults/fonts.d.ts

@@ -0,0 +1,7 @@
+/** Inter dynamic tracking for a rendered `sizePx`, in em. */
+export declare function interTrackingEm(sizePx: number): number;
+/** Inter dynamic tracking for a rendered `sizePx`, in px (2-decimal). */
+export declare function interTrackingPx(sizePx: number): number;
+export declare const defaultHeadingFont: import("@tamagui/web").FillInFont<import("tamagui").GenericFont, 1 | 12 | 5 | 2 | 11 | 13 | 14 | 15 | 16 | 3 | 4 | 6 | 7 | 8 | 9 | 10 | "true">;
+export declare const defaultBodyFont: import("@tamagui/web").FillInFont<import("tamagui").GenericFont, 1 | 12 | 5 | 2 | 11 | 13 | 14 | 15 | 16 | 3 | 4 | 6 | 7 | 8 | 9 | 10 | "true">;
+//# sourceMappingURL=fonts.d.ts.map

package/types/theme/defaults/fonts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fonts.d.ts","sourceRoot":"","sources":["../../../src/theme/defaults/fonts.ts"],"names":[],"mappings":"AAuBA,6DAA6D;AAC7D,wBAAgB,eAAe,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAEtD;AAED,yEAAyE;AACzE,wBAAgB,eAAe,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAEtD;AAkCD,eAAO,MAAM,kBAAkB,iJAW9B,CAAC;AAEF,eAAO,MAAM,eAAe,iJAU3B,CAAC"}

package/types/theme/defaults/index.d.ts

@@ -0,0 +1,5 @@
+export * from "./accent";
+export * from "./base";
+export * from "./builderOptions";
+export * from "./fonts";
+//# sourceMappingURL=index.d.ts.map

package/types/theme/defaults/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/theme/defaults/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,kBAAkB,CAAC;AACjC,cAAc,SAAS,CAAC"}

package/types/theme/devtools/ColorLineVisualizer.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Color palette visualizer for devtools.
+ *
+ * Shows the 12-step color scale with semantic group brackets (Background,
+ * UI Background, Border, Primary, Text) all on a single row above the bar.
+ */
+import type { Knobs } from "../knobs";
+export interface ColorLineVisualizerProps {
+    knobs: Knobs;
+    isDark: boolean;
+    themeColors?: string[];
+    oppositeThemeColors?: string[];
+    accentColors?: string[];
+    oppositeAccentColors?: string[];
+}
+export declare function ColorLineVisualizer({ knobs: _knobs, isDark, themeColors: propColors, oppositeThemeColors: propOppositeColors, accentColors: propAccentColors, oppositeAccentColors: propOppositeAccentColors, }: ColorLineVisualizerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ColorLineVisualizer.d.ts.map

package/types/theme/devtools/ColorLineVisualizer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorLineVisualizer.d.ts","sourceRoot":"","sources":["../../../src/theme/devtools/ColorLineVisualizer.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AA+LtC,MAAM,WAAW,wBAAwB;IACvC,KAAK,EAAE,KAAK,CAAC;IACb,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,mBAAmB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC/B,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;CACjC;AAED,wBAAgB,mBAAmB,CAAC,EAClC,KAAK,EAAE,MAAM,EACb,MAAM,EACN,WAAW,EAAE,UAAU,EACvB,mBAAmB,EAAE,kBAAkB,EACvC,YAAY,EAAE,gBAAgB,EAC9B,oBAAoB,EAAE,wBAAwB,GAC/C,EAAE,wBAAwB,2CA4C1B"}

package/types/theme/devtools/ThemeDevtoolsPanel.d.ts

@@ -0,0 +1,87 @@
+/**
+ * TanStack Devtools plugin panel for controlling theme knobs at runtime.
+ * TODO(native): This panel is web-only for now. TanStack Devtools does not yet
+ * support React Native; when it does, revisit this panel for native compatibility.
+ *
+ * Controls:
+ *  - Color scheme (system / light / dark) via @vxrn/color-scheme
+ *  - Preset picker (using registered presets)
+ *  - All knobs: fillStyle, borderRadius, cornerSmoothing, borderWidth,
+ *    elevation, space, size, density, textAccent, headingFont, bodyFont,
+ *    fontWeight, animation,
+ *    plus house decisions (fieldLabelPlacement, requiredMarking, tableZebra,
+ *    bulkBarPlacement, selectAllScope, timestampStyle, disabledStyle,
+ *    formAutofocus)
+ *
+ * This panel is rendered *inside* the TanStack Devtools shell so it shares
+ * the same React tree and can call hooks like `useTheme` / `useUserScheme`.
+ *
+ * ---------------------------------------------------------------------------
+ * Theme sync (devtools panel ↔ website)
+ * ---------------------------------------------------------------------------
+ * The TanStack Devtools shell has its own "Choose theme" setting (light/dark)
+ * stored in shared storage under `tanstack_devtools_settings`. This panel keeps
+ * the devtools chrome theme and the website color scheme in sync:
+ *
+ *  - Devtools → Website: When the user changes the devtools panel theme, the
+ *    `devtoolsTheme` prop (passed via the render function callback) updates.
+ *    A `useEffect` detects the change and calls `scheme.set()`.
+ *
+ *  - Website → Devtools: When the user changes the color scheme via this
+ *    panel's controls, a `useEffect` writes the resolved scheme value to the
+ *    `tanstack_devtools_settings` storage entry. The devtools chrome
+ *    picks this up on its next initialization (page reload).
+ *
+ * ---------------------------------------------------------------------------
+ * Cookie / SSR verification
+ * ---------------------------------------------------------------------------
+ * 1. On every control change, the panel calls `setKnobs(...)` from `useTheme`.
+ * 2. `setKnobs` in theme.tsx automatically writes the updated knobs to
+ *    `mp.preset` + `mp.ov.*` cookies.
+ * 3. On page refresh, SSR reads the cookie from request headers and renders
+ *    with the persisted theme — no flash, no hydration mismatch.
+ */
+type SchemeHook = {
+    setting: "system" | "light" | "dark";
+    value: "light" | "dark";
+    set: (s: "system" | "light" | "dark") => void;
+};
+export interface ThemeDevtoolsPanelProps {
+    /**
+     * Pass `useUserScheme` from `one` or `@vxrn/color-scheme` so the panel can
+     * control light/dark/system without importing `one` directly in the theme package.
+     */
+    useUserScheme?: () => SchemeHook;
+    /**
+     * The current TanStack Devtools panel chrome theme (`"light"` or `"dark"`).
+     * Passed automatically when the plugin `render` is a function callback.
+     * Used for bidirectional theme syncing and adapting panel styles.
+     */
+    devtoolsTheme?: "light" | "dark";
+    /**
+     * Additional preset names beyond those registered via `registerPreset()`.
+     * Merged with auto-discovered presets from the registry.
+     */
+    extraPresets?: string[];
+    /**
+     * Available theme color names (e.g. `["blue", "green", "purple", ...]`).
+     * When provided, a "Theme" dropdown is shown and colors are included in
+     * the randomize action.
+     */
+    themeColors?: string[];
+    /** The currently active theme color name (e.g. `"blue"` or `""`). */
+    currentThemeColor?: string;
+    /** Callback invoked when the user picks a different theme color. */
+    onThemeColorChange?: (color: string) => void;
+    /**
+     * The Tamagui config object (from `createTamagui()`). When provided, the
+     * panel extracts live `$color1`–`$color12` values from the config's themes
+     * and passes them to the ColorLineVisualizer. This avoids relying on DOM
+     * CSS variable reading which doesn't work inside shadow DOM / isolated
+     * rendering contexts like TanStack Devtools.
+     */
+    tamaguiConfig?: unknown;
+}
+export declare function ThemeDevtoolsPanel({ useUserScheme, extraPresets, devtoolsTheme, themeColors, currentThemeColor, onThemeColorChange, tamaguiConfig, }: ThemeDevtoolsPanelProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ThemeDevtoolsPanel.d.ts.map

package/types/theme/devtools/ThemeDevtoolsPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeDevtoolsPanel.d.ts","sourceRoot":"","sources":["../../../src/theme/devtools/ThemeDevtoolsPanel.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AAyMH,KAAK,UAAU,GAAG;IAChB,OAAO,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;IACrC,KAAK,EAAE,OAAO,GAAG,MAAM,CAAC;IACxB,GAAG,EAAE,CAAC,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,KAAK,IAAI,CAAC;CAC/C,CAAC;AAkiBF,MAAM,WAAW,uBAAuB;IACtC;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,UAAU,CAAC;IAEjC;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAEjC;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IAExB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IAEvB,qEAAqE;IACrE,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B,oEAAoE;IACpE,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAE7C;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAmDD,wBAAgB,kBAAkB,CAAC,EACjC,aAAa,EACb,YAAY,EACZ,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,GACd,EAAE,uBAAuB,2CA67BzB"}

package/types/theme/devtools/buildSnapshot.d.ts

@@ -0,0 +1,12 @@
+export interface SnapshotInput {
+    knobValues: Record<string, string | undefined>;
+    activePreset?: string;
+    activeProfile?: string;
+    schemeSetting?: string;
+    schemeValue?: string;
+    currentColor?: string;
+    lightColors: string[];
+    darkColors: string[];
+}
+export declare function buildSnapshot(input: SnapshotInput): string;
+//# sourceMappingURL=buildSnapshot.d.ts.map

package/types/theme/devtools/buildSnapshot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"buildSnapshot.d.ts","sourceRoot":"","sources":["../../../src/theme/devtools/buildSnapshot.ts"],"names":[],"mappings":"AA6BA,MAAM,WAAW,aAAa;IAC5B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC,CAAC;IAC/C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,UAAU,EAAE,MAAM,EAAE,CAAC;CACtB;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,aAAa,GAAG,MAAM,CAyE1D"}

package/types/theme/devtools/knobIcons.d.ts

@@ -0,0 +1,33 @@
+import { type ReactNode } from "react";
+/**
+ * Shared icon renderers for theme knob controls.
+ *
+ * Each icon function accepts a pre-resolved foreground `color` string so
+ * that both the TanStack Devtools panel and the Storybook addon can use
+ * the same rendering logic with their own color schemes.
+ *
+ * TanStack:  `ic(active, isDark)` → theme-adaptive foreground
+ * Storybook: `ic(active)` → purple accent for active, gray for inactive
+ */
+export declare function fillIcon(value: string, color: string): ReactNode;
+export declare function spaceIcon(value: string, color: string): ReactNode;
+export declare function sizeIcon(value: string, color: string): ReactNode;
+export declare function densityIcon(value: string, color: string): ReactNode;
+export declare function borderRadiusIcon(value: string, color: string): ReactNode;
+export declare function cornerSmoothingIcon(value: string, color: string): ReactNode;
+export declare function borderWidthIcon(value: string, color: string): ReactNode;
+export declare function elevationIcon(value: string, color: string, _isDark: boolean): ReactNode;
+export declare function textAccentIcon(value: string, color: string): ReactNode;
+export declare function headingFontIcon(value: string, color: string): ReactNode;
+export declare function bodyFontIcon(value: string, color: string): ReactNode;
+export declare function fontWeightIcon(value: string, color: string): ReactNode;
+export declare function modeIcon(value: "system" | "light" | "dark", color: string): ReactNode;
+export declare function fieldLabelPlacementIcon(value: string, color: string): ReactNode;
+export declare function requiredMarkingIcon(value: string, color: string): ReactNode;
+export declare function tableZebraIcon(value: string, color: string): ReactNode;
+export declare function bulkBarPlacementIcon(value: string, color: string): ReactNode;
+export declare function selectAllScopeIcon(value: string, color: string): ReactNode;
+export declare function timestampStyleIcon(value: string, color: string): ReactNode;
+export declare function disabledStyleIcon(value: string, color: string): ReactNode;
+export declare function formAutofocusIcon(value: string, color: string): ReactNode;
+//# sourceMappingURL=knobIcons.d.ts.map

package/types/theme/devtools/knobIcons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"knobIcons.d.ts","sourceRoot":"","sources":["../../../src/theme/devtools/knobIcons.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9C;;;;;;;;;GASG;AAEH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAKhE;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAGjE;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAGhE;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAWnE;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAMxE;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAkB3E;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAUvE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,GAAG,SAAS,CAqDvF;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAiBtE;AAsBD,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAiBvE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAiBpE;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAetE;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAiBrF;AAoBD,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAI/E;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAI3E;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAStE;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAkB5E;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAW1E;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAE1E;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAazE;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAazE"}

package/types/theme/devtools/vizConstants.d.ts

@@ -0,0 +1,5 @@
+export declare function contrastTextFor(bgColor: string): string;
+export declare function fallbackGray(step: number): string;
+export declare const cellSize = 32;
+export declare function stepToPx(step: number): number;
+//# sourceMappingURL=vizConstants.d.ts.map

package/types/theme/devtools/vizConstants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vizConstants.d.ts","sourceRoot":"","sources":["../../../src/theme/devtools/vizConstants.ts"],"names":[],"mappings":"AAaA,wBAAgB,eAAe,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAEvD;AAED,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAIjD;AAED,eAAO,MAAM,QAAQ,KAAK,CAAC;AAE3B,wBAAgB,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAE7C"}

package/types/theme/focusState.d.ts

@@ -0,0 +1,42 @@
+import type { ControlStateProps } from "./recipes";
+/**
+ * DG-A11Y-01 — keyboard focus-visible ring.
+ * Width ≥2px; color is the theme `$outlineColor` token (scheme-aware, ≥3:1
+ * against adjacent surface in both light and dark).
+ */
+export declare const FOCUS_RING_MIN_WIDTH = 2;
+export declare const FOCUS_RING_MIN_CONTRAST = 3;
+/**
+ * VERIFY helper (DG-A11Y-01 / Axiom 12): does a *resolved* ring color clear
+ * the ≥3:1 contrast floor against a given surface? Both args are CSS color
+ * strings (hex/hsl/named). Returns false when either can't be parsed (e.g. an
+ * alpha-blended color that can't be reduced to a single hue) so callers treat
+ * unresolved rings as failing.
+ */
+export declare function focusRingColorMeetsContrast(ringColor: string, surfaceColor: string): boolean;
+export declare const FOCUS_VISIBLE_RING: {
+    outlineWidth: number;
+    outlineStyle: "solid";
+    outlineColor: string;
+    outlineOffset: number;
+};
+/**
+ * DG-STATE-01 — Material-style state layers as theme tokens.
+ * Ramp lives in `defaults/builderOptions` (hover/press background steps);
+ * recipes overlay those tokens rather than inventing a second channel.
+ */
+export declare const STATE_LAYER_HOVER: {
+    backgroundColor: string;
+};
+export declare const STATE_LAYER_PRESS: {
+    backgroundColor: string;
+};
+/**
+ * Merge + clamp so variants/knobs cannot remove the focus-visible ring.
+ * Transparent / none / sub-2px outlines are restored to the baseline token.
+ * Extra style keys (e.g. `borderColor`) are preserved for consumer merges.
+ */
+export declare function ensureFocusVisibleRing<T extends ControlStateProps>(override?: (T & ControlStateProps) | null): T & ControlStateProps;
+/** Apply default hover/press state-layer fill when knobs left background unset. */
+export declare function withDefaultStateLayer(control: ControlStateProps, layer: ControlStateProps): ControlStateProps;
+//# sourceMappingURL=focusState.d.ts.map

package/types/theme/focusState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"focusState.d.ts","sourceRoot":"","sources":["../../src/theme/focusState.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAC;AAEnD;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,IAAI,CAAC;AACtC,eAAO,MAAM,uBAAuB,IAAI,CAAC;AAuBzC;;;;;;GAMG;AACH,wBAAgB,2BAA2B,CAAC,SAAS,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,GAAG,OAAO,CAO5F;AAED,eAAO,MAAM,kBAAkB;;;;;CAKF,CAAC;AAE9B;;;;GAIG;AACH,eAAO,MAAM,iBAAiB;;CAED,CAAC;AAE9B,eAAO,MAAM,iBAAiB;;CAED,CAAC;AAE9B;;;;GAIG;AACH,wBAAgB,sBAAsB,CAAC,CAAC,SAAS,iBAAiB,EAChE,QAAQ,CAAC,EAAE,CAAC,CAAC,GAAG,iBAAiB,CAAC,GAAG,IAAI,GACxC,CAAC,GAAG,iBAAiB,CAyBvB;AAED,mFAAmF;AACnF,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,iBAAiB,EAC1B,KAAK,EAAE,iBAAiB,GACvB,iBAAiB,CAKnB"}

package/types/theme/hairline.d.ts

@@ -0,0 +1,88 @@
+/**
+ * OPTICS hairline (Axiom 15): a divider means "one device pixel", not "one
+ * CSS pixel". On high-DPI web screens a 1px CSS divider paints 2–3 device
+ * pixels and reads heavy; 0.5px paints a single device pixel on 2x displays.
+ *
+ * Engine notes (probed against Chromium 147 / WebKit / Gecko):
+ * - Blink floors sub-1px BORDER widths up to 1 CSS px, but honors fractional
+ *   HEIGHT/WIDTH — so standalone rules use the filled `line`/`vline`
+ *   treatments (crisp everywhere), while container-owned edge borders
+ *   (`bottom`/`top`/`right`/`left`) render true hairlines on WebKit/Gecko
+ *   and gracefully stay 1px on Blink.
+ * - Low-DPI screens (1dppx) get a 1px fallback via the resolution media
+ *   query below, so hairlines never fade or vanish there.
+ *
+ * Scope: DIVIDERS ONLY — separators between rows/sections, menu separators,
+ * table head rules, full-bleed panel rules. Control borders (inputs,
+ * buttons, control groups) keep the knob-driven `borderWidth` semantics
+ * from `resolveKnobs` and MUST NOT use this token.
+ *
+ * Native twin: `hairline.native.ts` (react-native StyleSheet.hairlineWidth,
+ * no CSS classes).
+ */
+/** Divider line width: half a CSS pixel = one device pixel on 2x displays. */
+export declare const hairlineWidth: number;
+/**
+ * Spreadable divider treatments. Each entry pairs the 0.5px style with the
+ * fallback class the low-DPI media query targets:
+ *
+ *   <Separator {...hairline.line} />            // horizontal rule element
+ *   <Separator vertical {...hairline.vline} />  // vertical rule element
+ *   <View {...hairline.height} />               // already-filled 1px line
+ *   <YStack {...hairline.bottom} />             // container-owned edge rule
+ */
+export declare const hairline: {
+    /**
+     * Standalone horizontal rule as a FILLED line (tamagui Separator draws a
+     * border, which Blink cannot paint below 1 CSS px — flip it to a filled
+     * fractional-height line, crisp in every engine). Consumers may override
+     * `backgroundColor` after the spread for non-default divider colors.
+     */
+    readonly line: {
+        readonly height: number;
+        readonly maxHeight: number;
+        readonly flexBasis: number;
+        readonly borderBottomWidth: 0;
+        readonly backgroundColor: "$borderColor";
+        readonly className: "mp-hairline-h";
+    };
+    /** Standalone vertical rule as a filled line (see `line`). */
+    readonly vline: {
+        readonly width: number;
+        readonly maxWidth: number;
+        readonly flexBasis: number;
+        readonly borderRightWidth: 0;
+        readonly backgroundColor: "$borderColor";
+        readonly className: "mp-hairline-w";
+    };
+    /** Already-filled 1px line elements (e.g. menu separator views). */
+    readonly height: {
+        readonly height: number;
+        readonly className: "mp-hairline-h";
+    };
+    readonly bottom: {
+        readonly borderBottomWidth: number;
+        readonly className: "mp-hairline-b";
+    };
+    readonly top: {
+        readonly borderTopWidth: number;
+        readonly className: "mp-hairline-t";
+    };
+    readonly right: {
+        readonly borderRightWidth: number;
+        readonly className: "mp-hairline-r";
+    };
+    readonly left: {
+        readonly borderLeftWidth: number;
+        readonly className: "mp-hairline-l";
+    };
+};
+/**
+ * 1px fallback for screens where 0.5px cannot map to a whole device pixel.
+ * (`-webkit-max-device-pixel-ratio` covers Safari versions without
+ * `resolution` media-query support.) Exported for unit tests.
+ */
+export declare const hairlineFallbackCss = "@media (max-resolution: 1.49dppx), (-webkit-max-device-pixel-ratio: 1.49) {\n  .mp-hairline-b { border-bottom-width: 1px !important; }\n  .mp-hairline-t { border-top-width: 1px !important; }\n  .mp-hairline-r { border-right-width: 1px !important; }\n  .mp-hairline-l { border-left-width: 1px !important; }\n  .mp-hairline-h { height: 1px !important; max-height: 1px !important; flex-basis: 1px !important; }\n  .mp-hairline-w { width: 1px !important; max-width: 1px !important; flex-basis: 1px !important; }\n  .mp-hairline-ie { border-inline-end-width: 1px !important; }\n}";
+/** Idempotently mount the low-DPI fallback stylesheet (no-op off-DOM). */
+export declare function ensureHairlineFallback(): void;
+//# sourceMappingURL=hairline.d.ts.map

package/types/theme/hairline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hairline.d.ts","sourceRoot":"","sources":["../../src/theme/hairline.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,8EAA8E;AAC9E,eAAO,MAAM,aAAa,EAAE,MAAY,CAAC;AAEzC;;;;;;;;GAQG;AACH,eAAO,MAAM,QAAQ;IACnB;;;;;OAKG;;;;;;;;;IAWH,8DAA8D;;;;;;;;;IAS9D,oEAAoE;;;;;;;;;;;;;;;;;;;;;CAQ5D,CAAC;AAIX;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,mkBAQ9B,CAAC;AAEH,0EAA0E;AAC1E,wBAAgB,sBAAsB,IAAI,IAAI,CAO7C"}