@affinda/wc 0.0.1 → 0.0.3

package/dist/collection/components/af-logo/af-logo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"af-logo.js","sourceRoot":"","sources":["../../../src/components/af-logo/af-logo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD;;GAEG;AAMH,MAAM,OAAO,MAAM;IACjB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DACE,KAAK,EAAC,KAAK,EACX,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,YAAY,EACpB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,UAAU;gBAEhB,6DACE,CAAC,EAAC,ikBAAikB,EACnkB,IAAI,EAAC,cAAc,GACnB;gBACF,6DACE,CAAC,EAAC,mcAAmc,EACrc,IAAI,EAAC,cAAc,GACnB;gBACF,6DACE,CAAC,EAAC,+cAA+c,EACjd,IAAI,EAAC,cAAc,GACnB;gBACF,6DACE,CAAC,EAAC,4SAA4S,EAC9S,IAAI,EAAC,cAAc,GACnB;gBACF,uEAAa,aAAa;oBACxB,6DACE,CAAC,EAAC,8PAA8P,EAChQ,IAAI,EAAC,cAAc,GACnB,CACA;gBACJ;oBACE,iEAAU,EAAE,EAAC,OAAO;wBAClB,6DAAM,IAAI,EAAC,MAAM,EAAC,CAAC,EAAC,kBAAkB,GAAG,CAChC,CACN,CACH,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host } from '@stencil/core';\n\n/**\n * Affinda logo component\n */\n@Component({\n  tag: 'af-logo',\n  styleUrl: 'af-logo.css',\n  shadow: true\n})\nexport class AfLogo {\n  render() {\n    return (\n      <Host>\n        <svg\n          width=\"141\"\n          height=\"22\"\n          viewBox=\"0 0 141 22\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          class=\"logo-svg\"\n        >\n          <path\n            d=\"M20.8 9.6c0-1.5-.4-2.7-1.1-3.7-.8-1-1.8-1.5-3.2-1.5-1.3 0-2.4.5-3.2 1.5-.7 1-1.1 2.2-1.1 3.7 0 1.5.4 2.7 1.1 3.7.8 1 1.9 1.5 3.2 1.5 1.4 0 2.5-.5 3.2-1.5.7-1 1.1-2.2 1.1-3.7zm4.2 0c0 2.4-.7 4.4-2 5.9-1.4 1.5-3.2 2.3-5.5 2.3-2.2 0-4-.8-5.4-2.3-1.4-1.5-2.1-3.5-2.1-5.9 0-2.4.7-4.4 2.1-5.9C13.5 2.2 15.3 1.4 17.5 1.4c2.3 0 4.1.8 5.5 2.3 1.3 1.5 2 3.5 2 5.9zM29.1 17.5h-4.2V4.7h4.2v12.8zm0-14.9h-4.2V.2h4.2v2.4zM43.3 17.5h-4.2v-1.5c-.7 1.2-1.9 1.8-3.7 1.8-1.3 0-2.4-.4-3.2-1.2-.8-.8-1.2-2-1.2-3.5V4.7h4.2v8.1c0 1.7.7 2.5 2 2.5.7 0 1.3-.2 1.7-.7.4-.4.6-1.1.6-1.9V4.7h4.2v12.8h-.4z\"\n            fill=\"currentColor\"\n          />\n          <path\n            d=\"M56.9 17.5h-4.2v-1.5c-.7 1.2-1.9 1.8-3.7 1.8-1.3 0-2.4-.4-3.2-1.2-.8-.8-1.2-2-1.2-3.5V4.7h4.2v8.1c0 1.7.7 2.5 2 2.5.7 0 1.3-.2 1.7-.7.4-.4.6-1.1.6-1.9V4.7h4.2v12.8h-.4zM68.3 5.9c-.7-.4-1.5-.6-2.4-.6-1.2 0-2.2.4-2.9 1.2-.8.8-1.1 1.9-1.1 3.3 0 1.4.4 2.5 1.1 3.3.8.8 1.7 1.2 2.9 1.2.9 0 1.7-.2 2.4-.6v3.5c-.9.3-1.9.5-2.9.5-2.3 0-4.2-.7-5.6-2.2-1.4-1.5-2.1-3.4-2.1-5.8 0-1.5.3-2.9.9-4.1.6-1.2 1.5-2.2 2.6-2.8 1.1-.7 2.4-1 3.8-1 1.1 0 2.1.2 3.1.6l.2 3.5z\"\n            fill=\"currentColor\"\n          />\n          <path\n            d=\"M80 4.7h4.2v1.6c.7-1.2 1.9-1.9 3.6-1.9 1.3 0 2.3.4 3.1 1.2.8.8 1.2 2 1.2 3.5v8.4h-4.2V9.4c0-1.7-.7-2.5-2-2.5-.7 0-1.2.2-1.6.7-.4.4-.6 1.1-.6 1.9v8h-4.2V4.7h.5zM105.3 17.5h-4.2v-1.1c-.8 1-2 1.5-3.6 1.5-1.4 0-2.6-.5-3.5-1.4-.9-.9-1.4-2.1-1.4-3.6V9.6c0-1.5.5-2.7 1.4-3.6.9-.9 2.1-1.4 3.5-1.4 1.6 0 2.8.5 3.6 1.5V.2h4.2v17.3zm-4.2-7.9c0-.8-.3-1.5-.8-2-.5-.5-1.2-.8-2-.8-.8 0-1.5.3-2 .8-.5.5-.8 1.2-.8 2 0 .8.3 1.5.8 2 .5.5 1.2.8 2 .8.8 0 1.5-.3 2-.8.5-.5.8-1.2.8-2z\"\n            fill=\"currentColor\"\n          />\n          <path\n            d=\"M115.8 17.5h-4.2V4.7h4.2v1.1c.8-1 2-1.5 3.6-1.5 1.4 0 2.6.5 3.5 1.4.9.9 1.4 2.1 1.4 3.6v3.3c0 1.5-.5 2.7-1.4 3.6-.9.9-2.1 1.4-3.5 1.4-1.6 0-2.8-.5-3.6-1.5v1.4zm4.2-7.9c0-.8-.3-1.5-.8-2-.5-.5-1.2-.8-2-.8-.8 0-1.5.3-2 .8-.5.5-.8 1.2-.8 2 0 .8.3 1.5.8 2 .5.5 1.2.8 2 .8.8 0 1.5-.3 2-.8.5-.5.8-1.2.8-2z\"\n            fill=\"currentColor\"\n          />\n          <g clip-path=\"url(#clip0)\">\n            <path\n              d=\"M4.9 9.6c0-1.5-.4-2.7-1.1-3.7C3 4.9 2 4.4.6 4.4c-.3 0-.6 0-.9.1v10.2c.3.1.6.1.9.1 1.4 0 2.5-.5 3.2-1.5.7-1 1.1-2.2 1.1-3.7zM9.1 9.6c0 2.4-.7 4.4-2 5.9-1.4 1.5-3.2 2.3-5.5 2.3-.7 0-1.4-.1-2.1-.2V.2C.2.1.9 0 1.6 0c2.3 0 4.1.8 5.5 2.3 1.3 1.5 2 3.5 2 5.3z\"\n              fill=\"currentColor\"\n            />\n          </g>\n          <defs>\n            <clipPath id=\"clip0\">\n              <path fill=\"#fff\" d=\"M0 0h9.1v17.8H0z\" />\n            </clipPath>\n          </defs>\n        </svg>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/af-nav-item/af-nav-item.css

@@ -0,0 +1,146 @@
+:host {
+  display: inline-block;
+}
+
+.nav-link {
+  text-decoration: none;
+  color: inherit;
+  display: block;
+}
+
+.nav-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  box-sizing: border-box;
+  cursor: pointer;
+}
+
+/* Primary hierarchy - bold main navigation */
+.hierarchy-primary {
+  padding: 12px;
+  justify-content: center;
+}
+
+.hierarchy-primary .label-container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 24px;
+  gap: 10px;
+}
+
+/* Primary variant 01 - darker */
+.hierarchy-primary.variant-01 {
+  font-family: 'NeuSans', 'Inter', system-ui, sans-serif;
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 20px;
+  color: #14343b;
+}
+
+/* Primary variant 02 - lighter for light backgrounds */
+.hierarchy-primary.variant-02 {
+  font-family: 'NeuSans', 'Inter', system-ui, sans-serif;
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 20px;
+  color: #14343b;
+}
+
+/* Hover state for primary variant-01 (dark backgrounds) - underline */
+.hierarchy-primary.variant-01:hover .label-container {
+  border-bottom: 1px solid currentColor;
+}
+
+/* Active state for primary variant-01 - thicker border */
+.hierarchy-primary.variant-01.active .label-container {
+  border-bottom: 2px solid #8a7049;
+}
+
+/* Hover and active states for variant-02 (light backgrounds) - no border */
+.hierarchy-primary.variant-02:hover {
+  background-color: rgba(20, 52, 59, 0.04);
+  border-radius: 8px;
+}
+
+.hierarchy-primary.variant-02.active {
+  background-color: rgba(20, 52, 59, 0.08);
+  border-radius: 8px;
+}
+
+/* Secondary hierarchy - smaller sub-navigation */
+.hierarchy-secondary {
+  padding: 4px 0;
+}
+
+.hierarchy-secondary .label-container {
+  display: flex;
+  align-items: center;
+  flex: 1;
+  min-height: 24px;
+  gap: 8px;
+}
+
+/* Secondary variant 01 - medium weight */
+.hierarchy-secondary.variant-01 {
+  font-family: 'NeuSans', 'Inter', system-ui, sans-serif;
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 20px;
+  color: #14343b;
+}
+
+/* Secondary variant 02 - regular weight */
+.hierarchy-secondary.variant-02 {
+  font-family: 'NeuSans', 'Inter', system-ui, sans-serif;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 20px;
+  color: #2b484f;
+}
+
+/* Hover state for secondary - underline text */
+.hierarchy-secondary:hover ::slotted(*) {
+  text-decoration: underline;
+}
+
+/* Mobile styles */
+@media (max-width: 767px) {
+  .hierarchy-primary {
+    padding: 20px 12px;
+    border-bottom: 1px solid #e8eeed;
+    width: 100%;
+  }
+
+  .hierarchy-primary .label-container {
+    flex: 1;
+    justify-content: flex-start;
+  }
+
+  .hierarchy-primary.variant-01 {
+    font-size: 20px;
+    line-height: 1.1;
+    letter-spacing: -0.4px;
+  }
+
+  .hierarchy-primary.variant-02 {
+    font-size: 20px;
+    line-height: 1.1;
+    letter-spacing: -0.4px;
+    color: #60767b;
+  }
+}
+
+/* Icon sizing */
+::slotted([slot="icon-left"]),
+::slotted([slot="icon-right"]) {
+  width: 24px;
+  height: 24px;
+  flex-shrink: 0;
+}
+
+.hierarchy-secondary ::slotted([slot="icon-right"]) {
+  width: 20px;
+  height: 20px;
+}

package/dist/collection/components/af-nav-item/af-nav-item.js

@@ -0,0 +1,134 @@
+import { h, Host } from "@stencil/core";
+/**
+ * A generic navigation item component that can be used in navigation bars, menus, and sidebars.
+ * Supports multiple hierarchy levels, variants, and states (active, hover).
+ */
+export class AfNavItem {
+    constructor() {
+        /**
+         * Visual hierarchy level of the navigation item
+         * - 'primary': Bold, main navigation (larger text, prominent styling)
+         * - 'secondary': Lighter, sub-navigation (smaller text, subtle styling)
+         */
+        this.hierarchy = 'primary';
+        /**
+         * Visual variant within the hierarchy level
+         * - '01': Darker/more prominent styling
+         * - '02': Lighter/more subtle styling
+         */
+        this.variant = '01';
+        /**
+         * Whether this nav item is currently active/selected
+         */
+        this.active = false;
+    }
+    render() {
+        const classes = {
+            'nav-item': true,
+            [`hierarchy-${this.hierarchy}`]: true,
+            [`variant-${this.variant}`]: true,
+            'active': this.active
+        };
+        const content = (h("div", { class: classes }, h("slot", { name: "icon-left" }), h("div", { class: "label-container" }, h("slot", null)), h("slot", { name: "icon-right" })));
+        if (this.href) {
+            return (h(Host, null, h("a", { href: this.href, class: "nav-link" }, content)));
+        }
+        return h(Host, null, content);
+    }
+    static get is() { return "af-nav-item"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["af-nav-item.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["af-nav-item.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "hierarchy": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'primary' | 'secondary'",
+                    "resolved": "\"primary\" | \"secondary\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Visual hierarchy level of the navigation item\n- 'primary': Bold, main navigation (larger text, prominent styling)\n- 'secondary': Lighter, sub-navigation (smaller text, subtle styling)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "hierarchy",
+                "defaultValue": "'primary'"
+            },
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'01' | '02'",
+                    "resolved": "\"01\" | \"02\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Visual variant within the hierarchy level\n- '01': Darker/more prominent styling\n- '02': Lighter/more subtle styling"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "variant",
+                "defaultValue": "'01'"
+            },
+            "href": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "URL to navigate to when clicked"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "href"
+            },
+            "active": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether this nav item is currently active/selected"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "active",
+                "defaultValue": "false"
+            }
+        };
+    }
+}
+//# sourceMappingURL=af-nav-item.js.map

package/dist/collection/components/af-nav-item/af-nav-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"af-nav-item.js","sourceRoot":"","sources":["../../../src/components/af-nav-item/af-nav-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;GAGG;AAMH,MAAM,OAAO,SAAS;IALtB;QAME;;;;WAIG;QACK,cAAS,GAA4B,SAAS,CAAC;QAEvD;;;;WAIG;QACK,YAAO,GAAgB,IAAI,CAAC;QAOpC;;WAEG;QACK,WAAM,GAAY,KAAK,CAAC;KAgCjC;IA9BC,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,UAAU,EAAE,IAAI;YAChB,CAAC,aAAa,IAAI,CAAC,SAAS,EAAE,CAAC,EAAE,IAAI;YACrC,CAAC,WAAW,IAAI,CAAC,OAAO,EAAE,CAAC,EAAE,IAAI;YACjC,QAAQ,EAAE,IAAI,CAAC,MAAM;SACtB,CAAC;QAEF,MAAM,OAAO,GAAG,CACd,WAAK,KAAK,EAAE,OAAO;YACjB,YAAM,IAAI,EAAC,WAAW,GAAQ;YAC9B,WAAK,KAAK,EAAC,iBAAiB;gBAC1B,eAAa,CACT;YACN,YAAM,IAAI,EAAC,YAAY,GAAQ,CAC3B,CACP,CAAC;QAEF,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,OAAO,CACL,EAAC,IAAI;gBACH,SAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,UAAU,IACjC,OAAO,CACN,CACC,CACR,CAAC;QACJ,CAAC;QAED,OAAO,EAAC,IAAI,QAAE,OAAO,CAAQ,CAAC;IAChC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Host } from '@stencil/core';\n\n/**\n * A generic navigation item component that can be used in navigation bars, menus, and sidebars.\n * Supports multiple hierarchy levels, variants, and states (active, hover).\n */\n@Component({\n  tag: 'af-nav-item',\n  styleUrl: 'af-nav-item.css',\n  shadow: true\n})\nexport class AfNavItem {\n  /**\n   * Visual hierarchy level of the navigation item\n   * - 'primary': Bold, main navigation (larger text, prominent styling)\n   * - 'secondary': Lighter, sub-navigation (smaller text, subtle styling)\n   */\n  @Prop() hierarchy: 'primary' | 'secondary' = 'primary';\n\n  /**\n   * Visual variant within the hierarchy level\n   * - '01': Darker/more prominent styling\n   * - '02': Lighter/more subtle styling\n   */\n  @Prop() variant: '01' | '02' = '01';\n\n  /**\n   * URL to navigate to when clicked\n   */\n  @Prop() href?: string;\n\n  /**\n   * Whether this nav item is currently active/selected\n   */\n  @Prop() active: boolean = false;\n\n  render() {\n    const classes = {\n      'nav-item': true,\n      [`hierarchy-${this.hierarchy}`]: true,\n      [`variant-${this.variant}`]: true,\n      'active': this.active\n    };\n\n    const content = (\n      <div class={classes}>\n        <slot name=\"icon-left\"></slot>\n        <div class=\"label-container\">\n          <slot></slot>\n        </div>\n        <slot name=\"icon-right\"></slot>\n      </div>\n    );\n\n    if (this.href) {\n      return (\n        <Host>\n          <a href={this.href} class=\"nav-link\">\n            {content}\n          </a>\n        </Host>\n      );\n    }\n\n    return <Host>{content}</Host>;\n  }\n}\n"]}

package/dist/collection/components/af-navbar/af-navbar.css

@@ -0,0 +1,119 @@
+:host {
+  display: block;
+  width: 100%;
+}
+
+.navbar-container {
+  padding: 32px 80px 0;
+  box-sizing: border-box;
+}
+
+.navbar {
+  background: #E8F1EF;
+  border: 1px solid rgba(0, 0, 0, 0.12);
+  border-radius: 9999px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 8px 8px 40px;
+  box-sizing: border-box;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+}
+
+/* Left section */
+.navbar-left {
+  display: flex;
+  align-items: center;
+  gap: 32px;
+}
+
+.logo {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+}
+
+.nav-links {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+/* Right section */
+.navbar-right {
+  display: flex;
+  align-items: center;
+  gap: 20px;
+}
+
+.nav-actions {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.nav-button {
+  display: flex;
+  align-items: center;
+}
+
+/* Tablet adjustments */
+@media (max-width: 1024px) {
+  .navbar-container {
+    padding: 24px 40px 0;
+  }
+
+  .navbar-left {
+    gap: 24px;
+  }
+
+  .nav-links {
+    gap: 4px;
+  }
+}
+
+/* Mobile adjustments */
+@media (max-width: 767px) {
+  .navbar-container {
+    padding: 16px 16px 0;
+  }
+
+  .navbar {
+    padding: 8px 16px;
+    flex-direction: column;
+    border-radius: 16px;
+    gap: 16px;
+  }
+
+  .navbar-left {
+    width: 100%;
+    flex-direction: column;
+    gap: 16px;
+    align-items: flex-start;
+  }
+
+  .nav-links {
+    width: 100%;
+    flex-direction: column;
+    align-items: stretch;
+    gap: 0;
+  }
+
+  .navbar-right {
+    width: 100%;
+    flex-direction: column;
+    gap: 12px;
+    align-items: stretch;
+  }
+
+  .nav-actions {
+    width: 100%;
+    flex-direction: column;
+    align-items: stretch;
+    gap: 0;
+  }
+
+  .nav-button {
+    width: 100%;
+  }
+}

package/dist/collection/components/af-navbar/af-navbar.js

@@ -0,0 +1,23 @@
+import { h, Host } from "@stencil/core";
+/**
+ * A full-width navigation bar component that provides the main site navigation.
+ * Features a pill-shaped container with logo, navigation links, and action buttons.
+ */
+export class AfNavbar {
+    render() {
+        return (h(Host, { key: 'a66b7e6939aebec67d26604dea422ec2e64fe6bd' }, h("nav", { key: '54064edc20beeafacafd2b43b25bfa9fc6e0e362', class: "navbar-container" }, h("div", { key: '2020a0761f646c0a13cc604605d3b9d5b1625278', class: "navbar" }, h("div", { key: '6038de1eba48a2bedf7e689bb65521406fc6b8b1', class: "navbar-left" }, h("div", { key: '63f31053e7d3d1402f2a1e88a4ae2171f9e00d4f', class: "logo" }, h("slot", { key: 'bf73abaf20be9cfcaa6328fe8ac224d109944bef', name: "logo" })), h("div", { key: 'c9cc09537d26c55d319f08c4622b17248f6ffba4', class: "nav-links" }, h("slot", { key: '5c2d8df163e2fd9967492d39522df1e11dfcd977', name: "links" }))), h("div", { key: '45265b4d765ad52a33f81efa80e9daa910948e1c', class: "navbar-right" }, h("div", { key: '48c913dd3d8fa17ee7eb2e9a41f9493929cd7af0', class: "nav-actions" }, h("slot", { key: 'cbfecec0a3b95935f707a4bbded5ce8aae0e9270', name: "actions" })), h("div", { key: 'e8cd7adf6f5a537b9a2552b467f6671f312ab0c1', class: "nav-button" }, h("slot", { key: '9dd578f3d67b32642cc6fbd49a5f3736e55c04f1', name: "button" })))))));
+    }
+    static get is() { return "af-navbar"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["af-navbar.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["af-navbar.css"]
+        };
+    }
+}
+//# sourceMappingURL=af-navbar.js.map

package/dist/collection/components/af-navbar/af-navbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"af-navbar.js","sourceRoot":"","sources":["../../../src/components/af-navbar/af-navbar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD;;;GAGG;AAMH,MAAM,OAAO,QAAQ;IACnB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,kBAAkB;gBAC3B,4DAAK,KAAK,EAAC,QAAQ;oBAEjB,4DAAK,KAAK,EAAC,aAAa;wBACtB,4DAAK,KAAK,EAAC,MAAM;4BACf,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB;wBACN,4DAAK,KAAK,EAAC,WAAW;4BACpB,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACtB,CACF;oBAGN,4DAAK,KAAK,EAAC,cAAc;wBACvB,4DAAK,KAAK,EAAC,aAAa;4BACtB,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACxB;wBACN,4DAAK,KAAK,EAAC,YAAY;4BACrB,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,CACF,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host } from '@stencil/core';\n\n/**\n * A full-width navigation bar component that provides the main site navigation.\n * Features a pill-shaped container with logo, navigation links, and action buttons.\n */\n@Component({\n  tag: 'af-navbar',\n  styleUrl: 'af-navbar.css',\n  shadow: true\n})\nexport class AfNavbar {\n  render() {\n    return (\n      <Host>\n        <nav class=\"navbar-container\">\n          <div class=\"navbar\">\n            {/* Left section: Logo + Nav Links */}\n            <div class=\"navbar-left\">\n              <div class=\"logo\">\n                <slot name=\"logo\"></slot>\n              </div>\n              <div class=\"nav-links\">\n                <slot name=\"links\"></slot>\n              </div>\n            </div>\n\n            {/* Right section: Actions + Button */}\n            <div class=\"navbar-right\">\n              <div class=\"nav-actions\">\n                <slot name=\"actions\"></slot>\n              </div>\n              <div class=\"nav-button\">\n                <slot name=\"button\"></slot>\n              </div>\n            </div>\n          </div>\n        </nav>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/af-text/af-text.css

@@ -0,0 +1,61 @@
+:host {
+  display: block;
+}
+
+.text {
+  margin: 0;
+  padding: 0;
+  font-family: 'Helvetica', 'Inter', 'Segoe UI', system-ui, sans-serif;
+  font-weight: 400;
+  color: #14343b;
+  letter-spacing: 0;
+}
+
+/* Alignment */
+.align-left {
+  text-align: left;
+}
+
+.align-center {
+  text-align: center;
+}
+
+.align-right {
+  text-align: right;
+}
+
+/* Body variants */
+.variant-xlarge {
+  font-size: 22px;
+  line-height: 28px;
+}
+
+.variant-large {
+  font-size: 18px;
+  line-height: 26px;
+}
+
+.variant-medium {
+  font-size: 16px;
+  line-height: 24px;
+}
+
+.variant-small {
+  font-size: 14px;
+  line-height: 20px;
+}
+
+/* Label variants - use NeuSans Book */
+.variant-label-button {
+  font-family: 'NeuSans', 'Inter', 'Segoe UI', system-ui, sans-serif;
+  font-weight: 500;
+  font-size: 17px;
+  line-height: 20px;
+}
+
+.variant-label-tag {
+  font-family: 'NeuSans', 'Inter', 'Segoe UI', system-ui, sans-serif;
+  font-weight: 500;
+  font-size: 14px;
+  line-height: 1;
+}

package/dist/collection/components/af-text/af-text.js

@@ -0,0 +1,96 @@
+import { h } from "@stencil/core";
+export class AfText {
+    constructor() {
+        /** Text variant */
+        this.variant = 'medium';
+        /** Visual alignment */
+        this.align = 'left';
+        /** Semantic element to render */
+        this.as = 'p';
+    }
+    render() {
+        const Tag = this.as;
+        return (h(Tag, { key: '778a86a185f2416dec867ca2457acb2fe1ad4bcb', class: {
+                'text': true,
+                [`variant-${this.variant}`]: true,
+                [`align-${this.align}`]: true
+            }, part: "base" }, h("slot", { key: '2b3ee364c989ca8d233583946e24665df0192fb9' })));
+    }
+    static get is() { return "af-text"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["af-text.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["af-text.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'xlarge' | 'large' | 'medium' | 'small' | 'label-button' | 'label-tag'",
+                    "resolved": "\"label-button\" | \"label-tag\" | \"large\" | \"medium\" | \"small\" | \"xlarge\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Text variant"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "variant",
+                "defaultValue": "'medium'"
+            },
+            "align": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'left' | 'center' | 'right'",
+                    "resolved": "\"center\" | \"left\" | \"right\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Visual alignment"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "align",
+                "defaultValue": "'left'"
+            },
+            "as": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'p' | 'span' | 'div' | 'label'",
+                    "resolved": "\"div\" | \"label\" | \"p\" | \"span\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Semantic element to render"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "as",
+                "defaultValue": "'p'"
+            }
+        };
+    }
+}
+//# sourceMappingURL=af-text.js.map

package/dist/collection/components/af-text/af-text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"af-text.js","sourceRoot":"","sources":["../../../src/components/af-text/af-text.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,MAAM;IALnB;QAME,mBAAmB;QACX,YAAO,GAA2E,QAAQ,CAAC;QAEnG,uBAAuB;QACf,UAAK,GAAgC,MAAM,CAAC;QAEpD,iCAAiC;QACzB,OAAE,GAAmC,GAAG,CAAC;KAkBlD;IAhBC,MAAM;QACJ,MAAM,GAAG,GAAG,IAAI,CAAC,EAAS,CAAC;QAE3B,OAAO,CACL,EAAC,GAAG,qDACF,KAAK,EAAE;gBACL,MAAM,EAAE,IAAI;gBACZ,CAAC,WAAW,IAAI,CAAC,OAAO,EAAE,CAAC,EAAE,IAAI;gBACjC,CAAC,SAAS,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI;aAC9B,EACD,IAAI,EAAC,MAAM;YAEX,8DAAQ,CACJ,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'af-text',\n  styleUrl: 'af-text.css',\n  shadow: true\n})\nexport class AfText {\n  /** Text variant */\n  @Prop() variant: 'xlarge' | 'large' | 'medium' | 'small' | 'label-button' | 'label-tag' = 'medium';\n\n  /** Visual alignment */\n  @Prop() align: 'left' | 'center' | 'right' = 'left';\n\n  /** Semantic element to render */\n  @Prop() as: 'p' | 'span' | 'div' | 'label' = 'p';\n\n  render() {\n    const Tag = this.as as any;\n\n    return (\n      <Tag\n        class={{\n          'text': true,\n          [`variant-${this.variant}`]: true,\n          [`align-${this.align}`]: true\n        }}\n        part=\"base\"\n      >\n        <slot />\n      </Tag>\n    );\n  }\n}\n"]}