@equal-experts/kuat-vue 0.12.0 → 0.13.0

package/README.md

@@ -1,6 +1,8 @@
 # @equal-experts/kuat-vue
 
-Vue 3 components and blocks for the Kuat Design System: **localized primitives** and **composed blocks**. Use **`@equal-experts/kuat-core`** for tokens and **shadcn-vue** only for UI that Kuat does not ship (for example Dialog, DropdownMenu).
+Vue 3 components and blocks for the Kuat Design System: **localized primitives** (including **IconButton**) and **composed blocks**. Use **`@equal-experts/kuat-core`** for tokens and **shadcn-vue** only for UI that Kuat does not ship (for example Dialog, DropdownMenu).
+
+**IconButton:** `import { IconButton } from "@equal-experts/kuat-vue"` or `@equal-experts/kuat-vue/icon-button`.
 
 **When to import from here vs shadcn-vue:** [Choosing components](https://github.com/equalexperts/kuat-mono/blob/master/kuat-docs/setup/choosing-components.md) · [Public API inventory](https://github.com/equalexperts/kuat-mono/blob/master/kuat-docs/setup/public-api-inventory.md)
 

package/dist/{AccordionTrigger-BRz5PzEd.js → AccordionTrigger-BGVFRlgt.js}

@@ -1,7 +1,7 @@
 import { defineComponent as d, createBlock as i, openBlock as l, unref as o, normalizeProps as A, guardReactiveProps as y, withCtx as c, renderSlot as n, mergeProps as p, createElementVNode as B, normalizeClass as C, createVNode as g } from "vue";
 import { useForwardPropsEmits as v, AccordionRoot as $, AccordionContent as h, useForwardProps as P, AccordionItem as b, AccordionHeader as w, AccordionTrigger as I } from "reka-ui";
 import { c as m } from "./utils-DLUjLwnh.js";
-import { r as u } from "./index-A7umpmtg.js";
+import { r as u } from "./index-OELvcT-N.js";
 import { _ } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 import { ChevronDown as V } from "lucide-vue-next";
 const D = /* @__PURE__ */ d({

package/dist/{AlertDialogTrigger.vue_vue_type_script_setup_true_lang-CK1Um8CY.js → AlertDialogTrigger.vue_vue_type_script_setup_true_lang-DosgAcSM.js}

@@ -1,7 +1,7 @@
 import { defineComponent as l, createBlock as p, openBlock as r, unref as e, normalizeProps as D, guardReactiveProps as $, withCtx as n, renderSlot as c, mergeProps as u, createVNode as A, createElementBlock as v, normalizeClass as h } from "vue";
 import { useForwardPropsEmits as C, AlertDialogRoot as y, AlertDialogAction as B, AlertDialogCancel as P, AlertDialogPortal as I, AlertDialogOverlay as O, AlertDialogContent as w, AlertDialogDescription as T, AlertDialogTitle as b, AlertDialogTrigger as F } from "reka-ui";
 import { c as d } from "./utils-DLUjLwnh.js";
-import { r as g } from "./index-A7umpmtg.js";
+import { r as g } from "./index-OELvcT-N.js";
 import { _ } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const G = /* @__PURE__ */ l({
   __name: "AlertDialog",

package/dist/{KuatSelect.vue_vue_type_script_setup_true_lang-DP66U_wg.js → KuatSelect.vue_vue_type_script_setup_true_lang-CT1xn9gs.js}

@@ -2,7 +2,7 @@ import { defineComponent as f, createBlock as i, openBlock as l, unref as s, mer
 import { c as m } from "./utils-DLUjLwnh.js";
 import { useForwardPropsEmits as x, SelectRoot as L, SelectScrollDownButton as O, SelectScrollUpButton as N, SelectPortal as U, SelectContent as D, SelectViewport as F, SelectGroup as A, SelectItem as G, SelectItemText as q, SelectItemIndicator as j, SelectLabel as K, SelectSeparator as M, SelectTrigger as R, SelectIcon as W, SelectValue as Z } from "reka-ui";
 import { ChevronDown as E, ChevronUp as J, Check as Q } from "lucide-vue-next";
-import { r as S } from "./index-A7umpmtg.js";
+import { r as S } from "./index-OELvcT-N.js";
 const $e = ["regular", "large", "small", "mini"], Be = ["single", "double"];
 function X(a) {
   return "items" in a;

package/dist/accordion.js

@@ -1,5 +1,5 @@
 import { c as r } from "./utils-DLUjLwnh.js";
-import { _ as a, b as e, A as i, a as s } from "./AccordionTrigger-BRz5PzEd.js";
+import { _ as a, b as e, A as i, a as s } from "./AccordionTrigger-BGVFRlgt.js";
 export {
   a as Accordion,
   e as AccordionContent,

package/dist/alert-dialog.js

@@ -1,5 +1,5 @@
 import { c as l } from "./utils-DLUjLwnh.js";
-import { _ as r, A as t, a as i, b as g, c as s, d as A, e as D, f as c, g as n } from "./AlertDialogTrigger.vue_vue_type_script_setup_true_lang-CK1Um8CY.js";
+import { _ as r, A as t, a as i, b as g, c as s, d as A, e as D, f as c, g as n } from "./AlertDialogTrigger.vue_vue_type_script_setup_true_lang-DosgAcSM.js";
 export {
   r as AlertDialog,
   t as AlertDialogAction,

package/dist/button-group.js

@@ -1,5 +1,5 @@
 import { c as r } from "./utils-DLUjLwnh.js";
-import { B as u, a as p, b as n, c as s } from "./index-iz_NZI-V.js";
+import { B as u, a as p, b as n, c as s } from "./index-Tp80OeHH.js";
 export {
   u as ButtonGroup,
   p as ButtonGroupSeparator,

package/dist/checkbox.js

@@ -1,5 +1,5 @@
 import { c as o } from "./utils-DLUjLwnh.js";
-import { C as e, b as s, _, a as c } from "./constants-BpzIL1jq.js";
+import { C as e, b as s, _, a as c } from "./constants-DC1CCNlp.js";
 export {
   e as CHECKBOX_FIELD_APPEARANCES,
   s as CHECKBOX_FIELD_LAYOUTS,

package/dist/{constants-Ils7NSfg.js → constants-BZKku54w.js}

@@ -2,7 +2,7 @@ import { defineComponent as b, mergeModels as v, useModel as V, useAttrs as S, c
 import { c as A } from "./utils-DLUjLwnh.js";
 import { _ as E, c as N, a as k, d as M, b as P } from "./FieldTitle.vue_vue_type_script_setup_true_lang-Bu8UIwRT.js";
 import { SwitchRoot as D, SwitchThumb as F } from "reka-ui";
-import { r as L } from "./index-A7umpmtg.js";
+import { r as L } from "./index-OELvcT-N.js";
 const U = /* @__PURE__ */ b({
   inheritAttrs: !1,
   __name: "Switch",

package/dist/{constants-BpzIL1jq.js → constants-DC1CCNlp.js}

@@ -3,7 +3,7 @@ import { c as A } from "./utils-DLUjLwnh.js";
 import { _ as T, c as M, a as N, d as O, b as P } from "./FieldTitle.vue_vue_type_script_setup_true_lang-Bu8UIwRT.js";
 import { CheckboxRoot as D, CheckboxIndicator as F } from "reka-ui";
 import { Check as L, Minus as U } from "lucide-vue-next";
-import { r as q } from "./index-A7umpmtg.js";
+import { r as q } from "./index-OELvcT-N.js";
 const w = /* @__PURE__ */ k({
   inheritAttrs: !1,
   __name: "Checkbox",

package/dist/{constants-D_fYMnOg.js → constants-DWBWMp2p.js}

@@ -2,7 +2,7 @@ import { defineComponent as m, createBlock as u, openBlock as p, unref as a, mer
 import { useForwardPropsEmits as x, RadioGroupRoot as E, RadioGroupItem as T, RadioGroupIndicator as w } from "reka-ui";
 import { c as y } from "./utils-DLUjLwnh.js";
 import { _ as D, c as G, a as N, d as P, b as S } from "./FieldTitle.vue_vue_type_script_setup_true_lang-Bu8UIwRT.js";
-import { r as k } from "./index-A7umpmtg.js";
+import { r as k } from "./index-OELvcT-N.js";
 const j = /* @__PURE__ */ m({
   __name: "RadioGroup",
   props: {

package/dist/icon-button.js

@@ -0,0 +1,12 @@
+import { c as N } from "./utils-DLUjLwnh.js";
+import { a, I as O, d as S, c as s, b as A, _ as o, i as t } from "./index-lZY__1xm.js";
+export {
+  a as ICON_BUTTON_ROUNDNESS,
+  O as ICON_BUTTON_SIZES,
+  S as ICON_BUTTON_SIZE_LG_ALIAS,
+  s as ICON_BUTTON_SIZE_SM_ALIAS,
+  A as ICON_BUTTON_VARIANT_DEFAULT_ALIAS,
+  o as IconButton,
+  N as cn,
+  t as iconButtonVariants
+};

package/dist/index-OELvcT-N.js

@@ -0,0 +1,54 @@
+import { computed as s, watch as l, isRef as i, reactive as u, unref as f, toRefs as a, toValue as d } from "vue";
+const v = typeof window < "u" && typeof document < "u";
+typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
+const p = Object.prototype.toString, w = (e) => p.call(e) === "[object Object]", g = () => {
+};
+function b(e) {
+  return Array.isArray(e) ? e : [e];
+}
+function y(e) {
+  return i(e) ? u(new Proxy({}, {
+    get(n, t, r) {
+      return f(Reflect.get(e.value, t, r));
+    },
+    set(n, t, r) {
+      return i(e.value[t]) && !i(r) ? e.value[t].value = r : e.value[t] = r, !0;
+    },
+    deleteProperty(n, t) {
+      return Reflect.deleteProperty(e.value, t);
+    },
+    has(n, t) {
+      return Reflect.has(e.value, t);
+    },
+    ownKeys() {
+      return Object.keys(e.value);
+    },
+    getOwnPropertyDescriptor() {
+      return {
+        enumerable: !0,
+        configurable: !0
+      };
+    }
+  })) : u(e);
+}
+function m(e) {
+  return y(s(e));
+}
+function h(e, ...n) {
+  const t = n.flat(), r = t[0];
+  return m(() => Object.fromEntries(typeof r == "function" ? Object.entries(a(e)).filter(([o, c]) => !r(d(c), o)) : Object.entries(a(e)).filter((o) => !t.includes(o[0]))));
+}
+function P(e, n, t) {
+  return l(e, n, {
+    ...t,
+    immediate: !0
+  });
+}
+export {
+  w as a,
+  v as i,
+  g as n,
+  h as r,
+  b as t,
+  P as w
+};

package/dist/{index-iz_NZI-V.js → index-Tp80OeHH.js}

@@ -2,7 +2,7 @@ import { defineComponent as s, createElementBlock as f, openBlock as n, normaliz
 import { c as r } from "./utils-DLUjLwnh.js";
 import { _ as c } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 import { Separator as B, Primitive as v } from "reka-ui";
-import { r as _ } from "./index-A7umpmtg.js";
+import { r as _ } from "./index-OELvcT-N.js";
 const g = ["data-orientation"], b = /* @__PURE__ */ s({
   __name: "ButtonGroup",
   props: {

package/dist/index-lZY__1xm.js

@@ -0,0 +1,76 @@
+import { defineComponent as f, computed as n, createBlock as m, openBlock as v, unref as i, normalizeClass as b, withCtx as _, renderSlot as I } from "vue";
+import { Primitive as N } from "reka-ui";
+import { c as o } from "./utils-DLUjLwnh.js";
+const O = /* @__PURE__ */ f({
+  __name: "IconButton",
+  props: {
+    variant: { default: "primary" },
+    size: { default: "regular" },
+    color: { default: "ee-blue" },
+    roundness: { default: "default" },
+    type: { default: "button" },
+    class: {},
+    asChild: { type: Boolean },
+    as: { default: "button" }
+  },
+  setup(t) {
+    const e = t;
+    function u(r) {
+      return r === "default" ? "primary" : r ?? "primary";
+    }
+    function l(r) {
+      return r === "sm" ? "small" : r === "lg" ? "large" : r ?? "regular";
+    }
+    const a = n(() => u(e.variant)), s = n(() => l(e.size)), c = n(() => a.value === "destructive"), d = n(() => {
+      if (!e.asChild && e.as === "button")
+        return e.type;
+    });
+    return (r, y) => (v(), m(i(N), {
+      as: t.as,
+      "as-child": t.asChild,
+      type: d.value,
+      class: b(
+        i(o)(
+          "button",
+          "icon-button",
+          `button--variant-${a.value}`,
+          c.value ? [] : `button--color-${t.color}`,
+          `icon-button--size-${s.value}`,
+          `icon-button--roundness-${t.roundness}`,
+          e.class
+        )
+      )
+    }, {
+      default: _(() => [
+        I(r.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["as", "as-child", "type", "class"]));
+  }
+}), B = "default", A = ["mini", "small", "regular", "large"], $ = "sm", h = "lg", U = ["default", "round"];
+function S(t) {
+  return t === "default" ? "primary" : t ?? "primary";
+}
+function T(t) {
+  return t === "sm" ? "small" : t === "lg" ? "large" : t ?? "regular";
+}
+function D(t) {
+  const e = S((t == null ? void 0 : t.variant) ?? "primary"), u = T((t == null ? void 0 : t.size) ?? "regular"), l = (t == null ? void 0 : t.color) ?? "ee-blue", a = (t == null ? void 0 : t.roundness) ?? "default", c = e === "destructive" ? "" : `button--color-${l}`;
+  return o(
+    "button",
+    "icon-button",
+    `button--variant-${e}`,
+    c,
+    `icon-button--size-${u}`,
+    `icon-button--roundness-${a}`
+  );
+}
+export {
+  A as I,
+  O as _,
+  U as a,
+  B as b,
+  $ as c,
+  h as d,
+  D as i
+};