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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,4 @@
1
+ import { Chart as t } from "chart.js";
2
+ export {
3
+ t as Chart
4
+ };
@@ -0,0 +1,6 @@
1
+ import { Chart as r, DoughnutController as t, ArcElement as o } from "chart.js";
2
+ import { Chart as m } from "chart.js";
3
+ r.register(t, o);
4
+ export {
5
+ m as ChartJS
6
+ };
@@ -0,0 +1,6 @@
1
+ import { Chart as r, CategoryScale as a, LinearScale as e, Filler as t } from "chart.js";
2
+ import { Chart as C } from "chart.js";
3
+ r.register(a, e, t);
4
+ export {
5
+ C as ChartJS
6
+ };
@@ -0,0 +1,6 @@
1
+ import { Chart as r, LineController as e, LineElement as t, PointElement as o } from "chart.js";
2
+ import { Chart as a } from "chart.js";
3
+ r.register(e, t, o);
4
+ export {
5
+ a as ChartJS
6
+ };
@@ -0,0 +1,2 @@
1
+ import { Chart as r, Legend as e } from "chart.js";
2
+ r.register(e);
@@ -0,0 +1,3 @@
1
+ import "chartjs-adapter-date-fns";
2
+ import { Chart as r, TimeScale as e } from "chart.js";
3
+ r.register(e);
@@ -0,0 +1,2 @@
1
+ import { Chart as r, Title as t } from "chart.js";
2
+ r.register(t);
@@ -0,0 +1,2 @@
1
+ import { Chart as r, Tooltip as o } from "chart.js";
2
+ r.register(o);
@@ -1,5 +1,5 @@
1
1
  import { Autoplay as t } from "swiper/modules";
2
- import '../assets/swiper-keyboard.css';/* empty css */
2
+ import '../assets/swiper-thumbs.css';/* empty css */
3
3
  export {
4
4
  t as Autoplay
5
5
  };
@@ -1,5 +1,5 @@
1
1
  import { Controller as e } from "swiper/modules";
2
- import '../assets/swiper-keyboard.css';/* empty css */
2
+ import '../assets/swiper-thumbs.css';/* empty css */
3
3
  export {
4
4
  e as Controller
5
5
  };
@@ -1,5 +1,5 @@
1
1
  import { Keyboard as m } from "swiper/modules";
2
- import '../assets/swiper-keyboard.css';/* empty css */
2
+ import '../assets/swiper-thumbs.css';/* empty css */
3
3
  export {
4
4
  m as Keyboard
5
5
  };
@@ -1,5 +1,5 @@
1
1
  import { Thumbs as p } from "swiper/modules";
2
- import '../assets/swiper-keyboard.css';/* empty css */
2
+ import '../assets/swiper-thumbs.css';/* empty css */
3
3
  export {
4
4
  p as Thumbs
5
5
  };
@@ -23,7 +23,6 @@ type __VLS_Props = {
23
23
  dataCy?: string;
24
24
  closeIconBtnClasses?: ClassTypeProp;
25
25
  titleClasses?: ClassTypeProp;
26
- appear?: boolean;
27
26
  };
28
27
  type __VLS_PublicProps = {
29
28
  "showModal"?: boolean;
@@ -0,0 +1,12 @@
1
+ const e = async (i) => {
2
+ const t = [
3
+ import("../../ChartJs/DoughnutChart/core.js")
4
+ // always needed
5
+ ];
6
+ 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);
7
+ const { Doughnut: r } = await import("./index.js");
8
+ return r;
9
+ };
10
+ export {
11
+ e as createDoughnutChart
12
+ };
@@ -0,0 +1,4 @@
1
+ import { Doughnut as t } from "vue-chartjs";
2
+ export {
3
+ t as Doughnut
4
+ };
@@ -0,0 +1,14 @@
1
+ const e = async (i) => {
2
+ const t = [
3
+ import("../../ChartJs/LineChart/core.js"),
4
+ // always needed
5
+ import("../../ChartJs/LineChart/cartesian.js")
6
+ // always needed
7
+ ];
8
+ 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);
9
+ const { Line: r } = await import("./index.js");
10
+ return r;
11
+ };
12
+ export {
13
+ e as createLineChart
14
+ };
@@ -0,0 +1,4 @@
1
+ import { Line as r } from "vue-chartjs";
2
+ export {
3
+ r as Line
4
+ };
@@ -42,9 +42,9 @@ declare const __VLS_component: import('vue').DefineComponent<IntersectionObserve
42
42
  }, string, import('vue').PublicProps, Readonly<IntersectionObserverProps> & Readonly<{
43
43
  onIntersection?: (() => any) | undefined;
44
44
  }>, {
45
- threshold: number;
46
45
  observeOnce: boolean;
47
46
  skip: boolean;
47
+ threshold: number;
48
48
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
49
49
  root: HTMLDivElement;
50
50
  }, any>;
@@ -1,6 +1,6 @@
1
- import { defineComponent as $, mergeModels as h, useModel as H, useTemplateRef as w, shallowRef as y, onUnmounted as O, createBlock as F, openBlock as k, Teleport as A, createVNode as C, Transition as K, withCtx as N, withDirectives as S, createElementVNode as l, normalizeClass as i, createElementBlock as p, createCommentVNode as x, renderSlot as d, withModifiers as U, unref as V, vShow as P } from "vue";
2
- import { CloseIcon as R } from "@wikicasa-dev/svg-icons";
3
- const G = ["id", "data-cy"], j = ["innerHTML"], Q = /* @__PURE__ */ $({
1
+ 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";
2
+ import { CloseIcon as q } from "@wikicasa-dev/svg-icons";
3
+ const G = ["id", "data-cy"], J = ["innerHTML"], X = /* @__PURE__ */ A({
4
4
  __name: "BaseModal",
5
5
  props: /* @__PURE__ */ h({
6
6
  id: { default: "base-bt-modal" },
@@ -19,76 +19,74 @@ const G = ["id", "data-cy"], j = ["innerHTML"], Q = /* @__PURE__ */ $({
19
19
  centered: { type: Boolean, default: !1 },
20
20
  dataCy: {},
21
21
  closeIconBtnClasses: {},
22
- titleClasses: {},
23
- appear: { type: Boolean, default: !0 }
22
+ titleClasses: {}
24
23
  }, {
25
24
  showModal: { type: Boolean, default: !0 },
26
25
  showModalModifiers: {}
27
26
  }),
28
27
  emits: /* @__PURE__ */ h(["closed", "opened", "dialogClick"], ["update:showModal"]),
29
- setup(e, { emit: g }) {
30
- const r = g, o = H(e, "showModal"), m = w("backdrop"), s = w("modalDialog"), u = y(!1), c = y(!1), f = ({ key: t }) => {
31
- t === "Escape" && a();
32
- }, M = () => {
28
+ setup(e, { emit: M }) {
29
+ 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 }) => {
30
+ t === "Escape" && s();
31
+ }, E = () => {
33
32
  document?.body.addEventListener("keydown", f);
34
33
  }, b = () => {
35
34
  document?.body.removeEventListener("keydown", f);
36
- }, B = () => {
37
- c.value || (console.log("DEBUG:onBeforeEnter called", {
38
- timestamp: Date.now(),
39
- showModal: o.value,
40
- stack: new Error().stack
41
- }), M(), document?.body.classList.add(
35
+ }, I = () => {
36
+ c.value || (E(), document?.body.classList.add(
42
37
  "sm:uikit-pr-15px",
43
38
  "sm:uikit-mr-0",
44
39
  "uikit-overflow-hidden"
45
40
  ), c.value = !0);
46
- }, E = () => {
41
+ }, L = () => {
47
42
  r("opened"), e.autoClose !== void 0 && setTimeout(() => {
48
- a();
43
+ s();
49
44
  }, e.autoClose);
50
- }, I = () => {
51
- b(), document?.body.classList.remove(
45
+ }, z = () => {
46
+ document?.body.classList.remove(
52
47
  "sm:uikit-pr-15px",
53
48
  "sm:uikit-mr-0",
54
49
  "uikit-overflow-hidden"
55
- ), c.value = !1, r("closed");
56
- }, a = () => {
50
+ );
51
+ }, T = () => {
52
+ b(), c.value = !1, r("closed");
53
+ }, s = () => {
57
54
  o.value = !1;
58
- }, L = (t) => {
59
- s.value && s.value.contains(t.target) && (u.value = !0);
60
- }, z = (t) => {
61
- s.value && s.value.contains(t.target) && (u.value = !1);
62
- }, D = async (t) => {
55
+ }, $ = (t) => {
56
+ a.value && a.value.contains(t.target) && (u.value = !0);
57
+ }, D = (t) => {
58
+ a.value && a.value.contains(t.target) && (u.value = !1);
59
+ }, H = async (t) => {
63
60
  if (!(t.target !== m.value && m.value?.contains(t.target)) && e.closeOnClickOut) {
64
61
  if (u.value) {
65
62
  u.value = !1;
66
63
  return;
67
64
  }
68
- a();
65
+ s();
69
66
  }
70
67
  };
71
- O(() => {
68
+ K(() => {
72
69
  b(), document?.body.classList.remove(
73
70
  "sm:uikit-pr-15px",
74
71
  "sm:uikit-mr-0",
75
72
  "uikit-overflow-hidden"
76
73
  );
77
74
  });
78
- const T = (t) => {
79
- s.value === t.target && t.stopPropagation();
75
+ const O = (t) => {
76
+ a.value === t.target && t.stopPropagation();
80
77
  };
81
- return (t, n) => (k(), F(A, { to: "body" }, [
82
- C(K, {
83
- appear: e.appear,
78
+ return (t, n) => (k(), N(S, { to: "body" }, [
79
+ w(V, {
80
+ appear: p(B),
84
81
  name: "modal-transition",
85
82
  duration: { enter: 500, leave: 250 },
86
- onBeforeEnter: B,
87
- onAfterEnter: E,
88
- onAfterLeave: I
83
+ onBeforeEnter: I,
84
+ onAfterEnter: L,
85
+ onLeave: z,
86
+ onAfterLeave: T
89
87
  }, {
90
- default: N(() => [
91
- S(l("div", {
88
+ default: P(() => [
89
+ R(l("div", {
92
90
  ref: "backdrop",
93
91
  class: i(["bbt-backdrop uikit-fixed uikit-left-0 uikit-top-0 uikit-z-50 uikit-h-full uikit-w-full", [
94
92
  e.customBackdropClasses,
@@ -98,9 +96,9 @@ const G = ["id", "data-cy"], j = ["innerHTML"], Q = /* @__PURE__ */ $({
98
96
  { "uikit-bg-transparent": !o.value },
99
97
  { "sm:uikit-pt-[30px]": !e.centered }
100
98
  ]]),
101
- onClick: D,
102
- onMousedown: L,
103
- onMouseup: z
99
+ onClick: H,
100
+ onMousedown: $,
101
+ onMouseup: D
104
102
  }, [
105
103
  l("dialog", {
106
104
  id: e.id,
@@ -117,12 +115,12 @@ const G = ["id", "data-cy"], j = ["innerHTML"], Q = /* @__PURE__ */ $({
117
115
  ]]),
118
116
  tabindex: "-1",
119
117
  onClick: n[1] || (n[1] = (v) => r("dialogClick", v)),
120
- onFocusin: T
118
+ onFocusin: O
121
119
  }, [
122
120
  l("div", {
123
121
  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]])
124
122
  }, [
125
- e.withCloseIcon ? (k(), p("button", {
123
+ e.withCloseIcon ? (k(), x("button", {
126
124
  key: 0,
127
125
  id: "close-icon-btn",
128
126
  "data-cy": "bbt-default-close-icon-btn",
@@ -131,34 +129,34 @@ const G = ["id", "data-cy"], j = ["innerHTML"], Q = /* @__PURE__ */ $({
131
129
  "aria-label": "Close",
132
130
  onClick: n[0] || (n[0] = U((v) => o.value = !1, ["prevent", "stop"]))
133
131
  }, [
134
- C(V(R), {
132
+ w(p(q), {
135
133
  class: i(["bbt-close-icon uikit-box-border", e.closeIcon?.classes]),
136
134
  width: e.closeIcon?.size || 20,
137
135
  height: e.closeIcon?.size || 20
138
136
  }, null, 8, ["class", "width", "height"])
139
- ], 2)) : x("", !0),
140
- d(t.$slots, "header", { closeModal: a }, () => [
137
+ ], 2)) : g("", !0),
138
+ d(t.$slots, "header", { closeModal: s }, () => [
141
139
  l("span", {
142
140
  class: i(["uikit-w-auto uikit-text-18 uikit-font-semibold sm:uikit-text-22", e.titleClasses]),
143
141
  innerHTML: e.headerTitle
144
- }, null, 10, j)
142
+ }, null, 10, J)
145
143
  ])
146
144
  ], 2),
147
145
  l("div", {
148
146
  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]])
149
147
  }, [
150
- d(t.$slots, "body", { closeModal: a })
148
+ d(t.$slots, "body", { closeModal: s })
151
149
  ], 2),
152
- t.$slots.footer ? (k(), p("div", {
150
+ t.$slots.footer ? (k(), x("div", {
153
151
  key: 0,
154
152
  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])
155
153
  }, [
156
- d(t.$slots, "footer", { closeModal: a })
157
- ], 2)) : x("", !0),
154
+ d(t.$slots, "footer", { closeModal: s })
155
+ ], 2)) : g("", !0),
158
156
  d(t.$slots, "fixed-bottom")
159
157
  ], 42, G)
160
158
  ], 34), [
161
- [P, o.value]
159
+ [j, o.value]
162
160
  ])
163
161
  ]),
164
162
  _: 3
@@ -167,5 +165,5 @@ const G = ["id", "data-cy"], j = ["innerHTML"], Q = /* @__PURE__ */ $({
167
165
  }
168
166
  });
169
167
  export {
170
- Q as default
168
+ X as default
171
169
  };
@@ -1,27 +1,26 @@
1
- import { defineComponent as s, onBeforeMount as u, createBlock as i, createCommentVNode as c, unref as o, openBlock as m } from "vue";
2
- import { Doughnut as p } from "vue-chartjs";
3
- import { Chart as l, DoughnutController as d, ArcElement as f } from "chart.js";
4
- import { useChartJsModules as g } from "../../../../chart/composables/useChartjsModules.js";
5
- const y = /* @__PURE__ */ s({
1
+ import { defineComponent as o, defineAsyncComponent as e, hydrateOnIdle as a, createBlock as i, openBlock as l, unref as r } from "vue";
2
+ import { createDoughnutChart as u } from "../../../../VueChartJs/Doughnut/factory.js";
3
+ const h = /* @__PURE__ */ o({
6
4
  __name: "DoughnutChart",
7
5
  props: {
8
6
  options: {},
9
7
  data: {}
10
8
  },
11
9
  setup(t) {
12
- l.register(d, f);
13
- const e = t, { registerPlugins: r, resolved: n, executeRegistration: a } = g(
14
- e.options
15
- );
16
- return u(async () => {
17
- await a(r);
18
- }), (h, C) => o(n) ? (m(), i(o(p), {
19
- key: 0,
10
+ const n = e({
11
+ loader: () => u({
12
+ tooltip: !!t.options.plugins?.tooltip,
13
+ legend: !!t.options.plugins?.legend,
14
+ title: !!t.options.plugins?.title
15
+ }),
16
+ hydrate: a()
17
+ });
18
+ return (s, d) => (l(), i(r(n), {
20
19
  options: t.options,
21
20
  data: t.data
22
- }, null, 8, ["options", "data"])) : c("", !0);
21
+ }, null, 8, ["options", "data"]));
23
22
  }
24
23
  });
25
24
  export {
26
- y as default
25
+ h as default
27
26
  };
@@ -1,42 +1,30 @@
1
- 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";
2
- import { Line as g } from "vue-chartjs";
3
- 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";
4
- import { useChartJsModules as M } from "../../../../chart/composables/useChartjsModules.js";
5
- const F = /* @__PURE__ */ m({
1
+ 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";
2
+ import { createLineChart as u } from "../../../../VueChartJs/Line/factory.js";
3
+ const y = /* @__PURE__ */ i({
6
4
  __name: "LineChart",
7
5
  props: {
8
6
  options: {},
9
7
  data: {}
10
8
  },
11
- setup(e, { expose: o }) {
12
- x.register(
13
- L,
14
- k,
15
- B,
16
- E,
17
- v,
18
- y
9
+ setup(t, { expose: e }) {
10
+ const n = c({
11
+ loader: () => u({
12
+ timeAxis: t.options.scales?.x?.type === "time",
13
+ tooltip: !!t.options.plugins?.tooltip,
14
+ legend: !!t.options.plugins?.legend,
15
+ title: !!t.options.plugins?.title
16
+ }),
17
+ hydrate: s()
18
+ }), o = l("chart"), a = r(
19
+ () => o.value?.chart
19
20
  );
20
- const r = e, {
21
- registerPlugins: n,
22
- registerTimeCartesianAxis: a,
23
- executeRegistration: i,
24
- resolved: s
25
- } = M(r.options);
26
- p(() => {
27
- i(n, a);
28
- });
29
- const c = u("chart"), l = f(
30
- () => c.value?.chart
31
- );
32
- return o({ chartInstance: l }), (P, R) => t(s) ? (C(), d(t(g), {
33
- key: 0,
21
+ return e({ chartInstance: a }), (h, f) => (d(), p(m(n), {
34
22
  ref: "chart",
35
- options: e.options,
36
- data: e.data
37
- }, null, 8, ["options", "data"])) : h("", !0);
23
+ options: t.options,
24
+ data: t.data
25
+ }, null, 8, ["options", "data"]));
38
26
  }
39
27
  });
40
28
  export {
41
- F as default
29
+ y as default
42
30
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wikicasa-dev/components",
3
- "version": "2.4.1-alpha.9",
3
+ "version": "2.4.1",
4
4
  "description": "Wikicasa frontend components",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -1,10 +0,0 @@
1
- import { ChartOptions, ChartType } from 'chart.js';
2
- export declare const useChartJsModules: <T extends ChartType = ChartType>(options: ChartOptions<T>) => {
3
- registerTitle: () => Promise<void>;
4
- registerLegend: () => Promise<void>;
5
- registerTooltip: () => Promise<void>;
6
- registerTimeCartesianAxis: () => Promise<void>;
7
- executeRegistration: (...args: (() => Promise<unknown>)[]) => Promise<void>;
8
- registerPlugins: () => Promise<void>;
9
- resolved: import('vue').Ref<boolean, boolean>;
10
- };
@@ -1,37 +0,0 @@
1
- import { computed as t, ref as f } from "vue";
2
- import { Chart as r, TimeScale as d, Tooltip as T, Legend as h, Title as w } from "chart.js";
3
- import "chartjs-adapter-date-fns";
4
- const L = (e) => {
5
- if (!e) throw Error("Options must be defined");
6
- const l = t(
7
- () => !!e.plugins?.tooltip
8
- ), o = t(
9
- () => e.scales?.x?.type === "time"
10
- ), c = t(() => !!e.plugins?.title), u = t(
11
- () => !!e.plugins?.legend
12
- ), i = async () => {
13
- l.value && r.register(T);
14
- }, g = async () => {
15
- o.value && r.register(d);
16
- }, s = async () => {
17
- c.value && r.register(w);
18
- }, n = async () => {
19
- u.value && r.register(h);
20
- }, a = f(!1);
21
- return {
22
- registerTitle: s,
23
- registerLegend: n,
24
- registerTooltip: i,
25
- registerTimeCartesianAxis: g,
26
- executeRegistration: async (...m) => {
27
- await Promise.all(m.map((p) => p())), a.value = !0;
28
- },
29
- registerPlugins: async () => {
30
- await Promise.all([i(), s(), n()]);
31
- },
32
- resolved: a
33
- };
34
- };
35
- export {
36
- L as useChartJsModules
37
- };