@affinda/wc 0.0.25 → 0.0.27

package/dist/collection/components/af-typography-lockup/af-typography-lockup.css

@@ -123,14 +123,22 @@
   gap: var(--space-2, 8px);
 }
 
-/* Heading styles */
+/* Heading styles - font-weight 400 (regular) matches Webflow's NeuSans usage.
+ * display: flex collapses any whitespace-only text nodes that Astro (and
+ * other templating engines) leave between the slotted heading and the
+ * following named-slot siblings — those stray text nodes get projected into
+ * the default slot and, without flex layout, each one occupies a full line
+ * of the heading's line-height (user-visible "extra line break" after the
+ * heading). */
 .heading {
+  display: flex;
+  flex-direction: column;
   font-family: var(--typography-headingfont, 'NeuSans', sans-serif);
-  font-weight: var(--font-weight-book, 500);
+  font-weight: var(--font-weight-regular, 400);
   color: var(--af-typography-heading-primary, var(--colour-typography-heading-primary, #14343B));
   line-height: var(--line-height-heading-tight, 1);
   letter-spacing: var(--letter-spacing-heading, -0.02em);
-  white-space: pre-wrap;
+  white-space: normal;
 }
 
 /* Desktop heading sizes */
@@ -186,7 +194,25 @@
   font-weight: var(--font-weight-regular, 400);
   line-height: var(--line-height-body-large, 26px);
   color: var(--af-typography-body-default, var(--colour-typography-body-default, #2B484F));
-  white-space: pre-wrap;
+  white-space: normal;
+}
+
+/* Heading colour variants — matches Webflow's h1.primary / h1.secondary pattern */
+.heading.heading-color-primary {
+  color: var(--af-typography-heading-primary, var(--colour-typography-heading-primary, #14343B));
+}
+
+.heading.heading-color-secondary {
+  color: var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #B09670));
+}
+
+/* Description colour variants */
+.description.description-color-default {
+  color: var(--af-typography-body-default, var(--colour-typography-body-default, #2B484F));
+}
+
+.description.description-color-secondary {
+  color: var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #B09670));
 }
 
 /* Description text size variations - smaller for heading 3 mobile, 4, and 5 */

package/dist/collection/components/af-typography-lockup/af-typography-lockup.js

@@ -368,3 +368,4 @@ export class AfTypographyLockup {
     }
     static get elementRef() { return "el"; }
 }
+//# sourceMappingURL=af-typography-lockup.js.map

package/dist/collection/components/af-typography-lockup/af-typography-lockup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"af-typography-lockup.js","sourceRoot":"","sources":["../../../src/components/af-typography-lockup/af-typography-lockup.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Prop, State, Host } from '@stencil/core';\n\ntype TextAlign = 'left' | 'center' | 'right' | 'justify';\n\n/**\n * Marketing-style composition of heading + description + buttons with\n * consistent spacing and alignment driven by the `headingSize` prop.\n *\n * **Semantic vs visual:** `headingSize` controls ONLY the visual scale\n * (the lockup sets font-size via a `heading-{1..5}` class). The semantic\n * level (h1-h6) is whatever the consumer slots in as default content.\n * Keep them aligned by convention so assistive tech and search engines\n * see the right hierarchy:\n *\n *   headingSize=1 ↔ <h1>   (or <h2> on non-top-of-page sections)\n *   headingSize=2 ↔ <h2>\n *   headingSize=3 ↔ <h3>\n *   headingSize=4 ↔ <h4>\n *   headingSize=5 ↔ <h5>\n *\n * When a design asks for a visually small H1 or a visually large H3,\n * pass the two independently — just do it deliberately, not by\n * accident. A console warning fires in dev mode if the slotted tag is\n * more than one level away from the prop.\n */\n@Component({\n  tag: 'af-typography-lockup',\n  styleUrl: 'af-typography-lockup.css',\n  shadow: true\n})\nexport class AfTypographyLockup {\n  @Element() el!: HTMLElement;\n\n  /**\n   * The heading size (1-5, where 1 is largest). Controls visual scale\n   * only — pair with a matching <h1>-<h5> slotted element for correct\n   * document outline (see component docblock).\n   */\n  @Prop() headingSize: 1 | 2 | 3 | 4 | 5 = 2;\n\n  /**\n   * The breakpoint for responsive typography\n   */\n  @Prop() breakpoint: 'desktop' | 'mobile' = 'desktop';\n\n  /**\n   * Text alignment for the entire lockup (heading and description).\n   * Can be overridden individually with headingAlignment and descriptionAlignment.\n   */\n  @Prop() textAlignment: TextAlign = 'left';\n\n  /**\n   * Heading text alignment. Falls back to textAlignment if not specified.\n   */\n  @Prop() headingAlignment?: TextAlign;\n\n  /**\n   * Description text alignment. Falls back to textAlignment if not specified.\n   */\n  @Prop() descriptionAlignment?: TextAlign;\n\n  /**\n   * Button layout direction (horizontal or vertical stacking)\n   */\n  @Prop() buttonLayout: 'horizontal' | 'vertical' = 'vertical';\n\n  /**\n   * Buttons position alignment. Falls back to textAlignment if not specified.\n   */\n  @Prop() buttonsAlignment?: TextAlign;\n\n  /**\n   * Maximum width for the copy section (in pixels)\n   */\n  @Prop() maxWidth?: number;\n\n  /**\n   * Heading colour variant. Matches the Webflow pattern of `h1.primary` vs\n   * `h1.secondary`, where \"secondary\" renders in the theme's accent/heading-\n   * secondary colour (soft-clay on most themes).\n   * - `primary` (default) - uses `--af-typography-heading-primary`\n   * - `secondary` - uses `--af-typography-heading-secondary`\n   */\n  @Prop() headingColor: 'primary' | 'secondary' = 'primary';\n\n  /**\n   * Description colour variant. Same pattern as `headingColor`; useful for\n   * hero-style lockups where the description is rendered in the accent colour.\n   * - `default` (default) - uses `--af-typography-body-default`\n   * - `secondary` - uses `--af-typography-heading-secondary`\n   */\n  @Prop() descriptionColor: 'default' | 'secondary' = 'default';\n\n  /**\n   * Whether the consumer passed anything into the description / buttons\n   * slots. The CSS `:empty` selector can't help here — the `<slot>`\n   * element itself counts as a child, so the wrapper divs would always\n   * render as empty-but-visible lines of gap. Tracked on mount and on\n   * any `slotchange` so wrappers collapse cleanly when there's nothing\n   * to show.\n   */\n  @State() hasDescription: boolean = false;\n  @State() hasButtons: boolean = false;\n\n  private descriptionSlot?: HTMLSlotElement;\n  private buttonsSlot?: HTMLSlotElement;\n\n  componentDidLoad() {\n    this.syncSlotState();\n    this.descriptionSlot?.addEventListener('slotchange', this.syncSlotState);\n    this.buttonsSlot?.addEventListener('slotchange', this.syncSlotState);\n    // Dev-time check that the slotted semantic tag (h1-h6) is within one\n    // level of the visual headingSize. Pairs with the class-level docblock;\n    // silent in production unless the author explicitly turned on dev mode\n    // via `window.__AF_STRICT_HEADINGS__`.\n    if (typeof window === 'undefined') return;\n    const strict = (window as unknown as { __AF_STRICT_HEADINGS__?: boolean })\n      .__AF_STRICT_HEADINGS__;\n    if (!strict) return;\n    const heading = Array.from(this.el.children).find(\n      (child) => !(child as HTMLElement).hasAttribute('slot') && /^h[1-6]$/i.test(child.tagName),\n    );\n    if (!heading) return;\n    const slottedLevel = Number(heading.tagName.slice(1));\n    const expected = this.headingSize;\n    if (Math.abs(slottedLevel - expected) > 1) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        `[af-typography-lockup] heading-size=${expected} paired with <${heading.tagName.toLowerCase()}>; ` +\n          `expected an <h${expected}> for document outline. Pass deliberately or align the two.`,\n      );\n    }\n  }\n\n  disconnectedCallback() {\n    this.descriptionSlot?.removeEventListener('slotchange', this.syncSlotState);\n    this.buttonsSlot?.removeEventListener('slotchange', this.syncSlotState);\n  }\n\n  private syncSlotState = () => {\n    this.hasDescription = (this.descriptionSlot?.assignedNodes({ flatten: true }).length ?? 0) > 0;\n    this.hasButtons = (this.buttonsSlot?.assignedNodes({ flatten: true }).length ?? 0) > 0;\n  };\n\n  render() {\n    const effectiveHeadingAlignment = this.headingAlignment ?? this.textAlignment;\n    const effectiveDescriptionAlignment = this.descriptionAlignment ?? this.textAlignment;\n    const effectiveButtonsAlignment = this.buttonsAlignment ?? this.textAlignment;\n\n    const containerClasses = {\n      'lockup': true,\n      [`text-${this.textAlignment}`]: true,\n      [`layout-${this.buttonLayout}`]: true,\n      [`heading-${this.headingSize}`]: true,\n      [`breakpoint-${this.breakpoint}`]: true\n    };\n\n    const headingClasses = {\n      'heading': true,\n      [`align-${effectiveHeadingAlignment}`]: true,\n      [`heading-color-${this.headingColor}`]: true\n    };\n\n    const descriptionClasses = {\n      'description': true,\n      [`align-${effectiveDescriptionAlignment}`]: true,\n      [`description-color-${this.descriptionColor}`]: true\n    };\n\n    const buttonsClasses = {\n      'buttons': true,\n      [`align-${effectiveButtonsAlignment}`]: true\n    };\n\n    const copyStyle = this.maxWidth ? { maxWidth: `${this.maxWidth}px` } : {};\n\n    return (\n      <Host>\n        <div class={containerClasses}>\n          <div class=\"copy\" style={copyStyle}>\n            <div class={headingClasses} part=\"heading\">\n              <slot></slot>\n            </div>\n            <div class={descriptionClasses} part=\"body\" hidden={!this.hasDescription}>\n              <slot name=\"description\" ref={(el) => (this.descriptionSlot = el as HTMLSlotElement)}></slot>\n            </div>\n          </div>\n          <div class={buttonsClasses} part=\"buttons\" hidden={!this.hasButtons}>\n            <slot name=\"buttons\" ref={(el) => (this.buttonsSlot = el as HTMLSlotElement)}></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/af-video-container/af-video-container.js

@@ -42,7 +42,7 @@ export class AfVideoContainer {
         };
     }
     render() {
-        return (h(Host, { key: '9e6c5666aadff71d14dcff94469c194ad6255a8c' }, h("div", { key: '3690b9c6db562b3777f140e8dbf406da3e4c8f4f', class: "video-container" }, h("div", { key: 'fa80fab02b3015eb872e3d1eb6f693357ebe8f8d', class: "video-container__top" }, h("slot", { key: '795821203920f68f35c84b9155d0f44002a66042', name: "top" })), h("div", { key: '6f4fa9bd803141ce8df6468b7d29d5ba9bd6f237', class: "video-container__video" }, h("af-aspect-ratio", { key: 'bba59d56a42639aa2d4f43d84d5b95f0ef33ce72', ratio: "16:9" }, h("div", { key: 'af54817594a000b05621fb01be5d8f8fdc857ac6', class: "video-container__thumbnail-wrapper" }, this.videoThumbnailUrl && (h("img", { key: 'faba87de58bec4a981e8bf1382f744ac3e47ffbe', src: this.videoThumbnailUrl, alt: this.videoAlt, class: "video-container__thumbnail", loading: "lazy" })), h("button", { key: '1dbcf64a1a251e81eccf7013c6cd82e6b3e1b622', class: "video-container__play-button", onClick: this.handlePlayClick, "aria-label": "Play video", type: "button" }, h("af-icon", { key: 'aa96780fdaaa69d3299f25074122712cd57a0a49', name: "play", size: 24 }))))), h("div", { key: '070c4b3e448f5feff70c2bcc0f31e0dc9f90b0ce', class: "video-container__bottom" }, h("slot", { key: '6a1fec74caa7385082fc59c5e2500043038dfca1', name: "bottom" })))));
+        return (h(Host, { key: '805ef2cb5883f2589729c8f01a6912d9649931ed' }, h("div", { key: '0378ad7aa7ba09981fc87b8701e056cfd71c7ff2', class: "video-container" }, h("div", { key: '0d6581e16ee68472b37d1d7f5135f3ce5b6312a0', class: "video-container__top" }, h("slot", { key: '8802570242c658b176405ab1493254c4c3473d4a', name: "top" })), h("div", { key: 'ff73de6c3dc1597acbaf707dbfcb5559fde6ebdb', class: "video-container__video" }, h("af-aspect-ratio", { key: '092c02fe25891ef4436056056c1443bfe35631ab', ratio: "16:9" }, h("div", { key: '0e1def94ac6e243af93c67e13c1fb7d743eeb808', class: "video-container__thumbnail-wrapper" }, this.videoThumbnailUrl && (h("img", { key: '9437d1ee258da0548225edd8f6f38f3ac1984e66', src: this.videoThumbnailUrl, alt: this.videoAlt, class: "video-container__thumbnail", loading: "lazy" })), h("button", { key: '0269c801acca11d95e383a9d588ba07b30fa28a2', class: "video-container__play-button", onClick: this.handlePlayClick, "aria-label": "Play video", type: "button" }, h("af-icon", { key: '85ba1f8c72057d948ab6c06cdf76be075f81f9d7', name: "play", size: 24 }))))), h("div", { key: '4b50dd7066e2f0390052d0042d762f7e3d3beb1a', class: "video-container__bottom" }, h("slot", { key: 'ef00f995dc3e81e0197846d672701c829a8d61d1', name: "bottom" })))));
     }
     static get is() { return "af-video-container"; }
     static get encapsulation() { return "scoped"; }
@@ -139,3 +139,4 @@ export class AfVideoContainer {
             }];
     }
 }
+//# sourceMappingURL=af-video-container.js.map

package/dist/collection/components/af-video-container/af-video-container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"af-video-container.js","sourceRoot":"","sources":["../../../src/components/af-video-container/af-video-container.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAE9E;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAOH,MAAM,OAAO,gBAAgB;IAN7B;QAOE,gCAAgC;QACxB,sBAAiB,GAAW,EAAE,CAAC;QAEvC,uCAAuC;QAC/B,aAAQ,GAAW,iBAAiB,CAAC;QAE7C,8CAA8C;QACtC,aAAQ,GAAW,EAAE,CAAC;QAS9B;;WAEG;QACK,oBAAe,GAAG,GAAG,EAAE;YAC7B,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC;YAE/D,yDAAyD;YACzD,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAC7C,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;YACvC,CAAC;QACH,CAAC,CAAC;KA4CH;IA1CC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,iBAAiB;gBAE1B,4DAAK,KAAK,EAAC,sBAAsB;oBAC/B,6DAAM,IAAI,EAAC,KAAK,GAAQ,CACpB;gBAGN,4DAAK,KAAK,EAAC,wBAAwB;oBACjC,wEAAiB,KAAK,EAAC,MAAM;wBAC3B,4DAAK,KAAK,EAAC,oCAAoC;4BAC5C,IAAI,CAAC,iBAAiB,IAAI,CACzB,4DACE,GAAG,EAAE,IAAI,CAAC,iBAAiB,EAC3B,GAAG,EAAE,IAAI,CAAC,QAAQ,EAClB,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,MAAM,GACd,CACH;4BAED,+DACE,KAAK,EAAC,8BAA8B,EACpC,OAAO,EAAE,IAAI,CAAC,eAAe,gBAClB,YAAY,EACvB,IAAI,EAAC,QAAQ;gCAEb,gEAAS,IAAI,EAAC,MAAM,EAAC,IAAI,EAAE,EAAE,GAAY,CAClC,CACL,CACU,CACd;gBAGN,4DAAK,KAAK,EAAC,yBAAyB;oBAClC,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop, Event, EventEmitter } from '@stencil/core';\n\n/**\n * Video Container molecule component for showcasing video content.\n * \n * Uses slots for typography lockups above and below the video.\n * When used inside af-split-section, the top slot inherits the top theme\n * and the bottom slot inherits the bottom theme for correct colors.\n * \n * @example\n * ```html\n * <af-split-section top-theme=\"mist-green\" bottom-theme=\"white\">\n *   <af-video-container video-thumbnail-url=\"/path/to/thumbnail.jpg\">\n *     <af-typography-lockup slot=\"top\" text-alignment=\"center\" heading-size=\"2\">\n *       <af-heading level=\"2\">Watch our product demo</af-heading>\n *       <af-text slot=\"description\">See how Affinda transforms your workflow</af-text>\n *       <af-button slot=\"buttons\" variant=\"primary\">Get Started</af-button>\n *     </af-typography-lockup>\n *   </af-video-container>\n * </af-split-section>\n * ```\n * \n * @slot top - Content above the video (typically af-typography-lockup). Inherits top theme.\n * @slot bottom - Content below the video (typically af-typography-lockup). Inherits bottom theme.\n */\n@Component({\n  tag: 'af-video-container',\n  styleUrl: 'af-video-container.css',\n  shadow: false,\n  scoped: true,\n})\nexport class AfVideoContainer {\n  /** Video thumbnail image URL */\n  @Prop() videoThumbnailUrl: string = '';\n\n  /** Video alt text for accessibility */\n  @Prop() videoAlt: string = 'Video thumbnail';\n\n  /** Optional video URL for play button link */\n  @Prop() videoUrl: string = '';\n\n  /** \n   * Emitted when the play button is clicked.\n   * Use this to handle video playback (e.g., open modal, embed player).\n   * If videoUrl is set and no handler prevents default, opens URL in new tab.\n   */\n  @Event() playClick!: EventEmitter<{ videoUrl: string }>;\n\n  /**\n   * Handles play button click - emits event and optionally opens URL\n   */\n  private handlePlayClick = () => {\n    const event = this.playClick.emit({ videoUrl: this.videoUrl });\n    \n    // Only open URL if event wasn't prevented and URL exists\n    if (!event.defaultPrevented && this.videoUrl) {\n      window.open(this.videoUrl, '_blank');\n    }\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class=\"video-container\">\n          {/* Top slot - for typography lockup above video (inherits top theme) */}\n          <div class=\"video-container__top\">\n            <slot name=\"top\"></slot>\n          </div>\n\n          {/* Video thumbnail section */}\n          <div class=\"video-container__video\">\n            <af-aspect-ratio ratio=\"16:9\">\n              <div class=\"video-container__thumbnail-wrapper\">\n                {this.videoThumbnailUrl && (\n                  <img \n                    src={this.videoThumbnailUrl} \n                    alt={this.videoAlt}\n                    class=\"video-container__thumbnail\"\n                    loading=\"lazy\"\n                  />\n                )}\n                {/* Play button overlay */}\n                <button \n                  class=\"video-container__play-button\"\n                  onClick={this.handlePlayClick}\n                  aria-label=\"Play video\"\n                  type=\"button\"\n                >\n                  <af-icon name=\"play\" size={24}></af-icon>\n                </button>\n              </div>\n            </af-aspect-ratio>\n          </div>\n\n          {/* Bottom slot - for typography lockup below video (inherits bottom theme) */}\n          <div class=\"video-container__bottom\">\n            <slot name=\"bottom\"></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n\n"]}

package/dist/collection/components/af-visually-hidden/af-visually-hidden.js

@@ -15,7 +15,7 @@ export class AfVisuallyHidden {
         this.focusable = false;
     }
     render() {
-        return (h(Host, { key: '23738df059de827e6d1441906ac4dc9f0e568193', class: { 'focusable': this.focusable } }, h("slot", { key: 'bd867e2e71c748fc4d7faed12e993cf14bd0b311' })));
+        return (h(Host, { key: '9ce559b8f54328432497181c2e8c7a4136ddd67d', class: { 'focusable': this.focusable } }, h("slot", { key: '4d877b02acf7b1ab61dca5e72b4d76c37a9fc7c2' })));
     }
     static get is() { return "af-visually-hidden"; }
     static get encapsulation() { return "shadow"; }
@@ -54,3 +54,4 @@ export class AfVisuallyHidden {
         };
     }
 }
+//# sourceMappingURL=af-visually-hidden.js.map

package/dist/collection/components/af-visually-hidden/af-visually-hidden.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"af-visually-hidden.js","sourceRoot":"","sources":["../../../src/components/af-visually-hidden/af-visually-hidden.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;;;;GAMG;AAMH,MAAM,OAAO,gBAAgB;IAL7B;QAME;;;WAGG;QACK,cAAS,GAAY,KAAK,CAAC;KASpC;IAPC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,EAAE,WAAW,EAAE,IAAI,CAAC,SAAS,EAAE;YAC1C,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * Visually Hidden component for accessible content.\n * Hides content visually while keeping it accessible to screen readers.\n * Essential for accessibility - use for skip links, form labels, etc.\n *\n * @slot - Content to hide visually\n */\n@Component({\n  tag: 'af-visually-hidden',\n  styleUrl: 'af-visually-hidden.css',\n  shadow: true,\n})\nexport class AfVisuallyHidden {\n  /**\n   * When true, the content becomes visible when focused.\n   * Useful for skip links and other focusable elements.\n   */\n  @Prop() focusable: boolean = false;\n\n  render() {\n    return (\n      <Host class={{ 'focusable': this.focusable }}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\n"]}

package/dist/collection/components.js

@@ -21,3 +21,4 @@ export { AfTab } from './components/af-tab/af-tab';
 export { AfTabBar } from './components/af-tab-bar/af-tab-bar';
 export { AfFeatureCard } from './components/af-feature-card/af-feature-card';
 export { AfIllustratedCard } from './components/af-illustrated-card/af-illustrated-card';
+//# sourceMappingURL=components.js.map

package/dist/collection/components.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"components.js","sourceRoot":"","sources":["../src/components.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,oCAAoC,CAAC;AAC/D,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,8CAA8C,CAAC;AAC7E,OAAO,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,8CAA8C,CAAC;AAC7E,OAAO,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,4CAA4C,CAAC;AAC1E,OAAO,EAAE,aAAa,EAAE,MAAM,8CAA8C,CAAC;AAC7E,OAAO,EAAE,kBAAkB,EAAE,MAAM,wDAAwD,CAAC;AAC5F,OAAO,EAAE,UAAU,EAAE,MAAM,sCAAsC,CAAC;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,sCAAsC,CAAC;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,sCAAsC,CAAC;AAClE,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,8CAA8C,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,sDAAsD,CAAC","sourcesContent":["export { AfHeading } from './components/af-heading/af-heading';\nexport { AfText } from './components/af-text/af-text';\nexport { AfColorSwatch } from './components/af-color-swatch/af-color-swatch';\nexport { AfContainer } from './components/af-container/af-container';\nexport { AfAspectRatio } from './components/af-aspect-ratio/af-aspect-ratio';\nexport { AfNavItem } from './components/af-nav-item/af-nav-item';\nexport { AfNavbar } from './components/af-navbar/af-navbar';\nexport { AfLogo } from './components/af-logo/af-logo';\nexport { AfButton } from './components/af-button/af-button';\nexport { AfIconButton } from './components/af-icon-button/af-icon-button';\nexport { AfButtonGroup } from './components/af-button-group/af-button-group';\nexport { AfTypographyLockup } from './components/af-typography-lockup/af-typography-lockup';\nexport { AfCheckbox } from './components/af-checkbox/af-checkbox';\nexport { AfRadio } from './components/af-radio/af-radio';\nexport { AfSwitch } from './components/af-switch/af-switch';\nexport { AfFieldset } from './components/af-fieldset/af-fieldset';\nexport { AfInput } from './components/af-input/af-input';\nexport { AfTextarea } from './components/af-textarea/af-textarea';\nexport { AfTag } from './components/af-tag/af-tag';\nexport { AfTab } from './components/af-tab/af-tab';\nexport { AfTabBar } from './components/af-tab-bar/af-tab-bar';\nexport { AfFeatureCard } from './components/af-feature-card/af-feature-card';\nexport { AfIllustratedCard } from './components/af-illustrated-card/af-illustrated-card';\n"]}

package/dist/collection/index.js

@@ -1 +1,2 @@
 export * from './components';
+//# sourceMappingURL=index.js.map

package/dist/collection/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC","sourcesContent":["export * from './components';\n"]}

package/dist/components/af-accordion-item.js

@@ -1 +1,107 @@
-import{p as e,H as t,d as s,h as o,c as i,t as a}from"./p-DsNqeD3z.js";const n=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.accordionToggle=s(this,"af-accordion-toggle"),this.open=!1,this.disabled=!1,this.contentHeight=0,this.handleTriggerClick=()=>{this.disabled||this.toggle()}}handleOpenChange(e){e&&this.measureContent()}componentDidLoad(){fetch("http://127.0.0.1:7242/ingest/b0b55d5e-d10c-4b52-9f1d-02a40f4c5e87",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({location:"af-accordion-item.tsx:componentDidLoad",message:"Component loaded",data:{itemId:this.itemId,hasShadowRoot:!!this.el.shadowRoot},timestamp:Date.now(),sessionId:"debug-session",hypothesisId:"E"})}).catch((()=>{}));const e=this.el.shadowRoot,t=e?.querySelector('slot[name="trigger"]'),s=t?.assignedNodes()||[],o=t?.assignedElements()||[];fetch("http://127.0.0.1:7242/ingest/b0b55d5e-d10c-4b52-9f1d-02a40f4c5e87",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({location:"af-accordion-item.tsx:componentDidLoad:slotCheck",message:"Checking trigger slot content",data:{hasTriggerSlot:!!t,assignedNodesCount:s.length,assignedElementsCount:o.length,assignedContent:o.map((e=>({tagName:e.tagName,textContent:e.textContent})))},timestamp:Date.now(),sessionId:"debug-session",hypothesisId:"A"})}).catch((()=>{}));const i=e?.querySelector(".trigger-content"),a=i?getComputedStyle(i):null;fetch("http://127.0.0.1:7242/ingest/b0b55d5e-d10c-4b52-9f1d-02a40f4c5e87",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({location:"af-accordion-item.tsx:componentDidLoad:styleCheck",message:"Checking trigger-content styles",data:{hasTriggerContent:!!i,width:i?.offsetWidth,height:i?.offsetHeight,color:a?.color,display:a?.display,visibility:a?.visibility},timestamp:Date.now(),sessionId:"debug-session",hypothesisId:"B,C"})}).catch((()=>{}));const n=Array.from(this.el.children),d=this.el.querySelector('[slot="trigger"]');fetch("http://127.0.0.1:7242/ingest/b0b55d5e-d10c-4b52-9f1d-02a40f4c5e87",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({location:"af-accordion-item.tsx:componentDidLoad:lightDomCheck",message:"Checking light DOM for slotted content",data:{lightDomChildCount:n.length,lightDomTags:n.map((e=>e.tagName)),hasSlottedTrigger:!!d,slottedTriggerText:d?.textContent},timestamp:Date.now(),sessionId:"debug-session",hypothesisId:"D"})}).catch((()=>{})),this.open&&this.measureContent(),this.resizeObserver=new ResizeObserver((()=>{this.open&&this.contentRef&&(this.contentHeight=this.contentRef.scrollHeight)})),this.contentRef&&this.resizeObserver.observe(this.contentRef)}disconnectedCallback(){this.resizeObserver&&this.resizeObserver.disconnect()}async toggle(){this.disabled||(this.open=!this.open,this.accordionToggle.emit({itemId:this.itemId,open:this.open}))}measureContent(){requestAnimationFrame((()=>{this.contentRef&&(this.contentHeight=this.contentRef.scrollHeight)}))}render(){fetch("http://127.0.0.1:7242/ingest/b0b55d5e-d10c-4b52-9f1d-02a40f4c5e87",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({location:"af-accordion-item.tsx:render",message:"Render called",data:{itemId:this.itemId,open:this.open},timestamp:Date.now(),sessionId:"debug-session",hypothesisId:"E"})}).catch((()=>{}));const e={maxHeight:this.open?this.contentHeight+"px":"0px"};return o(i,{key:"43f7afd57f2140281370bb017cfe2b51cd2842ce",class:{"is-open":this.open,"is-disabled":this.disabled}},o("div",{key:"940e6da12aff564fba2e7fefe9d86da2ee75ace2",class:"accordion-item"},o("button",{key:"b95af456ed818845a063e171bf0f761ef9177d27",class:"trigger",onClick:this.handleTriggerClick,"aria-expanded":this.open?"true":"false","aria-controls":"content-"+this.itemId,disabled:this.disabled,type:"button"},o("div",{key:"20d794a74b04186e970ff1ca87dc1815dbe74db8",class:"trigger-content"},o("slot",{key:"4093bf6319a38abe01c2c6543943a1057cb39bd6",name:"trigger"})),o("div",{key:"5e9245bb929007455538327366ed7b1ae29c82b1",class:{chevron:!0,"is-open":this.open}},o("svg",{key:"1d6854e700f7ef35471093bc635d74a27bf370eb",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},o("path",{key:"9b89ceb690f036e1504b73a61c9aa44295da6227",d:"M6 9l6 6 6-6","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"})))),o("div",{key:"8e7fe567cbbc396100bd6ea75ad8e8854bc92e2a",id:"content-"+this.itemId,class:"content-wrapper",style:e,"aria-hidden":this.open?"false":"true"},o("div",{key:"4a64f911c697b4c5558cfe42f77f9afa99ea5ef9",class:"content",ref:e=>this.contentRef=e},o("slot",{key:"aa5d84c7dc3a99e17a2f89a5247b3bd1b12c676b"})))))}get el(){return this}static get watchers(){return{open:[{handleOpenChange:0}]}}static get style(){return":host{display:block;width:100%}.accordion-item{width:100%}.trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:16px 0;background:transparent;border:none;border-bottom:1px solid var(--af-background-border-subtle, #e8eeed);cursor:pointer;font:inherit;text-align:left;color:var(--af-typography-body-dark, #14343b);transition:background-color 0.2s ease}.trigger:hover:not(:disabled){background-color:var(--af-background-base-hover, rgba(20, 52, 59, 0.02))}.trigger:focus-visible{outline:2px solid var(--af-background-border-active, #8a7049);outline-offset:-2px}.trigger:disabled{cursor:not-allowed;opacity:0.5}.trigger-content{flex:1;min-width:0}.chevron{display:flex;align-items:center;justify-content:center;width:24px;height:24px;flex-shrink:0;color:var(--af-typography-body-dark, #14343b);transition:transform 0.3s ease}.chevron.is-open{transform:rotate(180deg)}.content-wrapper{overflow:hidden;transition:max-height 0.3s ease}.content{padding:0}:host(.is-disabled) .trigger{cursor:not-allowed;opacity:0.5}:host(.is-disabled) .trigger:hover{background-color:transparent}:host(.is-open) .trigger{border-bottom-color:transparent}"}},[257,"af-accordion-item",{itemId:[513,"item-id"],open:[1540],disabled:[516],contentHeight:[32],toggle:[64]},void 0,{open:[{handleOpenChange:0}]}]),d=n,r=function(){"undefined"!=typeof customElements&&["af-accordion-item"].forEach((e=>{"af-accordion-item"===e&&(customElements.get(a(e))||customElements.define(a(e),n))}))};export{d as AfAccordionItem,r as defineCustomElement}
+import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-BBpihWJI.js';
+
+const afAccordionItemCss = ":host{display:block;width:100%}.accordion-item{width:100%}.trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:16px 0;background:transparent;border:none;border-bottom:1px solid var(--af-background-border-subtle, #e8eeed);cursor:pointer;font:inherit;text-align:left;color:var(--af-typography-body-dark, #14343b);transition:background-color 0.2s ease}.trigger:hover:not(:disabled){background-color:var(--af-background-base-hover, rgba(20, 52, 59, 0.02))}.trigger:focus-visible{outline:2px solid var(--af-background-border-active, #8a7049);outline-offset:-2px}.trigger:disabled{cursor:not-allowed;opacity:0.5}.trigger-content{flex:1;min-width:0}.chevron{display:flex;align-items:center;justify-content:center;width:24px;height:24px;flex-shrink:0;color:var(--af-typography-body-dark, #14343b);transition:transform 0.3s ease}.chevron.is-open{transform:rotate(180deg)}.content-wrapper{overflow:hidden;transition:max-height 0.3s ease}.content{padding:0}:host(.is-disabled) .trigger{cursor:not-allowed;opacity:0.5}:host(.is-disabled) .trigger:hover{background-color:transparent}:host(.is-open) .trigger{border-bottom-color:transparent}";
+
+const AfAccordionItem$1 = /*@__PURE__*/ proxyCustomElement(class AfAccordionItem extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.accordionToggle = createEvent(this, "af-accordion-toggle");
+        /**
+         * Whether this item is currently expanded
+         */
+        this.open = false;
+        /**
+         * Whether this item is disabled (cannot be toggled)
+         */
+        this.disabled = false;
+        this.contentHeight = 0;
+        this.handleTriggerClick = () => {
+            if (!this.disabled) {
+                this.toggle();
+            }
+        };
+    }
+    handleOpenChange(newValue) {
+        if (newValue) {
+            this.measureContent();
+        }
+    }
+    componentDidLoad() {
+        if (this.open) {
+            this.measureContent();
+        }
+        this.resizeObserver = new ResizeObserver(() => {
+            if (this.open && this.contentRef) {
+                this.contentHeight = this.contentRef.scrollHeight;
+            }
+        });
+        if (this.contentRef) {
+            this.resizeObserver.observe(this.contentRef);
+        }
+    }
+    disconnectedCallback() {
+        if (this.resizeObserver) {
+            this.resizeObserver.disconnect();
+        }
+    }
+    /**
+     * Programmatically toggle the accordion item
+     */
+    async toggle() {
+        if (!this.disabled) {
+            this.open = !this.open;
+            this.accordionToggle.emit({ itemId: this.itemId, open: this.open });
+        }
+    }
+    measureContent() {
+        requestAnimationFrame(() => {
+            if (this.contentRef) {
+                this.contentHeight = this.contentRef.scrollHeight;
+            }
+        });
+    }
+    render() {
+        const contentStyle = {
+            maxHeight: this.open ? `${this.contentHeight}px` : '0px'
+        };
+        return (h(Host, { key: 'f09a5fe4d1ca9e14d674c5cb255c391355fba0b9', class: { 'is-open': this.open, 'is-disabled': this.disabled } }, h("div", { key: '2e53d4c8599acd81e7a624ac130add7ea7be3c86', class: "accordion-item" }, h("button", { key: 'c3b97ff90a37ac7f582b2ba086db0faa21328dc2', class: "trigger", onClick: this.handleTriggerClick, "aria-expanded": this.open ? 'true' : 'false', "aria-controls": `content-${this.itemId}`, disabled: this.disabled, type: "button" }, h("div", { key: '48446eb132a44680630f46c1bd65921a440f688a', class: "trigger-content" }, h("slot", { key: 'a47fdf5a659602a340091544587be928c226a89b', name: "trigger" })), h("div", { key: '1c938183404f982ebcfe3ba0661f57e4ecf2c006', class: { 'chevron': true, 'is-open': this.open } }, h("svg", { key: '20d3ef9eb98b0cbb2f0af2165cc911fb3ec93bd5', width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor" }, h("path", { key: '7477c118131ce91b79d1c9f74174c9431ee60dca', d: "M6 9l6 6 6-6", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("div", { key: '676a89763218ddbd6daddb174a4eebecfffb6a94', id: `content-${this.itemId}`, class: "content-wrapper", style: contentStyle, "aria-hidden": !this.open ? 'true' : 'false' }, h("div", { key: 'fb0f8760497cf998daa0f1cd5c52c6349fb125e4', class: "content", ref: (el) => (this.contentRef = el) }, h("slot", { key: '300f0b749dbaf06bb44ad9b176f3d9f64c52db6e' }))))));
+    }
+    get el() { return this; }
+    static get watchers() { return {
+        "open": ["handleOpenChange"]
+    }; }
+    static get style() { return afAccordionItemCss; }
+}, [257, "af-accordion-item", {
+        "itemId": [513, "item-id"],
+        "open": [1540],
+        "disabled": [516],
+        "contentHeight": [32],
+        "toggle": [64]
+    }, undefined, {
+        "open": ["handleOpenChange"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["af-accordion-item"];
+    components.forEach(tagName => { switch (tagName) {
+        case "af-accordion-item":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, AfAccordionItem$1);
+            }
+            break;
+    } });
+}
+
+const AfAccordionItem = AfAccordionItem$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { AfAccordionItem, defineCustomElement };
+//# sourceMappingURL=af-accordion-item.js.map
+
+//# sourceMappingURL=af-accordion-item.js.map

package/dist/components/af-accordion-item.js.map

@@ -0,0 +1 @@
+{"file":"af-accordion-item.js","mappings":";;AAAA,MAAM,kBAAkB,GAAG,8oCAA8oC;;MCc5pCA,iBAAe,iBAAAC,kBAAA,CAAA,MAAA,eAAA,SAAAC,CAAA,CAAA;AAL5B,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;AAcE;;AAEG;AACqC,QAAA,IAAI,CAAA,IAAA,GAAY,KAAK;AAE7D;;AAEG;AACsB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAOzC,QAAA,IAAa,CAAA,aAAA,GAAW,CAAC;AAqD1B,QAAA,IAAkB,CAAA,kBAAA,GAAG,MAAK;AAChC,YAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;gBAClB,IAAI,CAAC,MAAM,EAAE;;AAEjB,SAAC;AAyCF;AA5FC,IAAA,gBAAgB,CAAC,QAAiB,EAAA;QAChC,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,cAAc,EAAE;;;IAIzB,gBAAgB,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,IAAI,CAAC,cAAc,EAAE;;AAGvB,QAAA,IAAI,CAAC,cAAc,GAAG,IAAI,cAAc,CAAC,MAAK;YAC5C,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,UAAU,EAAE;gBAChC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,UAAU,CAAC,YAAY;;AAErD,SAAC,CAAC;AAEF,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC;;;IAIhD,oBAAoB,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,cAAc,EAAE;AACvB,YAAA,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE;;;AAIpC;;AAEG;AAEH,IAAA,MAAM,MAAM,GAAA;AACV,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAClB,YAAA,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI;AACtB,YAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;;;IAI/D,cAAc,GAAA;QACpB,qBAAqB,CAAC,MAAK;AACzB,YAAA,IAAI,IAAI,CAAC,UAAU,EAAE;gBACnB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,UAAU,CAAC,YAAY;;AAErD,SAAC,CAAC;;IASJ,MAAM,GAAA;AACJ,QAAA,MAAM,YAAY,GAAG;AACnB,YAAA,SAAS,EAAE,IAAI,CAAC,IAAI,GAAG,CAAG,EAAA,IAAI,CAAC,aAAa,CAAA,EAAA,CAAI,GAAG;SACpD;AAED,QAAA,QACE,CAAC,CAAA,IAAI,qDAAC,KAAK,EAAE,EAAE,SAAS,EAAE,IAAI,CAAC,IAAI,EAAE,aAAa,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAA,EACjE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAA,EACzB,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,IAAI,CAAC,kBAAkB,EAAA,eAAA,EACjB,IAAI,CAAC,IAAI,GAAG,MAAM,GAAG,OAAO,EAC5B,eAAA,EAAA,CAAW,QAAA,EAAA,IAAI,CAAC,MAAM,CAAA,CAAE,EACvC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAC,QAAQ,EAAA,EAEb,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAC1B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,SAAS,EAAA,CAAQ,CACxB,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,CAAC,IAAI,EAAE,EAAA,EACnD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAA,EAC/E,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,cAAc,EAAA,cAAA,EAAc,GAAG,EAAA,gBAAA,EAAgB,OAAO,EAAA,iBAAA,EAAiB,OAAO,EAAA,CAAE,CACpF,CACF,CACC,EACT,CACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAE,CAAW,QAAA,EAAA,IAAI,CAAC,MAAM,CAAE,CAAA,EAC5B,KAAK,EAAC,iBAAiB,EACvB,KAAK,EAAE,YAAY,EACN,aAAA,EAAA,CAAC,IAAI,CAAC,IAAI,GAAG,MAAM,GAAG,OAAO,EAAA,EAE1C,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,SAAS,EAAC,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC,EAAA,EACtD,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACF,CACF,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["AfAccordionItem","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-accordion-item/af-accordion-item.css?tag=af-accordion-item&encapsulation=shadow","src/components/af-accordion-item/af-accordion-item.tsx"],"sourcesContent":[":host {\n  display: block;\n  width: 100%;\n}\n\n.accordion-item {\n  width: 100%;\n}\n\n/* Trigger button - clickable header */\n.trigger {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  padding: 16px 0;\n  background: transparent;\n  border: none;\n  border-bottom: 1px solid var(--af-background-border-subtle, #e8eeed);\n  cursor: pointer;\n  font: inherit;\n  text-align: left;\n  color: var(--af-typography-body-dark, #14343b);\n  transition: background-color 0.2s ease;\n}\n\n.trigger:hover:not(:disabled) {\n  background-color: var(--af-background-base-hover, rgba(20, 52, 59, 0.02));\n}\n\n.trigger:focus-visible {\n  outline: 2px solid var(--af-background-border-active, #8a7049);\n  outline-offset: -2px;\n}\n\n.trigger:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.trigger-content {\n  flex: 1;\n  min-width: 0;\n}\n\n/* Chevron indicator */\n.chevron {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  flex-shrink: 0;\n  color: var(--af-typography-body-dark, #14343b);\n  transition: transform 0.3s ease;\n}\n\n.chevron.is-open {\n  transform: rotate(180deg);\n}\n\n/* Content wrapper - handles animation */\n.content-wrapper {\n  overflow: hidden;\n  transition: max-height 0.3s ease;\n}\n\n.content {\n  padding: 0;\n}\n\n/* Disabled state */\n:host(.is-disabled) .trigger {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n:host(.is-disabled) .trigger:hover {\n  background-color: transparent;\n}\n\n/* Open state styling */\n:host(.is-open) .trigger {\n  border-bottom-color: transparent;\n}\n\n","import { Component, h, Prop, Host, Event, EventEmitter, Element, State, Watch, Method } from '@stencil/core';\n\n/**\n * A single collapsible accordion item with header and content.\n * Can be used standalone or within an af-accordion container.\n *\n * @slot trigger - The clickable header content\n * @slot - The collapsible content (default slot)\n */\n@Component({\n  tag: 'af-accordion-item',\n  styleUrl: 'af-accordion-item.css',\n  shadow: true,\n})\nexport class AfAccordionItem {\n  @Element() el!: HTMLElement;\n\n  /**\n   * Unique identifier for this accordion item.\n   * Used by parent af-accordion to track open state.\n   */\n  @Prop({ reflect: true }) itemId!: string;\n\n  /**\n   * Whether this item is currently expanded\n   */\n  @Prop({ reflect: true, mutable: true }) open: boolean = false;\n\n  /**\n   * Whether this item is disabled (cannot be toggled)\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Emitted when the accordion item is toggled\n   */\n  @Event({ eventName: 'af-accordion-toggle' }) accordionToggle!: EventEmitter<{ itemId: string; open: boolean }>;\n\n  @State() contentHeight: number = 0;\n\n  private contentRef?: HTMLElement;\n  private resizeObserver?: ResizeObserver;\n\n  @Watch('open')\n  handleOpenChange(newValue: boolean) {\n    if (newValue) {\n      this.measureContent();\n    }\n  }\n\n  componentDidLoad() {\n    if (this.open) {\n      this.measureContent();\n    }\n\n    this.resizeObserver = new ResizeObserver(() => {\n      if (this.open && this.contentRef) {\n        this.contentHeight = this.contentRef.scrollHeight;\n      }\n    });\n\n    if (this.contentRef) {\n      this.resizeObserver.observe(this.contentRef);\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.resizeObserver) {\n      this.resizeObserver.disconnect();\n    }\n  }\n\n  /**\n   * Programmatically toggle the accordion item\n   */\n  @Method()\n  async toggle() {\n    if (!this.disabled) {\n      this.open = !this.open;\n      this.accordionToggle.emit({ itemId: this.itemId, open: this.open });\n    }\n  }\n\n  private measureContent() {\n    requestAnimationFrame(() => {\n      if (this.contentRef) {\n        this.contentHeight = this.contentRef.scrollHeight;\n      }\n    });\n  }\n\n  private handleTriggerClick = () => {\n    if (!this.disabled) {\n      this.toggle();\n    }\n  };\n\n  render() {\n    const contentStyle = {\n      maxHeight: this.open ? `${this.contentHeight}px` : '0px'\n    };\n\n    return (\n      <Host class={{ 'is-open': this.open, 'is-disabled': this.disabled }}>\n        <div class=\"accordion-item\">\n          <button\n            class=\"trigger\"\n            onClick={this.handleTriggerClick}\n            aria-expanded={this.open ? 'true' : 'false'}\n            aria-controls={`content-${this.itemId}`}\n            disabled={this.disabled}\n            type=\"button\"\n          >\n            <div class=\"trigger-content\">\n              <slot name=\"trigger\"></slot>\n            </div>\n            <div class={{ 'chevron': true, 'is-open': this.open }}>\n              <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\n                <path d=\"M6 9l6 6 6-6\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n              </svg>\n            </div>\n          </button>\n          <div\n            id={`content-${this.itemId}`}\n            class=\"content-wrapper\"\n            style={contentStyle}\n            aria-hidden={!this.open ? 'true' : 'false'}\n          >\n            <div class=\"content\" ref={(el) => (this.contentRef = el)}>\n              <slot></slot>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/af-accordion.js

@@ -1 +1,128 @@
-import{p as e,H as t,d as a,h as s,c as i,t as c}from"./p-DsNqeD3z.js";const o=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.accordionChange=a(this,"af-accordion-change"),this.mode="independent",this.internalValue=[]}isControlled(){return void 0!==this.value}componentWillLoad(){const e=this.isControlled()?this.value:this.defaultValue;this.internalValue=this.normalizeValue(e)}handleValueChange(e){this.isControlled()&&(this.internalValue=this.normalizeValue(e),this.syncItems())}componentDidLoad(){this.syncItems()}handleItemToggle(e){e.stopPropagation();const{itemId:t,open:a}=e.detail;let s;s="exclusive"===this.mode?a?[t]:[]:a?[...this.internalValue,t]:this.internalValue.filter((e=>e!==t)),this.isControlled()||(this.internalValue=s,this.syncItems()),this.accordionChange.emit({value:"exclusive"===this.mode?s.length>0?s[0]:null:s})}normalizeValue(e){return null==e?[]:Array.isArray(e)?"exclusive"===this.mode?e.slice(0,1):e:[e]}syncItems(){this.el.querySelectorAll("af-accordion-item").forEach((e=>{e.itemId&&(e.open=this.internalValue.includes(e.itemId))}))}render(){return s(i,{key:"2d84a14e0db5c7f1ab90d343196fdb5456a2de89",class:{["mode-"+this.mode]:!0}},s("div",{key:"773361b5629da5b3942f7686c1efc4ee89461b61",class:"accordion"},s("slot",{key:"e88462c8d101d071b8bcfc6be975dd553a13af30"})))}get el(){return this}static get watchers(){return{value:[{handleValueChange:0}]}}static get style(){return".sc-af-accordion-h{display:block;width:100%}.accordion.sc-af-accordion{display:flex;flex-direction:column;width:100%}.sc-af-accordion-s>af-accordion-item{display:block}.sc-af-accordion-s>af-accordion-item:last-child{--accordion-item-border:transparent}"}},[262,"af-accordion",{mode:[1],value:[1025],defaultValue:[1,"default-value"],internalValue:[32]},[[0,"af-accordion-toggle","handleItemToggle"]],{value:[{handleValueChange:0}]}]),n=o,d=function(){"undefined"!=typeof customElements&&["af-accordion"].forEach((e=>{"af-accordion"===e&&(customElements.get(c(e))||customElements.define(c(e),o))}))};export{n as AfAccordion,d as defineCustomElement}
+import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-BBpihWJI.js';
+
+const afAccordionCss = ".sc-af-accordion-h{display:block;width:100%}.accordion.sc-af-accordion{display:flex;flex-direction:column;width:100%}.sc-af-accordion-s>af-accordion-item{display:block}.sc-af-accordion-s>af-accordion-item:last-child{--accordion-item-border:transparent}";
+
+const AfAccordion$1 = /*@__PURE__*/ proxyCustomElement(class AfAccordion extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.accordionChange = createEvent(this, "af-accordion-change");
+        /**
+         * Behavior mode for the accordion.
+         * - `independent`: Multiple items can be open simultaneously
+         * - `exclusive`: Only one item can be open at a time
+         */
+        this.mode = 'independent';
+        this.internalValue = [];
+    }
+    isControlled() {
+        return this.value !== undefined;
+    }
+    componentWillLoad() {
+        // Initialize internal value from defaultValue or value
+        const initialValue = this.isControlled() ? this.value : this.defaultValue;
+        this.internalValue = this.normalizeValue(initialValue);
+    }
+    handleValueChange(newValue) {
+        if (this.isControlled()) {
+            this.internalValue = this.normalizeValue(newValue);
+            this.syncItems();
+        }
+    }
+    componentDidLoad() {
+        this.syncItems();
+    }
+    /**
+     * Listen for toggle events from child accordion items
+     */
+    handleItemToggle(event) {
+        event.stopPropagation();
+        const { itemId, open } = event.detail;
+        let newValue;
+        if (this.mode === 'exclusive') {
+            // In exclusive mode, only one item can be open
+            newValue = open ? [itemId] : [];
+        }
+        else {
+            // In independent mode, toggle the item
+            if (open) {
+                newValue = [...this.internalValue, itemId];
+            }
+            else {
+                newValue = this.internalValue.filter(id => id !== itemId);
+            }
+        }
+        if (!this.isControlled()) {
+            this.internalValue = newValue;
+            this.syncItems();
+        }
+        // Emit change event
+        const emitValue = this.mode === 'exclusive'
+            ? (newValue.length > 0 ? newValue[0] : null)
+            : newValue;
+        this.accordionChange.emit({ value: emitValue });
+    }
+    /**
+     * Normalize value prop to array format for internal use
+     */
+    normalizeValue(value) {
+        if (value === undefined || value === null) {
+            return [];
+        }
+        if (Array.isArray(value)) {
+            // In exclusive mode, only keep the first item
+            return this.mode === 'exclusive' ? value.slice(0, 1) : value;
+        }
+        return [value];
+    }
+    /**
+     * Sync the open state of all child accordion items
+     */
+    syncItems() {
+        const items = this.el.querySelectorAll('af-accordion-item');
+        items.forEach((element) => {
+            const item = element;
+            if (item.itemId) {
+                item.open = this.internalValue.includes(item.itemId);
+            }
+        });
+    }
+    render() {
+        return (h(Host, { key: 'e0060977dd938771a54e2941a962a58bf18b61dd', class: { [`mode-${this.mode}`]: true } }, h("div", { key: 'dacacd23dc6f116bb8c856161d1a956c0fc7d70d', class: "accordion" }, h("slot", { key: '1dcc400fc416c79f0ac1cf48893de03c46e31741' }))));
+    }
+    get el() { return this; }
+    static get watchers() { return {
+        "value": ["handleValueChange"]
+    }; }
+    static get style() { return afAccordionCss; }
+}, [262, "af-accordion", {
+        "mode": [1],
+        "value": [1025],
+        "defaultValue": [1, "default-value"],
+        "internalValue": [32]
+    }, [[0, "af-accordion-toggle", "handleItemToggle"]], {
+        "value": ["handleValueChange"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["af-accordion"];
+    components.forEach(tagName => { switch (tagName) {
+        case "af-accordion":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, AfAccordion$1);
+            }
+            break;
+    } });
+}
+
+const AfAccordion = AfAccordion$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { AfAccordion, defineCustomElement };
+//# sourceMappingURL=af-accordion.js.map
+
+//# sourceMappingURL=af-accordion.js.map

package/dist/components/af-accordion.js.map

@@ -0,0 +1 @@
+{"file":"af-accordion.js","mappings":"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","names":["AfAccordion","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-accordion/af-accordion.css?tag=af-accordion&encapsulation=scoped","src/components/af-accordion/af-accordion.tsx"],"sourcesContent":[":host {\n  display: block;\n  width: 100%;\n}\n\n.accordion {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n}\n\n/* Ensure proper stacking for accordion items */\n::slotted(af-accordion-item) {\n  display: block;\n}\n\n/* Remove bottom border from last item */\n::slotted(af-accordion-item:last-child) {\n  --accordion-item-border: transparent;\n}\n\n","import { Component, h, Prop, Host, Event, EventEmitter, Element, State, Watch, Listen } from '@stencil/core';\n\n/**\n * Accordion container that manages multiple accordion items.\n * Controls which items are open based on mode (independent or exclusive).\n * \n * @slot - Place af-accordion-item components here\n */\n@Component({\n  tag: 'af-accordion',\n  styleUrl: 'af-accordion.css',\n  shadow: false,\n  scoped: true,\n})\nexport class AfAccordion {\n  @Element() el!: HTMLElement;\n\n  /**\n   * Behavior mode for the accordion.\n   * - `independent`: Multiple items can be open simultaneously\n   * - `exclusive`: Only one item can be open at a time\n   */\n  @Prop() mode: 'independent' | 'exclusive' = 'independent';\n\n  /**\n   * Currently open item(s) for controlled mode.\n   * In independent mode, can be an array of item IDs.\n   * In exclusive mode, should be a single item ID or null.\n   */\n  @Prop({ mutable: true }) value?: string | string[];\n\n  /**\n   * Default open item(s) for uncontrolled mode.\n   * Used as initial state when value prop is not provided.\n   */\n  @Prop() defaultValue?: string | string[];\n\n  /**\n   * Emitted when the open state of items changes.\n   * Returns the new value (string[] for independent, string | null for exclusive).\n   */\n  @Event({ eventName: 'af-accordion-change' }) accordionChange!: EventEmitter<{ value: string | string[] | null }>;\n\n  @State() internalValue: string[] = [];\n\n  private isControlled(): boolean {\n    return this.value !== undefined;\n  }\n\n  componentWillLoad() {\n    // Initialize internal value from defaultValue or value\n    const initialValue = this.isControlled() ? this.value : this.defaultValue;\n    this.internalValue = this.normalizeValue(initialValue);\n  }\n\n  @Watch('value')\n  handleValueChange(newValue: string | string[] | undefined) {\n    if (this.isControlled()) {\n      this.internalValue = this.normalizeValue(newValue);\n      this.syncItems();\n    }\n  }\n\n  componentDidLoad() {\n    this.syncItems();\n  }\n\n  /**\n   * Listen for toggle events from child accordion items\n   */\n  @Listen('af-accordion-toggle')\n  handleItemToggle(event: CustomEvent<{ itemId: string; open: boolean }>) {\n    event.stopPropagation();\n    const { itemId, open } = event.detail;\n\n    let newValue: string[];\n\n    if (this.mode === 'exclusive') {\n      // In exclusive mode, only one item can be open\n      newValue = open ? [itemId] : [];\n    } else {\n      // In independent mode, toggle the item\n      if (open) {\n        newValue = [...this.internalValue, itemId];\n      } else {\n        newValue = this.internalValue.filter(id => id !== itemId);\n      }\n    }\n\n    if (!this.isControlled()) {\n      this.internalValue = newValue;\n      this.syncItems();\n    }\n\n    // Emit change event\n    const emitValue = this.mode === 'exclusive' \n      ? (newValue.length > 0 ? newValue[0] : null)\n      : newValue;\n    this.accordionChange.emit({ value: emitValue });\n  }\n\n  /**\n   * Normalize value prop to array format for internal use\n   */\n  private normalizeValue(value: string | string[] | undefined): string[] {\n    if (value === undefined || value === null) {\n      return [];\n    }\n    if (Array.isArray(value)) {\n      // In exclusive mode, only keep the first item\n      return this.mode === 'exclusive' ? value.slice(0, 1) : value;\n    }\n    return [value];\n  }\n\n  /**\n   * Sync the open state of all child accordion items\n   */\n  private syncItems() {\n    const items = this.el.querySelectorAll('af-accordion-item');\n    items.forEach((element) => {\n      const item = element as HTMLElement & { itemId?: string; open?: boolean };\n      if (item.itemId) {\n        item.open = this.internalValue.includes(item.itemId);\n      }\n    });\n  }\n\n  render() {\n    return (\n      <Host class={{ [`mode-${this.mode}`]: true }}>\n        <div class=\"accordion\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n\n"],"version":3}

package/dist/components/af-aspect-ratio.js

@@ -1 +1,9 @@
-import{A as o,d as r}from"./p-0KrQFK77.js";const s=o,p=r;export{s as AfAspectRatio,p as defineCustomElement}
+import { A as AfAspectRatio$1, d as defineCustomElement$1 } from './p-BjJS1_8G.js';
+
+const AfAspectRatio = AfAspectRatio$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { AfAspectRatio, defineCustomElement };
+//# sourceMappingURL=af-aspect-ratio.js.map
+
+//# sourceMappingURL=af-aspect-ratio.js.map

package/dist/components/af-aspect-ratio.js.map

@@ -0,0 +1 @@
+{"file":"af-aspect-ratio.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/af-button-group.js

@@ -1 +1,9 @@
-import{A as o,d as s}from"./p--UJ_xE9Z.js";const p=o,r=s;export{p as AfButtonGroup,r as defineCustomElement}
+import { A as AfButtonGroup$1, d as defineCustomElement$1 } from './p-D4YzNoal.js';
+
+const AfButtonGroup = AfButtonGroup$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { AfButtonGroup, defineCustomElement };
+//# sourceMappingURL=af-button-group.js.map
+
+//# sourceMappingURL=af-button-group.js.map

package/dist/components/af-button-group.js.map

@@ -0,0 +1 @@
+{"file":"af-button-group.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/af-button.js

@@ -1 +1,9 @@
-import{A as o,d as s}from"./p-wM1k9Wi7.js";const p=o,r=s;export{p as AfButton,r as defineCustomElement}
+import { A as AfButton$1, d as defineCustomElement$1 } from './p-CyTj19Yy.js';
+
+const AfButton = AfButton$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { AfButton, defineCustomElement };
+//# sourceMappingURL=af-button.js.map
+
+//# sourceMappingURL=af-button.js.map

package/dist/components/af-button.js.map

@@ -0,0 +1 @@
+{"file":"af-button.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/af-card.js

@@ -1 +1,9 @@
-import{A as o,d as s}from"./p-BAJW_4SY.js";const p=o,r=s;export{p as AfCard,r as defineCustomElement}
+import { A as AfCard$1, d as defineCustomElement$1 } from './p-BxwCXPuv.js';
+
+const AfCard = AfCard$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { AfCard, defineCustomElement };
+//# sourceMappingURL=af-card.js.map
+
+//# sourceMappingURL=af-card.js.map

package/dist/components/af-card.js.map

@@ -0,0 +1 @@
+{"file":"af-card.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/af-center.js

@@ -1 +1,66 @@
-import{p as e,H as t,h as s,c as i,t as n}from"./p-DsNqeD3z.js";const c=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.axis="both",this.inline=!1}render(){const e={display:this.inline?"inline-flex":"flex"};return"horizontal"!==this.axis&&"both"!==this.axis||(e.justifyContent="center"),"vertical"!==this.axis&&"both"!==this.axis||(e.alignItems="center"),this.minHeight&&(e.minHeight=this.minHeight),s(i,{key:"d5155950c8c486ac95b394c8604e1b868becb524",style:e},s("slot",{key:"e53b6eeda1351177681e57bca66b6c508e445a43"}))}static get style(){return":host{display:flex;box-sizing:border-box}:host([hidden]){display:none}"}},[257,"af-center",{axis:[1],inline:[4],minHeight:[1,"min-height"]}]),o=c,h=function(){"undefined"!=typeof customElements&&["af-center"].forEach((e=>{"af-center"===e&&(customElements.get(n(e))||customElements.define(n(e),c))}))};export{o as AfCenter,h as defineCustomElement}
+import { p as proxyCustomElement, H, h, c as Host } from './p-BBpihWJI.js';
+
+const afCenterCss = ":host{display:flex;box-sizing:border-box}:host([hidden]){display:none}";
+
+const AfCenter$1 = /*@__PURE__*/ proxyCustomElement(class AfCenter extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        /**
+         * Which axis to center on.
+         * - 'horizontal': Center horizontally (justify-content: center)
+         * - 'vertical': Center vertically (align-items: center)
+         * - 'both': Center on both axes
+         */
+        this.axis = 'both';
+        /**
+         * Use inline-flex instead of flex.
+         * Useful when the center container should only take up as much space as needed.
+         */
+        this.inline = false;
+    }
+    render() {
+        const style = {
+            display: this.inline ? 'inline-flex' : 'flex',
+        };
+        if (this.axis === 'horizontal' || this.axis === 'both') {
+            style.justifyContent = 'center';
+        }
+        if (this.axis === 'vertical' || this.axis === 'both') {
+            style.alignItems = 'center';
+        }
+        if (this.minHeight) {
+            style.minHeight = this.minHeight;
+        }
+        return (h(Host, { key: 'fc1bcaef9b11c0c5f69e9ef95d58adf61b4f244a', style: style }, h("slot", { key: '09dc75e0a80760d56e370ad0b52231f4143549e8' })));
+    }
+    static get style() { return afCenterCss; }
+}, [257, "af-center", {
+        "axis": [1],
+        "inline": [4],
+        "minHeight": [1, "min-height"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["af-center"];
+    components.forEach(tagName => { switch (tagName) {
+        case "af-center":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, AfCenter$1);
+            }
+            break;
+    } });
+}
+
+const AfCenter = AfCenter$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { AfCenter, defineCustomElement };
+//# sourceMappingURL=af-center.js.map
+
+//# sourceMappingURL=af-center.js.map

package/dist/components/af-center.js.map

@@ -0,0 +1 @@
+{"file":"af-center.js","mappings":";;AAAA,MAAM,WAAW,GAAG,wEAAwE;;MCe/EA,UAAQ,iBAAAC,kBAAA,CAAA,MAAA,QAAA,SAAAC,CAAA,CAAA;AALrB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAME;;;;;AAKG;AACK,QAAA,IAAI,CAAA,IAAA,GAAS,MAAM;AAE3B;;;AAGG;AACK,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;AA+BhC;IAvBC,MAAM,GAAA;AACJ,QAAA,MAAM,KAAK,GAA2B;YACpC,OAAO,EAAE,IAAI,CAAC,MAAM,GAAG,aAAa,GAAG,MAAM;SAC9C;AAED,QAAA,IAAI,IAAI,CAAC,IAAI,KAAK,YAAY,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,EAAE;AACtD,YAAA,KAAK,CAAC,cAAc,GAAG,QAAQ;;AAGjC,QAAA,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,EAAE;AACpD,YAAA,KAAK,CAAC,UAAU,GAAG,QAAQ;;AAG7B,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAClB,YAAA,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS;;QAGlC,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,KAAK,EAAA,EAChB,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["AfCenter","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-center/af-center.css?tag=af-center&encapsulation=shadow","src/components/af-center/af-center.tsx"],"sourcesContent":[":host {\n  display: flex;\n  box-sizing: border-box;\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n","import { Component, h, Host, Prop } from '@stencil/core';\n\ntype Axis = 'horizontal' | 'vertical' | 'both';\n\n/**\n * Center layout component for quickly centering content.\n * Supports horizontal, vertical, or both axes.\n *\n * @slot - Content to center\n */\n@Component({\n  tag: 'af-center',\n  styleUrl: 'af-center.css',\n  shadow: true,\n})\nexport class AfCenter {\n  /**\n   * Which axis to center on.\n   * - 'horizontal': Center horizontally (justify-content: center)\n   * - 'vertical': Center vertically (align-items: center)\n   * - 'both': Center on both axes\n   */\n  @Prop() axis: Axis = 'both';\n\n  /**\n   * Use inline-flex instead of flex.\n   * Useful when the center container should only take up as much space as needed.\n   */\n  @Prop() inline: boolean = false;\n\n  /**\n   * Set a minimum height. Useful for vertical centering in a viewport.\n   * Accepts any valid CSS value (e.g., '100vh', '400px').\n   */\n  @Prop() minHeight?: string;\n\n  render() {\n    const style: Record<string, string> = {\n      display: this.inline ? 'inline-flex' : 'flex',\n    };\n\n    if (this.axis === 'horizontal' || this.axis === 'both') {\n      style.justifyContent = 'center';\n    }\n\n    if (this.axis === 'vertical' || this.axis === 'both') {\n      style.alignItems = 'center';\n    }\n\n    if (this.minHeight) {\n      style.minHeight = this.minHeight;\n    }\n\n    return (\n      <Host style={style}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\n"],"version":3}

package/dist/components/af-checkbox.js

@@ -1 +1,9 @@
-import{A as o,d as s}from"./p-BCCbAFc1.js";const p=o,r=s;export{p as AfCheckbox,r as defineCustomElement}
+import { A as AfCheckbox$1, d as defineCustomElement$1 } from './p-DREa7k5l.js';
+
+const AfCheckbox = AfCheckbox$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { AfCheckbox, defineCustomElement };
+//# sourceMappingURL=af-checkbox.js.map
+
+//# sourceMappingURL=af-checkbox.js.map

package/dist/components/af-checkbox.js.map

@@ -0,0 +1 @@
+{"file":"af-checkbox.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}