ablok-components 0.3.65 → 0.3.66

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.
Files changed (3) hide show
  1. package/dist/ablok-components.umd.js +2 -2
  2. package/dist/components/templates/sortable-list/sortable-list.vue.js +100 -56
  3. package/package.json +19 -19
package/dist/components/templates/sortable-list/sortable-list.vue.js CHANGED
@@ -1,14 +1,14 @@
1
- import { defineComponent as L, ref as v, computed as m, useSlots as O, watch as f, openBlock as i, createBlock as N, TransitionGroup as C, withModifiers as V, normalizeClass as D, withCtx as M, createElementBlock as g, Fragment as _, renderList as x, createCommentVNode as p, createElementVNode as b, createVNode as A, renderSlot as k, createTextVNode as P, toDisplayString as j } from "vue";
2
- import { sanitizeHtml as z } from "../../../composables/useSanitize.js";
3
- import q from "../../atoms/svg-icon/svg-icon.vue.js";
1
+ import { defineComponent as H, ref as c, computed as L, useSlots as I, watch as f, openBlock as i, createBlock as M, TransitionGroup as N, withModifiers as A, normalizeClass as D, withCtx as x, createElementBlock as g, Fragment as O, renderList as C, createCommentVNode as p, createElementVNode as b, createVNode as P, renderSlot as E, createTextVNode as W, toDisplayString as j } from "vue";
2
+ import z from "dompurify";
3
+ import G from "../../atoms/svg-icon/svg-icon.vue.js";
4
4
  /* empty css */
5
- const F = ["onDragenter", "onDragover", "onDragleave", "onDragend", "onDrop", "innerHTML"], G = ["draggable", "onDragstart", "onDrag", "onDragenter", "onDragover", "onDragleave", "onDragend", "onDrop"], J = {
5
+ const R = ["onDragenter", "onDragover", "onDragleave", "onDragend", "onDrop", "innerHTML"], F = ["draggable", "onDragstart", "onDrag", "onDragenter", "onDragover", "onDragleave", "onDragend", "onDrop"], q = {
6
6
  key: 0,
7
7
  class: "sortable-list__drag-handle"
8
- }, K = ["onDragstart", "onDrag"], Q = {
8
+ }, J = ["onDragstart", "onDrag"], K = {
9
9
  key: 0,
10
10
  class: "sortable-list__item"
11
- }, ee = /* @__PURE__ */ L({
11
+ }, te = /* @__PURE__ */ H({
12
12
  __name: "sortable-list",
13
13
  props: {
14
14
  modelValue: {
@@ -42,113 +42,157 @@ const F = ["onDragenter", "onDragover", "onDragleave", "onDragend", "onDrop", "i
42
42
  "update:dragIndex",
43
43
  "update:dragOverIndex"
44
44
  ],
45
- setup(n, { emit: H }) {
46
- const S = n, o = v(!1), l = v(null), s = v(null), d = H, c = m({
45
+ setup(n, { emit: $ }) {
46
+ const V = n, l = c(!1), o = c(null), s = c(null), d = $, v = L({
47
47
  get() {
48
- return S.modelValue;
48
+ return V.modelValue;
49
49
  },
50
50
  set(e) {
51
51
  d("update:modelValue", e);
52
52
  }
53
- }), B = m(() => {
54
- const e = document.querySelector(".is-drag-item")?.outerHTML;
55
- return e ? z(e) : "";
56
- }), E = O(), I = m(() => E["list-append"]);
57
- function w(e, a) {
58
- e.dataTransfer && (e.dataTransfer.dropEffect = "move", e.dataTransfer.effectAllowed = "move", e.dataTransfer.setData("index", a.toLocaleString()), o.value = !0, l.value = a);
59
- }
60
- function y(e, a) {
61
- o.value = !1, l.value = null, s.value = null;
62
- }
63
- function R(e, a) {
53
+ }), m = c("");
54
+ function k(e) {
55
+ const a = e.currentTarget.closest(".sortable-list__item") ?? e.currentTarget;
56
+ m.value = z.sanitize(a.outerHTML, {
57
+ ALLOWED_TAGS: [
58
+ "b",
59
+ "i",
60
+ "em",
61
+ "strong",
62
+ "u",
63
+ "span",
64
+ "p",
65
+ "br",
66
+ "a",
67
+ "ul",
68
+ "ol",
69
+ "li",
70
+ "h1",
71
+ "h2",
72
+ "h3",
73
+ "h4",
74
+ "h5",
75
+ "h6",
76
+ "article",
77
+ "div",
78
+ "label",
79
+ "button",
80
+ "svg",
81
+ "use"
82
+ ],
83
+ ALLOWED_ATTR: [
84
+ "class",
85
+ "id",
86
+ "style",
87
+ "href",
88
+ "target",
89
+ "rel",
90
+ "title",
91
+ "type",
92
+ "aria-expanded",
93
+ "aria-controls",
94
+ "aria-labelledby",
95
+ "data-countdown"
96
+ ],
97
+ ALLOW_DATA_ATTR: !0
98
+ });
64
99
  }
100
+ const S = I(), B = L(() => S["list-append"]);
65
101
  function h(e, a) {
66
- s.value = l.value !== a ? a : null;
102
+ e.dataTransfer && (k(e), e.dataTransfer.dropEffect = "move", e.dataTransfer.effectAllowed = "move", e.dataTransfer.setData("index", a.toLocaleString()), l.value = !0, o.value = a);
67
103
  }
68
104
  function T(e, a) {
69
- s.value = l.value !== a ? a : null;
105
+ l.value = !1, o.value = null, s.value = null, m.value = "";
106
+ }
107
+ function Q(e, a) {
108
+ }
109
+ function y(e, a) {
110
+ s.value = o.value !== a ? a : null;
111
+ }
112
+ function w(e, a) {
113
+ s.value = o.value !== a ? a : null;
70
114
  }
71
115
  function U(e, a) {
72
116
  }
73
- function $(e, a) {
117
+ function _(e, a) {
74
118
  if (e.dataTransfer) {
75
119
  e.preventDefault();
76
- const u = Number(e.dataTransfer.getData("index")), r = a, t = [...c.value];
77
- (r || r === 0) && (u || u === 0) && t.splice(r, 0, t.splice(u, 1)[0]), c.value = t;
120
+ const u = Number(e.dataTransfer.getData("index")), r = a, t = [...v.value];
121
+ (r || r === 0) && (u || u === 0) && t.splice(r, 0, t.splice(u, 1)[0]), v.value = t;
78
122
  }
79
123
  }
80
- return f(() => o.value, (e) => {
124
+ return f(() => l.value, (e) => {
81
125
  d("update:isDragging", e);
82
- }, { immediate: !0 }), f(() => l.value, (e) => {
126
+ }, { immediate: !0 }), f(() => o.value, (e) => {
83
127
  d("update:dragIndex", e);
84
128
  }, { immediate: !0 }), f(() => s.value, (e) => {
85
129
  d("update:dragOverIndex", e);
86
- }, { immediate: !0 }), (e, a) => (i(), N(C, {
130
+ }, { immediate: !0 }), (e, a) => (i(), M(N, {
87
131
  name: "list",
88
132
  tag: "ul",
89
133
  class: D(["sortable-list p-0 d-flex gap-2", {
90
134
  "flex-column": n.vertical,
91
135
  "flex-row flex-wrap": !n.vertical
92
136
  }]),
93
- onDragover: a[0] || (a[0] = V(() => {
137
+ onDragover: a[0] || (a[0] = A(() => {
94
138
  }, ["prevent"])),
95
- onDragenter: a[1] || (a[1] = V(() => {
139
+ onDragenter: a[1] || (a[1] = A(() => {
96
140
  }, ["prevent"]))
97
141
  }, {
98
- default: M(() => [
99
- (i(!0), g(_, null, x(c.value, (u, r) => (i(), g(_, { key: r }, [
100
- n.showPreview && o.value && s.value === r ? (i(), g("li", {
142
+ default: x(() => [
143
+ (i(!0), g(O, null, C(v.value, (u, r) => (i(), g(O, { key: r }, [
144
+ n.showPreview && l.value && s.value === r ? (i(), g("li", {
101
145
  key: 0,
102
146
  class: "sortable-list__item is-drop-target",
103
- onDragenter: (t) => h(t, r),
104
- onDragover: (t) => T(t, r),
147
+ onDragenter: (t) => y(t, r),
148
+ onDragover: (t) => w(t, r),
105
149
  onDragleave: (t) => void 0,
106
- onDragend: (t) => y(),
107
- onDrop: (t) => $(t, r),
108
- innerHTML: B.value
109
- }, null, 40, F)) : p("", !0),
150
+ onDragend: (t) => T(),
151
+ onDrop: (t) => _(t, r),
152
+ innerHTML: m.value
153
+ }, null, 40, R)) : p("", !0),
110
154
  b("li", {
111
155
  class: D(["sortable-list__item d-flex", {
112
- "is-drag-item": o.value && l.value === r,
113
- "is-drop-target": o.value && s.value === r && !n.showPreview,
156
+ "is-drag-item": l.value && o.value === r,
157
+ "is-drop-target": l.value && s.value === r && !n.showPreview,
114
158
  "align-items-center gap-2": n.vertical
115
159
  }]),
116
160
  draggable: !n.showDragHandle,
117
- onDragstart: (t) => w(t, r),
161
+ onDragstart: (t) => h(t, r),
118
162
  onDrag: (t) => void 0,
119
- onDragenter: (t) => h(t, r),
120
- onDragover: (t) => T(t, r),
163
+ onDragenter: (t) => y(t, r),
164
+ onDragover: (t) => w(t, r),
121
165
  onDragleave: (t) => void 0,
122
- onDragend: (t) => y(),
123
- onDrop: (t) => $(t, r)
166
+ onDragend: (t) => T(),
167
+ onDrop: (t) => _(t, r)
124
168
  }, [
125
- n.showDragHandle ? (i(), g("div", J, [
169
+ n.showDragHandle ? (i(), g("div", q, [
126
170
  b("button", {
127
171
  type: "button",
128
172
  class: "btn",
129
173
  draggable: "true",
130
- onDragstart: (t) => w(t, r),
174
+ onDragstart: (t) => h(t, r),
131
175
  onDrag: (t) => void 0
132
176
  }, [
133
- A(q, { symbol: "drag" })
134
- ], 40, K)
177
+ P(G, { symbol: "drag" })
178
+ ], 40, J)
135
179
  ])) : p("", !0),
136
180
  b("div", {
137
181
  class: D(["sortable-list__item-content", {
138
182
  "flex-grow-1": n.vertical
139
183
  }])
140
184
  }, [
141
- k(e.$slots, "list-item", {
185
+ E(e.$slots, "list-item", {
142
186
  item: u,
143
187
  index: r
144
188
  }, () => [
145
- P(j(u), 1)
189
+ W(j(u), 1)
146
190
  ])
147
191
  ], 2)
148
- ], 42, G)
192
+ ], 42, F)
149
193
  ], 64))), 128)),
150
- I.value ? (i(), g("li", Q, [
151
- k(e.$slots, "list-append")
194
+ B.value ? (i(), g("li", K, [
195
+ E(e.$slots, "list-append")
152
196
  ])) : p("", !0)
153
197
  ]),
154
198
  _: 3
@@ -156,5 +200,5 @@ const F = ["onDragenter", "onDragover", "onDragleave", "onDragend", "onDrop", "i
156
200
  }
157
201
  });
158
202
  export {
159
- ee as default
203
+ te as default
160
204
  };
package/package.json CHANGED
@@ -1,7 +1,23 @@
1
1
  {
2
2
  "name": "ablok-components",
3
3
  "private": false,
4
- "version": "0.3.65",
4
+ "version": "0.3.66",
5
+ "scripts": {
6
+ "dev": "vite --host",
7
+ "story:dev": "histoire dev",
8
+ "story:build": "histoire build",
9
+ "story:preview": "histoire preview",
10
+ "build": "vue-tsc --noEmit --project tsconfig.build.json && vite build",
11
+ "build:watch": "vue-tsc --noEmit --watch --project tsconfig.build.json & vite build --watch",
12
+ "preview": "vite preview",
13
+ "build-lib-bak": "vite build && vue-tsc --emitDeclarationOnly && mv dist/src dist/types",
14
+ "build-lib": "vite build && vue-tsc --emitDeclarationOnly",
15
+ "release": "bash ./scripts/release.sh",
16
+ "postrelease": "bash ./scripts/publish.sh",
17
+ "test": "vitest run",
18
+ "test:watch": "vitest",
19
+ "test:ui": "vitest --ui"
20
+ },
5
21
  "dependencies": {
6
22
  "date-fns": "^3.0.0",
7
23
  "dompurify": "^3.3.1",
@@ -120,21 +136,5 @@
120
136
  "./package.json": "./package.json"
121
137
  },
122
138
  "types": "./dist/index.d.ts",
123
- "sideEffects": false,
124
- "scripts": {
125
- "dev": "vite --host",
126
- "story:dev": "histoire dev",
127
- "story:build": "histoire build",
128
- "story:preview": "histoire preview",
129
- "build": "vue-tsc --noEmit --project tsconfig.build.json && vite build",
130
- "build:watch": "vue-tsc --noEmit --watch --project tsconfig.build.json & vite build --watch",
131
- "preview": "vite preview",
132
- "build-lib-bak": "vite build && vue-tsc --emitDeclarationOnly && mv dist/src dist/types",
133
- "build-lib": "vite build && vue-tsc --emitDeclarationOnly",
134
- "release": "bash ./scripts/release.sh",
135
- "postrelease": "bash ./scripts/publish.sh",
136
- "test": "vitest run",
137
- "test:watch": "vitest",
138
- "test:ui": "vitest --ui"
139
- }
140
- }
139
+ "sideEffects": false
140
+ }