@shibui-ui/ui 1.20.0 → 1.21.0

package/dist/index362.js

@@ -1,38 +1,133 @@
-import { _$LH as j } from "./index358.js";
-/**
- * @license
- * Copyright 2020 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const { I: t } = j, i = (o) => o, s = () => document.createComment(""), v = (o, n, e) => {
+import { html, nothing } from "lit";
+function renderHamburger(ctx) {
+  const isLight = ["classic", "centered", "mega", "minimal", "shrink"].includes(ctx.variant);
+  const color = isLight ? "var(--color-washi-600, #7A6A5C)" : "rgba(250,247,244,0.5)";
+  return html`
+    <button
+      class="hdr-burger"
+      aria-label="${ctx._mobileOpen ? "Cerrar menú" : "Abrir menú"}"
+      aria-expanded="${ctx._mobileOpen}"
+      aria-controls="hdr-mobile-drawer"
+      @click="${() => ctx._toggleMobile()}"
+    >
+      <svg width="20" height="14" viewBox="0 0 20 14" fill="none"
+        stroke="${color}" stroke-width="1.6" stroke-linecap="round">
+        <line class="hdr-burger-top" x1="0" y1="1"  x2="20" y2="1"/>
+        <line class="hdr-burger-mid" x1="0" y1="7"  x2="20" y2="7"/>
+        <line class="hdr-burger-bot" x1="0" y1="13" x2="20" y2="13"/>
+      </svg>
+    </button>`;
+}
+function renderMobileDrawer(ctx) {
   var _a;
-  const l = o._$AA.parentNode, d = void 0 === n ? o._$AB : n._$AA;
-  if (void 0 === e) {
-    const i2 = l.insertBefore(s(), d), n2 = l.insertBefore(s(), d);
-    e = new t(i2, n2, o, o.options);
-  } else {
-    const t2 = e._$AB.nextSibling, n2 = e._$AM, c = n2 !== o;
-    if (c) {
-      let t3;
-      (_a = e._$AQ) == null ? void 0 : _a.call(e, o), e._$AM = o, void 0 !== e._$AP && (t3 = o._$AU) !== n2._$AU && e._$AP(t3);
-    }
-    if (t2 !== d || c) {
-      let o2 = e._$AA;
-      for (; o2 !== t2; ) {
-        const t3 = i(o2).nextSibling;
-        i(l).insertBefore(o2, d), o2 = t3;
-      }
-    }
-  }
-  return e;
-}, u = (o, t2, i2 = o) => (o._$AI(t2, i2), o), m = {}, p = (o, t2 = m) => o._$AH = t2, M = (o) => o._$AH, h = (o) => {
-  o._$AR(), o._$AA.remove();
-};
+  if (!ctx._mobileOpen) return html``;
+  return html`
+    <!-- Backdrop -->
+    <div
+      class="hdr-mobile-backdrop"
+      @click="${() => ctx._closeMobile()}"
+      aria-hidden="true"
+    ></div>
+
+    <!-- Drawer panel -->
+    <nav
+      id="hdr-mobile-drawer"
+      class="hdr-mobile-drawer ${ctx._mobileOpen ? "is-open" : ""}"
+      aria-label="Menú principal"
+    >
+      <!-- Links principales -->
+      <div class="hdr-mobile-links">
+        ${(ctx.links ?? []).map((link) => {
+    var _a2, _b;
+    return html`
+          <a
+            href="${link.href ?? "#"}"
+            class="hdr-mobile-link"
+            @click="${(e) => {
+      e.preventDefault();
+      ctx._onLinkClick(link.id);
+    }}"
+          >
+            ${link.label}
+            ${((_a2 = link.dropdown) == null ? void 0 : _a2.length) ? html`
+              <svg width="8" height="5" viewBox="0 0 10 6" fill="none"
+                stroke="currentColor" stroke-width="1.5" stroke-linecap="round">
+                <polyline points="1,1 5,5 9,1"/>
+              </svg>` : nothing}
+          </a>
+
+          <!-- Sub-items — siempre visibles en móvil -->
+          ${((_b = link.dropdown) == null ? void 0 : _b.length) ? html`
+            <div class="hdr-mobile-sub">
+              ${link.dropdown.map((item) => html`
+                <a href="${item.href ?? "#"}" class="hdr-mobile-sub-link">
+                  › ${item.label}
+                </a>
+              `)}
+            </div>
+          ` : nothing}
+        `;
+  })}
+
+        <!-- Mega columns — accordion plano en móvil -->
+        ${((_a = ctx.megaColumns) == null ? void 0 : _a.length) ? html`
+          <div class="hdr-mobile-sub" style="margin-top:0;">
+            ${ctx.megaColumns.map((col) => html`
+              <p class="hdr-mobile-col-title">${col.title}</p>
+              ${col.items.map((item) => html`
+                <a href="${item.href ?? "#"}" class="hdr-mobile-sub-link">
+                  › ${item.label}
+                </a>
+              `)}
+            `)}
+          </div>
+        ` : nothing}
+      </div>
+
+      <!-- Divider -->
+      <div class="hdr-mobile-divider"></div>
+
+      <!-- Actions / CTAs -->
+      <div class="hdr-mobile-actions">
+        ${ctx.loginLabel ? html`
+          <a href="${ctx.loginHref ?? "#"}" class="hdr-mobile-login">
+            ${ctx.loginLabel}
+          </a>
+        ` : nothing}
+
+        ${(ctx.actions ?? []).map((action) => html`
+          <a
+            href="${action.href ?? "#"}"
+            class="hdr-mobile-cta"
+            @click="${(e) => {
+    e.preventDefault();
+    ctx._onActionClick(action);
+  }}"
+          >
+            ${action.label}
+          </a>
+        `)}
+
+        ${ctx.contactLabel ? html`
+          <a href="${ctx.contactHref ?? "#"}" class="hdr-mobile-login">
+            ${ctx.contactLabel} →
+          </a>
+        ` : nothing}
+      </div>
+
+      <!-- Footer del drawer -->
+      <div class="hdr-mobile-footer">
+        <span>${ctx.brandName}</span>
+        <button
+          class="hdr-mobile-close"
+          aria-label="Cerrar menú"
+          @click="${() => ctx._closeMobile()}"
+        >✕</button>
+      </div>
+    </nav>`;
+}
 export {
-  M as getCommittedValue,
-  v as insertPart,
-  h as removePart,
-  u as setChildPartValue,
-  p as setCommittedValue
+  renderHamburger,
+  renderMobileDrawer
 };
 //# sourceMappingURL=index362.js.map

package/dist/index362.js.map

@@ -1 +1 @@
-{"version":3,"file":"index362.js","sources":["../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directive-helpers.js"],"sourcesContent":["import{_$LH as o}from\"./lit-html.js\";\n/**\n * @license\n * Copyright 2020 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */const{I:t}=o,i=o=>o,n=o=>null===o||\"object\"!=typeof o&&\"function\"!=typeof o,e={HTML:1,SVG:2,MATHML:3},l=(o,t)=>void 0===t?void 0!==o?._$litType$:o?._$litType$===t,d=o=>null!=o?._$litType$?.h,c=o=>void 0!==o?._$litDirective$,f=o=>o?._$litDirective$,r=o=>void 0===o.strings,s=()=>document.createComment(\"\"),v=(o,n,e)=>{const l=o._$AA.parentNode,d=void 0===n?o._$AB:n._$AA;if(void 0===e){const i=l.insertBefore(s(),d),n=l.insertBefore(s(),d);e=new t(i,n,o,o.options)}else{const t=e._$AB.nextSibling,n=e._$AM,c=n!==o;if(c){let t;e._$AQ?.(o),e._$AM=o,void 0!==e._$AP&&(t=o._$AU)!==n._$AU&&e._$AP(t)}if(t!==d||c){let o=e._$AA;for(;o!==t;){const t=i(o).nextSibling;i(l).insertBefore(o,d),o=t}}}return e},u=(o,t,i=o)=>(o._$AI(t,i),o),m={},p=(o,t=m)=>o._$AH=t,M=o=>o._$AH,h=o=>{o._$AR(),o._$AA.remove()},j=o=>{o._$AR()};export{e as TemplateResultType,j as clearPart,M as getCommittedValue,f as getDirectiveClass,v as insertPart,d as isCompiledTemplateResult,c as isDirectiveResult,n as isPrimitive,r as isSingleExpression,l as isTemplateResult,h as removePart,u as setChildPartValue,p as setCommittedValue};\n//# sourceMappingURL=directive-helpers.js.map\n"],"names":["o","i","n","t"],"mappings":";AACA;AAAA;AAAA;AAAA;AAAA;AAIO,MAAC,EAAC,GAAE,EAAC,IAAEA,GAAE,IAAE,OAAG,GAA8P,IAAE,MAAI,SAAS,cAAc,EAAE,GAAE,IAAE,CAAC,GAAE,GAAE,MAAI;;AAAC,QAAM,IAAE,EAAE,KAAK,YAAW,IAAE,WAAS,IAAE,EAAE,OAAK,EAAE;AAAK,MAAG,WAAS,GAAE;AAAC,UAAMC,KAAE,EAAE,aAAa,EAAC,GAAG,CAAC,GAAEC,KAAE,EAAE,aAAa,EAAC,GAAG,CAAC;AAAE,QAAE,IAAI,EAAED,IAAEC,IAAE,GAAE,EAAE,OAAO;AAAA,EAAC,OAAK;AAAC,UAAMC,KAAE,EAAE,KAAK,aAAYD,KAAE,EAAE,MAAK,IAAEA,OAAI;AAAE,QAAG,GAAE;AAAC,UAAIC;AAAE,cAAE,SAAF,2BAAS,IAAG,EAAE,OAAK,GAAE,WAAS,EAAE,SAAOA,KAAE,EAAE,UAAQD,GAAE,QAAM,EAAE,KAAKC,EAAC;AAAA,IAAC;AAAC,QAAGA,OAAI,KAAG,GAAE;AAAC,UAAIH,KAAE,EAAE;AAAK,aAAKA,OAAIG,MAAG;AAAC,cAAMA,KAAE,EAAEH,EAAC,EAAE;AAAY,UAAE,CAAC,EAAE,aAAaA,IAAE,CAAC,GAAEA,KAAEG;AAAA,MAAC;AAAA,IAAC;AAAA,EAAC;AAAC,SAAO;AAAC,GAAE,IAAE,CAAC,GAAEA,IAAEF,KAAE,OAAK,EAAE,KAAKE,IAAEF,EAAC,GAAE,IAAG,IAAE,CAAA,GAAG,IAAE,CAAC,GAAEE,KAAE,MAAI,EAAE,OAAKA,IAAE,IAAE,OAAG,EAAE,MAAK,IAAE,OAAG;AAAC,IAAE,KAAI,GAAG,EAAE,KAAK;AAAQ;","x_google_ignoreList":[0]}
+{"version":3,"file":"index362.js","sources":["../src/components/molecules/header/templates/header-mobile.html.ts"],"sourcesContent":["import { html, nothing, TemplateResult } from 'lit';\nimport type { LibHeader } from '../lib-header.component';\nimport type { NavLink, DropdownItem, HeaderAction } from '../lib-header.types';\n\n/* ══════════════════════════════════════\n   HAMBURGER BUTTON\n   ══════════════════════════════════════ */\n\nexport function renderHamburger(ctx: LibHeader): TemplateResult {\n  const isLight = ['classic', 'centered', 'mega', 'minimal', 'shrink'].includes(ctx.variant);\n  const color   = isLight\n    ? 'var(--color-washi-600, #7A6A5C)'\n    : 'rgba(250,247,244,0.5)';\n\n  return html`\n    <button\n      class=\"hdr-burger\"\n      aria-label=\"${ctx._mobileOpen ? 'Cerrar menú' : 'Abrir menú'}\"\n      aria-expanded=\"${ctx._mobileOpen}\"\n      aria-controls=\"hdr-mobile-drawer\"\n      @click=\"${(): void => ctx._toggleMobile()}\"\n    >\n      <svg width=\"20\" height=\"14\" viewBox=\"0 0 20 14\" fill=\"none\"\n        stroke=\"${color}\" stroke-width=\"1.6\" stroke-linecap=\"round\">\n        <line class=\"hdr-burger-top\" x1=\"0\" y1=\"1\"  x2=\"20\" y2=\"1\"/>\n        <line class=\"hdr-burger-mid\" x1=\"0\" y1=\"7\"  x2=\"20\" y2=\"7\"/>\n        <line class=\"hdr-burger-bot\" x1=\"0\" y1=\"13\" x2=\"20\" y2=\"13\"/>\n      </svg>\n    </button>`;\n}\n\n/* ══════════════════════════════════════\n   MOBILE DRAWER\n   ══════════════════════════════════════ */\n\nexport function renderMobileDrawer(ctx: LibHeader): TemplateResult {\n  if (!ctx._mobileOpen) return html``;\n\n  return html`\n    <!-- Backdrop -->\n    <div\n      class=\"hdr-mobile-backdrop\"\n      @click=\"${(): void => ctx._closeMobile()}\"\n      aria-hidden=\"true\"\n    ></div>\n\n    <!-- Drawer panel -->\n    <nav\n      id=\"hdr-mobile-drawer\"\n      class=\"hdr-mobile-drawer ${ctx._mobileOpen ? 'is-open' : ''}\"\n      aria-label=\"Menú principal\"\n    >\n      <!-- Links principales -->\n      <div class=\"hdr-mobile-links\">\n        ${(ctx.links ?? []).map((link: NavLink) => html`\n          <a\n            href=\"${link.href ?? '#'}\"\n            class=\"hdr-mobile-link\"\n            @click=\"${(e: Event): void => {\n              e.preventDefault();\n              ctx._onLinkClick(link.id);\n            }}\"\n          >\n            ${link.label}\n            ${link.dropdown?.length ? html`\n              <svg width=\"8\" height=\"5\" viewBox=\"0 0 10 6\" fill=\"none\"\n                stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\">\n                <polyline points=\"1,1 5,5 9,1\"/>\n              </svg>` : nothing}\n          </a>\n\n          <!-- Sub-items — siempre visibles en móvil -->\n          ${link.dropdown?.length ? html`\n            <div class=\"hdr-mobile-sub\">\n              ${link.dropdown.map((item: DropdownItem) => html`\n                <a href=\"${item.href ?? '#'}\" class=\"hdr-mobile-sub-link\">\n                  › ${item.label}\n                </a>\n              `)}\n            </div>\n          ` : nothing}\n        `)}\n\n        <!-- Mega columns — accordion plano en móvil -->\n        ${ctx.megaColumns?.length ? html`\n          <div class=\"hdr-mobile-sub\" style=\"margin-top:0;\">\n            ${ctx.megaColumns.map(col => html`\n              <p class=\"hdr-mobile-col-title\">${col.title}</p>\n              ${col.items.map(item => html`\n                <a href=\"${item.href ?? '#'}\" class=\"hdr-mobile-sub-link\">\n                  › ${item.label}\n                </a>\n              `)}\n            `)}\n          </div>\n        ` : nothing}\n      </div>\n\n      <!-- Divider -->\n      <div class=\"hdr-mobile-divider\"></div>\n\n      <!-- Actions / CTAs -->\n      <div class=\"hdr-mobile-actions\">\n        ${ctx.loginLabel ? html`\n          <a href=\"${ctx.loginHref ?? '#'}\" class=\"hdr-mobile-login\">\n            ${ctx.loginLabel}\n          </a>\n        ` : nothing}\n\n        ${(ctx.actions ?? []).map((action: HeaderAction) => html`\n          <a\n            href=\"${action.href ?? '#'}\"\n            class=\"hdr-mobile-cta\"\n            @click=\"${(e: Event): void => {\n              e.preventDefault();\n              ctx._onActionClick(action);\n            }}\"\n          >\n            ${action.label}\n          </a>\n        `)}\n\n        ${ctx.contactLabel ? html`\n          <a href=\"${ctx.contactHref ?? '#'}\" class=\"hdr-mobile-login\">\n            ${ctx.contactLabel} →\n          </a>\n        ` : nothing}\n      </div>\n\n      <!-- Footer del drawer -->\n      <div class=\"hdr-mobile-footer\">\n        <span>${ctx.brandName}</span>\n        <button\n          class=\"hdr-mobile-close\"\n          aria-label=\"Cerrar menú\"\n          @click=\"${(): void => ctx._closeMobile()}\"\n        >✕</button>\n      </div>\n    </nav>`;\n}"],"names":["_a"],"mappings":";AAQO,SAAS,gBAAgB,KAAgC;AAC9D,QAAM,UAAU,CAAC,WAAW,YAAY,QAAQ,WAAW,QAAQ,EAAE,SAAS,IAAI,OAAO;AACzF,QAAM,QAAU,UACZ,oCACA;AAEJ,SAAO;AAAA;AAAA;AAAA,oBAGW,IAAI,cAAc,gBAAgB,YAAY;AAAA,uBAC3C,IAAI,WAAW;AAAA;AAAA,gBAEtB,MAAY,IAAI,eAAe;AAAA;AAAA;AAAA,kBAG7B,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAMvB;AAMO,SAAS,mBAAmB,KAAgC;;AACjE,MAAI,CAAC,IAAI,YAAa,QAAO;AAE7B,SAAO;AAAA;AAAA;AAAA;AAAA,gBAIO,MAAY,IAAI,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCAOb,IAAI,cAAc,YAAY,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,WAKtD,IAAI,SAAS,CAAA,GAAI,IAAI,CAAC;;AAAkB;AAAA;AAAA,oBAE/B,KAAK,QAAQ,GAAG;AAAA;AAAA,sBAEd,CAAC,MAAmB;AAC5B,QAAE,eAAA;AACF,UAAI,aAAa,KAAK,EAAE;AAAA,IAC1B,CAAC;AAAA;AAAA,cAEC,KAAK,KAAK;AAAA,gBACVA,MAAA,KAAK,aAAL,gBAAAA,IAAe,UAAS;AAAA;AAAA;AAAA;AAAA,wBAId,OAAO;AAAA;AAAA;AAAA;AAAA,cAInB,UAAK,aAAL,mBAAe,UAAS;AAAA;AAAA,gBAEpB,KAAK,SAAS,IAAI,CAAC,SAAuB;AAAA,2BAC/B,KAAK,QAAQ,GAAG;AAAA,sBACrB,KAAK,KAAK;AAAA;AAAA,eAEjB,CAAC;AAAA;AAAA,cAEF,OAAO;AAAA;AAAA,GACZ,CAAC;AAAA;AAAA;AAAA,YAGA,SAAI,gBAAJ,mBAAiB,UAAS;AAAA;AAAA,cAEtB,IAAI,YAAY,IAAI,CAAA,QAAO;AAAA,gDACO,IAAI,KAAK;AAAA,gBACzC,IAAI,MAAM,IAAI,CAAA,SAAQ;AAAA,2BACX,KAAK,QAAQ,GAAG;AAAA,sBACrB,KAAK,KAAK;AAAA;AAAA,eAEjB,CAAC;AAAA,aACH,CAAC;AAAA;AAAA,YAEF,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQT,IAAI,aAAa;AAAA,qBACN,IAAI,aAAa,GAAG;AAAA,cAC3B,IAAI,UAAU;AAAA;AAAA,YAEhB,OAAO;AAAA;AAAA,WAER,IAAI,WAAW,CAAA,GAAI,IAAI,CAAC,WAAyB;AAAA;AAAA,oBAExC,OAAO,QAAQ,GAAG;AAAA;AAAA,sBAEhB,CAAC,MAAmB;AAC5B,MAAE,eAAA;AACF,QAAI,eAAe,MAAM;AAAA,EAC3B,CAAC;AAAA;AAAA,cAEC,OAAO,KAAK;AAAA;AAAA,SAEjB,CAAC;AAAA;AAAA,UAEA,IAAI,eAAe;AAAA,qBACR,IAAI,eAAe,GAAG;AAAA,cAC7B,IAAI,YAAY;AAAA;AAAA,YAElB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,gBAKH,IAAI,SAAS;AAAA;AAAA;AAAA;AAAA,oBAIT,MAAY,IAAI,cAAc;AAAA;AAAA;AAAA;AAIlD;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shibui-ui/ui",
-  "version": "1.20.0",
+  "version": "1.21.0",
   "private": false,
   "repository": {
     "type": "git",