@astryxdesign/lab 0.0.0-bootstrap.0 → 0.1.2-canary.04e71b2

package/dist/SVGIcon/tokens.stylex.d.ts

@@ -0,0 +1,37 @@
+/**
+ * @file tokens.stylex.ts
+ * @input Astryx design token system
+ * @output CSS custom properties for SVG icon rendering
+ * @position Token definitions consumed by SVGIcon and variation presets
+ *
+ * Two-layer system (primary/secondary) with per-role rendering (fill vs stroke).
+ * Bold mode uses mask-based gap subtraction controlled by --icon-gap tokens.
+ */
+import * as stylex from '@stylexjs/stylex';
+export declare const iconVars: stylex.VarGroup<Readonly<{
+    '--icon-layer-primary-fill': string;
+    '--icon-layer-primary-stroke': string;
+    '--icon-layer-primary-opacity': string;
+    '--icon-layer-primary-stroke-role-fill': string;
+    '--icon-layer-primary-stroke-role-stroke': string;
+    '--icon-layer-primary-stroke-role-opacity': string;
+    '--icon-layer-primary-stroke-role-width': string;
+    '--icon-layer-secondary-fill': string;
+    '--icon-layer-secondary-stroke': string;
+    '--icon-layer-secondary-opacity': string;
+    '--icon-layer-secondary-stroke-role-fill': string;
+    '--icon-layer-secondary-stroke-role-stroke': string;
+    '--icon-layer-secondary-stroke-role-opacity': string;
+    '--icon-layer-secondary-stroke-role-width': string;
+    '--icon-size': string;
+    '--icon-stroke-width': string;
+    '--icon-stroke-linecap': string;
+    '--icon-stroke-linejoin': string;
+    '--icon-padding': string;
+    '--icon-inline-offset': string;
+    '--icon-block-offset': string;
+    '--icon-bold-stroke-boost': string;
+    '--icon-gap': string;
+    '--icon-gap-linejoin': string;
+}>, symbol>;
+//# sourceMappingURL=tokens.stylex.d.ts.map

package/dist/SVGIcon/tokens.stylex.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.stylex.d.ts","sourceRoot":"","sources":["../../src/SVGIcon/tokens.stylex.ts"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAE3C,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;WAsCnB,CAAC"}

package/dist/SVGIcon/tokens.stylex.js

@@ -0,0 +1,40 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file tokens.stylex.ts
+ * @input Astryx design token system
+ * @output CSS custom properties for SVG icon rendering
+ * @position Token definitions consumed by SVGIcon and variation presets
+ *
+ * Two-layer system (primary/secondary) with per-role rendering (fill vs stroke).
+ * Bold mode uses mask-based gap subtraction controlled by --icon-gap tokens.
+ */
+
+import * as stylex from '@stylexjs/stylex';
+export const iconVars = {
+  "--icon-layer-primary-fill": "var(--icon-layer-primary-fill)",
+  "--icon-layer-primary-stroke": "var(--icon-layer-primary-stroke)",
+  "--icon-layer-primary-opacity": "var(--icon-layer-primary-opacity)",
+  "--icon-layer-primary-stroke-role-fill": "var(--icon-layer-primary-stroke-role-fill)",
+  "--icon-layer-primary-stroke-role-stroke": "var(--icon-layer-primary-stroke-role-stroke)",
+  "--icon-layer-primary-stroke-role-opacity": "var(--icon-layer-primary-stroke-role-opacity)",
+  "--icon-layer-primary-stroke-role-width": "var(--icon-layer-primary-stroke-role-width)",
+  "--icon-layer-secondary-fill": "var(--icon-layer-secondary-fill)",
+  "--icon-layer-secondary-stroke": "var(--icon-layer-secondary-stroke)",
+  "--icon-layer-secondary-opacity": "var(--icon-layer-secondary-opacity)",
+  "--icon-layer-secondary-stroke-role-fill": "var(--icon-layer-secondary-stroke-role-fill)",
+  "--icon-layer-secondary-stroke-role-stroke": "var(--icon-layer-secondary-stroke-role-stroke)",
+  "--icon-layer-secondary-stroke-role-opacity": "var(--icon-layer-secondary-stroke-role-opacity)",
+  "--icon-layer-secondary-stroke-role-width": "var(--icon-layer-secondary-stroke-role-width)",
+  "--icon-size": "var(--icon-size)",
+  "--icon-stroke-width": "var(--icon-stroke-width)",
+  "--icon-stroke-linecap": "var(--icon-stroke-linecap)",
+  "--icon-stroke-linejoin": "var(--icon-stroke-linejoin)",
+  "--icon-padding": "var(--icon-padding)",
+  "--icon-inline-offset": "var(--icon-inline-offset)",
+  "--icon-block-offset": "var(--icon-block-offset)",
+  "--icon-bold-stroke-boost": "var(--icon-bold-stroke-boost)",
+  "--icon-gap": "var(--icon-gap)",
+  "--icon-gap-linejoin": "var(--icon-gap-linejoin)",
+  __varGroupHash__: "x1ucsbpz"
+};

package/dist/SVGIcon/variations.stylex.d.ts

@@ -0,0 +1,44 @@
+/**
+ * @file variations.stylex.ts
+ * @input Icon token vars
+ * @output StyleX styles for each icon variation preset
+ * @position Consumed by SVGIcon to apply variation-specific token overrides
+ *
+ * Each variation sets tokens for both fill-role and stroke-role elements
+ * per the path role system. Stroke-role elements (lines, detail strokes)
+ * never become fills — they stay as strokes across all variations.
+ */
+import * as stylex from '@stylexjs/stylex';
+export declare const variations: Readonly<{
+    readonly linear: Readonly<{
+        readonly [x: string]: stylex.StyleXClassNameFor<string, "none" | "currentColor" | "1">;
+    }>;
+    readonly bold: Readonly<{
+        readonly [x: string]: stylex.StyleXClassNameFor<string, "none" | "currentColor" | "1" | "2" | "2.5">;
+    }>;
+    readonly twotone: Readonly<{
+        readonly [x: string]: stylex.StyleXClassNameFor<string, "none" | "currentColor" | "1" | "0.4">;
+    }>;
+    readonly bulk: Readonly<{
+        readonly [x: string]: stylex.StyleXClassNameFor<string, "none" | "currentColor" | "1" | "0.4">;
+    }>;
+    readonly broken: Readonly<{
+        readonly [x: string]: stylex.StyleXClassNameFor<string, "none" | "currentColor" | "0" | "1">;
+    }>;
+}>;
+/** Optical size compensation — thicker strokes at smaller sizes */
+export declare const opticalSize: Readonly<{
+    readonly xsm: Readonly<{
+        readonly [x: string]: stylex.StyleXClassNameFor<string, "12px" | "2">;
+    }>;
+    readonly sm: Readonly<{
+        readonly [x: string]: stylex.StyleXClassNameFor<string, "16px" | "1.75">;
+    }>;
+    readonly md: Readonly<{
+        readonly [x: string]: stylex.StyleXClassNameFor<string, "1.5" | "20px">;
+    }>;
+    readonly lg: Readonly<{
+        readonly [x: string]: stylex.StyleXClassNameFor<string, "24px" | "1.5">;
+    }>;
+}>;
+//# sourceMappingURL=variations.stylex.d.ts.map

package/dist/SVGIcon/variations.stylex.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"variations.stylex.d.ts","sourceRoot":"","sources":["../../src/SVGIcon/variations.stylex.ts"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAG3C,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;EAqFrB,CAAC;AAEH,mEAAmE;AACnE,eAAO,MAAM,WAAW;;;;;;;;;;;;;EAiBtB,CAAC"}

package/dist/SVGIcon/variations.stylex.js

@@ -0,0 +1,119 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file variations.stylex.ts
+ * @input Icon token vars
+ * @output StyleX styles for each icon variation preset
+ * @position Consumed by SVGIcon to apply variation-specific token overrides
+ *
+ * Each variation sets tokens for both fill-role and stroke-role elements
+ * per the path role system. Stroke-role elements (lines, detail strokes)
+ * never become fills — they stay as strokes across all variations.
+ */
+
+import * as stylex from '@stylexjs/stylex';
+import "./tokens.stylex.js";
+import { iconVars } from "./tokens.stylex.js";
+export const variations = {
+  linear: {
+    "--icon-layer-primary-fill": "xawlqpt",
+    "--icon-layer-primary-stroke": "xo1qp05",
+    "--icon-layer-primary-opacity": "xgmpc9a",
+    "--icon-layer-primary-stroke-role-fill": "x1behde",
+    "--icon-layer-primary-stroke-role-stroke": "x12z8fwv",
+    "--icon-layer-primary-stroke-role-opacity": "x1ixq0ah",
+    "--icon-layer-secondary-fill": "x14svsep",
+    "--icon-layer-secondary-stroke": "xjilf3y",
+    "--icon-layer-secondary-opacity": "xin2e9c",
+    "--icon-layer-secondary-stroke-role-fill": "x1q3b5jp",
+    "--icon-layer-secondary-stroke-role-stroke": "xvx4rvh",
+    "--icon-layer-secondary-stroke-role-opacity": "x1ddoxvq",
+    $$css: true
+  },
+  bold: {
+    "--icon-layer-primary-fill": "x1eijsz",
+    "--icon-layer-primary-stroke": "xxn8g3f",
+    "--icon-layer-primary-opacity": "xgmpc9a",
+    "--icon-layer-primary-stroke-role-fill": "x1behde",
+    "--icon-layer-primary-stroke-role-stroke": "x12z8fwv",
+    "--icon-layer-primary-stroke-role-opacity": "x1ixq0ah",
+    "--icon-layer-primary-stroke-role-width": "x1lampxp",
+    "--icon-layer-secondary-fill": "x1a7uvwd",
+    "--icon-layer-secondary-stroke": "xqw5mls",
+    "--icon-layer-secondary-opacity": "xin2e9c",
+    "--icon-layer-secondary-stroke-role-fill": "x1q3b5jp",
+    "--icon-layer-secondary-stroke-role-stroke": "xvx4rvh",
+    "--icon-layer-secondary-stroke-role-opacity": "x1ddoxvq",
+    "--icon-layer-secondary-stroke-role-width": "x1l94yqg",
+    $$css: true
+  },
+  twotone: {
+    "--icon-layer-primary-fill": "xawlqpt",
+    "--icon-layer-primary-stroke": "xo1qp05",
+    "--icon-layer-primary-opacity": "xgmpc9a",
+    "--icon-layer-primary-stroke-role-fill": "x1behde",
+    "--icon-layer-primary-stroke-role-stroke": "x12z8fwv",
+    "--icon-layer-primary-stroke-role-opacity": "x167zosf",
+    "--icon-layer-secondary-fill": "x14svsep",
+    "--icon-layer-secondary-stroke": "xjilf3y",
+    "--icon-layer-secondary-opacity": "x1pm3eyu",
+    "--icon-layer-secondary-stroke-role-fill": "x1q3b5jp",
+    "--icon-layer-secondary-stroke-role-stroke": "xvx4rvh",
+    "--icon-layer-secondary-stroke-role-opacity": "x1grmq33",
+    $$css: true
+  },
+  bulk: {
+    "--icon-layer-primary-fill": "x1eijsz",
+    "--icon-layer-primary-stroke": "xxn8g3f",
+    "--icon-layer-primary-opacity": "xgmpc9a",
+    "--icon-layer-primary-stroke-role-fill": "x1behde",
+    "--icon-layer-primary-stroke-role-stroke": "x12z8fwv",
+    "--icon-layer-primary-stroke-role-opacity": "x167zosf",
+    "--icon-layer-secondary-fill": "x1a7uvwd",
+    "--icon-layer-secondary-stroke": "xqw5mls",
+    "--icon-layer-secondary-opacity": "x1pm3eyu",
+    "--icon-layer-secondary-stroke-role-fill": "x1q3b5jp",
+    "--icon-layer-secondary-stroke-role-stroke": "xvx4rvh",
+    "--icon-layer-secondary-stroke-role-opacity": "x1grmq33",
+    $$css: true
+  },
+  broken: {
+    "--icon-layer-primary-fill": "xawlqpt",
+    "--icon-layer-primary-stroke": "xo1qp05",
+    "--icon-layer-primary-opacity": "xgmpc9a",
+    "--icon-layer-primary-stroke-role-fill": "x1behde",
+    "--icon-layer-primary-stroke-role-stroke": "x12z8fwv",
+    "--icon-layer-primary-stroke-role-opacity": "x1ixq0ah",
+    "--icon-layer-secondary-fill": "x14svsep",
+    "--icon-layer-secondary-stroke": "xjilf3y",
+    "--icon-layer-secondary-opacity": "xontptu",
+    "--icon-layer-secondary-stroke-role-fill": "x1q3b5jp",
+    "--icon-layer-secondary-stroke-role-stroke": "xvx4rvh",
+    "--icon-layer-secondary-stroke-role-opacity": "x1m4cuqp",
+    $$css: true
+  }
+};
+
+/** Optical size compensation — thicker strokes at smaller sizes */
+export const opticalSize = {
+  xsm: {
+    "--icon-stroke-width": "x1uhwwbp",
+    "--icon-size": "x1x62q30",
+    $$css: true
+  },
+  sm: {
+    "--icon-stroke-width": "x5m04n3",
+    "--icon-size": "x1ddsvy1",
+    $$css: true
+  },
+  md: {
+    "--icon-stroke-width": "x1mdqp0b",
+    "--icon-size": "xhxmg62",
+    $$css: true
+  },
+  lg: {
+    "--icon-stroke-width": "x1mdqp0b",
+    "--icon-size": "xu3j10d",
+    $$css: true
+  }
+};

package/dist/SVGIcon/xif-examples.d.ts

@@ -0,0 +1,22 @@
+/**
+ * @file xif-examples.ts
+ * @description Example icons demonstrating XIF spec features
+ *
+ * Each example showcases a different capability:
+ * - Simple stroke-only (check)
+ * - Two-layer with bold knockout (home)
+ * - Composable with slots (file, shield)
+ * - Animated (bell)
+ * - Personality override (star)
+ * - Bold geometry override (bell-override)
+ */
+import type { XIFIcon } from './xif-types';
+export declare const xifCheck: XIFIcon;
+export declare const xifHome: XIFIcon;
+export declare const xifFile: XIFIcon;
+export declare const xifShield: XIFIcon;
+export declare const xifBell: XIFIcon;
+export declare const xifStar: XIFIcon;
+export declare const xifBellOverride: XIFIcon;
+export declare const xifExamples: XIFIcon[];
+//# sourceMappingURL=xif-examples.d.ts.map

package/dist/SVGIcon/xif-examples.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"xif-examples.d.ts","sourceRoot":"","sources":["../../src/SVGIcon/xif-examples.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAC,OAAO,EAAC,MAAM,aAAa,CAAC;AAMzC,eAAO,MAAM,QAAQ,EAAE,OAItB,CAAC;AAMF,eAAO,MAAM,OAAO,EAAE,OAmBrB,CAAC;AAMF,eAAO,MAAM,OAAO,EAAE,OAoBrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,OAcvB,CAAC;AAMF,eAAO,MAAM,OAAO,EAAE,OAmBrB,CAAC;AAMF,eAAO,MAAM,OAAO,EAAE,OAcrB,CAAC;AAMF,eAAO,MAAM,eAAe,EAAE,OAiC7B,CAAC;AAMF,eAAO,MAAM,WAAW,EAAE,OAAO,EAQhC,CAAC"}

package/dist/SVGIcon/xif-examples.js

@@ -0,0 +1,202 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file xif-examples.ts
+ * @description Example icons demonstrating XIF spec features
+ *
+ * Each example showcases a different capability:
+ * - Simple stroke-only (check)
+ * - Two-layer with bold knockout (home)
+ * - Composable with slots (file, shield)
+ * - Animated (bell)
+ * - Personality override (star)
+ * - Bold geometry override (bell-override)
+ */
+
+// =============================================================================
+// Simple stroke-only
+// =============================================================================
+
+export const xifCheck = {
+  name: 'check',
+  paths: [{
+    type: 'path',
+    attrs: {
+      d: 'M5 13l4 4L19 7'
+    },
+    role: 'stroke'
+  }],
+  tags: ['action', 'confirm']
+};
+
+// =============================================================================
+// Two-layer with bold knockout
+// =============================================================================
+
+export const xifHome = {
+  name: 'home',
+  paths: [{
+    type: 'path',
+    attrs: {
+      d: 'M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'
+    },
+    role: 'fill',
+    layer: 'primary'
+  }, {
+    type: 'path',
+    attrs: {
+      d: 'M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8'
+    },
+    role: 'fill',
+    layer: 'secondary'
+  }],
+  tags: ['navigation']
+};
+
+// =============================================================================
+// Composable icon with slot
+// =============================================================================
+
+export const xifFile = {
+  name: 'file',
+  paths: [{
+    type: 'path',
+    attrs: {
+      d: 'M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'
+    },
+    role: 'fill',
+    layer: 'primary'
+  }, {
+    type: 'path',
+    attrs: {
+      d: 'M14 2v4a2 2 0 0 0 2 2h4'
+    },
+    role: 'stroke',
+    layer: 'secondary'
+  }],
+  slots: [{
+    name: 'badge',
+    position: {
+      x: 0.5,
+      y: 0.65
+    },
+    size: 0.35
+  }],
+  tags: ['file', 'document']
+};
+export const xifShield = {
+  name: 'shield',
+  paths: [{
+    type: 'path',
+    attrs: {
+      d: 'M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'
+    },
+    role: 'fill',
+    layer: 'primary'
+  }],
+  slots: [{
+    name: 'badge',
+    position: 'center',
+    size: 0.42
+  }],
+  tags: ['security', 'protection']
+};
+
+// =============================================================================
+// Animated icon
+// =============================================================================
+
+export const xifBell = {
+  name: 'bell',
+  paths: [{
+    type: 'path',
+    attrs: {
+      d: 'M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9'
+    },
+    role: 'fill',
+    layer: 'primary',
+    animate: {
+      type: 'scale',
+      sequence: 1
+    }
+  }, {
+    type: 'path',
+    attrs: {
+      d: 'M10.3 21a1.94 1.94 0 0 0 3.4 0'
+    },
+    role: 'stroke',
+    layer: 'secondary',
+    animate: {
+      type: 'draw',
+      sequence: 2
+    }
+  }],
+  tags: ['notification', 'alert']
+};
+
+// =============================================================================
+// Personality override — star keeps sharp points
+// =============================================================================
+
+export const xifStar = {
+  name: 'star',
+  paths: [{
+    type: 'path',
+    attrs: {
+      d: 'M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z'
+    },
+    role: 'fill',
+    layer: 'primary',
+    personality: {
+      cornerRounding: 0
+    }
+  }],
+  tags: ['rating', 'favorite']
+};
+
+// =============================================================================
+// Bold geometry override
+// =============================================================================
+
+export const xifBellOverride = {
+  name: 'bell-override',
+  paths: [{
+    type: 'path',
+    attrs: {
+      d: 'M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9'
+    },
+    role: 'fill',
+    layer: 'primary'
+  }, {
+    type: 'path',
+    attrs: {
+      d: 'M10.3 21a1.94 1.94 0 0 0 3.4 0'
+    },
+    role: 'stroke',
+    layer: 'secondary'
+  }],
+  overrides: {
+    bold: [{
+      type: 'path',
+      attrs: {
+        d: 'M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9'
+      },
+      role: 'fill',
+      layer: 'primary'
+    }, {
+      type: 'path',
+      attrs: {
+        d: 'M10.3 21a1.94 1.94 0 0 0 3.4 0'
+      },
+      role: 'fill',
+      layer: 'secondary'
+    }]
+  },
+  tags: ['notification']
+};
+
+// =============================================================================
+// All examples
+// =============================================================================
+
+export const xifExamples = [xifCheck, xifHome, xifFile, xifShield, xifBell, xifStar, xifBellOverride];

package/dist/SVGIcon/xif-types.d.ts

@@ -0,0 +1,129 @@
+/**
+ * @file xif-types.ts
+ * @description Astryx Icon Format (XIF) type definitions — v0.1.0 draft
+ *
+ * Icons are pure structure — zero visual values. The theme resolves
+ * all visual properties (color, weight, rounding, timing).
+ *
+ * This file defines the SOURCE format types. The resolved/build output
+ * uses a simpler pre-computed format (see theme build pipeline).
+ */
+/**
+ * Percentile adjustment parameters for shape personality.
+ * All values 0-1. 0 = artist's original. 1 = maximum shift.
+ * Adjustments are RELATIVE — they preserve the artist's hierarchy
+ * of sharp vs soft, straight vs curved.
+ */
+export interface XIFPersonality {
+    /**
+     * Shift corners toward rounded.
+     * A sharp 90° corner shifts more than an already-gentle 150° corner.
+     * Formula: adjustedR = baseR + (maxR - baseR) × cornerRounding
+     */
+    cornerRounding?: number;
+    /**
+     * Shift straight segments toward curved.
+     * A straight line gains a bow; an existing curve barely changes.
+     * Formula: adjusted = original + (1 - original) × segmentCurvature
+     */
+    segmentCurvature?: number;
+    /**
+     * How tightly curves hug their control points.
+     * 0 = loose (curves balloon). 0.5 = neutral. 1 = tight (near-straight).
+     */
+    tension?: number;
+}
+/**
+ * Animation intent for a path element.
+ * Declares WHAT animates and in WHAT ORDER — not timing or easing.
+ * The theme resolves all visual animation properties.
+ */
+export interface XIFAnimate {
+    /**
+     * Semantic animation type.
+     * - draw: stroke reveals along path (dasharray/dashoffset)
+     * - fade: opacity entrance
+     * - scale: grow from center
+     * - rotate: continuous spin (loaders)
+     * - morph: interpolate between variation states
+     */
+    type: 'draw' | 'fade' | 'scale' | 'rotate' | 'morph';
+    /**
+     * Stagger order. Lower numbers animate first.
+     * Paths with the same sequence animate simultaneously.
+     */
+    sequence?: number;
+}
+/**
+ * A named position where a sub-icon can be injected.
+ * The theme resolves position/size to actual viewBox coordinates.
+ */
+export interface XIFSlot {
+    /** Slot identifier — used in component props */
+    name: string;
+    /** Semantic position. Theme resolves to coordinates. */
+    position: 'center' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | {
+        x: number;
+        y: number;
+    };
+    /**
+     * Size of the injected icon relative to parent.
+     * 'content' = auto-sized by theme. number = fraction of parent.
+     */
+    size?: 'content' | number;
+}
+/**
+ * A single shape element within an icon.
+ * Contains geometry + semantic metadata. Zero visual values.
+ */
+export interface XIFPath {
+    /** SVG element type. Default: 'path' */
+    type?: 'path' | 'circle' | 'rect' | 'line' | 'polyline' | 'ellipse' | 'polygon';
+    /** SVG geometry attributes (d, cx, cy, r, x, y, width, height, etc.) */
+    attrs: Record<string, string | number>;
+    /**
+     * Rendering behavior across variations.
+     * - 'fill': Closed shape — stroked in linear, filled in bold.
+     * - 'stroke': Line/detail — always rendered as a stroke.
+     * Default: 'fill'
+     */
+    role?: 'fill' | 'stroke';
+    /**
+     * Visual hierarchy for twotone/bulk and bold knockouts.
+     * - 'primary': Full opacity. In bold, rendered as solid fill.
+     * - 'secondary': Reduced opacity in twotone/bulk. Knocked out in bold.
+     * Default: 'primary'
+     */
+    layer?: 'primary' | 'secondary';
+    /** Per-path personality overrides (shift from theme/icon defaults) */
+    personality?: XIFPersonality;
+    /** Animation intent */
+    animate?: XIFAnimate;
+}
+/**
+ * Root type for an Astryx Icon Format definition.
+ * Pure structure — no visual values.
+ */
+export interface XIFIcon {
+    /** Unique identifier */
+    name: string;
+    /** ViewBox dimensions. Default: '0 0 24 24' */
+    viewBox?: string;
+    /** Shape elements that compose the icon */
+    paths: XIFPath[];
+    /**
+     * Per-variation geometry overrides.
+     * Rendered in DOM alongside default paths; CSS toggles visibility.
+     */
+    overrides?: {
+        bold?: XIFPath[];
+        broken?: XIFPath[];
+    };
+    /** Named slots for sub-icon composition */
+    slots?: XIFSlot[];
+    /** Icon-level personality overrides */
+    personality?: XIFPersonality;
+    /** Tags for search and categorization */
+    tags?: string[];
+}
+//# sourceMappingURL=xif-types.d.ts.map

package/dist/SVGIcon/xif-types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"xif-types.d.ts","sourceRoot":"","sources":["../../src/SVGIcon/xif-types.ts"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAMH;;;;;GAKG;AACH,MAAM,WAAW,cAAc;IAC7B;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAMD;;;;GAIG;AACH,MAAM,WAAW,UAAU;IACzB;;;;;;;OAOG;IACH,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAErD;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAMD;;;GAGG;AACH,MAAM,WAAW,OAAO;IACtB,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;IAEb,wDAAwD;IACxD,QAAQ,EACJ,QAAQ,GACR,UAAU,GACV,WAAW,GACX,aAAa,GACb,cAAc,GACd;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAC,CAAC;IAE3B;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;CAC3B;AAMD;;;GAGG;AACH,MAAM,WAAW,OAAO;IACtB,wCAAwC;IACxC,IAAI,CAAC,EACD,MAAM,GACN,QAAQ,GACR,MAAM,GACN,MAAM,GACN,UAAU,GACV,SAAS,GACT,SAAS,CAAC;IAEd,wEAAwE;IACxE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;IAEvC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAEzB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,GAAG,WAAW,CAAC;IAEhC,sEAAsE;IACtE,WAAW,CAAC,EAAE,cAAc,CAAC;IAE7B,uBAAuB;IACvB,OAAO,CAAC,EAAE,UAAU,CAAC;CACtB;AAMD;;;GAGG;AACH,MAAM,WAAW,OAAO;IACtB,wBAAwB;IACxB,IAAI,EAAE,MAAM,CAAC;IAEb,+CAA+C;IAC/C,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,2CAA2C;IAC3C,KAAK,EAAE,OAAO,EAAE,CAAC;IAEjB;;;OAGG;IACH,SAAS,CAAC,EAAE;QACV,IAAI,CAAC,EAAE,OAAO,EAAE,CAAC;QACjB,MAAM,CAAC,EAAE,OAAO,EAAE,CAAC;KACpB,CAAC;IAEF,2CAA2C;IAC3C,KAAK,CAAC,EAAE,OAAO,EAAE,CAAC;IAElB,uCAAuC;IACvC,WAAW,CAAC,EAAE,cAAc,CAAC;IAE7B,yCAAyC;IACzC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;CACjB"}

package/dist/SVGIcon/xif-types.js

@@ -0,0 +1 @@
+export {};