@autoafleveren/ui 1.4.7 → 1.4.9

package/dist/ui.js

@@ -8382,25 +8382,27 @@ const LT = ["disabled", "accept", "name"], RT = {
       _: 3
     }, 8, ["show"]));
   }
-}), VT = {
-  key: 0,
-  class: "flex w-full",
-  "data-test-item": ""
-}, qT = /* @__PURE__ */ ke({
+}), VT = /* @__PURE__ */ ke({
   __name: "AppDefinitionItem",
   props: {
     title: { default: void 0 },
     description: { default: void 0 },
     component: { default: void 0 },
     componentProperties: { default: void 0 },
-    hideEmptyValues: { type: Boolean, default: !1 }
+    hideEmptyValues: { type: Boolean, default: !1 },
+    itemRowClasses: { default: void 0 },
+    itemCellClasses: { default: void 0 }
   },
   setup(e) {
     const t = e, n = An(), r = j(() => !!n.title || !!t.title), a = j(() => !!n.default || !!t.description || !!t.component);
-    return (o, i) => a.value || !a.value && !o.hideEmptyValues ? (E(), $("div", VT, [
+    return (o, i) => a.value || !a.value && !o.hideEmptyValues ? (E(), $("div", {
+      key: 0,
+      class: oe([o.itemRowClasses, "flex w-full"]),
+      "data-test-item": ""
+    }, [
       r.value ? (E(), $("dt", {
         key: 0,
-        class: oe([{ "w-1/2": a.value || o.component }, "font-bold text-zinc-900"]),
+        class: oe([[o.itemCellClasses, { "w-1/2": a.value || o.component }], "font-bold text-zinc-900"]),
         "data-test-title": ""
       }, [
         ae(o.$slots, "title", {}, () => [
@@ -8409,7 +8411,7 @@ const LT = ["disabled", "accept", "name"], RT = {
       ], 2)) : J("", !0),
       a.value || o.component || o.$slots.default ? (E(), $("dd", {
         key: 1,
-        class: oe({ "w-1/2": r.value }),
+        class: oe([o.itemCellClasses, { "w-1/2": r.value }]),
         "data-test-description": ""
       }, [
         ae(o.$slots, "default", {}, () => [
@@ -8417,26 +8419,30 @@ const LT = ["disabled", "accept", "name"], RT = {
         ]),
         (E(), ce(Qe(o.component), it(o.componentProperties, { "data-test-component": "" }), null, 16))
       ], 2)) : J("", !0)
-    ])) : J("", !0);
+    ], 2)) : J("", !0);
   }
-}), YT = { class: "flex flex-col gap-1.5" }, KQ = /* @__PURE__ */ ke({
+}), qT = { class: "flex flex-col gap-1.5" }, KQ = /* @__PURE__ */ ke({
   __name: "AppDefinitionList",
   props: {
     items: { default: void 0 },
-    hideEmptyValues: { type: Boolean, default: !1 }
+    hideEmptyValues: { type: Boolean, default: !1 },
+    itemRowClasses: { default: void 0 },
+    itemCellClasses: { default: void 0 }
   },
   setup(e) {
-    return (t, n) => (E(), $("div", YT, [
+    return (t, n) => (E(), $("div", qT, [
       ae(t.$slots, "default", {}, () => [
-        t.items ? (E(!0), $(De, { key: 0 }, Ze(t.items, (r, a) => (E(), ce(qT, {
+        t.items ? (E(!0), $(De, { key: 0 }, Ze(t.items, (r, a) => (E(), ce(VT, {
           key: a,
           tabindex: `1${a}`,
           title: r.title,
           description: r.description,
           component: r.component,
           "component-properties": r.componentProperties,
-          "hide-empty-values": t.hideEmptyValues
-        }, null, 8, ["tabindex", "title", "description", "component", "component-properties", "hide-empty-values"]))), 128)) : J("", !0)
+          "hide-empty-values": t.hideEmptyValues,
+          "item-row-classes": t.itemRowClasses,
+          "item-cell-classes": t.itemCellClasses
+        }, null, 8, ["tabindex", "title", "description", "component", "component-properties", "hide-empty-values", "item-row-classes", "item-cell-classes"]))), 128)) : J("", !0)
       ])
     ]));
   }
@@ -8457,7 +8463,7 @@ const LT = ["disabled", "accept", "name"], RT = {
       _: 3
     }, 8, ["default-open"]));
   }
-}), GT = { class: "ml-auto pl-2" }, JQ = /* @__PURE__ */ ke({
+}), YT = { class: "ml-auto pl-2" }, JQ = /* @__PURE__ */ ke({
   __name: "AppDisclosureButton",
   setup(e) {
     const t = X(null);
@@ -8477,7 +8483,7 @@ const LT = ["disabled", "accept", "name"], RT = {
         }, [
           ae(r.$slots, "default")
         ], 2),
-        F("span", GT, [
+        F("span", YT, [
           ae(r.$slots, "icon", { open: o }, () => [
             Ee(w(B4), {
               class: oe([{ "rotate-180": o }, "size-5 text-zinc-900 transition-transform"])
@@ -8522,28 +8528,29 @@ const LT = ["disabled", "accept", "name"], RT = {
 }), Cn = [];
 for (let e = 0; e < 256; ++e)
   Cn.push((e + 256).toString(16).slice(1));
-function KT(e, t = 0) {
+function GT(e, t = 0) {
   return (Cn[e[t + 0]] + Cn[e[t + 1]] + Cn[e[t + 2]] + Cn[e[t + 3]] + "-" + Cn[e[t + 4]] + Cn[e[t + 5]] + "-" + Cn[e[t + 6]] + Cn[e[t + 7]] + "-" + Cn[e[t + 8]] + Cn[e[t + 9]] + "-" + Cn[e[t + 10]] + Cn[e[t + 11]] + Cn[e[t + 12]] + Cn[e[t + 13]] + Cn[e[t + 14]] + Cn[e[t + 15]]).toLowerCase();
 }
 let Gd;
-const XT = new Uint8Array(16);
-function JT() {
+const KT = new Uint8Array(16);
+function XT() {
   if (!Gd) {
     if (typeof crypto > "u" || !crypto.getRandomValues)
       throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
     Gd = crypto.getRandomValues.bind(crypto);
   }
-  return Gd(XT);
+  return Gd(KT);
 }
-const QT = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), I0 = { randomUUID: QT };
-function ZT(e, t, n) {
-  if (I0.randomUUID && !e)
-    return I0.randomUUID();
+const JT = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), I0 = { randomUUID: JT };
+function QT(e, t, n) {
   e = e || {};
-  const r = e.random ?? e.rng?.() ?? JT();
+  const r = e.random ?? e.rng?.() ?? XT();
   if (r.length < 16)
     throw new Error("Random bytes length must be >= 16");
-  return r[6] = r[6] & 15 | 64, r[8] = r[8] & 63 | 128, KT(r);
+  return r[6] = r[6] & 15 | 64, r[8] = r[8] & 63 | 128, GT(r);
+}
+function ZT(e, t, n) {
+  return I0.randomUUID && !e ? I0.randomUUID() : QT(e);
 }
 const eE = { class: "app-input__icon pointer-events-none absolute z-10 mt-px h-5" }, tE = /* @__PURE__ */ ke({
   __name: "InputIconSlot",
@@ -20303,9 +20310,9 @@ const Xt = {
   multipleLabel: "flex items-center h-full absolute left-0 top-0 pointer-events-none bg-transparent leading-snug pl-3 rtl:left-auto rtl:right-0 rtl:pl-0 rtl:pr-3",
   search: "h-full w-full absolute inset-0 outline-hidden focus:ring-0 appearance-none box-border border-0 text-base font-sans bg-white rounded-lg pl-3 rtl:pl-0 rtl:pr-3",
   tags: "min-w-0 grow shrink flex flex-wrap items-center mt-1 px-2",
-  tag: "max-w-full bg-zinc-200 text-sm font-semibold py-1 pl-2 rounded-xs h-7 mr-1 mb-1 flex items-center whitespace-nowrap rtl:pl-0 rtl:pr-2 rtl:mr-0 rtl:ml-1",
+  tag: "max-w-full bg-zinc-200 text-sm font-semibold py-1 pl-2 rounded-lg h-7 mr-1 mb-1 flex items-center whitespace-nowrap rtl:pl-0 rtl:pr-2 rtl:mr-0 rtl:ml-1",
   tagDisabled: "pr-2 opacity-50 rtl:pl-2",
-  tagRemove: "flex items-center justify-center p-1 mx-0.5 rounded-xs group",
+  tagRemove: "flex items-center justify-center p-1 mx-0.5 rounded-lg group",
   tagRemoveIcon: "bg-multiselect-remove bg-center bg-no-repeat inline-block w-3 h-3 text-zinc-700",
   tagText: "overflow-hidden text-ellipsis whitespace-nowrap",
   tagsSearchWrapper: "inline-block relative mx-1 mb-1 grow shrink h-full",
@@ -44344,7 +44351,7 @@ export {
   iT as AppConfirm,
   tB as AppContextMenu,
   nZ as AppDataTable,
-  qT as AppDefinitionItem,
+  VT as AppDefinitionItem,
   KQ as AppDefinitionList,
   XQ as AppDisclosure,
   JQ as AppDisclosureButton,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@autoafleveren/ui",
-  "version": "1.4.7",
+  "version": "1.4.9",
   "type": "module",
   "files": [
     "dist/*",
@@ -86,7 +86,7 @@
     "@vuepic/vue-datepicker": "^11.0.2",
     "@vueuse/components": "^13.5.0",
     "@vueuse/core": "^13.5.0",
-    "@vueuse/integrations": "^13.7.0",
+    "@vueuse/integrations": "^13.8.0",
     "date-fns": "^4.1.0",
     "focus-trap": "^7",
     "js-cookie": "^3.0.5",
@@ -97,7 +97,7 @@
     "pusher-js": "^8.4.0",
     "radash": "^12.1.1",
     "tailwindcss": "4.1.11",
-    "uuid": "^11.1.0",
+    "uuid": "^13.0.0",
     "vite": "^7.0.6",
     "vue": "^3.5.18",
     "vue-docgen-api": "^4.79.2",

package/src/modules/components/AppDefinitionList/AppDefinitionItem.vue

@@ -9,12 +9,16 @@
     component?: DefinitionItem['component'];
     componentProperties?: DefinitionItem['componentProperties'];
     hideEmptyValues?: boolean;
+    itemRowClasses?: string;
+    itemCellClasses?: string;
   }>(), {
     title: undefined,
     description: undefined,
     component: undefined,
     componentProperties: undefined,
     hideEmptyValues: false,
+    itemRowClasses: undefined,
+    itemCellClasses: undefined,
   });
 
   const slots = useSlots();
@@ -26,12 +30,13 @@
 <template>
   <div
     v-if="hasDescription || !hasDescription && !hideEmptyValues"
+    :class="itemRowClasses"
     class="flex w-full"
     data-test-item
   >
     <dt
       v-if="hasTitle"
-      :class="{ 'w-1/2': hasDescription || component }"
+      :class="[itemCellClasses, { 'w-1/2': hasDescription || component }]"
       class="font-bold text-zinc-900"
       data-test-title
     >
@@ -42,7 +47,7 @@
 
     <dd
       v-if="hasDescription || component || $slots.default"
-      :class="{ 'w-1/2': hasTitle }"
+      :class="[itemCellClasses, { 'w-1/2': hasTitle }]"
       data-test-description
     >
       <slot>{{ description }}</slot>

package/src/modules/components/AppDefinitionList/AppDefinitionList.vue

@@ -6,9 +6,13 @@
   withDefaults(defineProps<{
     items?: DefinitionItem[];
     hideEmptyValues?: boolean;
+    itemRowClasses?: string;
+    itemCellClasses?: string;
   }>(), {
     items: undefined,
     hideEmptyValues: false,
+    itemRowClasses: undefined,
+    itemCellClasses: undefined,
   });
 </script>
 
@@ -25,6 +29,8 @@
           :component="item.component"
           :component-properties="item.componentProperties"
           :hide-empty-values="hideEmptyValues"
+          :item-row-classes="itemRowClasses"
+          :item-cell-classes="itemCellClasses"
         />
       </template>
     </slot>

package/src/modules/components/AppSelect/index.ts

@@ -10,9 +10,9 @@ export const classes = {
   multipleLabel: 'flex items-center h-full absolute left-0 top-0 pointer-events-none bg-transparent leading-snug pl-3 rtl:left-auto rtl:right-0 rtl:pl-0 rtl:pr-3',
   search: 'h-full w-full absolute inset-0 outline-hidden focus:ring-0 appearance-none box-border border-0 text-base font-sans bg-white rounded-lg pl-3 rtl:pl-0 rtl:pr-3',
   tags: 'min-w-0 grow shrink flex flex-wrap items-center mt-1 px-2',
-  tag: 'max-w-full bg-zinc-200 text-sm font-semibold py-1 pl-2 rounded-xs h-7 mr-1 mb-1 flex items-center whitespace-nowrap rtl:pl-0 rtl:pr-2 rtl:mr-0 rtl:ml-1',
+  tag: 'max-w-full bg-zinc-200 text-sm font-semibold py-1 pl-2 rounded-lg h-7 mr-1 mb-1 flex items-center whitespace-nowrap rtl:pl-0 rtl:pr-2 rtl:mr-0 rtl:ml-1',
   tagDisabled: 'pr-2 opacity-50 rtl:pl-2',
-  tagRemove: 'flex items-center justify-center p-1 mx-0.5 rounded-xs group',
+  tagRemove: 'flex items-center justify-center p-1 mx-0.5 rounded-lg group',
   tagRemoveIcon: 'bg-multiselect-remove bg-center bg-no-repeat inline-block w-3 h-3 text-zinc-700',
   tagText: 'overflow-hidden text-ellipsis whitespace-nowrap',
   tagsSearchWrapper: 'inline-block relative mx-1 mb-1 grow shrink h-full',