@wikicasa-dev/components 2.4.1-alpha.8 → 2.4.1

package/dist/ChartJs/Chart.js

@@ -0,0 +1,4 @@
+import { Chart as t } from "chart.js";
+export {
+  t as Chart
+};

package/dist/ChartJs/DoughnutChart/core.js

@@ -0,0 +1,6 @@
+import { Chart as r, DoughnutController as t, ArcElement as o } from "chart.js";
+import { Chart as m } from "chart.js";
+r.register(t, o);
+export {
+  m as ChartJS
+};

package/dist/ChartJs/LineChart/cartesian.js

@@ -0,0 +1,6 @@
+import { Chart as r, CategoryScale as a, LinearScale as e, Filler as t } from "chart.js";
+import { Chart as C } from "chart.js";
+r.register(a, e, t);
+export {
+  C as ChartJS
+};

package/dist/ChartJs/LineChart/core.js

@@ -0,0 +1,6 @@
+import { Chart as r, LineController as e, LineElement as t, PointElement as o } from "chart.js";
+import { Chart as a } from "chart.js";
+r.register(e, t, o);
+export {
+  a as ChartJS
+};

package/dist/ChartJs/Plugins/Legend.js

@@ -0,0 +1,2 @@
+import { Chart as r, Legend as e } from "chart.js";
+r.register(e);

package/dist/ChartJs/Plugins/TimeScale.js

@@ -0,0 +1,3 @@
+import "chartjs-adapter-date-fns";
+import { Chart as r, TimeScale as e } from "chart.js";
+r.register(e);

package/dist/ChartJs/Plugins/Title.js

@@ -0,0 +1,2 @@
+import { Chart as r, Title as t } from "chart.js";
+r.register(t);

package/dist/ChartJs/Plugins/Tooltip.js

@@ -0,0 +1,2 @@
+import { Chart as r, Tooltip as o } from "chart.js";
+r.register(o);

package/dist/Swiper/autoplay.js

@@ -1,5 +1,5 @@
 import { Autoplay as t } from "swiper/modules";
-import '../assets/swiper-keyboard.css';/* empty css                                                                           */
+import '../assets/swiper-thumbs.css';/* empty css                                                                           */
 export {
   t as Autoplay
 };

package/dist/Swiper/controller.js

@@ -1,5 +1,5 @@
 import { Controller as e } from "swiper/modules";
-import '../assets/swiper-keyboard.css';/* empty css                                                                             */
+import '../assets/swiper-thumbs.css';/* empty css                                                                             */
 export {
   e as Controller
 };

package/dist/Swiper/keyboard.js

@@ -1,5 +1,5 @@
 import { Keyboard as m } from "swiper/modules";
-import '../assets/swiper-keyboard.css';/* empty css                                                                           */
+import '../assets/swiper-thumbs.css';/* empty css                                                                           */
 export {
   m as Keyboard
 };

package/dist/Swiper/thumbs.js

@@ -1,5 +1,5 @@
 import { Thumbs as p } from "swiper/modules";
-import '../assets/swiper-keyboard.css';/* empty css                                                                         */
+import '../assets/swiper-thumbs.css';/* empty css                                                                         */
 export {
   p as Thumbs
 };

package/dist/UIKit/BaseModal.d.ts

@@ -23,7 +23,6 @@ type __VLS_Props = {
     dataCy?: string;
     closeIconBtnClasses?: ClassTypeProp;
     titleClasses?: ClassTypeProp;
-    appear?: boolean;
 };
 type __VLS_PublicProps = {
     "showModal"?: boolean;

package/dist/VueChartJs/Doughnut/factory.js

@@ -0,0 +1,12 @@
+const e = async (i) => {
+  const t = [
+    import("../../ChartJs/DoughnutChart/core.js")
+    // always needed
+  ];
+  i.timeAxis && t.push(import("../../ChartJs/Plugins/TimeScale.js")), i.tooltip && t.push(import("../../ChartJs/Plugins/Tooltip.js")), i.legend && t.push(import("../../ChartJs/Plugins/Legend.js")), i.title && t.push(import("../../ChartJs/Plugins/Title.js")), await Promise.all(t);
+  const { Doughnut: r } = await import("./index.js");
+  return r;
+};
+export {
+  e as createDoughnutChart
+};

package/dist/VueChartJs/Doughnut/index.js

@@ -0,0 +1,4 @@
+import { Doughnut as t } from "vue-chartjs";
+export {
+  t as Doughnut
+};

package/dist/VueChartJs/Line/factory.js

@@ -0,0 +1,14 @@
+const e = async (i) => {
+  const t = [
+    import("../../ChartJs/LineChart/core.js"),
+    // always needed
+    import("../../ChartJs/LineChart/cartesian.js")
+    // always needed
+  ];
+  i.timeAxis && t.push(import("../../ChartJs/Plugins/TimeScale.js")), i.tooltip && t.push(import("../../ChartJs/Plugins/Tooltip.js")), i.legend && t.push(import("../../ChartJs/Plugins/Legend.js")), i.title && t.push(import("../../ChartJs/Plugins/Title.js")), await Promise.all(t);
+  const { Line: r } = await import("./index.js");
+  return r;
+};
+export {
+  e as createLineChart
+};

package/dist/VueChartJs/Line/index.js

@@ -0,0 +1,4 @@
+import { Line as r } from "vue-chartjs";
+export {
+  r as Line
+};

package/dist/components/IntersectionObserver/IntersectionObserver.d.ts

@@ -42,9 +42,9 @@ declare const __VLS_component: import('vue').DefineComponent<IntersectionObserve
 }, string, import('vue').PublicProps, Readonly<IntersectionObserverProps> & Readonly<{
     onIntersection?: (() => any) | undefined;
 }>, {
-    threshold: number;
     observeOnce: boolean;
     skip: boolean;
+    threshold: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     root: HTMLDivElement;
 }, any>;

package/dist/packages/components/lib/UIKit/BaseModal.vue.js

@@ -1,8 +1,8 @@
-import { defineComponent as $, mergeModels as w, useModel as H, useTemplateRef as C, shallowRef as p, onUnmounted as O, createBlock as F, openBlock as n, Teleport as A, createVNode as x, Transition as K, withCtx as N, createElementBlock as m, createCommentVNode as f, normalizeClass as i, createElementVNode as d, renderSlot as r, withModifiers as U, unref as V } from "vue";
-import { CloseIcon as P } from "@wikicasa-dev/svg-icons";
-const R = ["id", "data-cy"], S = ["innerHTML"], q = /* @__PURE__ */ $({
+import { defineComponent as A, mergeModels as h, useModel as F, useTemplateRef as y, shallowRef as C, onUnmounted as K, createBlock as N, openBlock as k, Teleport as S, createVNode as w, Transition as V, unref as p, withCtx as P, withDirectives as R, createElementVNode as l, normalizeClass as i, createElementBlock as x, createCommentVNode as g, renderSlot as d, withModifiers as U, vShow as j } from "vue";
+import { CloseIcon as q } from "@wikicasa-dev/svg-icons";
+const G = ["id", "data-cy"], J = ["innerHTML"], X = /* @__PURE__ */ A({
   __name: "BaseModal",
-  props: /* @__PURE__ */ w({
+  props: /* @__PURE__ */ h({
     id: { default: "base-bt-modal" },
     size: { default: "modal-md" },
     customBackdropClasses: {},
@@ -19,77 +19,74 @@ const R = ["id", "data-cy"], S = ["innerHTML"], q = /* @__PURE__ */ $({
     centered: { type: Boolean, default: !1 },
     dataCy: {},
     closeIconBtnClasses: {},
-    titleClasses: {},
-    appear: { type: Boolean, default: !0 }
+    titleClasses: {}
   }, {
     showModal: { type: Boolean, default: !0 },
     showModalModifiers: {}
   }),
-  emits: /* @__PURE__ */ w(["closed", "opened", "dialogClick"], ["update:showModal"]),
-  setup(e, { emit: g }) {
-    const c = g, o = H(e, "showModal"), b = C("backdrop"), s = C("modalDialog"), l = p(!1), k = p(!1), v = ({ key: t }) => {
-      t === "Escape" && a();
-    }, M = () => {
-      document?.body.addEventListener("keydown", v);
-    }, h = () => {
-      document?.body.removeEventListener("keydown", v);
-    }, B = () => {
-      k.value || (console.log("DEBUG:onBeforeEnter called", {
-        timestamp: Date.now(),
-        showModal: o.value,
-        stack: new Error().stack
-      }), M(), document?.body.classList.add(
+  emits: /* @__PURE__ */ h(["closed", "opened", "dialogClick"], ["update:showModal"]),
+  setup(e, { emit: M }) {
+    const r = M, o = F(e, "showModal"), B = o.value, m = y("backdrop"), a = y("modalDialog"), u = C(!1), c = C(!1), f = ({ key: t }) => {
+      t === "Escape" && s();
+    }, E = () => {
+      document?.body.addEventListener("keydown", f);
+    }, b = () => {
+      document?.body.removeEventListener("keydown", f);
+    }, I = () => {
+      c.value || (E(), document?.body.classList.add(
         "sm:uikit-pr-15px",
         "sm:uikit-mr-0",
         "uikit-overflow-hidden"
-      ), k.value = !0);
-    }, E = () => {
-      c("opened"), e.autoClose !== void 0 && setTimeout(() => {
-        a();
+      ), c.value = !0);
+    }, L = () => {
+      r("opened"), e.autoClose !== void 0 && setTimeout(() => {
+        s();
       }, e.autoClose);
-    }, I = () => {
-      h(), document?.body.classList.remove(
+    }, z = () => {
+      document?.body.classList.remove(
         "sm:uikit-pr-15px",
         "sm:uikit-mr-0",
         "uikit-overflow-hidden"
-      ), k.value = !1, c("closed");
-    }, a = () => {
+      );
+    }, T = () => {
+      b(), c.value = !1, r("closed");
+    }, s = () => {
       o.value = !1;
-    }, L = (t) => {
-      s.value && s.value.contains(t.target) && (l.value = !0);
-    }, z = (t) => {
-      s.value && s.value.contains(t.target) && (l.value = !1);
-    }, T = async (t) => {
-      if (!(t.target !== b.value && b.value?.contains(t.target)) && e.closeOnClickOut) {
-        if (l.value) {
-          l.value = !1;
+    }, $ = (t) => {
+      a.value && a.value.contains(t.target) && (u.value = !0);
+    }, D = (t) => {
+      a.value && a.value.contains(t.target) && (u.value = !1);
+    }, H = async (t) => {
+      if (!(t.target !== m.value && m.value?.contains(t.target)) && e.closeOnClickOut) {
+        if (u.value) {
+          u.value = !1;
           return;
         }
-        a();
+        s();
       }
     };
-    O(() => {
-      h(), document?.body.classList.remove(
+    K(() => {
+      b(), document?.body.classList.remove(
         "sm:uikit-pr-15px",
         "sm:uikit-mr-0",
         "uikit-overflow-hidden"
       );
     });
-    const D = (t) => {
-      s.value === t.target && t.stopPropagation();
+    const O = (t) => {
+      a.value === t.target && t.stopPropagation();
     };
-    return (t, u) => (n(), F(A, { to: "body" }, [
-      x(K, {
-        appear: e.appear,
+    return (t, n) => (k(), N(S, { to: "body" }, [
+      w(V, {
+        appear: p(B),
         name: "modal-transition",
         duration: { enter: 500, leave: 250 },
-        onBeforeEnter: B,
-        onAfterEnter: E,
-        onAfterLeave: I
+        onBeforeEnter: I,
+        onAfterEnter: L,
+        onLeave: z,
+        onAfterLeave: T
       }, {
-        default: N(() => [
-          o.value ? (n(), m("div", {
-            key: 0,
+        default: P(() => [
+          R(l("div", {
             ref: "backdrop",
             class: i(["bbt-backdrop uikit-fixed uikit-left-0 uikit-top-0 uikit-z-50 uikit-h-full uikit-w-full", [
               e.customBackdropClasses,
@@ -99,11 +96,11 @@ const R = ["id", "data-cy"], S = ["innerHTML"], q = /* @__PURE__ */ $({
               { "uikit-bg-transparent": !o.value },
               { "sm:uikit-pt-[30px]": !e.centered }
             ]]),
-            onClick: T,
-            onMousedown: L,
-            onMouseup: z
+            onClick: H,
+            onMousedown: $,
+            onMouseup: D
           }, [
-            d("dialog", {
+            l("dialog", {
               id: e.id,
               ref: "modalDialog",
               "data-cy": e.dataCy,
@@ -117,48 +114,50 @@ const R = ["id", "data-cy"], S = ["innerHTML"], q = /* @__PURE__ */ $({
                 e.fullHeight ? "uikit-h-[95%]" : "uikit-h-auto"
               ]]),
               tabindex: "-1",
-              onClick: u[1] || (u[1] = (y) => c("dialogClick", y)),
-              onFocusin: D
+              onClick: n[1] || (n[1] = (v) => r("dialogClick", v)),
+              onFocusin: O
             }, [
-              d("div", {
+              l("div", {
                 class: i(["default-header uikit-sticky uikit-top-0 uikit-z-10 uikit-rounded-t uikit-border-0 uikit-bg-white uikit-px-4 uikit-pb-10px uikit-pt-20px sm:uikit-px-6", [e.customModalHeaderClasses]])
               }, [
-                e.withCloseIcon ? (n(), m("button", {
+                e.withCloseIcon ? (k(), x("button", {
                   key: 0,
                   id: "close-icon-btn",
                   "data-cy": "bbt-default-close-icon-btn",
                   class: i(["uikit-absolute uikit-right-15px uikit-top-15px uikit-z-10 uikit-bg-transparent uikit-p-5px", e.closeIconBtnClasses]),
                   type: "button",
                   "aria-label": "Close",
-                  onClick: u[0] || (u[0] = U((y) => o.value = !1, ["prevent", "stop"]))
+                  onClick: n[0] || (n[0] = U((v) => o.value = !1, ["prevent", "stop"]))
                 }, [
-                  x(V(P), {
+                  w(p(q), {
                     class: i(["bbt-close-icon uikit-box-border", e.closeIcon?.classes]),
                     width: e.closeIcon?.size || 20,
                     height: e.closeIcon?.size || 20
                   }, null, 8, ["class", "width", "height"])
-                ], 2)) : f("", !0),
-                r(t.$slots, "header", { closeModal: a }, () => [
-                  d("span", {
+                ], 2)) : g("", !0),
+                d(t.$slots, "header", { closeModal: s }, () => [
+                  l("span", {
                     class: i(["uikit-w-auto uikit-text-18 uikit-font-semibold sm:uikit-text-22", e.titleClasses]),
                     innerHTML: e.headerTitle
-                  }, null, 10, S)
+                  }, null, 10, J)
                 ])
               ], 2),
-              d("div", {
+              l("div", {
                 class: i(["uikit-bbt-body uikit-flex-auto uikit-overflow-y-auto uikit-overflow-x-hidden uikit-px-4 uikit-pb-0 uikit-no-scrollbar sm:uikit-px-6 sm:uikit-pb-25px", [e.customModalBodyClasses]])
               }, [
-                r(t.$slots, "body", { closeModal: a })
+                d(t.$slots, "body", { closeModal: s })
               ], 2),
-              t.$slots.footer ? (n(), m("div", {
+              t.$slots.footer ? (k(), x("div", {
                 key: 0,
                 class: i(["uikit-bbt-footer uikit-sticky uikit-bottom-0 uikit-border-0 uikit-bg-white uikit-px-4 uikit-py-15px sm:uikit-px-6", e.customModalFooterClasses])
               }, [
-                r(t.$slots, "footer", { closeModal: a })
-              ], 2)) : f("", !0),
-              r(t.$slots, "fixed-bottom")
-            ], 42, R)
-          ], 34)) : f("", !0)
+                d(t.$slots, "footer", { closeModal: s })
+              ], 2)) : g("", !0),
+              d(t.$slots, "fixed-bottom")
+            ], 42, G)
+          ], 34), [
+            [j, o.value]
+          ])
         ]),
         _: 3
       }, 8, ["appear"])
@@ -166,5 +165,5 @@ const R = ["id", "data-cy"], S = ["innerHTML"], q = /* @__PURE__ */ $({
   }
 });
 export {
-  q as default
+  X as default
 };

package/dist/packages/components/lib/chart/DoughnutChart.vue.js

@@ -1,27 +1,26 @@
-import { defineComponent as s, onBeforeMount as u, createBlock as i, createCommentVNode as c, unref as o, openBlock as m } from "vue";
-import { Doughnut as p } from "vue-chartjs";
-import { Chart as l, DoughnutController as d, ArcElement as f } from "chart.js";
-import { useChartJsModules as g } from "../../../../chart/composables/useChartjsModules.js";
-const y = /* @__PURE__ */ s({
+import { defineComponent as o, defineAsyncComponent as e, hydrateOnIdle as a, createBlock as i, openBlock as l, unref as r } from "vue";
+import { createDoughnutChart as u } from "../../../../VueChartJs/Doughnut/factory.js";
+const h = /* @__PURE__ */ o({
   __name: "DoughnutChart",
   props: {
     options: {},
     data: {}
   },
   setup(t) {
-    l.register(d, f);
-    const e = t, { registerPlugins: r, resolved: n, executeRegistration: a } = g(
-      e.options
-    );
-    return u(async () => {
-      await a(r);
-    }), (h, C) => o(n) ? (m(), i(o(p), {
-      key: 0,
+    const n = e({
+      loader: () => u({
+        tooltip: !!t.options.plugins?.tooltip,
+        legend: !!t.options.plugins?.legend,
+        title: !!t.options.plugins?.title
+      }),
+      hydrate: a()
+    });
+    return (s, d) => (l(), i(r(n), {
       options: t.options,
       data: t.data
-    }, null, 8, ["options", "data"])) : c("", !0);
+    }, null, 8, ["options", "data"]));
   }
 });
 export {
-  y as default
+  h as default
 };

package/dist/packages/components/lib/chart/LineChart.vue.js

@@ -1,42 +1,30 @@
-import { defineComponent as m, onBeforeMount as p, useTemplateRef as u, computed as f, createBlock as d, createCommentVNode as h, unref as t, openBlock as C } from "vue";
-import { Line as g } from "vue-chartjs";
-import { Chart as x, LineController as L, LineElement as k, Filler as B, PointElement as E, CategoryScale as v, LinearScale as y } from "chart.js";
-import { useChartJsModules as M } from "../../../../chart/composables/useChartjsModules.js";
-const F = /* @__PURE__ */ m({
+import { defineComponent as i, defineAsyncComponent as c, hydrateOnIdle as s, useTemplateRef as l, computed as r, createBlock as p, openBlock as d, unref as m } from "vue";
+import { createLineChart as u } from "../../../../VueChartJs/Line/factory.js";
+const y = /* @__PURE__ */ i({
   __name: "LineChart",
   props: {
     options: {},
     data: {}
   },
-  setup(e, { expose: o }) {
-    x.register(
-      L,
-      k,
-      B,
-      E,
-      v,
-      y
+  setup(t, { expose: e }) {
+    const n = c({
+      loader: () => u({
+        timeAxis: t.options.scales?.x?.type === "time",
+        tooltip: !!t.options.plugins?.tooltip,
+        legend: !!t.options.plugins?.legend,
+        title: !!t.options.plugins?.title
+      }),
+      hydrate: s()
+    }), o = l("chart"), a = r(
+      () => o.value?.chart
     );
-    const r = e, {
-      registerPlugins: n,
-      registerTimeCartesianAxis: a,
-      executeRegistration: i,
-      resolved: s
-    } = M(r.options);
-    p(() => {
-      i(n, a);
-    });
-    const c = u("chart"), l = f(
-      () => c.value?.chart
-    );
-    return o({ chartInstance: l }), (P, R) => t(s) ? (C(), d(t(g), {
-      key: 0,
+    return e({ chartInstance: a }), (h, f) => (d(), p(m(n), {
       ref: "chart",
-      options: e.options,
-      data: e.data
-    }, null, 8, ["options", "data"])) : h("", !0);
+      options: t.options,
+      data: t.data
+    }, null, 8, ["options", "data"]));
   }
 });
 export {
-  F as default
+  y as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wikicasa-dev/components",
-  "version": "2.4.1-alpha.8",
+  "version": "2.4.1",
   "description": "Wikicasa frontend components",
   "type": "module",
   "main": "./dist/index.js",

package/dist/chart/composables/useChartjsModules.d.ts

@@ -1,10 +0,0 @@
-import { ChartOptions, ChartType } from 'chart.js';
-export declare const useChartJsModules: <T extends ChartType = ChartType>(options: ChartOptions<T>) => {
-    registerTitle: () => Promise<void>;
-    registerLegend: () => Promise<void>;
-    registerTooltip: () => Promise<void>;
-    registerTimeCartesianAxis: () => Promise<void>;
-    executeRegistration: (...args: (() => Promise<unknown>)[]) => Promise<void>;
-    registerPlugins: () => Promise<void>;
-    resolved: import('vue').Ref<boolean, boolean>;
-};

package/dist/chart/composables/useChartjsModules.js

@@ -1,37 +0,0 @@
-import { computed as t, ref as f } from "vue";
-import { Chart as r, TimeScale as d, Tooltip as T, Legend as h, Title as w } from "chart.js";
-import "chartjs-adapter-date-fns";
-const L = (e) => {
-  if (!e) throw Error("Options must be defined");
-  const l = t(
-    () => !!e.plugins?.tooltip
-  ), o = t(
-    () => e.scales?.x?.type === "time"
-  ), c = t(() => !!e.plugins?.title), u = t(
-    () => !!e.plugins?.legend
-  ), i = async () => {
-    l.value && r.register(T);
-  }, g = async () => {
-    o.value && r.register(d);
-  }, s = async () => {
-    c.value && r.register(w);
-  }, n = async () => {
-    u.value && r.register(h);
-  }, a = f(!1);
-  return {
-    registerTitle: s,
-    registerLegend: n,
-    registerTooltip: i,
-    registerTimeCartesianAxis: g,
-    executeRegistration: async (...m) => {
-      await Promise.all(m.map((p) => p())), a.value = !0;
-    },
-    registerPlugins: async () => {
-      await Promise.all([i(), s(), n()]);
-    },
-    resolved: a
-  };
-};
-export {
-  L as useChartJsModules
-};