@affinda/wc 0.0.4 → 0.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/affinda/af-card.entry.esm.js.map +1 -0
- package/dist/affinda/af-heading.af-logo.af-nav-item.af-navbar.af-text.entry.esm.js.map +1 -1
- package/dist/affinda/affinda.esm.js +1 -1
- package/dist/affinda/index.esm.js +1 -1
- package/dist/affinda/{p-69f5573e.entry.js → p-47629246.entry.js} +2 -2
- package/dist/affinda/p-92f5a5d5.entry.js +2 -0
- package/dist/affinda/p-92f5a5d5.entry.js.map +1 -0
- package/dist/affinda/{p-56c51fc1.entry.js → p-9c22948a.entry.js} +2 -2
- package/dist/affinda/p-Dmaq2rkg.js +3 -0
- package/dist/affinda/p-Dmaq2rkg.js.map +1 -0
- package/dist/affinda/p-a8d223ca.entry.js +2 -0
- package/dist/affinda/p-a8d223ca.entry.js.map +1 -0
- package/dist/affinda/{p-b67961a7.entry.js → p-b79f976e.entry.js} +2 -2
- package/dist/affinda/{p-aad67518.entry.js → p-bf697823.entry.js} +2 -2
- package/dist/affinda/{p-68da436b.entry.js → p-cb218d26.entry.js} +2 -2
- package/dist/affinda/{p-3bfcd11c.entry.js → p-d33de48f.entry.js} +2 -2
- package/dist/affinda/{p-9d8b122c.entry.js → p-f8d89fb6.entry.js} +2 -2
- package/dist/cjs/af-aspect-ratio.cjs.entry.js +1 -1
- package/dist/cjs/af-button-group.cjs.entry.js +2 -2
- package/dist/cjs/af-button.cjs.entry.js +1 -1
- package/dist/cjs/af-card.cjs.entry.js +24 -0
- package/dist/cjs/af-card.entry.cjs.js.map +1 -0
- package/dist/cjs/af-color-swatch.cjs.entry.js +1 -1
- package/dist/cjs/af-container.cjs.entry.js +1 -1
- package/dist/cjs/af-heading.af-logo.af-nav-item.af-navbar.af-text.entry.cjs.js.map +1 -1
- package/dist/cjs/af-heading_5.cjs.entry.js +8 -8
- package/dist/cjs/af-icon-button.cjs.entry.js +1 -1
- package/dist/cjs/af-typography-lockup.cjs.entry.js +2 -2
- package/dist/cjs/affinda.cjs.js +2 -2
- package/dist/cjs/{index-D97w1U4L.js → index-1GcSSOS3.js} +387 -34
- package/dist/cjs/index-1GcSSOS3.js.map +1 -0
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/collection/collection-manifest.json +2 -1
- package/dist/collection/components/af-button-group/af-button-group.js +1 -1
- package/dist/collection/components/af-card/af-card.css +99 -0
- package/dist/collection/components/af-card/af-card.js +89 -0
- package/dist/collection/components/af-card/af-card.js.map +1 -0
- package/dist/collection/components/af-heading/af-heading.css +1 -1
- package/dist/collection/components/af-logo/af-logo.css +3 -3
- package/dist/collection/components/af-logo/af-logo.js +1 -1
- package/dist/collection/components/af-logo/af-logo.js.map +1 -1
- package/dist/collection/components/af-nav-item/af-nav-item.css +6 -6
- package/dist/collection/components/af-navbar/af-navbar.css +8 -4
- package/dist/collection/components/af-navbar/af-navbar.js +1 -1
- package/dist/collection/components/af-navbar/af-navbar.js.map +1 -1
- package/dist/collection/components/af-text/af-text.css +1 -1
- package/dist/collection/components/af-typography-lockup/af-typography-lockup.js +1 -1
- package/dist/components/af-aspect-ratio.js +1 -1
- package/dist/components/af-button-group.js +1 -1
- package/dist/components/af-button.js +1 -1
- package/dist/components/af-card.d.ts +11 -0
- package/dist/components/af-card.js +47 -0
- package/dist/components/af-card.js.map +1 -0
- package/dist/components/af-color-swatch.js +1 -1
- package/dist/components/af-container.js +1 -1
- package/dist/components/af-heading.js +1 -1
- package/dist/components/af-icon-button.js +1 -1
- package/dist/components/af-logo.js +1 -1
- package/dist/components/af-nav-item.js +1 -1
- package/dist/components/af-navbar.js +1 -1
- package/dist/components/af-text.js +1 -1
- package/dist/components/af-typography-lockup.js +1 -1
- package/dist/components/index.js +13 -13
- package/dist/components/p-BHNNF4PT.js +35 -0
- package/dist/components/p-BHNNF4PT.js.map +1 -0
- package/dist/components/{p-BwsohoSw.js → p-BpGDzCRf.js} +4 -4
- package/dist/components/p-BpGDzCRf.js.map +1 -0
- package/dist/components/{p-DSESDq7v.js → p-C6idwlD-.js} +3 -3
- package/dist/components/{p-DSESDq7v.js.map → p-C6idwlD-.js.map} +1 -1
- package/dist/components/{p-DgZl7pFQ.js → p-CJWIieDU.js} +4 -4
- package/dist/components/p-CJWIieDU.js.map +1 -0
- package/dist/components/{p-Cpc8P-ou.js → p-CRgPNvxI.js} +3 -3
- package/dist/components/{p-Cpc8P-ou.js.map → p-CRgPNvxI.js.map} +1 -1
- package/dist/components/p-CaqzUz5o.js +35 -0
- package/dist/components/p-CaqzUz5o.js.map +1 -0
- package/dist/components/{p-5LmA06cB.js → p-Cjv046iG.js} +4 -4
- package/dist/components/{p-5LmA06cB.js.map → p-Cjv046iG.js.map} +1 -1
- package/dist/components/{p-S40-XegF.js → p-DIyOg-i_.js} +4 -4
- package/dist/components/p-DIyOg-i_.js.map +1 -0
- package/dist/components/{p-CwHzsQvO.js → p-DSAo7rhE.js} +3 -3
- package/dist/components/{p-CwHzsQvO.js.map → p-DSAo7rhE.js.map} +1 -1
- package/dist/components/{p-D7g9FtMr.js → p-DuXQZGjc.js} +4 -4
- package/dist/components/{p-D7g9FtMr.js.map → p-DuXQZGjc.js.map} +1 -1
- package/dist/components/{p-D1Yr2lLq.js → p-Dw33Xm_t.js} +3 -3
- package/dist/components/{p-D1Yr2lLq.js.map → p-Dw33Xm_t.js.map} +1 -1
- package/dist/components/{p-BvU8ETOD.js → p-cKSy1B8M.js} +3 -3
- package/dist/components/{p-BvU8ETOD.js.map → p-cKSy1B8M.js.map} +1 -1
- package/dist/components/{p-BphH2zpz.js → p-zwrcq-N2.js} +392 -34
- package/dist/components/p-zwrcq-N2.js.map +1 -0
- package/dist/esm/af-aspect-ratio.entry.js +1 -1
- package/dist/esm/af-button-group.entry.js +2 -2
- package/dist/esm/af-button.entry.js +1 -1
- package/dist/esm/af-card.entry.js +22 -0
- package/dist/esm/af-card.entry.js.map +1 -0
- package/dist/esm/af-color-swatch.entry.js +1 -1
- package/dist/esm/af-container.entry.js +1 -1
- package/dist/esm/af-heading.af-logo.af-nav-item.af-navbar.af-text.entry.js.map +1 -1
- package/dist/esm/af-heading_5.entry.js +8 -8
- package/dist/esm/af-icon-button.entry.js +1 -1
- package/dist/esm/af-typography-lockup.entry.js +2 -2
- package/dist/esm/affinda.js +3 -3
- package/dist/esm/{index-BaBXdMMc.js → index-Dmaq2rkg.js} +387 -34
- package/dist/esm/index-Dmaq2rkg.js.map +1 -0
- package/dist/esm/index.js +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/types/components/af-card/af-card.d.ts +15 -0
- package/dist/types/components.d.ts +39 -0
- package/package.json +2 -2
- package/dist/affinda/p-BaBXdMMc.js +0 -3
- package/dist/affinda/p-BaBXdMMc.js.map +0 -1
- package/dist/affinda/p-f7d87013.entry.js +0 -2
- package/dist/affinda/p-f7d87013.entry.js.map +0 -1
- package/dist/cjs/index-D97w1U4L.js.map +0 -1
- package/dist/components/p-BphH2zpz.js.map +0 -1
- package/dist/components/p-BwsohoSw.js.map +0 -1
- package/dist/components/p-CULmtqPG.js +0 -35
- package/dist/components/p-CULmtqPG.js.map +0 -1
- package/dist/components/p-DgZl7pFQ.js.map +0 -1
- package/dist/components/p-KunaKXcK.js +0 -35
- package/dist/components/p-KunaKXcK.js.map +0 -1
- package/dist/components/p-S40-XegF.js.map +0 -1
- package/dist/esm/index-BaBXdMMc.js.map +0 -1
- /package/dist/affinda/{p-69f5573e.entry.js.map → p-47629246.entry.js.map} +0 -0
- /package/dist/affinda/{p-56c51fc1.entry.js.map → p-9c22948a.entry.js.map} +0 -0
- /package/dist/affinda/{p-b67961a7.entry.js.map → p-b79f976e.entry.js.map} +0 -0
- /package/dist/affinda/{p-aad67518.entry.js.map → p-bf697823.entry.js.map} +0 -0
- /package/dist/affinda/{p-68da436b.entry.js.map → p-cb218d26.entry.js.map} +0 -0
- /package/dist/affinda/{p-3bfcd11c.entry.js.map → p-d33de48f.entry.js.map} +0 -0
- /package/dist/affinda/{p-9d8b122c.entry.js.map → p-f8d89fb6.entry.js.map} +0 -0
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, h, c as Host } from './p-BphH2zpz.js';
|
|
2
|
-
|
|
3
|
-
const afNavbarCss = ":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)}.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}.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}@media (max-width: 1024px){.navbar-container{padding:24px 40px 0}.navbar-left{gap:24px}.nav-links{gap:4px}}@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%}}";
|
|
4
|
-
|
|
5
|
-
const AfNavbar = /*@__PURE__*/ proxyCustomElement(class AfNavbar extends H {
|
|
6
|
-
constructor(registerHost) {
|
|
7
|
-
super();
|
|
8
|
-
if (registerHost !== false) {
|
|
9
|
-
this.__registerHost();
|
|
10
|
-
}
|
|
11
|
-
this.__attachShadow();
|
|
12
|
-
}
|
|
13
|
-
render() {
|
|
14
|
-
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" })))))));
|
|
15
|
-
}
|
|
16
|
-
static get style() { return afNavbarCss; }
|
|
17
|
-
}, [257, "af-navbar"]);
|
|
18
|
-
function defineCustomElement() {
|
|
19
|
-
if (typeof customElements === "undefined") {
|
|
20
|
-
return;
|
|
21
|
-
}
|
|
22
|
-
const components = ["af-navbar"];
|
|
23
|
-
components.forEach(tagName => { switch (tagName) {
|
|
24
|
-
case "af-navbar":
|
|
25
|
-
if (!customElements.get(tagName)) {
|
|
26
|
-
customElements.define(tagName, AfNavbar);
|
|
27
|
-
}
|
|
28
|
-
break;
|
|
29
|
-
} });
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
export { AfNavbar as A, defineCustomElement as d };
|
|
33
|
-
//# sourceMappingURL=p-CULmtqPG.js.map
|
|
34
|
-
|
|
35
|
-
//# sourceMappingURL=p-CULmtqPG.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"p-CULmtqPG.js","mappings":";;AAAA,MAAM,WAAW,GAAG,orCAAorC;;MCW3rC,QAAQ,iBAAAA,kBAAA,CAAA,MAAA,QAAA,SAAAC,CAAA,CAAA;;;;;;;;IACnB,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,kBAAkB,EAAA,EAC3B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,QAAQ,EAAA,EAEjB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,aAAa,EAAA,EACtB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,MAAM,EAAA,EACf,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,MAAM,EAAA,CAAQ,CACrB,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,WAAW,EAAA,EACpB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,OAAO,EAAA,CAAQ,CACtB,CACF,EAGN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,cAAc,EAAA,EACvB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,aAAa,EAAA,EACtB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,SAAS,EAAA,CAAQ,CACxB,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACrB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAQ,CAAA,CACvB,CACF,CACF,CACF,CACD;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-navbar/af-navbar.css?tag=af-navbar&encapsulation=shadow","src/components/af-navbar/af-navbar.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n}\n\n.navbar-container {\n padding: 32px 80px 0;\n box-sizing: border-box;\n}\n\n.navbar {\n background: #E8F1EF;\n border: 1px solid rgba(0, 0, 0, 0.12);\n border-radius: 9999px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 8px 8px 8px 40px;\n box-sizing: border-box;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);\n}\n\n/* Left section */\n.navbar-left {\n display: flex;\n align-items: center;\n gap: 32px;\n}\n\n.logo {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n.nav-links {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n/* Right section */\n.navbar-right {\n display: flex;\n align-items: center;\n gap: 20px;\n}\n\n.nav-actions {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.nav-button {\n display: flex;\n align-items: center;\n}\n\n/* Tablet adjustments */\n@media (max-width: 1024px) {\n .navbar-container {\n padding: 24px 40px 0;\n }\n\n .navbar-left {\n gap: 24px;\n }\n\n .nav-links {\n gap: 4px;\n }\n}\n\n/* Mobile adjustments */\n@media (max-width: 767px) {\n .navbar-container {\n padding: 16px 16px 0;\n }\n\n .navbar {\n padding: 8px 16px;\n flex-direction: column;\n border-radius: 16px;\n gap: 16px;\n }\n\n .navbar-left {\n width: 100%;\n flex-direction: column;\n gap: 16px;\n align-items: flex-start;\n }\n\n .nav-links {\n width: 100%;\n flex-direction: column;\n align-items: stretch;\n gap: 0;\n }\n\n .navbar-right {\n width: 100%;\n flex-direction: column;\n gap: 12px;\n align-items: stretch;\n }\n\n .nav-actions {\n width: 100%;\n flex-direction: column;\n align-items: stretch;\n gap: 0;\n }\n\n .nav-button {\n width: 100%;\n }\n}\n","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"],"version":3}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"p-DgZl7pFQ.js","mappings":";;AAAA,MAAM,YAAY,GAAG,i/DAAi/D;;MCWz/D,SAAS,iBAAAA,kBAAA,CAAA,MAAA,SAAA,SAAAC,CAAA,CAAA;AALtB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAME;;;;AAIG;AACK,QAAA,IAAS,CAAA,SAAA,GAA4B,SAAS;AAEtD;;;;AAIG;AACK,QAAA,IAAO,CAAA,OAAA,GAAgB,IAAI;AAOnC;;AAEG;AACK,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;AAgChC;IA9BC,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,UAAU,EAAE,IAAI;AAChB,YAAA,CAAC,aAAa,IAAI,CAAC,SAAS,CAAE,CAAA,GAAG,IAAI;AACrC,YAAA,CAAC,WAAW,IAAI,CAAC,OAAO,CAAE,CAAA,GAAG,IAAI;YACjC,QAAQ,EAAE,IAAI,CAAC;SAChB;QAED,MAAM,OAAO,IACX,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,OAAO,EAAA,EACjB,CAAM,CAAA,MAAA,EAAA,EAAA,IAAI,EAAC,WAAW,EAAQ,CAAA,EAC9B,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAC1B,CAAA,CAAA,MAAA,EAAA,IAAA,CAAa,CACT,EACN,CAAA,CAAA,MAAA,EAAA,EAAM,IAAI,EAAC,YAAY,EAAQ,CAAA,CAC3B,CACP;AAED,QAAA,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,QACE,EAAC,IAAI,EAAA,IAAA,EACH,CAAA,CAAA,GAAA,EAAA,EAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,UAAU,EACjC,EAAA,OAAO,CACN,CACC;;QAIX,OAAO,CAAC,CAAA,IAAI,EAAE,IAAA,EAAA,OAAO,CAAQ;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-nav-item/af-nav-item.css?tag=af-nav-item&encapsulation=shadow","src/components/af-nav-item/af-nav-item.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n\n.nav-link {\n text-decoration: none;\n color: inherit;\n display: block;\n}\n\n.nav-item {\n display: flex;\n align-items: center;\n gap: 8px;\n box-sizing: border-box;\n cursor: pointer;\n}\n\n/* Primary hierarchy - bold main navigation */\n.hierarchy-primary {\n padding: 12px;\n justify-content: center;\n}\n\n.hierarchy-primary .label-container {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 24px;\n gap: 10px;\n}\n\n/* Primary variant 01 - darker */\n.hierarchy-primary.variant-01 {\n font-family: 'NeuSans', 'Inter', system-ui, sans-serif;\n font-size: 16px;\n font-weight: 500;\n line-height: 20px;\n color: #14343b;\n}\n\n/* Primary variant 02 - lighter for light backgrounds */\n.hierarchy-primary.variant-02 {\n font-family: 'NeuSans', 'Inter', system-ui, sans-serif;\n font-size: 16px;\n font-weight: 500;\n line-height: 20px;\n color: #14343b;\n}\n\n/* Hover state for primary variant-01 (dark backgrounds) - underline */\n.hierarchy-primary.variant-01:hover .label-container {\n border-bottom: 1px solid currentColor;\n}\n\n/* Active state for primary variant-01 - thicker border */\n.hierarchy-primary.variant-01.active .label-container {\n border-bottom: 2px solid #8a7049;\n}\n\n/* Hover and active states for variant-02 (light backgrounds) - no border */\n.hierarchy-primary.variant-02:hover {\n background-color: rgba(20, 52, 59, 0.04);\n border-radius: 8px;\n}\n\n.hierarchy-primary.variant-02.active {\n background-color: rgba(20, 52, 59, 0.08);\n border-radius: 8px;\n}\n\n/* Secondary hierarchy - smaller sub-navigation */\n.hierarchy-secondary {\n padding: 4px 0;\n}\n\n.hierarchy-secondary .label-container {\n display: flex;\n align-items: center;\n flex: 1;\n min-height: 24px;\n gap: 8px;\n}\n\n/* Secondary variant 01 - medium weight */\n.hierarchy-secondary.variant-01 {\n font-family: 'NeuSans', 'Inter', system-ui, sans-serif;\n font-size: 14px;\n font-weight: 500;\n line-height: 20px;\n color: #14343b;\n}\n\n/* Secondary variant 02 - regular weight */\n.hierarchy-secondary.variant-02 {\n font-family: 'NeuSans', 'Inter', system-ui, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 20px;\n color: #2b484f;\n}\n\n/* Hover state for secondary - underline text */\n.hierarchy-secondary:hover ::slotted(*) {\n text-decoration: underline;\n}\n\n/* Mobile styles */\n@media (max-width: 767px) {\n .hierarchy-primary {\n padding: 20px 12px;\n border-bottom: 1px solid #e8eeed;\n width: 100%;\n }\n\n .hierarchy-primary .label-container {\n flex: 1;\n justify-content: flex-start;\n }\n\n .hierarchy-primary.variant-01 {\n font-size: 20px;\n line-height: 1.1;\n letter-spacing: -0.4px;\n }\n\n .hierarchy-primary.variant-02 {\n font-size: 20px;\n line-height: 1.1;\n letter-spacing: -0.4px;\n color: #60767b;\n }\n}\n\n/* Icon sizing */\n::slotted([slot=\"icon-left\"]),\n::slotted([slot=\"icon-right\"]) {\n width: 24px;\n height: 24px;\n flex-shrink: 0;\n}\n\n.hierarchy-secondary ::slotted([slot=\"icon-right\"]) {\n width: 20px;\n height: 20px;\n}\n","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"],"version":3}
|
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, h, c as Host } from './p-BphH2zpz.js';
|
|
2
|
-
|
|
3
|
-
const afLogoCss = ":host{display:inline-block;color:#14343b}.logo-svg{display:block;height:22px;width:auto}";
|
|
4
|
-
|
|
5
|
-
const AfLogo = /*@__PURE__*/ proxyCustomElement(class AfLogo extends H {
|
|
6
|
-
constructor(registerHost) {
|
|
7
|
-
super();
|
|
8
|
-
if (registerHost !== false) {
|
|
9
|
-
this.__registerHost();
|
|
10
|
-
}
|
|
11
|
-
this.__attachShadow();
|
|
12
|
-
}
|
|
13
|
-
render() {
|
|
14
|
-
return (h(Host, { key: '8a33b73d7a60054dde8a04327d94d78763552549' }, h("svg", { key: '7195b06d8ab5a335e70a1e7310fd753cb3887599', width: "141", height: "22", viewBox: "0 0 141 22", fill: "none", xmlns: "http://www.w3.org/2000/svg", class: "logo-svg" }, h("path", { key: '5bb4bb2f7f6063928c3cfc7938b85291e70bec27', 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", fill: "currentColor" }), h("path", { key: '7a5a7e54b69475ad6f9d1ddf240e668708a06ff2', 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", fill: "currentColor" }), h("path", { key: '29ba5bc9bc4fc8068d77dd092f6fbf2dccc2caa2', 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", fill: "currentColor" }), h("path", { key: 'd528008c06633218db38e63f0605874f703d3165', 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", fill: "currentColor" }), h("g", { key: 'e3c341f6286afc34b918924fe1ce7d147adcb09a', "clip-path": "url(#clip0)" }, h("path", { key: '1d8c3fbc8995e2017357ceaab53ffd66970fe017', 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", fill: "currentColor" })), h("defs", { key: 'b10859520274b6db85b3192b314f2a2bc6b41da7' }, h("clipPath", { key: '8834e78ed619077f26809a22f7130f6941f2ef5f', id: "clip0" }, h("path", { key: '5a01632b2fb3c6a6d630afaefc6489cb879f5116', fill: "#fff", d: "M0 0h9.1v17.8H0z" }))))));
|
|
15
|
-
}
|
|
16
|
-
static get style() { return afLogoCss; }
|
|
17
|
-
}, [257, "af-logo"]);
|
|
18
|
-
function defineCustomElement() {
|
|
19
|
-
if (typeof customElements === "undefined") {
|
|
20
|
-
return;
|
|
21
|
-
}
|
|
22
|
-
const components = ["af-logo"];
|
|
23
|
-
components.forEach(tagName => { switch (tagName) {
|
|
24
|
-
case "af-logo":
|
|
25
|
-
if (!customElements.get(tagName)) {
|
|
26
|
-
customElements.define(tagName, AfLogo);
|
|
27
|
-
}
|
|
28
|
-
break;
|
|
29
|
-
} });
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
export { AfLogo as A, defineCustomElement as d };
|
|
33
|
-
//# sourceMappingURL=p-KunaKXcK.js.map
|
|
34
|
-
|
|
35
|
-
//# sourceMappingURL=p-KunaKXcK.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"p-KunaKXcK.js","mappings":";;AAAA,MAAM,SAAS,GAAG,0FAA0F;;MCU/F,MAAM,iBAAAA,kBAAA,CAAA,MAAA,MAAA,SAAAC,CAAA,CAAA;;;;;;;;IACjB,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,KAAK,EACX,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,YAAY,EACpB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,UAAU,EAAA,EAEhB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,CAAC,EAAC,ikBAAikB,EACnkB,IAAI,EAAC,cAAc,EACnB,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,CAAC,EAAC,mcAAmc,EACrc,IAAI,EAAC,cAAc,EACnB,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,CAAC,EAAC,+cAA+c,EACjd,IAAI,EAAC,cAAc,EACnB,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,CAAC,EAAC,4SAA4S,EAC9S,IAAI,EAAC,cAAc,EACnB,CAAA,EACF,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAA,EAAa,aAAa,EAAA,EACxB,CACE,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAC,EAAC,8PAA8P,EAChQ,IAAI,EAAC,cAAc,GACnB,CACA,EACJ,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACE,CAAU,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAC,OAAO,EAAA,EAClB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,MAAM,EAAC,CAAC,EAAC,kBAAkB,EAAA,CAAG,CAChC,CACN,CACH,CACD;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-logo/af-logo.css?tag=af-logo&encapsulation=shadow","src/components/af-logo/af-logo.tsx"],"sourcesContent":[":host {\n display: inline-block;\n color: #14343b;\n}\n\n.logo-svg {\n display: block;\n height: 22px;\n width: auto;\n}\n","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"],"version":3}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"p-S40-XegF.js","mappings":";;AAAA,MAAM,YAAY,GAAG,+zBAA+zB;;MCOv0B,SAAS,iBAAAA,kBAAA,CAAA,MAAA,SAAA,SAAAC,CAAA,CAAA;AALtB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;AAOU,QAAA,IAAK,CAAA,KAAA,GAAuC,GAAG;;AAG/C,QAAA,IAAK,CAAA,KAAA,GAAgC,MAAM;AA+BpD;IA7BS,aAAa,GAAA;;AAEnB,QAAA,MAAM,MAAM,GAA2B;AACrC,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,GAAG,EAAE,IAAI;AACT,YAAA,GAAG,EAAE,IAAI;AACT,YAAA,GAAG,EAAE,IAAI;AACT,YAAA,GAAG,EAAE,IAAI;AACT,YAAA,GAAG,EAAE;SACN;QACD,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI;;IAGnC,MAAM,GAAA;AACJ,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,aAAa,EAAS;QAEvC,QACE,CAAA,CAAC,GAAG,EAAA,EAAA,GAAA,EAAA,0CAAA,EACF,KAAK,EAAE;AACL,gBAAA,SAAS,EAAE,IAAI;AACf,gBAAA,CAAC,SAAS,IAAI,CAAC,KAAK,CAAE,CAAA,GAAG,IAAI;AAC7B,gBAAA,CAAC,SAAS,IAAI,CAAC,KAAK,CAAE,CAAA,GAAG;AAC1B,aAAA,EACD,IAAI,EAAC,MAAM,EAAA,EAEX,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACJ;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-heading/af-heading.css?tag=af-heading&encapsulation=shadow","src/components/af-heading/af-heading.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.heading {\n margin: 0;\n padding: 0;\n font-family: 'NeuSans', 'Inter', 'Segoe UI', system-ui, sans-serif;\n font-weight: 500;\n color: #14343b;\n letter-spacing: -0.02em;\n}\n\n/* Alignment */\n.align-left {\n text-align: left;\n}\n\n.align-center {\n text-align: center;\n}\n\n.align-right {\n text-align: right;\n}\n\n/* Heading XL */\n.level-xl {\n font-size: 50px;\n line-height: 1;\n}\n\n@media (min-width: 768px) {\n .level-xl {\n font-size: 80px;\n }\n}\n\n/* Heading 1 */\n.level-1 {\n font-size: 38px;\n line-height: 1;\n}\n\n@media (min-width: 768px) {\n .level-1 {\n font-size: 56px;\n }\n}\n\n/* Heading 2 */\n.level-2 {\n font-size: 32px;\n line-height: 1;\n}\n\n@media (min-width: 768px) {\n .level-2 {\n font-size: 44px;\n }\n}\n\n/* Heading 3 */\n.level-3 {\n font-size: 25px;\n line-height: 1;\n}\n\n@media (min-width: 768px) {\n .level-3 {\n font-size: 34px;\n }\n}\n\n/* Heading 4 */\n.level-4 {\n font-size: 20px;\n line-height: 1.1;\n}\n\n@media (min-width: 768px) {\n .level-4 {\n font-size: 24px;\n line-height: 1.2;\n }\n}\n\n/* Heading 5 */\n.level-5 {\n font-size: 18px;\n line-height: 1.1;\n}\n\n@media (min-width: 768px) {\n .level-5 {\n font-size: 20px;\n line-height: 1.2;\n }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'af-heading',\n styleUrl: 'af-heading.css',\n shadow: true\n})\nexport class AfHeading {\n /** Heading level */\n @Prop() level: 'xl' | '1' | '2' | '3' | '4' | '5' = '1';\n\n /** Visual alignment */\n @Prop() align: 'left' | 'center' | 'right' = 'left';\n\n private getHeadingTag() {\n // Map display levels to semantic HTML tags\n const tagMap: Record<string, string> = {\n 'xl': 'h1',\n '1': 'h1',\n '2': 'h2',\n '3': 'h3',\n '4': 'h4',\n '5': 'h5'\n };\n return tagMap[this.level] || 'h1';\n }\n\n render() {\n const Tag = this.getHeadingTag() as any;\n\n return (\n <Tag\n class={{\n 'heading': true,\n [`level-${this.level}`]: true,\n [`align-${this.align}`]: true\n }}\n part=\"base\"\n >\n <slot />\n </Tag>\n );\n }\n}\n"],"version":3}
|