@ulu/frontend-vue 0.6.20 → 0.6.21

package/dist/plugins/toast/UluToast.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UluToast.vue.d.ts","sourceRoot":"","sources":["../../../lib/plugins/toast/UluToast.vue"],"names":[],"mappings":"AAiDA;wBAsRqB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;;6BAEtE,CAAC,EAAE,CAAC;;;AAXjC;;;;;;;sPAQG"}
+{"version":3,"file":"UluToast.vue.d.ts","sourceRoot":"","sources":["../../../lib/plugins/toast/UluToast.vue"],"names":[],"mappings":"AAiDA;wBAuRqB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;;6BAEtE,CAAC,EAAE,CAAC;;;AAXjC;;;;;;;sPAQG"}

package/dist/plugins/toast/UluToast.vue.js

@@ -1,7 +1,7 @@
-import { computed as C, createElementBlock as l, openBlock as o, normalizeClass as e, createCommentVNode as c, createElementVNode as r, renderSlot as m, createBlock as B, toDisplayString as d, Fragment as g, renderList as S, createVNode as h, nextTick as E } from "vue";
-import k from "../../components/elements/UluIcon.vue.js";
-import { mergeClassLookups as L } from "../../utils/props.js";
-const $ = ["onClick"], T = {
+import { computed as C, createElementBlock as l, openBlock as o, normalizeClass as e, createCommentVNode as c, createElementVNode as d, renderSlot as m, createBlock as B, toDisplayString as r, Fragment as g, renderList as S, unref as h, createVNode as E, nextTick as L } from "vue";
+import v from "../../components/elements/UluIcon.vue.js";
+import { mergeClassLookups as $, resolveClassOverride as A } from "../../utils/props.js";
+const F = ["onClick"], V = {
   __name: "UluToast",
   props: {
     /**
@@ -17,20 +17,20 @@ const $ = ["onClick"], T = {
     }
   },
   setup(t) {
-    const v = {
+    const k = {
       content: "type-small",
       date: "type-small-x",
       actions: "type-small-x",
       action: "button button--small button--outline",
       closeButton: "button button--icon button--transparent"
-    }, u = t, s = C(() => L(
-      v,
+    }, u = t, s = C(() => $(
+      k,
       u.classes,
       u.toast?.classes
     )), y = (i, n) => {
       u.toast.close();
       const a = typeof n == "function" ? n : n.click;
-      a && E(() => {
+      a && L(() => {
         a(i, u.toast, n);
       });
     };
@@ -47,13 +47,13 @@ const $ = ["onClick"], T = {
         class: e(["toast__icon", s.value.icon])
       }, [
         m(i.$slots, "icon", { toast: t.toast }, () => [
-          t.toast.icon ? (o(), B(k, {
+          t.toast.icon ? (o(), B(v, {
             key: 0,
             icon: t.toast.icon
           }, null, 8, ["icon"])) : c("", !0)
         ])
       ], 2)) : c("", !0),
-      r("div", {
+      d("div", {
         class: e(["toast__content", s.value.content])
       }, [
         m(i.$slots, "content", { toast: t.toast }, () => [
@@ -61,18 +61,18 @@ const $ = ["onClick"], T = {
             key: 0,
             class: e(["toast__header", s.value.header])
           }, [
-            r("strong", {
+            d("strong", {
               class: e(["toast__title", s.value.title])
-            }, d(t.toast.title), 3),
+            }, r(t.toast.title), 3),
             t.toast.date ? (o(), l("span", {
               key: 0,
               class: e(["toast__date", s.value.date])
-            }, d(t.toast.date), 3)) : c("", !0)
+            }, r(t.toast.date), 3)) : c("", !0)
           ], 2)) : c("", !0),
           t.toast.description ? (o(), l("div", {
             key: 1,
             class: e(["toast__body", s.value.body])
-          }, d(t.toast.description), 3)) : c("", !0)
+          }, r(t.toast.description), 3)) : c("", !0)
         ])
       ], 2),
       t.toast.actions?.length ? (o(), l("div", {
@@ -81,19 +81,19 @@ const $ = ["onClick"], T = {
       }, [
         (o(!0), l(g, null, S(t.toast.actions, (a, b) => (o(), l("button", {
           key: b,
-          class: e(["toast__action", [s.value.action, a.class]]),
+          class: e(["toast__action", h(A)(s.value.action, a.class)]),
           onClick: (f) => y(f, a)
-        }, d(a.label), 11, $))), 128))
+        }, r(a.label), 11, F))), 128))
       ], 2)) : c("", !0),
-      r("button", {
+      d("button", {
         class: e(["toast__close", s.value.closeButton]),
         onClick: n[0] || (n[0] = (...a) => t.toast.close && t.toast.close(...a))
       }, [
-        h(k, { icon: "type:close" })
+        E(v, { icon: "type:close" })
       ], 2)
     ], 2));
   }
 };
 export {
-  T as default
+  V as default
 };

package/dist/utils/props.d.ts

@@ -28,4 +28,13 @@ export function checkDeprecatedProps(props: object, deprecatedNames: string[], c
  * @returns {Object} The final resolved classes object
  */
 export function mergeClassLookups(defaults: Object, ...sources: (Object | boolean | Function)[]): Object;
+/**
+ * Merges a base class (string, array, or object) with a user-supplied class override.
+ * Supports string, array, object, function, or boolean (false to clear) overrides.
+ *
+ * @param {String|Array|Object} base The base classes
+ * @param {String|Array|Object|Function|Boolean} override The class override
+ * @returns {String|Array|Object} The resolved classes suitable for Vue class binding
+ */
+export function resolveClassOverride(base: string | any[] | Object, override: string | any[] | Object | Function | boolean): string | any[] | Object;
 //# sourceMappingURL=props.d.ts.map

package/dist/utils/props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../lib/utils/props.js"],"names":[],"mappings":"AAAA;;GAEG;AACH;;;;GAIG;AACH,wDAEC;AAED;;;;;GAKG;AACH,4CAJW,MAAM,mBACN,MAAM,EAAE,4BASlB;AAED;;;;;;;;;;;;GAYG;AACH,4CAJW,MAAM,cACF,CAAC,MAAM,qBAAiB,CAAC,EAAA,GAC3B,MAAM,CAclB"}
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../lib/utils/props.js"],"names":[],"mappings":"AAAA;;GAEG;AACH;;;;GAIG;AACH,wDAEC;AAED;;;;;GAKG;AACH,4CAJW,MAAM,mBACN,MAAM,EAAE,4BASlB;AAED;;;;;;;;;;;;GAYG;AACH,4CAJW,MAAM,cACF,CAAC,MAAM,qBAAiB,CAAC,EAAA,GAC3B,MAAM,CAclB;AAED;;;;;;;GAOG;AACH,2CAJW,iBAAa,MAAM,YACnB,iBAAa,MAAM,qBAAiB,GAClC,iBAAa,MAAM,CAS/B"}

package/dist/utils/props.js

@@ -1,19 +1,23 @@
-function t(f) {
-  return f.every((r) => typeof r == "object");
+function o(f) {
+  return f.every((e) => typeof e == "object");
 }
-function c(f, r, o) {
-  r.forEach((e) => {
-    f[e] !== void 0 && o(e);
+function r(f, e, n) {
+  e.forEach((t) => {
+    f[t] !== void 0 && n(t);
   });
 }
-function n(f, ...r) {
-  let o = { ...f };
-  for (const e of r)
-    e === !1 ? o = {} : typeof e == "function" ? o = e(o, f) : typeof e == "object" && e !== null && (o = { ...o, ...e });
-  return o;
+function c(f, ...e) {
+  let n = { ...f };
+  for (const t of e)
+    t === !1 ? n = {} : typeof t == "function" ? n = t(n, f) : typeof t == "object" && t !== null && (n = { ...n, ...t });
+  return n;
+}
+function u(f, e) {
+  return e ? e === !1 ? "" : typeof e == "function" ? e(f) : [f, e] : f;
 }
 export {
-  c as checkDeprecatedProps,
-  t as isArrayOfObjects,
-  n as mergeClassLookups
+  r as checkDeprecatedProps,
+  o as isArrayOfObjects,
+  c as mergeClassLookups,
+  u as resolveClassOverride
 };

package/lib/plugins/toast/UluToast.vue

@@ -36,14 +36,14 @@
         v-for="(action, index) in toast.actions"
         :key="index"
         class="toast__action" 
-        :class="[resolvedClasses.action, action.class]"
+        :class="resolveClassOverride(resolvedClasses.action, action.class)"
         @click="handleAction($event, action)"
       >
         {{ action.label }}
       </button>
     </div>
     <button class="toast__close" :class="resolvedClasses.closeButton" @click="toast.close">
-      <UluIcon :icon="'type:close'"/>
+      <UluIcon icon="type:close" />
     </button>
   </div>
 </template>
@@ -51,7 +51,7 @@
 <script setup>
   import { nextTick, computed } from "vue";
   import UluIcon from "../../components/elements/UluIcon.vue";
-  import { mergeClassLookups } from "../../utils/props.js";
+  import { mergeClassLookups, resolveClassOverride } from "../../utils/props.js";
   
   const DEFAULT_CLASSES = {
     content: "type-small",

package/lib/utils/props.js

@@ -49,4 +49,21 @@ export function mergeClassLookups(defaults, ...sources) {
     }
   }
   return resolved;
+}
+
+/**
+ * Merges a base class (string, array, or object) with a user-supplied class override.
+ * Supports string, array, object, function, or boolean (false to clear) overrides.
+ * 
+ * @param {String|Array|Object} base The base classes
+ * @param {String|Array|Object|Function|Boolean} override The class override
+ * @returns {String|Array|Object} The resolved classes suitable for Vue class binding
+ */
+export function resolveClassOverride(base, override) {
+  if (!override) return base;
+  if (override === false) return "";
+  if (typeof override === "function") {
+    return override(base);
+  }
+  return [base, override];
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ulu/frontend-vue",
-  "version": "0.6.20",
+  "version": "0.6.21",
   "description": "A modular, tree-shakeable Vue 3 component library for the Ulu Frontend theming system, plus general utilities for Vue development",
   "type": "module",
   "files": [