@oneb/ui-vue 0.0.5 → 0.0.7
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.
- package/README.md +7 -4
- package/dist/dropdown/index.cjs +1 -1
- package/dist/dropdown/index.js +1 -1
- package/dist/dropdown/menu.d.ts +8 -0
- package/dist/{index-6f93552a.js → index-8ee43fa4.js} +124 -115
- package/dist/index-f88ecb85.cjs +1 -0
- package/dist/index.cjs +1 -1
- package/dist/index.js +1 -1
- package/package.json +5 -1
- package/dist/index-26c86446.cjs +0 -1
package/README.md
CHANGED
|
@@ -19,27 +19,30 @@
|
|
|
19
19
|
</template>
|
|
20
20
|
|
|
21
21
|
<script setup>
|
|
22
|
-
import { OneButton, OneLink, OneCard, OneCardHeader, OneCardBody } from '
|
|
22
|
+
import { OneButton, OneLink, OneCard, OneCardHeader, OneCardBody } from '@oneb/ui-vue'
|
|
23
23
|
</script>
|
|
24
24
|
```
|
|
25
25
|
|
|
26
26
|
## Setup
|
|
27
27
|
|
|
28
28
|
### 1. src/assets/mains.css
|
|
29
|
-
add line: `@import '
|
|
29
|
+
add line: `@import '@oneb/ui-vue/style.css';`
|
|
30
30
|
add line: `@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&display=swap');`
|
|
31
31
|
|
|
32
32
|
### 2. tailwind.config.cjs
|
|
33
33
|
|
|
34
34
|
1. Import config `const onebui = require('onebui-vue/tailwind.config')`
|
|
35
|
-
2. Add `'
|
|
35
|
+
2. Add `'./node_modules/@oneb/ui-vue/dist/**/*.{vue,js,ts,jsx,tsx}'` to `content`
|
|
36
36
|
3. Extend config
|
|
37
37
|
|
|
38
38
|
```
|
|
39
39
|
const onebui = require('onebui-vue/tailwind.config')
|
|
40
40
|
|
|
41
41
|
module.exports = {
|
|
42
|
-
content: [
|
|
42
|
+
content: [
|
|
43
|
+
...,
|
|
44
|
+
"./node_modules/@oneb/ui-vue/dist/**/*.{vue,js,ts,jsx,tsx}"
|
|
45
|
+
],
|
|
43
46
|
theme: onebui.theme,
|
|
44
47
|
plugins: [require('@tailwindcss/forms')]
|
|
45
48
|
}
|
package/dist/dropdown/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-f88ecb85.cjs");require("vue");require("../_plugin-vue_export-helper-f246444f.cjs");exports.OneBrowserMenu=e._sfc_main$3;exports.OneDropdown=e._sfc_main;exports.OneDropdownDivider=e.OneDropdownDivider;exports.OneDropdownItem=e._sfc_main$1;exports.OneUserMenu=e._sfc_main$2;
|
package/dist/dropdown/index.js
CHANGED
package/dist/dropdown/menu.d.ts
CHANGED
|
@@ -16,6 +16,10 @@ export declare const userMenuProps: {
|
|
|
16
16
|
}[]>;
|
|
17
17
|
default: () => any[];
|
|
18
18
|
};
|
|
19
|
+
iconSize: {
|
|
20
|
+
type: StringConstructor;
|
|
21
|
+
default: string;
|
|
22
|
+
};
|
|
19
23
|
accountLabel: {
|
|
20
24
|
type: StringConstructor;
|
|
21
25
|
default: string;
|
|
@@ -48,6 +52,10 @@ export declare const browserMenuProps: {
|
|
|
48
52
|
}[]>;
|
|
49
53
|
required: boolean;
|
|
50
54
|
};
|
|
55
|
+
iconSize: {
|
|
56
|
+
type: StringConstructor;
|
|
57
|
+
default: string;
|
|
58
|
+
};
|
|
51
59
|
appsTitle: {
|
|
52
60
|
type: StringConstructor;
|
|
53
61
|
default: string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { _ as
|
|
3
|
-
const
|
|
1
|
+
import { defineComponent as x, ref as z, provide as M, computed as g, openBlock as l, createElementBlock as u, renderSlot as A, normalizeProps as L, guardReactiveProps as O, createCommentVNode as m, createVNode as y, Transition as P, withCtx as v, normalizeClass as _, toDisplayString as h, inject as F, withModifiers as T, createBlock as k, resolveDynamicComponent as q, createElementVNode as t, normalizeStyle as w, unref as S, Fragment as j, renderList as B, mergeProps as N } from "vue";
|
|
2
|
+
import { _ as R } from "./_plugin-vue_export-helper-dad06003.js";
|
|
3
|
+
const V = {
|
|
4
4
|
title: {
|
|
5
5
|
type: String
|
|
6
6
|
},
|
|
@@ -8,7 +8,7 @@ const R = {
|
|
|
8
8
|
type: String,
|
|
9
9
|
default: "right"
|
|
10
10
|
}
|
|
11
|
-
},
|
|
11
|
+
}, E = {
|
|
12
12
|
variant: {
|
|
13
13
|
type: String,
|
|
14
14
|
default: "primary"
|
|
@@ -19,24 +19,24 @@ const R = {
|
|
|
19
19
|
icon: {
|
|
20
20
|
type: [Function, Object]
|
|
21
21
|
}
|
|
22
|
-
},
|
|
22
|
+
}, H = ["data-opened"], I = {
|
|
23
23
|
key: 0,
|
|
24
24
|
class: "text-sm text-secondary-content px-3 py-2 text-left"
|
|
25
|
-
},
|
|
25
|
+
}, D = /* @__PURE__ */ x({
|
|
26
26
|
__name: "OneDropdown",
|
|
27
|
-
props:
|
|
27
|
+
props: V,
|
|
28
28
|
emits: ["open"],
|
|
29
29
|
setup(p, { emit: n }) {
|
|
30
30
|
const d = p, c = z(!1), r = z(null), s = () => {
|
|
31
31
|
c.value = !c.value, c.value && n("open");
|
|
32
32
|
};
|
|
33
|
-
|
|
33
|
+
M("OneDropdown", {
|
|
34
34
|
onToggle: s
|
|
35
35
|
});
|
|
36
36
|
const e = g(() => {
|
|
37
37
|
const o = r.value != null && r.value.offsetLeft < 270;
|
|
38
38
|
return r.value != null && r.value.offsetTop + 270 > window.innerHeight ? "up" + (o ? "-right" : "-left") : "down" + (o ? "-right" : "-left");
|
|
39
|
-
}),
|
|
39
|
+
}), i = g(() => {
|
|
40
40
|
const o = [
|
|
41
41
|
"absolute z-10 w-fit rounded-md bg-white",
|
|
42
42
|
"py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none",
|
|
@@ -44,19 +44,19 @@ const R = {
|
|
|
44
44
|
];
|
|
45
45
|
return e.value === "up" ? o.push("bottom-1 mb-10") : e.value === "down" ? o.push("top-1 mt-10") : e.value === "up-right" ? o.push("left-0 bottom-1 mb-10") : e.value === "down-right" && o.push("left-0 top-1 mt-10"), d.stick === "right" ? o.push("right-0") : d.stick === "left" && o.push("left-0"), o;
|
|
46
46
|
});
|
|
47
|
-
return (o, a) => (
|
|
47
|
+
return (o, a) => (l(), u("div", {
|
|
48
48
|
class: "relative inline-block",
|
|
49
49
|
ref_key: "menuRef",
|
|
50
50
|
ref: r,
|
|
51
51
|
"data-opened": c.value
|
|
52
52
|
}, [
|
|
53
|
-
|
|
54
|
-
c.value ? (
|
|
53
|
+
A(o.$slots, "button", L(O({ onToggle: s, isExpanded: c.value }))),
|
|
54
|
+
c.value ? (l(), u("div", {
|
|
55
55
|
key: 0,
|
|
56
56
|
class: "fixed top-0 left-0 w-screen h-screen z-10",
|
|
57
57
|
onClick: s
|
|
58
58
|
})) : m("", !0),
|
|
59
|
-
y(
|
|
59
|
+
y(P, {
|
|
60
60
|
"enter-active-class": "transition ease-out duration-100",
|
|
61
61
|
"enter-from-class": "transform opacity-0 scale-95",
|
|
62
62
|
"enter-to-class": "transform opacity-100 scale-100",
|
|
@@ -64,49 +64,49 @@ const R = {
|
|
|
64
64
|
"leave-from-class": "transform opacity-100 scale-100",
|
|
65
65
|
"leave-to-class": "transform opacity-0 scale-95"
|
|
66
66
|
}, {
|
|
67
|
-
default:
|
|
68
|
-
c.value ? (
|
|
67
|
+
default: v(() => [
|
|
68
|
+
c.value ? (l(), u("div", {
|
|
69
69
|
key: 0,
|
|
70
|
-
class: _(["menu",
|
|
70
|
+
class: _(["menu", i.value]),
|
|
71
71
|
role: "menu",
|
|
72
72
|
"aria-orientation": "vertical",
|
|
73
73
|
tabindex: "-1"
|
|
74
74
|
}, [
|
|
75
|
-
o.title ? (
|
|
76
|
-
|
|
75
|
+
o.title ? (l(), u("div", I, h(o.title), 1)) : m("", !0),
|
|
76
|
+
A(o.$slots, "menu", L(O({ onToggle: s })))
|
|
77
77
|
], 2)) : m("", !0)
|
|
78
78
|
]),
|
|
79
79
|
_: 3
|
|
80
80
|
})
|
|
81
|
-
], 8,
|
|
81
|
+
], 8, H));
|
|
82
82
|
}
|
|
83
|
-
}),
|
|
83
|
+
}), U = ["onClick"], $ = /* @__PURE__ */ x({
|
|
84
84
|
__name: "OneDropdownItem",
|
|
85
|
-
props:
|
|
85
|
+
props: E,
|
|
86
86
|
emits: ["click"],
|
|
87
87
|
setup(p, { emit: n }) {
|
|
88
|
-
const d = p, c =
|
|
88
|
+
const d = p, c = F("OneDropdown"), r = () => {
|
|
89
89
|
c !== void 0 && c.onToggle(), n("click");
|
|
90
90
|
}, s = g(() => {
|
|
91
91
|
const e = [];
|
|
92
92
|
return d.variant === "secondary" ? e.push("text-secondary-content hover:bg-secondary-body-hover") : d.variant === "danger" ? e.push("text-danger-content hover:bg-danger-10") : d.variant === "warning" ? e.push("text-warning-content hover:bg-warning-10") : d.variant === "info" ? e.push("text-info-content hover:bg-info-10") : e.push("hover:bg-secondary-body-hover"), e;
|
|
93
93
|
});
|
|
94
|
-
return (e,
|
|
94
|
+
return (e, i) => (l(), u("button", {
|
|
95
95
|
class: _(["px-3 py-1.5 flex items-center space-x-3 w-full whitespace-nowrap", s.value]),
|
|
96
|
-
onClick:
|
|
96
|
+
onClick: T(r, ["prevent"])
|
|
97
97
|
}, [
|
|
98
|
-
e.icon ? (
|
|
98
|
+
e.icon ? (l(), k(q(e.icon), {
|
|
99
99
|
key: 0,
|
|
100
100
|
class: "w-4 h-4"
|
|
101
101
|
})) : m("", !0),
|
|
102
|
-
t("span", null,
|
|
103
|
-
], 10,
|
|
102
|
+
t("span", null, h(e.label), 1)
|
|
103
|
+
], 10, U));
|
|
104
104
|
}
|
|
105
|
-
}),
|
|
106
|
-
function
|
|
107
|
-
return
|
|
105
|
+
}), G = {}, J = { class: "border-t border-secondary-stroke my-1" };
|
|
106
|
+
function K(p, n) {
|
|
107
|
+
return l(), u("div", J);
|
|
108
108
|
}
|
|
109
|
-
const xe = /* @__PURE__ */
|
|
109
|
+
const xe = /* @__PURE__ */ R(G, [["render", K]]), Q = {
|
|
110
110
|
size: {
|
|
111
111
|
type: [String, Number],
|
|
112
112
|
default: "50"
|
|
@@ -124,18 +124,18 @@ const xe = /* @__PURE__ */ N(U, [["render", J]]), K = {
|
|
|
124
124
|
type: [String, null],
|
|
125
125
|
required: !1
|
|
126
126
|
}
|
|
127
|
-
},
|
|
127
|
+
}, W = ["src"], b = /* @__PURE__ */ x({
|
|
128
128
|
__name: "OneAvatar",
|
|
129
|
-
props:
|
|
129
|
+
props: Q,
|
|
130
130
|
setup(p) {
|
|
131
131
|
const n = p, d = g(() => {
|
|
132
132
|
const e = n.text.trim().split(" ");
|
|
133
|
-
return e.length < 2 ? n.text.slice(0, 2).toUpperCase() : e.map((
|
|
133
|
+
return e.length < 2 ? n.text.slice(0, 2).toUpperCase() : e.map((i) => i.slice(0, 1)).join("").toUpperCase();
|
|
134
134
|
}), c = g(() => ({
|
|
135
135
|
fill: "rgba(255, 255, 255, .75)",
|
|
136
136
|
fontSize: `${Number(n.size) * 0.4}px`
|
|
137
137
|
})), r = g(() => {
|
|
138
|
-
const e = n.text.split("").map((a) => a.charCodeAt(0)).reduce((a,
|
|
138
|
+
const e = n.text.split("").map((a) => a.charCodeAt(0)).reduce((a, f) => a + f, 0), o = `hsl(${360 / 26 * e}, 68%, 48%)`;
|
|
139
139
|
return {
|
|
140
140
|
width: `${n.size}px`,
|
|
141
141
|
height: `${n.size}px`,
|
|
@@ -147,35 +147,35 @@ const xe = /* @__PURE__ */ N(U, [["render", J]]), K = {
|
|
|
147
147
|
height: `${n.size}px`,
|
|
148
148
|
borderRadius: n.rounded ? "100%" : "9%"
|
|
149
149
|
}));
|
|
150
|
-
return (e,
|
|
151
|
-
style:
|
|
150
|
+
return (e, i) => (l(), u("div", {
|
|
151
|
+
style: w(s.value),
|
|
152
152
|
class: "overflow-hidden"
|
|
153
153
|
}, [
|
|
154
|
-
e.src ? (
|
|
154
|
+
e.src ? (l(), u("img", {
|
|
155
155
|
key: 0,
|
|
156
156
|
src: e.src,
|
|
157
157
|
alt: "",
|
|
158
158
|
class: "w-full h-full"
|
|
159
|
-
}, null, 8,
|
|
159
|
+
}, null, 8, W)) : (l(), u("svg", {
|
|
160
160
|
key: 1,
|
|
161
|
-
style:
|
|
161
|
+
style: w(r.value),
|
|
162
162
|
class: "block"
|
|
163
163
|
}, [
|
|
164
|
-
d.value ? (
|
|
164
|
+
d.value ? (l(), u("text", {
|
|
165
165
|
key: 0,
|
|
166
166
|
x: "50%",
|
|
167
167
|
y: "50%",
|
|
168
168
|
"text-anchor": "middle",
|
|
169
169
|
"dominant-baseline": "central",
|
|
170
170
|
class: "font-light",
|
|
171
|
-
style:
|
|
172
|
-
},
|
|
171
|
+
style: w(c.value)
|
|
172
|
+
}, h(d.value), 5)) : m("", !0)
|
|
173
173
|
], 4))
|
|
174
174
|
], 4));
|
|
175
175
|
}
|
|
176
176
|
});
|
|
177
|
-
function
|
|
178
|
-
return
|
|
177
|
+
function X(p, n) {
|
|
178
|
+
return l(), u("svg", {
|
|
179
179
|
xmlns: "http://www.w3.org/2000/svg",
|
|
180
180
|
fill: "none",
|
|
181
181
|
viewBox: "0 0 24 24",
|
|
@@ -190,8 +190,8 @@ function W(p, n) {
|
|
|
190
190
|
})
|
|
191
191
|
]);
|
|
192
192
|
}
|
|
193
|
-
function
|
|
194
|
-
return
|
|
193
|
+
function Y(p, n) {
|
|
194
|
+
return l(), u("svg", {
|
|
195
195
|
xmlns: "http://www.w3.org/2000/svg",
|
|
196
196
|
fill: "none",
|
|
197
197
|
viewBox: "0 0 24 24",
|
|
@@ -206,7 +206,7 @@ function X(p, n) {
|
|
|
206
206
|
})
|
|
207
207
|
]);
|
|
208
208
|
}
|
|
209
|
-
const
|
|
209
|
+
const Z = {
|
|
210
210
|
user: {
|
|
211
211
|
type: Object,
|
|
212
212
|
required: !0
|
|
@@ -215,6 +215,10 @@ const Y = {
|
|
|
215
215
|
type: Array,
|
|
216
216
|
default: () => []
|
|
217
217
|
},
|
|
218
|
+
iconSize: {
|
|
219
|
+
type: String,
|
|
220
|
+
default: "34"
|
|
221
|
+
},
|
|
218
222
|
accountLabel: {
|
|
219
223
|
type: String,
|
|
220
224
|
default: "Account"
|
|
@@ -229,7 +233,7 @@ const Y = {
|
|
|
229
233
|
onLogout: {
|
|
230
234
|
type: Function
|
|
231
235
|
}
|
|
232
|
-
},
|
|
236
|
+
}, ee = {
|
|
233
237
|
workspace: {
|
|
234
238
|
type: Object,
|
|
235
239
|
required: !0
|
|
@@ -238,6 +242,10 @@ const Y = {
|
|
|
238
242
|
type: Array,
|
|
239
243
|
required: !0
|
|
240
244
|
},
|
|
245
|
+
iconSize: {
|
|
246
|
+
type: String,
|
|
247
|
+
default: "24"
|
|
248
|
+
},
|
|
241
249
|
appsTitle: {
|
|
242
250
|
type: String,
|
|
243
251
|
default: "Apps"
|
|
@@ -252,23 +260,23 @@ const Y = {
|
|
|
252
260
|
onApp: {
|
|
253
261
|
type: Function
|
|
254
262
|
}
|
|
255
|
-
},
|
|
263
|
+
}, te = ["onClick"], ne = {
|
|
256
264
|
class: "space-y-2 text-center py-6",
|
|
257
265
|
style: { width: "240px" }
|
|
258
|
-
},
|
|
266
|
+
}, oe = { class: "text-sm text-secondary-content" }, re = { class: "px-2" }, we = /* @__PURE__ */ x({
|
|
259
267
|
__name: "OneUserMenu",
|
|
260
|
-
props:
|
|
268
|
+
props: Z,
|
|
261
269
|
setup(p) {
|
|
262
270
|
const n = p, d = g(() => {
|
|
263
271
|
var s;
|
|
264
272
|
return (s = n.menu) == null ? void 0 : s.map((e) => {
|
|
265
|
-
let
|
|
266
|
-
e.icon != null && (
|
|
273
|
+
let i = { label: e.label };
|
|
274
|
+
e.icon != null && (i = { ...i, icon: e.icon });
|
|
267
275
|
const o = typeof e.click == "function" ? e.click : () => {
|
|
268
276
|
};
|
|
269
277
|
return {
|
|
270
278
|
key: e.label,
|
|
271
|
-
args:
|
|
279
|
+
args: i,
|
|
272
280
|
click: o
|
|
273
281
|
};
|
|
274
282
|
});
|
|
@@ -277,54 +285,55 @@ const Y = {
|
|
|
277
285
|
}, r = () => {
|
|
278
286
|
typeof n.onLogout == "function" && n.onLogout();
|
|
279
287
|
};
|
|
280
|
-
return (s, e) => (
|
|
281
|
-
button:
|
|
282
|
-
var a,
|
|
288
|
+
return (s, e) => (l(), k(D, { stick: "right" }, {
|
|
289
|
+
button: v(({ onToggle: i, isExpanded: o }) => {
|
|
290
|
+
var a, f;
|
|
283
291
|
return [
|
|
284
292
|
t("button", {
|
|
285
|
-
onClick:
|
|
293
|
+
onClick: i,
|
|
286
294
|
class: _(["p-1 rounded-full hover:bg-secondary-10", [o ? "bg-secondary-25" : ""]])
|
|
287
295
|
}, [
|
|
288
|
-
y(
|
|
296
|
+
y(b, {
|
|
289
297
|
text: ((a = s.user) == null ? void 0 : a.name) || "",
|
|
290
|
-
size:
|
|
291
|
-
src: (
|
|
298
|
+
size: s.iconSize,
|
|
299
|
+
src: (f = s.user) == null ? void 0 : f.photo_url,
|
|
292
300
|
rounded: !0
|
|
293
|
-
}, null, 8, ["text", "src"])
|
|
294
|
-
], 10,
|
|
301
|
+
}, null, 8, ["text", "size", "src"])
|
|
302
|
+
], 10, te)
|
|
295
303
|
];
|
|
296
304
|
}),
|
|
297
|
-
menu:
|
|
298
|
-
var
|
|
305
|
+
menu: v(() => {
|
|
306
|
+
var i, o, a, f;
|
|
299
307
|
return [
|
|
300
|
-
t("div",
|
|
308
|
+
t("div", ne, [
|
|
301
309
|
t("div", null, [
|
|
302
|
-
y(
|
|
303
|
-
text: ((
|
|
310
|
+
y(b, {
|
|
311
|
+
text: ((i = s.user) == null ? void 0 : i.name) || "",
|
|
304
312
|
size: 80,
|
|
313
|
+
src: (o = s.user) == null ? void 0 : o.photo_url,
|
|
305
314
|
rounded: !0,
|
|
306
315
|
class: "mx-auto"
|
|
307
|
-
}, null, 8, ["text"])
|
|
316
|
+
}, null, 8, ["text", "src"])
|
|
308
317
|
]),
|
|
309
318
|
t("div", null, [
|
|
310
|
-
t("div", null,
|
|
311
|
-
t("div",
|
|
319
|
+
t("div", null, h((a = s.user) == null ? void 0 : a.name), 1),
|
|
320
|
+
t("div", oe, h((f = s.user) == null ? void 0 : f.email), 1)
|
|
312
321
|
])
|
|
313
322
|
]),
|
|
314
|
-
t("div",
|
|
315
|
-
y(
|
|
316
|
-
icon:
|
|
323
|
+
t("div", re, [
|
|
324
|
+
y($, {
|
|
325
|
+
icon: S(X),
|
|
317
326
|
label: s.accountLabel,
|
|
318
327
|
class: "rounded",
|
|
319
328
|
onClick: c
|
|
320
329
|
}, null, 8, ["icon", "label"]),
|
|
321
|
-
(
|
|
322
|
-
key:
|
|
323
|
-
},
|
|
324
|
-
onClick:
|
|
330
|
+
(l(!0), u(j, null, B(d.value, (C) => (l(), k($, N({
|
|
331
|
+
key: C.key
|
|
332
|
+
}, C.args, {
|
|
333
|
+
onClick: C.click
|
|
325
334
|
}), null, 16, ["onClick"]))), 128)),
|
|
326
|
-
y(
|
|
327
|
-
icon:
|
|
335
|
+
y($, {
|
|
336
|
+
icon: S(Y),
|
|
328
337
|
label: s.logoutLabel,
|
|
329
338
|
class: "rounded",
|
|
330
339
|
onClick: r
|
|
@@ -336,8 +345,8 @@ const Y = {
|
|
|
336
345
|
}));
|
|
337
346
|
}
|
|
338
347
|
});
|
|
339
|
-
function
|
|
340
|
-
return
|
|
348
|
+
function se(p, n) {
|
|
349
|
+
return l(), u("svg", {
|
|
341
350
|
xmlns: "http://www.w3.org/2000/svg",
|
|
342
351
|
fill: "none",
|
|
343
352
|
viewBox: "0 0 24 24",
|
|
@@ -428,70 +437,70 @@ function re(p, n) {
|
|
|
428
437
|
})
|
|
429
438
|
]);
|
|
430
439
|
}
|
|
431
|
-
const
|
|
440
|
+
const ie = ["onClick"], le = {
|
|
432
441
|
class: "space-x-2 flex items-center px-3 py-2",
|
|
433
442
|
style: { width: "300px" }
|
|
434
|
-
},
|
|
443
|
+
}, ce = { class: "flex-shrink-0" }, ae = { class: "w-full text-left" }, ue = { class: "flex-shrink-0" }, de = { class: "px-3 py-2 border-t border-secondary-stroke" }, pe = { class: "text-secondary-content text-left pb-1 text-sm" }, he = { class: "grid grid-cols-3 gap-1" }, fe = ["onClick"], ge = { class: "block bg-white mx-auto flex-shrink-0 border border-secondary-stroke p-1 rounded-lg" }, ye = { class: "w-full overflow-hidden text-ellipsis whitespace-nowrap text-center text-sm mt-1" }, ke = /* @__PURE__ */ x({
|
|
435
444
|
__name: "OneBrowserMenu",
|
|
436
|
-
props:
|
|
445
|
+
props: ee,
|
|
437
446
|
setup(p) {
|
|
438
447
|
const n = p, d = () => {
|
|
439
448
|
typeof n.onChange == "function" && n.onChange();
|
|
440
449
|
}, c = (r) => {
|
|
441
450
|
typeof n.onApp == "function" && n.onApp(r);
|
|
442
451
|
};
|
|
443
|
-
return (r, s) => (
|
|
444
|
-
button:
|
|
452
|
+
return (r, s) => (l(), k(D, { stick: "right" }, {
|
|
453
|
+
button: v(({ onToggle: e, isExpanded: i }) => [
|
|
445
454
|
t("button", {
|
|
446
455
|
onClick: e,
|
|
447
|
-
class: _(["p-1 rounded-md hover:bg-secondary-10", [
|
|
456
|
+
class: _(["p-1 rounded-md hover:bg-secondary-10", [i ? "bg-secondary-25" : ""]])
|
|
448
457
|
}, [
|
|
449
|
-
y(
|
|
458
|
+
y(S(se), {
|
|
450
459
|
class: "text-secondary-base",
|
|
451
|
-
style:
|
|
452
|
-
})
|
|
453
|
-
], 10,
|
|
460
|
+
style: w(`width: ${r.iconSize}px; height: ${r.iconSize}px`)
|
|
461
|
+
}, null, 8, ["style"])
|
|
462
|
+
], 10, ie)
|
|
454
463
|
]),
|
|
455
|
-
menu:
|
|
456
|
-
var e,
|
|
464
|
+
menu: v(() => {
|
|
465
|
+
var e, i, o;
|
|
457
466
|
return [
|
|
458
467
|
t("div", le, [
|
|
459
|
-
t("div",
|
|
460
|
-
y(
|
|
468
|
+
t("div", ce, [
|
|
469
|
+
y(b, {
|
|
461
470
|
text: ((e = r.workspace) == null ? void 0 : e.name) || "",
|
|
462
|
-
src: (
|
|
471
|
+
src: (i = r.workspace) == null ? void 0 : i.photo_url,
|
|
463
472
|
size: 44,
|
|
464
473
|
rounded: !1,
|
|
465
474
|
class: "mx-auto"
|
|
466
475
|
}, null, 8, ["text", "src"])
|
|
467
476
|
]),
|
|
468
|
-
t("div",
|
|
469
|
-
t("div",
|
|
477
|
+
t("div", ae, h((o = r.workspace) == null ? void 0 : o.name), 1),
|
|
478
|
+
t("div", ue, [
|
|
470
479
|
t("button", {
|
|
471
480
|
class: "text-sm border border-secondary-stroke rounded px-2 py-0.5 text-secondary-content hover:text-primary-content",
|
|
472
481
|
onClick: d
|
|
473
|
-
},
|
|
482
|
+
}, h(r.changeLabel), 1)
|
|
474
483
|
])
|
|
475
484
|
]),
|
|
476
|
-
t("div",
|
|
477
|
-
t("div",
|
|
478
|
-
t("div",
|
|
479
|
-
(
|
|
485
|
+
t("div", de, [
|
|
486
|
+
t("div", pe, h(r.appsTitle), 1),
|
|
487
|
+
t("div", he, [
|
|
488
|
+
(l(!0), u(j, null, B(r.apps, (a) => (l(), u("button", {
|
|
480
489
|
key: a.id,
|
|
481
|
-
onClick: (
|
|
490
|
+
onClick: (f) => c(a),
|
|
482
491
|
class: "p-1.5 flex flex-col items-center justify-center rounded hover:bg-secondary-10",
|
|
483
492
|
style: { width: "88px", height: "88px" }
|
|
484
493
|
}, [
|
|
485
|
-
t("span",
|
|
486
|
-
y(
|
|
494
|
+
t("span", ge, [
|
|
495
|
+
y(b, {
|
|
487
496
|
text: a.name,
|
|
488
497
|
src: a.photo_url,
|
|
489
498
|
size: 44,
|
|
490
499
|
rounded: !1
|
|
491
500
|
}, null, 8, ["text", "src"])
|
|
492
501
|
]),
|
|
493
|
-
t("span",
|
|
494
|
-
], 8,
|
|
502
|
+
t("span", ye, h(a.name), 1)
|
|
503
|
+
], 8, fe))), 128))
|
|
495
504
|
])
|
|
496
505
|
])
|
|
497
506
|
];
|
|
@@ -502,9 +511,9 @@ const se = ["onClick"], le = {
|
|
|
502
511
|
});
|
|
503
512
|
export {
|
|
504
513
|
xe as O,
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
514
|
+
D as _,
|
|
515
|
+
$ as a,
|
|
516
|
+
we as b,
|
|
517
|
+
ke as c,
|
|
518
|
+
b as d
|
|
510
519
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const e=require("vue"),g=require("./_plugin-vue_export-helper-f246444f.cjs"),k={title:{type:String},stick:{type:String,default:"right"}},y={variant:{type:String,default:"primary"},label:{type:String},icon:{type:[Function,Object]}},v=["data-opened"],w={key:0,class:"text-sm text-secondary-content px-3 py-2 text-left"},f=e.defineComponent({__name:"OneDropdown",props:k,emits:["open"],setup(d,{emit:o}){const a=d,c=e.ref(!1),r=e.ref(null),l=()=>{c.value=!c.value,c.value&&o("open")};e.provide("OneDropdown",{onToggle:l});const t=e.computed(()=>{const n=r.value!=null&&r.value.offsetLeft<270;return r.value!=null&&r.value.offsetTop+270>window.innerHeight?"up"+(n?"-right":"-left"):"down"+(n?"-right":"-left")}),s=e.computed(()=>{const n=["absolute z-10 w-fit rounded-md bg-white","py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none","overflow-auto max-h-[540px] min-w-[150px] max-w-[540px]"];return t.value==="up"?n.push("bottom-1 mb-10"):t.value==="down"?n.push("top-1 mt-10"):t.value==="up-right"?n.push("left-0 bottom-1 mb-10"):t.value==="down-right"&&n.push("left-0 top-1 mt-10"),a.stick==="right"?n.push("right-0"):a.stick==="left"&&n.push("left-0"),n});return(n,i)=>(e.openBlock(),e.createElementBlock("div",{class:"relative inline-block",ref_key:"menuRef",ref:r,"data-opened":c.value},[e.renderSlot(n.$slots,"button",e.normalizeProps(e.guardReactiveProps({onToggle:l,isExpanded:c.value}))),c.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"fixed top-0 left-0 w-screen h-screen z-10",onClick:l})):e.createCommentVNode("",!0),e.createVNode(e.Transition,{"enter-active-class":"transition ease-out duration-100","enter-from-class":"transform opacity-0 scale-95","enter-to-class":"transform opacity-100 scale-100","leave-active-class":"transition ease-in duration-75","leave-from-class":"transform opacity-100 scale-100","leave-to-class":"transform opacity-0 scale-95"},{default:e.withCtx(()=>[c.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["menu",s.value]),role:"menu","aria-orientation":"vertical",tabindex:"-1"},[n.title?(e.openBlock(),e.createElementBlock("div",w,e.toDisplayString(n.title),1)):e.createCommentVNode("",!0),e.renderSlot(n.$slots,"menu",e.normalizeProps(e.guardReactiveProps({onToggle:l})))],2)):e.createCommentVNode("",!0)]),_:3})],8,v))}}),x=["onClick"],m=e.defineComponent({__name:"OneDropdownItem",props:y,emits:["click"],setup(d,{emit:o}){const a=d,c=e.inject("OneDropdown"),r=()=>{c!==void 0&&c.onToggle(),o("click")},l=e.computed(()=>{const t=[];return a.variant==="secondary"?t.push("text-secondary-content hover:bg-secondary-body-hover"):a.variant==="danger"?t.push("text-danger-content hover:bg-danger-10"):a.variant==="warning"?t.push("text-warning-content hover:bg-warning-10"):a.variant==="info"?t.push("text-info-content hover:bg-info-10"):t.push("hover:bg-secondary-body-hover"),t});return(t,s)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["px-3 py-1.5 flex items-center space-x-3 w-full whitespace-nowrap",l.value]),onClick:e.withModifiers(r,["prevent"])},[t.icon?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.icon),{key:0,class:"w-4 h-4"})):e.createCommentVNode("",!0),e.createElementVNode("span",null,e.toDisplayString(t.label),1)],10,x))}}),_={},b={class:"border-t border-secondary-stroke my-1"};function C(d,o){return e.openBlock(),e.createElementBlock("div",b)}const E=g._export_sfc(_,[["render",C]]),V={size:{type:[String,Number],default:"50"},rounded:{type:Boolean,default:!1},text:{type:String,required:!1,default:""},src:{type:[String,null],required:!1}},B=["src"],p=e.defineComponent({__name:"OneAvatar",props:V,setup(d){const o=d,a=e.computed(()=>{const t=o.text.trim().split(" ");return t.length<2?o.text.slice(0,2).toUpperCase():t.map(s=>s.slice(0,1)).join("").toUpperCase()}),c=e.computed(()=>({fill:"rgba(255, 255, 255, .75)",fontSize:`${Number(o.size)*.4}px`})),r=e.computed(()=>{const t=o.text.split("").map(i=>i.charCodeAt(0)).reduce((i,u)=>i+u,0),n=`hsl(${360/26*t}, 68%, 48%)`;return{width:`${o.size}px`,height:`${o.size}px`,borderRadius:o.rounded?"100%":"9%",background:n}}),l=e.computed(()=>({width:`${o.size}px`,height:`${o.size}px`,borderRadius:o.rounded?"100%":"9%"}));return(t,s)=>(e.openBlock(),e.createElementBlock("div",{style:e.normalizeStyle(l.value),class:"overflow-hidden"},[t.src?(e.openBlock(),e.createElementBlock("img",{key:0,src:t.src,alt:"",class:"w-full h-full"},null,8,B)):(e.openBlock(),e.createElementBlock("svg",{key:1,style:e.normalizeStyle(r.value),class:"block"},[a.value?(e.openBlock(),e.createElementBlock("text",{key:0,x:"50%",y:"50%","text-anchor":"middle","dominant-baseline":"central",class:"font-light",style:e.normalizeStyle(c.value)},e.toDisplayString(a.value),5)):e.createCommentVNode("",!0)],4))],4))}});function N(d,o){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.8",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z"})])}function S(d,o){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.8",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M15.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15m3 0l3-3m0 0l-3-3m3 3H9"})])}const z={user:{type:Object,required:!0},menu:{type:Array,default:()=>[]},iconSize:{type:String,default:"34"},accountLabel:{type:String,default:"Account"},logoutLabel:{type:String,default:"Logout"},onAccount:{type:Function},onLogout:{type:Function}},$={workspace:{type:Object,required:!0},apps:{type:Array,required:!0},iconSize:{type:String,default:"24"},appsTitle:{type:String,default:"Apps"},changeLabel:{type:String,default:"Change"},onChange:{type:Function},onApp:{type:Function}},D=["onClick"],A={class:"space-y-2 text-center py-6",style:{width:"240px"}},L={class:"text-sm text-secondary-content"},O={class:"px-2"},P=e.defineComponent({__name:"OneUserMenu",props:z,setup(d){const o=d,a=e.computed(()=>{var l;return(l=o.menu)==null?void 0:l.map(t=>{let s={label:t.label};t.icon!=null&&(s={...s,icon:t.icon});const n=typeof t.click=="function"?t.click:()=>{};return{key:t.label,args:s,click:n}})}),c=()=>{typeof o.onAccount=="function"&&o.onAccount()},r=()=>{typeof o.onLogout=="function"&&o.onLogout()};return(l,t)=>(e.openBlock(),e.createBlock(f,{stick:"right"},{button:e.withCtx(({onToggle:s,isExpanded:n})=>{var i,u;return[e.createElementVNode("button",{onClick:s,class:e.normalizeClass(["p-1 rounded-full hover:bg-secondary-10",[n?"bg-secondary-25":""]])},[e.createVNode(p,{text:((i=l.user)==null?void 0:i.name)||"",size:l.iconSize,src:(u=l.user)==null?void 0:u.photo_url,rounded:!0},null,8,["text","size","src"])],10,D)]}),menu:e.withCtx(()=>{var s,n,i,u;return[e.createElementVNode("div",A,[e.createElementVNode("div",null,[e.createVNode(p,{text:((s=l.user)==null?void 0:s.name)||"",size:80,src:(n=l.user)==null?void 0:n.photo_url,rounded:!0,class:"mx-auto"},null,8,["text","src"])]),e.createElementVNode("div",null,[e.createElementVNode("div",null,e.toDisplayString((i=l.user)==null?void 0:i.name),1),e.createElementVNode("div",L,e.toDisplayString((u=l.user)==null?void 0:u.email),1)])]),e.createElementVNode("div",O,[e.createVNode(m,{icon:e.unref(N),label:l.accountLabel,class:"rounded",onClick:c},null,8,["icon","label"]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.value,h=>(e.openBlock(),e.createBlock(m,e.mergeProps({key:h.key},h.args,{onClick:h.click}),null,16,["onClick"]))),128)),e.createVNode(m,{icon:e.unref(S),label:l.logoutLabel,class:"rounded",onClick:r},null,8,["icon","label"])])]}),_:1}))}});function j(d,o){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.8",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"17.16",y:"3.9",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"10.53",y:"3.9",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"3.9",y:"3.9",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"17.16",y:"10.53",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"10.53",y:"10.53",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"3.9",y:"10.53",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"17.16",y:"17.16",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"10.53",y:"17.16",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"3.9",y:"17.16",fill:"currentColor","stroke-width":"1.8",rx:"1.1"})])}const M=["onClick"],q={class:"space-x-2 flex items-center px-3 py-2",style:{width:"300px"}},F={class:"flex-shrink-0"},R={class:"w-full text-left"},T={class:"flex-shrink-0"},H={class:"px-3 py-2 border-t border-secondary-stroke"},I={class:"text-secondary-content text-left pb-1 text-sm"},U={class:"grid grid-cols-3 gap-1"},G=["onClick"],J={class:"block bg-white mx-auto flex-shrink-0 border border-secondary-stroke p-1 rounded-lg"},K={class:"w-full overflow-hidden text-ellipsis whitespace-nowrap text-center text-sm mt-1"},Q=e.defineComponent({__name:"OneBrowserMenu",props:$,setup(d){const o=d,a=()=>{typeof o.onChange=="function"&&o.onChange()},c=r=>{typeof o.onApp=="function"&&o.onApp(r)};return(r,l)=>(e.openBlock(),e.createBlock(f,{stick:"right"},{button:e.withCtx(({onToggle:t,isExpanded:s})=>[e.createElementVNode("button",{onClick:t,class:e.normalizeClass(["p-1 rounded-md hover:bg-secondary-10",[s?"bg-secondary-25":""]])},[e.createVNode(e.unref(j),{class:"text-secondary-base",style:e.normalizeStyle(`width: ${r.iconSize}px; height: ${r.iconSize}px`)},null,8,["style"])],10,M)]),menu:e.withCtx(()=>{var t,s,n;return[e.createElementVNode("div",q,[e.createElementVNode("div",F,[e.createVNode(p,{text:((t=r.workspace)==null?void 0:t.name)||"",src:(s=r.workspace)==null?void 0:s.photo_url,size:44,rounded:!1,class:"mx-auto"},null,8,["text","src"])]),e.createElementVNode("div",R,e.toDisplayString((n=r.workspace)==null?void 0:n.name),1),e.createElementVNode("div",T,[e.createElementVNode("button",{class:"text-sm border border-secondary-stroke rounded px-2 py-0.5 text-secondary-content hover:text-primary-content",onClick:a},e.toDisplayString(r.changeLabel),1)])]),e.createElementVNode("div",H,[e.createElementVNode("div",I,e.toDisplayString(r.appsTitle),1),e.createElementVNode("div",U,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.apps,i=>(e.openBlock(),e.createElementBlock("button",{key:i.id,onClick:u=>c(i),class:"p-1.5 flex flex-col items-center justify-center rounded hover:bg-secondary-10",style:{width:"88px",height:"88px"}},[e.createElementVNode("span",J,[e.createVNode(p,{text:i.name,src:i.photo_url,size:44,rounded:!1},null,8,["text","src"])]),e.createElementVNode("span",K,e.toDisplayString(i.name),1)],8,G))),128))])])]}),_:1}))}});exports.OneDropdownDivider=E;exports._sfc_main=f;exports._sfc_main$1=m;exports._sfc_main$2=P;exports._sfc_main$3=Q;exports._sfc_main$4=p;
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./button/index.cjs"),n=require("./card/index.cjs"),r=require("./form/index.cjs"),e=require("./index-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./button/index.cjs"),n=require("./card/index.cjs"),r=require("./form/index.cjs"),e=require("./index-f88ecb85.cjs");require("vue");require("./_plugin-vue_export-helper-f246444f.cjs");exports.OneButton=o.OneButton;exports.OneCard=n.OneCard;exports.OneCardBody=n.OneCardBody;exports.OneCardFooter=n.OneCardFooter;exports.OneCardHeader=n.OneCardHeader;exports.OneForm=r.OneForm;exports.OneFormFeedback=r.OneFormFeedback;exports.OneFormField=r.OneFormField;exports.OneFormInput=r.OneFormInput;exports.OneFormLabel=r.OneFormLabel;exports.OneAvatar=e._sfc_main$4;exports.OneBrowserMenu=e._sfc_main$3;exports.OneDropdown=e._sfc_main;exports.OneDropdownDivider=e.OneDropdownDivider;exports.OneDropdownItem=e._sfc_main$1;exports.OneUserMenu=e._sfc_main$2;
|
package/dist/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { OneButton as O } from "./button/index.js";
|
|
2
2
|
import { OneCard as d, OneCardBody as m, OneCardFooter as t, OneCardHeader as p } from "./card/index.js";
|
|
3
3
|
import { OneForm as F, OneFormFeedback as i, OneFormField as f, OneFormInput as u, OneFormLabel as w } from "./form/index.js";
|
|
4
|
-
import { d as C, c as D, _ as b, O as B, a as c, b as l } from "./index-
|
|
4
|
+
import { d as C, c as D, _ as b, O as B, a as c, b as l } from "./index-8ee43fa4.js";
|
|
5
5
|
import "vue";
|
|
6
6
|
import "./_plugin-vue_export-helper-dad06003.js";
|
|
7
7
|
export {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oneb/ui-vue",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.7",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"files": [
|
|
@@ -34,6 +34,10 @@
|
|
|
34
34
|
"types": "./dist/form/index.d.ts",
|
|
35
35
|
"import": "./dist/form/index.js"
|
|
36
36
|
},
|
|
37
|
+
"./dropdown": {
|
|
38
|
+
"types": "./dist/dropdown/index.d.ts",
|
|
39
|
+
"import": "./dist/dropdown/index.js"
|
|
40
|
+
},
|
|
37
41
|
"./icons": {
|
|
38
42
|
"types": "./dist/icons/outline/index.d.ts",
|
|
39
43
|
"import": "./dist/icons/outline/esm/index.js",
|
package/dist/index-26c86446.cjs
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";const e=require("vue"),f=require("./_plugin-vue_export-helper-f246444f.cjs"),k={title:{type:String},stick:{type:String,default:"right"}},g={variant:{type:String,default:"primary"},label:{type:String},icon:{type:[Function,Object]}},y=["data-opened"],x={key:0,class:"text-sm text-secondary-content px-3 py-2 text-left"},h=e.defineComponent({__name:"OneDropdown",props:k,emits:["open"],setup(d,{emit:o}){const i=d,c=e.ref(!1),r=e.ref(null),l=()=>{c.value=!c.value,c.value&&o("open")};e.provide("OneDropdown",{onToggle:l});const t=e.computed(()=>{const n=r.value!=null&&r.value.offsetLeft<270;return r.value!=null&&r.value.offsetTop+270>window.innerHeight?"up"+(n?"-right":"-left"):"down"+(n?"-right":"-left")}),s=e.computed(()=>{const n=["absolute z-10 w-fit rounded-md bg-white","py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none","overflow-auto max-h-[540px] min-w-[150px] max-w-[540px]"];return t.value==="up"?n.push("bottom-1 mb-10"):t.value==="down"?n.push("top-1 mt-10"):t.value==="up-right"?n.push("left-0 bottom-1 mb-10"):t.value==="down-right"&&n.push("left-0 top-1 mt-10"),i.stick==="right"?n.push("right-0"):i.stick==="left"&&n.push("left-0"),n});return(n,a)=>(e.openBlock(),e.createElementBlock("div",{class:"relative inline-block",ref_key:"menuRef",ref:r,"data-opened":c.value},[e.renderSlot(n.$slots,"button",e.normalizeProps(e.guardReactiveProps({onToggle:l,isExpanded:c.value}))),c.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"fixed top-0 left-0 w-screen h-screen z-10",onClick:l})):e.createCommentVNode("",!0),e.createVNode(e.Transition,{"enter-active-class":"transition ease-out duration-100","enter-from-class":"transform opacity-0 scale-95","enter-to-class":"transform opacity-100 scale-100","leave-active-class":"transition ease-in duration-75","leave-from-class":"transform opacity-100 scale-100","leave-to-class":"transform opacity-0 scale-95"},{default:e.withCtx(()=>[c.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["menu",s.value]),role:"menu","aria-orientation":"vertical",tabindex:"-1"},[n.title?(e.openBlock(),e.createElementBlock("div",x,e.toDisplayString(n.title),1)):e.createCommentVNode("",!0),e.renderSlot(n.$slots,"menu",e.normalizeProps(e.guardReactiveProps({onToggle:l})))],2)):e.createCommentVNode("",!0)]),_:3})],8,y))}}),v=["onClick"],m=e.defineComponent({__name:"OneDropdownItem",props:g,emits:["click"],setup(d,{emit:o}){const i=d,c=e.inject("OneDropdown"),r=()=>{c!==void 0&&c.onToggle(),o("click")},l=e.computed(()=>{const t=[];return i.variant==="secondary"?t.push("text-secondary-content hover:bg-secondary-body-hover"):i.variant==="danger"?t.push("text-danger-content hover:bg-danger-10"):i.variant==="warning"?t.push("text-warning-content hover:bg-warning-10"):i.variant==="info"?t.push("text-info-content hover:bg-info-10"):t.push("hover:bg-secondary-body-hover"),t});return(t,s)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["px-3 py-1.5 flex items-center space-x-3 w-full whitespace-nowrap",l.value]),onClick:e.withModifiers(r,["prevent"])},[t.icon?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.icon),{key:0,class:"w-4 h-4"})):e.createCommentVNode("",!0),e.createElementVNode("span",null,e.toDisplayString(t.label),1)],10,v))}}),w={},_={class:"border-t border-secondary-stroke my-1"};function b(d,o){return e.openBlock(),e.createElementBlock("div",_)}const C=f._export_sfc(w,[["render",b]]),E={size:{type:[String,Number],default:"50"},rounded:{type:Boolean,default:!1},text:{type:String,required:!1,default:""},src:{type:[String,null],required:!1}},V=["src"],p=e.defineComponent({__name:"OneAvatar",props:E,setup(d){const o=d,i=e.computed(()=>{const t=o.text.trim().split(" ");return t.length<2?o.text.slice(0,2).toUpperCase():t.map(s=>s.slice(0,1)).join("").toUpperCase()}),c=e.computed(()=>({fill:"rgba(255, 255, 255, .75)",fontSize:`${Number(o.size)*.4}px`})),r=e.computed(()=>{const t=o.text.split("").map(a=>a.charCodeAt(0)).reduce((a,u)=>a+u,0),n=`hsl(${360/26*t}, 68%, 48%)`;return{width:`${o.size}px`,height:`${o.size}px`,borderRadius:o.rounded?"100%":"9%",background:n}}),l=e.computed(()=>({width:`${o.size}px`,height:`${o.size}px`,borderRadius:o.rounded?"100%":"9%"}));return(t,s)=>(e.openBlock(),e.createElementBlock("div",{style:e.normalizeStyle(l.value),class:"overflow-hidden"},[t.src?(e.openBlock(),e.createElementBlock("img",{key:0,src:t.src,alt:"",class:"w-full h-full"},null,8,V)):(e.openBlock(),e.createElementBlock("svg",{key:1,style:e.normalizeStyle(r.value),class:"block"},[i.value?(e.openBlock(),e.createElementBlock("text",{key:0,x:"50%",y:"50%","text-anchor":"middle","dominant-baseline":"central",class:"font-light",style:e.normalizeStyle(c.value)},e.toDisplayString(i.value),5)):e.createCommentVNode("",!0)],4))],4))}});function B(d,o){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.8",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z"})])}function N(d,o){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.8",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M15.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15m3 0l3-3m0 0l-3-3m3 3H9"})])}const S={user:{type:Object,required:!0},menu:{type:Array,default:()=>[]},accountLabel:{type:String,default:"Account"},logoutLabel:{type:String,default:"Logout"},onAccount:{type:Function},onLogout:{type:Function}},$={workspace:{type:Object,required:!0},apps:{type:Array,required:!0},appsTitle:{type:String,default:"Apps"},changeLabel:{type:String,default:"Change"},onChange:{type:Function},onApp:{type:Function}},z=["onClick"],D={class:"space-y-2 text-center py-6",style:{width:"240px"}},A={class:"text-sm text-secondary-content"},L={class:"px-2"},O=e.defineComponent({__name:"OneUserMenu",props:S,setup(d){const o=d,i=e.computed(()=>{var l;return(l=o.menu)==null?void 0:l.map(t=>{let s={label:t.label};t.icon!=null&&(s={...s,icon:t.icon});const n=typeof t.click=="function"?t.click:()=>{};return{key:t.label,args:s,click:n}})}),c=()=>{typeof o.onAccount=="function"&&o.onAccount()},r=()=>{typeof o.onLogout=="function"&&o.onLogout()};return(l,t)=>(e.openBlock(),e.createBlock(h,{stick:"right"},{button:e.withCtx(({onToggle:s,isExpanded:n})=>{var a,u;return[e.createElementVNode("button",{onClick:s,class:e.normalizeClass(["p-1 rounded-full hover:bg-secondary-10",[n?"bg-secondary-25":""]])},[e.createVNode(p,{text:((a=l.user)==null?void 0:a.name)||"",size:34,src:(u=l.user)==null?void 0:u.photo_url,rounded:!0},null,8,["text","src"])],10,z)]}),menu:e.withCtx(()=>{var s,n,a;return[e.createElementVNode("div",D,[e.createElementVNode("div",null,[e.createVNode(p,{text:((s=l.user)==null?void 0:s.name)||"",size:80,rounded:!0,class:"mx-auto"},null,8,["text"])]),e.createElementVNode("div",null,[e.createElementVNode("div",null,e.toDisplayString((n=l.user)==null?void 0:n.name),1),e.createElementVNode("div",A,e.toDisplayString((a=l.user)==null?void 0:a.email),1)])]),e.createElementVNode("div",L,[e.createVNode(m,{icon:e.unref(B),label:l.accountLabel,class:"rounded",onClick:c},null,8,["icon","label"]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.value,u=>(e.openBlock(),e.createBlock(m,e.mergeProps({key:u.key},u.args,{onClick:u.click}),null,16,["onClick"]))),128)),e.createVNode(m,{icon:e.unref(N),label:l.logoutLabel,class:"rounded",onClick:r},null,8,["icon","label"])])]}),_:1}))}});function P(d,o){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.8",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"17.16",y:"3.9",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"10.53",y:"3.9",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"3.9",y:"3.9",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"17.16",y:"10.53",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"10.53",y:"10.53",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"3.9",y:"10.53",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"17.16",y:"17.16",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"10.53",y:"17.16",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"3.9",y:"17.16",fill:"currentColor","stroke-width":"1.8",rx:"1.1"})])}const j=["onClick"],M={class:"space-x-2 flex items-center px-3 py-2",style:{width:"300px"}},q={class:"flex-shrink-0"},F={class:"w-full text-left"},R={class:"flex-shrink-0"},T={class:"px-3 py-2 border-t border-secondary-stroke"},H={class:"text-secondary-content text-left pb-1 text-sm"},I={class:"grid grid-cols-3 gap-1"},U=["onClick"],G={class:"block bg-white mx-auto flex-shrink-0 border border-secondary-stroke p-1 rounded-lg"},J={class:"w-full overflow-hidden text-ellipsis whitespace-nowrap text-center text-sm mt-1"},K=e.defineComponent({__name:"OneBrowserMenu",props:$,setup(d){const o=d,i=()=>{typeof o.onChange=="function"&&o.onChange()},c=r=>{typeof o.onApp=="function"&&o.onApp(r)};return(r,l)=>(e.openBlock(),e.createBlock(h,{stick:"right"},{button:e.withCtx(({onToggle:t,isExpanded:s})=>[e.createElementVNode("button",{onClick:t,class:e.normalizeClass(["p-1 rounded-md hover:bg-secondary-10",[s?"bg-secondary-25":""]])},[e.createVNode(e.unref(P),{class:"text-secondary-base",style:{width:"34px",height:"34px"}})],10,j)]),menu:e.withCtx(()=>{var t,s,n;return[e.createElementVNode("div",M,[e.createElementVNode("div",q,[e.createVNode(p,{text:((t=r.workspace)==null?void 0:t.name)||"",src:(s=r.workspace)==null?void 0:s.photo_url,size:44,rounded:!1,class:"mx-auto"},null,8,["text","src"])]),e.createElementVNode("div",F,e.toDisplayString((n=r.workspace)==null?void 0:n.name),1),e.createElementVNode("div",R,[e.createElementVNode("button",{class:"text-sm border border-secondary-stroke rounded px-2 py-0.5 text-secondary-content hover:text-primary-content",onClick:i},e.toDisplayString(r.changeLabel),1)])]),e.createElementVNode("div",T,[e.createElementVNode("div",H,e.toDisplayString(r.appsTitle),1),e.createElementVNode("div",I,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.apps,a=>(e.openBlock(),e.createElementBlock("button",{key:a.id,onClick:u=>c(a),class:"p-1.5 flex flex-col items-center justify-center rounded hover:bg-secondary-10",style:{width:"88px",height:"88px"}},[e.createElementVNode("span",G,[e.createVNode(p,{text:a.name,src:a.photo_url,size:44,rounded:!1},null,8,["text","src"])]),e.createElementVNode("span",J,e.toDisplayString(a.name),1)],8,U))),128))])])]}),_:1}))}});exports.OneDropdownDivider=C;exports._sfc_main=h;exports._sfc_main$1=m;exports._sfc_main$2=O;exports._sfc_main$3=K;exports._sfc_main$4=p;
|