@3fn/core 14.1.0 → 15.0.0

package/dist/color/OklchValidator.d.ts

@@ -3,7 +3,7 @@
  *
  * Enforces:
  * - Lightness monotonicity (100→500 must decrease)
- * - Minimum step distance (≥0.08 between adjacent steps)
+ * - Minimum step distance between adjacent steps (per family class — see below)
  * - sRGB gamut compliance per token
  * - P3 gamut check (warning, not error)
  * - Chroma monotonicity for steps 300→500 (equal or decreasing)
@@ -11,6 +11,21 @@
  * - Neutral chroma ceiling (C ≤ 0.035)
  * - Neutral partition buffer gaps
  *
+ * **Where this is enforced**: the standing token test suites, which the PR gate runs —
+ * `src/tokens/__tests__/chromatic-channels.test.ts` (all 7 chromatic families through
+ * `validateFamily`) and `src/tokens/__tests__/neutral-partition.test.ts` (white/gray/black
+ * partition, chroma ceilings, and lightness scales). A color-family channel edit that
+ * violates a constraint fails CI. This validator is deliberately NOT wired into
+ * `npm run build` / `build:validate`: a consumer building from source should not have
+ * their build fail over the ecosystem's own color math — authorship errors belong in the
+ * authoring repo's test lane.
+ *
+ * **Minimum step distance is family-class-scoped.** 0.08 is calibrated for the chromatic
+ * families, whose five steps span a wide lightness range. The neutral bands are narrower
+ * by construction (white spans 1.00→0.80, black 0.28→0.00), so applying the chromatic
+ * threshold to them would report a violation where the scale is correct. Each class
+ * carries its own floor; see `MIN_STEP_DISTANCE`.
+ *
  * @see Spec 112 R1 AC6, R2 AC4, R8 AC2-3
  */
 export interface ValidationResult {
@@ -23,12 +38,37 @@ export interface ColorFamily {
     hue: number;
     lightness: number[];
     chroma: number[];
+    /** Family class for lightness-step calibration. Defaults to 'chromatic'. */
+    familyClass?: ColorFamilyClass;
 }
+/**
+ * Family classes for lightness-scale validation. Chromatic families share one set of
+ * constraints; each neutral band has its own, because the bands are narrow by design.
+ */
+export type ColorFamilyClass = 'chromatic' | 'white' | 'gray' | 'black';
+/**
+ * Minimum lightness distance between adjacent steps, per family class.
+ *
+ * - chromatic (0.08): five steps across a wide lightness range
+ * - white (0.05): band spans 1.00 → 0.80, so 0.05 per step
+ * - gray (0.08): band spans 0.72 → 0.32, so 0.10 per step — the chromatic floor holds
+ * - black (0.07): band spans 0.28 → 0.00, so 0.07 per step
+ *
+ * These are floors, not targets: a family may exceed its floor freely.
+ */
+export declare const MIN_STEP_DISTANCE: Record<ColorFamilyClass, number>;
 export declare class OklchValidator {
     /** Validate a complete color family against all constraints. */
     validateFamily(family: ColorFamily): ValidationResult;
-    /** Validate lightness scale: must be monotonically decreasing with min step ≥0.08. */
-    validateLightnessScale(steps: number[], familyName?: string): ValidationResult;
+    /**
+     * Validate a lightness scale: monotonically decreasing, with adjacent steps at least
+     * the family class's minimum distance apart.
+     *
+     * `familyClass` defaults to `'chromatic'` — the calibration this method was written
+     * against. Neutral bands must pass their own class, or a correct narrow band reports
+     * a false violation.
+     */
+    validateLightnessScale(steps: number[], familyName?: string, familyClass?: ColorFamilyClass): ValidationResult;
     /** Validate chroma scale: steps 300→500 must be equal or decreasing (darker = less chroma). */
     validateChromaScale(steps: number[], familyName?: string): ValidationResult;
     /** Check sRGB gamut compliance. P3-only values get a warning. */

package/dist/color/OklchValidator.js

@@ -4,7 +4,7 @@
  *
  * Enforces:
  * - Lightness monotonicity (100→500 must decrease)
- * - Minimum step distance (≥0.08 between adjacent steps)
+ * - Minimum step distance between adjacent steps (per family class — see below)
  * - sRGB gamut compliance per token
  * - P3 gamut check (warning, not error)
  * - Chroma monotonicity for steps 300→500 (equal or decreasing)
@@ -12,19 +12,49 @@
  * - Neutral chroma ceiling (C ≤ 0.035)
  * - Neutral partition buffer gaps
  *
+ * **Where this is enforced**: the standing token test suites, which the PR gate runs —
+ * `src/tokens/__tests__/chromatic-channels.test.ts` (all 7 chromatic families through
+ * `validateFamily`) and `src/tokens/__tests__/neutral-partition.test.ts` (white/gray/black
+ * partition, chroma ceilings, and lightness scales). A color-family channel edit that
+ * violates a constraint fails CI. This validator is deliberately NOT wired into
+ * `npm run build` / `build:validate`: a consumer building from source should not have
+ * their build fail over the ecosystem's own color math — authorship errors belong in the
+ * authoring repo's test lane.
+ *
+ * **Minimum step distance is family-class-scoped.** 0.08 is calibrated for the chromatic
+ * families, whose five steps span a wide lightness range. The neutral bands are narrower
+ * by construction (white spans 1.00→0.80, black 0.28→0.00), so applying the chromatic
+ * threshold to them would report a violation where the scale is correct. Each class
+ * carries its own floor; see `MIN_STEP_DISTANCE`.
+ *
  * @see Spec 112 R1 AC6, R2 AC4, R8 AC2-3
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.OklchValidator = void 0;
+exports.OklchValidator = exports.MIN_STEP_DISTANCE = void 0;
 const OklchConverter_1 = require("./OklchConverter");
-const MIN_STEP_DISTANCE = 0.08;
+/**
+ * Minimum lightness distance between adjacent steps, per family class.
+ *
+ * - chromatic (0.08): five steps across a wide lightness range
+ * - white (0.05): band spans 1.00 → 0.80, so 0.05 per step
+ * - gray (0.08): band spans 0.72 → 0.32, so 0.10 per step — the chromatic floor holds
+ * - black (0.07): band spans 0.28 → 0.00, so 0.07 per step
+ *
+ * These are floors, not targets: a family may exceed its floor freely.
+ */
+exports.MIN_STEP_DISTANCE = {
+    chromatic: 0.08,
+    white: 0.05,
+    gray: 0.08,
+    black: 0.07,
+};
 const NEUTRAL_CHROMA_CEILING = 0.035;
 class OklchValidator {
     /** Validate a complete color family against all constraints. */
     validateFamily(family) {
         const errors = [];
         const warnings = [];
-        const lResult = this.validateLightnessScale(family.lightness, family.name);
+        const lResult = this.validateLightnessScale(family.lightness, family.name, family.familyClass ?? 'chromatic');
         errors.push(...lResult.errors);
         warnings.push(...lResult.warnings);
         const cResult = this.validateChromaScale(family.chroma, family.name);
@@ -41,18 +71,26 @@ class OklchValidator {
         }
         return { valid: errors.length === 0, errors, warnings };
     }
-    /** Validate lightness scale: must be monotonically decreasing with min step ≥0.08. */
-    validateLightnessScale(steps, familyName = '') {
+    /**
+     * Validate a lightness scale: monotonically decreasing, with adjacent steps at least
+     * the family class's minimum distance apart.
+     *
+     * `familyClass` defaults to `'chromatic'` — the calibration this method was written
+     * against. Neutral bands must pass their own class, or a correct narrow band reports
+     * a false violation.
+     */
+    validateLightnessScale(steps, familyName = '', familyClass = 'chromatic') {
         const errors = [];
         const warnings = [];
         const prefix = familyName ? `${familyName}: ` : '';
+        const minStep = exports.MIN_STEP_DISTANCE[familyClass];
         for (let i = 1; i < steps.length; i++) {
             if (steps[i] >= steps[i - 1]) {
                 errors.push(`${prefix}Lightness not monotonically decreasing: step ${(i) * 100}(${steps[i - 1]}) → step ${(i + 1) * 100}(${steps[i]})`);
             }
             const distance = steps[i - 1] - steps[i];
-            if (distance > 0 && distance < MIN_STEP_DISTANCE - 1e-10) {
-                errors.push(`${prefix}Lightness step distance ${distance.toFixed(3)} < ${MIN_STEP_DISTANCE} between steps ${i * 100} and ${(i + 1) * 100}`);
+            if (distance > 0 && distance < minStep - 1e-10) {
+                errors.push(`${prefix}Lightness step distance ${distance.toFixed(3)} < ${minStep} (${familyClass} minimum) between steps ${i * 100} and ${(i + 1) * 100}`);
             }
         }
         return { valid: errors.length === 0, errors, warnings };

package/dist/components/core/Button-CTA/Button-CTA.refs.d.ts

@@ -0,0 +1,83 @@
+/**
+ * Button-CTA Component Tokens
+ *
+ * Component-specific tokens for Button-CTA that don't fit into the general
+ * semantic token system. These tokens are specific to button sizing and layout.
+ *
+ * Token Naming Pattern: buttonCTA.[property].[variant]
+ *
+ * Stemma System Naming: [Family]-[Type] = Button-CTA
+ * Component Type: Standalone (no behavioral variants)
+ *
+ * Related Requirements:
+ * - Requirement 6.1-6.3: Minimum width requirements for button sizes
+ * - Design Decision H3: Component-specific tokens with semantic naming
+ */
+/**
+ * Minimum Width Tokens
+ *
+ * These tokens define the minimum width for each button size variant.
+ * Values are chosen to ensure buttons have adequate touch targets and
+ * visual presence while maintaining compositional architecture principles.
+ *
+ * Design Rationale (from H3):
+ * - Component-specific tokens provide clarity for button sizing
+ * - Semantic naming (small/medium/large) balances component needs with system conventions
+ * - Compositional architecture maintained through mathematical relationships
+ *
+ * Token linkage (corrected 2026-09-19 per the token-doc accuracy pass, F8 —
+ * see .kiro/issues/2026-09-19-token-source-accuracy-followups.md): these values
+ * are NOT independent literals — they equal the `sizing` primitive family's
+ * size700/size900/size1000 tokens exactly, and Token-Family-Sizing.md § "Component
+ * Consumers" already documented Button-CTA as a consumer of those three tokens.
+ * The values below now reference those primitives directly instead of restating
+ * their values, per the component-token construction rule (component tokens
+ * must reference an existing primitive or conform to its value system, never
+ * restate an arbitrary number). This is a linkage fix only — the rendered
+ * values (56 / 72 / 80) are unchanged.
+ *
+ * Values:
+ * - Small: 56px (7 × 8px baseline grid, references size700)
+ * - Medium: 72px (9 × 8px baseline grid, references size900)
+ * - Large: 80px (10 × 8px baseline grid, references size1000)
+ */
+export declare const ButtonCTATokens: {
+    /**
+     * Minimum width for small buttons
+     *
+     * Usage: Small buttons in compact layouts, secondary actions
+     * Value: 56px (7 × 8px baseline grid) — references sizingTokens.size700
+     * Platforms: Web, iOS, Android
+     */
+    readonly minWidth: {
+        readonly small: number;
+        /**
+         * Minimum width for medium buttons
+         *
+         * Usage: Standard buttons, primary actions
+         * Value: 72px (9 × 8px baseline grid) — references sizingTokens.size900
+         * Platforms: Web, iOS, Android
+         */
+        readonly medium: number;
+        /**
+         * Minimum width for large buttons
+         *
+         * Usage: Prominent buttons, hero actions
+         * Value: 80px (10 × 8px baseline grid) — references sizingTokens.size1000
+         * Platforms: Web, iOS, Android
+         */
+        readonly large: number;
+    };
+};
+/**
+ * Type definitions for Button-CTA tokens
+ */
+export type ButtonCTAMinWidthVariant = keyof typeof ButtonCTATokens.minWidth;
+/**
+ * Helper function to get minWidth token value
+ *
+ * @param variant - The button size variant (small, medium, large)
+ * @returns The minimum width value in pixels
+ */
+export declare function getButtonCTAMinWidth(variant: ButtonCTAMinWidthVariant): number;
+//# sourceMappingURL=Button-CTA.refs.d.ts.map

package/dist/components/core/Button-CTA/Button-CTA.refs.js

@@ -0,0 +1,86 @@
+"use strict";
+/**
+ * Button-CTA Component Tokens
+ *
+ * Component-specific tokens for Button-CTA that don't fit into the general
+ * semantic token system. These tokens are specific to button sizing and layout.
+ *
+ * Token Naming Pattern: buttonCTA.[property].[variant]
+ *
+ * Stemma System Naming: [Family]-[Type] = Button-CTA
+ * Component Type: Standalone (no behavioral variants)
+ *
+ * Related Requirements:
+ * - Requirement 6.1-6.3: Minimum width requirements for button sizes
+ * - Design Decision H3: Component-specific tokens with semantic naming
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ButtonCTATokens = void 0;
+exports.getButtonCTAMinWidth = getButtonCTAMinWidth;
+const SizingTokens_1 = require("../../../tokens/SizingTokens");
+/**
+ * Minimum Width Tokens
+ *
+ * These tokens define the minimum width for each button size variant.
+ * Values are chosen to ensure buttons have adequate touch targets and
+ * visual presence while maintaining compositional architecture principles.
+ *
+ * Design Rationale (from H3):
+ * - Component-specific tokens provide clarity for button sizing
+ * - Semantic naming (small/medium/large) balances component needs with system conventions
+ * - Compositional architecture maintained through mathematical relationships
+ *
+ * Token linkage (corrected 2026-09-19 per the token-doc accuracy pass, F8 —
+ * see .kiro/issues/2026-09-19-token-source-accuracy-followups.md): these values
+ * are NOT independent literals — they equal the `sizing` primitive family's
+ * size700/size900/size1000 tokens exactly, and Token-Family-Sizing.md § "Component
+ * Consumers" already documented Button-CTA as a consumer of those three tokens.
+ * The values below now reference those primitives directly instead of restating
+ * their values, per the component-token construction rule (component tokens
+ * must reference an existing primitive or conform to its value system, never
+ * restate an arbitrary number). This is a linkage fix only — the rendered
+ * values (56 / 72 / 80) are unchanged.
+ *
+ * Values:
+ * - Small: 56px (7 × 8px baseline grid, references size700)
+ * - Medium: 72px (9 × 8px baseline grid, references size900)
+ * - Large: 80px (10 × 8px baseline grid, references size1000)
+ */
+exports.ButtonCTATokens = {
+    /**
+     * Minimum width for small buttons
+     *
+     * Usage: Small buttons in compact layouts, secondary actions
+     * Value: 56px (7 × 8px baseline grid) — references sizingTokens.size700
+     * Platforms: Web, iOS, Android
+     */
+    minWidth: {
+        small: SizingTokens_1.sizingTokens.size700.baseValue,
+        /**
+         * Minimum width for medium buttons
+         *
+         * Usage: Standard buttons, primary actions
+         * Value: 72px (9 × 8px baseline grid) — references sizingTokens.size900
+         * Platforms: Web, iOS, Android
+         */
+        medium: SizingTokens_1.sizingTokens.size900.baseValue,
+        /**
+         * Minimum width for large buttons
+         *
+         * Usage: Prominent buttons, hero actions
+         * Value: 80px (10 × 8px baseline grid) — references sizingTokens.size1000
+         * Platforms: Web, iOS, Android
+         */
+        large: SizingTokens_1.sizingTokens.size1000.baseValue,
+    },
+};
+/**
+ * Helper function to get minWidth token value
+ *
+ * @param variant - The button size variant (small, medium, large)
+ * @returns The minimum width value in pixels
+ */
+function getButtonCTAMinWidth(variant) {
+    return exports.ButtonCTATokens.minWidth[variant];
+}
+//# sourceMappingURL=Button-CTA.refs.js.map

package/dist/components/core/Button-CTA/Button-CTA.tokens.d.ts

@@ -23,40 +23,50 @@
  * Design Rationale (from H3):
  * - Component-specific tokens provide clarity for button sizing
  * - Semantic naming (small/medium/large) balances component needs with system conventions
- * - Values don't need to align with existing primitive tokens (space700, space900, space1000)
  * - Compositional architecture maintained through mathematical relationships
  *
+ * Token linkage (corrected 2026-09-19 per the token-doc accuracy pass, F8 —
+ * see .kiro/issues/2026-09-19-token-source-accuracy-followups.md): these values
+ * are NOT independent literals — they equal the `sizing` primitive family's
+ * size700/size900/size1000 tokens exactly, and Token-Family-Sizing.md § "Component
+ * Consumers" already documented Button-CTA as a consumer of those three tokens.
+ * The values below now reference those primitives directly instead of restating
+ * their values, per the component-token construction rule (component tokens
+ * must reference an existing primitive or conform to its value system, never
+ * restate an arbitrary number). This is a linkage fix only — the rendered
+ * values (56 / 72 / 80) are unchanged.
+ *
  * Values:
- * - Small: 56px (7 × 8px baseline grid)
- * - Medium: 72px (9 × 8px baseline grid)
- * - Large: 80px (10 × 8px baseline grid, aligns with space1000)
+ * - Small: 56px (7 × 8px baseline grid, references size700)
+ * - Medium: 72px (9 × 8px baseline grid, references size900)
+ * - Large: 80px (10 × 8px baseline grid, references size1000)
  */
 export declare const ButtonCTATokens: {
     /**
      * Minimum width for small buttons
      *
      * Usage: Small buttons in compact layouts, secondary actions
-     * Value: 56px (7 × 8px baseline grid)
+     * Value: 56px (7 × 8px baseline grid) — references sizingTokens.size700
      * Platforms: Web, iOS, Android
      */
     readonly minWidth: {
-        readonly small: 56;
+        readonly small: number;
         /**
          * Minimum width for medium buttons
          *
          * Usage: Standard buttons, primary actions
-         * Value: 72px (9 × 8px baseline grid)
+         * Value: 72px (9 × 8px baseline grid) — references sizingTokens.size900
          * Platforms: Web, iOS, Android
          */
-        readonly medium: 72;
+        readonly medium: number;
         /**
          * Minimum width for large buttons
          *
          * Usage: Prominent buttons, hero actions
-         * Value: 80px (10 × 8px baseline grid, aligns with space1000)
+         * Value: 80px (10 × 8px baseline grid) — references sizingTokens.size1000
          * Platforms: Web, iOS, Android
          */
-        readonly large: 80;
+        readonly large: number;
     };
 };
 /**

package/dist/components/core/Button-CTA/Button-CTA.tokens.js

@@ -17,6 +17,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ButtonCTATokens = void 0;
 exports.getButtonCTAMinWidth = getButtonCTAMinWidth;
+const SizingTokens_1 = require("../../../tokens/SizingTokens");
 /**
  * Minimum Width Tokens
  *
@@ -27,40 +28,50 @@ exports.getButtonCTAMinWidth = getButtonCTAMinWidth;
  * Design Rationale (from H3):
  * - Component-specific tokens provide clarity for button sizing
  * - Semantic naming (small/medium/large) balances component needs with system conventions
- * - Values don't need to align with existing primitive tokens (space700, space900, space1000)
  * - Compositional architecture maintained through mathematical relationships
  *
+ * Token linkage (corrected 2026-09-19 per the token-doc accuracy pass, F8 —
+ * see .kiro/issues/2026-09-19-token-source-accuracy-followups.md): these values
+ * are NOT independent literals — they equal the `sizing` primitive family's
+ * size700/size900/size1000 tokens exactly, and Token-Family-Sizing.md § "Component
+ * Consumers" already documented Button-CTA as a consumer of those three tokens.
+ * The values below now reference those primitives directly instead of restating
+ * their values, per the component-token construction rule (component tokens
+ * must reference an existing primitive or conform to its value system, never
+ * restate an arbitrary number). This is a linkage fix only — the rendered
+ * values (56 / 72 / 80) are unchanged.
+ *
  * Values:
- * - Small: 56px (7 × 8px baseline grid)
- * - Medium: 72px (9 × 8px baseline grid)
- * - Large: 80px (10 × 8px baseline grid, aligns with space1000)
+ * - Small: 56px (7 × 8px baseline grid, references size700)
+ * - Medium: 72px (9 × 8px baseline grid, references size900)
+ * - Large: 80px (10 × 8px baseline grid, references size1000)
  */
 exports.ButtonCTATokens = {
     /**
      * Minimum width for small buttons
      *
      * Usage: Small buttons in compact layouts, secondary actions
-     * Value: 56px (7 × 8px baseline grid)
+     * Value: 56px (7 × 8px baseline grid) — references sizingTokens.size700
      * Platforms: Web, iOS, Android
      */
     minWidth: {
-        small: 56,
+        small: SizingTokens_1.sizingTokens.size700.baseValue,
         /**
          * Minimum width for medium buttons
          *
          * Usage: Standard buttons, primary actions
-         * Value: 72px (9 × 8px baseline grid)
+         * Value: 72px (9 × 8px baseline grid) — references sizingTokens.size900
          * Platforms: Web, iOS, Android
          */
-        medium: 72,
+        medium: SizingTokens_1.sizingTokens.size900.baseValue,
         /**
          * Minimum width for large buttons
          *
          * Usage: Prominent buttons, hero actions
-         * Value: 80px (10 × 8px baseline grid, aligns with space1000)
+         * Value: 80px (10 × 8px baseline grid) — references sizingTokens.size1000
          * Platforms: Web, iOS, Android
          */
-        large: 80,
+        large: SizingTokens_1.sizingTokens.size1000.baseValue,
     },
 };
 /**

package/dist/components/core/Button-CTA/index.d.ts

@@ -9,6 +9,6 @@
  * @module Button-CTA
  */
 export type { ButtonProps, ButtonSize, ButtonStyle } from './types';
-export { ButtonCTATokens, getButtonCTAMinWidth } from './Button-CTA.tokens';
-export type { ButtonCTAMinWidthVariant } from './Button-CTA.tokens';
+export { ButtonCTATokens, getButtonCTAMinWidth } from './Button-CTA.refs';
+export type { ButtonCTAMinWidthVariant } from './Button-CTA.refs';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/core/Button-CTA/index.js

@@ -12,9 +12,9 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getButtonCTAMinWidth = exports.ButtonCTATokens = void 0;
 // Component tokens
-var Button_CTA_tokens_1 = require("./Button-CTA.tokens");
-Object.defineProperty(exports, "ButtonCTATokens", { enumerable: true, get: function () { return Button_CTA_tokens_1.ButtonCTATokens; } });
-Object.defineProperty(exports, "getButtonCTAMinWidth", { enumerable: true, get: function () { return Button_CTA_tokens_1.getButtonCTAMinWidth; } });
+var Button_CTA_refs_1 = require("./Button-CTA.refs");
+Object.defineProperty(exports, "ButtonCTATokens", { enumerable: true, get: function () { return Button_CTA_refs_1.ButtonCTATokens; } });
+Object.defineProperty(exports, "getButtonCTAMinWidth", { enumerable: true, get: function () { return Button_CTA_refs_1.getButtonCTAMinWidth; } });
 // Platform implementations are imported directly from their platform-specific paths
 // e.g., import { ButtonCTA } from './platforms/web/ButtonCTA.web';
 //# sourceMappingURL=index.js.map

package/dist/components/core/Button-VerticalList-Item/platforms/web/ButtonVerticalListItem.web.d.ts

@@ -87,11 +87,13 @@ export declare class ButtonVerticalListItem extends HTMLElement {
      *
      * When these attributes change, attributeChangedCallback is invoked.
      *
-     * Note: 'disabled' is intentionally observed to throw an error if set.
-     * This component explicitly does NOT support disabled states per accessibility
-     * standards — unavailable options should be hidden, not disabled.
-     *
-     * @see Requirements 10.2
+     * Note: 'disabled' is intentionally NOT observed. Per the ignore-vs-throw
+     * parity ruling (2026-09-19), DesignerPunk components SHALL NOT observe,
+     * expose, or reject a consumer-set `disabled` input — the input is inert.
+     * A consumer-set `disabled` attribute is left on the element but has no
+     * effect; unavailable options should be hidden by the parent Set, not
+     * disabled. This mirrors the Button-CTA guard shape.
+     * @see .kiro/docs/ballots/2026-09-19-disabled-input-parity.md
      */
     static get observedAttributes(): string[];
     constructor();
@@ -149,13 +151,14 @@ export declare class ButtonVerticalListItem extends HTMLElement {
      * Called when an observed attribute changes.
      *
      * Triggers incremental DOM update to reflect the new attribute value.
-     * Throws error if 'disabled' attribute is set (fail loudly philosophy).
+     *
+     * Note: 'disabled' is not in observedAttributes (see above), so a
+     * consumer-set `disabled` attribute never reaches this callback — it is
+     * inert per the ignore-vs-throw parity ruling (2026-09-19).
      *
      * @param name - Attribute name
      * @param oldValue - Previous attribute value
      * @param newValue - New attribute value
-     * @throws Error if 'disabled' attribute is set
-     * @see Requirements 10.2
      */
     attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
     /**
@@ -222,28 +225,6 @@ export declare class ButtonVerticalListItem extends HTMLElement {
      * Set the test ID.
      */
     set testID(value: string | undefined);
-    /**
-     * Disabled property getter.
-     *
-     * Always returns false because this component does not support disabled states.
-     * Per accessibility standards, unavailable options should be hidden, not disabled.
-     *
-     * @returns Always false
-     * @see Requirements 10.2
-     */
-    get disabled(): boolean;
-    /**
-     * Disabled property setter.
-     *
-     * Throws an error if called with true. This component explicitly does NOT support
-     * disabled states per accessibility standards — unavailable options should be hidden,
-     * not disabled.
-     *
-     * @param value - The disabled value (must be false)
-     * @throws Error if value is true
-     * @see Requirements 10.2
-     */
-    set disabled(value: boolean);
     /**
      * Get the ARIA role for the item.
      *

package/dist/components/core/Button-VerticalList-Item/platforms/web/ButtonVerticalListItem.web.js

@@ -190,11 +190,13 @@ class ButtonVerticalListItem extends HTMLElement {
      *
      * When these attributes change, attributeChangedCallback is invoked.
      *
-     * Note: 'disabled' is intentionally observed to throw an error if set.
-     * This component explicitly does NOT support disabled states per accessibility
-     * standards — unavailable options should be hidden, not disabled.
-     *
-     * @see Requirements 10.2
+     * Note: 'disabled' is intentionally NOT observed. Per the ignore-vs-throw
+     * parity ruling (2026-09-19), DesignerPunk components SHALL NOT observe,
+     * expose, or reject a consumer-set `disabled` input — the input is inert.
+     * A consumer-set `disabled` attribute is left on the element but has no
+     * effect; unavailable options should be hidden by the parent Set, not
+     * disabled. This mirrors the Button-CTA guard shape.
+     * @see .kiro/docs/ballots/2026-09-19-disabled-input-parity.md
      */
     static get observedAttributes() {
         return [
@@ -208,7 +210,6 @@ class ButtonVerticalListItem extends HTMLElement {
             'test-id',
             'role', // ARIA role (button, radio, checkbox) - set by parent Set
             'aria-checked', // ARIA checked state - set by parent Set
-            'disabled' // Observed to throw error if set (fail loudly)
         ];
     }
     constructor() {
@@ -404,24 +405,16 @@ class ButtonVerticalListItem extends HTMLElement {
      * Called when an observed attribute changes.
      *
      * Triggers incremental DOM update to reflect the new attribute value.
-     * Throws error if 'disabled' attribute is set (fail loudly philosophy).
+     *
+     * Note: 'disabled' is not in observedAttributes (see above), so a
+     * consumer-set `disabled` attribute never reaches this callback — it is
+     * inert per the ignore-vs-throw parity ruling (2026-09-19).
      *
      * @param name - Attribute name
      * @param oldValue - Previous attribute value
      * @param newValue - New attribute value
-     * @throws Error if 'disabled' attribute is set
-     * @see Requirements 10.2
      */
     attributeChangedCallback(name, oldValue, newValue) {
-        // Fail loudly if disabled attribute is set
-        // This component explicitly does NOT support disabled states per accessibility standards
-        // Unavailable options should be hidden, not disabled
-        // @see Requirements 10.2
-        if (name === 'disabled') {
-            throw new Error('Button-VerticalList-Item: The "disabled" attribute is not supported. ' +
-                'Per accessibility standards, unavailable options should be hidden rather than disabled. ' +
-                'Remove the disabled attribute and hide the component instead.');
-        }
         // Only update if the element is connected to the DOM, value changed, and DOM exists
         if (oldValue !== newValue && this.isConnected && this._tokensValidated && this._domCreated) {
             this._updateDOM();
@@ -552,37 +545,11 @@ class ButtonVerticalListItem extends HTMLElement {
             this.removeAttribute('test-id');
         }
     }
-    /**
-     * Disabled property getter.
-     *
-     * Always returns false because this component does not support disabled states.
-     * Per accessibility standards, unavailable options should be hidden, not disabled.
-     *
-     * @returns Always false
-     * @see Requirements 10.2
-     */
-    get disabled() {
-        return false;
-    }
-    /**
-     * Disabled property setter.
-     *
-     * Throws an error if called with true. This component explicitly does NOT support
-     * disabled states per accessibility standards — unavailable options should be hidden,
-     * not disabled.
-     *
-     * @param value - The disabled value (must be false)
-     * @throws Error if value is true
-     * @see Requirements 10.2
-     */
-    set disabled(value) {
-        if (value) {
-            throw new Error('Button-VerticalList-Item: The "disabled" property is not supported. ' +
-                'Per accessibility standards, unavailable options should be hidden rather than disabled. ' +
-                'Set disabled to false or hide the component instead.');
-        }
-        // If value is false, do nothing (component is already not disabled)
-    }
+    // Note: No `disabled` property is exposed. Per the ignore-vs-throw parity
+    // ruling (2026-09-19), DesignerPunk components SHALL NOT observe, expose,
+    // or reject a consumer-set `disabled` input — the input is inert. This
+    // mirrors the Button-CTA guard shape.
+    // @see .kiro/docs/ballots/2026-09-19-disabled-input-parity.md
     // ─────────────────────────────────────────────────────────────────
     // ARIA Properties (controlled by parent Set)
     // ─────────────────────────────────────────────────────────────────