@quidgest/ui 0.15.4 → 0.15.7

package/esm/components/QTextArea/QTextArea.vue.js

@@ -1,8 +1,8 @@
-import { defineComponent as b, mergeModels as h, useModel as z, computed as o, ref as g, createBlock as x, openBlock as w, unref as s, normalizeClass as q, createSlots as $, withCtx as a, withDirectives as v, createElementVNode as B, mergeProps as k, toHandlers as M, vModelText as V, renderSlot as r } from "vue";
-import { QField as L } from "../QField/index.js";
-import { useId as A } from "../../composables/uid.js";
-import { useTextareaAutosize as C } from "../../vendors/@vueuse/core/index.js";
-const H = ["id", "required", "placeholder", "readonly", "disabled", "maxlength", "rows", "cols", "resize", "wrap"], Q = /* @__PURE__ */ b({
+import { defineComponent as b, mergeModels as h, useModel as z, computed as t, watch as x, ref as g, createBlock as w, openBlock as q, unref as n, normalizeClass as $, createSlots as v, withCtx as a, withDirectives as B, createElementVNode as k, mergeProps as M, toHandlers as V, vModelText as A, renderSlot as o } from "vue";
+import { QField as C } from "../QField/index.js";
+import { useId as H } from "../../composables/uid.js";
+import { useTextareaAutosize as L } from "../../vendors/@vueuse/core/index.js";
+const R = ["id", "required", "placeholder", "readonly", "disabled", "maxlength", "rows", "cols", "resize", "wrap"], S = /* @__PURE__ */ b({
   inheritAttrs: !1,
   __name: "QTextArea",
   props: /* @__PURE__ */ h({
@@ -27,39 +27,42 @@ const H = ["id", "required", "placeholder", "readonly", "disabled", "maxlength",
     modelModifiers: {}
   }),
   emits: ["update:modelValue"],
-  setup(t) {
-    const e = t, d = z(t, "modelValue"), n = A(e.id), m = o(
-      () => e.readonly || e.disabled ? void 0 : e.placeholder
-    ), f = o(() => ({ input: e.autosize ? c : null })), i = g(), { triggerResize: c } = C({
-      element: o(() => e.autosize ? i.value : void 0),
-      styleProp: "minHeight"
-    }), p = o({
-      get: () => d.value,
+  setup(i) {
+    const e = i, s = z(i, "modelValue"), d = t({
+      get: () => s.value,
       set: (l) => {
-        d.value = e.maxLength ? l == null ? void 0 : l.slice(0, e.maxLength) : l;
+        const r = e.maxLength;
+        s.value = r ? l == null ? void 0 : l.slice(0, r) : l;
       }
     });
-    return (l, u) => (w(), x(s(L), {
-      class: q(["q-text-area", e.class]),
-      for: s(n),
+    x(s, (l) => d.value = l, { immediate: !0 });
+    const p = H(e.id), m = t(
+      () => e.readonly || e.disabled ? void 0 : e.placeholder
+    ), f = t(() => ({ input: e.autosize ? c : null })), u = g(), { triggerResize: c } = L({
+      element: t(() => e.autosize ? u.value : void 0),
+      styleProp: "minHeight"
+    });
+    return (l, r) => (q(), w(n(C), {
+      class: $(["q-text-area", e.class]),
+      for: n(p),
       label: e.label,
       size: e.size,
       readonly: e.readonly,
       disabled: e.disabled,
       required: e.required
-    }, $({
+    }, v({
       "label.prepend": a(() => [
-        r(l.$slots, "label.prepend")
+        o(l.$slots, "label.prepend")
       ]),
       "label.append": a(() => [
-        r(l.$slots, "label.append")
+        o(l.$slots, "label.append")
       ]),
       default: a(() => [
-        v(B("textarea", k({
-          id: s(n),
+        B(k("textarea", M({
+          id: n(p),
           ref_key: "textareaRef",
-          ref: i,
-          "onUpdate:modelValue": u[0] || (u[0] = (y) => p.value = y),
+          ref: u,
+          "onUpdate:modelValue": r[0] || (r[0] = (y) => d.value = y),
           class: "q-text-area__input",
           required: e.required,
           placeholder: m.value,
@@ -70,8 +73,8 @@ const H = ["id", "required", "placeholder", "readonly", "disabled", "maxlength",
           cols: e.cols,
           resize: e.resize,
           wrap: e.wrap
-        }, l.$attrs, M(f.value, !0)), null, 16, H), [
-          [V, p.value]
+        }, l.$attrs, V(f.value, !0)), null, 16, R), [
+          [A, d.value]
         ])
       ]),
       _: 2
@@ -80,21 +83,21 @@ const H = ["id", "required", "placeholder", "readonly", "disabled", "maxlength",
       l.$slots.prepend ? {
         name: "prepend",
         fn: a(() => [
-          r(l.$slots, "prepend")
+          o(l.$slots, "prepend")
         ]),
         key: "0"
       } : void 0,
       l.$slots.append ? {
         name: "append",
         fn: a(() => [
-          r(l.$slots, "append")
+          o(l.$slots, "append")
         ]),
         key: "1"
       } : void 0,
       l.$slots.extras ? {
         name: "extras",
         fn: a(() => [
-          r(l.$slots, "extras")
+          o(l.$slots, "extras")
         ]),
         key: "2"
       } : void 0
@@ -102,5 +105,5 @@ const H = ["id", "required", "placeholder", "readonly", "disabled", "maxlength",
   }
 });
 export {
-  Q as default
+  S as default
 };

package/esm/components/QTextField/QTextField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QTextField.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QTextField/QTextField.vue"],"names":[],"mappings":"AAmDA;AAmHC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAM9C,KAAK,WAAW,GAAG,eAAe,CAAC;AAwDpC,KAAK,iBAAiB,GAAG;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;CACnB,GAAG,WAAW,CAAC;AAKhB,iBAAS,cAAc;WAkIT,OAAO,IAA6B;;iCAjBb,GAAG;gCACJ,GAAG;yBACV,GAAG;wBACH,GAAG;wBACH,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCAqEole,GAAG,8CAA8C,GAAG,yBAAyB,GAAG,6DAAmC,GAAG;;;;;;;;;;;;;;;;;;;EAnDzue;AAmBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oCA+B+le,GAAG,8CAA8C,GAAG,yBAAyB,GAAG,6DAAmC,GAAG;;;;;;;;;;;;;;;;;OArBxue,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"QTextField.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QTextField/QTextField.vue"],"names":[],"mappings":"AAoDA;AAgIC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAM9C,KAAK,WAAW,GAAG,eAAe,CAAC;AAoEpC,KAAK,iBAAiB,GAAG;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;CACnB,GAAG,WAAW,CAAC;AAKhB,iBAAS,cAAc;WAmIT,OAAO,IAA6B;;iCAjBb,GAAG;gCACJ,GAAG;yBACV,GAAG;wBACH,GAAG;wBACH,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCAqEyrc,GAAG,8CAA8C,GAAG,yBAAyB,GAAG,6DAAmC,GAAG;;;;;;;;;;;;;;;;;;;EAnD90c;AAmBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oCA+Bosc,GAAG,8CAA8C,GAAG,yBAAyB,GAAG,6DAAmC,GAAG;;;;;;;;;;;;;;;;;OArB70c,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/esm/components/QTextField/QTextField.vue.js

@@ -1,11 +1,11 @@
-import { defineComponent as x, mergeModels as m, useModel as R, ref as y, computed as o, createBlock as b, openBlock as v, unref as r, normalizeClass as V, createSlots as z, withCtx as a, withDirectives as M, createElementVNode as w, mergeProps as Q, vModelDynamic as g, renderSlot as d, createCommentVNode as D } from "vue";
-import { QField as F } from "../QField/index.js";
-import { QClearButton as N } from "../__internal__/QClearButton/index.js";
-import { useId as S } from "../../composables/uid.js";
-const _ = ["id", "type", "required", "placeholder", "readonly", "disabled"], T = /* @__PURE__ */ x({
+import { defineComponent as C, mergeModels as y, useModel as R, computed as n, watch as V, ref as b, createBlock as h, openBlock as v, unref as r, normalizeClass as z, createSlots as M, withCtx as a, withDirectives as w, createElementVNode as L, mergeProps as Q, vModelDynamic as D, renderSlot as o, createCommentVNode as F } from "vue";
+import { QField as N } from "../QField/index.js";
+import { QClearButton as S } from "../__internal__/QClearButton/index.js";
+import { useId as _ } from "../../composables/uid.js";
+const A = ["id", "type", "maxlength", "required", "placeholder", "readonly", "disabled"], U = /* @__PURE__ */ C({
   inheritAttrs: !1,
   __name: "QTextField",
-  props: /* @__PURE__ */ m({
+  props: /* @__PURE__ */ y({
     id: {},
     class: {},
     label: {},
@@ -16,6 +16,7 @@ const _ = ["id", "type", "required", "placeholder", "readonly", "disabled"], T =
     disabled: { type: Boolean },
     invalid: { type: Boolean },
     placeholder: {},
+    maxLength: {},
     clearable: { type: Boolean },
     type: { default: "text" },
     texts: {}
@@ -23,52 +24,61 @@ const _ = ["id", "type", "required", "placeholder", "readonly", "disabled"], T =
     modelValue: {},
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ m(["click:clear"], ["update:modelValue"]),
-  setup(n, { expose: k, emit: q }) {
-    const e = n, h = q, t = R(n, "modelValue"), s = S(e.id), i = y(null), p = y(null), B = o(
+  emits: /* @__PURE__ */ y(["click:clear"], ["update:modelValue"]),
+  setup(i, { expose: x, emit: k }) {
+    const e = i, q = k, t = R(i, "modelValue"), s = n({
+      get: () => t.value,
+      set: (l) => {
+        const d = e.maxLength;
+        t.value = d ? l == null ? void 0 : l.slice(0, d) : l;
+      }
+    });
+    V(t, (l) => s.value = l, { immediate: !0 });
+    const p = _(e.id), u = b(null), f = b(null), g = n(
       () => e.readonly || e.disabled ? void 0 : e.placeholder
-    ), u = o(() => e.clearable && !e.readonly && !e.disabled), f = o(() => u.value && t.value);
-    function $(l) {
-      u.value && (t.value = "", h("click:clear", l));
+    ), m = n(() => e.clearable && !e.readonly && !e.disabled), c = n(() => m.value && t.value);
+    function B(l) {
+      m.value && (t.value = "", q("click:clear", l));
     }
-    return k({
-      fieldRef: o(() => {
+    return x({
+      fieldRef: n(() => {
         var l;
-        return (l = i.value) == null ? void 0 : l.fieldRef;
+        return (l = u.value) == null ? void 0 : l.fieldRef;
       }),
-      inputRef: p
-    }), (l, c) => (v(), b(r(F), {
+      inputRef: f
+    }), (l, d) => (v(), h(r(N), {
       ref_key: "fieldRef",
-      ref: i,
-      class: V(["q-text-field", e.class]),
-      for: r(s),
+      ref: u,
+      class: z(["q-text-field", e.class]),
+      for: r(p),
       label: e.label,
       size: e.size,
       readonly: e.readonly,
       disabled: e.disabled,
       required: e.required,
       invalid: e.invalid
-    }, z({
+    }, M({
       "label.prepend": a(() => [
-        d(l.$slots, "label.prepend")
+        o(l.$slots, "label.prepend")
       ]),
       "label.append": a(() => [
-        d(l.$slots, "label.append")
+        o(l.$slots, "label.append")
       ]),
       default: a(() => [
-        M(w("input", Q({
-          id: r(s),
+        w(L("input", Q({
+          id: r(p),
           ref_key: "inputRef",
-          ref: p,
-          "onUpdate:modelValue": c[0] || (c[0] = (C) => t.value = C),
+          ref: f,
+          "onUpdate:modelValue": d[0] || (d[0] = ($) => s.value = $),
           class: "q-text-field__input",
           type: e.type,
+          maxlength: e.maxLength,
           required: e.required,
-          placeholder: B.value,
+          placeholder: g.value,
           readonly: e.readonly,
           disabled: e.disabled
-        }, l.$attrs), null, 16, _), [
-          [g, t.value]
+        }, l.$attrs), null, 16, A), [
+          [D, s.value]
         ])
       ]),
       _: 2
@@ -77,27 +87,27 @@ const _ = ["id", "type", "required", "placeholder", "readonly", "disabled"], T =
       l.$slots.prepend ? {
         name: "prepend",
         fn: a(() => [
-          d(l.$slots, "prepend")
+          o(l.$slots, "prepend")
         ]),
         key: "0"
       } : void 0,
-      l.$slots.append || f.value ? {
+      l.$slots.append || c.value ? {
         name: "append",
         fn: a(() => [
-          d(l.$slots, "append"),
-          f.value ? (v(), b(r(N), {
+          o(l.$slots, "append"),
+          c.value ? (v(), h(r(S), {
             key: 0,
             "data-testid": "q-text-field__clear-button",
             texts: e.texts,
-            onClick: $
-          }, null, 8, ["texts"])) : D("v-if", !0)
+            onClick: B
+          }, null, 8, ["texts"])) : F("v-if", !0)
         ]),
         key: "1"
       } : void 0,
       l.$slots.extras ? {
         name: "extras",
         fn: a(() => [
-          d(l.$slots, "extras")
+          o(l.$slots, "extras")
         ]),
         key: "2"
       } : void 0
@@ -105,5 +115,5 @@ const _ = ["id", "type", "required", "placeholder", "readonly", "disabled"], T =
   }
 });
 export {
-  T as default
+  U as default
 };

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

@@ -14,6 +14,7 @@ declare const QTextField: {
         invalid?: boolean;
     } & {
         placeholder?: string;
+        maxLength?: number;
         clearable?: boolean;
         type?: string;
         texts?: typeof import('./types').DEFAULT_TEXTS;
@@ -121,6 +122,7 @@ declare const QTextField: {
         invalid?: boolean;
     } & {
         placeholder?: string;
+        maxLength?: number;
         clearable?: boolean;
         type?: string;
         texts?: typeof import('./types').DEFAULT_TEXTS;
@@ -150,6 +152,7 @@ declare const QTextField: {
     invalid?: boolean;
 } & {
     placeholder?: string;
+    maxLength?: number;
     clearable?: boolean;
     type?: string;
     texts?: typeof import('./types').DEFAULT_TEXTS;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QTextField/index.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAK9C,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCAO+ozB,GAAG,8CAA8C,GAAG,yBAAyB,GAAG,6DAAmC,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAPtuzB,CAAA;AAG/C,OAAO,EAAE,UAAU,EAAE,CAAA;AAGrB,YAAY,EAAE,eAAe,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QTextField/index.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAK9C,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCAO+ozB,GAAG,8CAA8C,GAAG,yBAAyB,GAAG,6DAAmC,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAPtuzB,CAAA;AAG/C,OAAO,EAAE,UAAU,EAAE,CAAA;AAGrB,YAAY,EAAE,eAAe,EAAE,CAAA"}

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

@@ -4,6 +4,11 @@ export type QTextFieldProps = QFieldProps & {
      * The placeholder text for the text field.
      */
     placeholder?: string;
+    /**
+     * If set, defines the maximum string length
+     * that the user can enter into the text area field.
+     */
+    maxLength?: number;
     /**
      * Whether the value of the field can be cleared.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QTextField/types.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAEtD,MAAM,MAAM,eAAe,GAAG,WAAW,GAAG;IAC3C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IAEnB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,aAAa,CAAA;CAC5B,CAAA;AAGD,eAAO,MAAM,aAAa;;CAEQ,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QTextField/types.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAEtD,MAAM,MAAM,eAAe,GAAG,WAAW,GAAG;IAC3C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IAEpB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IAEnB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,aAAa,CAAA;CAC5B,CAAA;AAGD,eAAO,MAAM,aAAa;;CAEQ,CAAA"}

package/package.json

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