@quidgest/ui 0.16.31 → 0.16.32

package/dist/ui.min.js

@@ -1,11 +1,11 @@
 !function(e,t){"object"==typeof exports&&typeof module<"u"?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t((e=typeof globalThis<"u"?globalThis:e||self)["Quidgest UI"]={},e.Vue)}(this,(function(e,t){"use strict"
 var a=Object.defineProperty,n=(e,t,n)=>((e,t,n)=>t in e?a(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n)(e,"symbol"!=typeof t?t+"":t,n)
 /*!
- * Quidgest UI v0.16.31
+ * Quidgest UI v0.16.32
  * (c) 2025 Quidgest - Consultores de Gestão, S.A.
  * Released under the MIT License.
  */
-const o={primary:"#008ad2",primaryLight:"#cde5ff",primaryDark:"#006398",secondary:"#001d31",secondaryLight:"#e6eef3",secondaryDark:"#001425",highlight:"#ff8241",highlightLight:"#ffe4d6",highlightDark:"#cc4700",info:"#17a2b8",infoLight:"#bceff7",infoDark:"#11798a",success:"#28a745",successLight:"#c2f0cd",successDark:"#1e7d34",warning:"#ffa900",warningLight:"#ffeabf",warningDark:"#bf7f00",danger:"#b71c1c",dangerLight:"#f7cccc",dangerDark:"#891515",background:"#fff",container:"#fff",neutral:"#7c858d",neutralLight:"#c4c5ca",neutralDark:"#40474f",onBackground:"#202428",onPrimary:"#fff",onSecondary:"#fff",onHighlight:"#fff",onSuccess:"#fff",onWarning:"#fff",onDanger:"#fff",onInfo:"#fff",onNeutral:"#fff"},l={primary:"#4da6e0",primaryLight:"#2d8bc7",primaryDark:"#87c4e8",secondary:"#4a6b82",secondaryLight:"#2c4a5e",secondaryDark:"#6b8ca3",highlight:"#ff9966",highlightLight:"#e67344",highlightDark:"#ffb088",info:"#3bb5d1",infoLight:"#2a9bb8",infoDark:"#66c7dd",success:"#4caf50",successLight:"#388e3c",successDark:"#81c784",warning:"#ffb74d",warningLight:"#e67e22",warningDark:"#ffcc80",danger:"#e57373",dangerLight:"#c62828",dangerDark:"#ef9a9a",background:"#121212",container:"#1e1e1e",neutral:"#9e9e9e",neutralLight:"#666666",neutralDark:"#d0d0d0",onBackground:"#ffffff",onPrimary:"#ffffff",onSecondary:"#ffffff",onHighlight:"#ffffff",onSuccess:"#ffffff",onWarning:"#000000",onDanger:"#ffffff",onInfo:"#ffffff",onNeutral:"#000000"},r=Object.freeze(Object.defineProperty({__proto__:null,defaultDarkColorScheme:l,defaultLightColorScheme:o},Symbol.toStringTag,{value:"Module"}))
+const o={primary:"#008ad2",primaryLight:"#cde5ff",primaryDark:"#006398",secondary:"#001d31",secondaryLight:"#e6eef3",secondaryDark:"#001425",highlight:"#ff8241",highlightLight:"#ffe4d6",highlightDark:"#cc4700",info:"#17a2b8",infoLight:"#bceff7",infoDark:"#11798a",success:"#28a745",successLight:"#c2f0cd",successDark:"#1e7d34",warning:"#ffa900",warningLight:"#ffeabf",warningDark:"#bf7f00",danger:"#b71c1c",dangerLight:"#f7cccc",dangerDark:"#891515",background:"#fff",container:"#fff",neutral:"#7c858d",neutralLight:"#c4c5ca",neutralDark:"#40474f",onBackground:"#202428",onPrimary:"#fff",onSecondary:"#fff",onHighlight:"#fff",onSuccess:"#fff",onWarning:"#fff",onDanger:"#fff",onInfo:"#fff",onNeutral:"#fff"},l={primary:"#4da6e0",primaryLight:"#1a2832",primaryDark:"#87c5f0",secondary:"#b8d4e6",secondaryLight:"#1a2832",secondaryDark:"#e6f2ff",highlight:"#ff9966",highlightLight:"#2d1a0f",highlightDark:"#ffb899",info:"#4cb8d1",infoLight:"#1f2a2d",infoDark:"#7dcce0",success:"#5cb85c",successLight:"#1e2a20",successDark:"#85d085",warning:"#ffcc4d",warningLight:"#332a1a",warningDark:"#ffd966",danger:"#e74c3c",dangerLight:"#2d1a1a",dangerDark:"#f17066",background:"#121212",container:"#1e1e1e",neutral:"#9ca3ab",neutralLight:"#2a2d31",neutralDark:"#c8ced6",onBackground:"#e0e0e0",onPrimary:"#000",onSecondary:"#000",onHighlight:"#000",onSuccess:"#000",onWarning:"#000",onDanger:"#000",onInfo:"#000",onNeutral:"#000"},r=Object.freeze(Object.defineProperty({__proto__:null,defaultDarkColorScheme:l,defaultLightColorScheme:o},Symbol.toStringTag,{value:"Module"}))
 function i(e){return null==e||("string"==typeof e||Array.isArray(e)?0===e.length:"object"==typeof e&&0===Object.keys(e).length)}function s(e){return null!==e&&"object"==typeof e&&!Array.isArray(e)}function u(e={},t={}){const a={},n=new Set([...Object.keys(e),...Object.keys(t)])
 for(const o of n){if("__proto__"===o||"constructor"===o||"prototype"===o)continue
 const n=e[o],l=t[o]
@@ -71,18 +71,14 @@ if(e){t+=`  ${A(n)}: ${e};\n`
 const a=M(e)
 t+=`  ${A(n)}-rgb: ${a.r} ${a.g} ${a.b};\n`}}return t+="}\n",t}function q(e){const t=e.map(P).join("\n"),a=function(){let e=document.getElementById(T)
 return e||(e=document.createElement("style"),e.id=T,document.head.appendChild(e)),e}()
-a.textContent=t}function A(e){return e?`--q-theme-${x(e)}`:""}function R(e,a){const n=t.ref(t.toValue(e)),o=t.computed((()=>{const e=a.find((e=>e.name===n.value))
-if(!e)throw new Error(`Theme "${n.value}" not found`)
-return e})),l=t.computed((()=>z(o.value.name))),r=t.computed((()=>P(o.value)))
-return{name:n,current:o,themes:a,class:l,css:r}}function z(e){return`q-theme--${x(e)}`}const L=Symbol.for("q-theme")
+a.textContent=t}function A(e){return e?`--q-theme-${x(e)}`:""}function R(e,a){const n=t.computed((()=>{const t=a.value.find((t=>t.name===e.value))
+if(!t)throw new Error(`[Quidgest UI] Theme "${e.value}" not found`)
+return t})),o=t.computed((()=>z(n.value.name))),l=t.computed((()=>P(n.value)))
+return{name:e,current:n,themes:a,class:o,css:l}}function z(e){return`q-theme--${x(e)}`}const L=Symbol.for("q-theme")
 function O(){const e=t.inject(L)
 if(!e)throw new Error("[Quidgest UI] Could not find theme instance")
-return e}function I(e){const a=O()
-let n,o=structuredClone(a.themes)
-const l=t.toValue(e)
-"string"!=typeof l?(o=[...o,l],n=l.name):n=l
-const r=R(n,o)
-return t.provide(L,r),r}function F(e){const a=t.computed((()=>t.unref(e))),n=t.computed((()=>!!a.value&&!function(e){return e.startsWith("#")||e.startsWith("rgb")||e.startsWith("hsl")}(a.value))),o=t.computed((()=>{const e=a.value
+return e}function I(e){const{themes:a}=O(),n=t.computed((()=>t.toValue(e))),o=t.computed((()=>"string"!=typeof n.value)),l=R(t.computed((()=>o.value?n.value.name:n.value)),t.computed((()=>o.value?[...a.value,n.value]:a.value)))
+return t.provide(L,l),l}function F(e){const a=t.computed((()=>t.unref(e))),n=t.computed((()=>!!a.value&&!function(e){return e.startsWith("#")||e.startsWith("rgb")||e.startsWith("hsl")}(a.value))),o=t.computed((()=>{const e=a.value
 if(!e)return
 let t=e
 const o=O()
@@ -1559,7 +1555,7 @@ a.provide(d,t.ref(r)),function(e,a){const n=[]
 let r
 if(a)for(const e of a.themes){const t={..."light"===e.mode?o:l,...e.colors}
 n.push({name:e.name,mode:e.mode,scheme:t}),e.name===a.defaultTheme&&(r=e.name)}else{const e=[{name:"light",mode:"light",scheme:o},{name:"dark",mode:"dark",scheme:l}]
-n.push(...e),r="light"}if(r){const a=R(t.ref(r),n)
+n.push(...e),r="light"}if(r){const a=R(t.ref(r),t.ref(n))
 q(n),t.watch(a.class,Np,{immediate:!0}),e.provide(L,a)}}(a,e.themes)
 const i=function(){const e=t.ref([])
 return{layers:e,register:function(t){e.value.push(t)},unregister:function(t){const a=e.value.indexOf(t);-1!==a&&e.value.splice(a,1)},isTop:function(t){return e.value[e.value.length-1]===t}}}()

package/dist/ui.scss

@@ -1,5 +1,5 @@
 /*!
- * Quidgest UI v0.16.31
+ * Quidgest UI v0.16.32
  * (c) 2025 Quidgest - Consultores de Gestão, S.A.
  * Released under the MIT License.
  */

package/esm/composables/theme.d.ts

@@ -43,7 +43,7 @@ export type ThemeInstance = {
     /** A computed reference to the current theme definition. */
     readonly current: DeepReadonly<ComputedRef<ThemeDefinition>>;
     /** An array of available theme definitions. */
-    readonly themes: DeepReadonly<ThemeDefinition[]>;
+    readonly themes: DeepReadonly<Ref<ThemeDefinition[]>>;
     /** The theme class name. */
     readonly class: ComputedRef<string>;
     /** The theme CSS definition. */
@@ -56,23 +56,22 @@ export type ThemeInstance = {
  */
 export declare function useTheme(): ThemeInstance;
 /**
- * Provides and manages a reactive theme instance within the Vue dependency injection system.
+ * Provides and manages a reactive theme instance within Vue’s dependency injection system.
  *
- * This function retrieves the current list of available themes from the theme context,
- * optionally adds a new `ThemeDefinition`, and creates a reactive theme instance.
- * The new theme instance is then provided using Vue's `provide`, making it accessible
- * to all descendant components via `inject`.
+ * This function:
+ *  - Retrieves the current list of available themes from the existing theme context.
+ *  - Resolves the input (`nameOrDef`) to either a theme name or a full `ThemeDefinition`.
+ *  - If a `ThemeDefinition` is provided, it is appended to the existing list of themes.
+ *  - Creates a new reactive `ThemeInstance` bound to the resolved name and theme list.
+ *  - Provides the new `ThemeInstance` under `ThemeSymbol`, making it available to descendants via `useTheme()`.
  *
- * @param nameOrDef - Either:
- *   - A string (or `Ref<string>`/getter) specifying the name of the theme to activate.
- *   - A `ThemeDefinition` (or `Ref<ThemeDefinition>`/getter) to register and activate.
+ * @param nameOrDef - The theme to activate, given as either:
+ *   - A theme name (`string`), or a reactive source (`Ref<string>`/getter).
+ *   - A `ThemeDefinition`, or a reactive source (`Ref<ThemeDefinition>`/getter).
  *
- * @returns The newly created and provided `ThemeInstance`, containing:
- *   - `name`: reactive theme name (`Ref<string>`),
- *   - `current`: computed active theme (`Ref<ThemeDefinition>`),
- *   - `themes`: array of all available themes,
- *   - `class`: computed CSS class string for the theme,
- *   - `css`: computed CSS variables string for the theme.
+ * @returns The newly created and provided `ThemeInstance`.
+ *
+ * @throws {Error} If the resolved theme name does not exist in the available themes.
  */
 export declare function provideTheme(nameOrDef: MaybeRefOrGetter<string | ThemeDefinition>): ThemeInstance;
 //# sourceMappingURL=theme.d.ts.map

package/esm/composables/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/composables/theme.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,gBAAgB,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AACzF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAMjD,eAAO,MAAM,WAAW,EAAE,YAAY,CAAC,aAAa,CAAyB,CAAA;AAE7E;;GAEG;AACH,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;AAExC;;;GAGG;AACH,MAAM,MAAM,SAAS,GAAG;IACvB,6DAA6D;IAC7D,YAAY,EAAE,MAAM,CAAA;IAEpB,mEAAmE;IACnE,MAAM,EAAE,KAAK,CAAC;QACb,6BAA6B;QAC7B,IAAI,EAAE,MAAM,CAAA;QAEZ,mDAAmD;QACnD,IAAI,EAAE,SAAS,CAAA;QAEf,qEAAqE;QACrE,MAAM,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAA;KAC7B,CAAC,CAAA;CACF,CAAA;AAED;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC7B,oCAAoC;IACpC,IAAI,EAAE,MAAM,CAAA;IAEZ,mDAAmD;IACnD,IAAI,EAAE,SAAS,CAAA;IAEf,kDAAkD;IAClD,MAAM,EAAE,WAAW,CAAA;CACnB,CAAA;AAED;;;GAGG;AACH,MAAM,MAAM,aAAa,GAAG;IAC3B,yDAAyD;IACzD,QAAQ,CAAC,IAAI,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;IAE1B,4DAA4D;IAC5D,QAAQ,CAAC,OAAO,EAAE,YAAY,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC,CAAA;IAE5D,+CAA+C;IAC/C,QAAQ,CAAC,MAAM,EAAE,YAAY,CAAC,eAAe,EAAE,CAAC,CAAA;IAEhD,4BAA4B;IAC5B,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;IAEnC,gCAAgC;IAChC,QAAQ,CAAC,GAAG,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;CAC7C,CAAA;AAED;;;;GAIG;AACH,wBAAgB,QAAQ,IAAI,aAAa,CAQxC;AAED;;;;;;;;;;;;;;;;;;GAkBG;AAEH,wBAAgB,YAAY,CAAC,SAAS,EAAE,gBAAgB,CAAC,MAAM,GAAG,eAAe,CAAC,GAAG,aAAa,CAsBjG"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/composables/theme.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,gBAAgB,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AACzF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAMjD,eAAO,MAAM,WAAW,EAAE,YAAY,CAAC,aAAa,CAAyB,CAAA;AAE7E;;GAEG;AACH,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;AAExC;;;GAGG;AACH,MAAM,MAAM,SAAS,GAAG;IACvB,6DAA6D;IAC7D,YAAY,EAAE,MAAM,CAAA;IAEpB,mEAAmE;IACnE,MAAM,EAAE,KAAK,CAAC;QACb,6BAA6B;QAC7B,IAAI,EAAE,MAAM,CAAA;QAEZ,mDAAmD;QACnD,IAAI,EAAE,SAAS,CAAA;QAEf,qEAAqE;QACrE,MAAM,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAA;KAC7B,CAAC,CAAA;CACF,CAAA;AAED;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC7B,oCAAoC;IACpC,IAAI,EAAE,MAAM,CAAA;IAEZ,mDAAmD;IACnD,IAAI,EAAE,SAAS,CAAA;IAEf,kDAAkD;IAClD,MAAM,EAAE,WAAW,CAAA;CACnB,CAAA;AAED;;;GAGG;AACH,MAAM,MAAM,aAAa,GAAG;IAC3B,yDAAyD;IACzD,QAAQ,CAAC,IAAI,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;IAE1B,4DAA4D;IAC5D,QAAQ,CAAC,OAAO,EAAE,YAAY,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC,CAAA;IAE5D,+CAA+C;IAC/C,QAAQ,CAAC,MAAM,EAAE,YAAY,CAAC,GAAG,CAAC,eAAe,EAAE,CAAC,CAAC,CAAA;IAErD,4BAA4B;IAC5B,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;IAEnC,gCAAgC;IAChC,QAAQ,CAAC,GAAG,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;CAC7C,CAAA;AAED;;;;GAIG;AACH,wBAAgB,QAAQ,IAAI,aAAa,CAQxC;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,CAAC,SAAS,EAAE,gBAAgB,CAAC,MAAM,GAAG,eAAe,CAAC,GAAG,aAAa,CA2CjG"}

package/esm/composables/theme.js

@@ -1,22 +1,22 @@
-import { toValue as c, provide as i, inject as h } from "vue";
-import { createThemeInstance as u } from "../utils/theme.js";
+import { computed as n, toValue as c, provide as a, inject as l } from "vue";
+import { createThemeInstance as h } from "../utils/theme.js";
 const m = Symbol.for("q-theme");
-function f() {
-  const e = h(m);
+function v() {
+  const e = l(m);
   if (!e)
     throw new Error("[Quidgest UI] Could not find theme instance");
   return e;
 }
-function d(e) {
-  const s = f();
-  let n, o = structuredClone(s.themes);
-  const t = c(e);
-  typeof t != "string" ? (o = [...o, t], n = t.name) : n = t;
-  const r = u(n, o);
-  return i(m, r), r;
+function p(e) {
+  const { themes: o } = v(), t = n(() => c(e)), s = n(() => typeof t.value != "string"), r = n(
+    () => s.value ? t.value.name : t.value
+  ), u = n(
+    () => s.value ? [...o.value, t.value] : o.value
+  ), i = h(r, u);
+  return a(m, i), i;
 }
 export {
   m as ThemeSymbol,
-  d as provideTheme,
-  f as useTheme
+  p as provideTheme,
+  v as useTheme
 };

package/esm/framework.js

@@ -1,21 +1,21 @@
-import { DEFAULTS_SYMBOL as i } from "./composables/defaults.js";
+import { DEFAULTS_SYMBOL as c } from "./composables/defaults.js";
 import { ThemeSymbol as h } from "./composables/theme.js";
 import { DismissibleLayerKey as f } from "./symbols/dismissibleLayer.js";
 import { ToastSymbol as d } from "./composables/useToast/types.js";
 import { useDismissibleLayerStack as u } from "./composables/useDismissibleLayerStack/index.js";
 import { createToastInstance as p } from "./composables/useToast/index.js";
-import { defaultLightColorScheme as r, defaultDarkColorScheme as l } from "./templates/theme.js";
-import { ref as c, watch as S } from "vue";
+import { defaultLightColorScheme as l, defaultDarkColorScheme as i } from "./templates/theme.js";
+import { ref as n, watch as S } from "vue";
 import { createThemeInstance as T, generateRootStyle as L } from "./utils/theme.js";
 function N(o = {}) {
   return { install: (t) => {
     const m = o.components || {};
-    for (const n in m)
-      t.component(n, m[n]);
+    for (const a in m)
+      t.component(a, m[a]);
     const e = o.defaults || {};
-    t.provide(i, c(e)), y(t, o.themes);
-    const a = u();
-    t.provide(f, a), b(t);
+    t.provide(c, n(e)), y(t, o.themes);
+    const r = u();
+    t.provide(f, r), b(t);
   } };
 }
 function y(o, s) {
@@ -23,11 +23,11 @@ function y(o, s) {
   let m;
   if (s)
     for (const e of s.themes) {
-      const n = { ...e.mode === "light" ? r : l, ...e.colors };
+      const a = { ...e.mode === "light" ? l : i, ...e.colors };
       t.push({
         name: e.name,
         mode: e.mode,
-        scheme: n
+        scheme: a
       }), e.name === s.defaultTheme && (m = e.name);
     }
   else {
@@ -35,19 +35,19 @@ function y(o, s) {
       {
         name: "light",
         mode: "light",
-        scheme: r
+        scheme: l
       },
       {
         name: "dark",
         mode: "dark",
-        scheme: l
+        scheme: i
       }
     ];
     t.push(...e), m = "light";
   }
   if (m) {
-    const e = c(m), a = T(e, t);
-    L(t), S(a.class, k, { immediate: !0 }), o.provide(h, a);
+    const e = T(n(m), n(t));
+    L(t), S(e.class, k, { immediate: !0 }), o.provide(h, e);
   }
 }
 function b(o) {

package/esm/templates/theme.js

@@ -1,4 +1,4 @@
-const f = {
+const a = {
   primary: "#008ad2",
   primaryLight: "#cde5ff",
   primaryDark: "#006398",
@@ -34,44 +34,44 @@ const f = {
   onDanger: "#fff",
   onInfo: "#fff",
   onNeutral: "#fff"
-}, a = {
+}, f = {
   primary: "#4da6e0",
-  primaryLight: "#2d8bc7",
-  primaryDark: "#87c4e8",
-  secondary: "#4a6b82",
-  secondaryLight: "#2c4a5e",
-  secondaryDark: "#6b8ca3",
+  primaryLight: "#1a2832",
+  primaryDark: "#87c5f0",
+  secondary: "#b8d4e6",
+  secondaryLight: "#1a2832",
+  secondaryDark: "#e6f2ff",
   highlight: "#ff9966",
-  highlightLight: "#e67344",
-  highlightDark: "#ffb088",
-  info: "#3bb5d1",
-  infoLight: "#2a9bb8",
-  infoDark: "#66c7dd",
-  success: "#4caf50",
-  successLight: "#388e3c",
-  successDark: "#81c784",
-  warning: "#ffb74d",
-  warningLight: "#e67e22",
-  warningDark: "#ffcc80",
-  danger: "#e57373",
-  dangerLight: "#c62828",
-  dangerDark: "#ef9a9a",
+  highlightLight: "#2d1a0f",
+  highlightDark: "#ffb899",
+  info: "#4cb8d1",
+  infoLight: "#1f2a2d",
+  infoDark: "#7dcce0",
+  success: "#5cb85c",
+  successLight: "#1e2a20",
+  successDark: "#85d085",
+  warning: "#ffcc4d",
+  warningLight: "#332a1a",
+  warningDark: "#ffd966",
+  danger: "#e74c3c",
+  dangerLight: "#2d1a1a",
+  dangerDark: "#f17066",
   background: "#121212",
   container: "#1e1e1e",
-  neutral: "#9e9e9e",
-  neutralLight: "#666666",
-  neutralDark: "#d0d0d0",
-  onBackground: "#ffffff",
-  onPrimary: "#ffffff",
-  onSecondary: "#ffffff",
-  onHighlight: "#ffffff",
-  onSuccess: "#ffffff",
-  onWarning: "#000000",
-  onDanger: "#ffffff",
-  onInfo: "#ffffff",
-  onNeutral: "#000000"
+  neutral: "#9ca3ab",
+  neutralLight: "#2a2d31",
+  neutralDark: "#c8ced6",
+  onBackground: "#e0e0e0",
+  onPrimary: "#000",
+  onSecondary: "#000",
+  onHighlight: "#000",
+  onSuccess: "#000",
+  onWarning: "#000",
+  onDanger: "#000",
+  onInfo: "#000",
+  onNeutral: "#000"
 };
 export {
-  a as defaultDarkColorScheme,
-  f as defaultLightColorScheme
+  f as defaultDarkColorScheme,
+  a as defaultLightColorScheme
 };

package/esm/utils/theme.d.ts

@@ -1,4 +1,4 @@
-import { DeepReadonly, MaybeRefOrGetter } from 'vue';
+import { DeepReadonly, Ref } from 'vue';
 import { ThemeDefinition, ThemeInstance } from '../composables/theme';
 export declare const THEME_NODE_ID = "q-theme";
 /**
@@ -33,24 +33,24 @@ export declare function generateRootStyle(themes: ThemeDefinition[]): void;
  */
 export declare function toProperty(color: string): string;
 /**
- * Creates a reactive theme instance for a given theme name.
+ * Creates a reactive theme instance bound to a given theme name and list of theme definitions.
  *
- * This provides reactive access to the currently active theme and
- * computed properties for applying its CSS class and CSS variables.
+ * This function ensures the active theme is always kept in sync with the provided `name` ref,
+ * and exposes reactive/computed properties for convenient use in templates and styling.
  *
- * @param name - The name of the theme to activate, or a getter/ref returning a string.
- * @param themes - A readonly array of available theme definitions.
+ * @param name - A reactive `Ref<string>` representing the active theme name.
+ * @param themes - A reactive `Ref<ThemeDefinition[]>` containing all available themes.
  *
- * @returns A `ThemeInstance` object containing:
- *   - `name`: a reactive `Ref<string>` of the active theme name.
- *   - `current`: a computed `Ref<ThemeDefinition>` of the active theme.
- *   - `themes`: the array of all available theme definitions.
- *   - `class`: a computed CSS class string for the active theme.
- *   - `css`: a computed string of CSS variables for the active theme.
+ * @returns A `ThemeInstance` object with the following reactive properties:
+ *   - `name`: the reactive `Ref<string>` of the active theme name.
+ *   - `current`: a computed `Ref<ThemeDefinition>` of the active theme definition.
+ *   - `themes`: the reactive `Ref<ThemeDefinition[]>` of all available themes.
+ *   - `class`: a computed `Ref<string>` of the CSS class for the active theme.
+ *   - `css`: a computed `Ref<string>` of the CSS variables for the active theme.
  *
- * @throws Will throw an error if no theme with the specified name exists in `themes`.
+ * @throws {Error} If no theme matching the active `name` exists in `themes`.
  */
-export declare function createThemeInstance(name: MaybeRefOrGetter<string>, themes: DeepReadonly<ThemeDefinition[]>): ThemeInstance;
+export declare function createThemeInstance(name: Ref<string>, themes: DeepReadonly<Ref<ThemeDefinition[]>>): ThemeInstance;
 /**
  * Generates a CSS class name for a given theme.
  *

package/esm/utils/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/utils/theme.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,KAAK,CAAA;AACzD,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAA;AAQ1E,eAAO,MAAM,aAAa,YAAY,CAAA;AAEtC;;;;GAIG;AACH,wBAAgB,YAAY,IAAI,gBAAgB,CAY/C;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,eAAe,UAoBtD;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,eAAe,EAAE,QAM1D;AAED;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,UAOvC;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,mBAAmB,CAClC,IAAI,EAAE,gBAAgB,CAAC,MAAM,CAAC,EAC9B,MAAM,EAAE,YAAY,CAAC,eAAe,EAAE,CAAC,GACrC,aAAa,CAqBf;AAED;;;;;;;GAOG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,UAEzC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/utils/theme.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAC5C,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAA;AAQ1E,eAAO,MAAM,aAAa,YAAY,CAAA;AAEtC;;;;GAIG;AACH,wBAAgB,YAAY,IAAI,gBAAgB,CAY/C;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,eAAe,UAoBtD;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,eAAe,EAAE,QAM1D;AAED;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,UAOvC;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,mBAAmB,CAClC,IAAI,EAAE,GAAG,CAAC,MAAM,CAAC,EACjB,MAAM,EAAE,YAAY,CAAC,GAAG,CAAC,eAAe,EAAE,CAAC,CAAC,GAC1C,aAAa,CAmBf;AAED;;;;;;;GAOG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,UAEzC"}

package/esm/utils/theme.js

@@ -1,63 +1,63 @@
-import { ref as d, toValue as p, computed as c } from "vue";
-import { parseColor as $ } from "./color.js";
-import { toKebabCase as l } from "./string.js";
-const a = "q-theme";
-function g() {
+import { computed as c } from "vue";
+import { parseColor as d } from "./color.js";
+import { toKebabCase as a } from "./string.js";
+const m = "q-theme";
+function h() {
   let e = document.getElementById(
-    a
+    m
   );
-  return e || (e = document.createElement("style"), e.id = a, document.head.appendChild(e)), e;
+  return e || (e = document.createElement("style"), e.id = m, document.head.appendChild(e)), e;
 }
 function i(e) {
-  let t = `.${f(e.name)} {
+  let t = `.${l(e.name)} {
 `;
   const n = e.scheme;
   let o;
   for (o in n) {
-    const r = n[o];
-    if (r) {
-      t += `  ${u(o)}: ${r};
+    const s = n[o];
+    if (s) {
+      t += `  ${u(o)}: ${s};
 `;
-      const s = $(r);
-      t += `  ${u(o)}-rgb: ${s.r} ${s.g} ${s.b};
+      const r = d(s);
+      t += `  ${u(o)}-rgb: ${r.r} ${r.g} ${r.b};
 `;
     }
   }
   return t += `}
 `, t;
 }
-function b(e) {
+function C(e) {
   const t = e.map(i).join(`
-`), n = g();
+`), n = h();
   n.textContent = t;
 }
 function u(e) {
-  return e ? `--q-theme-${l(e)}` : "";
+  return e ? `--q-theme-${a(e)}` : "";
 }
-function v(e, t) {
-  const n = d(p(e)), o = c(() => {
-    const m = t.find((h) => h.name === n.value);
-    if (!m)
-      throw new Error(`Theme "${n.value}" not found`);
-    return m;
-  }), r = c(() => f(o.value.name)), s = c(() => i(o.value));
+function T(e, t) {
+  const n = c(() => {
+    const r = t.value.find((f) => f.name === e.value);
+    if (!r)
+      throw new Error(`[Quidgest UI] Theme "${e.value}" not found`);
+    return r;
+  }), o = c(() => l(n.value.name)), s = c(() => i(n.value));
   return {
-    name: n,
-    current: o,
+    name: e,
+    current: n,
     themes: t,
-    class: r,
+    class: o,
     css: s
   };
 }
-function f(e) {
-  return `q-theme--${l(e)}`;
+function l(e) {
+  return `q-theme--${a(e)}`;
 }
 export {
-  a as THEME_NODE_ID,
-  v as createThemeInstance,
-  b as generateRootStyle,
+  m as THEME_NODE_ID,
+  T as createThemeInstance,
+  C as generateRootStyle,
   i as generateThemeCss,
-  f as getThemeClass,
-  g as getThemeNode,
+  l as getThemeClass,
+  h as getThemeNode,
   u as toProperty
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@quidgest/ui",
   "description": "Quidgest's UI framework",
-  "version": "0.16.31",
+  "version": "0.16.32",
   "private": false,
   "type": "module",
   "author": "Quidgest",