@kreavoks/kreaui 0.0.5 → 0.1.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 (4) hide show
  1. package/lib/kreaui.css +1 -1
  2. package/lib/kreaui.es.js +304 -64
  3. package/lib/kreaui.umd.js +1 -1
  4. package/package.json +1 -1
package/lib/kreaui.css CHANGED
@@ -1,2 +1,2 @@
1
- .fade-enter-active[data-v-7a29c82f],.fade-leave-active[data-v-7a29c82f]{transition:opacity .2s,transform .2s}.fade-enter-from[data-v-7a29c82f],.fade-leave-to[data-v-7a29c82f]{opacity:0;transform:scale(.98)}.krea-dropdown-wrapper[data-v-948716a5]{display:inline-block;position:relative}.krea-dropdown-popover[data-v-948716a5]{z-index:50;background:#fff;border:1px solid #e2e8f0;border-radius:12px;flex-direction:column;gap:2px;min-width:14rem;padding:4px;animation:.12s cubic-bezier(.16,1,.3,1) krea-dropdown-in-948716a5;display:flex;position:absolute;top:calc(100% + 8px)}@keyframes krea-dropdown-in-948716a5{0%{opacity:0;transform:scale(.96)translateY(-4px)}to{opacity:1;transform:scale(1)translateY(0)}}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-popover[data-v-948716a5]{background:#18181b;border-color:#27272a}.krea-dropdown-divider[data-v-948716a5]{background:#f1f5f9;height:1px;margin:4px 0}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-divider[data-v-948716a5]{background:#27272a}.krea-dropdown-item[data-v-948716a5]{color:#334155;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:space-between;align-items:center;width:100%;padding:8px 12px;font-size:.875rem;font-weight:500;transition:background-color .15s,color .15s;display:flex}.krea-dropdown-item[data-v-948716a5]:hover{background:#f1f5f9}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-item[data-v-948716a5]{color:#e2e8f0}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-item[data-v-948716a5]:hover{background:#27272a}.krea-dropdown-item[data-v-948716a5]:disabled{pointer-events:none;opacity:.4}.krea-dropdown-item--active[data-v-948716a5]{color:#4082e6;background:#eff6ff;font-weight:600}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-item--active[data-v-948716a5]{color:#4082e6;background:#4082e626}.krea-dropdown-item--active[data-v-948716a5]:hover{background:#dbeafe}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-item--active[data-v-948716a5]:hover{background:#4082e640}.krea-dropdown-item--danger[data-v-948716a5]{color:#f43f5e}.krea-dropdown-item--danger[data-v-948716a5]:hover{background:#fff1f2}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-item--danger[data-v-948716a5]:hover{background:#f43f5e26}
1
+ .fade-enter-active[data-v-4b55fce4],.fade-leave-active[data-v-4b55fce4]{transition:opacity .2s,transform .2s}.fade-enter-from[data-v-4b55fce4],.fade-leave-to[data-v-4b55fce4]{opacity:0;transform:scale(.98)}.krea-dropdown-wrapper[data-v-948716a5]{display:inline-block;position:relative}.krea-dropdown-popover[data-v-948716a5]{z-index:50;background:#fff;border:1px solid #e2e8f0;border-radius:12px;flex-direction:column;gap:2px;min-width:14rem;padding:4px;animation:.12s cubic-bezier(.16,1,.3,1) krea-dropdown-in-948716a5;display:flex;position:absolute;top:calc(100% + 8px)}@keyframes krea-dropdown-in-948716a5{0%{opacity:0;transform:scale(.96)translateY(-4px)}to{opacity:1;transform:scale(1)translateY(0)}}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-popover[data-v-948716a5]{background:#18181b;border-color:#27272a}.krea-dropdown-divider[data-v-948716a5]{background:#f1f5f9;height:1px;margin:4px 0}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-divider[data-v-948716a5]{background:#27272a}.krea-dropdown-item[data-v-948716a5]{color:#334155;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:space-between;align-items:center;width:100%;padding:8px 12px;font-size:.875rem;font-weight:500;transition:background-color .15s,color .15s;display:flex}.krea-dropdown-item[data-v-948716a5]:hover{background:#f1f5f9}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-item[data-v-948716a5]{color:#e2e8f0}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-item[data-v-948716a5]:hover{background:#27272a}.krea-dropdown-item[data-v-948716a5]:disabled{pointer-events:none;opacity:.4}.krea-dropdown-item--active[data-v-948716a5]{color:#4082e6;background:#eff6ff;font-weight:600}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-item--active[data-v-948716a5]{color:#4082e6;background:#4082e626}.krea-dropdown-item--active[data-v-948716a5]:hover{background:#dbeafe}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-item--active[data-v-948716a5]:hover{background:#4082e640}.krea-dropdown-item--danger[data-v-948716a5]{color:#f43f5e}.krea-dropdown-item--danger[data-v-948716a5]:hover{background:#fff1f2}:where([data-theme=dark],[data-theme=dark] *) .krea-dropdown-item--danger[data-v-948716a5]:hover{background:#f43f5e26}
2
2
  /*$vite$:1*/
package/lib/kreaui.es.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { Fragment as e, Transition as t, computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, createVNode as c, defineComponent as l, normalizeClass as u, normalizeStyle as d, onMounted as f, onUnmounted as p, openBlock as m, ref as h, renderList as g, renderSlot as _, resolveDynamicComponent as v, toDisplayString as y, unref as b, vShow as x, withCtx as S, withDirectives as C } from "vue";
2
- import { AlertCircle as w, AlertTriangle as T, CheckCircle2 as E, ChevronDown as D, Info as O, Loader2 as k, X as A } from "lucide-vue-next";
2
+ import { AlertCircle as w, AlertTriangle as T, ArrowRight as E, Calendar as D, CheckCircle2 as O, ChevronDown as k, Info as A, Loader2 as j, X as M } from "lucide-vue-next";
3
3
  //#region src/shared/ui/alert/Alert.vue?vue&type=script&setup=true&lang.ts
4
- var j = { class: "flex-1 text-sm leading-relaxed" }, M = { class: "opacity-90" }, N = /*@__PURE__*/ l({
4
+ var N = { class: "flex-1 text-sm leading-relaxed" }, P = { class: "opacity-90 [&_p]:m-0 [&_p]:leading-relaxed" }, F = /*@__PURE__*/ l({
5
5
  __name: "Alert",
6
6
  props: {
7
7
  variant: { default: "info" },
@@ -22,21 +22,21 @@ var j = { class: "flex-1 text-sm leading-relaxed" }, M = { class: "opacity-90" }
22
22
  let f = l, p = d, g = h(!0), x = () => {
23
23
  g.value = !1, p("close");
24
24
  }, C = {
25
- info: O,
26
- success: E,
25
+ info: A,
26
+ success: O,
27
27
  warning: T,
28
28
  danger: w
29
- }, D = n(() => C[f.variant]), k = {
29
+ }, E = n(() => C[f.variant]), D = {
30
30
  info: "bg-blue-50 border-blue-200 text-blue-800 dark:bg-blue-950/20 dark:border-blue-900/50 dark:text-blue-300",
31
31
  success: "bg-emerald-50 border-emerald-200 text-emerald-800 dark:bg-emerald-950/20 dark:border-emerald-900/50 dark:text-emerald-300",
32
32
  warning: "bg-amber-50 border-amber-200 text-amber-800 dark:bg-amber-950/20 dark:border-amber-900/50 dark:text-amber-300",
33
33
  danger: "bg-rose-50 border-rose-200 text-rose-800 dark:bg-rose-950/20 dark:border-rose-900/50 dark:text-rose-300"
34
- }, N = {
34
+ }, k = {
35
35
  info: "text-blue-900 dark:text-blue-200",
36
36
  success: "text-emerald-900 dark:text-emerald-200",
37
37
  warning: "text-amber-900 dark:text-amber-200",
38
38
  danger: "text-rose-900 dark:text-rose-200"
39
- }, P = {
39
+ }, j = {
40
40
  info: "text-blue-500 hover:bg-blue-100 hover:text-blue-800 dark:text-blue-400 dark:hover:bg-blue-900/40 dark:hover:text-blue-200",
41
41
  success: "text-emerald-500 hover:bg-emerald-100 hover:text-emerald-800 dark:text-emerald-400 dark:hover:bg-emerald-900/40 dark:hover:text-emerald-200",
42
42
  warning: "text-amber-500 hover:bg-amber-100 hover:text-amber-800 dark:text-amber-400 dark:hover:bg-amber-900/40 dark:hover:text-amber-200",
@@ -46,36 +46,36 @@ var j = { class: "flex-1 text-sm leading-relaxed" }, M = { class: "opacity-90" }
46
46
  default: S(() => [g.value ? (m(), a("div", {
47
47
  key: 0,
48
48
  class: u([
49
- "flex items-start gap-3 p-4 border rounded-2xl transition-all duration-200",
50
- k[l.variant],
49
+ "flex items-start gap-3 p-4 border rounded-2xl transition-all duration-200 not-content",
50
+ D[l.variant],
51
51
  f.class
52
52
  ]),
53
53
  role: "alert"
54
54
  }, [
55
- l.showIcon ? (m(), r(v(D.value), {
55
+ l.showIcon ? (m(), r(v(E.value), {
56
56
  key: 0,
57
57
  class: "w-5 h-5 shrink-0 mt-0.5"
58
58
  })) : i("", !0),
59
- o("div", j, [l.title ? (m(), a("h5", {
59
+ o("div", N, [l.title ? (m(), a("h5", {
60
60
  key: 0,
61
- class: u(["font-bold mb-1", N[l.variant]])
62
- }, y(l.title), 3)) : i("", !0), o("div", M, [l.message ? (m(), a(e, { key: 0 }, [s(y(l.message), 1)], 64)) : _(n.$slots, "default", { key: 1 }, void 0, !0)])]),
61
+ class: u(["font-bold mb-1 m-0 p-0 text-sm leading-snug", k[l.variant]])
62
+ }, y(l.title), 3)) : i("", !0), o("div", P, [l.message ? (m(), a(e, { key: 0 }, [s(y(l.message), 1)], 64)) : _(n.$slots, "default", { key: 1 }, void 0, !0)])]),
63
63
  l.dismissible ? (m(), a("button", {
64
64
  key: 1,
65
65
  type: "button",
66
66
  onClick: x,
67
- class: u(["p-1 -mr-1 rounded-lg transition-colors cursor-pointer", P[l.variant]]),
67
+ class: u(["p-1 -mr-1 rounded-lg transition-colors cursor-pointer", j[l.variant]]),
68
68
  "aria-label": "Close alert"
69
- }, [c(b(A), { class: "w-4 h-4" })], 2)) : i("", !0)
69
+ }, [c(b(M), { class: "w-4 h-4" })], 2)) : i("", !0)
70
70
  ], 2)) : i("", !0)]),
71
71
  _: 3
72
72
  }));
73
73
  }
74
- }), P = (e, t) => {
74
+ }), I = (e, t) => {
75
75
  let n = e.__vccOpts || e;
76
76
  for (let [e, r] of t) n[e] = r;
77
77
  return n;
78
- }, F = /*#__PURE__*/ P(N, [["__scopeId", "data-v-7a29c82f"]]), I = /* @__PURE__ */ l({
78
+ }, L = /*#__PURE__*/ I(F, [["__scopeId", "data-v-4b55fce4"]]), R = /* @__PURE__ */ l({
79
79
  __name: "Badge",
80
80
  props: {
81
81
  type: { default: "label" },
@@ -91,23 +91,25 @@ var j = { class: "flex-1 text-sm leading-relaxed" }, M = { class: "opacity-90" }
91
91
  },
92
92
  setup(e) {
93
93
  let t = e, r = n(() => t.appearance ? t.appearance : t.type === "label" ? "soft" : "solid"), o = {
94
- primary: "bg-blue-50 text-primary border-blue-200/70 dark:bg-blue-950/40 dark:text-blue-400 dark:border-blue-800/50",
95
- secondary: "bg-slate-100 text-slate-600 border-slate-200 dark:bg-slate-800/80 dark:text-slate-300 dark:border-slate-700",
94
+ primary: "bg-[color-mix(in_srgb,var(--kv-color-primary)_5%,transparent)] text-[var(--kv-color-primary)] border-[color-mix(in_srgb,var(--kv-color-primary)_10%,transparent)] dark:bg-[color-mix(in_srgb,var(--kv-color-primary)_10%,transparent)] dark:text-blue-400 dark:border-[color-mix(in_srgb,var(--kv-color-primary)_20%,transparent)] font-bold",
95
+ secondary: "bg-gray-50/80 text-gray-500 border-gray-100/50 dark:bg-slate-800/50 dark:text-slate-400 dark:border-slate-800/50",
96
+ "brand-secondary": "bg-[color-mix(in_srgb,var(--kv-color-secondary)_15%,transparent)] text-[var(--kv-color-secondary-dark)] border-[color-mix(in_srgb,var(--kv-color-secondary)_30%,transparent)] dark:text-[var(--kv-color-secondary)]",
96
97
  success: "bg-emerald-50 text-emerald-600 border-emerald-200 dark:bg-emerald-500/10 dark:text-emerald-400 dark:border-emerald-500/20",
97
98
  error: "bg-rose-50 text-rose-600 border-rose-200 dark:bg-rose-500/10 dark:text-rose-400 dark:border-rose-500/20",
98
99
  warning: "bg-amber-50 text-amber-600 border-amber-200 dark:bg-amber-500/10 dark:text-amber-400 dark:border-amber-500/20",
99
100
  info: "bg-sky-50 text-sky-600 border-sky-200 dark:bg-sky-500/10 dark:text-sky-400 dark:border-sky-500/20",
100
101
  outline: "bg-transparent text-slate-600 border-slate-200 dark:text-slate-400 dark:border-slate-700"
101
102
  }, s = {
102
- primary: "bg-[#4082E6] text-white border-transparent",
103
+ primary: "bg-[var(--kv-color-primary)] text-white border-transparent",
103
104
  secondary: "bg-slate-500 text-white border-transparent",
105
+ "brand-secondary": "bg-[var(--kv-color-secondary)] text-[var(--kv-color-soft-black)] border-transparent font-bold",
104
106
  success: "bg-emerald-500 text-white border-transparent",
105
107
  error: "bg-rose-500 text-white border-transparent",
106
108
  warning: "bg-amber-500 text-white border-transparent",
107
109
  info: "bg-sky-500 text-white border-transparent",
108
110
  outline: "bg-transparent text-slate-600 border-slate-200"
109
111
  }, c = {
110
- sm: "text-[12px] px-2 py-0.5 tracking-wide font-medium",
112
+ sm: "text-[12px] px-2.5 py-1 tracking-tight",
111
113
  md: "text-[14px] px-2.5 py-0.5 tracking-wide font-medium",
112
114
  lg: "text-[16px] px-3 py-1 tracking-wide font-medium"
113
115
  }, l = {
@@ -130,9 +132,10 @@ var j = { class: "flex-1 text-sm leading-relaxed" }, M = { class: "opacity-90" }
130
132
  sm: "rounded-sm",
131
133
  md: "rounded-md",
132
134
  lg: "rounded-lg",
133
- full: "rounded-full"
135
+ full: "rounded-full",
136
+ "card-corner": "rounded-bl-2xl rounded-tr-none rounded-tl-none rounded-br-none"
134
137
  }, g = n(() => {
135
- let e = "inline-flex items-center justify-center transition-all duration-200 select-none whitespace-nowrap box-border", n = r.value === "soft" ? o[t.variant] : s[t.variant];
138
+ let e = "inline-flex items-center justify-center gap-1.5 transition-all duration-200 select-none whitespace-nowrap box-border", n = r.value === "soft" ? o[t.variant] : s[t.variant];
136
139
  return t.type === "notification" ? [
137
140
  e,
138
141
  "rounded-full border",
@@ -156,7 +159,7 @@ var j = { class: "flex-1 text-sm leading-relaxed" }, M = { class: "opacity-90" }
156
159
  });
157
160
  return (t, n) => (m(), a("span", { class: u(g.value) }, [e.type === "hint" ? i("", !0) : _(t.$slots, "default", { key: 0 })], 2));
158
161
  }
159
- }), L = ["disabled"], R = /* @__PURE__ */ l({
162
+ }), z = /* @__PURE__ */ l({
160
163
  __name: "Button",
161
164
  props: {
162
165
  variant: { default: "primary" },
@@ -174,6 +177,7 @@ var j = { class: "flex-1 text-sm leading-relaxed" }, M = { class: "opacity-90" }
174
177
  default: !1
175
178
  },
176
179
  label: { default: "" },
180
+ href: { default: void 0 },
177
181
  iconLeft: {},
178
182
  iconRight: {},
179
183
  class: { default: "" }
@@ -181,9 +185,9 @@ var j = { class: "flex-1 text-sm leading-relaxed" }, M = { class: "opacity-90" }
181
185
  emits: ["click"],
182
186
  setup(t, { emit: o }) {
183
187
  let c = t, l = {
184
- primary: "bg-[#4082E6] text-white hover:bg-[#2d6ed4] focus-visible:ring-[#4082E6]",
188
+ primary: "bg-[var(--kv-color-primary)] text-white hover:bg-[var(--kv-color-primary-hover)] focus-visible:ring-[var(--kv-color-primary)]",
185
189
  outline: "border border-slate-200 bg-transparent text-slate-600 hover:bg-slate-50 hover:text-slate-900 focus-visible:ring-slate-400 dark:border-slate-700 dark:text-slate-300 dark:hover:bg-slate-800 dark:hover:text-slate-100",
186
- ghost: "bg-transparent text-slate-600 hover:bg-slate-100 hover:text-slate-900 focus-visible:ring-slate-400 dark:text-slate-300 dark:hover:bg-slate-800 dark:hover:text-slate-100",
190
+ ghost: "bg-transparent text-slate-500 hover:bg-slate-100 hover:text-slate-900 focus-visible:ring-slate-400 dark:text-slate-400 dark:hover:bg-slate-800 dark:hover:text-slate-100",
187
191
  danger: "bg-rose-500 text-white hover:bg-rose-600 focus-visible:ring-rose-500"
188
192
  }, d = {
189
193
  sm: "h-9 px-4 text-sm gap-1.5 [&_svg]:w-4 [&_svg]:h-4",
@@ -204,48 +208,284 @@ var j = { class: "flex-1 text-sm leading-relaxed" }, M = { class: "opacity-90" }
204
208
  c.icon ? f[c.size] : d[c.size],
205
209
  c.class
206
210
  ].filter(Boolean).join(" "));
207
- return (n, o) => (m(), a("button", {
211
+ return (n, o) => (m(), r(v(c.href ? "a" : "button"), {
212
+ href: c.href,
208
213
  class: u(g.value),
209
- disabled: t.disabled || t.loading,
214
+ disabled: c.href ? void 0 : t.disabled || t.loading,
210
215
  onClick: h
216
+ }, {
217
+ default: S(() => [
218
+ t.loading ? (m(), r(b(j), {
219
+ key: 0,
220
+ class: "animate-spin shrink-0"
221
+ })) : t.iconLeft ? (m(), r(v(t.iconLeft), { key: 1 })) : i("", !0),
222
+ t.label ? (m(), a(e, { key: 2 }, [s(y(t.label), 1)], 64)) : i("", !0),
223
+ _(n.$slots, "default"),
224
+ t.iconRight && !t.loading ? (m(), r(v(t.iconRight), { key: 3 })) : i("", !0)
225
+ ]),
226
+ _: 3
227
+ }, 8, [
228
+ "href",
229
+ "class",
230
+ "disabled"
231
+ ]));
232
+ }
233
+ }), ee = ["width", "height"], te = ["fill"], ne = ["fill"], re = ["fill"], B = /* @__PURE__ */ l({
234
+ __name: "LevelIcon",
235
+ props: {
236
+ level: { default: "beginner" },
237
+ size: { default: 14 },
238
+ class: { default: "" }
239
+ },
240
+ setup(e) {
241
+ let t = e, r = n(() => {
242
+ let e = t.level.toLowerCase();
243
+ return e.includes("pemula") || e.includes("begin") || e.includes("basic") || e.includes("all");
244
+ }), i = n(() => {
245
+ let e = t.level.toLowerCase();
246
+ return e.includes("menengah") || e.includes("inter");
247
+ }), s = n(() => {
248
+ let e = t.level.toLowerCase();
249
+ return e.includes("mahir") || e.includes("adv");
250
+ });
251
+ return (n, c) => (m(), a("svg", {
252
+ width: e.size,
253
+ height: e.size,
254
+ viewBox: "0 0 24 24",
255
+ fill: "none",
256
+ xmlns: "http://www.w3.org/2000/svg",
257
+ class: u(["shrink-0 text-[#4082E6] dark:text-blue-400", t.class])
211
258
  }, [
212
- t.loading ? (m(), r(b(k), {
213
- key: 0,
214
- class: "animate-spin shrink-0"
215
- })) : t.iconLeft ? (m(), r(v(t.iconLeft), { key: 1 })) : i("", !0),
216
- t.label ? (m(), a(e, { key: 2 }, [s(y(t.label), 1)], 64)) : i("", !0),
217
- _(n.$slots, "default"),
218
- t.iconRight && !t.loading ? (m(), r(v(t.iconRight), { key: 3 })) : i("", !0)
219
- ], 10, L));
259
+ o("rect", {
260
+ x: "3",
261
+ y: "14",
262
+ width: "4",
263
+ height: "7",
264
+ rx: "1.2",
265
+ fill: r.value || i.value || s.value ? "currentColor" : "rgba(156, 163, 175, 0.2)"
266
+ }, null, 8, te),
267
+ o("rect", {
268
+ x: "10",
269
+ y: "9",
270
+ width: "4",
271
+ height: "12",
272
+ rx: "1.2",
273
+ fill: i.value || s.value ? "currentColor" : "rgba(156, 163, 175, 0.2)"
274
+ }, null, 8, ne),
275
+ o("rect", {
276
+ x: "17",
277
+ y: "4",
278
+ width: "4",
279
+ height: "17",
280
+ rx: "1.2",
281
+ fill: s.value ? "currentColor" : "rgba(156, 163, 175, 0.2)"
282
+ }, null, 8, re)
283
+ ], 10, ee));
284
+ }
285
+ }), V = ["width", "height"], H = /* @__PURE__ */ l({
286
+ __name: "VideoIcon",
287
+ props: {
288
+ size: { default: 14 },
289
+ class: { default: "" }
290
+ },
291
+ setup(e) {
292
+ let t = e;
293
+ return (e, n) => (m(), a("svg", {
294
+ width: t.size,
295
+ height: t.size,
296
+ viewBox: "0 0 24 24",
297
+ fill: "none",
298
+ stroke: "currentColor",
299
+ "stroke-width": "2",
300
+ "stroke-linecap": "round",
301
+ "stroke-linejoin": "round",
302
+ xmlns: "http://www.w3.org/2000/svg",
303
+ class: u(["shrink-0", t.class])
304
+ }, [...n[0] ||= [o("polygon", {
305
+ points: "23 7 16 12 23 17 23 7",
306
+ fill: "currentColor",
307
+ stroke: "none"
308
+ }, null, -1), o("rect", {
309
+ x: "1",
310
+ y: "5",
311
+ width: "15",
312
+ height: "14",
313
+ rx: "2",
314
+ ry: "2"
315
+ }, null, -1)]], 10, V));
220
316
  }
221
- }), z = { class: "p-6" }, B = {
317
+ }), U = { class: "p-3 pb-0" }, W = { class: "relative aspect-video bg-slate-100 dark:bg-slate-800 rounded-2xl overflow-hidden" }, G = ["src", "alt"], K = {
222
318
  key: 0,
223
- class: "text-base font-semibold text-[#131313] dark:text-white"
224
- }, V = {
319
+ class: "absolute top-0 right-0 z-10 px-3 py-1.5 text-[10px] font-bold tracking-tight rounded-bl-2xl",
320
+ style: {
321
+ "background-color": "var(--kv-color-secondary)",
322
+ color: "var(--kv-color-primary)"
323
+ }
324
+ }, q = { class: "p-4 grow flex flex-col gap-3" }, J = { class: "flex items-center justify-between" }, Y = {
325
+ key: 0,
326
+ class: "opacity-60 font-normal"
327
+ }, X = { class: "font-bold text-base leading-snug line-clamp-2 text-slate-900 dark:text-slate-200" }, ie = ["href"], ae = { class: "mt-auto pt-4 border-t border-dashed border-slate-100 dark:border-slate-800 flex justify-between items-center px-1" }, oe = { class: "flex flex-col" }, se = {
328
+ key: 0,
329
+ class: "text-emerald-500 font-bold text-base"
330
+ }, ce = {
331
+ key: 0,
332
+ class: "text-slate-400 dark:text-slate-500 text-[10px] font-medium line-through mb-0.5"
333
+ }, le = {
334
+ class: "font-extrabold text-lg tracking-tight",
335
+ style: { color: "var(--kv-color-primary)" }
336
+ }, ue = ["href"], de = { class: "p-3 pb-0" }, fe = { class: "relative aspect-video bg-slate-100 dark:bg-slate-800 rounded-2xl overflow-hidden" }, pe = ["src", "alt"], me = { class: "p-4 grow flex flex-col" }, he = { class: "flex items-center justify-between mb-3 text-sm font-medium text-gray-400 dark:text-slate-500" }, ge = { class: "flex items-center gap-2 min-w-0" }, _e = ["src", "alt"], ve = { class: "truncate text-xs" }, ye = { class: "font-semibold whitespace-nowrap" }, be = { class: "font-bold text-base leading-tight line-clamp-2 text-slate-900 dark:text-slate-200 mb-3" }, xe = ["href"], Se = { class: "mt-auto pt-4 border-t border-dashed border-slate-100 dark:border-slate-800 flex justify-between items-center px-1" }, Ce = { class: "flex flex-col" }, we = {
337
+ key: 0,
338
+ class: "text-emerald-500 font-bold text-lg"
339
+ }, Te = {
225
340
  key: 1,
226
- class: "mt-1 text-sm text-slate-500 dark:text-slate-400"
227
- }, H = {
341
+ class: "font-extrabold text-xl tracking-tight",
342
+ style: { color: "var(--kv-color-primary)" }
343
+ }, Ee = ["href"], De = { class: "p-6 flex flex-col" }, Oe = {
344
+ key: 0,
345
+ class: "text-base font-semibold text-slate-900 dark:text-white"
346
+ }, ke = {
347
+ key: 1,
348
+ class: "mt-1 text-sm text-slate-400 dark:text-slate-500"
349
+ }, Z = {
228
350
  key: 0,
229
351
  class: "flex items-center justify-end gap-3 border-t border-slate-100 dark:border-slate-800 px-6 py-4 bg-slate-50/50 dark:bg-slate-950/50"
230
- }, U = /* @__PURE__ */ l({
352
+ }, Q = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='400' height='225' viewBox='0 0 400 225'><rect width='100%' height='100%' fill='%23f1f5f9'/><text x='200' y='118' font-family='Plus Jakarta Sans, system-ui, sans-serif' font-size='16' font-weight='bold' fill='%2394a3b8' text-anchor='middle'>400 x 225 px</text></svg>", Ae = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'><circle cx='10' cy='10' r='10' fill='%23e2e8f0'/></svg>", je = /* @__PURE__ */ l({
231
353
  __name: "Card",
232
354
  props: {
355
+ variant: { default: "default" },
233
356
  title: { default: "" },
234
357
  description: { default: "" },
235
- class: { default: "" }
358
+ image: { default: "" },
359
+ actionUrl: { default: "#" },
360
+ class: { default: "" },
361
+ badgeText: { default: "" },
362
+ level: { default: "" },
363
+ ratingCount: { default: 0 },
364
+ infoText: { default: "" },
365
+ price: { default: "" },
366
+ discountPrice: { default: "" },
367
+ eventType: { default: "Workshop" },
368
+ date: { default: "" },
369
+ speaker: { default: "" },
370
+ speakerAvatar: { default: "" },
371
+ status: { default: "open" }
236
372
  },
237
- setup(e) {
238
- let t = e;
239
- return (n, r) => (m(), a("div", { class: u(["rounded-3xl border border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 overflow-hidden", t.class]) }, [o("div", z, [
240
- e.title ? (m(), a("h3", B, y(e.title), 1)) : i("", !0),
241
- e.description ? (m(), a("p", V, y(e.description), 1)) : i("", !0),
242
- o("div", { class: u([e.title || e.description ? "mt-4" : ""]) }, [_(n.$slots, "default")], 2)
243
- ]), n.$slots.footer ? (m(), a("div", H, [_(n.$slots, "footer")])) : i("", !0)], 2));
373
+ setup(t) {
374
+ let n = t, l = (e) => e === "Gratis" || e === "Free" || e === 0 || e === "0";
375
+ return (d, f) => t.variant === "product" ? (m(), a("div", {
376
+ key: 0,
377
+ class: u(["group bg-white dark:bg-slate-900 rounded-[32px] border border-slate-100 dark:border-slate-800 overflow-hidden transition-all duration-500 h-full flex flex-col text-left", n.class])
378
+ }, [o("div", U, [o("div", W, [o("img", {
379
+ src: t.image || Q,
380
+ alt: t.title,
381
+ class: "w-full h-full object-cover"
382
+ }, null, 8, G), t.badgeText ? (m(), a("div", K, y(t.badgeText), 1)) : i("", !0)])]), o("div", q, [
383
+ o("div", J, [t.level ? (m(), r(R, {
384
+ key: 0,
385
+ variant: "secondary",
386
+ appearance: "soft",
387
+ rounded: "lg",
388
+ size: "sm"
389
+ }, {
390
+ default: S(() => [
391
+ c(B, { level: t.level }, null, 8, ["level"]),
392
+ o("span", null, y(t.level), 1),
393
+ t.ratingCount ? (m(), a("span", Y, "(" + y(t.ratingCount) + ")", 1)) : i("", !0)
394
+ ]),
395
+ _: 1
396
+ })) : i("", !0), t.infoText ? (m(), r(R, {
397
+ key: 1,
398
+ variant: "primary",
399
+ appearance: "soft",
400
+ rounded: "lg",
401
+ size: "sm"
402
+ }, {
403
+ default: S(() => [_(d.$slots, "info-icon", {}, () => [c(H, { size: 14 })]), o("span", null, y(t.infoText), 1)]),
404
+ _: 3
405
+ })) : i("", !0)]),
406
+ o("h3", X, [o("a", {
407
+ href: t.actionUrl,
408
+ class: "hover:text-[var(--kv-color-primary)] dark:hover:text-blue-400 transition-colors"
409
+ }, y(t.title), 9, ie)]),
410
+ o("div", ae, [o("div", oe, [l(t.price) ? (m(), a("span", se, "Gratis")) : (m(), a(e, { key: 1 }, [t.discountPrice ? (m(), a("span", ce, y(t.discountPrice), 1)) : i("", !0), o("span", le, y(t.price), 1)], 64))]), o("a", {
411
+ href: t.actionUrl,
412
+ class: "w-10 h-10 shrink-0 flex items-center justify-center rounded-2xl bg-slate-50 dark:bg-slate-800/50 text-slate-400 dark:text-slate-500 transition-all duration-500 border border-slate-100 dark:border-slate-800 hover:border-transparent"
413
+ }, [c(b(E), {
414
+ size: 18,
415
+ class: "-rotate-45"
416
+ })], 8, ue)])
417
+ ])], 2)) : t.variant === "event" ? (m(), a("div", {
418
+ key: 1,
419
+ class: u(["group bg-white dark:bg-slate-900 rounded-[32px] border border-slate-100 dark:border-slate-800 overflow-hidden transition-all duration-500 h-full flex flex-col text-left", n.class])
420
+ }, [o("div", de, [o("div", fe, [
421
+ o("img", {
422
+ src: t.image || Q,
423
+ alt: t.title,
424
+ class: "w-full h-full object-cover"
425
+ }, null, 8, pe),
426
+ t.eventType ? (m(), r(R, {
427
+ key: 0,
428
+ variant: "primary",
429
+ appearance: "soft",
430
+ rounded: "lg",
431
+ size: "sm",
432
+ class: "absolute top-3 left-3 z-10"
433
+ }, {
434
+ default: S(() => [s(y(t.eventType), 1)]),
435
+ _: 1
436
+ })) : i("", !0),
437
+ c(R, {
438
+ variant: t.status === "open" ? "success" : t.status === "closed" ? "secondary" : "primary",
439
+ appearance: "soft",
440
+ rounded: "card-corner",
441
+ size: "sm",
442
+ class: "absolute top-0 right-0 z-10"
443
+ }, {
444
+ default: S(() => [s(y(t.status === "open" ? "Open" : t.status === "closed" ? "Closed" : "Segera"), 1)]),
445
+ _: 1
446
+ }, 8, ["variant"])
447
+ ])]), o("div", me, [
448
+ o("div", he, [o("div", ge, [o("img", {
449
+ src: t.speakerAvatar || Ae,
450
+ alt: t.speaker,
451
+ class: "w-5 h-5 rounded-full object-cover border border-gray-100 dark:border-slate-700 shrink-0"
452
+ }, null, 8, _e), o("span", ve, y(t.speaker || "Speaker"), 1)]), t.date ? (m(), r(R, {
453
+ key: 0,
454
+ variant: "secondary",
455
+ appearance: "soft",
456
+ rounded: "lg",
457
+ size: "sm"
458
+ }, {
459
+ default: S(() => [c(b(D), { size: 12 }), o("span", ye, y(t.date), 1)]),
460
+ _: 1
461
+ })) : i("", !0)]),
462
+ o("h3", be, [o("a", {
463
+ href: t.actionUrl,
464
+ class: "hover:text-[var(--kv-color-primary)] dark:hover:text-blue-400 transition-colors"
465
+ }, y(t.title), 9, xe)]),
466
+ o("div", Se, [o("div", Ce, [l(t.price) ? (m(), a("span", we, "Gratis")) : (m(), a("span", Te, y(t.price), 1))]), o("a", {
467
+ href: t.actionUrl,
468
+ class: "w-10 h-10 flex items-center justify-center rounded-2xl bg-slate-50 dark:bg-slate-800/50 text-slate-400 dark:text-slate-500 transition-all duration-500 border border-slate-100 dark:border-slate-800 hover:border-transparent"
469
+ }, [c(b(E), {
470
+ size: 18,
471
+ class: "-rotate-45"
472
+ })], 8, Ee)])
473
+ ])], 2)) : (m(), a("div", {
474
+ key: 2,
475
+ class: u(["rounded-3xl border border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 overflow-hidden", n.class])
476
+ }, [o("div", De, [
477
+ t.title ? (m(), a("h3", Oe, y(t.title), 1)) : i("", !0),
478
+ t.description ? (m(), a("p", ke, y(t.description), 1)) : i("", !0),
479
+ d.$slots.default ? (m(), a("div", {
480
+ key: 2,
481
+ class: u(t.title || t.description ? "mt-4" : "")
482
+ }, [_(d.$slots, "default")], 2)) : i("", !0)
483
+ ]), d.$slots.footer ? (m(), a("div", Z, [_(d.$slots, "footer")])) : i("", !0)], 2));
244
484
  }
245
- }), W = ["disabled"], G = { class: "flex items-center gap-2" }, K = {
485
+ }), Me = ["disabled"], Ne = { class: "flex items-center gap-2" }, Pe = {
246
486
  key: 0,
247
487
  class: "krea-dropdown-divider"
248
- }, q = ["disabled", "onClick"], J = { class: "flex items-center gap-3" }, Y = /*#__PURE__*/ P(/* @__PURE__ */ l({
488
+ }, Fe = ["disabled", "onClick"], Ie = { class: "flex items-center gap-3" }, Le = /*#__PURE__*/ I(/* @__PURE__ */ l({
249
489
  __name: "DropdownMenu",
250
490
  props: {
251
491
  triggerText: { default: "Pilih Opsi" },
@@ -261,7 +501,7 @@ var j = { class: "flex-1 text-sm leading-relaxed" }, M = { class: "opacity-90" }
261
501
  },
262
502
  emits: ["update:modelValue", "select"],
263
503
  setup(t, { emit: s }) {
264
- let l = t, S = s, w = h(!1), T = h(null), E = n(() => l.items.find((e) => e.id === l.modelValue)), O = n(() => E.value?.label ?? l.triggerText), k = n(() => E.value?.icon), A = n(() => [
504
+ let l = t, S = s, w = h(!1), T = h(null), E = n(() => l.items.find((e) => e.id === l.modelValue)), D = n(() => E.value?.label ?? l.triggerText), O = n(() => E.value?.icon), A = n(() => [
265
505
  "inline-flex items-center justify-between whitespace-nowrap",
266
506
  "font-semibold transition-all duration-150",
267
507
  "focus:outline-none focus:ring-2 focus:ring-[#4082E6]",
@@ -300,23 +540,23 @@ var j = { class: "flex-1 text-sm leading-relaxed" }, M = { class: "opacity-90" }
300
540
  onClick: N,
301
541
  disabled: t.disabled,
302
542
  class: u(A.value)
303
- }, [o("div", G, [k.value ? (m(), r(v(k.value), {
543
+ }, [o("div", Ne, [O.value ? (m(), r(v(O.value), {
304
544
  key: 0,
305
545
  class: "w-4 h-4 shrink-0 text-slate-500 dark:text-slate-400"
306
- })) : i("", !0), o("span", null, y(O.value), 1)]), c(b(D), {
546
+ })) : i("", !0), o("span", null, y(D.value), 1)]), c(b(k), {
307
547
  class: u([j.value, "text-slate-400 shrink-0 transition-transform duration-200"]),
308
548
  style: d({ transform: w.value ? "rotate(180deg)" : "" })
309
- }, null, 8, ["class", "style"])], 10, W), C(o("div", { class: u(["krea-dropdown-popover", M.value]) }, [_(n.$slots, "default", {}, () => [(m(!0), a(e, null, g(t.items, (n, s) => (m(), a(e, { key: n.id ?? s }, [n.divider ? (m(), a("div", K)) : i("", !0), o("button", {
549
+ }, null, 8, ["class", "style"])], 10, Me), C(o("div", { class: u(["krea-dropdown-popover", M.value]) }, [_(n.$slots, "default", {}, () => [(m(!0), a(e, null, g(t.items, (n, s) => (m(), a(e, { key: n.id ?? s }, [n.divider ? (m(), a("div", Pe)) : i("", !0), o("button", {
310
550
  type: "button",
311
551
  disabled: n.disabled,
312
552
  onClick: (e) => P(n),
313
553
  class: u(["krea-dropdown-item", n.variant === "danger" ? "krea-dropdown-item--danger" : t.modelValue === n.id ? "krea-dropdown-item--active" : ""])
314
- }, [o("div", J, [n.icon ? (m(), r(v(n.icon), {
554
+ }, [o("div", Ie, [n.icon ? (m(), r(v(n.icon), {
315
555
  key: 0,
316
556
  class: "w-4 h-4 shrink-0 text-slate-400"
317
- })) : i("", !0), o("span", null, y(n.label), 1)])], 10, q)], 64))), 128))], !0)], 2), [[x, w.value]])], 512));
557
+ })) : i("", !0), o("span", null, y(n.label), 1)])], 10, Fe)], 64))), 128))], !0)], 2), [[x, w.value]])], 512));
318
558
  }
319
- }), [["__scopeId", "data-v-948716a5"]]), X = ["disabled", "onClick"], Z = /* @__PURE__ */ l({
559
+ }), [["__scopeId", "data-v-948716a5"]]), Re = ["disabled", "onClick"], ze = /* @__PURE__ */ l({
320
560
  __name: "Tabs",
321
561
  props: {
322
562
  modelValue: { default: "" },
@@ -355,18 +595,18 @@ var j = { class: "flex-1 text-sm leading-relaxed" }, M = { class: "opacity-90" }
355
595
  disabled: e.disabled,
356
596
  class: u(h(e)),
357
597
  onClick: (t) => d.value = e.id
358
- }, [e.icon ? (m(), r(v(e.icon), { key: 0 })) : i("", !0), s(" " + y(e.label), 1)], 10, X))), 128))], 2));
598
+ }, [e.icon ? (m(), r(v(e.icon), { key: 0 })) : i("", !0), s(" " + y(e.label), 1)], 10, Re))), 128))], 2));
359
599
  }
360
600
  });
361
601
  //#endregion
362
602
  //#region node_modules/tailwindcss/dist/plugin.mjs
363
- function Q(e, t) {
603
+ function $(e, t) {
364
604
  return {
365
605
  handler: e,
366
606
  config: t
367
607
  };
368
608
  }
369
- Q.withOptions = function(e, t = () => ({})) {
609
+ $.withOptions = function(e, t = () => ({})) {
370
610
  function n(n) {
371
611
  return {
372
612
  handler: e(n),
@@ -377,7 +617,7 @@ Q.withOptions = function(e, t = () => ({})) {
377
617
  };
378
618
  //#endregion
379
619
  //#region src/plugin.ts
380
- var $ = Q(function({ addBase: e, addComponents: t, theme: n }) {
620
+ var Be = $(function({ addBase: e, addComponents: t, theme: n }) {
381
621
  e({
382
622
  ":root": {
383
623
  "--kv-color-primary": "#4082E6",
@@ -424,4 +664,4 @@ var $ = Q(function({ addBase: e, addComponents: t, theme: n }) {
424
664
  }
425
665
  } } });
426
666
  //#endregion
427
- export { F as Alert, I as Badge, R as Button, U as Card, Y as DropdownMenu, Z as Tabs, $ as kreauiPlugin };
667
+ export { L as Alert, R as Badge, z as Button, je as Card, Le as DropdownMenu, B as LevelIcon, ze as Tabs, H as VideoIcon, Be as kreauiPlugin };
package/lib/kreaui.umd.js CHANGED
@@ -1 +1 @@
1
- (function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("vue"),require("lucide-vue-next")):typeof define==`function`&&define.amd?define([`exports`,`vue`,`lucide-vue-next`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.KreaUI={},e.Vue,e.LucideVueNext))})(this,function(e,t,n){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var r={class:`flex-1 text-sm leading-relaxed`},i={class:`opacity-90`},a=(0,t.defineComponent)({__name:`Alert`,props:{variant:{default:`info`},title:{default:``},message:{default:``},dismissible:{type:Boolean,default:!1},showIcon:{type:Boolean,default:!0},class:{default:``}},emits:[`close`],setup(e,{emit:a}){let o=e,s=a,c=(0,t.ref)(!0),l=()=>{c.value=!1,s(`close`)},u={info:n.Info,success:n.CheckCircle2,warning:n.AlertTriangle,danger:n.AlertCircle},d=(0,t.computed)(()=>u[o.variant]),f={info:`bg-blue-50 border-blue-200 text-blue-800 dark:bg-blue-950/20 dark:border-blue-900/50 dark:text-blue-300`,success:`bg-emerald-50 border-emerald-200 text-emerald-800 dark:bg-emerald-950/20 dark:border-emerald-900/50 dark:text-emerald-300`,warning:`bg-amber-50 border-amber-200 text-amber-800 dark:bg-amber-950/20 dark:border-amber-900/50 dark:text-amber-300`,danger:`bg-rose-50 border-rose-200 text-rose-800 dark:bg-rose-950/20 dark:border-rose-900/50 dark:text-rose-300`},p={info:`text-blue-900 dark:text-blue-200`,success:`text-emerald-900 dark:text-emerald-200`,warning:`text-amber-900 dark:text-amber-200`,danger:`text-rose-900 dark:text-rose-200`},m={info:`text-blue-500 hover:bg-blue-100 hover:text-blue-800 dark:text-blue-400 dark:hover:bg-blue-900/40 dark:hover:text-blue-200`,success:`text-emerald-500 hover:bg-emerald-100 hover:text-emerald-800 dark:text-emerald-400 dark:hover:bg-emerald-900/40 dark:hover:text-emerald-200`,warning:`text-amber-500 hover:bg-amber-100 hover:text-amber-800 dark:text-amber-400 dark:hover:bg-amber-900/40 dark:hover:text-amber-200`,danger:`text-rose-500 hover:bg-rose-100 hover:text-rose-800 dark:text-rose-400 dark:hover:bg-rose-900/40 dark:hover:text-rose-200`};return(a,s)=>((0,t.openBlock)(),(0,t.createBlock)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[c.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:(0,t.normalizeClass)([`flex items-start gap-3 p-4 border rounded-2xl transition-all duration-200`,f[e.variant],o.class]),role:`alert`},[e.showIcon?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(d.value),{key:0,class:`w-5 h-5 shrink-0 mt-0.5`})):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,r,[e.title?((0,t.openBlock)(),(0,t.createElementBlock)(`h5`,{key:0,class:(0,t.normalizeClass)([`font-bold mb-1`,p[e.variant]])},(0,t.toDisplayString)(e.title),3)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,i,[e.message?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:0},[(0,t.createTextVNode)((0,t.toDisplayString)(e.message),1)],64)):(0,t.renderSlot)(a.$slots,`default`,{key:1},void 0,!0)])]),e.dismissible?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:1,type:`button`,onClick:l,class:(0,t.normalizeClass)([`p-1 -mr-1 rounded-lg transition-colors cursor-pointer`,m[e.variant]]),"aria-label":`Close alert`},[(0,t.createVNode)((0,t.unref)(n.X),{class:`w-4 h-4`})],2)):(0,t.createCommentVNode)(``,!0)],2)):(0,t.createCommentVNode)(``,!0)]),_:3}))}}),o=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},s=o(a,[[`__scopeId`,`data-v-7a29c82f`]]),c=(0,t.defineComponent)({__name:`Badge`,props:{type:{default:`label`},variant:{default:`primary`},appearance:{},size:{default:`md`},rounded:{default:`lg`},iconOnly:{type:Boolean,default:!1},class:{default:``}},setup(e){let n=e,r=(0,t.computed)(()=>n.appearance?n.appearance:n.type===`label`?`soft`:`solid`),i={primary:`bg-blue-50 text-primary border-blue-200/70 dark:bg-blue-950/40 dark:text-blue-400 dark:border-blue-800/50`,secondary:`bg-slate-100 text-slate-600 border-slate-200 dark:bg-slate-800/80 dark:text-slate-300 dark:border-slate-700`,success:`bg-emerald-50 text-emerald-600 border-emerald-200 dark:bg-emerald-500/10 dark:text-emerald-400 dark:border-emerald-500/20`,error:`bg-rose-50 text-rose-600 border-rose-200 dark:bg-rose-500/10 dark:text-rose-400 dark:border-rose-500/20`,warning:`bg-amber-50 text-amber-600 border-amber-200 dark:bg-amber-500/10 dark:text-amber-400 dark:border-amber-500/20`,info:`bg-sky-50 text-sky-600 border-sky-200 dark:bg-sky-500/10 dark:text-sky-400 dark:border-sky-500/20`,outline:`bg-transparent text-slate-600 border-slate-200 dark:text-slate-400 dark:border-slate-700`},a={primary:`bg-[#4082E6] text-white border-transparent`,secondary:`bg-slate-500 text-white border-transparent`,success:`bg-emerald-500 text-white border-transparent`,error:`bg-rose-500 text-white border-transparent`,warning:`bg-amber-500 text-white border-transparent`,info:`bg-sky-500 text-white border-transparent`,outline:`bg-transparent text-slate-600 border-slate-200`},o={sm:`text-[12px] px-2 py-0.5 tracking-wide font-medium`,md:`text-[14px] px-2.5 py-0.5 tracking-wide font-medium`,lg:`text-[16px] px-3 py-1 tracking-wide font-medium`},s={sm:`text-[12px] h-4 min-w-[16px] px-1 font-bold`,md:`text-[12px] h-5 min-w-[20px] px-1.5 font-bold`,lg:`text-[14px] h-6 min-w-[24px] px-2 font-bold`},c={sm:`h-4 w-4`,md:`h-5 w-5`,lg:`h-6 w-6`},l={sm:`h-5 w-5`,md:`h-6 w-6`,lg:`h-7 w-7`},u={sm:`h-2 w-2`,md:`h-3 w-3`,lg:`h-4 w-4`},d={sm:`rounded-sm`,md:`rounded-md`,lg:`rounded-lg`,full:`rounded-full`},f=(0,t.computed)(()=>{let e=`inline-flex items-center justify-center transition-all duration-200 select-none whitespace-nowrap box-border`,t=r.value===`soft`?i[n.variant]:a[n.variant];return n.type===`notification`?[e,`rounded-full border`,t,n.iconOnly?c[n.size]:s[n.size],n.class].filter(Boolean).join(` `):n.type===`hint`?[e,`rounded-full border`,t,u[n.size],n.class].filter(Boolean).join(` `):[e,`border`,t,n.iconOnly?l[n.size]:o[n.size],d[n.rounded],n.class].filter(Boolean).join(` `)});return(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`span`,{class:(0,t.normalizeClass)(f.value)},[e.type===`hint`?(0,t.createCommentVNode)(``,!0):(0,t.renderSlot)(n.$slots,`default`,{key:0})],2))}}),l=[`disabled`],u=(0,t.defineComponent)({__name:`Button`,props:{variant:{default:`primary`},size:{default:`md`},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},icon:{type:Boolean,default:!1},label:{default:``},iconLeft:{},iconRight:{},class:{default:``}},emits:[`click`],setup(e,{emit:r}){let i=e,a={primary:`bg-[#4082E6] text-white hover:bg-[#2d6ed4] focus-visible:ring-[#4082E6]`,outline:`border border-slate-200 bg-transparent text-slate-600 hover:bg-slate-50 hover:text-slate-900 focus-visible:ring-slate-400 dark:border-slate-700 dark:text-slate-300 dark:hover:bg-slate-800 dark:hover:text-slate-100`,ghost:`bg-transparent text-slate-600 hover:bg-slate-100 hover:text-slate-900 focus-visible:ring-slate-400 dark:text-slate-300 dark:hover:bg-slate-800 dark:hover:text-slate-100`,danger:`bg-rose-500 text-white hover:bg-rose-600 focus-visible:ring-rose-500`},o={sm:`h-9 px-4 text-sm gap-1.5 [&_svg]:w-4 [&_svg]:h-4`,md:`h-11 px-6 text-base gap-2 [&_svg]:w-5 [&_svg]:h-5`,lg:`h-14 px-10 text-2xl gap-2.5 [&_svg]:w-6 [&_svg]:h-6`},s={sm:`h-9 w-9 text-lg [&_svg]:w-6 [&_svg]:h-6`,md:`h-11 w-11 text-xl [&_svg]:w-8 [&_svg]:h-8`,lg:`h-14 w-14 text-2xl [&_svg]:w-10 [&_svg]:h-10`},c=r,u=e=>{!i.disabled&&!i.loading&&c(`click`,e)},d=(0,t.computed)(()=>[`inline-flex items-center justify-center whitespace-nowrap rounded-2xl transition-colors duration-200`,i.icon?`font-medium`:`font-bold`,`focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2`,`disabled:pointer-events-none disabled:opacity-50`,a[i.variant],i.icon?s[i.size]:o[i.size],i.class].filter(Boolean).join(` `));return(r,i)=>((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{class:(0,t.normalizeClass)(d.value),disabled:e.disabled||e.loading,onClick:u},[e.loading?((0,t.openBlock)(),(0,t.createBlock)((0,t.unref)(n.Loader2),{key:0,class:`animate-spin shrink-0`})):e.iconLeft?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(e.iconLeft),{key:1})):(0,t.createCommentVNode)(``,!0),e.label?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:2},[(0,t.createTextVNode)((0,t.toDisplayString)(e.label),1)],64)):(0,t.createCommentVNode)(``,!0),(0,t.renderSlot)(r.$slots,`default`),e.iconRight&&!e.loading?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(e.iconRight),{key:3})):(0,t.createCommentVNode)(``,!0)],10,l))}}),d={class:`p-6`},f={key:0,class:`text-base font-semibold text-[#131313] dark:text-white`},p={key:1,class:`mt-1 text-sm text-slate-500 dark:text-slate-400`},m={key:0,class:`flex items-center justify-end gap-3 border-t border-slate-100 dark:border-slate-800 px-6 py-4 bg-slate-50/50 dark:bg-slate-950/50`},h=(0,t.defineComponent)({__name:`Card`,props:{title:{default:``},description:{default:``},class:{default:``}},setup(e){let n=e;return(r,i)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:(0,t.normalizeClass)([`rounded-3xl border border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 overflow-hidden`,n.class])},[(0,t.createElementVNode)(`div`,d,[e.title?((0,t.openBlock)(),(0,t.createElementBlock)(`h3`,f,(0,t.toDisplayString)(e.title),1)):(0,t.createCommentVNode)(``,!0),e.description?((0,t.openBlock)(),(0,t.createElementBlock)(`p`,p,(0,t.toDisplayString)(e.description),1)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([e.title||e.description?`mt-4`:``])},[(0,t.renderSlot)(r.$slots,`default`)],2)]),r.$slots.footer?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,m,[(0,t.renderSlot)(r.$slots,`footer`)])):(0,t.createCommentVNode)(``,!0)],2))}}),g=[`disabled`],_={class:`flex items-center gap-2`},v={key:0,class:`krea-dropdown-divider`},y=[`disabled`,`onClick`],b={class:`flex items-center gap-3`},x=o((0,t.defineComponent)({__name:`DropdownMenu`,props:{triggerText:{default:`Pilih Opsi`},align:{default:`left`},disabled:{type:Boolean,default:!1},items:{default:()=>[]},modelValue:{default:``},variant:{default:`default`},size:{default:`md`}},emits:[`update:modelValue`,`select`],setup(e,{emit:r}){let i=e,a=r,o=(0,t.ref)(!1),s=(0,t.ref)(null),c=(0,t.computed)(()=>i.items.find(e=>e.id===i.modelValue)),l=(0,t.computed)(()=>c.value?.label??i.triggerText),u=(0,t.computed)(()=>c.value?.icon),d=(0,t.computed)(()=>[`inline-flex items-center justify-between whitespace-nowrap`,`font-semibold transition-all duration-150`,`focus:outline-none focus:ring-2 focus:ring-[#4082E6]`,`disabled:pointer-events-none disabled:opacity-50 cursor-pointer`,{default:`border border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 text-slate-700 dark:text-slate-200 hover:bg-slate-50 dark:hover:bg-slate-800`,ghost:`bg-transparent text-slate-700 dark:text-slate-200 hover:bg-slate-100 dark:hover:bg-slate-800`,outline:`border border-slate-300 dark:border-slate-700 bg-transparent text-slate-700 dark:text-slate-200 hover:border-[#4082E6] hover:text-[#4082E6]`}[i.variant],{sm:`h-8 px-3 text-xs rounded-xl gap-2`,md:`h-10 px-4 text-sm rounded-2xl gap-2.5`,lg:`h-12 px-5 text-base rounded-2xl gap-3`}[i.size]].join(` `)),f=(0,t.computed)(()=>({sm:`w-3 h-3`,md:`w-4 h-4`,lg:`w-4 h-4`})[i.size]),p=(0,t.computed)(()=>i.align===`right`?`right-0`:`left-0`),m=()=>{i.disabled||(o.value=!o.value)},h=e=>{e.disabled||(a(`update:modelValue`,e.id),a(`select`,e),o.value=!1)},x=e=>{o.value&&(s.value?.contains(e.target)||(o.value=!1))};return(0,t.onMounted)(()=>{document.addEventListener(`mousedown`,x)}),(0,t.onUnmounted)(()=>{document.removeEventListener(`mousedown`,x)}),(r,i)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{ref_key:`wrapperEl`,ref:s,class:`krea-dropdown-wrapper`},[(0,t.createElementVNode)(`button`,{type:`button`,onClick:m,disabled:e.disabled,class:(0,t.normalizeClass)(d.value)},[(0,t.createElementVNode)(`div`,_,[u.value?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(u.value),{key:0,class:`w-4 h-4 shrink-0 text-slate-500 dark:text-slate-400`})):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`span`,null,(0,t.toDisplayString)(l.value),1)]),(0,t.createVNode)((0,t.unref)(n.ChevronDown),{class:(0,t.normalizeClass)([f.value,`text-slate-400 shrink-0 transition-transform duration-200`]),style:(0,t.normalizeStyle)({transform:o.value?`rotate(180deg)`:``})},null,8,[`class`,`style`])],10,g),(0,t.withDirectives)((0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`krea-dropdown-popover`,p.value])},[(0,t.renderSlot)(r.$slots,`default`,{},()=>[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.items,(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:n.id??r},[n.divider?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,v)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`button`,{type:`button`,disabled:n.disabled,onClick:e=>h(n),class:(0,t.normalizeClass)([`krea-dropdown-item`,n.variant===`danger`?`krea-dropdown-item--danger`:e.modelValue===n.id?`krea-dropdown-item--active`:``])},[(0,t.createElementVNode)(`div`,b,[n.icon?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(n.icon),{key:0,class:`w-4 h-4 shrink-0 text-slate-400`})):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`span`,null,(0,t.toDisplayString)(n.label),1)])],10,y)],64))),128))],!0)],2),[[t.vShow,o.value]])],512))}}),[[`__scopeId`,`data-v-948716a5`]]),S=[`disabled`,`onClick`],C=(0,t.defineComponent)({__name:`Tabs`,props:{modelValue:{default:``},items:{},variant:{default:`pills`},size:{default:`md`},class:{default:``}},emits:[`update:modelValue`,`change`],setup(e,{emit:n}){let r=e,i=n,a=(0,t.computed)({get:()=>r.modelValue||r.items[0]?.id||``,set:e=>{i(`update:modelValue`,e),i(`change`,e)}}),o=(0,t.computed)(()=>r.variant===`pills`?`inline-flex items-center p-1.5 gap-1 bg-slate-100 dark:bg-slate-900 border border-slate-200/60 dark:border-slate-800 rounded-2xl`:r.variant===`separated`?`inline-flex items-center gap-2 flex-wrap`:`flex items-center gap-6 border-b border-slate-200 dark:border-slate-800 w-full`),s={sm:`px-3 py-1.5 text-sm gap-1.5 [&_svg]:w-4 [&_svg]:h-4`,md:`px-5 py-2 text-sm gap-2 [&_svg]:w-4 [&_svg]:h-4`,lg:`px-7 py-3 text-base gap-2.5 [&_svg]:w-5 [&_svg]:h-5`};function c(e){let t=a.value===e.id;return r.variant===`pills`||r.variant===`separated`?[`inline-flex items-center rounded-xl font-medium transition-all duration-200 focus:outline-none disabled:pointer-events-none disabled:opacity-50`,s[r.size],t?`bg-[#4082E6] text-white font-semibold`:`text-slate-600 dark:text-slate-400 hover:text-slate-900 dark:hover:text-white hover:bg-slate-200/50 dark:hover:bg-slate-800`].join(` `):[`inline-flex items-center font-medium border-b-2 -mb-px pb-3 transition-colors focus:outline-none disabled:pointer-events-none disabled:opacity-50`,s[r.size],t?`border-[#4082E6] text-[#4082E6] font-semibold`:`border-transparent text-slate-500 hover:text-slate-800 dark:hover:text-slate-200`].join(` `)}return(n,i)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:(0,t.normalizeClass)([o.value,r.class])},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.items,e=>((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:e.id,type:`button`,disabled:e.disabled,class:(0,t.normalizeClass)(c(e)),onClick:t=>a.value=e.id},[e.icon?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(e.icon),{key:0})):(0,t.createCommentVNode)(``,!0),(0,t.createTextVNode)(` `+(0,t.toDisplayString)(e.label),1)],10,S))),128))],2))}});function w(e,t){return{handler:e,config:t}}w.withOptions=function(e,t=()=>({})){function n(n){return{handler:e(n),config:t(n)}}return n.__isOptionsFunction=!0,n};var T=w(function({addBase:e,addComponents:t,theme:n}){e({":root":{"--kv-color-primary":`#4082E6`,"--kv-color-primary-hover":`#2d6ed4`,"--kv-color-primary-light":`#dbeafe`,"--kv-color-secondary":`#FEF747`,"--kv-color-soft-black":`#121212`,"--kv-color-soft-white":`#fafafa`,"--kv-color-surface":`#ffffff`,"--kv-color-border":`#e2e8f0`,"--kv-color-muted":`#64748b`,"--kv-color-muted-light":`#f1f5f9`,"--kv-color-danger":`#f43f5e`,"--kv-radius-sm":`0.75rem`,"--kv-radius-md":`1rem`,"--kv-radius-default":`1.5rem`,"--kv-shadow-none":`none`},'[data-theme="dark"]':{"--kv-color-soft-black":`#fafafa`,"--kv-color-soft-white":`#09090b`,"--kv-color-surface":`#0f0f12`,"--kv-color-border":`#27272a`,"--kv-color-muted":`#a1a1aa`,"--kv-color-muted-light":`#18181b`}})},{theme:{extend:{colors:{kv:{primary:{DEFAULT:`var(--kv-color-primary)`,hover:`var(--kv-color-primary-hover)`,light:`var(--kv-color-primary-light)`},secondary:`var(--kv-color-secondary)`,surface:`var(--kv-color-surface)`,border:`var(--kv-color-border)`,muted:`var(--kv-color-muted)`}},borderRadius:{"kv-sm":`var(--kv-radius-sm)`,"kv-md":`var(--kv-radius-md)`,"kv-default":`var(--kv-radius-default)`}}}});e.Alert=s,e.Badge=c,e.Button=u,e.Card=h,e.DropdownMenu=x,e.Tabs=C,e.kreauiPlugin=T});
1
+ (function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("vue"),require("lucide-vue-next")):typeof define==`function`&&define.amd?define([`exports`,`vue`,`lucide-vue-next`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.KreaUI={},e.Vue,e.LucideVueNext))})(this,function(e,t,n){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var r={class:`flex-1 text-sm leading-relaxed`},i={class:`opacity-90 [&_p]:m-0 [&_p]:leading-relaxed`},a=(0,t.defineComponent)({__name:`Alert`,props:{variant:{default:`info`},title:{default:``},message:{default:``},dismissible:{type:Boolean,default:!1},showIcon:{type:Boolean,default:!0},class:{default:``}},emits:[`close`],setup(e,{emit:a}){let o=e,s=a,c=(0,t.ref)(!0),l=()=>{c.value=!1,s(`close`)},u={info:n.Info,success:n.CheckCircle2,warning:n.AlertTriangle,danger:n.AlertCircle},d=(0,t.computed)(()=>u[o.variant]),f={info:`bg-blue-50 border-blue-200 text-blue-800 dark:bg-blue-950/20 dark:border-blue-900/50 dark:text-blue-300`,success:`bg-emerald-50 border-emerald-200 text-emerald-800 dark:bg-emerald-950/20 dark:border-emerald-900/50 dark:text-emerald-300`,warning:`bg-amber-50 border-amber-200 text-amber-800 dark:bg-amber-950/20 dark:border-amber-900/50 dark:text-amber-300`,danger:`bg-rose-50 border-rose-200 text-rose-800 dark:bg-rose-950/20 dark:border-rose-900/50 dark:text-rose-300`},p={info:`text-blue-900 dark:text-blue-200`,success:`text-emerald-900 dark:text-emerald-200`,warning:`text-amber-900 dark:text-amber-200`,danger:`text-rose-900 dark:text-rose-200`},m={info:`text-blue-500 hover:bg-blue-100 hover:text-blue-800 dark:text-blue-400 dark:hover:bg-blue-900/40 dark:hover:text-blue-200`,success:`text-emerald-500 hover:bg-emerald-100 hover:text-emerald-800 dark:text-emerald-400 dark:hover:bg-emerald-900/40 dark:hover:text-emerald-200`,warning:`text-amber-500 hover:bg-amber-100 hover:text-amber-800 dark:text-amber-400 dark:hover:bg-amber-900/40 dark:hover:text-amber-200`,danger:`text-rose-500 hover:bg-rose-100 hover:text-rose-800 dark:text-rose-400 dark:hover:bg-rose-900/40 dark:hover:text-rose-200`};return(a,s)=>((0,t.openBlock)(),(0,t.createBlock)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[c.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:(0,t.normalizeClass)([`flex items-start gap-3 p-4 border rounded-2xl transition-all duration-200 not-content`,f[e.variant],o.class]),role:`alert`},[e.showIcon?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(d.value),{key:0,class:`w-5 h-5 shrink-0 mt-0.5`})):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,r,[e.title?((0,t.openBlock)(),(0,t.createElementBlock)(`h5`,{key:0,class:(0,t.normalizeClass)([`font-bold mb-1 m-0 p-0 text-sm leading-snug`,p[e.variant]])},(0,t.toDisplayString)(e.title),3)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,i,[e.message?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:0},[(0,t.createTextVNode)((0,t.toDisplayString)(e.message),1)],64)):(0,t.renderSlot)(a.$slots,`default`,{key:1},void 0,!0)])]),e.dismissible?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:1,type:`button`,onClick:l,class:(0,t.normalizeClass)([`p-1 -mr-1 rounded-lg transition-colors cursor-pointer`,m[e.variant]]),"aria-label":`Close alert`},[(0,t.createVNode)((0,t.unref)(n.X),{class:`w-4 h-4`})],2)):(0,t.createCommentVNode)(``,!0)],2)):(0,t.createCommentVNode)(``,!0)]),_:3}))}}),o=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},s=o(a,[[`__scopeId`,`data-v-4b55fce4`]]),c=(0,t.defineComponent)({__name:`Badge`,props:{type:{default:`label`},variant:{default:`primary`},appearance:{},size:{default:`md`},rounded:{default:`lg`},iconOnly:{type:Boolean,default:!1},class:{default:``}},setup(e){let n=e,r=(0,t.computed)(()=>n.appearance?n.appearance:n.type===`label`?`soft`:`solid`),i={primary:`bg-[color-mix(in_srgb,var(--kv-color-primary)_5%,transparent)] text-[var(--kv-color-primary)] border-[color-mix(in_srgb,var(--kv-color-primary)_10%,transparent)] dark:bg-[color-mix(in_srgb,var(--kv-color-primary)_10%,transparent)] dark:text-blue-400 dark:border-[color-mix(in_srgb,var(--kv-color-primary)_20%,transparent)] font-bold`,secondary:`bg-gray-50/80 text-gray-500 border-gray-100/50 dark:bg-slate-800/50 dark:text-slate-400 dark:border-slate-800/50`,"brand-secondary":`bg-[color-mix(in_srgb,var(--kv-color-secondary)_15%,transparent)] text-[var(--kv-color-secondary-dark)] border-[color-mix(in_srgb,var(--kv-color-secondary)_30%,transparent)] dark:text-[var(--kv-color-secondary)]`,success:`bg-emerald-50 text-emerald-600 border-emerald-200 dark:bg-emerald-500/10 dark:text-emerald-400 dark:border-emerald-500/20`,error:`bg-rose-50 text-rose-600 border-rose-200 dark:bg-rose-500/10 dark:text-rose-400 dark:border-rose-500/20`,warning:`bg-amber-50 text-amber-600 border-amber-200 dark:bg-amber-500/10 dark:text-amber-400 dark:border-amber-500/20`,info:`bg-sky-50 text-sky-600 border-sky-200 dark:bg-sky-500/10 dark:text-sky-400 dark:border-sky-500/20`,outline:`bg-transparent text-slate-600 border-slate-200 dark:text-slate-400 dark:border-slate-700`},a={primary:`bg-[var(--kv-color-primary)] text-white border-transparent`,secondary:`bg-slate-500 text-white border-transparent`,"brand-secondary":`bg-[var(--kv-color-secondary)] text-[var(--kv-color-soft-black)] border-transparent font-bold`,success:`bg-emerald-500 text-white border-transparent`,error:`bg-rose-500 text-white border-transparent`,warning:`bg-amber-500 text-white border-transparent`,info:`bg-sky-500 text-white border-transparent`,outline:`bg-transparent text-slate-600 border-slate-200`},o={sm:`text-[12px] px-2.5 py-1 tracking-tight`,md:`text-[14px] px-2.5 py-0.5 tracking-wide font-medium`,lg:`text-[16px] px-3 py-1 tracking-wide font-medium`},s={sm:`text-[12px] h-4 min-w-[16px] px-1 font-bold`,md:`text-[12px] h-5 min-w-[20px] px-1.5 font-bold`,lg:`text-[14px] h-6 min-w-[24px] px-2 font-bold`},c={sm:`h-4 w-4`,md:`h-5 w-5`,lg:`h-6 w-6`},l={sm:`h-5 w-5`,md:`h-6 w-6`,lg:`h-7 w-7`},u={sm:`h-2 w-2`,md:`h-3 w-3`,lg:`h-4 w-4`},d={sm:`rounded-sm`,md:`rounded-md`,lg:`rounded-lg`,full:`rounded-full`,"card-corner":`rounded-bl-2xl rounded-tr-none rounded-tl-none rounded-br-none`},f=(0,t.computed)(()=>{let e=`inline-flex items-center justify-center gap-1.5 transition-all duration-200 select-none whitespace-nowrap box-border`,t=r.value===`soft`?i[n.variant]:a[n.variant];return n.type===`notification`?[e,`rounded-full border`,t,n.iconOnly?c[n.size]:s[n.size],n.class].filter(Boolean).join(` `):n.type===`hint`?[e,`rounded-full border`,t,u[n.size],n.class].filter(Boolean).join(` `):[e,`border`,t,n.iconOnly?l[n.size]:o[n.size],d[n.rounded],n.class].filter(Boolean).join(` `)});return(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`span`,{class:(0,t.normalizeClass)(f.value)},[e.type===`hint`?(0,t.createCommentVNode)(``,!0):(0,t.renderSlot)(n.$slots,`default`,{key:0})],2))}}),l=(0,t.defineComponent)({__name:`Button`,props:{variant:{default:`primary`},size:{default:`md`},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},icon:{type:Boolean,default:!1},label:{default:``},href:{default:void 0},iconLeft:{},iconRight:{},class:{default:``}},emits:[`click`],setup(e,{emit:r}){let i=e,a={primary:`bg-[var(--kv-color-primary)] text-white hover:bg-[var(--kv-color-primary-hover)] focus-visible:ring-[var(--kv-color-primary)]`,outline:`border border-slate-200 bg-transparent text-slate-600 hover:bg-slate-50 hover:text-slate-900 focus-visible:ring-slate-400 dark:border-slate-700 dark:text-slate-300 dark:hover:bg-slate-800 dark:hover:text-slate-100`,ghost:`bg-transparent text-slate-500 hover:bg-slate-100 hover:text-slate-900 focus-visible:ring-slate-400 dark:text-slate-400 dark:hover:bg-slate-800 dark:hover:text-slate-100`,danger:`bg-rose-500 text-white hover:bg-rose-600 focus-visible:ring-rose-500`},o={sm:`h-9 px-4 text-sm gap-1.5 [&_svg]:w-4 [&_svg]:h-4`,md:`h-11 px-6 text-base gap-2 [&_svg]:w-5 [&_svg]:h-5`,lg:`h-14 px-10 text-2xl gap-2.5 [&_svg]:w-6 [&_svg]:h-6`},s={sm:`h-9 w-9 text-lg [&_svg]:w-6 [&_svg]:h-6`,md:`h-11 w-11 text-xl [&_svg]:w-8 [&_svg]:h-8`,lg:`h-14 w-14 text-2xl [&_svg]:w-10 [&_svg]:h-10`},c=r,l=e=>{!i.disabled&&!i.loading&&c(`click`,e)},u=(0,t.computed)(()=>[`inline-flex items-center justify-center whitespace-nowrap rounded-2xl transition-colors duration-200`,i.icon?`font-medium`:`font-bold`,`focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2`,`disabled:pointer-events-none disabled:opacity-50`,a[i.variant],i.icon?s[i.size]:o[i.size],i.class].filter(Boolean).join(` `));return(r,a)=>((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(i.href?`a`:`button`),{href:i.href,class:(0,t.normalizeClass)(u.value),disabled:i.href?void 0:e.disabled||e.loading,onClick:l},{default:(0,t.withCtx)(()=>[e.loading?((0,t.openBlock)(),(0,t.createBlock)((0,t.unref)(n.Loader2),{key:0,class:`animate-spin shrink-0`})):e.iconLeft?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(e.iconLeft),{key:1})):(0,t.createCommentVNode)(``,!0),e.label?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:2},[(0,t.createTextVNode)((0,t.toDisplayString)(e.label),1)],64)):(0,t.createCommentVNode)(``,!0),(0,t.renderSlot)(r.$slots,`default`),e.iconRight&&!e.loading?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(e.iconRight),{key:3})):(0,t.createCommentVNode)(``,!0)]),_:3},8,[`href`,`class`,`disabled`]))}}),u=[`width`,`height`],d=[`fill`],f=[`fill`],p=[`fill`],m=(0,t.defineComponent)({__name:`LevelIcon`,props:{level:{default:`beginner`},size:{default:14},class:{default:``}},setup(e){let n=e,r=(0,t.computed)(()=>{let e=n.level.toLowerCase();return e.includes(`pemula`)||e.includes(`begin`)||e.includes(`basic`)||e.includes(`all`)}),i=(0,t.computed)(()=>{let e=n.level.toLowerCase();return e.includes(`menengah`)||e.includes(`inter`)}),a=(0,t.computed)(()=>{let e=n.level.toLowerCase();return e.includes(`mahir`)||e.includes(`adv`)});return(o,s)=>((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,{width:e.size,height:e.size,viewBox:`0 0 24 24`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,class:(0,t.normalizeClass)([`shrink-0 text-[#4082E6] dark:text-blue-400`,n.class])},[(0,t.createElementVNode)(`rect`,{x:`3`,y:`14`,width:`4`,height:`7`,rx:`1.2`,fill:r.value||i.value||a.value?`currentColor`:`rgba(156, 163, 175, 0.2)`},null,8,d),(0,t.createElementVNode)(`rect`,{x:`10`,y:`9`,width:`4`,height:`12`,rx:`1.2`,fill:i.value||a.value?`currentColor`:`rgba(156, 163, 175, 0.2)`},null,8,f),(0,t.createElementVNode)(`rect`,{x:`17`,y:`4`,width:`4`,height:`17`,rx:`1.2`,fill:a.value?`currentColor`:`rgba(156, 163, 175, 0.2)`},null,8,p)],10,u))}}),h=[`width`,`height`],g=(0,t.defineComponent)({__name:`VideoIcon`,props:{size:{default:14},class:{default:``}},setup(e){let n=e;return(e,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,{width:n.size,height:n.size,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`,xmlns:`http://www.w3.org/2000/svg`,class:(0,t.normalizeClass)([`shrink-0`,n.class])},[...r[0]||=[(0,t.createElementVNode)(`polygon`,{points:`23 7 16 12 23 17 23 7`,fill:`currentColor`,stroke:`none`},null,-1),(0,t.createElementVNode)(`rect`,{x:`1`,y:`5`,width:`15`,height:`14`,rx:`2`,ry:`2`},null,-1)]],10,h))}}),_={class:`p-3 pb-0`},ee={class:`relative aspect-video bg-slate-100 dark:bg-slate-800 rounded-2xl overflow-hidden`},te=[`src`,`alt`],v={key:0,class:`absolute top-0 right-0 z-10 px-3 py-1.5 text-[10px] font-bold tracking-tight rounded-bl-2xl`,style:{"background-color":`var(--kv-color-secondary)`,color:`var(--kv-color-primary)`}},y={class:`p-4 grow flex flex-col gap-3`},b={class:`flex items-center justify-between`},x={key:0,class:`opacity-60 font-normal`},S={class:`font-bold text-base leading-snug line-clamp-2 text-slate-900 dark:text-slate-200`},C=[`href`],w={class:`mt-auto pt-4 border-t border-dashed border-slate-100 dark:border-slate-800 flex justify-between items-center px-1`},T={class:`flex flex-col`},E={key:0,class:`text-emerald-500 font-bold text-base`},D={key:0,class:`text-slate-400 dark:text-slate-500 text-[10px] font-medium line-through mb-0.5`},O={class:`font-extrabold text-lg tracking-tight`,style:{color:`var(--kv-color-primary)`}},k=[`href`],A={class:`p-3 pb-0`},j={class:`relative aspect-video bg-slate-100 dark:bg-slate-800 rounded-2xl overflow-hidden`},M=[`src`,`alt`],N={class:`p-4 grow flex flex-col`},P={class:`flex items-center justify-between mb-3 text-sm font-medium text-gray-400 dark:text-slate-500`},F={class:`flex items-center gap-2 min-w-0`},I=[`src`,`alt`],L={class:`truncate text-xs`},ne={class:`font-semibold whitespace-nowrap`},R={class:`font-bold text-base leading-tight line-clamp-2 text-slate-900 dark:text-slate-200 mb-3`},z=[`href`],B={class:`mt-auto pt-4 border-t border-dashed border-slate-100 dark:border-slate-800 flex justify-between items-center px-1`},V={class:`flex flex-col`},H={key:0,class:`text-emerald-500 font-bold text-lg`},U={key:1,class:`font-extrabold text-xl tracking-tight`,style:{color:`var(--kv-color-primary)`}},W=[`href`],G={class:`p-6 flex flex-col`},K={key:0,class:`text-base font-semibold text-slate-900 dark:text-white`},q={key:1,class:`mt-1 text-sm text-slate-400 dark:text-slate-500`},J={key:0,class:`flex items-center justify-end gap-3 border-t border-slate-100 dark:border-slate-800 px-6 py-4 bg-slate-50/50 dark:bg-slate-950/50`},Y=`data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='400' height='225' viewBox='0 0 400 225'><rect width='100%' height='100%' fill='%23f1f5f9'/><text x='200' y='118' font-family='Plus Jakarta Sans, system-ui, sans-serif' font-size='16' font-weight='bold' fill='%2394a3b8' text-anchor='middle'>400 x 225 px</text></svg>`,X=`data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'><circle cx='10' cy='10' r='10' fill='%23e2e8f0'/></svg>`,Z=(0,t.defineComponent)({__name:`Card`,props:{variant:{default:`default`},title:{default:``},description:{default:``},image:{default:``},actionUrl:{default:`#`},class:{default:``},badgeText:{default:``},level:{default:``},ratingCount:{default:0},infoText:{default:``},price:{default:``},discountPrice:{default:``},eventType:{default:`Workshop`},date:{default:``},speaker:{default:``},speakerAvatar:{default:``},status:{default:`open`}},setup(e){let r=e,i=e=>e===`Gratis`||e===`Free`||e===0||e===`0`;return(a,o)=>e.variant===`product`?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:(0,t.normalizeClass)([`group bg-white dark:bg-slate-900 rounded-[32px] border border-slate-100 dark:border-slate-800 overflow-hidden transition-all duration-500 h-full flex flex-col text-left`,r.class])},[(0,t.createElementVNode)(`div`,_,[(0,t.createElementVNode)(`div`,ee,[(0,t.createElementVNode)(`img`,{src:e.image||Y,alt:e.title,class:`w-full h-full object-cover`},null,8,te),e.badgeText?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,v,(0,t.toDisplayString)(e.badgeText),1)):(0,t.createCommentVNode)(``,!0)])]),(0,t.createElementVNode)(`div`,y,[(0,t.createElementVNode)(`div`,b,[e.level?((0,t.openBlock)(),(0,t.createBlock)(c,{key:0,variant:`secondary`,appearance:`soft`,rounded:`lg`,size:`sm`},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(m,{level:e.level},null,8,[`level`]),(0,t.createElementVNode)(`span`,null,(0,t.toDisplayString)(e.level),1),e.ratingCount?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,x,`(`+(0,t.toDisplayString)(e.ratingCount)+`)`,1)):(0,t.createCommentVNode)(``,!0)]),_:1})):(0,t.createCommentVNode)(``,!0),e.infoText?((0,t.openBlock)(),(0,t.createBlock)(c,{key:1,variant:`primary`,appearance:`soft`,rounded:`lg`,size:`sm`},{default:(0,t.withCtx)(()=>[(0,t.renderSlot)(a.$slots,`info-icon`,{},()=>[(0,t.createVNode)(g,{size:14})]),(0,t.createElementVNode)(`span`,null,(0,t.toDisplayString)(e.infoText),1)]),_:3})):(0,t.createCommentVNode)(``,!0)]),(0,t.createElementVNode)(`h3`,S,[(0,t.createElementVNode)(`a`,{href:e.actionUrl,class:`hover:text-[var(--kv-color-primary)] dark:hover:text-blue-400 transition-colors`},(0,t.toDisplayString)(e.title),9,C)]),(0,t.createElementVNode)(`div`,w,[(0,t.createElementVNode)(`div`,T,[i(e.price)?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,E,`Gratis`)):((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:1},[e.discountPrice?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,D,(0,t.toDisplayString)(e.discountPrice),1)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`span`,O,(0,t.toDisplayString)(e.price),1)],64))]),(0,t.createElementVNode)(`a`,{href:e.actionUrl,class:`w-10 h-10 shrink-0 flex items-center justify-center rounded-2xl bg-slate-50 dark:bg-slate-800/50 text-slate-400 dark:text-slate-500 transition-all duration-500 border border-slate-100 dark:border-slate-800 hover:border-transparent`},[(0,t.createVNode)((0,t.unref)(n.ArrowRight),{size:18,class:`-rotate-45`})],8,k)])])],2)):e.variant===`event`?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:1,class:(0,t.normalizeClass)([`group bg-white dark:bg-slate-900 rounded-[32px] border border-slate-100 dark:border-slate-800 overflow-hidden transition-all duration-500 h-full flex flex-col text-left`,r.class])},[(0,t.createElementVNode)(`div`,A,[(0,t.createElementVNode)(`div`,j,[(0,t.createElementVNode)(`img`,{src:e.image||Y,alt:e.title,class:`w-full h-full object-cover`},null,8,M),e.eventType?((0,t.openBlock)(),(0,t.createBlock)(c,{key:0,variant:`primary`,appearance:`soft`,rounded:`lg`,size:`sm`,class:`absolute top-3 left-3 z-10`},{default:(0,t.withCtx)(()=>[(0,t.createTextVNode)((0,t.toDisplayString)(e.eventType),1)]),_:1})):(0,t.createCommentVNode)(``,!0),(0,t.createVNode)(c,{variant:e.status===`open`?`success`:e.status===`closed`?`secondary`:`primary`,appearance:`soft`,rounded:`card-corner`,size:`sm`,class:`absolute top-0 right-0 z-10`},{default:(0,t.withCtx)(()=>[(0,t.createTextVNode)((0,t.toDisplayString)(e.status===`open`?`Open`:e.status===`closed`?`Closed`:`Segera`),1)]),_:1},8,[`variant`])])]),(0,t.createElementVNode)(`div`,N,[(0,t.createElementVNode)(`div`,P,[(0,t.createElementVNode)(`div`,F,[(0,t.createElementVNode)(`img`,{src:e.speakerAvatar||X,alt:e.speaker,class:`w-5 h-5 rounded-full object-cover border border-gray-100 dark:border-slate-700 shrink-0`},null,8,I),(0,t.createElementVNode)(`span`,L,(0,t.toDisplayString)(e.speaker||`Speaker`),1)]),e.date?((0,t.openBlock)(),(0,t.createBlock)(c,{key:0,variant:`secondary`,appearance:`soft`,rounded:`lg`,size:`sm`},{default:(0,t.withCtx)(()=>[(0,t.createVNode)((0,t.unref)(n.Calendar),{size:12}),(0,t.createElementVNode)(`span`,ne,(0,t.toDisplayString)(e.date),1)]),_:1})):(0,t.createCommentVNode)(``,!0)]),(0,t.createElementVNode)(`h3`,R,[(0,t.createElementVNode)(`a`,{href:e.actionUrl,class:`hover:text-[var(--kv-color-primary)] dark:hover:text-blue-400 transition-colors`},(0,t.toDisplayString)(e.title),9,z)]),(0,t.createElementVNode)(`div`,B,[(0,t.createElementVNode)(`div`,V,[i(e.price)?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,H,`Gratis`)):((0,t.openBlock)(),(0,t.createElementBlock)(`span`,U,(0,t.toDisplayString)(e.price),1))]),(0,t.createElementVNode)(`a`,{href:e.actionUrl,class:`w-10 h-10 flex items-center justify-center rounded-2xl bg-slate-50 dark:bg-slate-800/50 text-slate-400 dark:text-slate-500 transition-all duration-500 border border-slate-100 dark:border-slate-800 hover:border-transparent`},[(0,t.createVNode)((0,t.unref)(n.ArrowRight),{size:18,class:`-rotate-45`})],8,W)])])],2)):((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:2,class:(0,t.normalizeClass)([`rounded-3xl border border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 overflow-hidden`,r.class])},[(0,t.createElementVNode)(`div`,G,[e.title?((0,t.openBlock)(),(0,t.createElementBlock)(`h3`,K,(0,t.toDisplayString)(e.title),1)):(0,t.createCommentVNode)(``,!0),e.description?((0,t.openBlock)(),(0,t.createElementBlock)(`p`,q,(0,t.toDisplayString)(e.description),1)):(0,t.createCommentVNode)(``,!0),a.$slots.default?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:2,class:(0,t.normalizeClass)(e.title||e.description?`mt-4`:``)},[(0,t.renderSlot)(a.$slots,`default`)],2)):(0,t.createCommentVNode)(``,!0)]),a.$slots.footer?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,J,[(0,t.renderSlot)(a.$slots,`footer`)])):(0,t.createCommentVNode)(``,!0)],2))}}),re=[`disabled`],ie={class:`flex items-center gap-2`},ae={key:0,class:`krea-dropdown-divider`},oe=[`disabled`,`onClick`],se={class:`flex items-center gap-3`},Q=o((0,t.defineComponent)({__name:`DropdownMenu`,props:{triggerText:{default:`Pilih Opsi`},align:{default:`left`},disabled:{type:Boolean,default:!1},items:{default:()=>[]},modelValue:{default:``},variant:{default:`default`},size:{default:`md`}},emits:[`update:modelValue`,`select`],setup(e,{emit:r}){let i=e,a=r,o=(0,t.ref)(!1),s=(0,t.ref)(null),c=(0,t.computed)(()=>i.items.find(e=>e.id===i.modelValue)),l=(0,t.computed)(()=>c.value?.label??i.triggerText),u=(0,t.computed)(()=>c.value?.icon),d=(0,t.computed)(()=>[`inline-flex items-center justify-between whitespace-nowrap`,`font-semibold transition-all duration-150`,`focus:outline-none focus:ring-2 focus:ring-[#4082E6]`,`disabled:pointer-events-none disabled:opacity-50 cursor-pointer`,{default:`border border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 text-slate-700 dark:text-slate-200 hover:bg-slate-50 dark:hover:bg-slate-800`,ghost:`bg-transparent text-slate-700 dark:text-slate-200 hover:bg-slate-100 dark:hover:bg-slate-800`,outline:`border border-slate-300 dark:border-slate-700 bg-transparent text-slate-700 dark:text-slate-200 hover:border-[#4082E6] hover:text-[#4082E6]`}[i.variant],{sm:`h-8 px-3 text-xs rounded-xl gap-2`,md:`h-10 px-4 text-sm rounded-2xl gap-2.5`,lg:`h-12 px-5 text-base rounded-2xl gap-3`}[i.size]].join(` `)),f=(0,t.computed)(()=>({sm:`w-3 h-3`,md:`w-4 h-4`,lg:`w-4 h-4`})[i.size]),p=(0,t.computed)(()=>i.align===`right`?`right-0`:`left-0`),m=()=>{i.disabled||(o.value=!o.value)},h=e=>{e.disabled||(a(`update:modelValue`,e.id),a(`select`,e),o.value=!1)},g=e=>{o.value&&(s.value?.contains(e.target)||(o.value=!1))};return(0,t.onMounted)(()=>{document.addEventListener(`mousedown`,g)}),(0,t.onUnmounted)(()=>{document.removeEventListener(`mousedown`,g)}),(r,i)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{ref_key:`wrapperEl`,ref:s,class:`krea-dropdown-wrapper`},[(0,t.createElementVNode)(`button`,{type:`button`,onClick:m,disabled:e.disabled,class:(0,t.normalizeClass)(d.value)},[(0,t.createElementVNode)(`div`,ie,[u.value?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(u.value),{key:0,class:`w-4 h-4 shrink-0 text-slate-500 dark:text-slate-400`})):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`span`,null,(0,t.toDisplayString)(l.value),1)]),(0,t.createVNode)((0,t.unref)(n.ChevronDown),{class:(0,t.normalizeClass)([f.value,`text-slate-400 shrink-0 transition-transform duration-200`]),style:(0,t.normalizeStyle)({transform:o.value?`rotate(180deg)`:``})},null,8,[`class`,`style`])],10,re),(0,t.withDirectives)((0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`krea-dropdown-popover`,p.value])},[(0,t.renderSlot)(r.$slots,`default`,{},()=>[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.items,(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:n.id??r},[n.divider?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,ae)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`button`,{type:`button`,disabled:n.disabled,onClick:e=>h(n),class:(0,t.normalizeClass)([`krea-dropdown-item`,n.variant===`danger`?`krea-dropdown-item--danger`:e.modelValue===n.id?`krea-dropdown-item--active`:``])},[(0,t.createElementVNode)(`div`,se,[n.icon?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(n.icon),{key:0,class:`w-4 h-4 shrink-0 text-slate-400`})):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`span`,null,(0,t.toDisplayString)(n.label),1)])],10,oe)],64))),128))],!0)],2),[[t.vShow,o.value]])],512))}}),[[`__scopeId`,`data-v-948716a5`]]),ce=[`disabled`,`onClick`],le=(0,t.defineComponent)({__name:`Tabs`,props:{modelValue:{default:``},items:{},variant:{default:`pills`},size:{default:`md`},class:{default:``}},emits:[`update:modelValue`,`change`],setup(e,{emit:n}){let r=e,i=n,a=(0,t.computed)({get:()=>r.modelValue||r.items[0]?.id||``,set:e=>{i(`update:modelValue`,e),i(`change`,e)}}),o=(0,t.computed)(()=>r.variant===`pills`?`inline-flex items-center p-1.5 gap-1 bg-slate-100 dark:bg-slate-900 border border-slate-200/60 dark:border-slate-800 rounded-2xl`:r.variant===`separated`?`inline-flex items-center gap-2 flex-wrap`:`flex items-center gap-6 border-b border-slate-200 dark:border-slate-800 w-full`),s={sm:`px-3 py-1.5 text-sm gap-1.5 [&_svg]:w-4 [&_svg]:h-4`,md:`px-5 py-2 text-sm gap-2 [&_svg]:w-4 [&_svg]:h-4`,lg:`px-7 py-3 text-base gap-2.5 [&_svg]:w-5 [&_svg]:h-5`};function c(e){let t=a.value===e.id;return r.variant===`pills`||r.variant===`separated`?[`inline-flex items-center rounded-xl font-medium transition-all duration-200 focus:outline-none disabled:pointer-events-none disabled:opacity-50`,s[r.size],t?`bg-[#4082E6] text-white font-semibold`:`text-slate-600 dark:text-slate-400 hover:text-slate-900 dark:hover:text-white hover:bg-slate-200/50 dark:hover:bg-slate-800`].join(` `):[`inline-flex items-center font-medium border-b-2 -mb-px pb-3 transition-colors focus:outline-none disabled:pointer-events-none disabled:opacity-50`,s[r.size],t?`border-[#4082E6] text-[#4082E6] font-semibold`:`border-transparent text-slate-500 hover:text-slate-800 dark:hover:text-slate-200`].join(` `)}return(n,i)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:(0,t.normalizeClass)([o.value,r.class])},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.items,e=>((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:e.id,type:`button`,disabled:e.disabled,class:(0,t.normalizeClass)(c(e)),onClick:t=>a.value=e.id},[e.icon?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(e.icon),{key:0})):(0,t.createCommentVNode)(``,!0),(0,t.createTextVNode)(` `+(0,t.toDisplayString)(e.label),1)],10,ce))),128))],2))}});function $(e,t){return{handler:e,config:t}}$.withOptions=function(e,t=()=>({})){function n(n){return{handler:e(n),config:t(n)}}return n.__isOptionsFunction=!0,n};var ue=$(function({addBase:e,addComponents:t,theme:n}){e({":root":{"--kv-color-primary":`#4082E6`,"--kv-color-primary-hover":`#2d6ed4`,"--kv-color-primary-light":`#dbeafe`,"--kv-color-secondary":`#FEF747`,"--kv-color-soft-black":`#121212`,"--kv-color-soft-white":`#fafafa`,"--kv-color-surface":`#ffffff`,"--kv-color-border":`#e2e8f0`,"--kv-color-muted":`#64748b`,"--kv-color-muted-light":`#f1f5f9`,"--kv-color-danger":`#f43f5e`,"--kv-radius-sm":`0.75rem`,"--kv-radius-md":`1rem`,"--kv-radius-default":`1.5rem`,"--kv-shadow-none":`none`},'[data-theme="dark"]':{"--kv-color-soft-black":`#fafafa`,"--kv-color-soft-white":`#09090b`,"--kv-color-surface":`#0f0f12`,"--kv-color-border":`#27272a`,"--kv-color-muted":`#a1a1aa`,"--kv-color-muted-light":`#18181b`}})},{theme:{extend:{colors:{kv:{primary:{DEFAULT:`var(--kv-color-primary)`,hover:`var(--kv-color-primary-hover)`,light:`var(--kv-color-primary-light)`},secondary:`var(--kv-color-secondary)`,surface:`var(--kv-color-surface)`,border:`var(--kv-color-border)`,muted:`var(--kv-color-muted)`}},borderRadius:{"kv-sm":`var(--kv-radius-sm)`,"kv-md":`var(--kv-radius-md)`,"kv-default":`var(--kv-radius-default)`}}}});e.Alert=s,e.Badge=c,e.Button=l,e.Card=Z,e.DropdownMenu=Q,e.LevelIcon=m,e.Tabs=le,e.VideoIcon=g,e.kreauiPlugin=ue});
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@kreavoks/kreaui",
3
3
  "type": "module",
4
- "version": "0.0.5",
4
+ "version": "0.1.0",
5
5
  "main": "./lib/kreaui.umd.js",
6
6
  "module": "./lib/kreaui.es.js",
7
7
  "exports": {