@shibui-ui/ui 1.5.5

package/dist/index216.js

@@ -0,0 +1,52 @@
+import { svg, nothing, html } from "lit";
+const iconCheck = svg`
+  <svg class="step-icon" viewBox="0 0 12 12" aria-hidden="true">
+    <polyline points="2,6 5,9 10,3"/>
+  </svg>
+`;
+const iconError = svg`
+  <svg class="step-icon" viewBox="0 0 14 14" fill="none"
+       stroke="currentColor" stroke-width="2" stroke-linecap="round"
+       aria-hidden="true">
+    <line x1="7" y1="3" x2="7" y2="7.5"/>
+    <circle cx="7" cy="10" r="0.75" fill="currentColor" stroke="none"/>
+  </svg>
+`;
+function nodeContent(props) {
+  if (props.status === "completed") return iconCheck;
+  if (props.status === "error") return iconError;
+  return html`${props.index}`;
+}
+function stepTemplate(props) {
+  const isVertical = props.orientation === "vertical";
+  return html`
+    <div
+      class="step-inner"
+      role="listitem"
+      aria-current=${props.status === "active" ? "step" : nothing}
+    >
+      <div class="step-node" aria-hidden="true">
+        ${nodeContent(props)}
+      </div>
+
+      ${!props.last ? html`<div class="step-connector" aria-hidden="true"></div>` : nothing}
+
+      ${isVertical ? html`
+          <div class="step-body">
+            <p class="step-title">${props.label}</p>
+            ${props.sub ? html`<p class="step-sub">${props.sub}</p>` : nothing}
+            <div class="step-content"><slot></slot></div>
+          </div>
+        ` : html`
+          <div class="step-text">
+            <span class="step-label">${props.label}</span>
+            ${props.sub ? html`<span class="step-sub">${props.sub}</span>` : nothing}
+          </div>
+        `}
+    </div>
+  `;
+}
+export {
+  stepTemplate
+};
+//# sourceMappingURL=index216.js.map

package/dist/index216.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index216.js","sources":["../src/components/atoms/step/lib-step.html.ts"],"sourcesContent":["import { html, nothing, svg, TemplateResult } from 'lit';\n\nexport type LibStepStatus      = 'pending' | 'active' | 'completed' | 'error';\nexport type LibStepOrientation = 'horizontal' | 'vertical';\nexport type LibStepVariant     = 'default' | 'minimal' | 'kintsugi';\nexport type LibStepSize        = 'sm' | 'md' | 'lg';\n\nexport interface StepTemplateProps {\n  index:       number;\n  status:      LibStepStatus;\n  label:       string;\n  sub:         string;\n  last:        boolean;\n  orientation: LibStepOrientation;\n}\n\n/* ── SVG icons ─────────────────────────────────────────────── */\nconst iconCheck = svg`\n  <svg class=\"step-icon\" viewBox=\"0 0 12 12\" aria-hidden=\"true\">\n    <polyline points=\"2,6 5,9 10,3\"/>\n  </svg>\n`;\n\nconst iconError = svg`\n  <svg class=\"step-icon\" viewBox=\"0 0 14 14\" fill=\"none\"\n       stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n       aria-hidden=\"true\">\n    <line x1=\"7\" y1=\"3\" x2=\"7\" y2=\"7.5\"/>\n    <circle cx=\"7\" cy=\"10\" r=\"0.75\" fill=\"currentColor\" stroke=\"none\"/>\n  </svg>\n`;\n\nfunction nodeContent(props: StepTemplateProps): TemplateResult {\n  if (props.status === 'completed') return iconCheck;\n  if (props.status === 'error')     return iconError;\n  return html`${props.index}`;\n}\n\n/**\n * Template para lib-step.\n *\n * Estructura (orientación horizontal):\n *   .step-node     — círculo/cuadrado con número o icono\n *   .step-connector— línea que conecta con el siguiente paso (oculta en [last])\n *   .step-text     — label + sub\n *\n * Estructura (orientación vertical):\n *   .step-node\n *   .step-connector (vertical)\n *   .step-body\n *     .step-title\n *     .step-content  ← <slot> para contenido descriptivo\n */\nexport function stepTemplate(props: StepTemplateProps): TemplateResult {\n  const isVertical = props.orientation === 'vertical';\n\n  return html`\n    <div\n      class=\"step-inner\"\n      role=\"listitem\"\n      aria-current=${props.status === 'active' ? 'step' : nothing}\n    >\n      <div class=\"step-node\" aria-hidden=\"true\">\n        ${nodeContent(props)}\n      </div>\n\n      ${!props.last ? html`<div class=\"step-connector\" aria-hidden=\"true\"></div>` : nothing}\n\n      ${isVertical\n        ? html`\n          <div class=\"step-body\">\n            <p class=\"step-title\">${props.label}</p>\n            ${props.sub ? html`<p class=\"step-sub\">${props.sub}</p>` : nothing}\n            <div class=\"step-content\"><slot></slot></div>\n          </div>\n        `\n        : html`\n          <div class=\"step-text\">\n            <span class=\"step-label\">${props.label}</span>\n            ${props.sub ? html`<span class=\"step-sub\">${props.sub}</span>` : nothing}\n          </div>\n        `\n      }\n    </div>\n  `;\n}"],"names":[],"mappings":";AAiBA,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAMlB,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASlB,SAAS,YAAY,OAA0C;AAC7D,MAAI,MAAM,WAAW,YAAa,QAAO;AACzC,MAAI,MAAM,WAAW,QAAa,QAAO;AACzC,SAAO,OAAO,MAAM,KAAK;AAC3B;AAiBO,SAAS,aAAa,OAA0C;AACrE,QAAM,aAAa,MAAM,gBAAgB;AAEzC,SAAO;AAAA;AAAA;AAAA;AAAA,qBAIY,MAAM,WAAW,WAAW,SAAS,OAAO;AAAA;AAAA;AAAA,UAGvD,YAAY,KAAK,CAAC;AAAA;AAAA;AAAA,QAGpB,CAAC,MAAM,OAAO,8DAA8D,OAAO;AAAA;AAAA,QAEnF,aACE;AAAA;AAAA,oCAE0B,MAAM,KAAK;AAAA,cACjC,MAAM,MAAM,2BAA2B,MAAM,GAAG,SAAS,OAAO;AAAA;AAAA;AAAA,YAIpE;AAAA;AAAA,uCAE6B,MAAM,KAAK;AAAA,cACpC,MAAM,MAAM,8BAA8B,MAAM,GAAG,YAAY,OAAO;AAAA;AAAA,SAG9E;AAAA;AAAA;AAGN;"}

package/dist/index217.js

@@ -0,0 +1,5 @@
+const stepCss = '@layer tokens,reset,components;@layer reset{:host{display:block;position:relative;flex:1;flex-shrink:0}*,*:before,*:after{box-sizing:border-box}}@layer components{.step-inner{display:flex;flex-direction:column;align-items:center;position:relative}.step-node{width:32px;height:32px;border-radius:var(--radius-full);border:1px solid var(--border-default);background:var(--bg-elevated);color:var(--text-muted);display:flex;align-items:center;justify-content:center;font-family:var(--lib-font-mono);font-size:var(--text-xs);position:relative;z-index:1;flex-shrink:0;transition:background var(--duration-slow) var(--ease-out),border-color var(--duration-slow) var(--ease-out),color var(--duration-slow) var(--ease-out),box-shadow var(--duration-slow) var(--ease-out)}.step-icon{width:12px;height:12px;stroke:currentcolor;stroke-width:2.5;fill:none;stroke-linecap:round;stroke-linejoin:round;display:block}.step-text{margin-top:var(--lib-space-sm);display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--lib-space-xs)}.step-label{font-family:var(--lib-font-mono);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);color:var(--text-muted);text-transform:uppercase;transition:color var(--duration-base) var(--ease-default)}.step-sub{font-family:var(--lib-font-body);font-size:var(--text-xs);color:var(--text-muted);line-height:var(--leading-snug)}.step-connector{position:absolute;top:15px;left:calc(50% + 16px);width:calc(100% - 32px);height:1px;background:var(--border-default);transition:background var(--duration-slow) var(--ease-out);pointer-events:none}:host([status="active"]) .step-node{background:var(--color-washi-900);border-color:var(--color-washi-900);color:var(--color-washi-50);box-shadow:0 0 0 4px var(--color-washi-100)}:host([status="active"]) .step-label{color:var(--text-primary)}:host([status="completed"]) .step-node{background:var(--color-washi-700);border-color:var(--color-washi-700);color:var(--color-washi-50)}:host([status="completed"]) .step-label{color:var(--text-secondary)}:host([status="completed"]) .step-connector{background:var(--color-washi-700)}:host([status="error"]) .step-node{background:#fff8f7;border-color:var(--color-error);color:var(--color-error)}:host([status="error"]) .step-label{color:var(--color-error)}:host([size="sm"]) .step-node{width:24px;height:24px;font-size:9px}:host([size="sm"]) .step-connector{top:11px;left:calc(50% + 12px);width:calc(100% - 24px)}:host([size="sm"]) .step-label{font-size:9px}:host([size="lg"]) .step-node{width:40px;height:40px;font-size:var(--text-sm)}:host([size="lg"]) .step-connector{top:19px;left:calc(50% + 20px);width:calc(100% - 40px)}:host([variant="minimal"]) .step-node{width:24px;height:24px;border-radius:var(--radius-none);background:transparent;font-size:9px}:host([variant="minimal"]) .step-connector{top:11px;left:calc(50% + 12px);width:calc(100% - 24px)}:host([variant="minimal"][status="active"]) .step-node{background:var(--color-kaki-500);border-color:var(--color-kaki-500);color:var(--color-white);box-shadow:none}:host([variant="minimal"][status="active"]) .step-label{color:var(--color-kaki-500)}:host([variant="minimal"][status="completed"]) .step-node{background:transparent;border-color:var(--color-washi-700);color:var(--color-washi-700)}:host([variant="kintsugi"][status="completed"]) .step-node{background:#190f0a;border:none;color:#decbb1}:host([variant="kintsugi"][status="completed"]) .step-node:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;padding:1px;background:var(--lib-kintsugi-border);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:xor;-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}:host([variant="kintsugi"][status="active"]) .step-node{background:#100704;border:none;color:#e3d5c2;box-shadow:0 0 0 4px #6d4d3e1a}:host([variant="kintsugi"][status="active"]) .step-node:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;padding:1.5px;background:var(--lib-kintsugi-border);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:xor;-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;animation:kintsugi-pulse 2.5s ease-in-out infinite}@keyframes kintsugi-pulse{0%,to{opacity:.7}50%{opacity:1}}:host([variant="kintsugi"][status="completed"]) .step-connector{background:linear-gradient(90deg,#66503f80,#866c534d)}:host([variant="kintsugi"]) .step-label{color:#484848}:host([variant="kintsugi"][status="active"]) .step-label{color:#dedede}:host([variant="kintsugi"][status="completed"]) .step-label{color:gray}:host([variant="kintsugi"]) .step-node{background:#090504;border-color:#26201e;color:#484848}:host([variant="kintsugi"]) .step-connector{background:#1f1917}:host([orientation="vertical"]){flex:none}:host([orientation="vertical"]) .step-inner{flex-direction:row;align-items:flex-start;gap:var(--lib-space-lg)}:host([orientation="vertical"]) .step-connector{position:absolute;left:15px;top:32px;bottom:0;width:1px;height:auto}:host([orientation="vertical"][size="sm"]) .step-connector{left:11px;top:24px}:host([orientation="vertical"][size="lg"]) .step-connector{left:19px;top:40px}.step-body{padding-bottom:var(--lib-space-xl);flex:1}.step-title{font-family:var(--lib-font-mono);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-muted);line-height:32px;transition:color var(--duration-base) var(--ease-default)}:host([orientation="vertical"][status="active"]) .step-title{color:var(--text-primary)}:host([orientation="vertical"][status="completed"]) .step-title{color:var(--text-secondary)}:host([orientation="vertical"][status="error"]) .step-title{color:var(--color-error)}.step-content{margin-top:var(--lib-space-sm);font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-relaxed);max-width:420px}@media(prefers-reduced-motion:reduce){.step-node,.step-connector,.step-label{transition:none}:host([variant="kintsugi"][status="active"]) .step-node:after{animation:none}}}';
+export {
+  stepCss as default
+};
+//# sourceMappingURL=index217.js.map

package/dist/index217.js.map

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

package/dist/index218.js

@@ -0,0 +1,88 @@
+import { html, nothing } from "lit";
+const ICONS = {
+  star: {
+    regular: html`<svg viewBox="0 0 256 256" fill="currentColor" aria-hidden="true">
+      <path d="M239.2,97.4A16.4,16.4,0,0,0,224.6,86l-59.4-4.1-22-55.5A16.4,16.4,0,0,0,128,16h0a16.4,16.4,0,0,0-15.2,10.4L90.8,82,31.4,86A16.5,16.5,0,0,0,16.8,97.4,16.8,16.8,0,0,0,22,115.5l45.4,38.4L52.5,212a16.4,16.4,0,0,0,6.4,17.3,16.7,16.7,0,0,0,18.2.5L128,198.8l51,31.1a16.1,16.1,0,0,0,8.5,2.4,16.5,16.5,0,0,0,9.7-3.1A16.4,16.4,0,0,0,203.5,212l-14.9-58.1L234,115.5A16.8,16.8,0,0,0,239.2,97.4Zm-15.4,5.9-45.4,38.4a8,8,0,0,0-2.6,8.2l14.9,58.1a.6.6,0,0,1-.3.7c-.1.1-.3.2-.5.1l-51-31.2a8,8,0,0,0-8.4,0l-51,31.1-.4-.1a.6.6,0,0,1-.3-.7l14.9-58.1a8,8,0,0,0-2.6-8.2L31.2,103.3l-.1-.4c.1-.3.2-.5.5-.6l59.3-4.1a8,8,0,0,0,6.8-5.1L119.7,38a.8.8,0,0,1,.6-.5h.2a.8.8,0,0,1,.6.5l21.9,55.2a8,8,0,0,0,6.8,5.1l59.3,4.1c.3.1.4.3.5.6A.7.7,0,0,1,223.8,103.3Z"/>
+    </svg>`,
+    fill: html`<svg viewBox="0 0 256 256" fill="currentColor" aria-hidden="true">
+      <path d="M234.5,114.38l-45.1,39.36,13.51,58.6a16,16,0,0,1-23.84,17.34l-51.11-31-51,31a16,16,0,0,1-23.84-17.34l13.49-58.54L21.5,114.38a16,16,0,0,1,9.11-28.06l59.46-5.15,23.21-55.36a15.95,15.95,0,0,1,29.44,0h0L166,81.17l59.44,5.15a16,16,0,0,1,9.11,28.06Z"/>
+    </svg>`
+  },
+  heart: {
+    regular: html`<svg viewBox="0 0 256 256" fill="currentColor" aria-hidden="true">
+      <path d="M178,32c-20.65,0-38.73,8.88-50,23.89C116.73,40.88,98.65,32,78,32A62.07,62.07,0,0,0,16,94c0,70,103.79,126.66,108.21,129a8,8,0,0,0,7.58,0C136.21,220.66,240,164,240,94A62.07,62.07,0,0,0,178,32ZM128,206.8C109.74,196.16,32,147.69,32,94A46.06,46.06,0,0,1,78,48c19.45,0,35.78,10.36,42.6,27a8,8,0,0,0,14.8,0c6.82-16.67,23.15-27,42.6-27a46.06,46.06,0,0,1,46,46C224,147.61,146.24,196.15,128,206.8Z"/>
+    </svg>`,
+    fill: html`<svg viewBox="0 0 256 256" fill="currentColor" aria-hidden="true">
+      <path d="M240,94c0,70-103.79,126.66-108.21,129a8,8,0,0,1-7.58,0C119.79,220.66,16,164,16,94A62.07,62.07,0,0,1,78,32c20.65,0,38.73,8.88,50,23.89C139.27,40.88,157.35,32,178,32A62.07,62.07,0,0,1,240,94Z"/>
+    </svg>`
+  },
+  diamond: {
+    regular: html`<svg viewBox="0 0 256 256" fill="currentColor" aria-hidden="true">
+      <path d="M235.32,104,211.31,56a16,16,0,0,0-14.31-8.05H59A16,16,0,0,0,44.69,56L20.68,104a16,16,0,0,0,2.62,18.51l96,96a16,16,0,0,0,17.4,3.37,15.93,15.93,0,0,0,5.26-3.38l96-96A16,16,0,0,0,235.32,104ZM59,64H197l21.33,42.67L128,213.32,37.67,106.67Z"/>
+    </svg>`,
+    fill: html`<svg viewBox="0 0 256 256" fill="currentColor" aria-hidden="true">
+      <path d="M238,106.38,214,58.34A16.09,16.09,0,0,0,199.69,50H56.31A16.09,16.09,0,0,0,42,58.34L18,106.38a16,16,0,0,0,2.69,18.76l96,96a16,16,0,0,0,22.62,0l96-96A16,16,0,0,0,238,106.38Z"/>
+    </svg>`
+  }
+};
+function getIcon(name) {
+  return ICONS[name] ?? ICONS["star"];
+}
+function ratingTemplate(ctx) {
+  const { value, max, icon, readonly, showCount, count } = ctx;
+  const icons = getIcon(icon);
+  const display = ctx._hoverValue || value;
+  const items = Array.from({ length: max }, (_, i) => {
+    const pos = i + 1;
+    const isHalf = readonly && !Number.isInteger(value) && pos === Math.ceil(value);
+    const isFilled = pos <= Math.floor(display);
+    const isPreview = !readonly && pos > Math.floor(display) && pos <= ctx._hoverValue;
+    if (isHalf) {
+      return html`
+        <span
+          class="rt-item rt-item-half"
+          part="item item-half"
+          aria-hidden="true"
+        >
+          ${icons == null ? void 0 : icons.regular}
+          <span class="rt-half-fill">${icons == null ? void 0 : icons.fill}</span>
+        </span>
+      `;
+    }
+    return html`
+      <span
+        class="rt-item ${isFilled ? "is-filled" : ""} ${isPreview ? "is-preview" : ""}"
+        part="item${isFilled ? " item-filled" : ""}"
+        role="${readonly ? nothing : "button"}"
+        aria-label="${readonly ? nothing : `Valorar ${pos} de ${max}`}"
+        tabindex="${readonly ? nothing : "0"}"
+        @mouseenter="${() => ctx._onEnter(pos)}"
+        @click="${() => ctx._onClick(pos)}"
+        @keydown="${(e) => ctx._onKeyItem(e, pos)}"
+      >
+        ${isFilled || isPreview ? icons == null ? void 0 : icons.fill : icons == null ? void 0 : icons.regular}
+      </span>
+    `;
+  });
+  const numDisplay = showCount ? html`
+        <span class="rt-num" part="num">
+          <strong>${value > 0 ? value.toFixed(1) : "—"}</strong>
+          ${count != null ? html`<span style="margin-left:2px;">(${count})</span>` : nothing}
+        </span>` : nothing;
+  return html`
+    <div
+      class="rt"
+      part="root"
+      role="${readonly ? "img" : "group"}"
+      aria-label="${readonly ? `Valoración: ${value} de ${max}` : `Valorar de 1 a ${max}`}"
+      @mouseleave="${() => ctx._onLeave()}"
+    >
+      ${items}
+    </div>
+    ${numDisplay}
+  `;
+}
+export {
+  ratingTemplate
+};
+//# sourceMappingURL=index218.js.map

package/dist/index218.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index218.js","sources":["../src/components/atoms/rating/lib-rating.html.ts"],"sourcesContent":["import { html, nothing, TemplateResult } from 'lit';\nimport type { LibRating } from './lib-rating.component';\n\n/* ══════════════════════════════════════════════════════════\n   SVGs Phosphor-style — regular (outline) y fill\n   ══════════════════════════════════════════════════════════ */\n\nconst ICONS: Record<string, { regular: TemplateResult; fill: TemplateResult }> = {\n  star: {\n    regular: html`<svg viewBox=\"0 0 256 256\" fill=\"currentColor\" aria-hidden=\"true\">\n      <path d=\"M239.2,97.4A16.4,16.4,0,0,0,224.6,86l-59.4-4.1-22-55.5A16.4,16.4,0,0,0,128,16h0a16.4,16.4,0,0,0-15.2,10.4L90.8,82,31.4,86A16.5,16.5,0,0,0,16.8,97.4,16.8,16.8,0,0,0,22,115.5l45.4,38.4L52.5,212a16.4,16.4,0,0,0,6.4,17.3,16.7,16.7,0,0,0,18.2.5L128,198.8l51,31.1a16.1,16.1,0,0,0,8.5,2.4,16.5,16.5,0,0,0,9.7-3.1A16.4,16.4,0,0,0,203.5,212l-14.9-58.1L234,115.5A16.8,16.8,0,0,0,239.2,97.4Zm-15.4,5.9-45.4,38.4a8,8,0,0,0-2.6,8.2l14.9,58.1a.6.6,0,0,1-.3.7c-.1.1-.3.2-.5.1l-51-31.2a8,8,0,0,0-8.4,0l-51,31.1-.4-.1a.6.6,0,0,1-.3-.7l14.9-58.1a8,8,0,0,0-2.6-8.2L31.2,103.3l-.1-.4c.1-.3.2-.5.5-.6l59.3-4.1a8,8,0,0,0,6.8-5.1L119.7,38a.8.8,0,0,1,.6-.5h.2a.8.8,0,0,1,.6.5l21.9,55.2a8,8,0,0,0,6.8,5.1l59.3,4.1c.3.1.4.3.5.6A.7.7,0,0,1,223.8,103.3Z\"/>\n    </svg>`,\n    fill: html`<svg viewBox=\"0 0 256 256\" fill=\"currentColor\" aria-hidden=\"true\">\n      <path d=\"M234.5,114.38l-45.1,39.36,13.51,58.6a16,16,0,0,1-23.84,17.34l-51.11-31-51,31a16,16,0,0,1-23.84-17.34l13.49-58.54L21.5,114.38a16,16,0,0,1,9.11-28.06l59.46-5.15,23.21-55.36a15.95,15.95,0,0,1,29.44,0h0L166,81.17l59.44,5.15a16,16,0,0,1,9.11,28.06Z\"/>\n    </svg>`,\n  },\n  heart: {\n    regular: html`<svg viewBox=\"0 0 256 256\" fill=\"currentColor\" aria-hidden=\"true\">\n      <path d=\"M178,32c-20.65,0-38.73,8.88-50,23.89C116.73,40.88,98.65,32,78,32A62.07,62.07,0,0,0,16,94c0,70,103.79,126.66,108.21,129a8,8,0,0,0,7.58,0C136.21,220.66,240,164,240,94A62.07,62.07,0,0,0,178,32ZM128,206.8C109.74,196.16,32,147.69,32,94A46.06,46.06,0,0,1,78,48c19.45,0,35.78,10.36,42.6,27a8,8,0,0,0,14.8,0c6.82-16.67,23.15-27,42.6-27a46.06,46.06,0,0,1,46,46C224,147.61,146.24,196.15,128,206.8Z\"/>\n    </svg>`,\n    fill: html`<svg viewBox=\"0 0 256 256\" fill=\"currentColor\" aria-hidden=\"true\">\n      <path d=\"M240,94c0,70-103.79,126.66-108.21,129a8,8,0,0,1-7.58,0C119.79,220.66,16,164,16,94A62.07,62.07,0,0,1,78,32c20.65,0,38.73,8.88,50,23.89C139.27,40.88,157.35,32,178,32A62.07,62.07,0,0,1,240,94Z\"/>\n    </svg>`,\n  },\n  diamond: {\n    regular: html`<svg viewBox=\"0 0 256 256\" fill=\"currentColor\" aria-hidden=\"true\">\n      <path d=\"M235.32,104,211.31,56a16,16,0,0,0-14.31-8.05H59A16,16,0,0,0,44.69,56L20.68,104a16,16,0,0,0,2.62,18.51l96,96a16,16,0,0,0,17.4,3.37,15.93,15.93,0,0,0,5.26-3.38l96-96A16,16,0,0,0,235.32,104ZM59,64H197l21.33,42.67L128,213.32,37.67,106.67Z\"/>\n    </svg>`,\n    fill: html`<svg viewBox=\"0 0 256 256\" fill=\"currentColor\" aria-hidden=\"true\">\n      <path d=\"M238,106.38,214,58.34A16.09,16.09,0,0,0,199.69,50H56.31A16.09,16.09,0,0,0,42,58.34L18,106.38a16,16,0,0,0,2.69,18.76l96,96a16,16,0,0,0,22.62,0l96-96A16,16,0,0,0,238,106.38Z\"/>\n    </svg>`,\n  },\n};\n\n/* ── Fallback al icono estrella si el icon prop no coincide ── */\nfunction getIcon(name: string): { regular: TemplateResult; fill: TemplateResult } | undefined {\n  return ICONS[name] ?? ICONS['star'];\n}\n\n/* ══════════════════════════════════════════════════════════\n   Template principal\n   ══════════════════════════════════════════════════════════ */\nexport function ratingTemplate(ctx: LibRating): TemplateResult {\n  const { value, max, icon, readonly, showCount, count } = ctx;\n  const icons = getIcon(icon);\n  const display = ctx._hoverValue || value;\n\n  /* Secuencia de items */\n  const items = Array.from({ length: max }, (_, i) => {\n    const pos = i + 1; // 1-indexed\n\n    /* Half-star: solo read-only, cuando value tiene .5 */\n    const isHalf = readonly && !Number.isInteger(value) && pos === Math.ceil(value);\n    const isFilled = pos <= Math.floor(display);\n    const isPreview = !readonly && pos > Math.floor(display) && pos <= ctx._hoverValue;\n\n    if (isHalf) {\n      return html`\n        <span\n          class=\"rt-item rt-item-half\"\n          part=\"item item-half\"\n          aria-hidden=\"true\"\n        >\n          ${icons?.regular}\n          <span class=\"rt-half-fill\">${icons?.fill}</span>\n        </span>\n      `;\n    }\n\n    return html`\n      <span\n        class=\"rt-item ${isFilled ? 'is-filled' : ''} ${isPreview ? 'is-preview' : ''}\"\n        part=\"item${isFilled ? ' item-filled' : ''}\"\n        role=\"${readonly ? nothing : 'button'}\"\n        aria-label=\"${readonly ? nothing : `Valorar ${pos} de ${max}`}\"\n        tabindex=\"${readonly ? nothing : '0'}\"\n        @mouseenter=\"${(): void => ctx._onEnter(pos)}\"\n        @click=\"${(): void => ctx._onClick(pos)}\"\n        @keydown=\"${(e: KeyboardEvent): void => ctx._onKeyItem(e, pos)}\"\n      >\n        ${isFilled || isPreview ? icons?.fill : icons?.regular}\n      </span>\n    `;\n  });\n\n  /* Numeric display */\n  const numDisplay = showCount\n    ? html`\n        <span class=\"rt-num\" part=\"num\">\n          <strong>${value > 0 ? value.toFixed(1) : '—'}</strong>\n          ${count != null ? html`<span style=\"margin-left:2px;\">(${count})</span>` : nothing}\n        </span>`\n    : nothing;\n\n  return html`\n    <div\n      class=\"rt\"\n      part=\"root\"\n      role=\"${readonly ? 'img' : 'group'}\"\n      aria-label=\"${readonly\n        ? `Valoración: ${value} de ${max}`\n        : `Valorar de 1 a ${max}`}\"\n      @mouseleave=\"${(): void => ctx._onLeave()}\"\n    >\n      ${items}\n    </div>\n    ${numDisplay}\n  `;\n}"],"names":[],"mappings":";AAOA,MAAM,QAA2E;AAAA,EAC/E,MAAM;AAAA,IACJ,SAAS;AAAA;AAAA;AAAA,IAGT,MAAM;AAAA;AAAA;AAAA,EAAA;AAAA,EAIR,OAAO;AAAA,IACL,SAAS;AAAA;AAAA;AAAA,IAGT,MAAM;AAAA;AAAA;AAAA,EAAA;AAAA,EAIR,SAAS;AAAA,IACP,SAAS;AAAA;AAAA;AAAA,IAGT,MAAM;AAAA;AAAA;AAAA,EAAA;AAIV;AAGA,SAAS,QAAQ,MAA6E;AAC5F,SAAO,MAAM,IAAI,KAAK,MAAM,MAAM;AACpC;AAKO,SAAS,eAAe,KAAgC;AAC7D,QAAM,EAAE,OAAO,KAAK,MAAM,UAAU,WAAW,UAAU;AACzD,QAAM,QAAQ,QAAQ,IAAI;AAC1B,QAAM,UAAU,IAAI,eAAe;AAGnC,QAAM,QAAQ,MAAM,KAAK,EAAE,QAAQ,IAAA,GAAO,CAAC,GAAG,MAAM;AAClD,UAAM,MAAM,IAAI;AAGhB,UAAM,SAAS,YAAY,CAAC,OAAO,UAAU,KAAK,KAAK,QAAQ,KAAK,KAAK,KAAK;AAC9E,UAAM,WAAW,OAAO,KAAK,MAAM,OAAO;AAC1C,UAAM,YAAY,CAAC,YAAY,MAAM,KAAK,MAAM,OAAO,KAAK,OAAO,IAAI;AAEvE,QAAI,QAAQ;AACV,aAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAMD,+BAAO,OAAO;AAAA,uCACa,+BAAO,IAAI;AAAA;AAAA;AAAA,IAG9C;AAEA,WAAO;AAAA;AAAA,yBAEc,WAAW,cAAc,EAAE,IAAI,YAAY,eAAe,EAAE;AAAA,oBACjE,WAAW,iBAAiB,EAAE;AAAA,gBAClC,WAAW,UAAU,QAAQ;AAAA,sBACvB,WAAW,UAAU,WAAW,GAAG,OAAO,GAAG,EAAE;AAAA,oBACjD,WAAW,UAAU,GAAG;AAAA,uBACrB,MAAY,IAAI,SAAS,GAAG,CAAC;AAAA,kBAClC,MAAY,IAAI,SAAS,GAAG,CAAC;AAAA,oBAC3B,CAAC,MAA2B,IAAI,WAAW,GAAG,GAAG,CAAC;AAAA;AAAA,UAE5D,YAAY,YAAY,+BAAO,OAAO,+BAAO,OAAO;AAAA;AAAA;AAAA,EAG5D,CAAC;AAGD,QAAM,aAAa,YACf;AAAA;AAAA,oBAEc,QAAQ,IAAI,MAAM,QAAQ,CAAC,IAAI,GAAG;AAAA,YAC1C,SAAS,OAAO,uCAAuC,KAAK,aAAa,OAAO;AAAA,mBAEtF;AAEJ,SAAO;AAAA;AAAA;AAAA;AAAA,cAIK,WAAW,QAAQ,OAAO;AAAA,oBACpB,WACV,eAAe,KAAK,OAAO,GAAG,KAC9B,kBAAkB,GAAG,EAAE;AAAA,qBACZ,MAAY,IAAI,UAAU;AAAA;AAAA,QAEvC,KAAK;AAAA;AAAA,MAEP,UAAU;AAAA;AAEhB;"}

package/dist/index219.js

@@ -0,0 +1,5 @@
+const ratingCss = '@layer tokens,reset,components;@layer reset{:host{display:inline-flex;align-items:center;gap:var(--lib-space-sm);-webkit-user-select:none;user-select:none;--_gold: #C4922A;--_gold-light: #F0D080;--_gold-pale: #FAF0D0}*,*:before,*:after{box-sizing:border-box}}@layer components{@keyframes rt-pop{0%{transform:scale(1)}40%{transform:scale(1.35)}to{transform:scale(1)}}.rt{display:inline-flex;align-items:center;gap:3px;position:relative}.rt-item{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;position:relative;color:var(--color-washi-300);transition:color var(--duration-fast) var(--ease-default),transform var(--duration-base) var(--ease-bounce);line-height:1;flex-shrink:0}.rt-item svg{display:block;width:1em;height:1em}.rt-item:hover{transform:scale(1.15)}.rt-item.is-filled{color:var(--_gold)}.rt-item.is-preview{color:var(--_gold-light)}.rt-item.is-pop{animation:rt-pop .3s var(--ease-bounce) forwards}:host([readonly]) .rt-item,:host([readonly]) .rt-item:hover{cursor:default;pointer-events:none;transform:none}:host([disabled]) .rt{opacity:.4;pointer-events:none}:host([size="xs"]) .rt{gap:1px;font-size:12px}:host([size="sm"]) .rt{gap:2px;font-size:16px}:host([size="md"]) .rt,:host(:not([size])) .rt{gap:3px;font-size:22px}:host([size="lg"]) .rt{gap:4px;font-size:30px}:host([size="xl"]) .rt{gap:5px;font-size:40px}:host([color="kaki"]) .rt-item.is-filled{color:var(--color-kaki-500)}:host([color="kaki"]) .rt-item.is-preview{color:var(--color-kaki-400);opacity:.6}:host([color="washi"]) .rt-item.is-filled{color:var(--color-washi-900)}:host([color="washi"]) .rt-item.is-preview{color:var(--color-washi-600);opacity:.5}:host([color="celadon"]) .rt-item.is-filled{color:var(--color-celadon-500)}:host([color="celadon"]) .rt-item.is-preview{color:var(--color-celadon-400);opacity:.45}.rt-item-half{position:relative}.rt-half-fill{position:absolute;left:0;top:0;width:50%;overflow:hidden;color:var(--_gold);display:flex;align-items:center;pointer-events:none}.rt-half-fill svg{width:1em;height:1em;flex-shrink:0}:host([color="kaki"]) .rt-half-fill{color:var(--color-kaki-500)}:host([color="washi"]) .rt-half-fill{color:var(--color-washi-900)}:host([color="celadon"]) .rt-half-fill{color:var(--color-celadon-500)}.rt-num{font-family:var(--lib-font-mono);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);color:var(--text-muted);white-space:nowrap;line-height:1}.rt-num strong{font-family:var(--lib-font-display);font-weight:300;letter-spacing:var(--tracking-tight);color:var(--text-primary)}@media(prefers-reduced-motion:reduce){.rt-item{transition:none}.rt-item.is-pop{animation:none}}}';
+export {
+  ratingCss as default
+};
+//# sourceMappingURL=index219.js.map

package/dist/index219.js.map

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

package/dist/index22.js

@@ -0,0 +1,77 @@
+import { unsafeCSS, css, LitElement, html } from "lit";
+import { property, state, customElement } from "lit/decorators.js";
+import { getIcon } from "./index3.js";
+import sharedTokens from "./index196.js";
+import iconStyles from "./index231.js";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+let LibIcon = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.name = "";
+    this.size = "md";
+    this.variant = "default";
+    this._svgContent = "";
+  }
+  willUpdate(changedProperties) {
+    if (changedProperties.has("name")) {
+      this._loadIcon();
+    }
+  }
+  // 4. Buscamos el SVG en tu registro y lo guardamos en el estado
+  //TODO: Implementar nominale vs. generico
+  _loadIcon() {
+    const iconNominale = getIcon(this.name);
+    console.log(iconNominale);
+    if (iconNominale) {
+      this._svgContent = iconNominale ?? "";
+      this.requestUpdate();
+    } else {
+      this._svgContent = "";
+    }
+  }
+  render() {
+    const sizeVar = `var(--lib-font-size-${this.size})`;
+    const variantClass = this.variant !== "default" ? `variant-${this.variant}` : "";
+    return html`
+      <div
+        class="icon-wrapper ${variantClass}"
+        style="--lib-icon-size: ${sizeVar}"
+        aria-hidden="true"
+        .innerHTML="${this._svgContent}"
+      >
+      </div>
+    `;
+  }
+};
+LibIcon.styles = [
+  css`${unsafeCSS(sharedTokens)}`,
+  css`${unsafeCSS(iconStyles)}`
+];
+__decorateClass([
+  property({ type: String, reflect: true })
+], LibIcon.prototype, "name", 2);
+__decorateClass([
+  property({ type: String })
+], LibIcon.prototype, "size", 2);
+__decorateClass([
+  property({ type: String })
+], LibIcon.prototype, "variant", 2);
+__decorateClass([
+  state()
+], LibIcon.prototype, "_svgContent", 2);
+LibIcon = __decorateClass([
+  customElement("lib-icon")
+], LibIcon);
+export {
+  LibIcon
+};
+//# sourceMappingURL=index22.js.map

package/dist/index22.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index22.js","sources":["../src/components/atoms/icon/lib-icon.component.ts"],"sourcesContent":["import { LitElement, html, css, unsafeCSS, TemplateResult } from 'lit';\n// 1. Añadimos 'state' a las importaciones de lit/decorators\nimport { customElement, property, state } from 'lit/decorators.js'; \n//import { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { getIcon/*, ICON_REGISTRY*/ } from '../../../shared/icons/icon-registry';\nimport sharedTokens from '../../../styles/shared/tokens.css?inline';\nimport iconStyles from './lib-icon.css?inline';\n\n@customElement('lib-icon')\nexport class LibIcon extends LitElement {\n  static override styles = [\n    css`${unsafeCSS(sharedTokens)}`,\n    css`${unsafeCSS(iconStyles)}`,\n  ];\n\n  @property({ type: String, reflect: true }) name: string = '';\n  @property({ type: String }) size: string = 'md';\n  @property({ type: String }) variant: string = 'default';\n\n  // 2. DECLARAMOS EL ESTADO INTERNO (Esta es la pieza que faltaba)\n  @state() private _svgContent: string = '';\n\n  override willUpdate(changedProperties: Map<string, unknown>): void {\n    if (changedProperties.has('name')) {\n      this._loadIcon();\n    }\n  }\n\n  // 4. Buscamos el SVG en tu registro y lo guardamos en el estado\n  //TODO: Implementar nominale vs. generico\n  private _loadIcon(): void {\n    //const icon = ICON_REGISTRY[this.name];\n    const iconNominale = getIcon(this.name);\n    console.log(iconNominale);\n    if (iconNominale) {\n      this._svgContent = iconNominale ?? '';\n      this.requestUpdate();\n    } else {\n      this._svgContent = ''; // Si no existe, limpiamos\n      //console.warn(`Icono \"${this.name}\" no encontrado.`);\n    }\n  }\n\n  protected override render(): TemplateResult {\n    const sizeVar: string = `var(--lib-font-size-${this.size})`;\n    const variantClass: string = this.variant !== 'default' ? `variant-${this.variant}` : '';\n    \n\n    return html`\n      <div\n        class=\"icon-wrapper ${variantClass}\"\n        style=\"--lib-icon-size: ${sizeVar}\"\n        aria-hidden=\"true\"\n        .innerHTML=\"${this._svgContent}\"\n      >\n      </div>\n    `;\n  }\n}\n\n//        ${this._svgContent ? unsafeSVG(this._svgContent) : html`<span></span>`}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AASO,IAAM,UAAN,cAAsB,WAAW;AAAA,EAAjC,cAAA;AAAA,UAAA,GAAA,SAAA;AAMsC,SAAA,OAAe;AAC9B,SAAA,OAAe;AACf,SAAA,UAAkB;AAGrC,SAAQ,cAAsB;AAAA,EAAA;AAAA,EAE9B,WAAW,mBAA+C;AACjE,QAAI,kBAAkB,IAAI,MAAM,GAAG;AACjC,WAAK,UAAA;AAAA,IACP;AAAA,EACF;AAAA;AAAA;AAAA,EAIQ,YAAkB;AAExB,UAAM,eAAe,QAAQ,KAAK,IAAI;AACtC,YAAQ,IAAI,YAAY;AACxB,QAAI,cAAc;AAChB,WAAK,cAAc,gBAAgB;AACnC,WAAK,cAAA;AAAA,IACP,OAAO;AACL,WAAK,cAAc;AAAA,IAErB;AAAA,EACF;AAAA,EAEmB,SAAyB;AAC1C,UAAM,UAAkB,uBAAuB,KAAK,IAAI;AACxD,UAAM,eAAuB,KAAK,YAAY,YAAY,WAAW,KAAK,OAAO,KAAK;AAGtF,WAAO;AAAA;AAAA,8BAEmB,YAAY;AAAA,kCACR,OAAO;AAAA;AAAA,sBAEnB,KAAK,WAAW;AAAA;AAAA;AAAA;AAAA,EAIpC;AACF;AAjDa,QACK,SAAS;AAAA,EACvB,MAAM,UAAU,YAAY,CAAC;AAAA,EAC7B,MAAM,UAAU,UAAU,CAAC;AAC7B;AAE2C,gBAAA;AAAA,EAA1C,SAAS,EAAE,MAAM,QAAQ,SAAS,MAAM;AAAA,GAN9B,QAMgC,WAAA,QAAA,CAAA;AACf,gBAAA;AAAA,EAA3B,SAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAPf,QAOiB,WAAA,QAAA,CAAA;AACA,gBAAA;AAAA,EAA3B,SAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GARf,QAQiB,WAAA,WAAA,CAAA;AAGX,gBAAA;AAAA,EAAhB,MAAA;AAAM,GAXI,QAWM,WAAA,eAAA,CAAA;AAXN,UAAN,gBAAA;AAAA,EADN,cAAc,UAAU;AAAA,GACZ,OAAA;"}

package/dist/index220.js

@@ -0,0 +1,76 @@
+import { nothing, svg, html } from "lit";
+const SIZE_MAP = {
+  xs: { px: 40, stroke: 3 },
+  sm: { px: 64, stroke: 4 },
+  md: { px: 96, stroke: 6 },
+  lg: { px: 128, stroke: 7 },
+  xl: { px: 176, stroke: 6 }
+};
+function progressCircleTemplate(props) {
+  const { px, stroke: defaultStroke } = SIZE_MAP[props.size];
+  const sw = props.strokeWidth ?? defaultStroke;
+  const r = (px - sw) / 2;
+  const circ = 2 * Math.PI * r;
+  const offset = props.indeterminate ? 0 : circ * (1 - Math.min(props.value, props.max) / props.max);
+  const pct = Math.round(props.value / props.max * 100);
+  return html`
+    <div
+      class="pc"
+      style="width:${px}px; height:${px}px;"
+      role="progressbar"
+      aria-valuenow=${props.indeterminate ? nothing : props.value}
+      aria-valuemin="0"
+      aria-valuemax=${props.max}
+      aria-label=${props.indeterminate ? "Cargando…" : `${pct}%`}
+    >
+      ${svg`
+        <svg
+          width="${px}"
+          height="${px}"
+          viewBox="0 0 ${px} ${px}"
+          class="pc__svg ${props.indeterminate ? "pc__svg--spin" : ""}"
+        >
+          <circle
+            class="pc__track"
+            cx="${px / 2}"
+            cy="${px / 2}"
+            r="${r}"
+            stroke-width="${sw}"
+          />
+          <circle
+            class="pc__arc ${props.indeterminate ? "pc__arc--indet" : ""}"
+            cx="${px / 2}"
+            cy="${px / 2}"
+            r="${r}"
+            stroke-width="${sw}"
+            stroke-dasharray="${props.indeterminate ? `${circ * 0.3} ${circ}` : circ}"
+            stroke-dashoffset="${props.indeterminate ? 0 : offset}"
+            stroke-linecap="round"
+          />
+        </svg>
+      `}
+
+      ${!props.bare && !props.indeterminate ? html`
+        <div class="pc__label">
+          ${props.icon === "check" ? html`
+            <svg class="pc__check" width="28" height="28" viewBox="0 0 28 28" fill="none" aria-hidden="true">
+              <polyline
+                points="6,14 11,20 22,9"
+                stroke-width="2"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              />
+            </svg>
+          ` : html`
+            <span class="pc__value">${pct}%</span>
+            ${props.sub ? html`<span class="pc__sub">${props.sub}</span>` : nothing}
+          `}
+        </div>
+      ` : nothing}
+    </div>
+  `;
+}
+export {
+  progressCircleTemplate
+};
+//# sourceMappingURL=index220.js.map

package/dist/index220.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index220.js","sources":["../src/components/atoms/progress-circle/lib-progress-circle.component.html.ts"],"sourcesContent":["import { html, svg, nothing, TemplateResult } from 'lit';\n\nexport type LibProgressCircleSize    = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\nexport type LibProgressCircleVariant = 'default' | 'kaki' | 'celadon' | 'error';\n\n/** Dimensiones canónicas por tamaño */\nconst SIZE_MAP: Record<LibProgressCircleSize, { px: number; stroke: number }> = {\n  xs: { px: 40,  stroke: 3 },\n  sm: { px: 64,  stroke: 4 },\n  md: { px: 96,  stroke: 6 },\n  lg: { px: 128, stroke: 7 },\n  xl: { px: 176, stroke: 6 },\n};\n\nexport interface ProgressCircleTemplateProps {\n  value:         number;\n  max:           number;\n  size:          LibProgressCircleSize;\n  /** Sobreescribe el strokeWidth por defecto del tamaño */\n  strokeWidth:   number | null;\n  variant:       LibProgressCircleVariant;\n  indeterminate: boolean;\n  /** Oculta el label central */\n  bare:          boolean;\n  /** Subtítulo bajo el valor numérico */\n  sub:           string;\n  /** Icono SVG en el centro en lugar del texto */\n  icon:          'check' | null;\n}\n\n/**\n * Renderiza el SVG circular y el label central.\n *\n * Fórmula del arco:\n *   r           = (size - strokeWidth) / 2\n *   circumference = 2π × r\n *   offset      = circumference × (1 − value/max)\n *\n * El SVG se rota -90° en CSS para que el arco empiece arriba.\n */\nexport function progressCircleTemplate(props: ProgressCircleTemplateProps): TemplateResult {\n  const { px, stroke: defaultStroke } = SIZE_MAP[props.size];\n  const sw = props.strokeWidth ?? defaultStroke;\n\n  const r    = (px - sw) / 2;\n  const circ = 2 * Math.PI * r;\n\n  // Indeterminate: arco corto fijo; determinado: offset calculado\n  const offset = props.indeterminate\n    ? 0   // stroke-dasharray en CSS controla la longitud del segmento\n    : circ * (1 - Math.min(props.value, props.max) / props.max);\n\n  const pct = Math.round((props.value / props.max) * 100);\n\n  return html`\n    <div\n      class=\"pc\"\n      style=\"width:${px}px; height:${px}px;\"\n      role=\"progressbar\"\n      aria-valuenow=${props.indeterminate ? nothing : props.value}\n      aria-valuemin=\"0\"\n      aria-valuemax=${props.max}\n      aria-label=${props.indeterminate ? 'Cargando…' : `${pct}%`}\n    >\n      ${svg`\n        <svg\n          width=\"${px}\"\n          height=\"${px}\"\n          viewBox=\"0 0 ${px} ${px}\"\n          class=\"pc__svg ${props.indeterminate ? 'pc__svg--spin' : ''}\"\n        >\n          <circle\n            class=\"pc__track\"\n            cx=\"${px / 2}\"\n            cy=\"${px / 2}\"\n            r=\"${r}\"\n            stroke-width=\"${sw}\"\n          />\n          <circle\n            class=\"pc__arc ${props.indeterminate ? 'pc__arc--indet' : ''}\"\n            cx=\"${px / 2}\"\n            cy=\"${px / 2}\"\n            r=\"${r}\"\n            stroke-width=\"${sw}\"\n            stroke-dasharray=\"${props.indeterminate ? `${circ * 0.3} ${circ}` : circ}\"\n            stroke-dashoffset=\"${props.indeterminate ? 0 : offset}\"\n            stroke-linecap=\"round\"\n          />\n        </svg>\n      `}\n\n      ${!props.bare && !props.indeterminate ? html`\n        <div class=\"pc__label\">\n          ${props.icon === 'check' ? html`\n            <svg class=\"pc__check\" width=\"28\" height=\"28\" viewBox=\"0 0 28 28\" fill=\"none\" aria-hidden=\"true\">\n              <polyline\n                points=\"6,14 11,20 22,9\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              />\n            </svg>\n          ` : html`\n            <span class=\"pc__value\">${pct}%</span>\n            ${props.sub ? html`<span class=\"pc__sub\">${props.sub}</span>` : nothing}\n          `}\n        </div>\n      ` : nothing}\n    </div>\n  `;\n}"],"names":[],"mappings":";AAMA,MAAM,WAA0E;AAAA,EAC9E,IAAI,EAAE,IAAI,IAAK,QAAQ,EAAA;AAAA,EACvB,IAAI,EAAE,IAAI,IAAK,QAAQ,EAAA;AAAA,EACvB,IAAI,EAAE,IAAI,IAAK,QAAQ,EAAA;AAAA,EACvB,IAAI,EAAE,IAAI,KAAK,QAAQ,EAAA;AAAA,EACvB,IAAI,EAAE,IAAI,KAAK,QAAQ,EAAA;AACzB;AA4BO,SAAS,uBAAuB,OAAoD;AACzF,QAAM,EAAE,IAAI,QAAQ,kBAAkB,SAAS,MAAM,IAAI;AACzD,QAAM,KAAK,MAAM,eAAe;AAEhC,QAAM,KAAQ,KAAK,MAAM;AACzB,QAAM,OAAO,IAAI,KAAK,KAAK;AAG3B,QAAM,SAAS,MAAM,gBACjB,IACA,QAAQ,IAAI,KAAK,IAAI,MAAM,OAAO,MAAM,GAAG,IAAI,MAAM;AAEzD,QAAM,MAAM,KAAK,MAAO,MAAM,QAAQ,MAAM,MAAO,GAAG;AAEtD,SAAO;AAAA;AAAA;AAAA,qBAGY,EAAE,cAAc,EAAE;AAAA;AAAA,sBAEjB,MAAM,gBAAgB,UAAU,MAAM,KAAK;AAAA;AAAA,sBAE3C,MAAM,GAAG;AAAA,mBACZ,MAAM,gBAAgB,cAAc,GAAG,GAAG,GAAG;AAAA;AAAA,QAExD;AAAA;AAAA,mBAEW,EAAE;AAAA,oBACD,EAAE;AAAA,yBACG,EAAE,IAAI,EAAE;AAAA,2BACN,MAAM,gBAAgB,kBAAkB,EAAE;AAAA;AAAA;AAAA;AAAA,kBAInD,KAAK,CAAC;AAAA,kBACN,KAAK,CAAC;AAAA,iBACP,CAAC;AAAA,4BACU,EAAE;AAAA;AAAA;AAAA,6BAGD,MAAM,gBAAgB,mBAAmB,EAAE;AAAA,kBACtD,KAAK,CAAC;AAAA,kBACN,KAAK,CAAC;AAAA,iBACP,CAAC;AAAA,4BACU,EAAE;AAAA,gCACE,MAAM,gBAAgB,GAAG,OAAO,GAAG,IAAI,IAAI,KAAK,IAAI;AAAA,iCACnD,MAAM,gBAAgB,IAAI,MAAM;AAAA;AAAA;AAAA;AAAA,OAI1D;AAAA;AAAA,QAEC,CAAC,MAAM,QAAQ,CAAC,MAAM,gBAAgB;AAAA;AAAA,YAElC,MAAM,SAAS,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cASvB;AAAA,sCACwB,GAAG;AAAA,cAC3B,MAAM,MAAM,6BAA6B,MAAM,GAAG,YAAY,OAAO;AAAA,WACxE;AAAA;AAAA,UAED,OAAO;AAAA;AAAA;AAGjB;"}

package/dist/index221.js

@@ -0,0 +1,5 @@
+const progressCss = '@layer tokens,reset,components;@layer reset{:host{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;flex-shrink:0}*,*:before,*:after{box-sizing:border-box}}@layer components{.pc{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.pc__svg{display:block;transform:rotate(-90deg);transform-origin:center;overflow:visible}.pc__track,.pc__arc{fill:none;stroke-linecap:round}.pc__track{stroke:var(--color-washi-200)}.pc__arc{stroke:var(--color-washi-900);transition:stroke-dashoffset .7s cubic-bezier(0,0,.2,1),stroke .3s}:host([variant="kaki"]) .pc__arc{stroke:var(--color-kaki-500)}:host([variant="kaki"]) .pc__track{stroke:var(--color-kaki-100)}:host([variant="celadon"]) .pc__arc{stroke:var(--color-celadon-500)}:host([variant="celadon"]) .pc__track{stroke:var(--color-celadon-100)}:host([variant="error"]) .pc__arc{stroke:var(--color-error)}:host([variant="error"]) .pc__track{stroke:#f5ddd9}.pc__label{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;pointer-events:none}.pc__value{font-family:var(--lib-font-mono);font-weight:var(--weight-regular);letter-spacing:var(--tracking-wide);color:var(--text-primary);line-height:1}.pc__sub{font-family:var(--lib-font-mono);letter-spacing:var(--tracking-widest);text-transform:uppercase;color:var(--text-muted);line-height:1}:host([size="xs"]) .pc__label{display:none}:host([size="sm"]) .pc__value{font-size:var(--text-xs)}:host([size="sm"]) .pc__sub{font-size:8px}:host([size="md"]) .pc__value{font-size:var(--text-md)}:host([size="md"]) .pc__sub{font-size:9px}:host([size="lg"]) .pc__value{font-size:var(--text-xl)}:host([size="lg"]) .pc__sub{font-size:var(--text-xs)}:host([size="xl"]) .pc__value{font-size:2rem}:host([size="xl"]) .pc__sub{font-size:var(--text-xs)}:host([variant="kaki"]) .pc__value{color:var(--color-kaki-600)}:host([variant="celadon"]) .pc__value{color:var(--color-celadon-600)}:host([variant="error"]) .pc__value{color:var(--color-error)}.pc__check polyline{stroke:var(--color-celadon-500)}:host([variant="kaki"]) .pc__check polyline{stroke:var(--color-kaki-500)}@keyframes pc-spin{to{transform:rotate(270deg)}}.pc__svg--spin{animation:pc-spin 1.2s linear infinite;transform-origin:center}.pc__arc--indet{transition:none}@media(prefers-reduced-motion:reduce){.pc__arc{transition:none}.pc__svg--spin{animation:none}}}';
+export {
+  progressCss as default
+};
+//# sourceMappingURL=index221.js.map

package/dist/index221.js.map

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

package/dist/index222.js

@@ -0,0 +1,13 @@
+import { nothing, html } from "lit";
+function badgeTemplate(props) {
+  return html`
+    <span class="badge">
+      ${props.dot ? html`<span class="badge__dot" aria-hidden="true"></span>` : nothing}
+      <slot></slot>
+    </span>
+  `;
+}
+export {
+  badgeTemplate
+};
+//# sourceMappingURL=index222.js.map

package/dist/index222.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index222.js","sources":["../src/components/atoms/badge/lib-badge.html.ts"],"sourcesContent":["import { html, nothing, TemplateResult } from 'lit';\n\n/**\n * Variantes visuales del badge.\n * TODO: mover a src/models/ui/ cuando se integre en el monorepo.\n */\nexport type LibBadgeVariant =\n  | 'default'\n  | 'accent'\n  | 'celadon'\n  | 'dark'\n  | 'error'\n  | 'success'\n  | 'warning';\n\nexport type LibBadgeSize = 'sm' | 'md';\n\nexport interface BadgeTemplateProps {\n  variant: LibBadgeVariant;\n  size: LibBadgeSize;\n  dot: boolean;\n  pill: boolean;\n}\n\n/**\n * Plantilla para lib-badge.\n * El contenido se proyecta mediante <slot> para máxima flexibilidad.\n */\nexport function badgeTemplate(props: BadgeTemplateProps): TemplateResult {\n  return html`\n    <span class=\"badge\">\n      ${props.dot ? html`<span class=\"badge__dot\" aria-hidden=\"true\"></span>` : nothing}\n      <slot></slot>\n    </span>\n  `;\n}"],"names":[],"mappings":";AA4BO,SAAS,cAAc,OAA2C;AACvE,SAAO;AAAA;AAAA,QAED,MAAM,MAAM,4DAA4D,OAAO;AAAA;AAAA;AAAA;AAIvF;"}

package/dist/index223.js

@@ -0,0 +1,5 @@
+const badgeCss = '@layer tokens,reset,components;@layer reset{:host{display:inline-block;vertical-align:middle}*,*:before,*:after{box-sizing:border-box}}@layer components{.badge{display:inline-flex;align-items:center;gap:var(--lib-space-xs);font-family:var(--lib-font-mono);font-size:10px;font-weight:var(--weight-medium);letter-spacing:var(--tracking-wider);text-transform:uppercase;white-space:nowrap;line-height:1;padding:var(--lib-space-xs) var(--lib-space-sm);border:var(--lib-border-width) solid transparent;border-radius:var(--lib-radius-xs);-webkit-user-select:none;user-select:none}:host([size="md"]) .badge,.badge{padding:var(--lib-space-xs) var(--lib-space-sm);font-size:10px}:host([size="sm"]) .badge{padding:2px var(--lib-space-xs);font-size:9px;letter-spacing:var(--tracking-wide)}:host([pill]) .badge{border-radius:var(--radius-full);padding-inline:var(--lib-space-md)}.badge__dot{display:inline-block;width:5px;height:5px;border-radius:var(--radius-full);background:currentcolor;opacity:.75;flex-shrink:0}:host([variant="default"]) .badge,.badge{background:var(--color-washi-100);color:var(--text-secondary);border-color:var(--border-default)}:host([variant="accent"]) .badge{background:var(--color-kaki-50);color:var(--color-kaki-600);border-color:var(--color-kaki-200)}:host([variant="celadon"]) .badge{background:var(--color-celadon-50);color:var(--color-celadon-600);border-color:var(--color-celadon-200)}:host([variant="dark"]) .badge{background:var(--color-washi-900);color:var(--color-washi-300);border-color:var(--color-washi-700)}:host([variant="error"]) .badge{background:#fcf3f3;color:var(--color-error);border-color:#e7c4c5}:host([variant="success"]) .badge{background:#f1f7f2;color:var(--color-success);border-color:#bcd6c0}:host([variant="warning"]) .badge{background:#fcf4e6;color:var(--color-warning);border-color:#e6d1b0}}';
+export {
+  badgeCss as default
+};
+//# sourceMappingURL=index223.js.map

package/dist/index223.js.map

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

package/dist/index224.js

@@ -0,0 +1,29 @@
+import { nothing, html } from "lit";
+function switchTemplate(props) {
+  return html`
+    <label class="sw" for=${props.switchId}>
+      <input
+        id=${props.switchId}
+        class="sw-input"
+        type="checkbox"
+        ?checked=${props.checked}
+        ?disabled=${props.disabled}
+        aria-checked=${props.checked ? "true" : "false"}
+        @change=${props.handleChange}
+      >
+      <span class="sw-track" aria-hidden="true">
+        <span class="sw-thumb"></span>
+      </span>
+      ${props.label ? html`
+        <span class="sw-label">
+          <span class="sw-label-text">${props.label}</span>
+          ${props.sub ? html`<span class="sw-label-sub">${props.sub}</span>` : nothing}
+        </span>
+      ` : nothing}
+    </label>
+  `;
+}
+export {
+  switchTemplate
+};
+//# sourceMappingURL=index224.js.map

package/dist/index224.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index224.js","sources":["../src/components/atoms/switch/lib-switch.html.ts"],"sourcesContent":["import { html, nothing, TemplateResult } from 'lit';\n\nexport type LibSwitchVariant = 'default' | 'kintsugi';\nexport type LibSwitchSize    = 'sm' | 'md' | 'lg';\n\nexport interface SwitchTemplateProps {\n  switchId:  string;\n  checked:   boolean;\n  disabled:  boolean;\n  label:     string;\n  sub:       string;\n  handleChange: (e: Event) => void;\n}\n\n/**\n * Template para lib-switch.\n *\n * Estructura:\n *   label.sw\n *     input[type=checkbox]  — oculto, accesible\n *     span.sw-track\n *       span.sw-thumb\n *     span.sw-label          — (opcional) si hay label\n *       span.sw-label-text\n *       span.sw-label-sub    — (opcional) si hay sub\n *\n * El estado visual (checked, disabled, variant, size) se controla\n * íntegramente desde :host([attr]) en el CSS — el template es estático.\n */\nexport function switchTemplate(props: SwitchTemplateProps): TemplateResult {\n  return html`\n    <label class=\"sw\" for=${props.switchId}>\n      <input\n        id=${props.switchId}\n        class=\"sw-input\"\n        type=\"checkbox\"\n        ?checked=${props.checked}\n        ?disabled=${props.disabled}\n        aria-checked=${props.checked ? 'true' : 'false'}\n        @change=${props.handleChange}\n      >\n      <span class=\"sw-track\" aria-hidden=\"true\">\n        <span class=\"sw-thumb\"></span>\n      </span>\n      ${props.label ? html`\n        <span class=\"sw-label\">\n          <span class=\"sw-label-text\">${props.label}</span>\n          ${props.sub ? html`<span class=\"sw-label-sub\">${props.sub}</span>` : nothing}\n        </span>\n      ` : nothing}\n    </label>\n  `;\n}"],"names":[],"mappings":";AA6BO,SAAS,eAAe,OAA4C;AACzE,SAAO;AAAA,4BACmB,MAAM,QAAQ;AAAA;AAAA,aAE7B,MAAM,QAAQ;AAAA;AAAA;AAAA,mBAGR,MAAM,OAAO;AAAA,oBACZ,MAAM,QAAQ;AAAA,uBACX,MAAM,UAAU,SAAS,OAAO;AAAA,kBACrC,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA,QAK5B,MAAM,QAAQ;AAAA;AAAA,wCAEkB,MAAM,KAAK;AAAA,YACvC,MAAM,MAAM,kCAAkC,MAAM,GAAG,YAAY,OAAO;AAAA;AAAA,UAE5E,OAAO;AAAA;AAAA;AAGjB;"}

package/dist/index225.js

@@ -0,0 +1,5 @@
+const switchCss = '@layer tokens,reset,components;@layer reset{:host{display:inline-flex;align-items:center;vertical-align:middle}*,*:before,*:after{box-sizing:border-box}}@layer components{.sw{display:inline-flex;align-items:center;gap:var(--lib-space-sm);cursor:pointer;-webkit-user-select:none;user-select:none}.sw-input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}.sw-track{position:relative;flex-shrink:0;width:40px;height:24px;border-radius:var(--radius-full);background:var(--color-washi-300);transition:background var(--duration-base) var(--ease-default),box-shadow var(--duration-slow) var(--ease-out)}.sw-thumb{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:var(--radius-full);background:var(--color-white);box-shadow:var(--shadow-sm);transition:transform var(--duration-base) var(--ease-bounce),width var(--duration-base) var(--ease-default),background var(--duration-slow) var(--ease-default)}.sw-label{display:flex;flex-direction:column;gap:2px}.sw-label-text{font-family:var(--lib-font-body);font-size:var(--text-base);color:var(--text-primary);line-height:var(--leading-snug);transition:color var(--duration-base) var(--ease-default)}.sw-label-sub{font-family:var(--lib-font-mono);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);color:var(--text-muted);line-height:var(--leading-snug)}:host([checked]) .sw-track{background:var(--color-washi-900)}:host([checked]) .sw-thumb{transform:translate(16px)}.sw:hover .sw-thumb{width:22px}:host([checked]) .sw:hover .sw-thumb{transform:translate(12px)}:host([disabled]){pointer-events:none}:host([disabled]) .sw{opacity:.35;cursor:not-allowed}.sw-input:focus-visible~.sw-track{outline:2px solid var(--color-washi-700);outline-offset:2px}:host([size="sm"]) .sw-track{width:30px;height:18px}:host([size="sm"]) .sw-thumb{width:12px;height:12px;top:2px;left:2px}:host([size="sm"][checked]) .sw-thumb{transform:translate(12px)}:host([size="sm"]) .sw:hover .sw-thumb{width:15px}:host([size="sm"][checked]) .sw:hover .sw-thumb{transform:translate(9px)}:host([size="lg"]) .sw-track{width:52px;height:30px}:host([size="lg"]) .sw-thumb{width:22px;height:22px;top:3px;left:3px}:host([size="lg"][checked]) .sw-thumb{transform:translate(22px)}:host([size="lg"]) .sw:hover .sw-thumb{width:27px}:host([size="lg"][checked]) .sw:hover .sw-thumb{transform:translate(17px)}@keyframes kin-pulse{0%,to{opacity:.45}50%{opacity:1}}@keyframes kin-pulse-on{0%,to{opacity:.7}50%{opacity:1}}@keyframes kin-thumb-glow{0%,to{box-shadow:0 0 6px 1px #be96324d}50%{box-shadow:0 0 14px 3px #be96328c}}:host([variant="kintsugi"]){--gold-bright: oklch(80% .09 78deg);--gold-mid: oklch(72% .06 68deg);--gold-deep: oklch(62% .05 60deg)}:host([variant="kintsugi"]) .sw-track{background:#0c0402;overflow:visible}:host([variant="kintsugi"]) .sw-track:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius-full);padding:1px;background:var(--lib-kintsugi-border);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:xor;-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;animation:kin-pulse 3.5s ease-in-out infinite}:host([variant="kintsugi"]) .sw-thumb{background:#221812;box-shadow:none}:host([variant="kintsugi"][checked]) .sw-track{background:#1e0d01}:host([variant="kintsugi"][checked]) .sw-track:before{animation:kin-pulse-on 2.4s ease-in-out infinite}:host([variant="kintsugi"][checked]) .sw-thumb{background:linear-gradient(135deg,var(--gold-bright) 0%,var(--gold-mid) 60%,var(--gold-deep) 100%);animation:kin-thumb-glow 2.4s ease-in-out infinite}:host([variant="kintsugi"]) .sw-input:focus-visible~.sw-track:before{opacity:1;animation:none}:host([variant="kintsugi"]) .sw-label-text{color:#afa299}:host([variant="kintsugi"]) .sw-label-sub{color:#51453e}:host([variant="kintsugi"][checked]) .sw-label-text{color:#dfcab2}@media(prefers-reduced-motion:reduce){.sw-thumb,.sw-track{transition:none}:host([variant="kintsugi"]) .sw-track:before,:host([variant="kintsugi"][checked]) .sw-track:before,:host([variant="kintsugi"][checked]) .sw-thumb{animation:none}}}';
+export {
+  switchCss as default
+};
+//# sourceMappingURL=index225.js.map

package/dist/index225.js.map

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

package/dist/index226.js

@@ -0,0 +1,21 @@
+import { html } from "lit";
+function selectOptionTemplate(props) {
+  return html`
+    <div
+      class="option"
+      role="option"
+      aria-selected="${props.selected}"
+      aria-disabled="${props.disabled}"
+      @click="${props.handleClick}"
+    >
+      <span class="option-label">
+        <slot></slot>
+      </span>
+      <span class="option-check" aria-hidden="true"></span>
+    </div>
+  `;
+}
+export {
+  selectOptionTemplate
+};
+//# sourceMappingURL=index226.js.map

package/dist/index226.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index226.js","sources":["../src/components/atoms/select-option/lib-select-option.html.ts"],"sourcesContent":["import { html, TemplateResult } from 'lit';\nimport type { SelectOptionTemplateProps } from './lib-select-option.types';\n\nexport function selectOptionTemplate(props: SelectOptionTemplateProps): TemplateResult {\n  return html`\n    <div\n      class=\"option\"\n      role=\"option\"\n      aria-selected=\"${props.selected}\"\n      aria-disabled=\"${props.disabled}\"\n      @click=\"${props.handleClick}\"\n    >\n      <span class=\"option-label\">\n        <slot></slot>\n      </span>\n      <span class=\"option-check\" aria-hidden=\"true\"></span>\n    </div>\n  `;\n}"],"names":[],"mappings":";AAGO,SAAS,qBAAqB,OAAkD;AACrF,SAAO;AAAA;AAAA;AAAA;AAAA,uBAIc,MAAM,QAAQ;AAAA,uBACd,MAAM,QAAQ;AAAA,gBACrB,MAAM,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQjC;"}

package/dist/index227.js

@@ -0,0 +1,5 @@
+const optionCss = `@layer tokens,reset,components;@layer reset{:host{display:block}:host:is([search-hidden]){display:none}*,*:before,*:after{box-sizing:border-box}}@layer components{.option{display:flex;align-items:center;gap:var(--lib-space-sm);padding:var(--lib-space-sm) var(--lib-space-md);cursor:pointer;transition:background var(--duration-fast) var(--ease-default),color var(--duration-fast) var(--ease-default)}:host(:not([disabled],[selected]):hover) .option{background:var(--bg-surface)}:host([selected]) .option{background:var(--color-washi-100)}:host([disabled]) .option{opacity:.38;cursor:not-allowed;pointer-events:none}.option-label{flex:1;min-width:0;font-family:var(--lib-font-body);font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-snug);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-user-select:none;user-select:none}:host(:hover) .option-label{color:var(--text-primary)}:host([selected]) .option-label{color:var(--text-primary)}:host([disabled]) .option-label{color:var(--text-muted)}.option-check{flex-shrink:0;width:14px;height:14px;opacity:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 256 256'%3E%3Cpath fill='%23221C16' d='M229.66 77.66l-128 128a8 8 0 0 1-11.32 0l-56-56a8 8 0 0 1 11.32-11.32L96 188.69 218.34 66.34a8 8 0 0 1 11.32 11.32Z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:contain;transition:opacity var(--duration-fast) var(--ease-default)}:host([selected]) .option-check{opacity:1}}`;
+export {
+  optionCss as default
+};
+//# sourceMappingURL=index227.js.map

package/dist/index227.js.map

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

package/dist/index228.js

@@ -0,0 +1,5 @@
+const cardStyles = '@layer tokens,reset,components;@layer reset{:host{display:block;container-type:inline-size}*,*:before,*:after{box-sizing:border-box}}@layer components{.card{display:flex;flex-direction:column;background:var(--bg-elevated);border:1px solid var(--border-subtle);padding:var(--lib-space-lg);height:100%;position:relative;overflow:hidden;transition:box-shadow var(--duration-slow) var(--ease-out),transform var(--duration-slow) var(--ease-out),border-color var(--duration-slow) var(--ease-out)}@media(hover:hover){.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--border-default)}}.card-kanji{position:absolute;top:.75rem;right:.75rem;font-family:var(--lib-font-display, "Cormorant Garamond", serif);font-size:5rem;font-weight:300;line-height:1;color:#0000000a;-webkit-user-select:none;user-select:none;pointer-events:none;z-index:0}:host([variant="inverse"]) .card-kanji,:host([variant="featured"]) .card-kanji,:host([variant="kintsugi"]) .card-kanji,:host([variant="glitch"]) .card-kanji,:host([variant="celadon"]) .card-kanji{color:#ffffff0a}:host([variant="kintsugi"]) .card-kanji{color:#b85a1e14}.card-header,.card-content,.card-footer{position:relative;z-index:1}.card-header{margin-bottom:var(--lib-space-md);display:flex;align-items:center;gap:var(--lib-space-sm);min-height:var(--lib-space-md)}::slotted([slot="tag"]){font-family:var(--lib-font-mono);font-size:10px;text-transform:uppercase;letter-spacing:var(--tracking-widest);color:var(--text-muted)}.card-content{flex-grow:1;display:flex;flex-direction:column;gap:var(--lib-space-sm)}::slotted([slot="title"]){margin:0;font-family:var(--lib-font-display);font-size:var(--text-2xl);font-weight:var(--weight-light);line-height:var(--leading-snug);letter-spacing:var(--tracking-tight);color:var(--text-secondary)}.card-body{font-family:var(--lib-font-body);font-size:var(--text-sm);line-height:var(--leading-relaxed);color:var(--color-washi-500)}.card-footer{margin-top:var(--lib-space-lg);padding-top:var(--lib-space-md);border-top:1px solid var(--border-subtle);display:flex;justify-content:space-between;align-items:center;font-family:var(--lib-font-mono);font-size:10px;letter-spacing:var(--tracking-wider);color:var(--text-muted);min-height:var(--lib-space-lg)}::slotted([slot="footer"]){display:contents}:host([variant="inverse"]) .card{background:var(--color-washi-900);border-color:var(--color-washi-800)}:host([variant="inverse"]) ::slotted([slot="title"]){color:var(--color-washi-50)}:host([variant="inverse"]) .card-body{color:var(--color-washi-400)}:host([variant="inverse"]) .card-footer{border-top-color:var(--color-washi-800);color:var(--color-washi-600)}:host([variant="inverse"]) ::slotted([slot="tag"]){color:var(--color-washi-500)}:host([variant="accent"]) .card{border-left:3px solid var(--card-accent-color, var(--color-kaki-400));padding-left:calc(var(--lib-space-lg) - 3px)}:host([variant="featured"]) .card{background:linear-gradient(135deg,#b85a1e14,#b85a1e05);border-color:transparent;border-left:2px solid var(--color-kaki-500, #B85A1E)}:host([variant="featured"]) .card:before{display:none}:host([variant="featured"]) ::slotted([slot="tag"]){color:#b85a1e4d}:host([variant="featured"]) ::slotted([slot="title"]){font-size:var(--text-3xl);color:var(--color-kaki-400, #D97234);line-height:1.1}:host([variant="featured"]) .card-body{color:#faf7f44d;font-size:var(--text-base)}:host([variant="featured"]) .card-footer{border-top-color:#ffffff0f;color:#faf7f433;margin-top:var(--lib-space-xl)}@keyframes kintsugi-seam{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes kintsugi-gold{0%{background-position:-200% 0}to{background-position:200% 0}}:host([variant="kintsugi"]) .card{background:var(--color-washi-950, #120E0A);border-color:#b85a1e26}:host([variant="kintsugi"]) .card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgb(184,90,30,.4) 15%,var(--color-kaki-400, #D97234) 35%,#F5D08A 50%,var(--color-kaki-400, #D97234) 65%,rgb(184,90,30,.4) 85%,transparent);background-size:200% 100%;animation:kintsugi-seam 5s linear infinite;pointer-events:none}:host([variant="kintsugi"]) ::slotted([slot="title"]){background:linear-gradient(90deg,var(--color-kaki-600, #8C4115),#F5D08A,var(--color-kaki-400, #D97234),#F5D08A,var(--color-kaki-600, #8C4115));background-size:200% 100%;animation:kintsugi-gold 4s linear infinite;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;color:transparent}:host([variant="kintsugi"]) ::slotted([slot="tag"]){color:#b85a1e59}:host([variant="kintsugi"]) .card-body{color:#faf7f440}:host([variant="kintsugi"]) .card-footer{border-top-color:#ffffff0f;color:#faf7f42e}@media(hover:hover){:host([variant="kintsugi"]) .card:hover{transform:none;box-shadow:0 0 32px #b85a1e1f;border-color:#b85a1e40}}@keyframes glitch-drift{0%,88%,to{transform:none;opacity:1}89%{transform:translate(-2px);opacity:.8}90%{transform:translate(2px);opacity:.9}91%{transform:none;opacity:1}}:host([variant="glitch"]) .card{background:var(--color-washi-950, #120E0A);border-color:#ffffff0f;animation:glitch-drift 7s steps(1) infinite}:host([variant="glitch"]) .card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--color-celadon-400, #4E9482);pointer-events:none}:host([variant="glitch"]) .card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgb(250,247,244,.012) 3px,rgb(250,247,244,.012) 4px);pointer-events:none;z-index:0}:host([variant="glitch"]) ::slotted([slot="tag"]){font-family:var(--lib-font-mono);color:var(--color-celadon-400, #4E9482);letter-spacing:.18em}:host([variant="glitch"]) ::slotted([slot="title"]){font-family:var(--lib-font-mono);font-size:var(--text-base);letter-spacing:.15em;text-transform:uppercase;color:var(--color-kaki-400, #D97234)}:host([variant="glitch"]) .card-body{font-family:var(--lib-font-mono);font-size:.65rem;letter-spacing:.08em;color:#faf7f433;line-height:1.9}:host([variant="glitch"]) .card-footer{border-top-color:#ffffff0f;color:#faf7f426}:host([variant="glitch"]) .card-kanji{color:#4e94820f}@media(hover:hover){:host([variant="glitch"]) .card:hover{transform:none;box-shadow:-2px 0 #d9723433,2px 0 #4e948226}}:host([variant="celadon"]) .card{background:var(--color-washi-950, #120E0A);border-color:#4e948226}:host([variant="celadon"]) .card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--color-celadon-400, #4E9482);pointer-events:none}:host([variant="celadon"]) ::slotted([slot="tag"]){color:#4e948280}:host([variant="celadon"]) ::slotted([slot="title"]){color:var(--color-celadon-400, #4E9482)}:host([variant="celadon"]) .card-body{color:#faf7f440}:host([variant="celadon"]) .card-footer{border-top-color:#ffffff0f;color:#faf7f42e}:host([variant="celadon"]) .card-kanji{color:#4e94820f}@media(hover:hover){:host([variant="celadon"]) .card:hover{transform:none;box-shadow:0 0 28px #4e94821a;border-color:#4e94824d}}:host([variant="washi"]) .card{background:var(--color-washi-50, #FAF7F4);border-color:var(--color-washi-200, #E5DDD3)}:host([variant="washi"]) .card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--color-washi-400, #B8A99A);pointer-events:none}:host([variant="washi"]) ::slotted([slot="tag"]){color:var(--color-washi-500, #9A8878)}:host([variant="washi"]) ::slotted([slot="title"]){color:var(--color-washi-800, #3D332A)}:host([variant="washi"]) .card-body{color:var(--color-washi-600, #7A6A5C)}:host([variant="washi"]) .card-footer{border-top-color:var(--color-washi-200, #E5DDD3);color:var(--color-washi-400, #B8A99A)}:host([variant="washi"]) .card-kanji{color:#0000000d}@media(hover:hover){:host([variant="washi"]) .card:hover{border-color:var(--color-washi-300, #D3C8BC);box-shadow:var(--shadow-md)}}}';
+export {
+  cardStyles as default
+};
+//# sourceMappingURL=index228.js.map

package/dist/index228.js.map

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

package/dist/index229.js

@@ -0,0 +1,36 @@
+import { nothing, html } from "lit";
+function cardTemplate(props) {
+  return html`
+    <article
+      class="card"
+      role="${props.clickable ? "button" : nothing}"
+      tabindex="${props.clickable ? "0" : nothing}"
+      @click="${props.clickable ? props.onClick : nothing}"
+      style="${props.variant === "accent" && props.accentColor ? `--card-accent-color: ${props.accentColor}` : nothing}"
+    >
+      <!-- Kanji watermark — aria-hidden, decorativo -->
+      ${props.kanji ? html`<span class="card-kanji" aria-hidden="true"
+            >${props.kanji}</span
+          >` : nothing}
+
+      <header class="card-header">
+        <slot name="tag"></slot>
+      </header>
+
+      <div class="card-content">
+        <slot name="title"></slot>
+        <div class="card-body">
+          <slot></slot>
+        </div>
+      </div>
+
+      <footer class="card-footer">
+        <slot name="footer"></slot>
+      </footer>
+    </article>
+  `;
+}
+export {
+  cardTemplate
+};
+//# sourceMappingURL=index229.js.map

package/dist/index229.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index229.js","sources":["../src/components/atoms/card/lib-card.html.ts"],"sourcesContent":["import { html, nothing, TemplateResult } from \"lit\";\nimport type { LibCardVariant } from \"./lib-card.component\";\n\nexport interface CardTemplateProps {\n  variant: LibCardVariant;\n  accentColor: string | undefined;\n  kanji: string;\n  clickable: boolean;\n  onClick: (e: MouseEvent) => void;\n}\n\n/**\n * Plantilla base para el componente lib-card.\n * Contenedor editorial con slots: tag, title, default (body), footer.\n * Soporta marca de agua kanji opcional en la esquina superior derecha.\n */\nexport function cardTemplate(props: CardTemplateProps): TemplateResult {\n  return html`\n    <article\n      class=\"card\"\n      role=\"${props.clickable ? \"button\" : nothing}\"\n      tabindex=\"${props.clickable ? \"0\" : nothing}\"\n      @click=\"${props.clickable ? props.onClick : nothing}\"\n      style=\"${props.variant === \"accent\" && props.accentColor\n        ? `--card-accent-color: ${props.accentColor}`\n        : nothing}\"\n    >\n      <!-- Kanji watermark — aria-hidden, decorativo -->\n      ${props.kanji\n        ? html`<span class=\"card-kanji\" aria-hidden=\"true\"\n            >${props.kanji}</span\n          >`\n        : nothing}\n\n      <header class=\"card-header\">\n        <slot name=\"tag\"></slot>\n      </header>\n\n      <div class=\"card-content\">\n        <slot name=\"title\"></slot>\n        <div class=\"card-body\">\n          <slot></slot>\n        </div>\n      </div>\n\n      <footer class=\"card-footer\">\n        <slot name=\"footer\"></slot>\n      </footer>\n    </article>\n  `;\n}\n"],"names":[],"mappings":";AAgBO,SAAS,aAAa,OAA0C;AACrE,SAAO;AAAA;AAAA;AAAA,cAGK,MAAM,YAAY,WAAW,OAAO;AAAA,kBAChC,MAAM,YAAY,MAAM,OAAO;AAAA,gBACjC,MAAM,YAAY,MAAM,UAAU,OAAO;AAAA,eAC1C,MAAM,YAAY,YAAY,MAAM,cACzC,wBAAwB,MAAM,WAAW,KACzC,OAAO;AAAA;AAAA;AAAA,QAGT,MAAM,QACJ;AAAA,eACK,MAAM,KAAK;AAAA,eAEhB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBjB;"}