@quidgest/ui 0.16.13 → 0.16.15

package/esm/composables/useDialog/types.d.ts

@@ -1,8 +1,8 @@
-import { QDialogProps } from '../../components/QDialog/types.ts';
+import { QDialogProps, QDialogOptions } from '../../components/QDialog/types.ts';
 /**
  * Represents an instance of a dialog component.
  */
-type DialogInstance = {
+export type DialogInstance = {
     /**
      * A unique identifier for the dialog instance.
      */
@@ -11,15 +11,18 @@ type DialogInstance = {
      * The properties applied to the dialog, conforming to `QDialogProps`.
      */
     props: QDialogProps;
+    /**
+     * The options applied to the dialog, conforming to `QDialogOptions`.
+     */
+    options?: QDialogOptions;
 };
 /**
  * Represents the state for dialog management.
  */
-export type State = {
+export type DialogState = {
     /**
      * An array containing the currently active dialog instances.
      */
     dialogs: DialogInstance[];
 };
-export {};
 //# sourceMappingURL=types.d.ts.map

package/esm/composables/useDialog/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/composables/useDialog/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAA;AAErE;;GAEG;AACH,KAAK,cAAc,GAAG;IACrB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAA;IAEV;;OAEG;IACH,KAAK,EAAE,YAAY,CAAA;CACnB,CAAA;AAED;;GAEG;AACH,MAAM,MAAM,KAAK,GAAG;IACnB;;OAEG;IACH,OAAO,EAAE,cAAc,EAAE,CAAA;CACzB,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/composables/useDialog/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAA;AAErF;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG;IAC5B;;OAEG;IACH,EAAE,EAAE,MAAM,CAAA;IAEV;;OAEG;IACH,KAAK,EAAE,YAAY,CAAA;IAEnB;;OAEG;IACH,OAAO,CAAC,EAAE,cAAc,CAAA;CACxB,CAAA;AAED;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG;IACzB;;OAEG;IACH,OAAO,EAAE,cAAc,EAAE,CAAA;CACzB,CAAA"}

package/esm/composables/useToast/index.d.ts

@@ -0,0 +1,33 @@
+import { ToastInstance, UseToastReturn } from './types.ts';
+/**
+ * A composable function that manages existing QToast instances.
+ *
+ * @returns An object containing:
+ * - toasts: The array of currently active QToast instances.
+ * - addToast: A function that adds a QToast instance to the DOM, according to the given QToastProps.
+ * - removeToast: A function to remove a QToast instance from the DOM.
+ */
+export declare function useToast(): UseToastReturn;
+/**
+ * Creates a new toast instance for managing toast notifications.
+ *
+ * @returns An object containing a reactive array of toast items.
+ */
+export declare function createToastInstance(): ToastInstance;
+/**
+ * Provides a toast notification instance to the current Vue component context.
+ *
+ * @returns The provided toast instance for managing toast notifications.
+ *
+ * @see createToastInstance
+ * @see ToastSymbol
+ */
+export declare function provideToast(): ToastInstance;
+/**
+ * Injects the ToastInstance provided by the ToastSymbol.
+ *
+ * @throws If the ToastInstance has not been provided via provideToast.
+ * @returns The injected ToastInstance.
+ */
+export declare function injectToastInstance(): ToastInstance;
+//# sourceMappingURL=index.d.ts.map

package/esm/composables/useToast/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/composables/useToast/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAe,KAAK,aAAa,EAAkB,KAAK,cAAc,EAAE,MAAM,YAAY,CAAA;AAMjG;;;;;;;GAOG;AACH,wBAAgB,QAAQ,IAAI,cAAc,CAoCzC;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,IAAI,aAAa,CAInD;AAED;;;;;;;GAOG;AACH,wBAAgB,YAAY,IAAI,aAAa,CAI5C;AAED;;;;;GAKG;AACH,wBAAgB,mBAAmB,IAAI,aAAa,CAMnD"}

package/esm/composables/useToast/index.js

@@ -0,0 +1,35 @@
+import { ToastSymbol as a } from "./types.js";
+import { inject as i, ref as u } from "vue";
+import { useId as c } from "../uid.js";
+function p() {
+  const { toasts: t } = f();
+  function s(n, o) {
+    const e = c(o);
+    return t.value.push({ id: e, props: n }), e;
+  }
+  function r(n) {
+    const o = t.value.findIndex((e) => e.id === n);
+    o !== -1 && t.value.splice(o, 1);
+  }
+  return {
+    toasts: t,
+    addToast: s,
+    removeToast: r
+  };
+}
+function I() {
+  return {
+    toasts: u([])
+  };
+}
+function f() {
+  const t = i(a);
+  if (!t)
+    throw new Error("useInjectedToast must be used after provideToast");
+  return t;
+}
+export {
+  I as createToastInstance,
+  f as injectToastInstance,
+  p as useToast
+};

package/esm/composables/useToast/types.d.ts

@@ -0,0 +1,40 @@
+import { InjectionKey, Ref } from 'vue';
+import { QToastProps } from '../../components/QToast';
+export declare const ToastSymbol: InjectionKey<ToastInstance>;
+/**
+ * Represents an instance of the toast notification system.
+ */
+export type ToastInstance = {
+    /**
+     * A Vue Ref containing the list of active toast notifications.
+     */
+    toasts: Ref<ToastItem[]>;
+};
+/**
+ * Represents a single toast item managed in the toasts state array.
+ */
+export type ToastItem = {
+    /**
+     * A unique identifier for the toast item.
+     */
+    id: string;
+    /**
+     * The properties applied to the toast item, conforming to `QToastProps`.
+     */
+    props: QToastProps;
+};
+/**
+ * Represents the return type of the `useToast` composable, providing methods and state
+ * for managing toast notifications.
+ */
+export type UseToastReturn = ToastInstance & {
+    /**
+     * A function to add a toast item to the DOM.
+     */
+    addToast(props: QToastProps, id?: string): string;
+    /**
+     * A function to remove a toast item from the DOM.
+     */
+    removeToast(id: string): void;
+};
+//# sourceMappingURL=types.d.ts.map

package/esm/composables/useToast/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/composables/useToast/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAC5C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AAE1D,eAAO,MAAM,WAAW,EAAE,YAAY,CAAC,aAAa,CAAyB,CAAA;AAE7E;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG;IAC3B;;OAEG;IACH,MAAM,EAAE,GAAG,CAAC,SAAS,EAAE,CAAC,CAAA;CACxB,CAAA;AAED;;GAEG;AACH,MAAM,MAAM,SAAS,GAAG;IACvB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAA;IAEV;;OAEG;IACH,KAAK,EAAE,WAAW,CAAA;CAClB,CAAA;AAED;;;GAGG;AACH,MAAM,MAAM,cAAc,GAAG,aAAa,GAAG;IAC5C;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,WAAW,EAAE,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAEjD;;OAEG;IACH,WAAW,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,CAAA;CAC7B,CAAA"}

package/esm/composables/useToast/types.js

@@ -0,0 +1,4 @@
+const o = Symbol.for("q-toast");
+export {
+  o as ToastSymbol
+};

package/esm/framework.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"framework.d.ts","sourceRoot":"","sources":["../src/framework.ts"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAO,SAAS,EAAE,MAAM,EAAE,MAAM,KAAK,CAAA;AACjD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAA;AACtD,OAAO,KAAK,EAAE,SAAS,EAAmB,MAAM,qBAAqB,CAAA;AAMrE;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC7B,qFAAqF;IACrF,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAA;IAEtC,gFAAgF;IAChF,MAAM,CAAC,EAAE,SAAS,CAAA;IAElB,+EAA+E;IAC/E,QAAQ,CAAC,EAAE,QAAQ,CAAA;CACnB,CAAA;AAED;;;;;;;;GAQG;AACH,wBAAgB,eAAe,CAAC,MAAM,GAAE,eAAoB,GAAG,MAAM,CAqBpE"}
+{"version":3,"file":"framework.d.ts","sourceRoot":"","sources":["../src/framework.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAO,SAAS,EAAE,MAAM,EAAE,MAAM,KAAK,CAAA;AACjD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAA;AACtD,OAAO,KAAK,EAAE,SAAS,EAAmB,MAAM,qBAAqB,CAAA;AAMrE;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC7B,qFAAqF;IACrF,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAA;IAEtC,gFAAgF;IAChF,MAAM,CAAC,EAAE,SAAS,CAAA;IAElB,+EAA+E;IAC/E,QAAQ,CAAC,EAAE,QAAQ,CAAA;CACnB,CAAA;AAED;;;;;;;;GAQG;AACH,wBAAgB,eAAe,CAAC,MAAM,GAAE,eAAoB,GAAG,MAAM,CAwBpE"}

package/esm/framework.js

@@ -1,48 +1,54 @@
 import { DEFAULTS_SYMBOL as i } from "./composables/defaults.js";
 import { ThemeSymbol as c } from "./composables/theme.js";
-import { DismissibleLayerKey as h } from "./symbols/dismissibleLayer.js";
-import { useDismissibleLayerStack as f } from "./composables/useDismissibleLayerStack/index.js";
-import { defaultLightColorScheme as a, defaultDarkColorScheme as d } from "./templates/theme.js";
-import { ref as r, watch as u } from "vue";
-import { createThemeInstance as p, generateRootStyle as L } from "./utils/theme.js";
-function q(m = {}) {
+import { DismissibleLayerKey as f } from "./symbols/dismissibleLayer.js";
+import { ToastSymbol as h } from "./composables/useToast/types.js";
+import { useDismissibleLayerStack as d } from "./composables/useDismissibleLayerStack/index.js";
+import { createToastInstance as u } from "./composables/useToast/index.js";
+import { defaultLightColorScheme as r, defaultDarkColorScheme as p } from "./templates/theme.js";
+import { ref as l, watch as S } from "vue";
+import { createThemeInstance as L, generateRootStyle as T } from "./utils/theme.js";
+function N(m = {}) {
   return { install: (t) => {
     const s = m.components || {};
-    for (const n in s)
-      t.component(n, s[n]);
+    for (const a in s)
+      t.component(a, s[a]);
     const e = m.defaults || {};
-    t.provide(i, r(e)), S(t, m.themes);
-    const l = f();
-    t.provide(h, l);
+    t.provide(i, l(e)), y(t, m.themes);
+    const n = d();
+    t.provide(f, n), b(t);
   } };
 }
-function S(m, o) {
+function y(m, o) {
   const t = [];
   let s;
   if (!o)
     s = "default", t.push({
       name: s,
       mode: "light",
-      scheme: a
+      scheme: r
     });
   else
     for (const e of o.themes) {
-      const n = { ...e.mode === "light" ? a : d, ...e.colors };
+      const a = { ...e.mode === "light" ? r : p, ...e.colors };
       t.push({
         name: e.name,
         mode: e.mode,
-        scheme: n
+        scheme: a
       }), e.name === o.defaultTheme && (s = e.name);
     }
   if (s) {
-    const e = r(s), l = p(e, t);
-    L(t), u(l.name, y, { immediate: !0 }), m.provide(c, l);
+    const e = l(s), n = L(e, t);
+    T(t), S(n.name, C, { immediate: !0 }), m.provide(c, n);
   }
 }
-function y(m) {
+function b(m) {
+  const o = u();
+  m.provide(h, o);
+}
+function C(m) {
   const o = document.documentElement, s = Array.from(o.classList).filter((e) => !e.startsWith("q-theme"));
   o.className = s.join(" "), o.classList.add(`q-theme--${m}`);
 }
 export {
-  q as createFramework
+  N as createFramework
 };

package/esm/index.d.ts

@@ -59,6 +59,8 @@ declare module '@vue/runtime-core' {
 		QTextArea: typeof import('@quidgest/ui/components')['QTextArea']
 		QTextField: typeof import('@quidgest/ui/components')['QTextField']
 		QThemeProvider: typeof import('@quidgest/ui/components')['QThemeProvider']
+		QToast: typeof import('@quidgest/ui/components')['QToast']
+		QToaster: typeof import('@quidgest/ui/components')['QToaster']
 		QToggle: typeof import('@quidgest/ui/components')['QToggle']
 		QToggleGroup: typeof import('@quidgest/ui/components')['QToggleGroup']
 		QToggleGroupItem: typeof import('@quidgest/ui/components')['QToggleGroupItem']

package/esm/index.js

@@ -1,14 +1,16 @@
-import * as m from "./templates/index.js";
+import * as t from "./templates/index.js";
 import * as r from "./components/index.js";
 import { createFramework as o } from "./framework.js";
 import { provideTheme as n, useTheme as i } from "./composables/theme.js";
-import { useDialog as x } from "./composables/useDialog/index.js";
+import { useDialog as c } from "./composables/useDialog/index.js";
+import { useToast as u } from "./composables/useToast/index.js";
 const a = (e = {}) => o({ components: r, ...e });
 export {
   r as components,
   a as createFramework,
   n as provideTheme,
-  m as templates,
-  x as useDialog,
-  i as useTheme
+  t as templates,
+  c as useDialog,
+  i as useTheme,
+  u as useToast
 };

package/esm/utils/color.js

@@ -1,7 +1,7 @@
-function h(t, r = !1) {
+function d(t, r = !1) {
   return r ? /^#[a-fA-F0-9]{6}$/.test(t) : /^#([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/.test(t);
 }
-function d(t) {
+function g(t) {
   const r = t.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
   if (r) {
     const n = parseInt(r[1], 10), s = parseInt(r[2], 10), e = parseInt(r[3], 10);
@@ -9,36 +9,40 @@ function d(t) {
   }
 }
 function b(t) {
-  if (h(t)) {
+  if (d(t)) {
     t.length === 4 && (t = "#" + t[1] + t[1] + t[2] + t[2] + t[3] + t[3]);
     const r = parseInt(t.slice(1, 3), 16), n = parseInt(t.slice(3, 5), 16), s = parseInt(t.slice(5, 7), 16);
     return { r, g: n, b: s };
   } else {
-    const r = d(t);
+    const r = g(t);
     if (r) return r;
   }
   throw new Error("Invalid color format");
 }
 function $(t, r) {
-  const n = g(t), s = r / 100;
+  const n = h(t), s = r / 100;
+  return n.l = n.l + s * (100 - n.l), l(n);
+}
+function p(t, r) {
+  const n = h(t), s = r / 100;
   return n.l = n.l - s * n.l, l(n);
 }
-function p(t) {
+function M(t) {
   const r = t.r.toString(16).padStart(2, "0"), n = t.g.toString(16).padStart(2, "0"), s = t.b.toString(16).padStart(2, "0");
   return `#${r}${n}${s}`;
 }
-function M(t) {
+function m(t) {
   return `${t.r} ${t.g} ${t.b}`;
 }
-function g(t) {
+function h(t) {
   const r = t.r / 255, n = t.g / 255, s = t.b / 255, e = Math.max(r, n, s), o = Math.min(r, n, s);
-  let a = 0, i;
-  const c = (e + o) / 2;
+  let a = 0, c;
+  const i = (e + o) / 2;
   if (e === o)
-    a = i = 0;
+    a = c = 0;
   else {
     const u = e - o;
-    switch (i = c > 0.5 ? u / (2 - e - o) : u / (e + o), e) {
+    switch (c = i > 0.5 ? u / (2 - e - o) : u / (e + o), e) {
       case r:
         a = (n - s) / u + (n < s ? 6 : 0);
         break;
@@ -53,8 +57,8 @@ function g(t) {
   }
   return {
     h: Math.round(a * 360),
-    s: Math.round(i * 100),
-    l: Math.round(c * 100)
+    s: Math.round(c * 100),
+    l: Math.round(i * 100)
   };
 }
 function l(t) {
@@ -63,8 +67,8 @@ function l(t) {
   if (n === 0)
     e = o = a = s;
   else {
-    const i = s < 0.5 ? s * (1 + n) : s + n - s * n, c = 2 * s - i;
-    e = f(c, i, r + 1 / 3), o = f(c, i, r), a = f(c, i, r - 1 / 3);
+    const c = s < 0.5 ? s * (1 + n) : s + n - s * n, i = 2 * s - c;
+    e = f(i, c, r + 1 / 3), o = f(i, c, r), a = f(i, c, r - 1 / 3);
   }
   return {
     r: Math.round(e * 255),
@@ -75,18 +79,19 @@ function l(t) {
 function f(t, r, n) {
   return n < 0 && (n += 1), n > 1 && (n -= 1), n < 1 / 6 ? t + (r - t) * 6 * n : n < 1 / 2 ? r : n < 2 / 3 ? t + (r - t) * (2 / 3 - n) * 6 : t;
 }
-function m(t) {
+function I(t) {
   return t > 50 ? "#000" : "#fff";
 }
 export {
-  p as colorToHex,
-  $ as darken,
-  m as getContrastingColor,
+  M as colorToHex,
+  p as darken,
+  I as getContrastingColor,
   l as hslToRgb,
   f as hueToRgb,
-  h as isValidHex,
+  d as isValidHex,
+  $ as lighten,
   b as parseColor,
-  g as rgbToHsl,
-  M as rgbToVariableString,
-  d as tryParseRgb
+  h as rgbToHsl,
+  m as rgbToVariableString,
+  g as tryParseRgb
 };

package/package.json

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