@selfeesas/shared-components 0.4.33 → 0.4.34

package/dist/shared-components.d.ts

@@ -676,6 +676,7 @@ export declare const DateRange: DefineComponent<ExtractPropTypes<__VLS_WithDefau
         from: string;
         to: string;
     }) => void;
+    clear: () => void;
 }, string, PublicProps, Readonly< ExtractPropTypes<__VLS_WithDefaults_6<__VLS_TypePropsToOption_10<DateRangeProps>, {
     from: string;
     to: string;
@@ -695,6 +696,7 @@ export declare const DateRange: DefineComponent<ExtractPropTypes<__VLS_WithDefau
     disabled: boolean;
     idCy: string;
 }>>> & Readonly<{
+    onClear?: (() => any) | undefined;
     "onUpdate:dateRange"?: ((value: {
         from: string;
         to: string;

package/dist/shared-components.es.js

@@ -8517,7 +8517,7 @@ const Qr = {
     from: { default: "" },
     to: { default: "" },
     labelStart: { default: "De" },
-    labelEnd: { default: "à" },
+    labelEnd: { default: "À" },
     startDateHint: { default: "" },
     resetLabel: { default: "Reinitialiser" },
     closeLabel: { default: "Close" },
@@ -8534,78 +8534,105 @@ const Qr = {
     isIconCalendar: { type: Boolean },
     resetPosition: {}
   },
-  emits: ["update:dateRange"],
+  emits: ["update:dateRange", "clear"],
   setup(l, { expose: B, emit: t }) {
     const v = l, m = t, f = Se({
       from: v.from,
       to: v.to
     }), a = $(() => `from-date-${v.idCy}`), o = $(() => `to-date-${v.idCy}`), n = $(() => [
-      ...v.required ? [(d) => !!d || v.requiredErrorMessage] : [],
+      ...v.required ? [(p) => !!p || v.requiredErrorMessage] : [],
       ...v.rules
-    ]), e = $(() => (d) => {
-      const h = d.replaceAll("/", "-");
-      return Po(h, v.minDate, v.maxDate, v.datesDisabled);
-    }), r = (d) => {
-      Qr.handleInput(d, (h) => {
-        f.value = Qr.validateAndUpdate(f.value, h, !0);
+    ]), e = $(() => (p) => {
+      const S = p.replaceAll("/", "-");
+      return Po(S, v.minDate, v.maxDate, v.datesDisabled);
+    });
+    let r = !1;
+    const u = () => {
+      r = !0, f.value.from = "", g(), m("clear"), setTimeout(() => {
+        r = !1;
+      }, 100);
+    }, s = () => {
+      r = !0, f.value.to = "", g(), m("clear"), setTimeout(() => {
+        r = !1;
+      }, 100);
+    }, i = (p) => {
+      if (p === null || p === "") {
+        const S = f.value.from;
+        f.value.from = "", g(), !f.value.to && S && m("clear");
+        return;
+      }
+      Qr.handleInput(p, (S) => {
+        const k = f.value.from;
+        f.value = Qr.validateAndUpdate(f.value, S, !0), g(), !S && !f.value.to && k && m("clear");
       });
-    }, u = (d) => {
-      Qr.handleInput(d, (h) => {
-        f.value = Qr.validateAndUpdate(f.value, h, !1);
+    }, d = (p) => {
+      if (p === null || p === "") {
+        const S = f.value.to;
+        f.value.to = "", g(), !f.value.from && S && m("clear");
+        return;
+      }
+      Qr.handleInput(p, (S) => {
+        const k = f.value.to;
+        f.value = Qr.validateAndUpdate(f.value, S, !1), g(), !S && !f.value.from && k && m("clear");
       });
-    }, s = (d) => {
-      f.value = Qr.handlePickerUpdate(d);
-    }, i = () => {
-      f.value = Qr.reset();
+    }, h = (p) => {
+      f.value = Qr.handlePickerUpdate(p), g();
+    }, c = () => {
+      r = !0, f.value = Qr.reset(), g(), m("clear"), setTimeout(() => {
+        r = !1;
+      }, 100);
+    }, g = () => {
+      m("update:dateRange", { ...f.value });
     };
     return We(
-      f,
-      (d) => {
-        m("update:dateRange", { ...d });
-      },
-      { deep: !0 }
+      [() => f.value.from, () => f.value.to],
+      ([p, S], [k, M]) => {
+        !p && !S && (k || M) && !r && m("clear");
+      }
     ), We(
       () => v.from,
-      (d) => {
-        d !== f.value.from && (f.value.from = d);
+      (p) => {
+        p !== f.value.from && (f.value.from = p);
       }
     ), We(
       () => v.to,
-      (d) => {
-        d !== f.value.to && (f.value.to = d);
+      (p) => {
+        p !== f.value.to && (f.value.to = p);
       }
     ), B({
-      resetDate: i,
-      setDateRange: (d) => {
+      resetDate: c,
+      setDateRange: (p) => {
         f.value = {
-          from: d.from,
-          to: d.to
-        };
+          from: p.from,
+          to: p.to
+        }, g();
       }
-    }), (d, h) => (Xe(), _t("div", Kc, [
+    }), (p, S) => (Xe(), _t("div", Kc, [
       rt("div", Xc, [
-        Ze(vn, ar(d.$attrs, {
+        Ze(vn, ar(p.$attrs, {
           "data-cy": a.value,
           "model-value": f.value.from,
           mask: "##-##-####",
-          label: d.labelStart,
+          label: p.labelStart,
           rules: n.value,
-          disable: d.disabled,
-          required: d.required,
+          disable: p.disabled,
+          required: p.required,
           "hide-bottom-space": "",
-          "onUpdate:modelValue": r
+          "onUpdate:modelValue": i,
+          onClear: u
         }), null, 16, ["data-cy", "model-value", "label", "rules", "disable", "required"]),
-        Ze(vn, ar(d.$attrs, {
+        Ze(vn, ar(p.$attrs, {
           "model-value": f.value.to,
           mask: "##-##-####",
-          label: d.labelEnd,
+          label: p.labelEnd,
           "hide-bottom-space": "",
           style: { "margin-left": "10px" },
           "data-cy": o.value,
           rules: n.value,
-          disable: d.disabled,
-          required: d.required,
-          "onUpdate:modelValue": u
+          disable: p.disabled,
+          required: p.required,
+          "onUpdate:modelValue": d,
+          onClear: s
         }), null, 16, ["model-value", "label", "data-cy", "rules", "disable", "required"]),
         Ze(Ft, {
           name: "event",
@@ -8624,23 +8651,23 @@ const Qr = {
                 Ze(Bo, {
                   modelValue: f.value,
                   "onUpdate:modelValue": [
-                    h[0] || (h[0] = (c) => f.value = c),
-                    s
+                    S[0] || (S[0] = (k) => f.value = k),
+                    h
                   ],
                   mask: "DD-MM-YYYY",
                   "today-btn": "",
                   range: "",
                   "data-cy": "date-picker-range",
-                  locale: d.locale,
+                  locale: p.locale,
                   options: e.value,
-                  events: d.highlightEvents,
+                  events: p.highlightEvents,
                   "event-color": "warning",
-                  disable: d.disabled
+                  disable: p.disabled
                 }, {
                   default: Qe(() => [
                     rt("div", Gc, [
                       Fr(Ze(Et, {
-                        label: d.closeLabel,
+                        label: p.closeLabel,
                         color: "primary",
                         flat: ""
                       }, null, 8, ["label"]), [
@@ -8657,15 +8684,15 @@ const Qr = {
           _: 1
         })
       ]),
-      d.startDateHint ? (Xe(), _t("p", Jc, Bt(d.startDateHint), 1)) : Wt("", !0),
+      p.startDateHint ? (Xe(), _t("p", Jc, Bt(p.startDateHint), 1)) : Wt("", !0),
       rt("div", Zc, [
         Ze(Et, {
           class: "q-pa-sm",
           outlined: "",
           dense: "",
           "data-cy": "reset-date",
-          label: d.resetLabel,
-          onClick: i
+          label: p.resetLabel,
+          onClick: c
         }, null, 8, ["label"])
       ])
     ]));