@fab1o978/react-ui 0.1.0

package/dist/components/Timeline/index.cjs

@@ -0,0 +1,169 @@
+'use strict';
+
+require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/components/Timeline/Timeline.tsx
+
+// src/components/Timeline/Timeline.module.scss
+var Timeline_module_default = {
+  timeline: "Timeline_module_timeline2",
+  vertical: "Timeline_module_vertical2",
+  item: "Timeline_module_item2",
+  track: "Timeline_module_track2",
+  connector: "Timeline_module_connector2",
+  content: "Timeline_module_content2",
+  last: "Timeline_module_last2",
+  horizontal: "Timeline_module_horizontal2",
+  dot: "Timeline_module_dot2",
+  iconSlot: "Timeline_module_iconSlot2",
+  completed: "Timeline_module_completed2",
+  dotIn: "Timeline_module_dotIn2",
+  active: "Timeline_module_active2",
+  pulse: "Timeline_module_pulse2",
+  pending: "Timeline_module_pending2",
+  label: "Timeline_module_label2",
+  title: "Timeline_module_title2",
+  description: "Timeline_module_description2",
+  connectorHidden: "Timeline_module_connectorHidden2",
+  connectorDone: "Timeline_module_connectorDone2"
+};
+
+// src/utils/color.ts
+function hexToHsl(hex) {
+  const r = parseInt(hex.slice(1, 3), 16) / 255;
+  const g = parseInt(hex.slice(3, 5), 16) / 255;
+  const b = parseInt(hex.slice(5, 7), 16) / 255;
+  const max = Math.max(r, g, b);
+  const min = Math.min(r, g, b);
+  const l = (max + min) / 2;
+  let h = 0;
+  let s = 0;
+  if (max !== min) {
+    const d = max - min;
+    s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
+    switch (max) {
+      case r:
+        h = ((g - b) / d + (g < b ? 6 : 0)) / 6;
+        break;
+      case g:
+        h = ((b - r) / d + 2) / 6;
+        break;
+      case b:
+        h = ((r - g) / d + 4) / 6;
+        break;
+    }
+  }
+  return [h * 360, s * 100, l * 100];
+}
+function hslToHex(h, s, l) {
+  const sl = s / 100;
+  const ll = l / 100;
+  const a = sl * Math.min(ll, 1 - ll);
+  const f = (n) => {
+    const k = (n + h / 30) % 12;
+    const color = ll - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+    return Math.round(255 * color).toString(16).padStart(2, "0");
+  };
+  return `#${f(0)}${f(8)}${f(4)}`;
+}
+function hslToRgb(h, s, l) {
+  const sl = s / 100;
+  const ll = l / 100;
+  const a = sl * Math.min(ll, 1 - ll);
+  const f = (n) => {
+    const k = (n + h / 30) % 12;
+    return Math.round(255 * (ll - a * Math.max(Math.min(k - 3, 9 - k, 1), -1)));
+  };
+  return { r: f(0), g: f(8), b: f(4) };
+}
+function hslToRgba(h, s, l, alpha) {
+  const { r, g, b } = hslToRgb(h, s, l);
+  return `rgba(${r}, ${g}, ${b}, ${alpha})`;
+}
+function deriveAccent(hex) {
+  const [h, s, l] = hexToHsl(hex);
+  return {
+    base: hex,
+    dot: hslToHex(h, s, Math.min(l + 12, 95)),
+    track: hex,
+    ring: hex,
+    glow: hslToRgba(h, s, l, 0.3),
+    light: hslToHex(h, Math.max(s - 20, 0), Math.min(l + 45, 96))
+  };
+}
+function accentToCssVars(tokens, prefix) {
+  return {
+    [`--${prefix}-accent`]: tokens.base,
+    [`--${prefix}-accent-dot`]: tokens.dot,
+    [`--${prefix}-accent-track`]: tokens.track,
+    [`--${prefix}-accent-ring`]: tokens.ring,
+    [`--${prefix}-accent-glow`]: tokens.glow,
+    [`--${prefix}-accent-light`]: tokens.light
+  };
+}
+var CheckIcon = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
+  "path",
+  {
+    d: "M1.5 5L4 7.5L8.5 2.5",
+    stroke: "currentColor",
+    strokeWidth: "1.8",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }
+) });
+var Timeline = ({
+  items,
+  orientation = "vertical",
+  accent,
+  className
+}) => {
+  const accentVars = accent ? accentToCssVars(deriveAccent(accent), "timeline") : {};
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "ol",
+    {
+      className: [
+        Timeline_module_default.timeline,
+        Timeline_module_default[orientation],
+        className ?? ""
+      ].filter(Boolean).join(" "),
+      style: accentVars,
+      children: items.map((item, index) => {
+        const status = item.status ?? "pending";
+        const isLast = index === items.length - 1;
+        return /* @__PURE__ */ jsxRuntime.jsxs(
+          "li",
+          {
+            className: [Timeline_module_default.item, Timeline_module_default[status], isLast ? Timeline_module_default.last : ""].filter(Boolean).join(" "),
+            style: { "--dot-delay": `${index * 0.08}s` },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Timeline_module_default.track, children: [
+                orientation === "horizontal" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: [
+                  Timeline_module_default.connector,
+                  index === 0 ? Timeline_module_default.connectorHidden : "",
+                  index > 0 && items[index - 1].status === "completed" ? Timeline_module_default.connectorDone : ""
+                ].filter(Boolean).join(" ") }),
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: Timeline_module_default.dot, children: status === "completed" && (item.icon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: Timeline_module_default.iconSlot, children: item.icon }) : /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, {})) }),
+                (orientation === "horizontal" || !isLast) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: [
+                  Timeline_module_default.connector,
+                  orientation === "horizontal" && isLast ? Timeline_module_default.connectorHidden : "",
+                  status === "completed" ? Timeline_module_default.connectorDone : ""
+                ].filter(Boolean).join(" ") })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Timeline_module_default.content, children: [
+                item.label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: Timeline_module_default.label, children: item.label }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: Timeline_module_default.title, children: item.title }),
+                item.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: Timeline_module_default.description, children: item.description })
+              ] })
+            ]
+          },
+          item.id
+        );
+      })
+    }
+  );
+};
+
+exports.Timeline = Timeline;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/components/Timeline/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Timeline/Timeline.module.scss","../../../src/utils/color.ts","../../../src/components/Timeline/Timeline.tsx"],"names":["timeline","vertical","item","track","connector","content","last","horizontal","dot","iconSlot","completed","dotIn","active","pulse","pending","label","title","description","connectorHidden","connectorDone","jsx","jsxs"],"mappings":"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","file":"index.cjs","sourcesContent":["@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap\");\n:root {\n  --accent: #3b82f6;\n  --accent-dot: rgb(82.52, 145, 247.08);\n  --accent-track: #3b82f6;\n  --accent-ring: #3b82f6;\n  --accent-glow: rgba(59, 130, 246, 0.3);\n  --accent-light: rgb(157.485, 188.725, 239.765);\n  --color-primary-50: rgb(169.3455, 194.6925, 236.1045);\n  --color-primary-100: rgb(149.4545, 184.4575, 241.6455);\n  --color-primary-400: rgb(82.52, 145, 247.08);\n  --color-primary-500: #3b82f6;\n  --color-primary-600: rgb(29.8390243902, 111.4024390244, 244.6609756098);\n  --color-primary-700: rgb(10.712195122, 95.2195121951, 233.287804878);\n  --color-neutral-0: #ffffff;\n  --color-neutral-100: #f3f4f6;\n  --color-neutral-200: #e5e7eb;\n  --color-neutral-400: #9ca3af;\n  --color-neutral-600: #4b5563;\n  --color-neutral-900: #111827;\n  --color-success-500: #22c55e;\n  --color-success-600: #16a34a;\n  --color-danger-500: #ef4444;\n  --color-danger-600: #dc2626;\n  --color-warning-500: #f59e0b;\n  --color-warning-600: #d97706;\n  --font-family-base: \"Inter\", system-ui, -apple-system, sans-serif;\n  --font-size-xs: 0.75rem;\n  --font-size-sm: 0.875rem;\n  --font-size-md: 1rem;\n  --font-size-lg: 1.125rem;\n  --spacing-1: 0.25rem;\n  --spacing-2: 0.5rem;\n  --spacing-3: 0.75rem;\n  --spacing-4: 1rem;\n  --radius-sm: 0.25rem;\n  --radius-md: 0.375rem;\n  --radius-lg: 0.5rem;\n  --radius-full: 9999px;\n  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n  --transition-fast: 150ms ease;\n  --color-surface: #ffffff;\n  --color-surface-elevated: #ffffff;\n}\n\n[data-theme=dark] {\n  --color-neutral-0: #0f172a;\n  --color-neutral-100: #1e293b;\n  --color-neutral-200: #334155;\n  --color-neutral-400: #94a3b8;\n  --color-neutral-600: #cbd5e1;\n  --color-neutral-900: #f8fafc;\n  --color-surface: #1e293b;\n  --color-surface-elevated: #273549;\n  --color-primary-50: #172554;\n  --color-primary-100: #1e3a8a;\n  --accent-light: #172554;\n  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.4);\n  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.5), 0 2px 4px -2px rgb(0 0 0 / 0.4);\n}\n\n.timeline {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  font-family: var(--font-family-base);\n}\n\n.vertical {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n}\n.vertical .item {\n  display: grid;\n  grid-template-columns: 1.25rem 1fr;\n  column-gap: 1rem;\n  align-items: stretch;\n}\n.vertical .track {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  width: 1.25rem;\n}\n.vertical .connector {\n  flex: 1;\n  width: 0;\n  min-height: 0.5rem;\n  border-left: 2px dashed var(--color-neutral-200);\n  transition: border-color 0.3s ease;\n}\n.vertical .content {\n  padding-bottom: 1.75rem;\n  padding-top: 0.1rem;\n}\n.vertical .item.last .content {\n  padding-bottom: 0;\n}\n\n.horizontal {\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n}\n.horizontal .item {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  flex: 1;\n  min-width: 0;\n}\n.horizontal .track {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 100%;\n}\n.horizontal .connector {\n  flex: 1;\n  height: 0;\n  min-width: 1rem;\n  border-top: 2px dashed var(--color-neutral-200);\n  transition: border-color 0.3s ease;\n}\n.horizontal .content {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  text-align: center;\n  padding-top: 0.75rem;\n  padding-inline: 0.5rem;\n}\n\n.dot {\n  width: 1.25rem;\n  height: 1.25rem;\n  border-radius: 50%;\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0.6rem;\n  position: relative;\n  z-index: 1;\n  transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;\n  background-color: var(--color-neutral-0);\n  border: 2px solid var(--color-neutral-200);\n  color: var(--color-neutral-400);\n}\n\n.iconSlot {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0.65rem;\n  line-height: 1;\n}\n\n.completed .dot {\n  background-color: var(--timeline-accent-dot, var(--accent-dot));\n  border-color: var(--timeline-accent-dot, var(--accent-dot));\n  color: var(--color-neutral-0);\n  box-shadow: 0 0 0 3px var(--timeline-accent-ring, var(--accent-ring));\n  animation: dotIn 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) both;\n  animation-delay: var(--dot-delay, 0s);\n}\n\n.active .dot {\n  background-color: var(--color-neutral-0);\n  border-color: var(--timeline-accent-track, var(--accent-track));\n  border-width: 2px;\n  box-shadow: 0 0 0 3px var(--timeline-accent-ring, var(--accent-ring));\n  animation: pulse 2s ease-in-out infinite;\n}\n\n.pending .dot {\n  box-shadow: 0 0 0 3px var(--color-neutral-200);\n}\n\n.label {\n  display: block;\n  font-size: var(--font-size-xs);\n  color: var(--color-neutral-400);\n  margin-bottom: 0.2rem;\n  letter-spacing: 0.01em;\n}\n\n.title {\n  display: block;\n  font-size: var(--font-size-sm);\n  font-weight: 600;\n  color: var(--color-neutral-900);\n  letter-spacing: -0.01em;\n}\n\n.description {\n  margin: 0.35rem 0 0;\n  font-size: var(--font-size-xs);\n  color: var(--color-neutral-600);\n  line-height: 1.5;\n}\n\n.pending .title {\n  color: var(--color-neutral-400);\n  font-weight: 500;\n}\n\n.connectorHidden {\n  border-color: transparent !important;\n}\n\n.connectorDone {\n  border-color: var(--timeline-accent-track, var(--accent-track)) !important;\n  border-style: solid !important;\n}\n\n@keyframes dotIn {\n  0% {\n    transform: scale(0.5);\n    background-color: var(--color-neutral-0);\n    border-color: var(--color-neutral-200);\n    box-shadow: 0 0 0 3px var(--color-neutral-200);\n    color: transparent;\n  }\n  40% {\n    background-color: var(--timeline-accent-dot, var(--accent-dot));\n    border-color: var(--timeline-accent-dot, var(--accent-dot));\n    box-shadow: 0 0 0 3px var(--timeline-accent-ring, var(--accent-ring));\n    color: var(--color-neutral-0);\n  }\n  50% {\n    transform: scale(1.06);\n  }\n  70% {\n    transform: scale(0.97);\n  }\n  85% {\n    transform: scale(1.02);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n@keyframes pulse {\n  0%, 100% {\n    box-shadow: 0 0 0 3px var(--timeline-accent-ring, var(--accent-ring));\n  }\n  50% {\n    box-shadow: 0 0 0 3px var(--timeline-accent-ring, var(--accent-ring)), 0 0 0 6px var(--timeline-accent-glow, var(--accent-glow));\n  }\n}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3N0eWxlcy90b2tlbnMuc2NzcyIsIlRpbWVsaW5lLm1vZHVsZS5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUVRO0FBS1I7RUFFRTtFQUNBO0VBQ0E7RUFDQTtFQUNBO0VBQ0E7RUFHQTtFQUNBO0VBQ0E7RUFDQTtFQUNBO0VBQ0E7RUFHQTtFQUNBO0VBQ0E7RUFDQTtFQUNBO0VBQ0E7RUFHQTtFQUNBO0VBQ0E7RUFDQTtFQUNBO0VBQ0E7RUFHQTtFQUNBO0VBQ0E7RUFDQTtFQUNBO0VBR0E7RUFDQTtFQUNBO0VBQ0E7RUFHQTtFQUNBO0VBQ0E7RUFDQTtFQUdBO0VBQ0E7RUFHQTtFQUdBO0VBQ0E7OztBQVFGO0VBRUU7RUFDQTtFQUNBO0VBQ0E7RUFDQTtFQUNBO0VBR0E7RUFDQTtFQUdBO0VBQ0E7RUFJQTtFQUdBO0VBQ0E7OztBQ3JGRjtFQUNFO0VBQ0E7RUFDQTtFQUNBOzs7QUFNRjtFQUNFO0VBQ0E7RUFDQTs7QUFFQTtFQUNFO0VBQ0E7RUFDQTtFQUNBOztBQUdGO0VBQ0U7RUFDQTtFQUNBO0VBQ0EsT0FwQ087O0FBdUNUO0VBQ0U7RUFDQTtFQUNBO0VBQ0E7RUFDQTs7QUFHRjtFQUNFO0VBQ0E7O0FBR0Y7RUFDRTs7O0FBT0o7RUFDRTtFQUNBO0VBQ0E7O0FBRUE7RUFDRTtFQUNBO0VBQ0E7RUFDQTtFQUNBOztBQUlGO0VBQ0U7RUFDQTtFQUNBO0VBQ0E7O0FBR0Y7RUFDRTtFQUNBO0VBQ0E7RUFDQTtFQUNBOztBQUtGO0VBQ0U7RUFDQTtFQUNBO0VBQ0E7RUFDQTtFQUNBOzs7QUFPSjtFQUNFLE9BekdTO0VBMEdULFFBMUdTO0VBMkdUO0VBQ0E7RUFDQTtFQUNBO0VBQ0E7RUFDQTtFQUNBO0VBQ0E7RUFDQTtFQUdBO0VBQ0E7RUFDQTs7O0FBR0Y7RUFDRTtFQUNBO0VBQ0E7RUFDQTtFQUNBOzs7QUFPQTtFQUNFLGtCQXBJVztFQXFJWCxjQXJJVztFQXNJWDtFQUNBO0VBQ0E7RUFDQTs7O0FBS0Y7RUFDRTtFQUNBLGNBL0lXO0VBZ0pYO0VBQ0E7RUFDQTs7O0FBS0Y7RUFDRTs7O0FBT0o7RUFDRTtFQUNBO0VBQ0E7RUFDQTtFQUNBOzs7QUFHRjtFQUNFO0VBQ0E7RUFDQTtFQUNBO0VBQ0E7OztBQUdGO0VBQ0U7RUFDQTtFQUNBO0VBQ0E7OztBQUlGO0VBQ0U7RUFDQTs7O0FBSUY7RUFDRTs7O0FBSUY7RUFDRTtFQUNBOzs7QUFNRjtFQUNFO0lBQ0U7SUFDQTtJQUNBO0lBQ0E7SUFDQTs7RUFFRjtJQUNFLGtCQXBOVztJQXFOWCxjQXJOVztJQXNOWDtJQUNBOztFQUVGO0lBQU87O0VBQ1A7SUFBTzs7RUFDUDtJQUFPOztFQUNQO0lBQU87OztBQUdUO0VBQ0U7SUFBVzs7RUFDWDtJQUFZIiwic291cmNlc0NvbnRlbnQiOlsiQHVzZSBcInNhc3M6Y29sb3JcIjtcblxuQGltcG9ydCB1cmwoXCJodHRwczovL2ZvbnRzLmdvb2dsZWFwaXMuY29tL2NzczI/ZmFtaWx5PUludGVyOndnaHRANDAwOzUwMDs2MDAmZGlzcGxheT1zd2FwXCIpO1xuXG4vLyBBY2NlbnQgZGkgZGVmYXVsdCDigJQgY2FtYmlhIHF1aSBwZXIgYWdnaW9ybmFyZSB0dXR0YSBsYSBsaWJyZXJpYVxuJGFjY2VudDogIzNiODJmNjtcblxuOnJvb3Qge1xuICAvLyBBY2NlbnQgc2NhbGUg4oCUIGRlcml2YXRhIGRhICRhY2NlbnQgYSBjb21waWxlIHRpbWVcbiAgLS1hY2NlbnQ6ICAgICAgICAjeyRhY2NlbnR9O1xuICAtLWFjY2VudC1kb3Q6ICAgICN7Y29sb3Iuc2NhbGUoJGFjY2VudCwgJGxpZ2h0bmVzczogMTIlKX07XG4gIC0tYWNjZW50LXRyYWNrOiAgI3skYWNjZW50fTtcbiAgLS1hY2NlbnQtcmluZzogICAjeyRhY2NlbnR9O1xuICAtLWFjY2VudC1nbG93OiAgICN7Y29sb3IuY2hhbmdlKCRhY2NlbnQsICRhbHBoYTogMC4zKX07XG4gIC0tYWNjZW50LWxpZ2h0OiAgI3tjb2xvci5zY2FsZSgkYWNjZW50LCAkbGlnaHRuZXNzOiA0NSUsICRzYXR1cmF0aW9uOiAtMjAlKX07XG5cbiAgLy8gUHJpbWFyeSBzY2FsZSAobWFudGVudXRhIHBlciByZXRyb2NvbXBhdGliaWxpdMOgIGNvbiBCdXR0b24sIEJhZGdlLCBJbnB1dClcbiAgLS1jb2xvci1wcmltYXJ5LTUwOiAgI3tjb2xvci5zY2FsZSgkYWNjZW50LCAkbGlnaHRuZXNzOiA0OSUsICRzYXR1cmF0aW9uOiAtMzAlKX07XG4gIC0tY29sb3ItcHJpbWFyeS0xMDA6ICN7Y29sb3Iuc2NhbGUoJGFjY2VudCwgJGxpZ2h0bmVzczogNDIlLCAkc2F0dXJhdGlvbjogLTE1JSl9O1xuICAtLWNvbG9yLXByaW1hcnktNDAwOiAje2NvbG9yLnNjYWxlKCRhY2NlbnQsICRsaWdodG5lc3M6IDEyJSl9O1xuICAtLWNvbG9yLXByaW1hcnktNTAwOiAjeyRhY2NlbnR9O1xuICAtLWNvbG9yLXByaW1hcnktNjAwOiAje2NvbG9yLnNjYWxlKCRhY2NlbnQsICRsaWdodG5lc3M6IC0xMCUpfTtcbiAgLS1jb2xvci1wcmltYXJ5LTcwMDogI3tjb2xvci5zY2FsZSgkYWNjZW50LCAkbGlnaHRuZXNzOiAtMjAlKX07XG5cbiAgLy8gTmV1dHJhbFxuICAtLWNvbG9yLW5ldXRyYWwtMDogICAjZmZmZmZmO1xuICAtLWNvbG9yLW5ldXRyYWwtMTAwOiAjZjNmNGY2O1xuICAtLWNvbG9yLW5ldXRyYWwtMjAwOiAjZTVlN2ViO1xuICAtLWNvbG9yLW5ldXRyYWwtNDAwOiAjOWNhM2FmO1xuICAtLWNvbG9yLW5ldXRyYWwtNjAwOiAjNGI1NTYzO1xuICAtLWNvbG9yLW5ldXRyYWwtOTAwOiAjMTExODI3O1xuXG4gIC8vIFNlbWFudGljXG4gIC0tY29sb3Itc3VjY2Vzcy01MDA6ICMyMmM1NWU7XG4gIC0tY29sb3Itc3VjY2Vzcy02MDA6ICMxNmEzNGE7XG4gIC0tY29sb3ItZGFuZ2VyLTUwMDogICNlZjQ0NDQ7XG4gIC0tY29sb3ItZGFuZ2VyLTYwMDogICNkYzI2MjY7XG4gIC0tY29sb3Itd2FybmluZy01MDA6ICNmNTllMGI7XG4gIC0tY29sb3Itd2FybmluZy02MDA6ICNkOTc3MDY7XG5cbiAgLy8gVHlwb2dyYXBoeVxuICAtLWZvbnQtZmFtaWx5LWJhc2U6IFwiSW50ZXJcIiwgc3lzdGVtLXVpLCAtYXBwbGUtc3lzdGVtLCBzYW5zLXNlcmlmO1xuICAtLWZvbnQtc2l6ZS14czogMC43NXJlbTtcbiAgLS1mb250LXNpemUtc206IDAuODc1cmVtO1xuICAtLWZvbnQtc2l6ZS1tZDogMXJlbTtcbiAgLS1mb250LXNpemUtbGc6IDEuMTI1cmVtO1xuXG4gIC8vIFNwYWNpbmdcbiAgLS1zcGFjaW5nLTE6IDAuMjVyZW07XG4gIC0tc3BhY2luZy0yOiAwLjVyZW07XG4gIC0tc3BhY2luZy0zOiAwLjc1cmVtO1xuICAtLXNwYWNpbmctNDogMXJlbTtcblxuICAvLyBSYWRpdXNcbiAgLS1yYWRpdXMtc206ICAgMC4yNXJlbTtcbiAgLS1yYWRpdXMtbWQ6ICAgMC4zNzVyZW07XG4gIC0tcmFkaXVzLWxnOiAgIDAuNXJlbTtcbiAgLS1yYWRpdXMtZnVsbDogOTk5OXB4O1xuXG4gIC8vIFNoYWRvd3NcbiAgLS1zaGFkb3ctc206IDAgMXB4IDJweCAwIHJnYigwIDAgMCAvIDAuMDUpO1xuICAtLXNoYWRvdy1tZDogMCA0cHggNnB4IC0xcHggcmdiKDAgMCAwIC8gMC4xKSwgMCAycHggNHB4IC0ycHggcmdiKDAgMCAwIC8gMC4xKTtcblxuICAvLyBUcmFuc2l0aW9uc1xuICAtLXRyYW5zaXRpb24tZmFzdDogMTUwbXMgZWFzZTtcblxuICAvLyBTdXJmYWNlIChiYWNrZ3JvdW5kIGRpIGNhcmQvcGFuZWwpXG4gIC0tY29sb3Itc3VyZmFjZTogICAgICAgICAgI2ZmZmZmZjtcbiAgLS1jb2xvci1zdXJmYWNlLWVsZXZhdGVkOiAjZmZmZmZmO1xufVxuXG4vLyDilIDilIDilIAgRGFyayB0aGVtZSDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIDilIBcbi8vIEFwcGxpY2F0byB2aWEgZGF0YS10aGVtZT1cImRhcmtcIiBzdWxsJ2VsZW1lbnRvIHJvb3QgKGdlc3RpdG8gZGEgU3Rvcnlib29rIGRlY29yYXRvclxuLy8gZSBkYWxsJ2FwcCBjb25zdW1lcikuIEkgY29tcG9uZW50aSBub24gZGV2b25vIGZhcmUgbnVsbGEgZGkgc3BlY2lhbGU6IGJhc3RhIGNoZVxuLy8gdXNpbm8gaSB0b2tlbiB2YXIoKSBlIHJpY2V2ZXJhbm5vIGF1dG9tYXRpY2FtZW50ZSBpIHZhbG9yaSBkYXJrLlxuXG5bZGF0YS10aGVtZT1cImRhcmtcIl0ge1xuICAvLyBOZXV0cmFsIChzY2FsYSBpbnZlcnRpdGEpXG4gIC0tY29sb3ItbmV1dHJhbC0wOiAgICMwZjE3MmE7XG4gIC0tY29sb3ItbmV1dHJhbC0xMDA6ICMxZTI5M2I7XG4gIC0tY29sb3ItbmV1dHJhbC0yMDA6ICMzMzQxNTU7XG4gIC0tY29sb3ItbmV1dHJhbC00MDA6ICM5NGEzYjg7XG4gIC0tY29sb3ItbmV1dHJhbC02MDA6ICNjYmQ1ZTE7XG4gIC0tY29sb3ItbmV1dHJhbC05MDA6ICNmOGZhZmM7XG5cbiAgLy8gU3VyZmFjZVxuICAtLWNvbG9yLXN1cmZhY2U6ICAgICAgICAgICMxZTI5M2I7XG4gIC0tY29sb3Itc3VyZmFjZS1lbGV2YXRlZDogIzI3MzU0OTtcblxuICAvLyBQcmltYXJ5IHNjYWxlIGRhcmsgKHBlciBpbCBkZWZhdWx0IGFjY2VudCBibHUg4oCUIGxlIHNmdW1hdHVyZSBjaGlhcmUgZGl2ZW50YW5vIHNjdXJlKVxuICAtLWNvbG9yLXByaW1hcnktNTA6ICAjMTcyNTU0O1xuICAtLWNvbG9yLXByaW1hcnktMTAwOiAjMWUzYThhO1xuICAvLyA0MDAgLyA1MDAgLyA2MDAgLyA3MDAgcmltYW5nb25vIGludmFyaWF0aSAoYWJiYXN0YW56YSBzYXR1cmkgc3UgYmcgc2N1cm8pXG5cbiAgLy8gQWNjZW50IGxpZ2h0OiB2YXJpYW50ZSBzY3VyYVxuICAtLWFjY2VudC1saWdodDogIzE3MjU1NDtcblxuICAvLyBTaGFkb3dzIChwacO5IGZvcnRpIHN1IGJnIHNjdXJvKVxuICAtLXNoYWRvdy1zbTogMCAxcHggMnB4IDAgcmdiKDAgMCAwIC8gMC40KTtcbiAgLS1zaGFkb3ctbWQ6IDAgNHB4IDZweCAtMXB4IHJnYigwIDAgMCAvIDAuNSksIDAgMnB4IDRweCAtMnB4IHJnYigwIDAgMCAvIDAuNCk7XG59XG4iLCJAdXNlIFwiLi4vLi4vc3R5bGVzL3Rva2Vuc1wiIGFzICo7XG5cbi8vIC0tLSBUb2tlbnMgbG9jYWxpIC0tLVxuLy8gVXNhIC0tdGltZWxpbmUtYWNjZW50LSogc2UgcGFzc2F0byB2aWEgcHJvcCwgYWx0cmltZW50aSBmYWxsYmFjayBhaSB0b2tlbiBnbG9iYWxpXG4kZG90LXNpemU6IDEuMjVyZW07XG4kY29ubmVjdG9yLXRoaWNrbmVzczogMnB4O1xuJGNvbG9yLXBlbmRpbmc6IHZhcigtLWNvbG9yLW5ldXRyYWwtMjAwKTtcblxuJGFjY2VudC1kb3Q6ICAgdmFyKC0tdGltZWxpbmUtYWNjZW50LWRvdCwgICB2YXIoLS1hY2NlbnQtZG90KSk7XG4kYWNjZW50LXRyYWNrOiB2YXIoLS10aW1lbGluZS1hY2NlbnQtdHJhY2ssIHZhcigtLWFjY2VudC10cmFjaykpO1xuJGFjY2VudC1yaW5nOiAgdmFyKC0tdGltZWxpbmUtYWNjZW50LXJpbmcsICB2YXIoLS1hY2NlbnQtcmluZykpO1xuJGFjY2VudC1nbG93OiAgdmFyKC0tdGltZWxpbmUtYWNjZW50LWdsb3csICB2YXIoLS1hY2NlbnQtZ2xvdykpO1xuXG4vLyAtLS0gUmVzZXQgbGlzdGEgLS0tXG4udGltZWxpbmUge1xuICBsaXN0LXN0eWxlOiBub25lO1xuICBtYXJnaW46IDA7XG4gIHBhZGRpbmc6IDA7XG4gIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseS1iYXNlKTtcbn1cblxuLy8gPT09PT09PT09PT09PT09PT09PT09XG4vLyBWRVJUSUNBTEUgKGRlZmF1bHQpXG4vLyA9PT09PT09PT09PT09PT09PT09PT1cbi52ZXJ0aWNhbCB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gIGdhcDogMDtcblxuICAuaXRlbSB7XG4gICAgZGlzcGxheTogZ3JpZDtcbiAgICBncmlkLXRlbXBsYXRlLWNvbHVtbnM6ICRkb3Qtc2l6ZSAxZnI7XG4gICAgY29sdW1uLWdhcDogMXJlbTtcbiAgICBhbGlnbi1pdGVtczogc3RyZXRjaDtcbiAgfVxuXG4gIC50cmFjayB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgd2lkdGg6ICRkb3Qtc2l6ZTtcbiAgfVxuXG4gIC5jb25uZWN0b3Ige1xuICAgIGZsZXg6IDE7XG4gICAgd2lkdGg6IDA7XG4gICAgbWluLWhlaWdodDogMC41cmVtO1xuICAgIGJvcmRlci1sZWZ0OiAkY29ubmVjdG9yLXRoaWNrbmVzcyBkYXNoZWQgJGNvbG9yLXBlbmRpbmc7XG4gICAgdHJhbnNpdGlvbjogYm9yZGVyLWNvbG9yIDAuM3MgZWFzZTtcbiAgfVxuXG4gIC5jb250ZW50IHtcbiAgICBwYWRkaW5nLWJvdHRvbTogMS43NXJlbTtcbiAgICBwYWRkaW5nLXRvcDogMC4xcmVtO1xuICB9XG5cbiAgLml0ZW0ubGFzdCAuY29udGVudCB7XG4gICAgcGFkZGluZy1ib3R0b206IDA7XG4gIH1cbn1cblxuLy8gPT09PT09PT09PT09PT09PT09PT09PT1cbi8vIE9SSVpaT05UQUxFXG4vLyA9PT09PT09PT09PT09PT09PT09PT09PVxuLmhvcml6b250YWwge1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogcm93O1xuICBhbGlnbi1pdGVtczogZmxleC1zdGFydDtcblxuICAuaXRlbSB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgZmxleDogMTtcbiAgICBtaW4td2lkdGg6IDA7XG5cbiAgfVxuXG4gIC50cmFjayB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBmbGV4LWRpcmVjdGlvbjogcm93O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgd2lkdGg6IDEwMCU7XG4gIH1cblxuICAuY29ubmVjdG9yIHtcbiAgICBmbGV4OiAxO1xuICAgIGhlaWdodDogMDtcbiAgICBtaW4td2lkdGg6IDFyZW07XG4gICAgYm9yZGVyLXRvcDogJGNvbm5lY3Rvci10aGlja25lc3MgZGFzaGVkICRjb2xvci1wZW5kaW5nO1xuICAgIHRyYW5zaXRpb246IGJvcmRlci1jb2xvciAwLjNzIGVhc2U7XG4gIH1cblxuXG5cbiAgLmNvbnRlbnQge1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIHRleHQtYWxpZ246IGNlbnRlcjtcbiAgICBwYWRkaW5nLXRvcDogMC43NXJlbTtcbiAgICBwYWRkaW5nLWlubGluZTogMC41cmVtO1xuICB9XG59XG5cbi8vID09PT09PT09PT09PT09PT09PT09PVxuLy8gRE9UXG4vLyA9PT09PT09PT09PT09PT09PT09PT1cbi5kb3Qge1xuICB3aWR0aDogJGRvdC1zaXplO1xuICBoZWlnaHQ6ICRkb3Qtc2l6ZTtcbiAgYm9yZGVyLXJhZGl1czogNTAlO1xuICBmbGV4LXNocmluazogMDtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIGZvbnQtc2l6ZTogMC42cmVtO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHotaW5kZXg6IDE7XG4gIHRyYW5zaXRpb246IGJhY2tncm91bmQtY29sb3IgMC4ycyBlYXNlLCBib3JkZXItY29sb3IgMC4ycyBlYXNlLCBib3gtc2hhZG93IDAuMnMgZWFzZTtcblxuICAvLyBwZW5kaW5nXG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWNvbG9yLW5ldXRyYWwtMCk7XG4gIGJvcmRlcjogJGNvbm5lY3Rvci10aGlja25lc3Mgc29saWQgJGNvbG9yLXBlbmRpbmc7XG4gIGNvbG9yOiB2YXIoLS1jb2xvci1uZXV0cmFsLTQwMCk7XG59XG5cbi5pY29uU2xvdCB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBmb250LXNpemU6IDAuNjVyZW07XG4gIGxpbmUtaGVpZ2h0OiAxO1xufVxuXG4vLyA9PT09PT09PT09PT09PT09PT09PT1cbi8vIFNUQVRVU1xuLy8gPT09PT09PT09PT09PT09PT09PT09XG4uY29tcGxldGVkIHtcbiAgLmRvdCB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJGFjY2VudC1kb3Q7XG4gICAgYm9yZGVyLWNvbG9yOiAkYWNjZW50LWRvdDtcbiAgICBjb2xvcjogdmFyKC0tY29sb3ItbmV1dHJhbC0wKTtcbiAgICBib3gtc2hhZG93OiAwIDAgMCAzcHggJGFjY2VudC1yaW5nO1xuICAgIGFuaW1hdGlvbjogZG90SW4gMC40cyBjdWJpYy1iZXppZXIoMC4xNzUsIDAuODg1LCAwLjMyLCAxLjI3NSkgYm90aDtcbiAgICBhbmltYXRpb24tZGVsYXk6IHZhcigtLWRvdC1kZWxheSwgMHMpO1xuICB9XG59XG5cbi5hY3RpdmUge1xuICAuZG90IHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1jb2xvci1uZXV0cmFsLTApO1xuICAgIGJvcmRlci1jb2xvcjogJGFjY2VudC10cmFjaztcbiAgICBib3JkZXItd2lkdGg6IDJweDtcbiAgICBib3gtc2hhZG93OiAwIDAgMCAzcHggJGFjY2VudC1yaW5nO1xuICAgIGFuaW1hdGlvbjogcHVsc2UgMnMgZWFzZS1pbi1vdXQgaW5maW5pdGU7XG4gIH1cbn1cblxuLnBlbmRpbmcge1xuICAuZG90IHtcbiAgICBib3gtc2hhZG93OiAwIDAgMCAzcHggdmFyKC0tY29sb3ItbmV1dHJhbC0yMDApO1xuICB9XG59XG5cbi8vID09PT09PT09PT09PT09PT09PT09PVxuLy8gQ09OVEVOVFxuLy8gPT09PT09PT09PT09PT09PT09PT09XG4ubGFiZWwge1xuICBkaXNwbGF5OiBibG9jaztcbiAgZm9udC1zaXplOiB2YXIoLS1mb250LXNpemUteHMpO1xuICBjb2xvcjogdmFyKC0tY29sb3ItbmV1dHJhbC00MDApO1xuICBtYXJnaW4tYm90dG9tOiAwLjJyZW07XG4gIGxldHRlci1zcGFjaW5nOiAwLjAxZW07XG59XG5cbi50aXRsZSB7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBmb250LXNpemU6IHZhcigtLWZvbnQtc2l6ZS1zbSk7XG4gIGZvbnQtd2VpZ2h0OiA2MDA7XG4gIGNvbG9yOiB2YXIoLS1jb2xvci1uZXV0cmFsLTkwMCk7XG4gIGxldHRlci1zcGFjaW5nOiAtMC4wMWVtO1xufVxuXG4uZGVzY3JpcHRpb24ge1xuICBtYXJnaW46IDAuMzVyZW0gMCAwO1xuICBmb250LXNpemU6IHZhcigtLWZvbnQtc2l6ZS14cyk7XG4gIGNvbG9yOiB2YXIoLS1jb2xvci1uZXV0cmFsLTYwMCk7XG4gIGxpbmUtaGVpZ2h0OiAxLjU7XG59XG5cbi8vIFN0YXR1czogdGl0b2xvIHBpw7kgc2JpYWRpdG8gcGVyIHBlbmRpbmdcbi5wZW5kaW5nIC50aXRsZSB7XG4gIGNvbG9yOiB2YXIoLS1jb2xvci1uZXV0cmFsLTQwMCk7XG4gIGZvbnQtd2VpZ2h0OiA1MDA7XG59XG5cbi8vIENvbm5ldHRvcmUgaW52aXNpYmlsZSDigJQgdGllbmUgbG8gc3BhemlvIG1hIG5vbiBtb3N0cmEgbGEgbGluZWFcbi5jb25uZWN0b3JIaWRkZW4ge1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50ICFpbXBvcnRhbnQ7XG59XG5cbi8vIENvbm5ldHRvcmUgY29tcGxldGF0byDigJQgc292cmFzY3JpdmUgZGFzaGVkIGNvbiBzb2xpZCArIGNvbG9yZSBhY2NlbnRcbi5jb25uZWN0b3JEb25lIHtcbiAgYm9yZGVyLWNvbG9yOiAkYWNjZW50LXRyYWNrICFpbXBvcnRhbnQ7XG4gIGJvcmRlci1zdHlsZTogc29saWQgIWltcG9ydGFudDtcbn1cblxuLy8gPT09PT09PT09PT09PT09PT09PT09XG4vLyBBTklNQVpJT05JXG4vLyA9PT09PT09PT09PT09PT09PT09PT1cbkBrZXlmcmFtZXMgZG90SW4ge1xuICAwJSB7XG4gICAgdHJhbnNmb3JtOiBzY2FsZSgwLjUpO1xuICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWNvbG9yLW5ldXRyYWwtMCk7XG4gICAgYm9yZGVyLWNvbG9yOiB2YXIoLS1jb2xvci1uZXV0cmFsLTIwMCk7XG4gICAgYm94LXNoYWRvdzogMCAwIDAgM3B4IHZhcigtLWNvbG9yLW5ldXRyYWwtMjAwKTtcbiAgICBjb2xvcjogdHJhbnNwYXJlbnQ7XG4gIH1cbiAgNDAlIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAkYWNjZW50LWRvdDtcbiAgICBib3JkZXItY29sb3I6ICRhY2NlbnQtZG90O1xuICAgIGJveC1zaGFkb3c6IDAgMCAwIDNweCAkYWNjZW50LXJpbmc7XG4gICAgY29sb3I6IHZhcigtLWNvbG9yLW5ldXRyYWwtMCk7XG4gIH1cbiAgNTAlICB7IHRyYW5zZm9ybTogc2NhbGUoMS4wNik7IH1cbiAgNzAlICB7IHRyYW5zZm9ybTogc2NhbGUoMC45Nyk7IH1cbiAgODUlICB7IHRyYW5zZm9ybTogc2NhbGUoMS4wMik7IH1cbiAgMTAwJSB7IHRyYW5zZm9ybTogc2NhbGUoMSk7IH1cbn1cblxuQGtleWZyYW1lcyBwdWxzZSB7XG4gIDAlLCAxMDAlIHsgYm94LXNoYWRvdzogMCAwIDAgM3B4ICRhY2NlbnQtcmluZzsgfVxuICA1MCUgICAgICAgeyBib3gtc2hhZG93OiAwIDAgMCAzcHggJGFjY2VudC1yaW5nLCAwIDAgMCA2cHggJGFjY2VudC1nbG93OyB9XG59XG4iXX0= */","export function hexToHsl(hex: string): [number, number, number] {\n  const r = parseInt(hex.slice(1, 3), 16) / 255;\n  const g = parseInt(hex.slice(3, 5), 16) / 255;\n  const b = parseInt(hex.slice(5, 7), 16) / 255;\n\n  const max = Math.max(r, g, b);\n  const min = Math.min(r, g, b);\n  const l = (max + min) / 2;\n  let h = 0;\n  let s = 0;\n\n  if (max !== min) {\n    const d = max - min;\n    s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n    switch (max) {\n      case r: h = ((g - b) / d + (g < b ? 6 : 0)) / 6; break;\n      case g: h = ((b - r) / d + 2) / 6; break;\n      case b: h = ((r - g) / d + 4) / 6; break;\n    }\n  }\n\n  return [h * 360, s * 100, l * 100];\n}\n\nexport function hslToHex(h: number, s: number, l: number): string {\n  const sl = s / 100;\n  const ll = l / 100;\n  const a = sl * Math.min(ll, 1 - ll);\n  const f = (n: number) => {\n    const k = (n + h / 30) % 12;\n    const color = ll - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);\n    return Math.round(255 * color).toString(16).padStart(2, \"0\");\n  };\n  return `#${f(0)}${f(8)}${f(4)}`;\n}\n\nexport function hslToRgb(h: number, s: number, l: number): { r: number; g: number; b: number } {\n  const sl = s / 100;\n  const ll = l / 100;\n  const a = sl * Math.min(ll, 1 - ll);\n  const f = (n: number) => {\n    const k = (n + h / 30) % 12;\n    return Math.round(255 * (ll - a * Math.max(Math.min(k - 3, 9 - k, 1), -1)));\n  };\n  return { r: f(0), g: f(8), b: f(4) };\n}\n\nexport function rgbToHsl(r: number, g: number, b: number): [number, number, number] {\n  const rr = r / 255, gg = g / 255, bb = b / 255;\n  const max = Math.max(rr, gg, bb);\n  const min = Math.min(rr, gg, bb);\n  const l = (max + min) / 2;\n  let h = 0, s = 0;\n  if (max !== min) {\n    const d = max - min;\n    s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n    switch (max) {\n      case rr: h = ((gg - bb) / d + (gg < bb ? 6 : 0)) / 6; break;\n      case gg: h = ((bb - rr) / d + 2) / 6; break;\n      case bb: h = ((rr - gg) / d + 4) / 6; break;\n    }\n  }\n  return [h * 360, s * 100, l * 100];\n}\n\nfunction hslToRgba(h: number, s: number, l: number, alpha: number): string {\n  const { r, g, b } = hslToRgb(h, s, l);\n  return `rgba(${r}, ${g}, ${b}, ${alpha})`;\n}\n\nexport interface AccentTokens {\n  base: string;\n  dot: string;\n  track: string;\n  ring: string;\n  glow: string;\n  light: string;\n}\n\nexport interface ColorValue {\n  hex: string;\n  hexa: string;\n  hsl: string;\n  hsla: string;\n  rgb: string;\n  rgba: string;\n  h: number;\n  s: number;\n  l: number;\n  a: number;\n}\n\nexport function buildColorValue(h: number, s: number, l: number, a: number): ColorValue {\n  const { r, g, b } = hslToRgb(h, s, l);\n  const hex = hslToHex(h, s, l);\n  const alphaHex = Math.round(a * 255).toString(16).padStart(2, \"0\");\n  const hR = Math.round(h), sR = Math.round(s), lR = Math.round(l);\n  const aR = Math.round(a * 100) / 100;\n  return {\n    hex,\n    hexa: `${hex}${alphaHex}`,\n    hsl: `hsl(${hR}, ${sR}%, ${lR}%)`,\n    hsla: `hsla(${hR}, ${sR}%, ${lR}%, ${aR})`,\n    rgb: `rgb(${r}, ${g}, ${b})`,\n    rgba: `rgba(${r}, ${g}, ${b}, ${aR})`,\n    h, s, l, a,\n  };\n}\n\nexport function deriveAccent(hex: string): AccentTokens {\n  const [h, s, l] = hexToHsl(hex);\n  return {\n    base:  hex,\n    dot:   hslToHex(h, s, Math.min(l + 12, 95)),\n    track: hex,\n    ring:  hex,\n    glow:  hslToRgba(h, s, l, 0.3),\n    light: hslToHex(h, Math.max(s - 20, 0), Math.min(l + 45, 96)),\n  };\n}\n\nexport function accentToCssVars(\n  tokens: AccentTokens,\n  prefix: string\n): Record<string, string> {\n  return {\n    [`--${prefix}-accent`]:       tokens.base,\n    [`--${prefix}-accent-dot`]:   tokens.dot,\n    [`--${prefix}-accent-track`]: tokens.track,\n    [`--${prefix}-accent-ring`]:  tokens.ring,\n    [`--${prefix}-accent-glow`]:  tokens.glow,\n    [`--${prefix}-accent-light`]: tokens.light,\n  };\n}\n","import React from \"react\";\nimport styles from \"./Timeline.module.scss\";\nimport { deriveAccent, accentToCssVars } from \"../../utils/color\";\n\nexport type TimelineStatus = \"completed\" | \"active\" | \"pending\";\nexport type TimelineOrientation = \"vertical\" | \"horizontal\";\n\nexport interface TimelineItem {\n  id: string | number;\n  title: string;\n  description?: string;\n  label?: string;\n  status?: TimelineStatus;\n  icon?: React.ReactNode;\n}\n\nexport interface TimelineProps {\n  items: TimelineItem[];\n  orientation?: TimelineOrientation;\n  /** Colore accent custom — sovrascrive il tema globale per questa istanza */\n  accent?: string;\n  className?: string;\n}\n\nconst CheckIcon = () => (\n  <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\">\n    <path\n      d=\"M1.5 5L4 7.5L8.5 2.5\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.8\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    />\n  </svg>\n);\n\nexport const Timeline: React.FC<TimelineProps> = ({\n  items,\n  orientation = \"vertical\",\n  accent,\n  className,\n}) => {\n  const accentVars = accent\n    ? accentToCssVars(deriveAccent(accent), \"timeline\")\n    : {};\n\n  return (\n    <ol\n      className={[\n        styles.timeline,\n        styles[orientation],\n        className ?? \"\",\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      style={accentVars as React.CSSProperties}\n    >\n      {items.map((item, index) => {\n        const status = item.status ?? \"pending\";\n        const isLast = index === items.length - 1;\n\n        return (\n          <li\n            key={item.id}\n            className={[styles.item, styles[status], isLast ? styles.last : \"\"]\n              .filter(Boolean)\n              .join(\" \")}\n            style={{ \"--dot-delay\": `${index * 0.08}s` } as React.CSSProperties}\n          >\n            {/* Colonna sinistra (verticale) o riga superiore (orizzontale): dot + connettore */}\n            <div className={styles.track}>\n              {/* Connettore sinistro — orizzontale: sempre, invisibile sul primo */}\n              {orientation === \"horizontal\" && (\n                <div className={[\n                  styles.connector,\n                  index === 0 ? styles.connectorHidden : \"\",\n                  index > 0 && items[index - 1].status === \"completed\" ? styles.connectorDone : \"\",\n                ].filter(Boolean).join(\" \")} />\n              )}\n\n              <div className={styles.dot}>\n                {status === \"completed\" && (\n                  item.icon\n                    ? <span className={styles.iconSlot}>{item.icon}</span>\n                    : <CheckIcon />\n                )}\n              </div>\n\n              {/* Connettore destro — verticale: non sull'ultimo; orizzontale: sempre, invisibile sull'ultimo */}\n              {(orientation === \"horizontal\" || !isLast) && (\n                <div className={[\n                  styles.connector,\n                  orientation === \"horizontal\" && isLast ? styles.connectorHidden : \"\",\n                  status === \"completed\" ? styles.connectorDone : \"\",\n                ].filter(Boolean).join(\" \")} />\n              )}\n            </div>\n\n            {/* Contenuto */}\n            <div className={styles.content}>\n              {item.label && (\n                <span className={styles.label}>{item.label}</span>\n              )}\n              <span className={styles.title}>{item.title}</span>\n              {item.description && (\n                <p className={styles.description}>{item.description}</p>\n              )}\n            </div>\n          </li>\n        );\n      })}\n    </ol>\n  );\n};\n"]}

package/dist/components/Timeline/index.css

@@ -0,0 +1,247 @@
+@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap";
+
+/* src/components/Timeline/Timeline.module.scss */
+:root {
+  --accent: #3b82f6;
+  --accent-dot: rgb(82.52, 145, 247.08);
+  --accent-track: #3b82f6;
+  --accent-ring: #3b82f6;
+  --accent-glow: rgba(59, 130, 246, 0.3);
+  --accent-light: rgb(157.485, 188.725, 239.765);
+  --color-primary-50: rgb(169.3455, 194.6925, 236.1045);
+  --color-primary-100: rgb(149.4545, 184.4575, 241.6455);
+  --color-primary-400: rgb(82.52, 145, 247.08);
+  --color-primary-500: #3b82f6;
+  --color-primary-600: rgb(29.8390243902, 111.4024390244, 244.6609756098);
+  --color-primary-700: rgb(10.712195122, 95.2195121951, 233.287804878);
+  --color-neutral-0: #ffffff;
+  --color-neutral-100: #f3f4f6;
+  --color-neutral-200: #e5e7eb;
+  --color-neutral-400: #9ca3af;
+  --color-neutral-600: #4b5563;
+  --color-neutral-900: #111827;
+  --color-success-500: #22c55e;
+  --color-success-600: #16a34a;
+  --color-danger-500: #ef4444;
+  --color-danger-600: #dc2626;
+  --color-warning-500: #f59e0b;
+  --color-warning-600: #d97706;
+  --font-family-base:
+    "Inter",
+    system-ui,
+    -apple-system,
+    sans-serif;
+  --font-size-xs: 0.75rem;
+  --font-size-sm: 0.875rem;
+  --font-size-md: 1rem;
+  --font-size-lg: 1.125rem;
+  --spacing-1: 0.25rem;
+  --spacing-2: 0.5rem;
+  --spacing-3: 0.75rem;
+  --spacing-4: 1rem;
+  --radius-sm: 0.25rem;
+  --radius-md: 0.375rem;
+  --radius-lg: 0.5rem;
+  --radius-full: 9999px;
+  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  --transition-fast: 150ms ease;
+  --color-surface: #ffffff;
+  --color-surface-elevated: #ffffff;
+}
+[data-theme=dark] {
+  --color-neutral-0: #0f172a;
+  --color-neutral-100: #1e293b;
+  --color-neutral-200: #334155;
+  --color-neutral-400: #94a3b8;
+  --color-neutral-600: #cbd5e1;
+  --color-neutral-900: #f8fafc;
+  --color-surface: #1e293b;
+  --color-surface-elevated: #273549;
+  --color-primary-50: #172554;
+  --color-primary-100: #1e3a8a;
+  --accent-light: #172554;
+  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.4);
+  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.5), 0 2px 4px -2px rgb(0 0 0 / 0.4);
+}
+.Timeline_module_timeline2 {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  font-family: var(--font-family-base);
+}
+.Timeline_module_vertical2 {
+  display: flex;
+  flex-direction: column;
+  gap: 0;
+}
+.Timeline_module_vertical2 .Timeline_module_item2 {
+  display: grid;
+  grid-template-columns: 1.25rem 1fr;
+  column-gap: 1rem;
+  align-items: stretch;
+}
+.Timeline_module_vertical2 .Timeline_module_track2 {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 1.25rem;
+}
+.Timeline_module_vertical2 .Timeline_module_connector2 {
+  flex: 1;
+  width: 0;
+  min-height: 0.5rem;
+  border-left: 2px dashed var(--color-neutral-200);
+  transition: border-color 0.3s ease;
+}
+.Timeline_module_vertical2 .Timeline_module_content2 {
+  padding-bottom: 1.75rem;
+  padding-top: 0.1rem;
+}
+.Timeline_module_vertical2 .Timeline_module_item2.Timeline_module_last2 .Timeline_module_content2 {
+  padding-bottom: 0;
+}
+.Timeline_module_horizontal2 {
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+}
+.Timeline_module_horizontal2 .Timeline_module_item2 {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  flex: 1;
+  min-width: 0;
+}
+.Timeline_module_horizontal2 .Timeline_module_track2 {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  width: 100%;
+}
+.Timeline_module_horizontal2 .Timeline_module_connector2 {
+  flex: 1;
+  height: 0;
+  min-width: 1rem;
+  border-top: 2px dashed var(--color-neutral-200);
+  transition: border-color 0.3s ease;
+}
+.Timeline_module_horizontal2 .Timeline_module_content2 {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  padding-top: 0.75rem;
+  padding-inline: 0.5rem;
+}
+.Timeline_module_dot2 {
+  width: 1.25rem;
+  height: 1.25rem;
+  border-radius: 50%;
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 0.6rem;
+  position: relative;
+  z-index: 1;
+  transition:
+    background-color 0.2s ease,
+    border-color 0.2s ease,
+    box-shadow 0.2s ease;
+  background-color: var(--color-neutral-0);
+  border: 2px solid var(--color-neutral-200);
+  color: var(--color-neutral-400);
+}
+.Timeline_module_iconSlot2 {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 0.65rem;
+  line-height: 1;
+}
+.Timeline_module_completed2 .Timeline_module_dot2 {
+  background-color: var(--timeline-accent-dot, var(--accent-dot));
+  border-color: var(--timeline-accent-dot, var(--accent-dot));
+  color: var(--color-neutral-0);
+  box-shadow: 0 0 0 3px var(--timeline-accent-ring, var(--accent-ring));
+  animation: Timeline_module_dotIn2 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) both;
+  animation-delay: var(--dot-delay, 0s);
+}
+.Timeline_module_active2 .Timeline_module_dot2 {
+  background-color: var(--color-neutral-0);
+  border-color: var(--timeline-accent-track, var(--accent-track));
+  border-width: 2px;
+  box-shadow: 0 0 0 3px var(--timeline-accent-ring, var(--accent-ring));
+  animation: Timeline_module_pulse2 2s ease-in-out infinite;
+}
+.Timeline_module_pending2 .Timeline_module_dot2 {
+  box-shadow: 0 0 0 3px var(--color-neutral-200);
+}
+.Timeline_module_label2 {
+  display: block;
+  font-size: var(--font-size-xs);
+  color: var(--color-neutral-400);
+  margin-bottom: 0.2rem;
+  letter-spacing: 0.01em;
+}
+.Timeline_module_title2 {
+  display: block;
+  font-size: var(--font-size-sm);
+  font-weight: 600;
+  color: var(--color-neutral-900);
+  letter-spacing: -0.01em;
+}
+.Timeline_module_description2 {
+  margin: 0.35rem 0 0;
+  font-size: var(--font-size-xs);
+  color: var(--color-neutral-600);
+  line-height: 1.5;
+}
+.Timeline_module_pending2 .Timeline_module_title2 {
+  color: var(--color-neutral-400);
+  font-weight: 500;
+}
+.Timeline_module_connectorHidden2 {
+  border-color: transparent !important;
+}
+.Timeline_module_connectorDone2 {
+  border-color: var(--timeline-accent-track, var(--accent-track)) !important;
+  border-style: solid !important;
+}
+@keyframes Timeline_module_dotIn2 {
+  0% {
+    transform: scale(0.5);
+    background-color: var(--color-neutral-0);
+    border-color: var(--color-neutral-200);
+    box-shadow: 0 0 0 3px var(--color-neutral-200);
+    color: transparent;
+  }
+  40% {
+    background-color: var(--timeline-accent-dot, var(--accent-dot));
+    border-color: var(--timeline-accent-dot, var(--accent-dot));
+    box-shadow: 0 0 0 3px var(--timeline-accent-ring, var(--accent-ring));
+    color: var(--color-neutral-0);
+  }
+  50% {
+    transform: scale(1.06);
+  }
+  70% {
+    transform: scale(0.97);
+  }
+  85% {
+    transform: scale(1.02);
+  }
+  100% {
+    transform: scale(1);
+  }
+}
+@keyframes Timeline_module_pulse2 {
+  0%, 100% {
+    box-shadow: 0 0 0 3px var(--timeline-accent-ring, var(--accent-ring));
+  }
+  50% {
+    box-shadow: 0 0 0 3px var(--timeline-accent-ring, var(--accent-ring)), 0 0 0 6px var(--timeline-accent-glow, var(--accent-glow));
+  }
+}
+/*# sourceMappingURL=index.css.map */

package/dist/components/Timeline/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/styles/tokens.scss","../../../src/components/Timeline/Timeline.module.scss"],"sourcesContent":["@use \"sass:color\";\n\n@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap\");\n\n// Accent di default — cambia qui per aggiornare tutta la libreria\n$accent: #3b82f6;\n\n:root {\n  // Accent scale — derivata da $accent a compile time\n  --accent:        #{$accent};\n  --accent-dot:    #{color.scale($accent, $lightness: 12%)};\n  --accent-track:  #{$accent};\n  --accent-ring:   #{$accent};\n  --accent-glow:   #{color.change($accent, $alpha: 0.3)};\n  --accent-light:  #{color.scale($accent, $lightness: 45%, $saturation: -20%)};\n\n  // Primary scale (mantenuta per retrocompatibilità con Button, Badge, Input)\n  --color-primary-50:  #{color.scale($accent, $lightness: 49%, $saturation: -30%)};\n  --color-primary-100: #{color.scale($accent, $lightness: 42%, $saturation: -15%)};\n  --color-primary-400: #{color.scale($accent, $lightness: 12%)};\n  --color-primary-500: #{$accent};\n  --color-primary-600: #{color.scale($accent, $lightness: -10%)};\n  --color-primary-700: #{color.scale($accent, $lightness: -20%)};\n\n  // Neutral\n  --color-neutral-0:   #ffffff;\n  --color-neutral-100: #f3f4f6;\n  --color-neutral-200: #e5e7eb;\n  --color-neutral-400: #9ca3af;\n  --color-neutral-600: #4b5563;\n  --color-neutral-900: #111827;\n\n  // Semantic\n  --color-success-500: #22c55e;\n  --color-success-600: #16a34a;\n  --color-danger-500:  #ef4444;\n  --color-danger-600:  #dc2626;\n  --color-warning-500: #f59e0b;\n  --color-warning-600: #d97706;\n\n  // Typography\n  --font-family-base: \"Inter\", system-ui, -apple-system, sans-serif;\n  --font-size-xs: 0.75rem;\n  --font-size-sm: 0.875rem;\n  --font-size-md: 1rem;\n  --font-size-lg: 1.125rem;\n\n  // Spacing\n  --spacing-1: 0.25rem;\n  --spacing-2: 0.5rem;\n  --spacing-3: 0.75rem;\n  --spacing-4: 1rem;\n\n  // Radius\n  --radius-sm:   0.25rem;\n  --radius-md:   0.375rem;\n  --radius-lg:   0.5rem;\n  --radius-full: 9999px;\n\n  // Shadows\n  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n\n  // Transitions\n  --transition-fast: 150ms ease;\n\n  // Surface (background di card/panel)\n  --color-surface:          #ffffff;\n  --color-surface-elevated: #ffffff;\n}\n\n// ─── Dark theme ────────────────────────────────────────────────────────────────\n// Applicato via data-theme=\"dark\" sull'elemento root (gestito da Storybook decorator\n// e dall'app consumer). I componenti non devono fare nulla di speciale: basta che\n// usino i token var() e riceveranno automaticamente i valori dark.\n\n[data-theme=\"dark\"] {\n  // Neutral (scala invertita)\n  --color-neutral-0:   #0f172a;\n  --color-neutral-100: #1e293b;\n  --color-neutral-200: #334155;\n  --color-neutral-400: #94a3b8;\n  --color-neutral-600: #cbd5e1;\n  --color-neutral-900: #f8fafc;\n\n  // Surface\n  --color-surface:          #1e293b;\n  --color-surface-elevated: #273549;\n\n  // Primary scale dark (per il default accent blu — le sfumature chiare diventano scure)\n  --color-primary-50:  #172554;\n  --color-primary-100: #1e3a8a;\n  // 400 / 500 / 600 / 700 rimangono invariati (abbastanza saturi su bg scuro)\n\n  // Accent light: variante scura\n  --accent-light: #172554;\n\n  // Shadows (più forti su bg scuro)\n  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.4);\n  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.5), 0 2px 4px -2px rgb(0 0 0 / 0.4);\n}\n","@use \"../../styles/tokens\" as *;\n\n// --- Tokens locali ---\n// Usa --timeline-accent-* se passato via prop, altrimenti fallback ai token globali\n$dot-size: 1.25rem;\n$connector-thickness: 2px;\n$color-pending: var(--color-neutral-200);\n\n$accent-dot:   var(--timeline-accent-dot,   var(--accent-dot));\n$accent-track: var(--timeline-accent-track, var(--accent-track));\n$accent-ring:  var(--timeline-accent-ring,  var(--accent-ring));\n$accent-glow:  var(--timeline-accent-glow,  var(--accent-glow));\n\n// --- Reset lista ---\n.timeline {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  font-family: var(--font-family-base);\n}\n\n// =====================\n// VERTICALE (default)\n// =====================\n.vertical {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n\n  .item {\n    display: grid;\n    grid-template-columns: $dot-size 1fr;\n    column-gap: 1rem;\n    align-items: stretch;\n  }\n\n  .track {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    width: $dot-size;\n  }\n\n  .connector {\n    flex: 1;\n    width: 0;\n    min-height: 0.5rem;\n    border-left: $connector-thickness dashed $color-pending;\n    transition: border-color 0.3s ease;\n  }\n\n  .content {\n    padding-bottom: 1.75rem;\n    padding-top: 0.1rem;\n  }\n\n  .item.last .content {\n    padding-bottom: 0;\n  }\n}\n\n// =======================\n// ORIZZONTALE\n// =======================\n.horizontal {\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n\n  .item {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    flex: 1;\n    min-width: 0;\n\n  }\n\n  .track {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    width: 100%;\n  }\n\n  .connector {\n    flex: 1;\n    height: 0;\n    min-width: 1rem;\n    border-top: $connector-thickness dashed $color-pending;\n    transition: border-color 0.3s ease;\n  }\n\n\n\n  .content {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    text-align: center;\n    padding-top: 0.75rem;\n    padding-inline: 0.5rem;\n  }\n}\n\n// =====================\n// DOT\n// =====================\n.dot {\n  width: $dot-size;\n  height: $dot-size;\n  border-radius: 50%;\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0.6rem;\n  position: relative;\n  z-index: 1;\n  transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;\n\n  // pending\n  background-color: var(--color-neutral-0);\n  border: $connector-thickness solid $color-pending;\n  color: var(--color-neutral-400);\n}\n\n.iconSlot {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0.65rem;\n  line-height: 1;\n}\n\n// =====================\n// STATUS\n// =====================\n.completed {\n  .dot {\n    background-color: $accent-dot;\n    border-color: $accent-dot;\n    color: var(--color-neutral-0);\n    box-shadow: 0 0 0 3px $accent-ring;\n    animation: dotIn 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) both;\n    animation-delay: var(--dot-delay, 0s);\n  }\n}\n\n.active {\n  .dot {\n    background-color: var(--color-neutral-0);\n    border-color: $accent-track;\n    border-width: 2px;\n    box-shadow: 0 0 0 3px $accent-ring;\n    animation: pulse 2s ease-in-out infinite;\n  }\n}\n\n.pending {\n  .dot {\n    box-shadow: 0 0 0 3px var(--color-neutral-200);\n  }\n}\n\n// =====================\n// CONTENT\n// =====================\n.label {\n  display: block;\n  font-size: var(--font-size-xs);\n  color: var(--color-neutral-400);\n  margin-bottom: 0.2rem;\n  letter-spacing: 0.01em;\n}\n\n.title {\n  display: block;\n  font-size: var(--font-size-sm);\n  font-weight: 600;\n  color: var(--color-neutral-900);\n  letter-spacing: -0.01em;\n}\n\n.description {\n  margin: 0.35rem 0 0;\n  font-size: var(--font-size-xs);\n  color: var(--color-neutral-600);\n  line-height: 1.5;\n}\n\n// Status: titolo più sbiadito per pending\n.pending .title {\n  color: var(--color-neutral-400);\n  font-weight: 500;\n}\n\n// Connettore invisibile — tiene lo spazio ma non mostra la linea\n.connectorHidden {\n  border-color: transparent !important;\n}\n\n// Connettore completato — sovrascrive dashed con solid + colore accent\n.connectorDone {\n  border-color: $accent-track !important;\n  border-style: solid !important;\n}\n\n// =====================\n// ANIMAZIONI\n// =====================\n@keyframes dotIn {\n  0% {\n    transform: scale(0.5);\n    background-color: var(--color-neutral-0);\n    border-color: var(--color-neutral-200);\n    box-shadow: 0 0 0 3px var(--color-neutral-200);\n    color: transparent;\n  }\n  40% {\n    background-color: $accent-dot;\n    border-color: $accent-dot;\n    box-shadow: 0 0 0 3px $accent-ring;\n    color: var(--color-neutral-0);\n  }\n  50%  { transform: scale(1.06); }\n  70%  { transform: scale(0.97); }\n  85%  { transform: scale(1.02); }\n  100% { transform: scale(1); }\n}\n\n@keyframes pulse {\n  0%, 100% { box-shadow: 0 0 0 3px $accent-ring; }\n  50%       { box-shadow: 0 0 0 3px $accent-ring, 0 0 0 6px $accent-glow; }\n}\n"],"mappings":"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","names":["timeline","vertical","item","track","connector","content","last","horizontal","dot","iconSlot","completed","active","pending","label","title","description","connectorHidden","connectorDone","dotIn","pulse"]}

package/dist/components/Timeline/index.d.cts

@@ -0,0 +1,22 @@
+import React from 'react';
+
+type TimelineStatus = "completed" | "active" | "pending";
+type TimelineOrientation = "vertical" | "horizontal";
+interface TimelineItem {
+    id: string | number;
+    title: string;
+    description?: string;
+    label?: string;
+    status?: TimelineStatus;
+    icon?: React.ReactNode;
+}
+interface TimelineProps {
+    items: TimelineItem[];
+    orientation?: TimelineOrientation;
+    /** Colore accent custom — sovrascrive il tema globale per questa istanza */
+    accent?: string;
+    className?: string;
+}
+declare const Timeline: React.FC<TimelineProps>;
+
+export { Timeline, type TimelineItem, type TimelineOrientation, type TimelineProps, type TimelineStatus };

package/dist/components/Timeline/index.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+
+type TimelineStatus = "completed" | "active" | "pending";
+type TimelineOrientation = "vertical" | "horizontal";
+interface TimelineItem {
+    id: string | number;
+    title: string;
+    description?: string;
+    label?: string;
+    status?: TimelineStatus;
+    icon?: React.ReactNode;
+}
+interface TimelineProps {
+    items: TimelineItem[];
+    orientation?: TimelineOrientation;
+    /** Colore accent custom — sovrascrive il tema globale per questa istanza */
+    accent?: string;
+    className?: string;
+}
+declare const Timeline: React.FC<TimelineProps>;
+
+export { Timeline, type TimelineItem, type TimelineOrientation, type TimelineProps, type TimelineStatus };