@quidgest/ui 0.16.13 → 0.16.15

package/esm/components/QDialog/QDialog.vue.js

@@ -1,61 +1,77 @@
-import { defineComponent as z, mergeModels as v, useModel as M, computed as k, createBlock as d, openBlock as l, unref as a, normalizeClass as h, withCtx as f, createElementVNode as c, createElementBlock as s, createCommentVNode as i, renderSlot as r, toDisplayString as g, createVNode as b, normalizeProps as B, guardReactiveProps as q, Fragment as U, renderList as A, mergeProps as C } from "vue";
-import { DEFAULT_ICONS as F, DEFAULT_BUTTONS as O, DEFAULT_ICON as Q } from "./types.js";
-import { QButton as V } from "../QButton/index.js";
-import { QIcon as m } from "../QIcon/index.js";
-import { QOverlay as S } from "../QOverlay/index.js";
-const I = {
+import { defineComponent as Q, mergeModels as g, useModel as A, ref as V, computed as b, createBlock as c, openBlock as l, unref as a, normalizeClass as B, withCtx as p, createElementVNode as $, createElementBlock as i, createCommentVNode as s, renderSlot as r, toDisplayString as v, createVNode as _, normalizeProps as q, guardReactiveProps as C, createTextVNode as O, Fragment as S, renderList as I, mergeProps as T } from "vue";
+import { DEFAULT_ICONS as P, DEFAULT_BUTTONS as H, DEFAULT_ICON as w } from "./types.js";
+import { QButton as L } from "../QButton/index.js";
+import { QIcon as f } from "../QIcon/index.js";
+import { QOverlay as x } from "../QOverlay/index.js";
+import { QTextField as R } from "../QTextField/index.js";
+const j = {
   key: 0,
   class: "q-dialog__header"
-}, P = { class: "q-dialog__header-title" }, H = {
+}, G = {
+  key: 0,
+  class: "q-dialog__header-title"
+}, J = {
   key: 1,
   class: "q-dialog__body"
-}, w = {
+}, K = {
   key: 0,
   class: "q-dialog__body-icon"
-}, x = { class: "q-dialog__body-text" }, R = ["innerHTML"], j = { key: 1 }, G = {
+}, W = { class: "q-dialog__body-text" }, X = ["innerHTML"], Y = { key: 1 }, Z = {
+  key: 0,
+  class: "q-dialog__input"
+}, ee = {
   key: 2,
   class: "q-dialog__footer"
-}, J = { class: "q-dialog__footer-buttons" }, ee = /* @__PURE__ */ z({
+}, oe = {
+  key: 0,
+  class: "q-dialog__footer-buttons"
+}, re = /* @__PURE__ */ Q({
   __name: "QDialog",
-  props: /* @__PURE__ */ v({
+  props: /* @__PURE__ */ g({
     id: {},
     class: {},
     title: {},
     text: {},
-    icon: { default: () => Q },
-    buttons: { default: () => O },
+    icon: { default: () => w },
+    buttons: { default: () => H },
     attach: { default: "body" },
     inline: { type: Boolean },
     backdropBlur: { type: Boolean, default: !0 },
     dismissible: { type: Boolean },
     html: { type: Boolean, default: !0 },
-    icons: { default: () => F },
+    icons: { default: () => P },
     size: { default: "small" },
-    centerVertically: { type: Boolean }
+    centerVertically: { type: Boolean },
+    input: {}
   }, {
     modelValue: { type: Boolean },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ v(["enter", "leave"], ["update:modelValue"]),
-  setup(_, { emit: $ }) {
-    const e = _, p = $, u = M(_, "modelValue"), L = k(() => ["q-dialog", e.class]), T = k(() => `q-overlay--${e.size}`);
-    function y() {
-      u.value = !1;
+  emits: /* @__PURE__ */ g(["enter", "leave"], ["update:modelValue"]),
+  setup(y, { emit: N }) {
+    const e = y, k = N, m = A(y, "modelValue"), u = V(""), d = V(""), z = b(() => ["q-dialog", e.class]), D = b(() => `q-overlay--${e.size}`);
+    function h() {
+      m.value = !1;
     }
-    function D(o) {
-      var n;
-      (n = o.action) == null || n.call(o), y();
+    function E(o) {
+      var n, t;
+      if (o.action) {
+        if ((n = e.input) != null && n.validator && (d.value = e.input.validator(a(u)), a(d)))
+          return;
+        (t = o.action) == null || t.call(o, a(u));
+      }
+      h();
     }
-    function E() {
-      p("enter");
+    function M() {
+      k("enter");
     }
-    function N() {
-      p("leave");
+    function U() {
+      k("leave");
     }
-    return (o, n) => (l(), d(a(S), {
+    return (o, n) => (l(), c(a(x), {
       id: e.id,
-      modelValue: u.value,
-      "onUpdate:modelValue": n[0] || (n[0] = (t) => u.value = t),
+      modelValue: m.value,
+      "onUpdate:modelValue": n[1] || (n[1] = (t) => m.value = t),
       "backdrop-class": "q-dialog__underlay",
       "scroll-lock": "",
       persistent: "",
@@ -63,97 +79,124 @@ const I = {
       attach: e.attach,
       "backdrop-blur": e.backdropBlur,
       "center-vertically": e.centerVertically,
-      class: h(T.value),
-      onEnter: E,
-      onLeave: N
+      class: B(D.value),
+      onEnter: M,
+      onLeave: U
     }, {
-      default: f(() => [
-        c(
+      default: p(() => [
+        $(
           "div",
           {
-            class: h(L.value)
+            class: B(z.value)
           },
           [
-            e.title || o.$slots.header ? (l(), s("div", I, [
+            e.title || o.$slots.header || o.$slots["header.prepend"] || o.$slots["header.append"] ? (l(), i("div", j, [
               r(o.$slots, "header", {}, () => [
-                c(
+                r(o.$slots, "header.prepend"),
+                e.title ? (l(), i(
                   "span",
-                  P,
-                  g(e.title),
+                  G,
+                  v(e.title),
                   1
                   /* TEXT */
-                )
+                )) : s("v-if", !0),
+                r(o.$slots, "header.append")
               ])
-            ])) : i("v-if", !0),
-            e.icon || e.text || o.$slots.body ? (l(), s("div", H, [
-              r(o.$slots, "body", {}, () => [
-                r(o.$slots, "body.icon", {}, () => [
-                  e.icon ? (l(), s("span", w, [
-                    b(
-                      a(m),
-                      B(q(e.icon)),
-                      null,
-                      16
-                      /* FULL_PROPS */
-                    )
-                  ])) : i("v-if", !0)
-                ]),
-                c("div", x, [
-                  e.html ? (l(), s("div", {
-                    key: 0,
-                    innerHTML: e.text
-                  }, null, 8, R)) : (l(), s(
-                    "div",
-                    j,
-                    g(e.text),
-                    1
-                    /* TEXT */
-                  ))
-                ]),
-                r(o.$slots, "body.append")
-              ])
-            ])) : i("v-if", !0),
-            e.buttons || o.$slots.footer ? (l(), s("div", G, [
-              r(o.$slots, "footer", {}, () => [
-                c("span", J, [
-                  (l(!0), s(
-                    U,
-                    null,
-                    A(e.buttons, (t) => (l(), d(a(V), C({ ref_for: !0 }, t.props, {
-                      key: t.id,
-                      onClick: () => D(t)
-                    }), {
-                      default: f(() => [
-                        t.icon ? (l(), d(
-                          a(m),
-                          C({
-                            key: 0,
-                            ref_for: !0
-                          }, t.icon),
-                          null,
-                          16
-                          /* FULL_PROPS */
-                        )) : i("v-if", !0)
+            ])) : s("v-if", !0),
+            e.icon || e.text || o.$slots.body ? (l(), i("div", J, [
+              r(o.$slots, "body", {}, () => {
+                var t;
+                return [
+                  r(o.$slots, "body.icon", {}, () => [
+                    e.icon ? (l(), i("span", K, [
+                      _(
+                        a(f),
+                        q(C(e.icon)),
+                        null,
+                        16
+                        /* FULL_PROPS */
+                      )
+                    ])) : s("v-if", !0)
+                  ]),
+                  $("div", W, [
+                    e.html ? (l(), i("div", {
+                      key: 0,
+                      innerHTML: e.text
+                    }, null, 8, X)) : (l(), i(
+                      "div",
+                      Y,
+                      v(e.text),
+                      1
+                      /* TEXT */
+                    ))
+                  ]),
+                  e.input ? (l(), i("div", Z, [
+                    _(a(R), {
+                      modelValue: u.value,
+                      "onUpdate:modelValue": n[0] || (n[0] = (F) => u.value = F),
+                      invalid: !!d.value,
+                      placeholder: (t = e.input) == null ? void 0 : t.placeholder,
+                      size: "block"
+                    }, {
+                      extras: p(() => [
+                        d.value ? (l(), c(a(f), {
+                          key: 0,
+                          icon: "exclamation-sign"
+                        })) : s("v-if", !0),
+                        O(
+                          " " + v(d.value),
+                          1
+                          /* TEXT */
+                        )
                       ]),
-                      _: 2
-                      /* DYNAMIC */
-                    }, 1040, ["onClick"]))),
-                    128
-                    /* KEYED_FRAGMENT */
-                  ))
-                ])
-              ])
-            ])) : i("v-if", !0),
-            e.dismissible ? (l(), d(a(V), {
+                      _: 1
+                      /* STABLE */
+                    }, 8, ["modelValue", "invalid", "placeholder"])
+                  ])) : s("v-if", !0),
+                  r(o.$slots, "body.append")
+                ];
+              })
+            ])) : s("v-if", !0),
+            e.buttons || o.$slots["footer.append"] ? (l(), i("div", ee, [
+              e.buttons ? (l(), i("span", oe, [
+                (l(!0), i(
+                  S,
+                  null,
+                  I(e.buttons, (t) => (l(), c(a(L), T({ ref_for: !0 }, t.props, {
+                    key: t.id,
+                    onClick: () => E(t)
+                  }), {
+                    default: p(() => [
+                      t.icon ? (l(), c(
+                        a(f),
+                        T({
+                          key: 0,
+                          ref_for: !0
+                        }, t.icon),
+                        null,
+                        16
+                        /* FULL_PROPS */
+                      )) : s("v-if", !0)
+                    ]),
+                    _: 2
+                    /* DYNAMIC */
+                  }, 1040, ["onClick"]))),
+                  128
+                  /* KEYED_FRAGMENT */
+                ))
+              ])) : s("v-if", !0),
+              r(o.$slots, "footer.append")
+            ])) : s("v-if", !0),
+            e.dismissible ? (l(), c(a(L), {
               key: 3,
               class: "q-dialog__close",
               variant: "text",
-              onClick: y
+              onClick: h
             }, {
-              default: f(() => [
-                b(
-                  a(m),
-                  B(q(e.icons.close)),
+              default: p(() => [
+                _(
+                  a(f),
+                  q(C(e.icons.close)),
                   null,
                   16
                   /* FULL_PROPS */
@@ -161,7 +204,7 @@ const I = {
               ]),
               _: 1
               /* STABLE */
-            })) : i("v-if", !0)
+            })) : s("v-if", !0)
           ],
           2
           /* CLASS */
@@ -173,5 +216,5 @@ const I = {
   }
 });
 export {
-  ee as default
+  re as default
 };

package/esm/components/QDialog/QDialogProvider.d.ts

@@ -1,3 +1,8 @@
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+import { QDialogProviderProps } from './types';
+declare const _default: import('vue').DefineComponent<QDialogProviderProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    leave: (id: string) => any;
+}, string, import('vue').PublicProps, Readonly<QDialogProviderProps> & Readonly<{
+    onLeave?: ((id: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;
 //# sourceMappingURL=QDialogProvider.vue.d.ts.map

package/esm/components/QDialog/QDialogProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QDialogProvider.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QDialog/QDialogProvider.vue"],"names":[],"mappings":"AASA;;AA+FA,wBAKG"}
+{"version":3,"file":"QDialogProvider.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QDialog/QDialogProvider.vue"],"names":[],"mappings":"AAUA;AA+CC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;;;;;;AAmFpD,wBAOG"}

package/esm/components/QDialog/QDialogProvider.vue.js

@@ -1,26 +1,34 @@
-import { defineComponent as a, createElementBlock as l, openBlock as o, Fragment as i, renderList as m, unref as r, createBlock as s, mergeProps as p } from "vue";
-import { QDialog as u } from "./index.js";
-import { useDialog as c } from "../../composables/useDialog/index.js";
-const D = /* @__PURE__ */ a({
+import { defineComponent as c, createElementBlock as u, openBlock as o, Fragment as f, renderList as v, unref as r, createBlock as _, mergeProps as d } from "vue";
+import { QDialog as g } from "./index.js";
+import { useDialog as k } from "../../composables/useDialog/index.js";
+const x = /* @__PURE__ */ c({
   inheritAttrs: !1,
   __name: "QDialogProvider",
-  setup(f) {
-    const { dialogs: t, removeDialog: n } = c();
-    return (_, d) => (o(!0), l(
-      i,
+  props: {
+    inline: { type: Boolean }
+  },
+  emits: ["leave"],
+  setup(t, { emit: i }) {
+    const l = t, a = i, { dialogs: m, removeDialog: s } = k();
+    function p(e) {
+      s(e), a("leave", e);
+    }
+    return (e, B) => (o(!0), u(
+      f,
       null,
-      m(r(t), (e) => (o(), s(r(u), p({
-        key: e.id,
+      v(r(m), (n) => (o(), _(r(g), d({
+        key: n.id,
         ref_for: !0
-      }, e.props, {
+      }, n.props, {
         "model-value": "",
-        onLeave: () => r(n)(e.id)
-      }), null, 16, ["onLeave"]))),
+        inline: l.inline,
+        onLeave: () => p(n.id)
+      }), null, 16, ["inline", "onLeave"]))),
       128
       /* KEYED_FRAGMENT */
     ));
   }
 });
 export {
-  D as default
+  x as default
 };

package/esm/components/QDialog/index.d.ts

@@ -15,6 +15,7 @@ declare const QDialog: {
         icons?: typeof import('./types').DEFAULT_ICONS;
         size?: import('./types').QDialogSize;
         centerVertically?: boolean;
+        input?: import('./types').QDialogInputOption;
     }> & Readonly<{
         "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
         onEnter?: (() => any) | undefined;
@@ -54,6 +55,7 @@ declare const QDialog: {
         icons?: typeof import('./types').DEFAULT_ICONS;
         size?: import('./types').QDialogSize;
         centerVertically?: boolean;
+        input?: import('./types').QDialogInputOption;
     }> & Readonly<{
         "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
         onEnter?: (() => any) | undefined;
@@ -85,6 +87,7 @@ declare const QDialog: {
     icons?: typeof import('./types').DEFAULT_ICONS;
     size?: import('./types').QDialogSize;
     centerVertically?: boolean;
+    input?: import('./types').QDialogInputOption;
 }> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     onEnter?: (() => any) | undefined;
@@ -105,13 +108,19 @@ declare const QDialog: {
 }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
     $slots: {
         header?(_: {}): any;
+        'header.prepend'?(_: {}): any;
+        'header.append'?(_: {}): any;
         body?(_: {}): any;
         'body.icon'?(_: {}): any;
         'body.append'?(_: {}): any;
-        footer?(_: {}): any;
+        'footer.append'?(_: {}): any;
     };
 });
-declare const QDialogProvider: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const QDialogProvider: import('vue').DefineComponent<import('./types').QDialogProviderProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    leave: (id: string) => any;
+}, string, import('vue').PublicProps, Readonly<import('./types').QDialogProviderProps> & Readonly<{
+    onLeave?: ((id: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export { QDialog, QDialogProvider };
 export type { DialogButton };
 //# sourceMappingURL=index.d.ts.map

package/esm/components/QDialog/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QDialog/index.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAK3C,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA4B,CAAA;AACzC,QAAA,MAAM,eAAe,+QAAoC,CAAA;AAGzD,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,CAAA;AAGnC,YAAY,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QDialog/index.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAK3C,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA4B,CAAA;AACzC,QAAA,MAAM,eAAe;;;;kFAAoC,CAAA;AAGzD,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,CAAA;AAGnC,YAAY,EAAE,YAAY,EAAE,CAAA"}

package/esm/components/QDialog/types.d.ts

@@ -53,6 +53,10 @@ export type QDialogProps = QBaseComponentProps & {
      * Whether to vertically align the dialog to the center (true) or top (false)
      */
     centerVertically?: boolean;
+    /**
+     * The input control configuration.
+     */
+    input?: QDialogInputOption;
 };
 export type DialogButton = {
     /**
@@ -67,13 +71,39 @@ export type DialogButton = {
      * The action that the button performs when clicked.
      */
     action?: {
-        (): void;
+        (value?: string): void;
     };
     /**
      * The generic button props.
      */
     props: QButtonProps;
 };
+export type QDialogOptions = {
+    /**
+     * Options for input control to add.
+     */
+    input?: QDialogInputOption;
+};
+export type QDialogInputOption = {
+    /**
+     * Control type.
+     */
+    type: string;
+    /**
+     * Control placeholder text.
+     */
+    placeholder?: string;
+    /**
+     * Function to validate value entered.
+     */
+    validator?: (value: string) => string | undefined;
+};
+export type QDialogProviderProps = {
+    /**
+     * Whether to inline the dialogs
+     */
+    inline?: boolean;
+};
 export declare const DEFAULT_BUTTONS: Array<DialogButton>;
 export declare const DEFAULT_ICON: Icon;
 export declare const DEFAULT_ICONS: {

package/esm/components/QDialog/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QDialog/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAC9C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AACpC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AAEhE,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAA;AAEjE,MAAM,MAAM,YAAY,GAAG,mBAAmB,GAAG;IAChD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAA;IAEX;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,EAAE,CAAA;IAExB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IAEf;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAA;IAEtB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IAErB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAA;IAEd;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,aAAa,CAAA;IAE5B;;OAEG;IACH,IAAI,CAAC,EAAE,WAAW,CAAA;IAElB;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,MAAM,MAAM,YAAY,GAAG;IAC1B;;OAEG;IACH,EAAE,EAAE,MAAM,CAAA;IAEV;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAA;IAEX;;OAEG;IACH,MAAM,CAAC,EAAE;QAAE,IAAI,IAAI,CAAA;KAAE,CAAA;IAErB;;OAEG;IACH,KAAK,EAAE,YAAY,CAAA;CACnB,CAAA;AAGD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,YAAY,CAW/C,CAAA;AAGD,eAAO,MAAM,YAAY,EAAE,IAE1B,CAAA;AAGD,eAAO,MAAM,aAAa;;;;CAIM,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QDialog/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAC9C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AACpC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AAEhE,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAA;AAEjE,MAAM,MAAM,YAAY,GAAG,mBAAmB,GAAG;IAChD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAA;IAEX;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,EAAE,CAAA;IAExB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IAEf;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAA;IAEtB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IAErB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAA;IAEd;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,aAAa,CAAA;IAE5B;;OAEG;IACH,IAAI,CAAC,EAAE,WAAW,CAAA;IAElB;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAE1B;;OAEG;IACH,KAAK,CAAC,EAAE,kBAAkB,CAAA;CAC1B,CAAA;AAED,MAAM,MAAM,YAAY,GAAG;IAC1B;;OAEG;IACH,EAAE,EAAE,MAAM,CAAA;IAEV;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAA;IAEX;;OAEG;IACH,MAAM,CAAC,EAAE;QAAE,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;KAAE,CAAA;IAEnC;;OAEG;IACH,KAAK,EAAE,YAAY,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IAC5B;;OAEG;IACH,KAAK,CAAC,EAAE,kBAAkB,CAAA;CAC1B,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG;IAChC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IAEZ;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;CACjD,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG;IAClC;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAGD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,YAAY,CAW/C,CAAA;AAGD,eAAO,MAAM,YAAY,EAAE,IAE1B,CAAA;AAGD,eAAO,MAAM,aAAa;;;;CAIM,CAAA"}

package/esm/components/QSidebar/QSidebarPanel.d.ts

@@ -9,7 +9,7 @@ declare function __VLS_template(): {
         footer?(_: {}): any;
     };
     refs: {
-        panelRef: HTMLDivElement;
+        panel: HTMLDivElement;
     };
     rootEl: HTMLDivElement;
 };
@@ -29,7 +29,7 @@ declare const __VLS_component: import('vue').DefineComponent<QSidebarPanelProps,
     maxWidth: import('./types').QSidebarPanelSize;
     resizePosition: "left" | "right";
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
-    panelRef: HTMLDivElement;
+    panel: HTMLDivElement;
 }, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/esm/components/QSidebar/QSidebarPanel.vue.js

@@ -1,14 +1,17 @@
-import { defineComponent as y, useTemplateRef as q, ref as k, onUnmounted as R, createElementBlock as s, openBlock as i, createElementVNode as h, createCommentVNode as o, renderSlot as n, toDisplayString as W, normalizeClass as $ } from "vue";
-const g = { class: "q-sidebar-panel__header" }, E = {
+import { defineComponent as y, useTemplateRef as q, ref as W, onUnmounted as $, createElementBlock as s, openBlock as i, createElementVNode as h, createCommentVNode as o, renderSlot as n, toDisplayString as g, normalizeClass as k } from "vue";
+const E = {
+  ref: "panel",
+  class: "q-sidebar-panel"
+}, R = { class: "q-sidebar-panel__header" }, S = {
   key: 0,
   class: "q-sidebar-panel__title"
-}, S = { class: "q-sidebar-panel__content" }, w = {
+}, w = { class: "q-sidebar-panel__content" }, B = {
   key: 0,
   class: "q-sidebar-panel__footer"
-}, B = {
+}, L = {
   key: 0,
   class: "q-sidebar-panel__grip"
-}, P = /* @__PURE__ */ y({
+}, X = /* @__PURE__ */ y({
   __name: "QSidebarPanel",
   props: {
     title: {},
@@ -22,59 +25,55 @@ const g = { class: "q-sidebar-panel__header" }, E = {
   },
   emits: ["resize", "resize:start", "resize:end"],
   setup(v, { emit: _ }) {
-    const t = v, r = _, a = q("panelRef"), l = k(!1);
-    let d = 0, u = 0;
+    const t = v, r = _, d = q("panel"), a = W(!1);
+    let l = 0, u = 0;
     function z(e) {
-      t.resizable && (l.value = !0, d = e.clientX, u = a.value.clientWidth, document.addEventListener("mousemove", c), document.addEventListener("mouseup", p), document.body.style.userSelect = "none", r("resize:start"));
+      t.resizable && (a.value = !0, l = e.clientX, u = d.value.clientWidth, document.addEventListener("mousemove", c), document.addEventListener("mouseup", p), document.body.style.userSelect = "none", r("resize:start"));
     }
     function c(e) {
-      if (!t.resizable || !l.value) return;
-      const f = t.resizePosition === "right" ? e.clientX - d : d - e.clientX, b = u + f;
+      if (!t.resizable || !a.value) return;
+      const f = t.resizePosition === "right" ? e.clientX - l : l - e.clientX, b = u + f;
       r("resize", b);
     }
     function p() {
-      t.resizable && (l.value = !1, r("resize:end", a.value.clientWidth), m());
+      t.resizable && (a.value = !1, r("resize:end", d.value.clientWidth), m());
     }
     function m() {
       t.resizable && (document.removeEventListener("mousemove", c), document.removeEventListener("mouseup", p), document.body.style.userSelect = "");
     }
-    return R(m), (e, f) => (i(), s(
+    return $(m), (e, f) => (i(), s(
       "div",
-      {
-        ref_key: "panelRef",
-        ref: a,
-        class: "q-sidebar-panel"
-      },
+      E,
       [
-        h("div", g, [
+        h("div", R, [
           n(e.$slots, "header", {}, () => [
             n(e.$slots, "header.prepend"),
             t.title ? (i(), s(
               "h3",
-              E,
-              W(t.title),
+              S,
+              g(t.title),
               1
               /* TEXT */
             )) : o("v-if", !0),
             n(e.$slots, "header.append")
           ])
         ]),
-        h("div", S, [
+        h("div", w, [
           n(e.$slots, "content")
         ]),
-        e.$slots.footer ? (i(), s("div", w, [
+        e.$slots.footer ? (i(), s("div", B, [
           n(e.$slots, "footer")
         ])) : o("v-if", !0),
         e.resizable ? (i(), s(
           "div",
           {
             key: 1,
-            class: $(["q-sidebar-panel__handle", `q-sidebar-panel__handle--${e.resizePosition}`]),
+            class: k(["q-sidebar-panel__handle", `q-sidebar-panel__handle--${e.resizePosition}`]),
             "data-testid": "q-sidebar-panel-handle",
             onMousedown: z
           },
           [
-            e.showGrip ? (i(), s("div", B)) : o("v-if", !0)
+            e.showGrip ? (i(), s("div", L)) : o("v-if", !0)
           ],
           34
           /* CLASS, NEED_HYDRATION */
@@ -86,5 +85,5 @@ const g = { class: "q-sidebar-panel__header" }, E = {
   }
 });
 export {
-  P as default
+  X as default
 };