@quoreadmin/ui 1.7.6 → 1.7.7

package/dist/index115.js

@@ -1,6 +1,6 @@
-import { defineComponent as h, useSlots as b, ref as o, computed as u } from "vue";
-import w from "./index54.js";
-const f = "eye", v = "eye-slash", V = h({
+import { defineComponent as b, useSlots as w, ref as o, computed as u } from "vue";
+import P from "./index54.js";
+const f = "eye", v = "eye-slash", q = b({
   name: "QInput",
   inheritAttrs: !1,
   props: {
@@ -68,11 +68,16 @@ const f = "eye", v = "eye-slash", V = h({
     iconPosition: {
       type: String,
       default: "right"
+    },
+    // Shows "*Required" indicator next to placeholder with different styling
+    required: {
+      type: Boolean,
+      default: !1
     }
   },
   emits: ["update:model-value", "update-type"],
-  setup(e, { emit: d }) {
-    const y = b(), i = o(null), l = o(!1), n = o(e.type === "password" ? f : ""), a = o(!e.expands), s = u(() => !!e.disabled), m = u(() => {
+  setup(e, { emit: i }) {
+    const y = w(), d = o(null), l = o(!1), n = o(e.type === "password" ? f : ""), a = o(!e.expands), s = u(() => !!e.disabled), m = u(() => {
       const t = n.value;
       return !!e.modelValue && !s.value && (c.value && e.iconPosition === "left" || !t);
     }), S = u(() => [
@@ -86,49 +91,50 @@ const f = "eye", v = "eye-slash", V = h({
       e.controlClass,
       { ["size-" + e.size]: e.size },
       { collapsed: !a.value }
-    ]), p = u(() => [
+    ]), g = u(() => [
       "input",
       { [e.status]: e.status && !s.value },
       { [e.inputClass]: !!e.inputClass },
       { populated: !!e.modelValue }
-    ]), c = u(() => !!y?.default), g = () => {
-      const t = e.type === "password", C = e.type === "text" && n.value === v;
-      (t || C) && r(), e.expands && i.value && !a.value && (a.value = !a.value, l.value = a.value, i.value.querySelector("input")?.focus());
-    }, x = () => {
+    ]), c = u(() => !!y?.default), h = u(() => e.required && !e.modelValue && !l.value), x = () => {
+      const t = e.type === "password", p = e.type === "text" && n.value === v;
+      (t || p) && r(), e.expands && d.value && !a.value && (a.value = !a.value, l.value = a.value, d.value.querySelector("input")?.focus());
+    }, C = () => {
       l.value = !l.value, !e.modelValue && e.expands && (a.value = !1);
     }, r = () => {
       const t = e.type === "text" ? "password" : "text";
-      n.value = t === "text" ? v : f, d("update-type", t);
+      n.value = t === "text" ? v : f, i("update-type", t);
     };
     return {
       // refs
-      currentInput: i,
+      currentInput: d,
       focused: l,
       icon: n,
       isExpanded: a,
       // computed
       rootClasses: S,
-      inputClasses: p,
+      inputClasses: g,
       isDisabled: s,
       showClearIcon: m,
       isSlotAvailable: c,
+      showCustomPlaceholder: h,
       // Methods
-      onClickIcon: g,
-      onFocusOut: x,
+      onClickIcon: x,
+      onFocusOut: C,
       togglePasswordVisibility: r,
       updateValue: (t) => {
-        d(
+        i(
           "update:model-value",
           t.target.value
         );
       },
       // composables
-      mq: w
+      mq: P
     };
   }
 });
 export {
   v as HIDE_PASSWORD_ICON,
   f as SHOW_PASSWORD_ICON,
-  V as default
+  q as default
 };