@jotyping/jap-ds 0.1.2-alpha

package/dist/components/icon-button/jap-icon-button.js

@@ -0,0 +1,52 @@
+import { unsafeCSS as l, LitElement as a, html as u } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/index.js";
+import { property as n, customElement as y } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/decorators.js";
+import f from "./jap-icon-button.scss.js";
+import "../button/jap-button.js";
+import "../flash/jap-flash.js";
+import "../footer/jap-footer.js";
+import "../header/jap-header.js";
+import "../heading/jap-heading.js";
+import "../icon/jap-icon.js";
+import "../image-link/jap-image-link.js";
+import "../link/jap-link.js";
+import "../modal/jap-modal.js";
+import "../navigation/jap-navigation.js";
+import "../tag/jap-tag.js";
+var h = Object.defineProperty, b = Object.getOwnPropertyDescriptor, p = (c, r, i, e) => {
+  for (var t = e > 1 ? void 0 : e ? b(r, i) : r, s = c.length - 1, m; s >= 0; s--)
+    (m = c[s]) && (t = (e ? m(r, i, t) : m(t)) || t);
+  return e && t && h(r, i, t), t;
+};
+let o = class extends a {
+  constructor() {
+    super(...arguments), this.type = "borderless", this.iconName = "puzzle", this.color = "black";
+  }
+  render() {
+    return u`
+      <button class=${this.type}>
+        <jap-icon
+          iconName=${this.iconName}
+          color=${this.color}
+          size=${this.type === "borderless" ? "48px" : "32px"}
+        ></jap-icon>
+      </button>
+    `;
+  }
+};
+o.styles = l(f);
+p([
+  n({ type: String })
+], o.prototype, "type", 2);
+p([
+  n({ type: String })
+], o.prototype, "iconName", 2);
+p([
+  n({ type: String })
+], o.prototype, "color", 2);
+o = p([
+  y("jap-icon-button")
+], o);
+export {
+  o as JapIconButton
+};
+//# sourceMappingURL=jap-icon-button.js.map

package/dist/components/icon-button/jap-icon-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"jap-icon-button.js","sources":["../../../src/components/icon-button/jap-icon-button.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport style from \"./jap-icon-button.scss?inline\";\nimport { IconName } from \"../icon/jap-icon.ts\";\nimport \"../../components\";\n\n@customElement(\"jap-icon-button\")\nexport class JapIconButton extends LitElement {\n  static styles = unsafeCSS(style);\n\n  /**\n   * Button type, can be \"primary\" or \"secondary\".\n   */\n  @property({ type: String }) type: \"borderless\" | \"border\" = \"borderless\";\n\n  /**\n   * Icon name.\n   */\n  @property({ type: String }) iconName: IconName = \"puzzle\";\n\n  /**\n   * Icon color.\n   */\n  @property({ type: String }) color:\n    | \"red\"\n    | \"purple\"\n    | \"blue\"\n    | \"black\"\n    | \"white\"\n    | \"neutral-200\"\n    | \"neutral-400\"\n    | \"neutral-600\" = \"black\";\n\n  render() {\n    return html`\n      <button class=${this.type}>\n        <jap-icon\n          iconName=${this.iconName}\n          color=${this.color}\n          size=${this.type === \"borderless\" ? \"48px\" : \"32px\"}\n        ></jap-icon>\n      </button>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"jap-icon-button\": JapIconButton;\n  }\n}\n"],"names":["JapIconButton","LitElement","html","unsafeCSS","style","__decorateClass","property","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;AAOO,IAAMA,IAAN,cAA4BC,EAAW;AAAA,EAAvC,cAAA;AAAA,UAAA,GAAA,SAAA,GAMuB,KAAA,OAAgC,cAKhC,KAAA,WAAqB,UAKrB,KAAA,QAQR;AAAA,EAAA;AAAA,EAEpB,SAAS;AACP,WAAOC;AAAA,sBACW,KAAK,IAAI;AAAA;AAAA,qBAEV,KAAK,QAAQ;AAAA,kBAChB,KAAK,KAAK;AAAA,iBACX,KAAK,SAAS,eAAe,SAAS,MAAM;AAAA;AAAA;AAAA;AAAA,EAI3D;AACF;AArCaF,EACJ,SAASG,EAAUC,CAAK;AAKHC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GANfN,EAMiB,WAAA,QAAA,CAAA;AAKAK,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAXfN,EAWiB,WAAA,YAAA,CAAA;AAKAK,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAhBfN,EAgBiB,WAAA,SAAA,CAAA;AAhBjBA,IAANK,EAAA;AAAA,EADNE,EAAc,iBAAiB;AAAA,GACnBP,CAAA;"}

package/dist/components/icon-button/jap-icon-button.scss.js

@@ -0,0 +1,5 @@
+const o = '@font-face{font-family:Satoshi-Regular;src:url(/assets/Satoshi-Regular.woff2) format("woff2"),url(/assets/Satoshi-Regular.woff) format("woff");font-weight:400;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Italic;src:url(/assets/Satoshi-Italic.woff2) format("woff2"),url(/assets/Satoshi-Italic.woff) format("woff");font-weight:400;font-display:swap;font-style:italic}@font-face{font-family:Satoshi-Bold;src:url(/assets/Satoshi-Bold.woff2) format("woff2"),url(/assets/Satoshi-Bold.woff) format("woff");font-weight:700;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Black;src:url(/assets/Satoshi-Black.woff2) format("woff2"),url(/assets/Satoshi-Black.woff) format("woff");font-weight:900;font-display:swap;font-style:normal}:host{display:inline-block;height:48px;width:48px}:host([active]) button.borderless{color:#3a3a3a}button{cursor:pointer;border:none;padding:0;width:48px;height:48px}button.borderless{color:#3a3a3a;background-color:#fff}button.borderless:hover{color:#ff4d2a}button.border{color:#3a3a3a;background-color:#fff;outline:2px solid #3a3a3a;outline-offset:-2px;border-radius:24px}';
+export {
+  o as default
+};
+//# sourceMappingURL=jap-icon-button.scss.js.map

package/dist/components/icon-button/jap-icon-button.scss.js.map

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

package/dist/components/image-link/jap-image-link.js

@@ -0,0 +1,63 @@
+import { LitElement as n, html as c, unsafeCSS as v } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/index.js";
+import { property as l, customElement as d } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/decorators.js";
+import f from "./jap-image-link.scss.js";
+import { SignalWatcher as h } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/@lit-labs/signals/index.js";
+import { breakpoint as g } from "../../stores/breakpoint-store.js";
+import { classMap as u } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/directives/class-map.js";
+import "../button/jap-button.js";
+import "../flash/jap-flash.js";
+import "../footer/jap-footer.js";
+import "../header/jap-header.js";
+import "../heading/jap-heading.js";
+import "../icon/jap-icon.js";
+import "../icon-button/jap-icon-button.js";
+import "../link/jap-link.js";
+import "../modal/jap-modal.js";
+import "../navigation/jap-navigation.js";
+import "../tag/jap-tag.js";
+var y = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, o = (i, e, s, p) => {
+  for (var t = p > 1 ? void 0 : p ? _(e, s) : e, m = i.length - 1, a; m >= 0; m--)
+    (a = i[m]) && (t = (p ? a(e, s, t) : a(t)) || t);
+  return p && t && y(e, s, t), t;
+};
+let r = class extends h(n) {
+  constructor() {
+    super(...arguments), this.href = "", this.target = "_blank", this.description = "";
+  }
+  render() {
+    const i = {
+      title: !0,
+      [g.get()]: !0
+    };
+    return c`
+      <div>
+        <a href="${this.href}" target="${this.target}">
+          <div class="link-wrapper">
+            <div class=${u(i)}>
+              <slot></slot>
+            </div>
+            <div class="divider"></div>
+            <div class="description">${this.description}</div>
+          </div>
+        </a>
+      </div>
+    `;
+  }
+};
+r.styles = v(f);
+o([
+  l({ type: String })
+], r.prototype, "href", 2);
+o([
+  l({ type: String })
+], r.prototype, "target", 2);
+o([
+  l({ type: String })
+], r.prototype, "description", 2);
+r = o([
+  d("jap-image-link")
+], r);
+export {
+  r as JapImageLink
+};
+//# sourceMappingURL=jap-image-link.js.map

package/dist/components/image-link/jap-image-link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"jap-image-link.js","sources":["../../../src/components/image-link/jap-image-link.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport style from \"./jap-image-link.scss?inline\";\nimport { SignalWatcher } from \"@lit-labs/signals\";\nimport { breakpoint } from \"../../stores/breakpoint-store\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport \"../../components\";\n\n@customElement(\"jap-image-link\")\nexport class JapImageLink extends SignalWatcher(LitElement) {\n  static styles = unsafeCSS(style);\n  @property({ type: String }) href = \"\";\n  @property({ type: String }) target: \"_blank\" | \"_bla\" = \"_blank\";\n  @property({ type: String }) description = \"\";\n\n  render() {\n    const titleClass = {\n      title: true,\n      [breakpoint.get()]: true,\n    };\n\n    return html`\n      <div>\n        <a href=\"${this.href}\" target=\"${this.target}\">\n          <div class=\"link-wrapper\">\n            <div class=${classMap(titleClass)}>\n              <slot></slot>\n            </div>\n            <div class=\"divider\"></div>\n            <div class=\"description\">${this.description}</div>\n          </div>\n        </a>\n      </div>\n    `;\n  }\n}\n"],"names":["JapImageLink","SignalWatcher","LitElement","titleClass","breakpoint","html","classMap","unsafeCSS","style","__decorateClass","property","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AASO,IAAMA,IAAN,cAA2BC,EAAcC,CAAU,EAAE;AAAA,EAArD,cAAA;AAAA,UAAA,GAAA,SAAA,GAEuB,KAAA,OAAO,IACP,KAAA,SAA4B,UAC5B,KAAA,cAAc;AAAA,EAAA;AAAA,EAE1C,SAAS;AACP,UAAMC,IAAa;AAAA,MACjB,OAAO;AAAA,MACP,CAACC,EAAW,KAAK,GAAG;AAAA,IAAA;AAGtB,WAAOC;AAAA;AAAA,mBAEQ,KAAK,IAAI,aAAa,KAAK,MAAM;AAAA;AAAA,yBAE3BC,EAASH,CAAU,CAAC;AAAA;AAAA;AAAA;AAAA,uCAIN,KAAK,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,EAKrD;AACF;AA1BaH,EACJ,SAASO,EAAUC,CAAK;AACHC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAFfV,EAEiB,WAAA,QAAA,CAAA;AACAS,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAHfV,EAGiB,WAAA,UAAA,CAAA;AACAS,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAJfV,EAIiB,WAAA,eAAA,CAAA;AAJjBA,IAANS,EAAA;AAAA,EADNE,EAAc,gBAAgB;AAAA,GAClBX,CAAA;"}

package/dist/components/image-link/jap-image-link.scss.js

@@ -0,0 +1,5 @@
+const t = '@font-face{font-family:Satoshi-Regular;src:url(/assets/Satoshi-Regular.woff2) format("woff2"),url(/assets/Satoshi-Regular.woff) format("woff");font-weight:400;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Italic;src:url(/assets/Satoshi-Italic.woff2) format("woff2"),url(/assets/Satoshi-Italic.woff) format("woff");font-weight:400;font-display:swap;font-style:italic}@font-face{font-family:Satoshi-Bold;src:url(/assets/Satoshi-Bold.woff2) format("woff2"),url(/assets/Satoshi-Bold.woff) format("woff");font-weight:700;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Black;src:url(/assets/Satoshi-Black.woff2) format("woff2"),url(/assets/Satoshi-Black.woff) format("woff");font-weight:900;font-display:swap;font-style:normal}:host{display:inline-block}.link-wrapper{display:flex;flex-direction:column;gap:4px;width:auto}a{color:#3a3a3a;text-decoration:none;background-color:transparent}a:hover{color:#3a3a3a}.title.l{font-family:Satoshi-Italic,sans-serif;font-size:34px;line-height:52px}.title.m,.title.s{font-family:Satoshi-Italic,sans-serif;font-size:28px;line-height:42px}.divider{border-bottom:solid 2px #3a3a3a;height:1px}.description{font-family:Satoshi-Regular,sans-serif;font-size:22px;line-height:32px}';
+export {
+  t as default
+};
+//# sourceMappingURL=jap-image-link.scss.js.map

package/dist/components/image-link/jap-image-link.scss.js.map

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

package/dist/components/link/jap-link.js

@@ -0,0 +1,43 @@
+import { unsafeCSS as f, LitElement as v, html as h } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/index.js";
+import { property as l, customElement as m } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/decorators.js";
+import c from "./jap-link.scss.js";
+var y = Object.defineProperty, d = Object.getOwnPropertyDescriptor, p = (a, e, i, s) => {
+  for (var t = s > 1 ? void 0 : s ? d(e, i) : e, o = a.length - 1, n; o >= 0; o--)
+    (n = a[o]) && (t = (s ? n(e, i, t) : n(t)) || t);
+  return s && t && y(e, i, t), t;
+};
+let r = class extends v {
+  constructor() {
+    super(...arguments), this.href = "", this.target = "_blank", this.description = "";
+  }
+  render() {
+    return h`
+      <div>
+        <a href="${this.href}" target="${this.target}">
+          <div class="link-wrapper">
+            <div class="title">
+              <slot></slot>
+            </div>
+          </div>
+        </a>
+      </div>
+    `;
+  }
+};
+r.styles = f(c);
+p([
+  l({ type: String })
+], r.prototype, "href", 2);
+p([
+  l({ type: String })
+], r.prototype, "target", 2);
+p([
+  l({ type: String })
+], r.prototype, "description", 2);
+r = p([
+  m("jap-link")
+], r);
+export {
+  r as JapLink
+};
+//# sourceMappingURL=jap-link.js.map

package/dist/components/link/jap-link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"jap-link.js","sources":["../../../src/components/link/jap-link.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport style from \"./jap-link.scss?inline\";\n\n@customElement(\"jap-link\")\nexport class JapLink extends LitElement {\n  static styles = unsafeCSS(style);\n  @property({ type: String }) href = \"\";\n  @property({ type: String }) target: \"_blank\" | \"_bla\" = \"_blank\";\n  @property({ type: String }) description = \"\";\n\n  render() {\n    return html`\n      <div>\n        <a href=\"${this.href}\" target=\"${this.target}\">\n          <div class=\"link-wrapper\">\n            <div class=\"title\">\n              <slot></slot>\n            </div>\n          </div>\n        </a>\n      </div>\n    `;\n  }\n}\n"],"names":["JapLink","LitElement","html","unsafeCSS","style","__decorateClass","property","customElement"],"mappings":";;;;;;;;AAKO,IAAMA,IAAN,cAAsBC,EAAW;AAAA,EAAjC,cAAA;AAAA,UAAA,GAAA,SAAA,GAEuB,KAAA,OAAO,IACP,KAAA,SAA4B,UAC5B,KAAA,cAAc;AAAA,EAAA;AAAA,EAE1C,SAAS;AACP,WAAOC;AAAA;AAAA,mBAEQ,KAAK,IAAI,aAAa,KAAK,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASlD;AACF;AAnBaF,EACJ,SAASG,EAAUC,CAAK;AACHC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAFfN,EAEiB,WAAA,QAAA,CAAA;AACAK,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAHfN,EAGiB,WAAA,UAAA,CAAA;AACAK,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAJfN,EAIiB,WAAA,eAAA,CAAA;AAJjBA,IAANK,EAAA;AAAA,EADNE,EAAc,UAAU;AAAA,GACZP,CAAA;"}

package/dist/components/link/jap-link.scss.js

@@ -0,0 +1,5 @@
+const t = '@font-face{font-family:Satoshi-Regular;src:url(/assets/Satoshi-Regular.woff2) format("woff2"),url(/assets/Satoshi-Regular.woff) format("woff");font-weight:400;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Italic;src:url(/assets/Satoshi-Italic.woff2) format("woff2"),url(/assets/Satoshi-Italic.woff) format("woff");font-weight:400;font-display:swap;font-style:italic}@font-face{font-family:Satoshi-Bold;src:url(/assets/Satoshi-Bold.woff2) format("woff2"),url(/assets/Satoshi-Bold.woff) format("woff");font-weight:700;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Black;src:url(/assets/Satoshi-Black.woff2) format("woff2"),url(/assets/Satoshi-Black.woff) format("woff");font-weight:900;font-display:swap;font-style:normal}:host{display:inline-block}.link-wrapper{display:flex;flex-direction:column;gap:4px;width:auto}a{color:#3a3a3a;text-decoration:none;background-color:transparent}a:hover{color:#3a3a3a;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}.title{font-family:Satoshi-Regular,sans-serif;font-size:22px;line-height:32px}';
+export {
+  t as default
+};
+//# sourceMappingURL=jap-link.scss.js.map

package/dist/components/link/jap-link.scss.js.map

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

package/dist/components/modal/jap-modal.js

@@ -0,0 +1,86 @@
+import { LitElement as d, html as h, unsafeCSS as u } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/index.js";
+import { property as m, customElement as v } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/decorators.js";
+import f from "./jap-modal.scss.js";
+import { SignalWatcher as b } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/@lit-labs/signals/index.js";
+import { classMap as p } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/directives/class-map.js";
+import "../button/jap-button.js";
+import "../flash/jap-flash.js";
+import "../footer/jap-footer.js";
+import "../header/jap-header.js";
+import "../heading/jap-heading.js";
+import "../icon/jap-icon.js";
+import "../icon-button/jap-icon-button.js";
+import "../image-link/jap-image-link.js";
+import "../link/jap-link.js";
+import "../navigation/jap-navigation.js";
+import "../tag/jap-tag.js";
+import { breakpoint as l } from "../../stores/breakpoint-store.js";
+var y = Object.defineProperty, w = Object.getOwnPropertyDescriptor, c = (i, e, s, o) => {
+  for (var t = o > 1 ? void 0 : o ? w(e, s) : e, n = i.length - 1, a; n >= 0; n--)
+    (a = i[n]) && (t = (o ? a(e, s, t) : a(t)) || t);
+  return o && t && y(e, s, t), t;
+};
+let r = class extends b(d) {
+  constructor() {
+    super(...arguments), this.show = !1, this.type = "default";
+  }
+  render() {
+    const i = {
+      backdrop: !0,
+      hidden: !this.show || l.get() === "s"
+    }, e = {
+      content: !0,
+      [l.get()]: !0,
+      hidden: !this.show
+    }, s = {
+      "btn-close-wrapper": !0,
+      [this.type]: !0,
+      [l.get()]: !0
+    }, o = {
+      "content-body": !0,
+      [l.get()]: !0
+    };
+    return h`<slot name="button" @click=${() => this.show = !0}></slot>
+      <div
+        class=${p(i)}
+        @click=${() => {
+      this.show = !1;
+    }}
+      ></div>
+      <div class=${p(e)}>
+        <div class=${p(s)}>
+          <jap-icon-button
+            iconName="x"
+            color="black"
+            type="borderless"
+            @click=${() => {
+      this.show = !1;
+    }}
+          ></jap-icon-button>
+        </div>
+        <div class="content-wrapper">
+          <slot></slot>
+          <div class="content-header">
+            <slot name="header"></slot>
+          </div>
+          <div class=${p(o)}>
+            <slot name="content"></slot>
+          </div>
+        </div>
+      </div>`;
+  }
+};
+r.styles = u(f);
+c([
+  m({ type: Boolean })
+], r.prototype, "show", 2);
+c([
+  m({ type: String, reflect: !0 })
+], r.prototype, "type", 2);
+r = c([
+  v("jap-modal")
+], r);
+export {
+  r as JapModal
+};
+//# sourceMappingURL=jap-modal.js.map

package/dist/components/modal/jap-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"jap-modal.js","sources":["../../../src/components/modal/jap-modal.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport style from \"./jap-modal.scss?inline\";\nimport { SignalWatcher } from \"@lit-labs/signals\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport \"../../components\";\nimport { breakpoint } from \"../../stores/breakpoint-store\";\n\n@customElement(\"jap-modal\")\nexport class JapModal extends SignalWatcher(LitElement) {\n  static styles = unsafeCSS(style);\n\n  @property({ type: Boolean }) show = false;\n  @property({ type: String, reflect: true })\n  type: \"default\" | \"header\" = \"default\";\n\n  render() {\n    const backdropClasses = {\n      backdrop: true,\n      hidden: !this.show || breakpoint.get() === \"s\",\n    };\n\n    const contentClasses = {\n      content: true,\n      [breakpoint.get()]: true,\n      hidden: !this.show,\n    };\n\n    const btnCloseClasses = {\n      \"btn-close-wrapper\": true,\n      [this.type]: true,\n      [breakpoint.get()]: true,\n    };\n\n    const contentBodyClasses = {\n      \"content-body\": true,\n      [breakpoint.get()]: true,\n    };\n\n    return html`<slot name=\"button\" @click=${() => (this.show = true)}></slot>\n      <div\n        class=${classMap(backdropClasses)}\n        @click=${() => {\n          this.show = false;\n        }}\n      ></div>\n      <div class=${classMap(contentClasses)}>\n        <div class=${classMap(btnCloseClasses)}>\n          <jap-icon-button\n            iconName=\"x\"\n            color=\"black\"\n            type=\"borderless\"\n            @click=${() => {\n              this.show = false;\n            }}\n          ></jap-icon-button>\n        </div>\n        <div class=\"content-wrapper\">\n          <slot></slot>\n          <div class=\"content-header\">\n            <slot name=\"header\"></slot>\n          </div>\n          <div class=${classMap(contentBodyClasses)}>\n            <slot name=\"content\"></slot>\n          </div>\n        </div>\n      </div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"jap-modal\": JapModal;\n  }\n}\n"],"names":["JapModal","SignalWatcher","LitElement","backdropClasses","breakpoint","contentClasses","btnCloseClasses","contentBodyClasses","html","classMap","unsafeCSS","style","__decorateClass","property","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AASO,IAAMA,IAAN,cAAuBC,EAAcC,CAAU,EAAE;AAAA,EAAjD,cAAA;AAAA,UAAA,GAAA,SAAA,GAGwB,KAAA,OAAO,IAEpC,KAAA,OAA6B;AAAA,EAAA;AAAA,EAE7B,SAAS;AACP,UAAMC,IAAkB;AAAA,MACtB,UAAU;AAAA,MACV,QAAQ,CAAC,KAAK,QAAQC,EAAW,UAAU;AAAA,IAAA,GAGvCC,IAAiB;AAAA,MACrB,SAAS;AAAA,MACT,CAACD,EAAW,IAAA,CAAK,GAAG;AAAA,MACpB,QAAQ,CAAC,KAAK;AAAA,IAAA,GAGVE,IAAkB;AAAA,MACtB,qBAAqB;AAAA,MACrB,CAAC,KAAK,IAAI,GAAG;AAAA,MACb,CAACF,EAAW,KAAK,GAAG;AAAA,IAAA,GAGhBG,IAAqB;AAAA,MACzB,gBAAgB;AAAA,MAChB,CAACH,EAAW,KAAK,GAAG;AAAA,IAAA;AAGtB,WAAOI,+BAAkC,MAAO,KAAK,OAAO,EAAK;AAAA;AAAA,gBAErDC,EAASN,CAAe,CAAC;AAAA,iBACxB,MAAM;AACb,WAAK,OAAO;AAAA,IACd,CAAC;AAAA;AAAA,mBAEUM,EAASJ,CAAc,CAAC;AAAA,qBACtBI,EAASH,CAAe,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,qBAKzB,MAAM;AACb,WAAK,OAAO;AAAA,IACd,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAQUG,EAASF,CAAkB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,EAKjD;AACF;AA3DaP,EACJ,SAASU,EAAUC,CAAK;AAEFC,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GAHhBb,EAGkB,WAAA,QAAA,CAAA;AAE7BY,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAJ9Bb,EAKX,WAAA,QAAA,CAAA;AALWA,IAANY,EAAA;AAAA,EADNE,EAAc,WAAW;AAAA,GACbd,CAAA;"}

package/dist/components/modal/jap-modal.scss.js

@@ -0,0 +1,5 @@
+const t = '@font-face{font-family:Satoshi-Regular;src:url(/assets/Satoshi-Regular.woff2) format("woff2"),url(/assets/Satoshi-Regular.woff) format("woff");font-weight:400;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Italic;src:url(/assets/Satoshi-Italic.woff2) format("woff2"),url(/assets/Satoshi-Italic.woff) format("woff");font-weight:400;font-display:swap;font-style:italic}@font-face{font-family:Satoshi-Bold;src:url(/assets/Satoshi-Bold.woff2) format("woff2"),url(/assets/Satoshi-Bold.woff) format("woff");font-weight:700;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Black;src:url(/assets/Satoshi-Black.woff2) format("woff2"),url(/assets/Satoshi-Black.woff) format("woff");font-weight:900;font-display:swap;font-style:normal}.content{display:flex;background-color:#fff;position:fixed;z-index:1001}.content.s{top:0;left:0;height:100vh;width:100vw}.content.m{top:70px;left:70px;height:calc(100vh - 140px);width:calc(100vw - 140px)}.content.l{top:150px;left:150px;height:calc(100vh - 300px);width:calc(100vw - 300px)}.content.hidden{display:none}.content-wrapper{width:100%;height:inherit;overflow:hidden}.content-header{font-family:Satoshi-Bold,sans-serif;font-size:24px;line-height:42px;width:100%;display:flex;flex-direction:row;justify-content:center;align-items:center;height:90px}.content-body{font-family:Satoshi-Regular,sans-serif;font-size:22px;line-height:32px;display:flex;padding:40px;overflow-y:auto}.content-body.s{height:calc(100vh - 170px);width:calc(100vw - 80px)}.content-body.m{height:calc(100vh - 230px);width:calc(100vw - 220px)}.content-body.l{height:calc(100vh - 390px);width:calc(100vw - 380px)}.backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;z-index:999;display:block}.backdrop.hidden{display:none}.btn-close-wrapper{position:absolute;z-index:1000;top:20px;right:20px}.btn-close-wrapper.header.s{top:60px;right:32px}';
+export {
+  t as default
+};
+//# sourceMappingURL=jap-modal.scss.js.map

package/dist/components/modal/jap-modal.scss.js.map

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

package/dist/components/navigation/jap-navigation.js

@@ -0,0 +1,44 @@
+import { LitElement as a, html as l, unsafeCSS as n } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/index.js";
+import { customElement as v } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/decorators.js";
+import c from "./jap-navigation.scss.js";
+import { SignalWatcher as f } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/@lit-labs/signals/index.js";
+import { breakpoint as d } from "../../stores/breakpoint-store.js";
+import { classMap as u } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/directives/class-map.js";
+import "../button/jap-button.js";
+import "../flash/jap-flash.js";
+import "../footer/jap-footer.js";
+import "../header/jap-header.js";
+import "../heading/jap-heading.js";
+import "../icon/jap-icon.js";
+import "../icon-button/jap-icon-button.js";
+import "../image-link/jap-image-link.js";
+import "../link/jap-link.js";
+import "../modal/jap-modal.js";
+import "../tag/jap-tag.js";
+var g = Object.getOwnPropertyDescriptor, _ = (r, i, s, p) => {
+  for (var t = p > 1 ? void 0 : p ? g(i, s) : i, o = r.length - 1, m; o >= 0; o--)
+    (m = r[o]) && (t = m(t) || t);
+  return t;
+};
+let e = class extends f(a) {
+  render() {
+    const r = {
+      "navi-wrapper": !0,
+      [d.get()]: !0
+    };
+    return l`
+      <div class=${u(r)}>
+        <slot></slot>
+        <div class="border-slider"></div>
+      </div>
+    `;
+  }
+};
+e.styles = n(c);
+e = _([
+  v("jap-navigation")
+], e);
+export {
+  e as JapNavigation
+};
+//# sourceMappingURL=jap-navigation.js.map

package/dist/components/navigation/jap-navigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"jap-navigation.js","sources":["../../../src/components/navigation/jap-navigation.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { customElement } from \"lit/decorators.js\";\nimport style from \"./jap-navigation.scss?inline\";\nimport { SignalWatcher } from \"@lit-labs/signals\";\nimport { breakpoint } from \"../../stores/breakpoint-store\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport \"../../components\";\n\n@customElement(\"jap-navigation\")\nexport class JapNavigation extends SignalWatcher(LitElement) {\n  static styles = unsafeCSS(style);\n\n  render() {\n    const naviWrapperClass = {\n      \"navi-wrapper\": true,\n      [breakpoint.get()]: true,\n    };\n\n    return html`\n      <div class=${classMap(naviWrapperClass)}>\n        <slot></slot>\n        <div class=\"border-slider\"></div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"jap-navigation\": JapNavigation;\n  }\n}\n"],"names":["JapNavigation","SignalWatcher","LitElement","naviWrapperClass","breakpoint","html","classMap","unsafeCSS","style","__decorateClass","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AASO,IAAMA,IAAN,cAA4BC,EAAcC,CAAU,EAAE;AAAA,EAG3D,SAAS;AACP,UAAMC,IAAmB;AAAA,MACvB,gBAAgB;AAAA,MAChB,CAACC,EAAW,KAAK,GAAG;AAAA,IAAA;AAGtB,WAAOC;AAAA,mBACQC,EAASH,CAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,EAK3C;AACF;AAhBaH,EACJ,SAASO,EAAUC,CAAK;AADpBR,IAANS,EAAA;AAAA,EADNC,EAAc,gBAAgB;AAAA,GAClBV,CAAA;"}

package/dist/components/navigation/jap-navigation.scss.js

@@ -0,0 +1,5 @@
+const e = ":host{display:inline-block}.navi-wrapper{display:flex;flex-direction:row;gap:12px;flex-wrap:wrap}.navi-wrapper.s{flex-direction:column;gap:16px;width:100%;align-items:center;margin-top:100px}";
+export {
+  e as default
+};
+//# sourceMappingURL=jap-navigation.scss.js.map

package/dist/components/navigation/jap-navigation.scss.js.map

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

package/dist/components/tag/jap-tag.js

@@ -0,0 +1,36 @@
+import { unsafeCSS as l, LitElement as a, html as n } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/index.js";
+import { customElement as v } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/decorators.js";
+import f from "./jap-tag.scss.js";
+import "../button/jap-button.js";
+import "../flash/jap-flash.js";
+import "../footer/jap-footer.js";
+import "../header/jap-header.js";
+import "../heading/jap-heading.js";
+import "../icon/jap-icon.js";
+import "../icon-button/jap-icon-button.js";
+import "../image-link/jap-image-link.js";
+import "../link/jap-link.js";
+import "../modal/jap-modal.js";
+import "../navigation/jap-navigation.js";
+var c = Object.getOwnPropertyDescriptor, g = (o, p, s, m) => {
+  for (var t = m > 1 ? void 0 : m ? c(p, s) : p, r = o.length - 1, i; r >= 0; r--)
+    (i = o[r]) && (t = i(t) || t);
+  return t;
+};
+let e = class extends a {
+  render() {
+    return n`
+      <div class="tag-wrapper">
+        <slot></slot>
+      </div>
+    `;
+  }
+};
+e.styles = l(f);
+e = g([
+  v("jap-tag")
+], e);
+export {
+  e as JapTag
+};
+//# sourceMappingURL=jap-tag.js.map

package/dist/components/tag/jap-tag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"jap-tag.js","sources":["../../../src/components/tag/jap-tag.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { customElement } from \"lit/decorators.js\";\nimport style from \"./jap-tag.scss?inline\";\nimport \"../../components\";\n\n@customElement(\"jap-tag\")\nexport class JapTag extends LitElement {\n  static styles = unsafeCSS(style);\n\n  render() {\n    return html`\n      <div class=\"tag-wrapper\">\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"jap-tag\": JapTag;\n  }\n}\n"],"names":["JapTag","LitElement","html","unsafeCSS","style","__decorateClass","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;AAMO,IAAMA,IAAN,cAAqBC,EAAW;AAAA,EAGrC,SAAS;AACP,WAAOC;AAAA;AAAA;AAAA;AAAA;AAAA,EAKT;AACF;AAVaF,EACJ,SAASG,EAAUC,CAAK;AADpBJ,IAANK,EAAA;AAAA,EADNC,EAAc,SAAS;AAAA,GACXN,CAAA;"}

package/dist/components/tag/jap-tag.scss.js

@@ -0,0 +1,5 @@
+const o = '@font-face{font-family:Satoshi-Regular;src:url(/assets/Satoshi-Regular.woff2) format("woff2"),url(/assets/Satoshi-Regular.woff) format("woff");font-weight:400;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Italic;src:url(/assets/Satoshi-Italic.woff2) format("woff2"),url(/assets/Satoshi-Italic.woff) format("woff");font-weight:400;font-display:swap;font-style:italic}@font-face{font-family:Satoshi-Bold;src:url(/assets/Satoshi-Bold.woff2) format("woff2"),url(/assets/Satoshi-Bold.woff) format("woff");font-weight:700;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Black;src:url(/assets/Satoshi-Black.woff2) format("woff2"),url(/assets/Satoshi-Black.woff) format("woff");font-weight:900;font-display:swap;font-style:normal}:host{display:inline-block}.tag-wrapper{font-family:Satoshi-Bold,sans-serif;font-size:24px;line-height:42px;display:flex;align-items:center;justify-content:center;padding:0 20px;border-radius:32px;height:64px;border:none;color:#3a3a3a;background-color:#f3f3f3}';
+export {
+  o as default
+};
+//# sourceMappingURL=jap-tag.scss.js.map

package/dist/components/tag/jap-tag.scss.js.map

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

package/dist/index.js

@@ -0,0 +1,29 @@
+/* empty css                      */
+/* empty css                 */
+import { JapButton as t } from "./components/button/jap-button.js";
+import { JapFlash as m } from "./components/flash/jap-flash.js";
+import { JapFooter as x } from "./components/footer/jap-footer.js";
+import { JapHeader as n } from "./components/header/jap-header.js";
+import { JapHeading as g } from "./components/heading/jap-heading.js";
+import { JapIcon as I } from "./components/icon/jap-icon.js";
+import { JapIconButton as k } from "./components/icon-button/jap-icon-button.js";
+import { JapImageLink as u } from "./components/image-link/jap-image-link.js";
+import { JapLink as F } from "./components/link/jap-link.js";
+import { JapModal as L } from "./components/modal/jap-modal.js";
+import { JapNavigation as s } from "./components/navigation/jap-navigation.js";
+import { JapTag as M } from "./components/tag/jap-tag.js";
+export {
+  t as JapButton,
+  m as JapFlash,
+  x as JapFooter,
+  n as JapHeader,
+  g as JapHeading,
+  I as JapIcon,
+  k as JapIconButton,
+  u as JapImageLink,
+  F as JapLink,
+  L as JapModal,
+  s as JapNavigation,
+  M as JapTag
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

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

package/dist/stores/breakpoint-store.js

@@ -0,0 +1,13 @@
+import { signal as t } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/@lit-labs/signals/index.js";
+const e = t(i(window.innerWidth));
+function i(n) {
+  return n < 600 ? "s" : n < 1024 ? "m" : "l";
+}
+window.addEventListener("resize", () => {
+  const n = i(window.innerWidth);
+  n !== e.get() && e.set(n);
+});
+export {
+  e as breakpoint
+};
+//# sourceMappingURL=breakpoint-store.js.map

package/dist/stores/breakpoint-store.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakpoint-store.js","sources":["../../src/stores/breakpoint-store.ts"],"sourcesContent":["import { signal } from \"@lit-labs/signals\";\n\nexport const breakpoint = signal<string>(getBreakpoint(window.innerWidth));\n\nfunction getBreakpoint(width: number): string {\n  if (width < 600) return \"s\";\n  if (width < 1024) return \"m\";\n  return \"l\";\n}\n\nwindow.addEventListener(\"resize\", () => {\n  const newBp = getBreakpoint(window.innerWidth);\n  if (newBp !== breakpoint.get()) {\n    breakpoint.set(newBp);\n  }\n});\n"],"names":["breakpoint","signal","getBreakpoint","width","newBp"],"mappings":";AAEO,MAAMA,IAAaC,EAAeC,EAAc,OAAO,UAAU,CAAC;AAEzE,SAASA,EAAcC,GAAuB;AAC5C,SAAIA,IAAQ,MAAY,MACpBA,IAAQ,OAAa,MAClB;AACT;AAEA,OAAO,iBAAiB,UAAU,MAAM;AACtC,QAAMC,IAAQF,EAAc,OAAO,UAAU;AAC7C,EAAIE,MAAUJ,EAAW,SACvBA,EAAW,IAAII,CAAK;AAExB,CAAC;"}

package/dist/styles/fonts-Bq9ey8UU.css

@@ -0,0 +1 @@
+@font-face{font-family:Satoshi-Regular;src:url(/assets/Satoshi-Regular.woff2) format("woff2"),url(/assets/Satoshi-Regular.woff) format("woff");font-weight:400;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Italic;src:url(/assets/Satoshi-Italic.woff2) format("woff2"),url(/assets/Satoshi-Italic.woff) format("woff");font-weight:400;font-display:swap;font-style:italic}@font-face{font-family:Satoshi-Bold;src:url(/assets/Satoshi-Bold.woff2) format("woff2"),url(/assets/Satoshi-Bold.woff) format("woff");font-weight:700;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Black;src:url(/assets/Satoshi-Black.woff2) format("woff2"),url(/assets/Satoshi-Black.woff) format("woff");font-weight:900;font-display:swap;font-style:normal}

package/dist/styles/variables-D5EJvzLN.css

@@ -0,0 +1 @@
+@font-face{font-family:Satoshi-Regular;src:url(/assets/Satoshi-Regular.woff2) format("woff2"),url(/assets/Satoshi-Regular.woff) format("woff");font-weight:400;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Italic;src:url(/assets/Satoshi-Italic.woff2) format("woff2"),url(/assets/Satoshi-Italic.woff) format("woff");font-weight:400;font-display:swap;font-style:italic}@font-face{font-family:Satoshi-Bold;src:url(/assets/Satoshi-Bold.woff2) format("woff2"),url(/assets/Satoshi-Bold.woff) format("woff");font-weight:700;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Black;src:url(/assets/Satoshi-Black.woff2) format("woff2"),url(/assets/Satoshi-Black.woff) format("woff");font-weight:900;font-display:swap;font-style:normal}body,html{font-family:Satoshi-Regular,Helvetica,Arial,"sans-serif";font-weight:400;font-display:swap;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0;box-sizing:border-box}

package/dist/vite.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

package/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "@jotyping/jap-ds",
+  "version": "0.1.2-alpha",
+  "description": "jap design system",
+  "author": "Johannes Pfleghar",
+  "homepage": "https://www.johannespfleghar.de",
+  "license": "SEE LICENSE IN LICENSE.md",
+  "type": "module",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
+  "dependencies": {
+    "@lit-labs/signals": "^0.1.3",
+    "lit": "^3.2.1"
+  },
+  "devDependencies": {
+    "@chromatic-com/storybook": "^4.1.3",
+    "@eslint/js": "^9.20.0",
+    "@storybook/addon-docs": "^10.1.11",
+    "@storybook/web-components-vite": "^10.1.11",
+    "@types/node": "^24.1.0",
+    "eslint": "^9.20.1",
+    "eslint-plugin-storybook": "^10.1.11",
+    "globals": "^15.15.0",
+    "prettier": "3.5.1",
+    "sass-embedded": "^1.85.0",
+    "storybook": "^10.1.11",
+    "typescript": "~5.7.2",
+    "typescript-eslint": "^8.24.0",
+    "vite": "^6.1.0"
+  },
+  "eslintConfig": {
+    "extends": [
+      "plugin:storybook/recommended"
+    ]
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE.md"
+  ]
+}