@nubisco/ui 5.6.0 → 5.7.0

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 (41) hide show
  1. package/dist/Avatar-672086EP.js +57 -0
  2. package/dist/Avatar-DqHh71ha.cjs +1 -0
  3. package/dist/{Tree-DI_ouWnv.cjs → Tree-CMXvRX6y.cjs} +1 -1
  4. package/dist/{Tree-DHdPsRXV.js → Tree-Clpnh7Mh.js} +1 -1
  5. package/dist/TreeContext-51-0WkVM.cjs +1 -0
  6. package/dist/TreeContext-C77g-WGF.js +4 -0
  7. package/dist/TreeNode-DsOOkac_.js +171 -0
  8. package/dist/TreeNode-n65SoYln.cjs +1 -0
  9. package/dist/all.cjs +1 -1
  10. package/dist/all.mjs +17 -16
  11. package/dist/components/Avatar.cjs +1 -1
  12. package/dist/components/Avatar.d.ts +19 -2
  13. package/dist/components/Avatar.mjs +1 -1
  14. package/dist/components/Avatar.vue.d.ts +3 -1
  15. package/dist/components/Avatar.vue.d.ts.map +1 -1
  16. package/dist/components/Tree.cjs +1 -1
  17. package/dist/components/Tree.d.ts +2 -3
  18. package/dist/components/Tree.mjs +1 -1
  19. package/dist/components/TreeContext.d.ts +5 -0
  20. package/dist/components/TreeContext.d.ts.map +1 -1
  21. package/dist/components/TreeNode.cjs +1 -1
  22. package/dist/components/TreeNode.mjs +1 -1
  23. package/dist/components/TreeNode.vue.d.ts.map +1 -1
  24. package/dist/index.cjs +1 -1
  25. package/dist/index.mjs +12 -11
  26. package/dist/main.d.ts +2 -0
  27. package/dist/main.d.ts.map +1 -1
  28. package/dist/styles/TreeNode.css +1 -1
  29. package/dist/ui.css +1 -1
  30. package/dist/utils/treeMove.helper.cjs +1 -0
  31. package/dist/utils/treeMove.helper.d.ts +87 -0
  32. package/dist/utils/treeMove.helper.d.ts.map +1 -0
  33. package/dist/utils/treeMove.helper.mjs +86 -0
  34. package/package.json +1 -1
  35. package/src/utils/treeMove.helper.ts +223 -0
  36. package/dist/Avatar-C6pCz1lv.cjs +0 -1
  37. package/dist/Avatar-DdI07lRT.js +0 -47
  38. package/dist/TreeContext-BH2qpPud.cjs +0 -1
  39. package/dist/TreeContext-DMADOfuO.js +0 -4
  40. package/dist/TreeNode-CME77z98.js +0 -165
  41. package/dist/TreeNode-CpV3GOzv.cjs +0 -1
@@ -1 +0,0 @@
1
- require(`./chunk-D-qHiVGv.cjs`);const e=require(`./utils/initials.helper.cjs`);let t=require(`vue`);var n=[`role`,`aria-label`,`aria-hidden`,`title`],r=[`src`],i={key:1,class:`nb-avatar__initials`,"aria-hidden":`true`},a=(0,t.defineComponent)({__name:`Avatar`,props:{name:{default:void 0},email:{default:void 0},picture:{default:void 0},size:{default:`md`},decorative:{type:Boolean,default:!1}},setup(a){let o=a,s=(0,t.ref)(!1);(0,t.watch)(()=>o.picture,()=>{s.value=!1});let c=(0,t.computed)(()=>!!o.picture&&!s.value),l=(0,t.computed)(()=>e.initialsOf(o)),u=(0,t.computed)(()=>o.name?.trim()||o.email?.trim()||``);return(e,o)=>((0,t.openBlock)(),(0,t.createElementBlock)(`span`,{class:(0,t.normalizeClass)([`nb-avatar`,[`nb-avatar--${a.size}`]]),role:a.decorative?void 0:`img`,"aria-label":a.decorative?void 0:u.value||void 0,"aria-hidden":a.decorative?`true`:void 0,title:a.decorative?void 0:u.value||void 0},[c.value?((0,t.openBlock)(),(0,t.createElementBlock)(`img`,{key:0,class:`nb-avatar__picture`,src:a.picture??void 0,alt:``,onError:o[0]||=e=>s.value=!0},null,40,r)):((0,t.openBlock)(),(0,t.createElementBlock)(`span`,i,(0,t.toDisplayString)(l.value),1))],10,n))}});Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});
@@ -1,47 +0,0 @@
1
- import { initialsOf as e } from "./utils/initials.helper.mjs";
2
- import { computed as t, createElementBlock as n, defineComponent as r, normalizeClass as i, openBlock as a, ref as o, toDisplayString as s, watch as c } from "vue";
3
- //#region src/components/Avatar.vue?vue&type=script&setup=true&lang.ts
4
- var l = [
5
- "role",
6
- "aria-label",
7
- "aria-hidden",
8
- "title"
9
- ], u = ["src"], d = {
10
- key: 1,
11
- class: "nb-avatar__initials",
12
- "aria-hidden": "true"
13
- }, f = /* @__PURE__ */ r({
14
- __name: "Avatar",
15
- props: {
16
- name: { default: void 0 },
17
- email: { default: void 0 },
18
- picture: { default: void 0 },
19
- size: { default: "md" },
20
- decorative: {
21
- type: Boolean,
22
- default: !1
23
- }
24
- },
25
- setup(r) {
26
- let f = r, p = o(!1);
27
- c(() => f.picture, () => {
28
- p.value = !1;
29
- });
30
- let m = t(() => !!f.picture && !p.value), h = t(() => e(f)), g = t(() => f.name?.trim() || f.email?.trim() || "");
31
- return (e, t) => (a(), n("span", {
32
- class: i(["nb-avatar", [`nb-avatar--${r.size}`]]),
33
- role: r.decorative ? void 0 : "img",
34
- "aria-label": r.decorative ? void 0 : g.value || void 0,
35
- "aria-hidden": r.decorative ? "true" : void 0,
36
- title: r.decorative ? void 0 : g.value || void 0
37
- }, [m.value ? (a(), n("img", {
38
- key: 0,
39
- class: "nb-avatar__picture",
40
- src: r.picture ?? void 0,
41
- alt: "",
42
- onError: t[0] ||= (e) => p.value = !0
43
- }, null, 40, u)) : (a(), n("span", d, s(h.value), 1))], 10, l));
44
- }
45
- });
46
- //#endregion
47
- export { f as t };
@@ -1 +0,0 @@
1
- var e=Symbol(`nb-tree`),t=Symbol(`nb-tree-depth`);Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return e}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return t}});
@@ -1,4 +0,0 @@
1
- //#region src/components/TreeContext.ts
2
- var e = Symbol("nb-tree"), t = Symbol("nb-tree-depth");
3
- //#endregion
4
- export { e as n, t };
@@ -1,165 +0,0 @@
1
- import { t as e } from "./_plugin-vue_export-helper-O4QQSku4.js";
2
- import { t } from "./Icon-rREAqsu0.js";
3
- import { n, t as r } from "./TreeContext-DMADOfuO.js";
4
- import { Comment as i, Fragment as a, Text as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, createTextVNode as f, createVNode as p, defineComponent as m, inject as h, normalizeClass as g, normalizeStyle as _, onBeforeMount as ee, onBeforeUpdate as v, openBlock as y, provide as b, renderSlot as x, toDisplayString as S, unref as C, useSlots as w, withModifiers as T } from "vue";
5
- import { regular as E } from "@nubisco/ui/icons/caret-right";
6
- //#region src/components/TreeNode.vue?vue&type=script&setup=true&lang.ts
7
- var D = [
8
- "draggable",
9
- "aria-expanded",
10
- "aria-selected",
11
- "aria-disabled",
12
- "aria-grabbed"
13
- ], O = {
14
- key: 1,
15
- class: "nb-tree-node__toggle-spacer"
16
- }, te = { class: "nb-tree-node__label-text" }, k = {
17
- key: 3,
18
- class: "nb-tree-node__actions"
19
- }, A = {
20
- key: 0,
21
- role: "group",
22
- class: "nb-tree-node__children"
23
- }, j = /* @__PURE__ */ e(/* @__PURE__ */ m({
24
- __name: "TreeNode",
25
- props: {
26
- id: {},
27
- label: {},
28
- icon: { default: void 0 },
29
- disabled: {
30
- type: Boolean,
31
- default: !1
32
- },
33
- depth: { default: null },
34
- draggable: {
35
- type: [Boolean, null],
36
- default: null
37
- },
38
- expandable: {
39
- type: [Boolean, null],
40
- default: null
41
- },
42
- droppable: {
43
- type: [Boolean, null],
44
- default: null
45
- }
46
- },
47
- emits: [
48
- "select",
49
- "toggle",
50
- "contextmenu",
51
- "dblclick"
52
- ],
53
- setup(e, { emit: m }) {
54
- let j = e, M = m, N = w(), P = h(n), F = h(r, 0), I = s(() => j.depth ?? F);
55
- b(r, I.value + 1);
56
- let L = 0, R = -1, z = !1;
57
- ee(() => L++), v(() => L++);
58
- function B(e) {
59
- return !!e?.some((e) => e.type === i ? !1 : e.type === a ? B(e.children) : e.type === o ? String(e.children ?? "").trim() !== "" : !0);
60
- }
61
- function V() {
62
- return R !== L && (R = L, z = B(N.default?.())), z;
63
- }
64
- function H() {
65
- return j.expandable ?? V();
66
- }
67
- function U() {
68
- return j.droppable ?? H();
69
- }
70
- let W = s(() => P?.expandedIds.has(j.id) ?? !1), G = s(() => P?.selectedId === j.id), K = s(() => P?.compact ?? !1), q = s(() => K.value ? "24px" : "32px"), J = s(() => `${16 + I.value * 16}px`), Y = s(() => j.disabled ? !1 : j.draggable === null ? P?.draggable ?? !1 : j.draggable), X = s(() => P?.drag.dragId === j.id), Z = s(() => P?.drag.dropTargetId === j.id), Q = s(() => Z.value ? P?.drag.dropPosition : null);
71
- function $() {
72
- j.disabled || !P || (P.select(j.id), M("select", j.id), H() && (P.toggle(j.id), M("toggle", j.id, !W.value)));
73
- }
74
- function ne(e) {
75
- e.stopPropagation(), !(j.disabled || !P) && (P.toggle(j.id), M("toggle", j.id, !W.value));
76
- }
77
- function re() {
78
- j.disabled || (H() && P && P.toggle(j.id), M("dblclick", j.id));
79
- }
80
- function ie(e) {
81
- M("contextmenu", e, j.id);
82
- }
83
- function ae(e) {
84
- e.target?.closest?.(".nb-tree-node") === e.currentTarget && (!Y.value || !P || !e.dataTransfer || (e.dataTransfer.effectAllowed = "move", e.dataTransfer.setData("text/plain", j.id), P.onDragStart(j.id)));
85
- }
86
- function oe(e, t) {
87
- let n = t.getBoundingClientRect(), r = e.clientY - n.top, i = n.height;
88
- return r < i * .25 ? "before" : r > i * .75 ? "after" : U() ? "inside" : r < i * .5 ? "before" : "after";
89
- }
90
- function se(e) {
91
- if (!P || P.drag.dragId === j.id || j.disabled) return;
92
- e.preventDefault(), e.stopPropagation(), e.dataTransfer && (e.dataTransfer.dropEffect = "move");
93
- let t = e.currentTarget.querySelector(".nb-tree-node__label");
94
- t && P.onDragOver(j.id, oe(e, t));
95
- }
96
- function ce(e) {
97
- if (!P) return;
98
- let t = e.relatedTarget, n = e.currentTarget;
99
- (!t || !n.contains(t)) && P.onDragLeave(j.id);
100
- }
101
- function le(e) {
102
- e.preventDefault(), e.stopPropagation(), P && P.onDrop();
103
- }
104
- function ue() {
105
- P && P.onDragEnd();
106
- }
107
- function de(e) {
108
- P && (e.key === "Enter" ? (e.preventDefault(), $()) : e.key === "ArrowRight" && H() ? (e.preventDefault(), W.value || (P.toggle(j.id), M("toggle", j.id, !0))) : e.key === "ArrowLeft" ? (e.preventDefault(), W.value && (P.toggle(j.id), M("toggle", j.id, !1))) : e.key === "F2" && (e.preventDefault(), M("dblclick", j.id)));
109
- }
110
- return (n, r) => (y(), u("li", {
111
- role: "treeitem",
112
- tabindex: "-1",
113
- draggable: Y.value || void 0,
114
- "aria-expanded": H() ? W.value : void 0,
115
- "aria-selected": G.value,
116
- "aria-disabled": e.disabled || void 0,
117
- "aria-grabbed": Y.value ? X.value : void 0,
118
- class: g(["nb-tree-node", {
119
- "nb-tree-node--selected": G.value,
120
- "nb-tree-node--disabled": e.disabled,
121
- "nb-tree-node--branch": H(),
122
- "nb-tree-node--leaf": !H(),
123
- "nb-tree-node--dragging": X.value,
124
- "nb-tree-node--drop-before": Q.value === "before",
125
- "nb-tree-node--drop-after": Q.value === "after",
126
- "nb-tree-node--drop-inside": Q.value === "inside"
127
- }]),
128
- onClick: T($, ["stop"]),
129
- onDblclick: T(re, ["stop"]),
130
- onContextmenu: T(ie, ["prevent"]),
131
- onKeydown: de,
132
- onDragstart: ae,
133
- onDragover: se,
134
- onDragleave: ce,
135
- onDrop: le,
136
- onDragend: ue
137
- }, [d("div", {
138
- class: "nb-tree-node__label",
139
- style: _({
140
- minHeight: q.value,
141
- paddingInlineStart: J.value
142
- })
143
- }, [
144
- H() ? (y(), u("span", {
145
- key: 0,
146
- class: "nb-tree-node__toggle",
147
- onClick: ne
148
- }, [p(t, {
149
- name: C(E),
150
- size: "xs",
151
- class: g(["nb-tree-node__toggle-icon", { "nb-tree-node__toggle-icon--expanded": W.value }])
152
- }, null, 8, ["name", "class"])])) : (y(), u("span", O)),
153
- e.icon ? (y(), c(t, {
154
- key: 2,
155
- name: e.icon,
156
- size: "sm",
157
- class: "nb-tree-node__icon"
158
- }, null, 8, ["name"])) : l("", !0),
159
- d("span", te, [x(n.$slots, "label", {}, () => [f(S(e.label), 1)], !0)]),
160
- n.$slots.actions ? (y(), u("span", k, [x(n.$slots, "actions", {}, void 0, !0)])) : l("", !0)
161
- ], 4), H() && W.value ? (y(), u("ul", A, [x(n.$slots, "default", {}, void 0, !0)])) : l("", !0)], 42, D));
162
- }
163
- }), [["__scopeId", "data-v-56d9a66a"]]);
164
- //#endregion
165
- export { j as t };
@@ -1 +0,0 @@
1
- require(`./chunk-D-qHiVGv.cjs`);const e=require(`./_plugin-vue_export-helper-tagjRzOz.cjs`),t=require(`./Icon-C8R_r_In.cjs`),n=require(`./TreeContext-BH2qpPud.cjs`);let r=require(`vue`),i=require(`@nubisco/ui/icons/caret-right`);var a=[`draggable`,`aria-expanded`,`aria-selected`,`aria-disabled`,`aria-grabbed`],o={key:1,class:`nb-tree-node__toggle-spacer`},s={class:`nb-tree-node__label-text`},c={key:3,class:`nb-tree-node__actions`},l={key:0,role:`group`,class:`nb-tree-node__children`},u=(0,r.defineComponent)({__name:`TreeNode`,props:{id:{},label:{},icon:{default:void 0},disabled:{type:Boolean,default:!1},depth:{default:null},draggable:{type:[Boolean,null],default:null},expandable:{type:[Boolean,null],default:null},droppable:{type:[Boolean,null],default:null}},emits:[`select`,`toggle`,`contextmenu`,`dblclick`],setup(e,{emit:u}){let d=e,f=u,p=(0,r.useSlots)(),m=(0,r.inject)(n.n),h=(0,r.inject)(n.t,0),g=(0,r.computed)(()=>d.depth??h);(0,r.provide)(n.t,g.value+1);let _=0,v=-1,y=!1;(0,r.onBeforeMount)(()=>_++),(0,r.onBeforeUpdate)(()=>_++);function b(e){return!!e?.some(e=>e.type===r.Comment?!1:e.type===r.Fragment?b(e.children):e.type===r.Text?String(e.children??``).trim()!==``:!0)}function x(){return v!==_&&(v=_,y=b(p.default?.())),y}function S(){return d.expandable??x()}function C(){return d.droppable??S()}let w=(0,r.computed)(()=>m?.expandedIds.has(d.id)??!1),T=(0,r.computed)(()=>m?.selectedId===d.id),E=(0,r.computed)(()=>m?.compact??!1),D=(0,r.computed)(()=>E.value?`24px`:`32px`),O=(0,r.computed)(()=>`${16+g.value*16}px`),k=(0,r.computed)(()=>d.disabled?!1:d.draggable===null?m?.draggable??!1:d.draggable),A=(0,r.computed)(()=>m?.drag.dragId===d.id),j=(0,r.computed)(()=>m?.drag.dropTargetId===d.id),M=(0,r.computed)(()=>j.value?m?.drag.dropPosition:null);function N(){d.disabled||!m||(m.select(d.id),f(`select`,d.id),S()&&(m.toggle(d.id),f(`toggle`,d.id,!w.value)))}function P(e){e.stopPropagation(),!(d.disabled||!m)&&(m.toggle(d.id),f(`toggle`,d.id,!w.value))}function F(){d.disabled||(S()&&m&&m.toggle(d.id),f(`dblclick`,d.id))}function I(e){f(`contextmenu`,e,d.id)}function L(e){e.target?.closest?.(`.nb-tree-node`)===e.currentTarget&&(!k.value||!m||!e.dataTransfer||(e.dataTransfer.effectAllowed=`move`,e.dataTransfer.setData(`text/plain`,d.id),m.onDragStart(d.id)))}function R(e,t){let n=t.getBoundingClientRect(),r=e.clientY-n.top,i=n.height;return r<i*.25?`before`:r>i*.75?`after`:C()?`inside`:r<i*.5?`before`:`after`}function z(e){if(!m||m.drag.dragId===d.id||d.disabled)return;e.preventDefault(),e.stopPropagation(),e.dataTransfer&&(e.dataTransfer.dropEffect=`move`);let t=e.currentTarget.querySelector(`.nb-tree-node__label`);t&&m.onDragOver(d.id,R(e,t))}function B(e){if(!m)return;let t=e.relatedTarget,n=e.currentTarget;(!t||!n.contains(t))&&m.onDragLeave(d.id)}function V(e){e.preventDefault(),e.stopPropagation(),m&&m.onDrop()}function H(){m&&m.onDragEnd()}function U(e){m&&(e.key===`Enter`?(e.preventDefault(),N()):e.key===`ArrowRight`&&S()?(e.preventDefault(),w.value||(m.toggle(d.id),f(`toggle`,d.id,!0))):e.key===`ArrowLeft`?(e.preventDefault(),w.value&&(m.toggle(d.id),f(`toggle`,d.id,!1))):e.key===`F2`&&(e.preventDefault(),f(`dblclick`,d.id)))}return(n,u)=>((0,r.openBlock)(),(0,r.createElementBlock)(`li`,{role:`treeitem`,tabindex:`-1`,draggable:k.value||void 0,"aria-expanded":S()?w.value:void 0,"aria-selected":T.value,"aria-disabled":e.disabled||void 0,"aria-grabbed":k.value?A.value:void 0,class:(0,r.normalizeClass)([`nb-tree-node`,{"nb-tree-node--selected":T.value,"nb-tree-node--disabled":e.disabled,"nb-tree-node--branch":S(),"nb-tree-node--leaf":!S(),"nb-tree-node--dragging":A.value,"nb-tree-node--drop-before":M.value===`before`,"nb-tree-node--drop-after":M.value===`after`,"nb-tree-node--drop-inside":M.value===`inside`}]),onClick:(0,r.withModifiers)(N,[`stop`]),onDblclick:(0,r.withModifiers)(F,[`stop`]),onContextmenu:(0,r.withModifiers)(I,[`prevent`]),onKeydown:U,onDragstart:L,onDragover:z,onDragleave:B,onDrop:V,onDragend:H},[(0,r.createElementVNode)(`div`,{class:`nb-tree-node__label`,style:(0,r.normalizeStyle)({minHeight:D.value,paddingInlineStart:O.value})},[S()?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,{key:0,class:`nb-tree-node__toggle`,onClick:P},[(0,r.createVNode)(t.t,{name:(0,r.unref)(i.regular),size:`xs`,class:(0,r.normalizeClass)([`nb-tree-node__toggle-icon`,{"nb-tree-node__toggle-icon--expanded":w.value}])},null,8,[`name`,`class`])])):((0,r.openBlock)(),(0,r.createElementBlock)(`span`,o)),e.icon?((0,r.openBlock)(),(0,r.createBlock)(t.t,{key:2,name:e.icon,size:`sm`,class:`nb-tree-node__icon`},null,8,[`name`])):(0,r.createCommentVNode)(``,!0),(0,r.createElementVNode)(`span`,s,[(0,r.renderSlot)(n.$slots,`label`,{},()=>[(0,r.createTextVNode)((0,r.toDisplayString)(e.label),1)],!0)]),n.$slots.actions?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,c,[(0,r.renderSlot)(n.$slots,`actions`,{},void 0,!0)])):(0,r.createCommentVNode)(``,!0)],4),S()&&w.value?((0,r.openBlock)(),(0,r.createElementBlock)(`ul`,l,[(0,r.renderSlot)(n.$slots,`default`,{},void 0,!0)])):(0,r.createCommentVNode)(``,!0)],42,a))}}),d=e.t(u,[[`__scopeId`,`data-v-56d9a66a`]]);Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return d}});