@warp-ds/elements 2.0.0-next.2 → 2.0.0-next.4

package/dist/packages/broadcast/index.js

@@ -1,9 +1,6 @@
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => {
-  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 
 // packages/broadcast/component.js
 import { html } from "lit";
@@ -64,8 +61,7 @@ __publicField(WarpBroadcast, "properties", {
   _messages: {
     state: true,
     hasChanged(newVal, oldVal) {
-      if (!oldVal || oldVal.length === 0)
-        return true;
+      if (!oldVal || oldVal.length === 0) return true;
       const newIds = newVal.map(({ id }) => id).sort();
       const oldIds = oldVal.map(({ id }) => id).sort();
       return JSON.stringify(newIds) !== JSON.stringify(oldIds);

package/dist/packages/broadcast/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../packages/broadcast/component.js", "../../../packages/utils/window-exists.js", "../../../packages/broadcast/index.js"],
   "sourcesContent": ["import { html } from 'lit';\n\nimport WarpElement from '@warp-ds/elements-core';\nimport { repeat } from 'lit/directives/repeat.js';\n\nimport { windowExists } from '../utils/window-exists';\n\nexport class WarpBroadcast extends WarpElement {\n  static properties = {\n    _messages: {\n      state: true,\n      hasChanged(newVal, oldVal) {\n        if (!oldVal || oldVal.length === 0) return true;\n        const newIds = newVal.map(({ id }) => id).sort();\n        const oldIds = oldVal.map(({ id }) => id).sort();\n        return JSON.stringify(newIds) !== JSON.stringify(oldIds);\n      },\n    },\n    _hiddenMessageIds: {\n      state: true,\n      type: Array,\n    },\n    interval: { type: Number, attribute: true, reflect: true },\n    url: { type: String, attribute: true, reflect: true },\n    api: { type: String, attribute: true, reflect: true },\n  };\n\n  static styles = [WarpElement.styles];\n\n  constructor() {\n    super();\n    this._messages = [];\n    this.interval = 30000;\n    this._hiddenMessageIds = [];\n    this.url = windowExists ? window.location.href : '';\n  }\n\n  async connectedCallback() {\n    super.connectedCallback();\n    if (!this.api) {\n      console.error('Broadcast \"api\" attribute invalid or undefined');\n      return;\n    }\n    if (windowExists) {\n      await this._fetchMessage();\n      setInterval(() => this._fetchMessage(), this.interval);\n    }\n  }\n\n  async _fetchMessage() {\n    const url = `${this.api}?path=${this.url}`;\n    try {\n      const res = await (await fetch(url)).json();\n      this._messages = res.length ? res : [];\n    } catch (err) {\n      console.error(`failed to fetch broadcasts from given url (${url})`, err);\n    }\n  }\n\n  async _del(id) {\n    const el = this.renderRoot.querySelector(`#broadcast-${id}`);\n    await el.collapse();\n    this._hiddenMessageIds = [...new Set([...this._hiddenMessageIds, id])];\n  }\n\n  render() {\n    const messages = this._messages.filter((item) => !this._hiddenMessageIds.includes(item.id));\n\n    return html`\n      <aside class=${`${messages.length === 0 ? 'hidden' : 'mb-16'}`}>\n        ${repeat(\n          messages,\n          ({ id }) => `broadcast-${id}`,\n          ({ id, message }) =>\n            html`<w-toast id=\"broadcast-${id}\" type=\"warning\" text=\"${message}\" canclose @close=${() => this._del(id)}> </w-toast>`,\n        )}\n      </aside>\n    `;\n  }\n}\n", "export const windowExists = typeof window !== 'undefined';\n", "import { WarpBroadcast } from './component';\n\nif (!customElements.get('w-broadcast')) {\n  customElements.define('w-broadcast', WarpBroadcast);\n}\n\nexport { WarpBroadcast };\n"],
-  "mappings": ";;;;;;;;AAAA,SAAS,YAAY;AAErB,OAAO,iBAAiB;AACxB,SAAS,cAAc;;;ACHhB,IAAM,eAAe,OAAO,WAAW;;;ADOvC,IAAM,gBAAN,cAA4B,YAAY;AAAA,EAsB7C,cAAc;AACZ,UAAM;AACN,SAAK,YAAY,CAAC;AAClB,SAAK,WAAW;AAChB,SAAK,oBAAoB,CAAC;AAC1B,SAAK,MAAM,eAAe,OAAO,SAAS,OAAO;AAAA,EACnD;AAAA,EAEA,MAAM,oBAAoB;AACxB,UAAM,kBAAkB;AACxB,QAAI,CAAC,KAAK,KAAK;AACb,cAAQ,MAAM,gDAAgD;AAC9D;AAAA,IACF;AACA,QAAI,cAAc;AAChB,YAAM,KAAK,cAAc;AACzB,kBAAY,MAAM,KAAK,cAAc,GAAG,KAAK,QAAQ;AAAA,IACvD;AAAA,EACF;AAAA,EAEA,MAAM,gBAAgB;AACpB,UAAM,MAAM,GAAG,KAAK,GAAG,SAAS,KAAK,GAAG;AACxC,QAAI;AACF,YAAM,MAAM,OAAO,MAAM,MAAM,GAAG,GAAG,KAAK;AAC1C,WAAK,YAAY,IAAI,SAAS,MAAM,CAAC;AAAA,IACvC,SAAS,KAAK;AACZ,cAAQ,MAAM,8CAA8C,GAAG,KAAK,GAAG;AAAA,IACzE;AAAA,EACF;AAAA,EAEA,MAAM,KAAK,IAAI;AACb,UAAM,KAAK,KAAK,WAAW,cAAc,cAAc,EAAE,EAAE;AAC3D,UAAM,GAAG,SAAS;AAClB,SAAK,oBAAoB,CAAC,GAAG,oBAAI,IAAI,CAAC,GAAG,KAAK,mBAAmB,EAAE,CAAC,CAAC;AAAA,EACvE;AAAA,EAEA,SAAS;AACP,UAAM,WAAW,KAAK,UAAU,OAAO,CAAC,SAAS,CAAC,KAAK,kBAAkB,SAAS,KAAK,EAAE,CAAC;AAE1F,WAAO;AAAA,qBACU,GAAG,SAAS,WAAW,IAAI,WAAW,OAAO,EAAE;AAAA,UAC1D;AAAA,MACA;AAAA,MACA,CAAC,EAAE,GAAG,MAAM,aAAa,EAAE;AAAA,MAC3B,CAAC,EAAE,IAAI,QAAQ,MACb,8BAA8B,EAAE,0BAA0B,OAAO,qBAAqB,MAAM,KAAK,KAAK,EAAE,CAAC;AAAA,IAC7G,CAAC;AAAA;AAAA;AAAA,EAGP;AACF;AAvEE,cADW,eACJ,cAAa;AAAA,EAClB,WAAW;AAAA,IACT,OAAO;AAAA,IACP,WAAW,QAAQ,QAAQ;AACzB,UAAI,CAAC,UAAU,OAAO,WAAW;AAAG,eAAO;AAC3C,YAAM,SAAS,OAAO,IAAI,CAAC,EAAE,GAAG,MAAM,EAAE,EAAE,KAAK;AAC/C,YAAM,SAAS,OAAO,IAAI,CAAC,EAAE,GAAG,MAAM,EAAE,EAAE,KAAK;AAC/C,aAAO,KAAK,UAAU,MAAM,MAAM,KAAK,UAAU,MAAM;AAAA,IACzD;AAAA,EACF;AAAA,EACA,mBAAmB;AAAA,IACjB,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA,UAAU,EAAE,MAAM,QAAQ,WAAW,MAAM,SAAS,KAAK;AAAA,EACzD,KAAK,EAAE,MAAM,QAAQ,WAAW,MAAM,SAAS,KAAK;AAAA,EACpD,KAAK,EAAE,MAAM,QAAQ,WAAW,MAAM,SAAS,KAAK;AACtD;AAEA,cApBW,eAoBJ,UAAS,CAAC,YAAY,MAAM;;;AEzBrC,IAAI,CAAC,eAAe,IAAI,aAAa,GAAG;AACtC,iBAAe,OAAO,eAAe,aAAa;AACpD;",
+  "mappings": ";;;;;AAAA,SAAS,YAAY;AAErB,OAAO,iBAAiB;AACxB,SAAS,cAAc;;;ACHhB,IAAM,eAAe,OAAO,WAAW;;;ADOvC,IAAM,gBAAN,cAA4B,YAAY;AAAA,EAsB7C,cAAc;AACZ,UAAM;AACN,SAAK,YAAY,CAAC;AAClB,SAAK,WAAW;AAChB,SAAK,oBAAoB,CAAC;AAC1B,SAAK,MAAM,eAAe,OAAO,SAAS,OAAO;AAAA,EACnD;AAAA,EAEA,MAAM,oBAAoB;AACxB,UAAM,kBAAkB;AACxB,QAAI,CAAC,KAAK,KAAK;AACb,cAAQ,MAAM,gDAAgD;AAC9D;AAAA,IACF;AACA,QAAI,cAAc;AAChB,YAAM,KAAK,cAAc;AACzB,kBAAY,MAAM,KAAK,cAAc,GAAG,KAAK,QAAQ;AAAA,IACvD;AAAA,EACF;AAAA,EAEA,MAAM,gBAAgB;AACpB,UAAM,MAAM,GAAG,KAAK,GAAG,SAAS,KAAK,GAAG;AACxC,QAAI;AACF,YAAM,MAAM,OAAO,MAAM,MAAM,GAAG,GAAG,KAAK;AAC1C,WAAK,YAAY,IAAI,SAAS,MAAM,CAAC;AAAA,IACvC,SAAS,KAAK;AACZ,cAAQ,MAAM,8CAA8C,GAAG,KAAK,GAAG;AAAA,IACzE;AAAA,EACF;AAAA,EAEA,MAAM,KAAK,IAAI;AACb,UAAM,KAAK,KAAK,WAAW,cAAc,cAAc,EAAE,EAAE;AAC3D,UAAM,GAAG,SAAS;AAClB,SAAK,oBAAoB,CAAC,GAAG,oBAAI,IAAI,CAAC,GAAG,KAAK,mBAAmB,EAAE,CAAC,CAAC;AAAA,EACvE;AAAA,EAEA,SAAS;AACP,UAAM,WAAW,KAAK,UAAU,OAAO,CAAC,SAAS,CAAC,KAAK,kBAAkB,SAAS,KAAK,EAAE,CAAC;AAE1F,WAAO;AAAA,qBACU,GAAG,SAAS,WAAW,IAAI,WAAW,OAAO,EAAE;AAAA,UAC1D;AAAA,MACA;AAAA,MACA,CAAC,EAAE,GAAG,MAAM,aAAa,EAAE;AAAA,MAC3B,CAAC,EAAE,IAAI,QAAQ,MACb,8BAA8B,EAAE,0BAA0B,OAAO,qBAAqB,MAAM,KAAK,KAAK,EAAE,CAAC;AAAA,IAC7G,CAAC;AAAA;AAAA;AAAA,EAGP;AACF;AAvEE,cADW,eACJ,cAAa;AAAA,EAClB,WAAW;AAAA,IACT,OAAO;AAAA,IACP,WAAW,QAAQ,QAAQ;AACzB,UAAI,CAAC,UAAU,OAAO,WAAW,EAAG,QAAO;AAC3C,YAAM,SAAS,OAAO,IAAI,CAAC,EAAE,GAAG,MAAM,EAAE,EAAE,KAAK;AAC/C,YAAM,SAAS,OAAO,IAAI,CAAC,EAAE,GAAG,MAAM,EAAE,EAAE,KAAK;AAC/C,aAAO,KAAK,UAAU,MAAM,MAAM,KAAK,UAAU,MAAM;AAAA,IACzD;AAAA,EACF;AAAA,EACA,mBAAmB;AAAA,IACjB,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA,UAAU,EAAE,MAAM,QAAQ,WAAW,MAAM,SAAS,KAAK;AAAA,EACzD,KAAK,EAAE,MAAM,QAAQ,WAAW,MAAM,SAAS,KAAK;AAAA,EACpD,KAAK,EAAE,MAAM,QAAQ,WAAW,MAAM,SAAS,KAAK;AACtD;AAEA,cApBW,eAoBJ,UAAS,CAAC,YAAY,MAAM;;;AEzBrC,IAAI,CAAC,eAAe,IAAI,aAAa,GAAG;AACtC,iBAAe,OAAO,eAAe,aAAa;AACpD;",
   "names": []
 }

package/dist/packages/button/index.d.ts

@@ -58,6 +58,12 @@ export class WarpButton extends WarpButton_base {
     ariaValueTextLoading: string;
     connectedCallback(): void;
     firstUpdated(): void;
+    get _primaryClasses(): string[];
+    get _secondaryClasses(): string[];
+    get _utilityClasses(): string[];
+    get _negativeClasses(): string[];
+    get _pillClasses(): string[];
+    get _linkClasses(): string[];
     get _classes(): string;
     render(): import("lit").TemplateResult<1>;
 }

package/dist/packages/button/index.js

@@ -52,10 +52,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
-var __publicField = (obj, key, value) => {
-  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 
 // node_modules/.pnpm/unraw@3.0.0/node_modules/unraw/dist/errors.js
 var require_errors = __commonJS({
@@ -228,8 +225,7 @@ var require_moo = __commonJS({
         return "(" + s + ")";
       }
       function reUnion(regexps) {
-        if (!regexps.length)
-          return "(?!)";
+        if (!regexps.length) return "(?!)";
         var source = regexps.map(function(s) {
           return "(?:" + s + ")";
         }).join("|");
@@ -239,14 +235,10 @@ var require_moo = __commonJS({
         if (typeof obj === "string") {
           return "(?:" + reEscape(obj) + ")";
         } else if (isRegExp(obj)) {
-          if (obj.ignoreCase)
-            throw new Error("RegExp /i flag not allowed");
-          if (obj.global)
-            throw new Error("RegExp /g flag is implied");
-          if (obj.sticky)
-            throw new Error("RegExp /y flag is implied");
-          if (obj.multiline)
-            throw new Error("RegExp /m flag is implied");
+          if (obj.ignoreCase) throw new Error("RegExp /i flag not allowed");
+          if (obj.global) throw new Error("RegExp /g flag is implied");
+          if (obj.sticky) throw new Error("RegExp /y flag is implied");
+          if (obj.multiline) throw new Error("RegExp /m flag is implied");
           return obj.source;
         } else {
           throw new Error("Not a pattern: " + obj);
@@ -295,16 +287,14 @@ var require_moo = __commonJS({
           var match = [];
           rules.forEach(function(rule) {
             if (isObject(rule)) {
-              if (match.length)
-                result.push(ruleOptions(key, match));
+              if (match.length) result.push(ruleOptions(key, match));
               result.push(ruleOptions(key, rule));
               match = [];
             } else {
               match.push(rule);
             }
           });
-          if (match.length)
-            result.push(ruleOptions(key, match));
+          if (match.length) result.push(ruleOptions(key, match));
         }
         return result;
       }
@@ -439,8 +429,7 @@ var require_moo = __commonJS({
         var fallbackRule = errorRule && errorRule.fallback;
         var flags = hasSticky && !fallbackRule ? "ym" : "gm";
         var suffix2 = hasSticky || fallbackRule ? "" : "|";
-        if (unicodeFlag === true)
-          flags += "u";
+        if (unicodeFlag === true) flags += "u";
         var combined = new RegExp(reUnion(parts) + suffix2, flags);
         return { regexp: combined, groups, fast, error: errorRule || defaultErrorRule };
       }
@@ -461,8 +450,7 @@ var require_moo = __commonJS({
         var all = states.$all ? toRules(states.$all) : [];
         delete states.$all;
         var keys = Object.getOwnPropertyNames(states);
-        if (!start)
-          start = keys[0];
+        if (!start) start = keys[0];
         var ruleMap = /* @__PURE__ */ Object.create(null);
         for (var i = 0; i < keys.length; i++) {
           var key = keys[i];
@@ -474,8 +462,7 @@ var require_moo = __commonJS({
           var included = /* @__PURE__ */ Object.create(null);
           for (var j = 0; j < rules.length; j++) {
             var rule = rules[j];
-            if (!rule.include)
-              continue;
+            if (!rule.include) continue;
             var splice = [j, 1];
             if (rule.include !== key && !included[rule.include]) {
               included[rule.include] = true;
@@ -485,8 +472,7 @@ var require_moo = __commonJS({
               }
               for (var k = 0; k < newRules.length; k++) {
                 var newRule = newRules[k];
-                if (rules.indexOf(newRule) !== -1)
-                  continue;
+                if (rules.indexOf(newRule) !== -1) continue;
                 splice.push(newRule);
               }
             }
@@ -567,8 +553,7 @@ var require_moo = __commonJS({
         };
       };
       Lexer.prototype.setState = function(state) {
-        if (!state || this.state === state)
-          return;
+        if (!state || this.state === state) return;
         this.state = state;
         var info = this.states[state];
         this.groups = info.groups;
@@ -672,12 +657,9 @@ var require_moo = __commonJS({
           var err = new Error(this.formatError(token, "invalid syntax"));
           throw err;
         }
-        if (group.pop)
-          this.popState();
-        else if (group.push)
-          this.pushState(group.push);
-        else if (group.next)
-          this.setState(group.next);
+        if (group.pop) this.popState();
+        else if (group.push) this.pushState(group.push);
+        else if (group.next) this.setState(group.next);
         return token;
       };
       if (typeof Symbol !== "undefined" && Symbol.iterator) {
@@ -1032,8 +1014,7 @@ import { html } from "lit";
 
 // node_modules/.pnpm/@chbphone55+classnames@2.0.0/node_modules/@chbphone55/classnames/dist/index.m.js
 var r = function() {
-  for (var t = [], n = arguments.length; n--; )
-    t[n] = arguments[n];
+  for (var t = [], n = arguments.length; n--; ) t[n] = arguments[n];
   return t.reduce(function(t2, n2) {
     return t2.concat("string" == typeof n2 ? n2 : Array.isArray(n2) ? r.apply(void 0, n2) : "object" == typeof n2 && n2 ? Object.keys(n2).map(function(r2) {
       return n2[r2] ? r2 : "";
@@ -1041,10 +1022,10 @@ var r = function() {
   }, []).join(" ");
 };
 
-// node_modules/.pnpm/@lingui+core@4.7.1/node_modules/@lingui/core/dist/index.mjs
+// node_modules/.pnpm/@lingui+core@4.11.2/node_modules/@lingui/core/dist/index.mjs
 var import_unraw = __toESM(require_dist(), 1);
 
-// node_modules/.pnpm/@lingui+message-utils@4.7.1/node_modules/@lingui/message-utils/dist/compileMessage.mjs
+// node_modules/.pnpm/@lingui+message-utils@4.11.2/node_modules/@lingui/message-utils/dist/compileMessage.mjs
 var import_parser = __toESM(require_parser(), 1);
 function processTokens(tokens, mapText) {
   if (!tokens.filter((token) => token.type !== "content").length) {
@@ -1068,11 +1049,9 @@ function processTokens(tokens, mapText) {
     }
     const offset = token.pluralOffset;
     const formatProps = {};
-    token.cases.forEach((item) => {
-      formatProps[item.key.replace(/^=(.)+/, "$1")] = processTokens(
-        item.tokens,
-        mapText
-      );
+    token.cases.forEach(({ key, tokens: tokens2 }) => {
+      const prop = key[0] === "=" ? key.slice(1) : key;
+      formatProps[prop] = processTokens(tokens2, mapText);
     });
     return [
       token.arg,
@@ -1094,7 +1073,7 @@ Message: ${message}`);
   }
 }
 
-// node_modules/.pnpm/@lingui+core@4.7.1/node_modules/@lingui/core/dist/index.mjs
+// node_modules/.pnpm/@lingui+core@4.11.2/node_modules/@lingui/core/dist/index.mjs
 var isString = (s) => typeof s === "string";
 var isFunction = (f) => typeof f === "function";
 var cache = /* @__PURE__ */ new Map();
@@ -1180,11 +1159,11 @@ var selectFormatter = (value, rules) => {
 function interpolate(translation, locale, locales) {
   return (values = {}, formats) => {
     const formatters = getDefaultFormats(locale, locales, formats);
-    const formatMessage = (tokens) => {
+    const formatMessage = (tokens, replaceOctothorpe = false) => {
       if (!Array.isArray(tokens))
         return tokens;
       return tokens.reduce((message, token) => {
-        if (token === "#") {
+        if (token === "#" && replaceOctothorpe) {
           return message + OCTOTHORPE_PH;
         }
         if (isString(token)) {
@@ -1195,7 +1174,10 @@ function interpolate(translation, locale, locales) {
         if (type === "plural" || type === "selectordinal" || type === "select") {
           Object.entries(format).forEach(
             ([key, value2]) => {
-              interpolatedFormat[key] = formatMessage(value2);
+              interpolatedFormat[key] = formatMessage(
+                value2,
+                type === "plural" || type === "selectordinal"
+              );
             }
           );
         } else {
@@ -1363,6 +1345,9 @@ var I18n = class extends EventEmitter {
   }
   _(id, values, options) {
     let message = options == null ? void 0 : options.message;
+    if (!id) {
+      id = "";
+    }
     if (!isString(id)) {
       values = id.values || values;
       message = id.message;
@@ -1403,41 +1388,7 @@ function setupI18n(params = {}) {
 }
 var i18n = setupI18n();
 
-// node_modules/.pnpm/@warp-ds+css@2.0.0-next.4_@warp-ds+uno@2.0.0_unocss@0.58.5_postcss@8.4.38_rollup@4.18.0_vite@_d2fzbudswaxjysaqn4v4imsdwy/node_modules/@warp-ds/css/component-classes/index.js
-var box = {
-  box: "group block relative break-words last-child:mb-0 p-16 rounded-8",
-  // Relative here enables w-clickable
-  bleed: "-mx-16 sm:mx-0 rounded-l-0 rounded-r-0 sm:rounded-8",
-  // We target L and R to override the default rounded-8
-  info: "s-bg-info-subtle",
-  neutral: "s-surface-sunken",
-  bordered: "border-2 s-border s-bg"
-};
-var buttonReset = "focus:outline-none appearance-none cursor-pointer bg-transparent border-0 m-0 p-0 inline-block";
-var expandable = {
-  expandable: "will-change-height",
-  expandableTitle: "font-bold s-text",
-  expandableBox: "s-surface-sunken hover:s-bg-hover active:s-bg-active py-0 px-0 " + box.box,
-  expandableInfo: "s-bg-info-subtle! hover:s-bg-info-subtle-hover!",
-  expandableBleed: box.bleed,
-  chevron: "inline-block align-middle s-icon",
-  chevronNonBox: "ml-8",
-  chevronBox: "",
-  chevronTransform: "transform transition-transform transform-gpu ease-in-out",
-  chevronExpand: "-rotate-180",
-  chevronCollapse: "rotate-180",
-  elementsTransformChevronDownPart: "part-[w-icon-chevron-down-16-part]:transform part-[w-icon-chevron-down-16-part]:transition-transform part-[w-icon-chevron-down-16-part]:transform-gpu part-[w-icon-chevron-down-16-part]:ease-in-out",
-  elementsChevronDownExpandPart: "part-[w-icon-chevron-down-16-part]:-rotate-180",
-  elementsTransformChevronUpPart: "part-[w-icon-chevron-up-16-part]:transform part-[w-icon-chevron-up-16-part]:transition-transform part-[w-icon-chevron-up-16-part]:transform-gpu part-[w-icon-chevron-up-16-part]:ease-in-out",
-  elementsChevronUpCollapsePart: "part-[w-icon-chevron-up-16-part]:rotate-180",
-  expansion: "overflow-hidden",
-  expansionNotExpanded: "h-0 invisible",
-  button: buttonReset + " hover:underline focus-visible:underline",
-  buttonBox: "w-full text-left relative inline-flex items-center justify-between " + box.box,
-  paddingTop: "pt-0",
-  title: "flex w-full justify-between items-center",
-  titleType: "h4"
-};
+// node_modules/.pnpm/@warp-ds+css@2.0.0_@warp-ds+uno@2.0.0_unocss@0.62.0_postcss@8.4.41_rollup@4.20.0_vite@5.3.3_@_vyiy5vwpqfzwy5hpmfkwp3zmle/node_modules/@warp-ds/css/component-classes/index.js
 var buttonDefaultStyling = "font-bold focusable justify-center transition-colors ease-in-out";
 var buttonColors = {
   primary: "s-text-inverted bg-[--w-color-button-primary-background] hover:bg-[--w-color-button-primary-background-hover] active:bg-[--w-color-button-primary-background-active]",
@@ -1555,7 +1506,7 @@ var button = {
 };
 var modal = {
   backdrop: "fixed inset-0 flex sm:place-content-center sm:place-items-center items-end z-30 [--w-modal-max-height:80%] [--w-modal-width:640px] bg-[--w-black/25]",
-  modal: "pb-safe-[32] shadow-m max-h-[--w-modal-max-height] min-h-[--w-modal-min-height] w-[--w-modal-width] h-[--w-modal-height] relative transition-300 ease-in-out backface-hidden will-change-height rounded-8 mx-0 sm:mx-16 bg-[--w-s-color-surface-elevated-100] flex flex-col overflow-hidden outline-none space-y-16 pt-8 sm:pt-32 sm:pb-32 rounded-b-0 sm:rounded-b-8",
+  base: "pb-safe-[32] shadow-m max-h-[--w-modal-max-height] min-h-[--w-modal-min-height] w-[--w-modal-width] h-[--w-modal-height] relative transition-300 ease-in-out backface-hidden will-change-height rounded-8 mx-0 sm:mx-16 bg-[--w-s-color-surface-elevated-100] flex flex-col overflow-hidden outline-none space-y-16 pt-8 sm:pt-32 sm:pb-32 rounded-b-0 sm:rounded-b-8",
   content: "block overflow-y-auto overflow-x-hidden last-child:mb-0 grow shrink px-16 sm:px-32 relative",
   footer: "flex justify-end shrink-0 px-16 sm:px-32",
   transitionTitle: "transition-all duration-300",
@@ -1569,19 +1520,15 @@ var modal = {
   titleButtonIcon: "h-16 w-16 sm:h-24 sm:w-24",
   titleButtonIconRotated: "transform rotate-90"
 };
-var label = {
-  label: "antialiased block relative text-s font-bold pb-4 cursor-pointer s-text",
-  optional: "pl-8 font-normal text-s s-text-subtle"
-};
-var prefixSuffixWrapperBase = "absolute top-0 bottom-0 flex justify-center items-center focusable rounded-4 focus:[--w-outline-offset:-2px] bg-transparent ";
+var prefixSuffixWrapper = "absolute top-0 bottom-0 flex justify-center items-center focusable rounded-4 focus:[--w-outline-offset:-2px] bg-transparent ";
 var suffix = {
-  wrapper: prefixSuffixWrapperBase + "right-0",
+  wrapper: prefixSuffixWrapper + "right-0",
   wrapperWithLabel: "w-max pr-12",
   wrapperWithIcon: "w-40",
   label: "antialiased block relative cursor-default pb-0 font-bold text-xs s-text"
 };
 var prefix = {
-  wrapper: prefixSuffixWrapperBase + "left-0",
+  wrapper: prefixSuffixWrapper + "left-0",
   wrapperWithLabel: "w-max pl-12",
   wrapperWithIcon: "w-40",
   label: "antialiased block relative cursor-default pb-0 font-bold text-xs s-text"
@@ -1638,15 +1585,9 @@ var deadToggle = {
   wrapper: `${toggle.wrapper} h-20 w-20 pointer-events-none`,
   input: `${toggle.input} hidden`,
   inputVue: "hidden",
+  labelVue: "-mt-2",
   labelRadio: `${toggle.label} ${toggle.labelBefore} ${toggle.radio}`,
-  labelCheckbox: `${toggle.label} ${toggle.labelBefore} ${toggle.checkbox}`,
-  labelVue: "-mt-2"
-};
-var clickable = {
-  toggle: "absolute inset-0 h-full w-full appearance-none cursor-pointer focusable focusable-inset",
-  label: `px-12 ${label.label} py-8! cursor-pointer focusable focusable-inset`,
-  buttonOrLink: "bg-transparent focusable",
-  buttonOrLinkStretch: "inset-0 absolute"
+  labelCheckbox: `${toggle.label} ${toggle.labelBefore} ${toggle.checkbox}`
 };
 var attention = {
   base: "border-2 relative flex items-start",
@@ -1701,12 +1642,9 @@ function detectLocale() {
   }
 }
 var getMessages = (locale, enMsg, nbMsg, fiMsg, daMsg) => {
-  if (locale === "nb")
-    return nbMsg;
-  if (locale === "fi")
-    return fiMsg;
-  if (locale === "da")
-    return daMsg;
+  if (locale === "nb") return nbMsg;
+  if (locale === "fi") return fiMsg;
+  if (locale === "da") return daMsg;
   return enMsg;
 };
 var activateI18n = (enMessages, nbMessages, fiMessages, daMessages) => {
@@ -1770,59 +1708,66 @@ ${buttonTypes2.join(", ")}.`);
       setTimeout(() => this.focus(), 0);
     }
   }
+  get _primaryClasses() {
+    return [
+      !this.small && !this.quiet && !this.loading && button.primary,
+      this.small && !this.quiet && !this.loading && button.primarySmall,
+      this.small && this.quiet && !this.loading && button.primarySmallQuiet,
+      this.small && this.loading && (this.quiet ? button.primarySmallQuietLoading : button.primarySmallLoading),
+      !this.small && this.quiet && !this.loading && button.primaryQuiet,
+      !this.small && this.loading && (this.quiet ? button.primaryQuietLoading : button.primaryLoading)
+    ];
+  }
+  get _secondaryClasses() {
+    return [
+      !this.small && !this.quiet && !this.loading && button.secondary,
+      this.small && !this.quiet && !this.loading && button.secondarySmall,
+      this.small && this.loading && (this.quiet ? button.secondarySmallQuietLoading : button.secondarySmallLoading),
+      this.small && this.quiet && !this.loading && button.secondarySmallQuiet,
+      !this.small && this.quiet && !this.loading && button.secondaryQuiet,
+      !this.small && this.loading && (this.quiet ? button.secondaryQuietLoading : button.secondaryLoading)
+    ];
+  }
+  get _utilityClasses() {
+    return [
+      !this.small && !this.quiet && !this.loading && button.utility,
+      this.small && !this.quiet && !this.loading && button.utilitySmall,
+      this.small && this.quiet && !this.loading && button.utilitySmallQuiet,
+      this.small && this.loading && (this.quiet ? button.utilitySmallQuietLoading : button.utilitySmallLoading),
+      !this.small && this.quiet && !this.loading && button.utilityQuiet,
+      !this.small && this.loading && (this.quiet ? button.utilityQuietLoading : button.utilityLoading)
+    ];
+  }
+  get _negativeClasses() {
+    return [
+      !this.small && !this.quiet && !this.loading && button.negative,
+      this.small && !this.quiet && !this.loading && button.negativeSmall,
+      this.small && this.quiet && !this.loading && button.negativeSmallQuiet,
+      this.small && this.loading && (this.quiet ? button.negativeSmallQuietLoading : button.negativeSmallLoading),
+      !this.small && this.quiet && !this.loading && button.negativeQuiet,
+      !this.small && this.loading && (this.quiet ? button.negativeQuietLoading : button.negativeLoading)
+    ];
+  }
+  get _pillClasses() {
+    return [
+      !this.loading && (this.small ? button.pillSmall : button.pill),
+      this.loading && (this.small ? button.pillSmallLoading : button.pillLoading)
+    ];
+  }
+  get _linkClasses() {
+    return [this.small ? button.linkSmall : button.link];
+  }
   get _classes() {
-    const primary = this.variant === "primary";
-    const secondary = this.variant === "secondary";
-    const negative = this.variant === "negative";
-    const utility = this.variant === "utility";
-    const pill = this.variant === "pill";
-    const link = this.variant === "link";
-    return r(
-      {
-        [button.secondary]: secondary && !this.small && !this.quiet && !this.loading,
-        [button.secondarySmall]: secondary && this.small && !this.quiet && !this.loading,
-        [button.secondarySmallLoading]: secondary && this.small && !this.quiet && this.loading,
-        [button.secondarySmallQuiet]: secondary && this.small && this.quiet && !this.loading,
-        [button.secondarySmallQuietLoading]: secondary && this.small && this.quiet && this.loading,
-        [button.secondaryQuiet]: secondary && !this.small && this.quiet && !this.loading,
-        [button.secondaryQuietLoading]: secondary && !this.small && this.quiet && this.loading,
-        [button.secondaryLoading]: secondary && !this.small && !this.quiet && this.loading,
-        [button.primary]: primary && !this.small && !this.quiet && !this.loading,
-        [button.primarySmall]: primary && this.small && !this.quiet && !this.loading,
-        [button.primarySmallQuiet]: primary && this.small && this.quiet && !this.loading,
-        [button.primarySmallLoading]: primary && this.small && !this.quiet && this.loading,
-        [button.primarySmallQuietLoading]: primary && this.small && this.quiet && this.loading,
-        [button.primaryQuiet]: primary && !this.small && this.quiet && !this.loading,
-        [button.primaryQuietLoading]: primary && !this.small && this.quiet && this.loading,
-        [button.primaryLoading]: primary && !this.small && !this.quiet && this.loading,
-        [button.utility]: utility && !this.small && !this.quiet && !this.loading,
-        [button.utilitySmall]: utility && this.small && !this.quiet && !this.loading,
-        [button.utilitySmallQuiet]: utility && this.small && this.quiet && !this.loading,
-        [button.utilitySmallLoading]: utility && this.small && !this.quiet && this.loading,
-        [button.utilitySmallQuietLoading]: utility && this.small && this.quiet && this.loading,
-        [button.utilityQuiet]: utility && !this.small && this.quiet && !this.loading,
-        [button.utilityQuietLoading]: utility && !this.small && this.quiet && this.loading,
-        [button.utilityLoading]: utility && !this.small && !this.quiet && this.loading,
-        [button.negative]: negative && !this.small && !this.quiet && !this.loading,
-        [button.negativeSmall]: negative && this.small && !this.quiet && !this.loading,
-        [button.negativeSmallQuiet]: negative && this.small && this.quiet && !this.loading,
-        [button.negativeSmallLoading]: negative && this.small && !this.quiet && this.loading,
-        [button.negativeSmallQuietLoading]: negative && this.small && this.quiet && this.loading,
-        [button.negativeQuiet]: negative && !this.small && this.quiet && !this.loading,
-        [button.negativeQuietLoading]: negative && !this.small && this.quiet && this.loading,
-        [button.negativeLoading]: negative && !this.small && !this.quiet && this.loading,
-        [button.pill]: pill && !this.small && !this.loading,
-        [button.pillSmall]: pill && this.small && !this.loading,
-        [button.pillLoading]: pill && !this.small && this.loading,
-        [button.pillSmallLoading]: pill && this.small && this.loading,
-        [button.link]: link && !this.small,
-        [button.linkSmall]: link && this.small,
-        [button.linkAsButton]: !!this.href,
-        [button.fullWidth]: this.fullWidth,
-        [button.contentWidth]: !this.fullWidth
-      },
-      this.buttonClass
-    );
+    return r(this.buttonClass, [
+      this.variant === "primary" && this._primaryClasses,
+      this.variant === "secondary" && this._secondaryClasses,
+      this.variant === "utility" && this._utilityClasses,
+      this.variant === "negative" && this._negativeClasses,
+      this.variant === "pill" && this._pillClasses,
+      this.variant === "link" && this._linkClasses,
+      this.href && button.linkAsButton,
+      this.fullWidth ? button.fullWidth : button.contentWidth
+    ]);
   }
   render() {
     return html` ${this.href ? html`<a