@3fn/core 14.1.0 → 15.0.0

package/dist/browser/designerpunk.umd.js

@@ -766,7 +766,7 @@ var DesignerPunk = (() => {
   };
   var iconSizes = iconBaseSizes;
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Input-Text-Base/platforms/web/InputTextBase.web.css
+  // css-as-string:src/components/core/Input-Text-Base/platforms/web/InputTextBase.web.css
   var InputTextBase_web_default = `/**
  * Input-Text-Base Component Styles for Web Platform
  * 
@@ -1257,7 +1257,7 @@ var DesignerPunk = (() => {
         trailingIconHTML = createIconBase({
           name: "x",
           size: iconSize,
-          color: "color-error",
+          color: "color-feedback-error-text",
           className: "trailing-icon error-icon"
         });
       } else if (iconVisibility.showSuccessIcon) {
@@ -1715,6 +1715,8 @@ var DesignerPunk = (() => {
       this._isPasswordVisible = false;
       this._hasBeenValidated = false;
       this._isPasswordValid = true;
+      // Cached blend color for toggle-button hover state
+      this._toggleHoverColor = "";
       /**
        * Handle focus event
        */
@@ -1790,6 +1792,7 @@ var DesignerPunk = (() => {
         }
       };
       this._shadowRoot = this.attachShadow({ mode: "open" });
+      this._blendUtils = getBlendUtilities();
     }
     /**
      * Get shadow root (for testing and external access)
@@ -1829,10 +1832,68 @@ var DesignerPunk = (() => {
     }
     /**
      * Connected callback - called when element is added to DOM
+     *
+     * Defers blend color calculation until document is ready to ensure CSS custom
+     * properties are available from parsed stylesheets (same deferral pattern as
+     * Button-Icon / Chip-Base).
      */
     connectedCallback() {
-      this.render();
-      this.attachEventListeners();
+      if (document.readyState === "loading") {
+        document.addEventListener("DOMContentLoaded", () => {
+          this._calculateBlendColorsWithRetry();
+          this.render();
+          this.attachEventListeners();
+        }, { once: true });
+      } else {
+        this._calculateBlendColorsWithRetry();
+        this.render();
+        this.attachEventListeners();
+      }
+    }
+    /**
+     * Calculate blend colors with retry logic for CSS loading race conditions.
+     *
+     * Uses requestAnimationFrame to ensure CSS is fully applied before reading
+     * custom properties. Falls back to the CSS-in-JS render default if tokens are
+     * still unavailable.
+     */
+    _calculateBlendColorsWithRetry() {
+      try {
+        this._calculateBlendColors();
+      } catch (error) {
+        requestAnimationFrame(() => {
+          try {
+            this._calculateBlendColors();
+            this.render();
+            this.attachEventListeners();
+          } catch (retryError) {
+            console.warn("InputTextPassword: Could not calculate blend colors, using CSS fallback", retryError);
+          }
+        });
+      }
+    }
+    /**
+     * Calculate the toggle-button hover background color from CSS custom properties.
+     *
+     * The toggle button's resting background is transparent — it sits directly on the
+     * input container's canvas background (`--color-structure-canvas`). On hover, the
+     * button darkens relative to that surface, matching the pattern Chip-Base uses for
+     * its own resting-background hover (`darkerBlend(color.structure.surface,
+     * blend.hoverDarker)`) — here the "surface the element sits on" is the input's
+     * canvas rather than the chip's own background, since the toggle button itself has
+     * no background of its own to darken.
+     *
+     * - Hover: darkerBlend(color.structure.canvas, blend.hoverDarker) - 8% darker
+     *
+     * @throws Error if the required token is missing from CSS custom properties
+     */
+    _calculateBlendColors() {
+      const computedStyle = getComputedStyle(document.documentElement);
+      const canvasColor = computedStyle.getPropertyValue("--color-structure-canvas").trim();
+      if (!canvasColor) {
+        throw new Error("InputTextPassword: Required token --color-structure-canvas is missing from CSS custom properties");
+      }
+      this._toggleHoverColor = this._blendUtils.hoverColor(canvasColor);
     }
     /**
      * Disconnected callback - called when element is removed from DOM
@@ -1927,6 +1988,9 @@ var DesignerPunk = (() => {
       :host {
         display: block;
         width: 100%;
+        /* JS-computed hover background for the toggle button \u2014 darkerBlend(color.structure.canvas,
+           blend.hoverDarker), NOT a token reference. See _calculateBlendColors(). */
+        --_itp-hover-bg: ${this._toggleHoverColor};
       }
       
       .password-container {
@@ -1962,7 +2026,7 @@ var DesignerPunk = (() => {
       
       .toggle-button:hover {
         color: var(--color-text-default);
-        background-color: var(--color-background-hover);
+        background-color: var(--_itp-hover-bg);
       }
       
       .toggle-button:focus {
@@ -2499,7 +2563,7 @@ var DesignerPunk = (() => {
     customElements.define("input-text-phone-number", InputTextPhoneNumber);
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Button-CTA/platforms/web/ButtonCTA.web.css
+  // css-as-string:src/components/core/Button-CTA/platforms/web/ButtonCTA.web.css
   var ButtonCTA_web_default = `/**
  * Button-CTA Component Styles for Web Platform
  * 
@@ -3321,7 +3385,7 @@ var DesignerPunk = (() => {
     variant: "primary"
   };
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Button-Icon/platforms/web/ButtonIcon.web.css
+  // css-as-string:src/components/core/Button-Icon/platforms/web/ButtonIcon.web.css
   var ButtonIcon_web_default = `/**
  * Button-Icon Component Styles for Web Platform
  * 
@@ -4319,7 +4383,7 @@ var DesignerPunk = (() => {
     customElements.define("button-icon", ButtonIcon);
   }
 
-  // src/components/core/Container-Base/tokens.ts
+  // src/components/core/Container-Base/Container-Base.refs.ts
   var paddingTokenMap = {
     "none": "",
     "050": "space.inset.050",
@@ -4331,9 +4395,9 @@ var DesignerPunk = (() => {
   };
   var borderTokenMap = {
     "none": "",
-    "default": "border.border.default",
-    "emphasis": "border.border.emphasis",
-    "heavy": "border.border.heavy"
+    "default": "border.default",
+    "emphasis": "border.emphasis",
+    "heavy": "border.heavy"
   };
   var borderRadiusTokenMap = {
     "none": "",
@@ -4367,11 +4431,17 @@ var DesignerPunk = (() => {
       "tooltip": "elevation.tooltip"
     }
   };
-  var BORDER_COLOR_TOKEN = "color.border";
+  var BORDER_COLOR_TOKEN = "color.structure.border";
 
   // src/components/core/Container-Base/platforms/web/token-mapping.ts
+  function tokenToCssCustomProperty(tokenName) {
+    const kebab = tokenName.split(".").map(
+      (part) => part.replace(/([a-z])([A-Z])/g, "$1-$2").replace(/([a-zA-Z])(\d)/g, "$1-$2").toLowerCase()
+    ).join("-");
+    return `--${kebab}`;
+  }
   function tokenToCssVar(tokenName) {
-    return `var(--${tokenName.replace(/\./g, "-")})`;
+    return `var(${tokenToCssCustomProperty(tokenName)})`;
   }
   function mapPaddingToCSS(padding) {
     if (!padding || padding === "none") {
@@ -4648,7 +4718,7 @@ var DesignerPunk = (() => {
       const background = this.getAttribute("background");
       let baseColor = "";
       if (background) {
-        const cssVarName = `--${background.replace(/\./g, "-")}`;
+        const cssVarName = tokenToCssCustomProperty(background);
         baseColor = computedStyle.getPropertyValue(cssVarName).trim();
       }
       if (!baseColor) {
@@ -5416,7 +5486,7 @@ var DesignerPunk = (() => {
     return VerticalListItemTokens[`paddingBlock.${variant}`];
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Button-VerticalList-Item/platforms/web/ButtonVerticalListItem.styles.css
+  // css-as-string:src/components/core/Button-VerticalList-Item/platforms/web/ButtonVerticalListItem.styles.css
   var ButtonVerticalListItem_styles_default = `/**
  * Button-VerticalList-Item Component Styles for Web Platform
  * 
@@ -6015,14 +6085,16 @@ var DesignerPunk = (() => {
     }
     /**
      * Observed attributes for automatic re-rendering on change.
-     * 
+     *
      * 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 [
@@ -6036,10 +6108,8 @@ var DesignerPunk = (() => {
         "test-id",
         "role",
         // ARIA role (button, radio, checkbox) - set by parent Set
-        "aria-checked",
+        "aria-checked"
         // ARIA checked state - set by parent Set
-        "disabled"
-        // Observed to throw error if set (fail loudly)
       ];
     }
     /**
@@ -6132,22 +6202,18 @@ var DesignerPunk = (() => {
     }
     /**
      * 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) {
-      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.'
-        );
-      }
       if (oldValue !== newValue && this.isConnected && this._tokensValidated && this._domCreated) {
         this._updateDOM();
       }
@@ -6273,36 +6339,11 @@ var DesignerPunk = (() => {
         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.'
-        );
-      }
-    }
+    // 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)
     // ─────────────────────────────────────────────────────────────────
@@ -6643,7 +6684,7 @@ var DesignerPunk = (() => {
     }
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Button-VerticalList-Set/platforms/web/Button-VerticalList-Set.styles.css
+  // css-as-string:src/components/core/Button-VerticalList-Set/platforms/web/Button-VerticalList-Set.styles.css
   var Button_VerticalList_Set_styles_default = `/**
  * Button-VerticalList-Set Component Styles for Web Platform
  * 
@@ -7843,7 +7884,8 @@ var DesignerPunk = (() => {
       familyBaseValue: SIZING_BASE_VALUE,
       description: "Size 050 - smallest component dimension",
       mathematicalRelationship: `base \xD7 0.5 = ${SIZING_BASE_VALUE} \xD7 0.5 = ${SIZING_BASE_VALUE * 0.5}`,
-      baselineGridAlignment: true,
+      baselineGridAlignment: false,
+      // 4-unit subgrid value; not a multiple of the 8-unit baseline grid
       isStrategicFlexibility: false,
       isPrecisionTargeted: false,
       platforms: generateSizingPlatformValues(SIZING_BASE_VALUE * 0.5)
@@ -7867,7 +7909,8 @@ var DesignerPunk = (() => {
       familyBaseValue: SIZING_BASE_VALUE,
       description: "Size 150 - small component dimension",
       mathematicalRelationship: `base \xD7 1.5 = ${SIZING_BASE_VALUE} \xD7 1.5 = ${SIZING_BASE_VALUE * 1.5}`,
-      baselineGridAlignment: true,
+      baselineGridAlignment: false,
+      // 4-unit subgrid value; not a multiple of the 8-unit baseline grid
       isStrategicFlexibility: false,
       isPrecisionTargeted: false,
       platforms: generateSizingPlatformValues(SIZING_BASE_VALUE * 1.5)
@@ -7891,7 +7934,8 @@ var DesignerPunk = (() => {
       familyBaseValue: SIZING_BASE_VALUE,
       description: "Size 250 - medium component dimension",
       mathematicalRelationship: `base \xD7 2.5 = ${SIZING_BASE_VALUE} \xD7 2.5 = ${SIZING_BASE_VALUE * 2.5}`,
-      baselineGridAlignment: true,
+      baselineGridAlignment: false,
+      // 4-unit subgrid value; not a multiple of the 8-unit baseline grid
       isStrategicFlexibility: false,
       isPrecisionTargeted: false,
       platforms: generateSizingPlatformValues(SIZING_BASE_VALUE * 2.5)
@@ -8055,7 +8099,7 @@ var DesignerPunk = (() => {
     }
   });
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Avatar-Base/platforms/web/Avatar.styles.css
+  // css-as-string:src/components/core/Avatar-Base/platforms/web/Avatar.styles.css
   var Avatar_styles_default = `/**
  * Avatar Component Styles for Web Platform
  * 
@@ -9304,7 +9348,7 @@ var DesignerPunk = (() => {
     return BadgeLabelBaseTokens["maxWidth"];
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Badge-Label-Base/platforms/web/BadgeLabelBase.styles.css
+  // css-as-string:src/components/core/Badge-Label-Base/platforms/web/BadgeLabelBase.styles.css
   var BadgeLabelBase_styles_default = `/**
  * Badge-Label-Base Styles for Web Platform
  * 
@@ -9683,7 +9727,7 @@ var DesignerPunk = (() => {
     size: "md"
   };
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Badge-Count-Base/platforms/web/BadgeCountBase.styles.css
+  // css-as-string:src/components/core/Badge-Count-Base/platforms/web/BadgeCountBase.styles.css
   var BadgeCountBase_styles_default = `/**
  * Badge-Count-Base Styles for Web Platform
  * 
@@ -10061,7 +10105,7 @@ var DesignerPunk = (() => {
     announceChanges: true
   });
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Badge-Count-Notification/platforms/web/BadgeCountNotification.styles.css
+  // css-as-string:src/components/core/Badge-Count-Notification/platforms/web/BadgeCountNotification.styles.css
   var BadgeCountNotification_styles_default = `/**
  * Badge-Count-Notification Styles for Web Platform
  * 
@@ -10516,7 +10560,7 @@ var DesignerPunk = (() => {
     labelTypography: "inherit"
   };
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Input-Checkbox-Base/platforms/web/InputCheckboxBase.web.css
+  // css-as-string:src/components/core/Input-Checkbox-Base/platforms/web/InputCheckboxBase.web.css
   var InputCheckboxBase_web_default = `/**
  * Input-Checkbox-Base Component Styles for Web Platform
  * 
@@ -11378,7 +11422,7 @@ var DesignerPunk = (() => {
     showRequiredIndicator: true
   };
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Input-Checkbox-Legal/platforms/web/InputCheckboxLegal.web.css
+  // css-as-string:src/components/core/Input-Checkbox-Legal/platforms/web/InputCheckboxLegal.web.css
   var InputCheckboxLegal_web_default = `/**
  * Input-Checkbox-Legal Component Styles for Web Platform
  * 
@@ -11820,7 +11864,7 @@ var DesignerPunk = (() => {
   // src/components/core/Chip-Base/types.ts
   var CHIP_BASE_OBSERVED_ATTRIBUTES = ["label", "icon", "test-id"];
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Chip-Base/platforms/web/ChipBase.styles.css
+  // css-as-string:src/components/core/Chip-Base/platforms/web/ChipBase.styles.css
   var ChipBase_styles_default = `/**
  * Chip-Base Component Styles for Web Platform
  * 
@@ -12416,7 +12460,7 @@ var DesignerPunk = (() => {
     customElements.define("chip-base", ChipBaseElement);
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Chip-Filter/platforms/web/ChipFilter.styles.css
+  // css-as-string:src/components/core/Chip-Filter/platforms/web/ChipFilter.styles.css
   var ChipFilter_styles_default = `/**
  * Chip-Filter Component Styles for Web Platform
  * 
@@ -12862,7 +12906,7 @@ var DesignerPunk = (() => {
     customElements.define("chip-filter", ChipFilterElement);
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Chip-Input/platforms/web/ChipInput.styles.css
+  // css-as-string:src/components/core/Chip-Input/platforms/web/ChipInput.styles.css
   var ChipInput_styles_default = `/**
  * Chip-Input Component Styles for Web Platform
  * 
@@ -13263,7 +13307,7 @@ var DesignerPunk = (() => {
     customElements.define("chip-input", ChipInputElement);
   }
 
-  // src/components/core/Container-Card-Base/tokens.ts
+  // src/components/core/Container-Card-Base/Container-Card-Base.refs.ts
   var cardBackgroundTokenMap = {
     "surface.primary": "color.structure.surface.primary",
     "surface.secondary": "color.structure.surface.secondary",
@@ -13398,7 +13442,7 @@ var DesignerPunk = (() => {
       if (background) {
         const tokenName = cardBackgroundTokenMap[background];
         if (tokenName) {
-          const cssVarName = `--${tokenName.replace(/\./g, "-")}`;
+          const cssVarName = tokenToCssCustomProperty(tokenName);
           baseColor = computedStyle.getPropertyValue(cssVarName).trim();
         }
       }
@@ -13563,7 +13607,7 @@ var DesignerPunk = (() => {
     labelAlign: "center"
   };
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Input-Radio-Base/platforms/web/InputRadioBase.web.css
+  // css-as-string:src/components/core/Input-Radio-Base/platforms/web/InputRadioBase.web.css
   var InputRadioBase_web_default = `/**
  * Input-Radio-Base Component Styles for Web Platform
  * 
@@ -14135,7 +14179,7 @@ var DesignerPunk = (() => {
     // Observed Attributes
     // ---------------------------------------------------------------------------
     static get observedAttributes() {
-      return [...INPUT_RADIO_BASE_OBSERVED_ATTRIBUTES];
+      return [...INPUT_RADIO_BASE_OBSERVED_ATTRIBUTES, "disabled"];
     }
     // ---------------------------------------------------------------------------
     // Lifecycle
@@ -14169,6 +14213,12 @@ var DesignerPunk = (() => {
      * @see Requirement 8.7 - Form submission includes radio value when selected
      */
     attributeChangedCallback(name, oldValue, newValue) {
+      if (name === "disabled") {
+        if (newValue !== null) {
+          this.removeAttribute("disabled");
+        }
+        return;
+      }
       if (oldValue === newValue) return;
       if (this.isConnected) {
         this.render();
@@ -14178,6 +14228,22 @@ var DesignerPunk = (() => {
         }
       }
     }
+    /**
+     * Form-associated custom element lifecycle callback, invoked by the UA
+     * when the control's computed disabled state changes — e.g. an ancestor
+     * `<fieldset disabled>`, or (before the attribute-neutralization above
+     * strips it) a `disabled` attribute set directly on this element.
+     *
+     * Intentionally a no-op. Per the ignore-vs-throw parity ruling (D1), this
+     * component does not observe disabled state; the direct
+     * consumer-set-`disabled` case is handled by attribute neutralization in
+     * attributeChangedCallback. A `<fieldset disabled>` ancestor disabling
+     * this control is a platform-level exclusion this component cannot
+     * override from the inside, and is out of D1's scope.
+     * @see .kiro/docs/ballots/2026-09-19-disabled-input-parity.md (D1)
+     */
+    formDisabledCallback(disabled) {
+    }
     // ---------------------------------------------------------------------------
     // Property Accessors (attribute reflection)
     // ---------------------------------------------------------------------------
@@ -14506,7 +14572,7 @@ var DesignerPunk = (() => {
     size: "md"
   };
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Input-Radio-Set/platforms/web/InputRadioSet.web.css
+  // css-as-string:src/components/core/Input-Radio-Set/platforms/web/InputRadioSet.web.css
   var InputRadioSet_web_default = `/**
  * Input-Radio-Set Component Styles for Web Platform
  * 
@@ -15174,7 +15240,7 @@ var DesignerPunk = (() => {
     content: "none"
   };
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Progress-Indicator-Node-Base/platforms/web/ProgressIndicatorNodeBase.styles.css
+  // css-as-string:src/components/core/Progress-Indicator-Node-Base/platforms/web/ProgressIndicatorNodeBase.styles.css
   var ProgressIndicatorNodeBase_styles_default = `/**
  * Progress-Indicator-Node-Base Styles for Web Platform
  * 
@@ -15520,7 +15586,7 @@ var DesignerPunk = (() => {
     state: "inactive"
   };
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Progress-Indicator-Connector-Base/platforms/web/ProgressIndicatorConnectorBase.styles.css
+  // css-as-string:src/components/core/Progress-Indicator-Connector-Base/platforms/web/ProgressIndicatorConnectorBase.styles.css
   var ProgressIndicatorConnectorBase_styles_default = `/**
  * Progress-Indicator-Connector-Base Styles for Web Platform
  * 
@@ -15652,7 +15718,7 @@ var DesignerPunk = (() => {
     customElements.define("progress-indicator-connector-base", ProgressIndicatorConnectorBase);
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Progress-Indicator-Label-Base/platforms/web/ProgressIndicatorLabelBase.styles.css
+  // css-as-string:src/components/core/Progress-Indicator-Label-Base/platforms/web/ProgressIndicatorLabelBase.styles.css
   var ProgressIndicatorLabelBase_styles_default = `/**
  * Progress-Indicator-Label-Base Styles for Web Platform
  * 
@@ -15855,7 +15921,7 @@ var DesignerPunk = (() => {
     return Math.max(1, Math.min(currentItem, totalItems));
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Progress-Pagination-Base/platforms/web/ProgressPaginationBase.styles.css
+  // css-as-string:src/components/core/Progress-Pagination-Base/platforms/web/ProgressPaginationBase.styles.css
   var ProgressPaginationBase_styles_default = `/**
  * Progress-Pagination-Base Styles for Web Platform
  * 
@@ -16157,7 +16223,7 @@ var DesignerPunk = (() => {
     return errorSteps.filter((step) => step >= 1 && step <= totalSteps);
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Progress-Stepper-Base/platforms/web/ProgressStepperBase.styles.css
+  // css-as-string:src/components/core/Progress-Stepper-Base/platforms/web/ProgressStepperBase.styles.css
   var ProgressStepperBase_styles_default = `/**
  * Progress-Stepper-Base Styles for Web Platform
  * 
@@ -16414,7 +16480,7 @@ var DesignerPunk = (() => {
     return errorSteps.filter((step) => step >= 1 && step <= totalSteps);
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Progress-Stepper-Detailed/platforms/web/ProgressStepperDetailed.styles.css
+  // css-as-string:src/components/core/Progress-Stepper-Detailed/platforms/web/ProgressStepperDetailed.styles.css
   var ProgressStepperDetailed_styles_default = `/**
  * Progress-Stepper-Detailed Styles for Web Platform
  * 
@@ -16734,7 +16800,7 @@ var DesignerPunk = (() => {
     size: "standard"
   };
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Nav-SegmentedChoice-Base/platforms/web/NavSegmentedChoiceBase.styles.css
+  // css-as-string:src/components/core/Nav-SegmentedChoice-Base/platforms/web/NavSegmentedChoiceBase.styles.css
   var NavSegmentedChoiceBase_styles_default = `/**
  * Nav-SegmentedChoice-Base Styles for Web Platform
  * 
@@ -17246,7 +17312,7 @@ var DesignerPunk = (() => {
     customElements.define("nav-segmented-choice", NavSegmentedChoiceBase);
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Nav-TabBar-Base/platforms/web/NavTabBarBase.styles.css
+  // css-as-string:src/components/core/Nav-TabBar-Base/platforms/web/NavTabBarBase.styles.css
   var NavTabBarBase_styles_default = `/**
  * Nav-TabBar-Base Styles for Web Platform
  *
@@ -17851,7 +17917,7 @@ var DesignerPunk = (() => {
     customElements.define("nav-tab-bar", NavTabBarBase);
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Nav-Header-Base/platforms/web/NavHeaderBase.styles.css
+  // css-as-string:src/components/core/Nav-Header-Base/platforms/web/NavHeaderBase.styles.css
   var NavHeaderBase_styles_default = `/**
  * Nav-Header-Base Styles for Web Platform
  *
@@ -18029,7 +18095,7 @@ var DesignerPunk = (() => {
     customElements.define("nav-header-app", NavHeaderApp);
   }
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Nav-Header-Page/platforms/web/NavHeaderPage.styles.css
+  // css-as-string:src/components/core/Nav-Header-Page/platforms/web/NavHeaderPage.styles.css
   var NavHeaderPage_styles_default = `/**
  * Nav-Header-Page Styles for Web Platform
  *
@@ -18241,7 +18307,7 @@ var DesignerPunk = (() => {
   // src/components/core/Progress-Bar-Base/types.ts
   var INDETERMINATE_STATIC_FILL = 0.33;
 
-  // css-as-string:/Users/3fn/Documents/Work Projects/Kiro/DesignerPunk-v2/src/components/core/Progress-Bar-Base/platforms/web/ProgressBarBase.styles.css
+  // css-as-string:src/components/core/Progress-Bar-Base/platforms/web/ProgressBarBase.styles.css
   var ProgressBarBase_styles_default = `/**
  * Progress-Bar-Base Styles for Web Platform
  *