@mellow.io/ds 0.1.0

package/dist/components/tabs/tabs.styles.js

@@ -0,0 +1,184 @@
+import { css as e } from "lit";
+const o = e`
+  :host {
+    display: block;
+  }
+
+  .tablist {
+    display: flex;
+    align-items: center;
+    gap: var(--mellow-space-0, 0px);
+    overflow: clip;
+    background-color: var(--mellow-bg-fill-tabs-default, rgba(193, 148, 118, 0.2));
+    border-radius: var(--mellow-radius-3-5, 14px);
+  }
+
+  :host([size='md']) .tablist {
+    border-radius: var(--mellow-radius-3, 12px);
+  }
+
+  :host([size='sm']) .tablist {
+    border-radius: var(--mellow-radius-2-5, 10px);
+  }
+
+  /* ---- Tab button base ---- */
+
+  .tab {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--mellow-space-2, 8px);
+    flex-shrink: 0;
+    border: none;
+    background: none;
+    cursor: pointer;
+    padding: 0 var(--mellow-space-6, 24px);
+    height: 52px;
+    border-radius: var(--mellow-radius-3-5, 14px);
+    font-family: var(--mellow-typography-font-family-body, 'Suisse Int\\'l', system-ui, sans-serif);
+    font-weight: var(--mellow-font-weight-regular, 400);
+    font-size: var(--mellow-font-size-18, 18px);
+    line-height: var(--mellow-line-height-24, 24px);
+    letter-spacing: 0;
+    color: var(--mellow-text-primary, #232222);
+    transition: background-color 150ms ease, color 150ms ease;
+  }
+
+  /* ---- Size: md (B2 42) ---- */
+
+  :host([size='md']) .tab {
+    height: 42px;
+    padding: 0 var(--mellow-space-5, 20px);
+    border-radius: var(--mellow-radius-3, 12px);
+    font-size: var(--mellow-font-size-16, 16px);
+    line-height: var(--mellow-line-height-22, 22px);
+  }
+
+  /* ---- Size: sm (B3 32) ---- */
+
+  :host([size='sm']) .tab {
+    height: 32px;
+    padding: 0 var(--mellow-space-3, 12px);
+    border-radius: var(--mellow-radius-2-5, 10px);
+    font-size: var(--mellow-font-size-14, 14px);
+    line-height: var(--mellow-line-height-18, 18px);
+  }
+
+  /* ---- Icon-only tab ---- */
+
+  .tab.icon-only {
+    padding: 0;
+    width: 52px;
+    aspect-ratio: 1;
+  }
+
+  :host([size='md']) .tab.icon-only {
+    width: 42px;
+  }
+
+  :host([size='sm']) .tab.icon-only {
+    width: 32px;
+  }
+
+  /* ---- States ---- */
+
+  .tab:hover:not(:disabled):not(.selected) {
+    background-color: var(--mellow-bg-fill-tabs-hovered, #e4d3c4);
+  }
+
+  .tab.selected {
+    background-color: var(--mellow-bg-fill-tabs-selected, #f6d8ba);
+    color: var(--mellow-text-brand, #ff6f23);
+  }
+
+  .tab:focus-visible {
+    outline: 2px solid var(--mellow-colors-primary-mellow-orange, #ff6f23);
+    outline-offset: -2px;
+  }
+
+  .tab[disabled] {
+    opacity: 0.48;
+    cursor: not-allowed;
+  }
+
+  /* ---- Tab content layout ---- */
+
+  .tab-label {
+    flex-shrink: 0;
+  }
+
+  /* ---- Icon slots ---- */
+
+  .tab-icon {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    overflow: clip;
+    width: 24px;
+    height: 24px;
+  }
+
+  :host([size='md']) .tab-icon {
+    width: 20px;
+    height: 20px;
+  }
+
+  :host([size='sm']) .tab-icon {
+    width: 16px;
+    height: 16px;
+  }
+
+  /* ---- Counter badge ---- */
+
+  .tab-counter {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    min-width: 26px;
+    padding: var(--mellow-space-0-5, 2px) var(--mellow-space-2, 8px);
+    border-radius: var(--mellow-radius-2-5, 10px);
+    background-color: var(--mellow-pearl-bush-400-32, rgba(193, 148, 118, 0.32));
+    font-family: var(--mellow-typography-font-family-body, 'Suisse Int\\'l', system-ui, sans-serif);
+    font-weight: var(--mellow-font-weight-medium, 500);
+    font-size: var(--mellow-font-size-16, 16px);
+    line-height: var(--mellow-line-height-22, 22px);
+    color: var(--mellow-text-primary, #232222);
+    text-align: center;
+  }
+
+  :host([size='md']) .tab-counter {
+    min-width: 22px;
+    padding: var(--mellow-space-0-5, 2px) var(--mellow-space-1-5, 6px);
+    border-radius: var(--mellow-radius-2, 8px);
+    font-size: var(--mellow-font-size-14, 14px);
+    line-height: var(--mellow-line-height-18, 18px);
+  }
+
+  :host([size='sm']) .tab-counter {
+    min-width: 18px;
+    padding: var(--mellow-space-0-5, 2px) var(--mellow-space-1, 4px);
+    border-radius: var(--mellow-radius-1-5, 6px);
+    font-size: var(--mellow-font-size-12, 12px);
+    line-height: var(--mellow-line-height-14, 14px);
+  }
+
+  /* ---- Settings spacer ---- */
+
+  .settings-spacer {
+    align-self: stretch;
+    width: 8px;
+    flex-shrink: 0;
+  }
+
+  /* ---- Hidden slot ---- */
+
+  slot {
+    display: none;
+  }
+`;
+export {
+  o as tabsStyles
+};
+//# sourceMappingURL=tabs.styles.js.map

package/dist/components/tabs/tabs.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.styles.js","sources":["../../../src/components/tabs/tabs.styles.ts"],"sourcesContent":["import { css } from 'lit'\n\nexport const tabsStyles = css`\n  :host {\n    display: block;\n  }\n\n  .tablist {\n    display: flex;\n    align-items: center;\n    gap: var(--mellow-space-0, 0px);\n    overflow: clip;\n    background-color: var(--mellow-bg-fill-tabs-default, rgba(193, 148, 118, 0.2));\n    border-radius: var(--mellow-radius-3-5, 14px);\n  }\n\n  :host([size='md']) .tablist {\n    border-radius: var(--mellow-radius-3, 12px);\n  }\n\n  :host([size='sm']) .tablist {\n    border-radius: var(--mellow-radius-2-5, 10px);\n  }\n\n  /* ---- Tab button base ---- */\n\n  .tab {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--mellow-space-2, 8px);\n    flex-shrink: 0;\n    border: none;\n    background: none;\n    cursor: pointer;\n    padding: 0 var(--mellow-space-6, 24px);\n    height: 52px;\n    border-radius: var(--mellow-radius-3-5, 14px);\n    font-family: var(--mellow-typography-font-family-body, 'Suisse Int\\\\'l', system-ui, sans-serif);\n    font-weight: var(--mellow-font-weight-regular, 400);\n    font-size: var(--mellow-font-size-18, 18px);\n    line-height: var(--mellow-line-height-24, 24px);\n    letter-spacing: 0;\n    color: var(--mellow-text-primary, #232222);\n    transition: background-color 150ms ease, color 150ms ease;\n  }\n\n  /* ---- Size: md (B2 42) ---- */\n\n  :host([size='md']) .tab {\n    height: 42px;\n    padding: 0 var(--mellow-space-5, 20px);\n    border-radius: var(--mellow-radius-3, 12px);\n    font-size: var(--mellow-font-size-16, 16px);\n    line-height: var(--mellow-line-height-22, 22px);\n  }\n\n  /* ---- Size: sm (B3 32) ---- */\n\n  :host([size='sm']) .tab {\n    height: 32px;\n    padding: 0 var(--mellow-space-3, 12px);\n    border-radius: var(--mellow-radius-2-5, 10px);\n    font-size: var(--mellow-font-size-14, 14px);\n    line-height: var(--mellow-line-height-18, 18px);\n  }\n\n  /* ---- Icon-only tab ---- */\n\n  .tab.icon-only {\n    padding: 0;\n    width: 52px;\n    aspect-ratio: 1;\n  }\n\n  :host([size='md']) .tab.icon-only {\n    width: 42px;\n  }\n\n  :host([size='sm']) .tab.icon-only {\n    width: 32px;\n  }\n\n  /* ---- States ---- */\n\n  .tab:hover:not(:disabled):not(.selected) {\n    background-color: var(--mellow-bg-fill-tabs-hovered, #e4d3c4);\n  }\n\n  .tab.selected {\n    background-color: var(--mellow-bg-fill-tabs-selected, #f6d8ba);\n    color: var(--mellow-text-brand, #ff6f23);\n  }\n\n  .tab:focus-visible {\n    outline: 2px solid var(--mellow-colors-primary-mellow-orange, #ff6f23);\n    outline-offset: -2px;\n  }\n\n  .tab[disabled] {\n    opacity: 0.48;\n    cursor: not-allowed;\n  }\n\n  /* ---- Tab content layout ---- */\n\n  .tab-label {\n    flex-shrink: 0;\n  }\n\n  /* ---- Icon slots ---- */\n\n  .tab-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    overflow: clip;\n    width: 24px;\n    height: 24px;\n  }\n\n  :host([size='md']) .tab-icon {\n    width: 20px;\n    height: 20px;\n  }\n\n  :host([size='sm']) .tab-icon {\n    width: 16px;\n    height: 16px;\n  }\n\n  /* ---- Counter badge ---- */\n\n  .tab-counter {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    min-width: 26px;\n    padding: var(--mellow-space-0-5, 2px) var(--mellow-space-2, 8px);\n    border-radius: var(--mellow-radius-2-5, 10px);\n    background-color: var(--mellow-pearl-bush-400-32, rgba(193, 148, 118, 0.32));\n    font-family: var(--mellow-typography-font-family-body, 'Suisse Int\\\\'l', system-ui, sans-serif);\n    font-weight: var(--mellow-font-weight-medium, 500);\n    font-size: var(--mellow-font-size-16, 16px);\n    line-height: var(--mellow-line-height-22, 22px);\n    color: var(--mellow-text-primary, #232222);\n    text-align: center;\n  }\n\n  :host([size='md']) .tab-counter {\n    min-width: 22px;\n    padding: var(--mellow-space-0-5, 2px) var(--mellow-space-1-5, 6px);\n    border-radius: var(--mellow-radius-2, 8px);\n    font-size: var(--mellow-font-size-14, 14px);\n    line-height: var(--mellow-line-height-18, 18px);\n  }\n\n  :host([size='sm']) .tab-counter {\n    min-width: 18px;\n    padding: var(--mellow-space-0-5, 2px) var(--mellow-space-1, 4px);\n    border-radius: var(--mellow-radius-1-5, 6px);\n    font-size: var(--mellow-font-size-12, 12px);\n    line-height: var(--mellow-line-height-14, 14px);\n  }\n\n  /* ---- Settings spacer ---- */\n\n  .settings-spacer {\n    align-self: stretch;\n    width: 8px;\n    flex-shrink: 0;\n  }\n\n  /* ---- Hidden slot ---- */\n\n  slot {\n    display: none;\n  }\n`\n"],"names":["tabsStyles","css"],"mappings":";AAEO,MAAMA,IAAaC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

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

@@ -0,0 +1,3 @@
+export { MellowTag } from './tag.js';
+export type { TagSize } from './tag.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/tag/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/tag/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AACpC,YAAY,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA"}

package/dist/components/tag/tag.d.ts

@@ -0,0 +1,18 @@
+import { LitElement } from 'lit';
+export type TagSize = 'sm' | 'md';
+export declare class MellowTag extends LitElement {
+    static styles: import("lit").CSSResult[];
+    size: TagSize;
+    selected: boolean;
+    disabled: boolean;
+    removable: boolean;
+    private _handleRemove;
+    private _handleClick;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mellow-tag': MellowTag;
+    }
+}
+//# sourceMappingURL=tag.d.ts.map

package/dist/components/tag/tag.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../src/components/tag/tag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAA;AAIpD,MAAM,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,CAAA;AAQjC,qBACa,SAAU,SAAQ,UAAU;IACvC,OAAgB,MAAM,4BAAc;IAGpC,IAAI,EAAE,OAAO,CAAO;IAGpB,QAAQ,UAAQ;IAGhB,QAAQ,UAAQ;IAGhB,SAAS,UAAQ;IAEjB,OAAO,CAAC,aAAa;IAWrB,OAAO,CAAC,YAAY;IAWX,MAAM;CA+BhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,SAAS,CAAA;KACxB;CACF"}

package/dist/components/tag/tag.js

@@ -0,0 +1,78 @@
+import { svg as d, LitElement as h, nothing as m, html as p } from "lit";
+import { property as a, customElement as u } from "lit/decorators.js";
+import { tagStyles as b } from "./tag.styles.js";
+var v = Object.defineProperty, f = Object.getOwnPropertyDescriptor, l = (e, o, n, r) => {
+  for (var t = r > 1 ? void 0 : r ? f(o, n) : o, i = e.length - 1, c; i >= 0; i--)
+    (c = e[i]) && (t = (r ? c(o, n, t) : c(t)) || t);
+  return r && t && v(o, n, t), t;
+};
+const y = d`
+  <svg viewBox="0 0 16 16" fill="none" width="16" height="16">
+    <path d="M4 4l8 8M12 4l-8 8" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+  </svg>
+`;
+let s = class extends h {
+  constructor() {
+    super(...arguments), this.size = "sm", this.selected = !1, this.disabled = !1, this.removable = !1;
+  }
+  _handleRemove(e) {
+    e.stopPropagation(), !this.disabled && this.dispatchEvent(new CustomEvent("mellow-remove", {
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  _handleClick() {
+    this.disabled || this.dispatchEvent(new CustomEvent("mellow-select", {
+      bubbles: !0,
+      composed: !0,
+      detail: { selected: !this.selected }
+    }));
+  }
+  render() {
+    return p`
+      <button
+        class="tag"
+        part="tag"
+        ?disabled=${this.disabled}
+        aria-pressed=${this.selected ? "true" : "false"}
+        @click=${this._handleClick}
+      >
+        <span class="content">
+          <slot name="icon-start"></slot>
+          <slot></slot>
+        </span>
+        <slot name="counter"></slot>
+        ${this.removable ? p`<span
+              class="remove-btn"
+              role="button"
+              tabindex="0"
+              aria-label="Remove"
+              @click=${this._handleRemove}
+              @keydown=${(e) => {
+      (e.key === "Enter" || e.key === " ") && this._handleRemove(e);
+    }}
+            >${y}</span>` : m}
+      </button>
+    `;
+  }
+};
+s.styles = [b];
+l([
+  a({ reflect: !0 })
+], s.prototype, "size", 2);
+l([
+  a({ type: Boolean, reflect: !0 })
+], s.prototype, "selected", 2);
+l([
+  a({ type: Boolean, reflect: !0 })
+], s.prototype, "disabled", 2);
+l([
+  a({ type: Boolean, reflect: !0 })
+], s.prototype, "removable", 2);
+s = l([
+  u("mellow-tag")
+], s);
+export {
+  s as MellowTag
+};
+//# sourceMappingURL=tag.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"tag.js","sources":["../../../src/components/tag/tag.ts"],"sourcesContent":["import { LitElement, html, svg, nothing } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { tagStyles } from './tag.styles.js'\n\nexport type TagSize = 'sm' | 'md'\n\nconst closeIcon = svg`\n  <svg viewBox=\"0 0 16 16\" fill=\"none\" width=\"16\" height=\"16\">\n    <path d=\"M4 4l8 8M12 4l-8 8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n  </svg>\n`\n\n@customElement('mellow-tag')\nexport class MellowTag extends LitElement {\n  static override styles = [tagStyles]\n\n  @property({ reflect: true })\n  size: TagSize = 'sm'\n\n  @property({ type: Boolean, reflect: true })\n  selected = false\n\n  @property({ type: Boolean, reflect: true })\n  disabled = false\n\n  @property({ type: Boolean, reflect: true })\n  removable = false\n\n  private _handleRemove(event: Event): void {\n    event.stopPropagation()\n    if (this.disabled) {\n      return\n    }\n    this.dispatchEvent(new CustomEvent('mellow-remove', {\n      bubbles: true,\n      composed: true,\n    }))\n  }\n\n  private _handleClick(): void {\n    if (this.disabled) {\n      return\n    }\n    this.dispatchEvent(new CustomEvent('mellow-select', {\n      bubbles: true,\n      composed: true,\n      detail: { selected: !this.selected },\n    }))\n  }\n\n  override render() {\n    return html`\n      <button\n        class=\"tag\"\n        part=\"tag\"\n        ?disabled=${this.disabled}\n        aria-pressed=${this.selected ? 'true' : 'false'}\n        @click=${this._handleClick}\n      >\n        <span class=\"content\">\n          <slot name=\"icon-start\"></slot>\n          <slot></slot>\n        </span>\n        <slot name=\"counter\"></slot>\n        ${this.removable\n          ? html`<span\n              class=\"remove-btn\"\n              role=\"button\"\n              tabindex=\"0\"\n              aria-label=\"Remove\"\n              @click=${this._handleRemove}\n              @keydown=${(e: KeyboardEvent) => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  this._handleRemove(e)\n                }\n              }}\n            >${closeIcon}</span>`\n          : nothing}\n      </button>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'mellow-tag': MellowTag\n  }\n}\n"],"names":["closeIcon","svg","MellowTag","LitElement","event","html","nothing","tagStyles","__decorateClass","property","customElement"],"mappings":";;;;;;;;AAMA,MAAMA,IAAYC;AAAA;AAAA;AAAA;AAAA;AAOX,IAAMC,IAAN,cAAwBC,EAAW;AAAA,EAAnC,cAAA;AAAA,UAAA,GAAA,SAAA,GAIL,KAAA,OAAgB,MAGhB,KAAA,WAAW,IAGX,KAAA,WAAW,IAGX,KAAA,YAAY;AAAA,EAAA;AAAA,EAEJ,cAAcC,GAAoB;AAExC,IADAA,EAAM,gBAAA,GACF,MAAK,YAGT,KAAK,cAAc,IAAI,YAAY,iBAAiB;AAAA,MAClD,SAAS;AAAA,MACT,UAAU;AAAA,IAAA,CACX,CAAC;AAAA,EACJ;AAAA,EAEQ,eAAqB;AAC3B,IAAI,KAAK,YAGT,KAAK,cAAc,IAAI,YAAY,iBAAiB;AAAA,MAClD,SAAS;AAAA,MACT,UAAU;AAAA,MACV,QAAQ,EAAE,UAAU,CAAC,KAAK,SAAA;AAAA,IAAS,CACpC,CAAC;AAAA,EACJ;AAAA,EAES,SAAS;AAChB,WAAOC;AAAA;AAAA;AAAA;AAAA,oBAIS,KAAK,QAAQ;AAAA,uBACV,KAAK,WAAW,SAAS,OAAO;AAAA,iBACtC,KAAK,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAOxB,KAAK,YACHA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAKW,KAAK,aAAa;AAAA,yBAChB,CAAC,MAAqB;AAC/B,OAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,QACjC,KAAK,cAAc,CAAC;AAAA,IAExB,CAAC;AAAA,eACAL,CAAS,YACZM,CAAO;AAAA;AAAA;AAAA,EAGjB;AACF;AApEaJ,EACK,SAAS,CAACK,CAAS;AAGnCC,EAAA;AAAA,EADCC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAHhBP,EAIX,WAAA,QAAA,CAAA;AAGAM,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAN/BP,EAOX,WAAA,YAAA,CAAA;AAGAM,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAT/BP,EAUX,WAAA,YAAA,CAAA;AAGAM,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAZ/BP,EAaX,WAAA,aAAA,CAAA;AAbWA,IAANM,EAAA;AAAA,EADNE,EAAc,YAAY;AAAA,GACdR,CAAA;"}

package/dist/components/tag/tag.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const tagStyles: import("lit").CSSResult;
+//# sourceMappingURL=tag.styles.d.ts.map

package/dist/components/tag/tag.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.styles.d.ts","sourceRoot":"","sources":["../../../src/components/tag/tag.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS,yBAmIrB,CAAA"}

package/dist/components/tag/tag.styles.js

@@ -0,0 +1,137 @@
+import { css as e } from "lit";
+const t = e`
+  :host {
+    display: inline-flex;
+    box-sizing: border-box;
+  }
+
+  .tag {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    border: none;
+    cursor: pointer;
+    font-family: var(--mellow-typography-font-family-body, 'Suisse Int\\'l', system-ui, sans-serif);
+    font-weight: var(--mellow-font-weight-regular, 400);
+    text-align: center;
+    letter-spacing: 0;
+    white-space: nowrap;
+    box-sizing: border-box;
+    transition: background-color 150ms ease;
+    background-color: var(--mellow-bg-fill-chips-default, rgba(228, 211, 196, 0.64));
+    color: var(--mellow-text-primary, #232222);
+  }
+
+  .tag:focus-visible {
+    outline: 2px solid var(--mellow-colors-primary-mellow-orange, #ff6f23);
+    outline-offset: 2px;
+  }
+
+  .content {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--mellow-space-1-5, 6px);
+  }
+
+  /* ---- Sizes ---- */
+
+  :host .tag,
+  :host([size='sm']) .tag {
+    height: 32px;
+    padding: 0 var(--mellow-space-3, 12px);
+    font-size: var(--mellow-font-size-14, 14px);
+    line-height: var(--mellow-line-height-18, 18px);
+    gap: var(--mellow-space-2, 8px);
+    border-radius: var(--mellow-radius-3, 12px);
+  }
+
+  :host([size='md']) .tag {
+    height: 42px;
+    padding: 0 var(--mellow-space-3-5, 14px);
+    font-size: var(--mellow-font-size-16, 16px);
+    line-height: var(--mellow-line-height-22, 22px);
+    gap: var(--mellow-space-2, 8px);
+    border-radius: var(--mellow-radius-4, 16px);
+  }
+
+  /* ---- States ---- */
+
+  .tag:hover:not(:disabled) {
+    background-color: var(--mellow-bg-fill-chips-hovered, #e4d3c4);
+  }
+
+  .tag:disabled {
+    opacity: 0.48;
+    cursor: not-allowed;
+  }
+
+  /* ---- Selected ---- */
+
+  :host([selected]) .tag {
+    background-color: var(--mellow-bg-fill-chips-pressed, #f6d8ba);
+    color: var(--mellow-text-brand, #ff6f23);
+  }
+
+  :host([selected]) .tag:hover:not(:disabled) {
+    background-color: var(--mellow-bg-fill-chips-pressed, #f6d8ba);
+  }
+
+  /* ---- Icon slots ---- */
+
+  ::slotted([slot='icon-start']) {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    overflow: clip;
+  }
+
+  :host([size='sm']) ::slotted([slot='icon-start']),
+  ::slotted([slot='icon-start']) {
+    width: 16px;
+    height: 16px;
+  }
+
+  :host([size='md']) ::slotted([slot='icon-start']) {
+    width: 20px;
+    height: 20px;
+  }
+
+  /* ---- Counter slot ---- */
+
+  ::slotted([slot='counter']) {
+    flex-shrink: 0;
+  }
+
+  /* ---- Remove button ---- */
+
+  .remove-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    cursor: pointer;
+    color: inherit;
+    width: 16px;
+    height: 16px;
+    border-radius: 50%;
+    transition: opacity 150ms ease;
+  }
+
+  .remove-btn:hover {
+    opacity: 0.7;
+  }
+
+  .remove-btn:focus-visible {
+    outline: 2px solid var(--mellow-colors-primary-mellow-orange, #ff6f23);
+    outline-offset: 1px;
+  }
+
+  .tag:disabled .remove-btn {
+    cursor: not-allowed;
+  }
+`;
+export {
+  t as tagStyles
+};
+//# sourceMappingURL=tag.styles.js.map

package/dist/components/tag/tag.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.styles.js","sources":["../../../src/components/tag/tag.styles.ts"],"sourcesContent":["import { css } from 'lit'\n\nexport const tagStyles = css`\n  :host {\n    display: inline-flex;\n    box-sizing: border-box;\n  }\n\n  .tag {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    border: none;\n    cursor: pointer;\n    font-family: var(--mellow-typography-font-family-body, 'Suisse Int\\\\'l', system-ui, sans-serif);\n    font-weight: var(--mellow-font-weight-regular, 400);\n    text-align: center;\n    letter-spacing: 0;\n    white-space: nowrap;\n    box-sizing: border-box;\n    transition: background-color 150ms ease;\n    background-color: var(--mellow-bg-fill-chips-default, rgba(228, 211, 196, 0.64));\n    color: var(--mellow-text-primary, #232222);\n  }\n\n  .tag:focus-visible {\n    outline: 2px solid var(--mellow-colors-primary-mellow-orange, #ff6f23);\n    outline-offset: 2px;\n  }\n\n  .content {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--mellow-space-1-5, 6px);\n  }\n\n  /* ---- Sizes ---- */\n\n  :host .tag,\n  :host([size='sm']) .tag {\n    height: 32px;\n    padding: 0 var(--mellow-space-3, 12px);\n    font-size: var(--mellow-font-size-14, 14px);\n    line-height: var(--mellow-line-height-18, 18px);\n    gap: var(--mellow-space-2, 8px);\n    border-radius: var(--mellow-radius-3, 12px);\n  }\n\n  :host([size='md']) .tag {\n    height: 42px;\n    padding: 0 var(--mellow-space-3-5, 14px);\n    font-size: var(--mellow-font-size-16, 16px);\n    line-height: var(--mellow-line-height-22, 22px);\n    gap: var(--mellow-space-2, 8px);\n    border-radius: var(--mellow-radius-4, 16px);\n  }\n\n  /* ---- States ---- */\n\n  .tag:hover:not(:disabled) {\n    background-color: var(--mellow-bg-fill-chips-hovered, #e4d3c4);\n  }\n\n  .tag:disabled {\n    opacity: 0.48;\n    cursor: not-allowed;\n  }\n\n  /* ---- Selected ---- */\n\n  :host([selected]) .tag {\n    background-color: var(--mellow-bg-fill-chips-pressed, #f6d8ba);\n    color: var(--mellow-text-brand, #ff6f23);\n  }\n\n  :host([selected]) .tag:hover:not(:disabled) {\n    background-color: var(--mellow-bg-fill-chips-pressed, #f6d8ba);\n  }\n\n  /* ---- Icon slots ---- */\n\n  ::slotted([slot='icon-start']) {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    overflow: clip;\n  }\n\n  :host([size='sm']) ::slotted([slot='icon-start']),\n  ::slotted([slot='icon-start']) {\n    width: 16px;\n    height: 16px;\n  }\n\n  :host([size='md']) ::slotted([slot='icon-start']) {\n    width: 20px;\n    height: 20px;\n  }\n\n  /* ---- Counter slot ---- */\n\n  ::slotted([slot='counter']) {\n    flex-shrink: 0;\n  }\n\n  /* ---- Remove button ---- */\n\n  .remove-btn {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    cursor: pointer;\n    color: inherit;\n    width: 16px;\n    height: 16px;\n    border-radius: 50%;\n    transition: opacity 150ms ease;\n  }\n\n  .remove-btn:hover {\n    opacity: 0.7;\n  }\n\n  .remove-btn:focus-visible {\n    outline: 2px solid var(--mellow-colors-primary-mellow-orange, #ff6f23);\n    outline-offset: 1px;\n  }\n\n  .tag:disabled .remove-btn {\n    cursor: not-allowed;\n  }\n`\n"],"names":["tagStyles","css"],"mappings":";AAEO,MAAMA,IAAYC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

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

@@ -0,0 +1,3 @@
+export { MellowTextarea } from './textarea.js';
+export type { TextareaResize } from './textarea.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/textarea/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/textarea/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAC9C,YAAY,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA"}

package/dist/components/textarea/textarea.d.ts

@@ -0,0 +1,28 @@
+import { LitElement } from 'lit';
+export type TextareaResize = 'none' | 'vertical' | 'both';
+export declare class MellowTextarea extends LitElement {
+    static styles: import("lit").CSSResult[];
+    value: string;
+    placeholder: string;
+    label: string;
+    error: string;
+    helper: string;
+    disabled: boolean;
+    required: boolean;
+    rows: number;
+    resize: TextareaResize;
+    maxlength: number;
+    private _focused;
+    private _textarea;
+    private _handleInput;
+    private _handleChange;
+    private _handleFocus;
+    private _handleBlur;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mellow-textarea': MellowTextarea;
+    }
+}
+//# sourceMappingURL=textarea.d.ts.map

package/dist/components/textarea/textarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/components/textarea/textarea.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAA;AAK/C,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,CAAA;AAEzD,qBACa,cAAe,SAAQ,UAAU;IAC5C,OAAgB,MAAM,4BAAmB;IAGzC,KAAK,SAAK;IAGV,WAAW,SAAK;IAGhB,KAAK,SAAK;IASV,KAAK,SAAK;IAGV,MAAM,SAAK;IAGX,QAAQ,UAAQ;IAGhB,QAAQ,UAAQ;IAGhB,IAAI,SAAI;IAGR,MAAM,EAAE,cAAc,CAAa;IAGnC,SAAS,SAAI;IAGb,OAAO,CAAC,QAAQ,CAAQ;IAGxB,OAAO,CAAC,SAAS,CAAsB;IAEvC,OAAO,CAAC,YAAY;IASpB,OAAO,CAAC,aAAa;IASrB,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,WAAW;IAIV,MAAM;CAqDhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,cAAc,CAAA;KAClC;CACF"}

package/dist/components/textarea/textarea.js

@@ -0,0 +1,121 @@
+import { LitElement as d, nothing as p, html as i } from "lit";
+import { property as r, state as c, query as v, customElement as m } from "lit/decorators.js";
+import { classMap as x } from "lit/directives/class-map.js";
+import { textareaStyles as b } from "./textarea.styles.js";
+var f = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, t = (l, o, h, a) => {
+  for (var s = a > 1 ? void 0 : a ? $(o, h) : o, u = l.length - 1, n; u >= 0; u--)
+    (n = l[u]) && (s = (a ? n(o, h, s) : n(s)) || s);
+  return a && s && f(o, h, s), s;
+};
+let e = class extends d {
+  constructor() {
+    super(...arguments), this.value = "", this.placeholder = "", this.label = "", this.error = "", this.helper = "", this.disabled = !1, this.required = !1, this.rows = 3, this.resize = "vertical", this.maxlength = 0, this._focused = !1;
+  }
+  _handleInput() {
+    this.value = this._textarea.value, this.dispatchEvent(new CustomEvent("mellow-input", {
+      detail: { value: this.value },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  _handleChange() {
+    this.value = this._textarea.value, this.dispatchEvent(new CustomEvent("mellow-change", {
+      detail: { value: this.value },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  _handleFocus() {
+    this._focused = !0;
+  }
+  _handleBlur() {
+    this._focused = !1;
+  }
+  render() {
+    const l = this.error || this.helper ? "helper-text" : void 0, o = {
+      "textarea-container": !0,
+      focused: this._focused
+    }, h = !!(this.error || this.helper), a = this.maxlength > 0, s = `${this.value.length} / ${this.maxlength}`;
+    return i`
+      <div class="wrapper">
+        ${this.label ? i`<label class="label" for="textarea">${this.label}</label>` : p}
+        <div class="textarea-helper">
+          <div class=${x(o)}>
+            <textarea
+              id="textarea"
+              .value=${this.value}
+              placeholder=${this.placeholder}
+              ?disabled=${this.disabled}
+              ?required=${this.required}
+              rows=${this.rows}
+              maxlength=${this.maxlength > 0 ? this.maxlength : p}
+              style="resize: ${this.resize}"
+              aria-invalid=${this.error ? "true" : "false"}
+              aria-describedby=${l ?? p}
+              @input=${this._handleInput}
+              @change=${this._handleChange}
+              @focus=${this._handleFocus}
+              @blur=${this._handleBlur}
+            ></textarea>
+          </div>
+          ${h || a ? i`
+              <div class="helper-row">
+                ${this.error ? i`<div class="helper" id="helper-text" role="alert">${this.error}</div>` : this.helper ? i`<div class="helper" id="helper-text">${this.helper}</div>` : i`<div></div>`}
+                ${a ? i`<span class="char-count">${s}</span>` : p}
+              </div>
+            ` : p}
+        </div>
+      </div>
+    `;
+  }
+};
+e.styles = [b];
+t([
+  r()
+], e.prototype, "value", 2);
+t([
+  r()
+], e.prototype, "placeholder", 2);
+t([
+  r()
+], e.prototype, "label", 2);
+t([
+  r({
+    reflect: !0,
+    converter: {
+      fromAttribute: (l) => l ?? "",
+      toAttribute: (l) => l || null
+    }
+  })
+], e.prototype, "error", 2);
+t([
+  r()
+], e.prototype, "helper", 2);
+t([
+  r({ type: Boolean, reflect: !0 })
+], e.prototype, "disabled", 2);
+t([
+  r({ type: Boolean, reflect: !0 })
+], e.prototype, "required", 2);
+t([
+  r({ type: Number })
+], e.prototype, "rows", 2);
+t([
+  r()
+], e.prototype, "resize", 2);
+t([
+  r({ type: Number })
+], e.prototype, "maxlength", 2);
+t([
+  c()
+], e.prototype, "_focused", 2);
+t([
+  v("textarea")
+], e.prototype, "_textarea", 2);
+e = t([
+  m("mellow-textarea")
+], e);
+export {
+  e as MellowTextarea
+};
+//# sourceMappingURL=textarea.js.map

package/dist/components/textarea/textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"textarea.js","sources":["../../../src/components/textarea/textarea.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit'\nimport { customElement, property, state, query } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { textareaStyles } from './textarea.styles.js'\n\nexport type TextareaResize = 'none' | 'vertical' | 'both'\n\n@customElement('mellow-textarea')\nexport class MellowTextarea extends LitElement {\n  static override styles = [textareaStyles]\n\n  @property()\n  value = ''\n\n  @property()\n  placeholder = ''\n\n  @property()\n  label = ''\n\n  @property({\n    reflect: true,\n    converter: {\n      fromAttribute: (value: string | null) => value ?? '',\n      toAttribute: (value: string) => value || null,\n    },\n  })\n  error = ''\n\n  @property()\n  helper = ''\n\n  @property({ type: Boolean, reflect: true })\n  disabled = false\n\n  @property({ type: Boolean, reflect: true })\n  required = false\n\n  @property({ type: Number })\n  rows = 3\n\n  @property()\n  resize: TextareaResize = 'vertical'\n\n  @property({ type: Number })\n  maxlength = 0\n\n  @state()\n  private _focused = false\n\n  @query('textarea')\n  private _textarea!: HTMLTextAreaElement\n\n  private _handleInput(): void {\n    this.value = this._textarea.value\n    this.dispatchEvent(new CustomEvent('mellow-input', {\n      detail: { value: this.value },\n      bubbles: true,\n      composed: true,\n    }))\n  }\n\n  private _handleChange(): void {\n    this.value = this._textarea.value\n    this.dispatchEvent(new CustomEvent('mellow-change', {\n      detail: { value: this.value },\n      bubbles: true,\n      composed: true,\n    }))\n  }\n\n  private _handleFocus(): void {\n    this._focused = true\n  }\n\n  private _handleBlur(): void {\n    this._focused = false\n  }\n\n  override render() {\n    const helperId = this.error || this.helper ? 'helper-text' : undefined\n    const containerClasses = {\n      'textarea-container': true,\n      'focused': this._focused,\n    }\n\n    const hasHelperText = Boolean(this.error || this.helper)\n    const showCharCount = this.maxlength > 0\n    const charCountText = `${this.value.length} / ${this.maxlength}`\n\n    return html`\n      <div class=\"wrapper\">\n        ${this.label\n          ? html`<label class=\"label\" for=\"textarea\">${this.label}</label>`\n          : nothing}\n        <div class=\"textarea-helper\">\n          <div class=${classMap(containerClasses)}>\n            <textarea\n              id=\"textarea\"\n              .value=${this.value}\n              placeholder=${this.placeholder}\n              ?disabled=${this.disabled}\n              ?required=${this.required}\n              rows=${this.rows}\n              maxlength=${this.maxlength > 0 ? this.maxlength : nothing}\n              style=\"resize: ${this.resize}\"\n              aria-invalid=${this.error ? 'true' : 'false'}\n              aria-describedby=${helperId ?? nothing}\n              @input=${this._handleInput}\n              @change=${this._handleChange}\n              @focus=${this._handleFocus}\n              @blur=${this._handleBlur}\n            ></textarea>\n          </div>\n          ${hasHelperText || showCharCount\n            ? html`\n              <div class=\"helper-row\">\n                ${this.error\n                  ? html`<div class=\"helper\" id=\"helper-text\" role=\"alert\">${this.error}</div>`\n                  : this.helper\n                    ? html`<div class=\"helper\" id=\"helper-text\">${this.helper}</div>`\n                    : html`<div></div>`}\n                ${showCharCount\n                  ? html`<span class=\"char-count\">${charCountText}</span>`\n                  : nothing}\n              </div>\n            `\n            : nothing}\n        </div>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'mellow-textarea': MellowTextarea\n  }\n}\n"],"names":["MellowTextarea","LitElement","helperId","containerClasses","hasHelperText","showCharCount","charCountText","html","nothing","classMap","textareaStyles","__decorateClass","property","value","state","query","customElement"],"mappings":"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"}

package/dist/components/textarea/textarea.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const textareaStyles: import("lit").CSSResult;
+//# sourceMappingURL=textarea.styles.d.ts.map

package/dist/components/textarea/textarea.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"textarea.styles.d.ts","sourceRoot":"","sources":["../../../src/components/textarea/textarea.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,yBA4I1B,CAAA"}