@septkit/ui 0.0.11 → 0.0.12
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.
|
@@ -1,111 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
props: {
|
|
6
|
-
color: {},
|
|
7
|
-
variant: {},
|
|
8
|
-
size: {},
|
|
9
|
-
active: { type: Boolean },
|
|
10
|
-
disabled: { type: Boolean },
|
|
11
|
-
modifier: {},
|
|
12
|
-
background: {},
|
|
13
|
-
id: {}
|
|
14
|
-
},
|
|
15
|
-
emits: ["open", "close"],
|
|
16
|
-
setup(b, { expose: u, emit: p }) {
|
|
17
|
-
const e = b, a = p, s = S("details-ref"), o = C(!1), m = n(() => ({
|
|
18
|
-
"bg-neutral": e.background === "neutral",
|
|
19
|
-
"bg-primary": e.background === "primary",
|
|
20
|
-
"bg-secondary": e.background === "secondary",
|
|
21
|
-
"bg-accent": e.background === "accent",
|
|
22
|
-
"bg-info": e.background === "info",
|
|
23
|
-
"bg-success": e.background === "success",
|
|
24
|
-
"bg-warning": e.background === "warning",
|
|
25
|
-
"bg-error": e.background === "error",
|
|
26
|
-
"bg-base-100": e.background === "base",
|
|
27
|
-
"bg-white": !e.background
|
|
28
|
-
})), g = n(() => ({
|
|
29
|
-
"btn-neutral": e.color === "neutral" || !e.color,
|
|
30
|
-
"btn-primary": e.color === "primary",
|
|
31
|
-
"btn-secondary": e.color === "secondary",
|
|
32
|
-
"btn-accent": e.color === "accent",
|
|
33
|
-
"btn-info": e.color === "info",
|
|
34
|
-
"btn-success": e.color === "success",
|
|
35
|
-
"btn-warning": e.color === "warning",
|
|
36
|
-
"btn-error": e.color === "error"
|
|
37
|
-
})), f = n(() => ({
|
|
38
|
-
"btn-outline": e.variant === "outline",
|
|
39
|
-
"btn-dash": e.variant === "dash",
|
|
40
|
-
"btn-soft": e.variant === "soft",
|
|
41
|
-
"btn-ghost": e.variant === "ghost" || !e.variant,
|
|
42
|
-
"btn-link": e.variant === "link"
|
|
43
|
-
})), v = n(() => ({
|
|
44
|
-
"btn-xs": e.size === "xs",
|
|
45
|
-
"btn-sm": e.size === "sm" || !e.size,
|
|
46
|
-
"btn-md": e.size === "md",
|
|
47
|
-
"btn-lg": e.size === "lg",
|
|
48
|
-
"btn-xl": e.size === "xl"
|
|
49
|
-
})), w = n(() => ({
|
|
50
|
-
"btn-wide": e.modifier === "wide" || !e.modifier,
|
|
51
|
-
"btn-block": e.modifier === "block",
|
|
52
|
-
"btn-square": e.modifier === "square",
|
|
53
|
-
"btn-circle": e.modifier === "circle"
|
|
54
|
-
}));
|
|
55
|
-
function k() {
|
|
56
|
-
s.value && (s.value.open = o.value);
|
|
57
|
-
}
|
|
58
|
-
function r() {
|
|
59
|
-
o.value = !1, a("close");
|
|
60
|
-
}
|
|
61
|
-
function y() {
|
|
62
|
-
o.value = !0, a("open");
|
|
63
|
-
}
|
|
64
|
-
function z() {
|
|
65
|
-
o.value ? r() : y();
|
|
66
|
-
}
|
|
67
|
-
return u({
|
|
68
|
-
/** Method to close the dropdown */
|
|
69
|
-
close: r,
|
|
70
|
-
/** Reactive boolean of the dropdown state */
|
|
71
|
-
isOpen: o,
|
|
72
|
-
id: e.id
|
|
73
|
-
}), (t, E) => (c(), i("details", {
|
|
74
|
-
"data-testid": "dropdown-wrapper",
|
|
75
|
-
ref: "details-ref",
|
|
76
|
-
class: "dropdown",
|
|
77
|
-
open: o.value,
|
|
78
|
-
onToggle: k
|
|
79
|
-
}, [
|
|
80
|
-
O("summary", {
|
|
81
|
-
"data-testid": "dropdown-trigger",
|
|
82
|
-
onClick: B(z, ["stop"]),
|
|
83
|
-
class: l(["btn", [
|
|
84
|
-
g.value,
|
|
85
|
-
f.value,
|
|
86
|
-
v.value,
|
|
87
|
-
w.value,
|
|
88
|
-
{ "btn-active": t.active, "btn-disabled": t.disabled }
|
|
89
|
-
]])
|
|
90
|
-
}, [
|
|
91
|
-
d(t.$slots, "label")
|
|
92
|
-
], 2),
|
|
93
|
-
x((c(), i("ul", {
|
|
94
|
-
"data-testid": "dropdown-menu",
|
|
95
|
-
class: l([[m.value], "menu dropdown-content z-1 w-52 p-2 shadow-sm size-max"])
|
|
96
|
-
}, [
|
|
97
|
-
d(t.$slots, "items")
|
|
98
|
-
], 2)), [
|
|
99
|
-
[
|
|
100
|
-
D(_),
|
|
101
|
-
r,
|
|
102
|
-
void 0,
|
|
103
|
-
{ bubble: !0 }
|
|
104
|
-
]
|
|
105
|
-
])
|
|
106
|
-
], 40, q));
|
|
107
|
-
}
|
|
108
|
-
});
|
|
1
|
+
import o from "./dropdown.vue2.js";
|
|
2
|
+
/* empty css */
|
|
3
|
+
import r from "../_virtual/_plugin-vue_export-helper.js";
|
|
4
|
+
const d = /* @__PURE__ */ r(o, [["__scopeId", "data-v-0a93d691"]]);
|
|
109
5
|
export {
|
|
110
|
-
|
|
6
|
+
d as default
|
|
111
7
|
};
|
|
@@ -1,4 +1,111 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { defineComponent as h, useTemplateRef as S, ref as C, computed as n, createElementBlock as s, openBlock as c, createElementVNode as O, withDirectives as x, normalizeClass as l, withModifiers as B, renderSlot as d, unref as D } from "vue";
|
|
2
|
+
import { VOnClickOutside as _ } from "../external/.pnpm/@vueuse_components@13.5.0_vue@3.5.17_typescript@5.8.3_/node_modules/@vueuse/components/index.js";
|
|
3
|
+
const q = ["open"], $ = /* @__PURE__ */ h({
|
|
4
|
+
__name: "dropdown",
|
|
5
|
+
props: {
|
|
6
|
+
color: {},
|
|
7
|
+
variant: {},
|
|
8
|
+
size: {},
|
|
9
|
+
active: { type: Boolean },
|
|
10
|
+
disabled: { type: Boolean },
|
|
11
|
+
modifier: {},
|
|
12
|
+
background: {},
|
|
13
|
+
id: {}
|
|
14
|
+
},
|
|
15
|
+
emits: ["open", "close"],
|
|
16
|
+
setup(b, { expose: u, emit: p }) {
|
|
17
|
+
const e = b, a = p, i = S("details-ref"), o = C(!1), m = n(() => ({
|
|
18
|
+
"bg-neutral": e.background === "neutral",
|
|
19
|
+
"bg-primary": e.background === "primary",
|
|
20
|
+
"bg-secondary": e.background === "secondary",
|
|
21
|
+
"bg-accent": e.background === "accent",
|
|
22
|
+
"bg-info": e.background === "info",
|
|
23
|
+
"bg-success": e.background === "success",
|
|
24
|
+
"bg-warning": e.background === "warning",
|
|
25
|
+
"bg-error": e.background === "error",
|
|
26
|
+
"bg-base-100": e.background === "base",
|
|
27
|
+
"bg-white": !e.background
|
|
28
|
+
})), g = n(() => ({
|
|
29
|
+
"btn-neutral": e.color === "neutral" || !e.color,
|
|
30
|
+
"btn-primary": e.color === "primary",
|
|
31
|
+
"btn-secondary": e.color === "secondary",
|
|
32
|
+
"btn-accent": e.color === "accent",
|
|
33
|
+
"btn-info": e.color === "info",
|
|
34
|
+
"btn-success": e.color === "success",
|
|
35
|
+
"btn-warning": e.color === "warning",
|
|
36
|
+
"btn-error": e.color === "error"
|
|
37
|
+
})), f = n(() => ({
|
|
38
|
+
"btn-outline": e.variant === "outline",
|
|
39
|
+
"btn-dash": e.variant === "dash",
|
|
40
|
+
"btn-soft": e.variant === "soft",
|
|
41
|
+
"btn-ghost": e.variant === "ghost" || !e.variant,
|
|
42
|
+
"btn-link": e.variant === "link"
|
|
43
|
+
})), v = n(() => ({
|
|
44
|
+
"btn-xs": e.size === "xs",
|
|
45
|
+
"btn-sm": e.size === "sm" || !e.size,
|
|
46
|
+
"btn-md": e.size === "md",
|
|
47
|
+
"btn-lg": e.size === "lg",
|
|
48
|
+
"btn-xl": e.size === "xl"
|
|
49
|
+
})), w = n(() => ({
|
|
50
|
+
"btn-wide": e.modifier === "wide" || !e.modifier,
|
|
51
|
+
"btn-block": e.modifier === "block",
|
|
52
|
+
"btn-square": e.modifier === "square",
|
|
53
|
+
"btn-circle": e.modifier === "circle"
|
|
54
|
+
}));
|
|
55
|
+
function k() {
|
|
56
|
+
i.value && (i.value.open = o.value);
|
|
57
|
+
}
|
|
58
|
+
function r() {
|
|
59
|
+
o.value = !1, a("close");
|
|
60
|
+
}
|
|
61
|
+
function y() {
|
|
62
|
+
o.value = !0, a("open");
|
|
63
|
+
}
|
|
64
|
+
function z() {
|
|
65
|
+
o.value ? r() : y();
|
|
66
|
+
}
|
|
67
|
+
return u({
|
|
68
|
+
/** Method to close the dropdown */
|
|
69
|
+
close: r,
|
|
70
|
+
/** Reactive boolean of the dropdown state */
|
|
71
|
+
isOpen: o,
|
|
72
|
+
id: e.id
|
|
73
|
+
}), (t, E) => (c(), s("details", {
|
|
74
|
+
"data-testid": "dropdown-wrapper",
|
|
75
|
+
ref: "details-ref",
|
|
76
|
+
class: "dropdown",
|
|
77
|
+
open: o.value,
|
|
78
|
+
onToggle: k
|
|
79
|
+
}, [
|
|
80
|
+
O("summary", {
|
|
81
|
+
"data-testid": "dropdown-trigger",
|
|
82
|
+
onClick: B(z, ["stop"]),
|
|
83
|
+
class: l(["btn", [
|
|
84
|
+
g.value,
|
|
85
|
+
f.value,
|
|
86
|
+
v.value,
|
|
87
|
+
w.value,
|
|
88
|
+
{ "btn-active": t.active, "btn-disabled": t.disabled }
|
|
89
|
+
]])
|
|
90
|
+
}, [
|
|
91
|
+
d(t.$slots, "label", {}, void 0, !0)
|
|
92
|
+
], 2),
|
|
93
|
+
x((c(), s("ul", {
|
|
94
|
+
"data-testid": "dropdown-menu",
|
|
95
|
+
class: l([[m.value], "menu dropdown-content z-1 w-52 p-2 shadow-sm size-max"])
|
|
96
|
+
}, [
|
|
97
|
+
d(t.$slots, "items", {}, void 0, !0)
|
|
98
|
+
], 2)), [
|
|
99
|
+
[
|
|
100
|
+
D(_),
|
|
101
|
+
r,
|
|
102
|
+
void 0,
|
|
103
|
+
{ bubble: !0 }
|
|
104
|
+
]
|
|
105
|
+
])
|
|
106
|
+
], 40, q));
|
|
107
|
+
}
|
|
108
|
+
});
|
|
2
109
|
export {
|
|
3
|
-
|
|
110
|
+
$ as default
|
|
4
111
|
};
|
package/dist/ui.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */.size-max[data-v-0a93d691]{width:max-content;height:max-content}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@septkit/ui",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.12",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"source": "lib/index.ts",
|
|
6
6
|
"scripts": {
|
|
@@ -30,7 +30,8 @@
|
|
|
30
30
|
"types": "./dist/index.d.ts",
|
|
31
31
|
"default": "./dist/index.js"
|
|
32
32
|
},
|
|
33
|
-
"./configcss": "./dist/config.css"
|
|
33
|
+
"./configcss": "./dist/config.css",
|
|
34
|
+
"./uicss": "./dist/ui.css"
|
|
34
35
|
},
|
|
35
36
|
"dependencies": {
|
|
36
37
|
"@tailwindcss/vite": "^4.1.11",
|