@mudakit/ui 0.3.0 → 0.5.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 (29) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/MudaButton-B9EAJW32.js +57 -0
  3. package/dist/{MudaColorPicker-CnB1MYB3.js → MudaColorPicker-D9BhgHf9.js} +22 -22
  4. package/dist/MudaDialog-dQSFVdgu.js +55 -0
  5. package/dist/{MudaFormCombobox-DqH-EyMV.js → MudaFormCombobox-CK2De6Rv.js} +36 -36
  6. package/dist/MudaSidebar-DvKS4VtE.js +141 -0
  7. package/dist/components/MudaButton/MudaButton.types.d.ts +2 -0
  8. package/dist/components/MudaButton/MudaButton.vue.d.ts +4 -3
  9. package/dist/components/MudaButton/index.d.ts +1 -0
  10. package/dist/components/MudaButton/index.js +1 -1
  11. package/dist/components/MudaColorPicker/index.js +1 -1
  12. package/dist/components/MudaDialog/index.js +1 -1
  13. package/dist/components/MudaFormCombobox/index.js +1 -1
  14. package/dist/components/MudaSidebar/MudaSidebar.types.d.ts +16 -0
  15. package/dist/components/MudaSidebar/MudaSidebar.vue.d.ts +67 -0
  16. package/dist/components/MudaSidebar/MudaSidebarDrawer.vue.d.ts +29 -0
  17. package/dist/components/MudaSidebar/index.d.ts +2 -0
  18. package/dist/components/MudaSidebar/index.js +2 -0
  19. package/dist/components/MudaSidebar/useMudaSidebarContext.d.ts +13 -0
  20. package/dist/composables/index.d.ts +5 -0
  21. package/dist/composables/index.js +6 -0
  22. package/dist/index.d.ts +7 -1
  23. package/dist/index.js +33 -27
  24. package/dist/style.css +1 -1
  25. package/dist/useBodyScrollLock-4K-3lAFL.js +12 -0
  26. package/dist/useResizeObserver-BYI1Pg1T.js +14 -0
  27. package/package.json +6 -1
  28. package/dist/MudaButton-CWY0U8WO.js +0 -43
  29. package/dist/MudaDialog-DTR4JKpJ.js +0 -61
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # Changelog
2
2
 
3
+ ## 0.5.0
4
+
5
+ ### Minor Changes
6
+
7
+ - fcbbcb8: - Add a public `@mudakit/ui/composables` entrypoint.
8
+ - Add outline-* and link-* variants to MudaButton
9
+ - Add the MudaSidebar component.
10
+ - Refresh the light and dark theme color palettes.
11
+
12
+ ## 0.4.0
13
+
14
+ ### Minor Changes
15
+
16
+ - 725a051: Expose the body scroll lock, click outside, keydown, resize observer, and z-index composables from the package root, along with the shared `MudaComponentSize` type.
17
+
3
18
  ## 0.3.0
4
19
 
5
20
  ### Minor Changes
@@ -0,0 +1,57 @@
1
+ import { createBlock as e, defineComponent as t, mergeProps as n, openBlock as r, renderSlot as i, resolveDynamicComponent as a, withCtx as o } from "vue";
2
+ //#endregion
3
+ //#region src/components/MudaButton/MudaButton.vue
4
+ var s = /* @__PURE__ */ t({
5
+ __name: "MudaButton",
6
+ props: {
7
+ size: { default: "medium" },
8
+ variant: { default: "default" },
9
+ disabled: {
10
+ type: Boolean,
11
+ default: !1
12
+ },
13
+ as: { default: "button" }
14
+ },
15
+ setup(t) {
16
+ let s = t;
17
+ return (t, c) => (r(), e(a(s.as), n(t.$attrs, {
18
+ disabled: s.disabled,
19
+ class: ["muda:flex muda:items-center muda:justify-center muda:gap-1 muda:focus-visible:outline-2 muda:focus-visible:outline-offset-2", {
20
+ "muda-link-reset": s.as === "a",
21
+ "muda-button-reset": s.as === "button",
22
+ "muda:rounded-md muda:font-semibold": !0,
23
+ "muda:px-2.5 muda:py-1.5 muda:text-xs": s.size === "small",
24
+ "muda:px-3 muda:py-2 muda:text-sm": s.size === "medium",
25
+ "muda:px-3.5 muda:py-2.5 muda:text-sm": s.size === "large",
26
+ "muda:cursor-pointer": !s.disabled,
27
+ "muda:cursor-not-allowed": s.disabled,
28
+ "muda:border muda:border-secondary-light muda:bg-form-background muda:text-secondary muda:shadow-xs muda:disabled:text-secondary/40": s.variant === "default",
29
+ "muda:border muda:border-primary-dark muda:bg-primary muda:fill-white muda:text-white muda:shadow-xs muda:hover:bg-primary-dark muda:focus-visible:bg-primary muda:disabled:border-primary-dark/20 muda:disabled:bg-primary-light/70": s.variant === "primary",
30
+ "muda:border muda:border-secondary-dark muda:bg-secondary muda:fill-white muda:text-white muda:shadow-xs muda:hover:bg-secondary-dark muda:focus-visible:bg-secondary muda:disabled:border-secondary-dark/20 muda:disabled:bg-secondary-light/70": s.variant === "secondary",
31
+ "muda:border muda:border-success-dark muda:bg-success muda:fill-white muda:text-white muda:shadow-xs muda:hover:bg-success-dark muda:focus-visible:bg-success muda:disabled:border-success-dark/20 muda:disabled:bg-success-light/70": s.variant === "success",
32
+ "muda:border muda:border-warning-dark muda:bg-warning muda:fill-white muda:text-white muda:shadow-xs muda:hover:bg-warning-dark muda:focus-visible:bg-warning muda:disabled:border-warning-dark/20 muda:disabled:bg-warning-light/70": s.variant === "warning",
33
+ "muda:border muda:border-danger-dark muda:bg-danger muda:fill-white muda:text-white muda:shadow-xs muda:hover:bg-danger-dark muda:focus-visible:bg-danger muda:disabled:border-danger-dark/20 muda:disabled:bg-danger-light/70": s.variant === "danger",
34
+ "muda:border muda:border-info-dark muda:bg-info muda:fill-white muda:text-white muda:shadow-xs muda:hover:bg-info-dark muda:focus-visible:bg-info muda:disabled:border-info-dark/20 muda:disabled:bg-info-light/70": s.variant === "info",
35
+ "muda:border muda:border-secondary-light muda:text-secondary muda:disabled:text-secondary/40": s.variant === "outline-default",
36
+ "muda:border muda:border-primary muda:text-primary muda:enabled:hover:bg-primary muda:enabled:hover:fill-white muda:enabled:hover:text-white muda:disabled:border-primary/20 muda:disabled:text-primary/40": s.variant === "outline-primary",
37
+ "muda:border muda:border-secondary muda:text-secondary muda:enabled:hover:bg-secondary muda:enabled:hover:fill-white muda:enabled:hover:text-white muda:disabled:border-secondary/20 muda:disabled:text-secondary/40": s.variant === "outline-secondary",
38
+ "muda:border muda:border-success muda:text-success muda:enabled:hover:bg-success muda:enabled:hover:fill-white muda:enabled:hover:text-white muda:disabled:border-success/20 muda:disabled:text-success/40": s.variant === "outline-success",
39
+ "muda:border muda:border-warning muda:text-warning muda:enabled:hover:bg-warning muda:enabled:hover:fill-white muda:enabled:hover:text-white muda:disabled:border-warning/20 muda:disabled:text-warning/40": s.variant === "outline-warning",
40
+ "muda:border muda:border-danger muda:text-danger muda:enabled:hover:bg-danger muda:enabled:hover:fill-white muda:enabled:hover:text-white muda:disabled:border-danger/20 muda:disabled:text-danger/40": s.variant === "outline-danger",
41
+ "muda:border muda:border-info muda:text-info muda:enabled:hover:bg-info muda:enabled:hover:fill-white muda:enabled:hover:text-white muda:disabled:border-info/20 muda:disabled:text-info/40": s.variant === "outline-info",
42
+ "muda:text-secondary muda:disabled:text-secondary/40": s.variant === "link-default",
43
+ "muda:text-primary muda:enabled:hover:text-primary-dark muda:disabled:text-primary/40": s.variant === "link-primary",
44
+ "muda:text-secondary muda:enabled:hover:text-secondary-dark muda:disabled:text-secondary/40": s.variant === "link-secondary",
45
+ "muda:text-success muda:enabled:hover:text-success-dark muda:disabled:text-success/40": s.variant === "link-success",
46
+ "muda:text-warning muda:enabled:hover:text-warning-dark muda:disabled:text-warning/40": s.variant === "link-warning",
47
+ "muda:text-danger muda:enabled:hover:text-danger-dark muda:disabled:text-danger/40": s.variant === "link-danger",
48
+ "muda:text-info muda:enabled:hover:text-info-dark muda:disabled:text-info/40": s.variant === "link-info"
49
+ }]
50
+ }), {
51
+ default: o(() => [i(t.$slots, "default")]),
52
+ _: 3
53
+ }, 16, ["disabled", "class"]));
54
+ }
55
+ });
56
+ //#endregion
57
+ export { s as t };
@@ -1,10 +1,10 @@
1
- import { t as e } from "./MudaButton-CWY0U8WO.js";
2
- import { t } from "./keymap-BzfMgdJH.js";
3
- import { t as n } from "./MudaIcon-BwqQQnti.js";
4
- import { t as r } from "./MudaFormInput-D1-kQq9y.js";
5
- import { t as i } from "./MudaPopover-C1fDWbPf.js";
6
- import { t as a } from "./_plugin-vue_export-helper-B3ysoDQm.js";
7
- import { t as o } from "./useKeyDown-B1jmp4nA.js";
1
+ import { t as e } from "./useKeyDown-B1jmp4nA.js";
2
+ import { t } from "./MudaButton-B9EAJW32.js";
3
+ import { t as n } from "./keymap-BzfMgdJH.js";
4
+ import { t as r } from "./MudaIcon-BwqQQnti.js";
5
+ import { t as i } from "./MudaFormInput-D1-kQq9y.js";
6
+ import { t as a } from "./MudaPopover-C1fDWbPf.js";
7
+ import { t as o } from "./_plugin-vue_export-helper-B3ysoDQm.js";
8
8
  import { createBlock as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, defineComponent as f, mergeModels as p, mergeProps as m, normalizeStyle as h, openBlock as g, ref as _, toDisplayString as v, unref as y, useModel as b, watch as x, watchEffect as S, withCtx as C, withModifiers as w } from "vue";
9
9
  import { ColorPickerCanvas as T, ColorPickerHueCursor as E, ColorPickerSaturationCursor as D, useColorPicker as O } from "@wattanx/vue-color-picker";
10
10
  //#region src/common/components.ts
@@ -57,7 +57,7 @@ var k = {
57
57
  _: 1
58
58
  }, 8, ["onChangePosition"])], 4));
59
59
  }
60
- }), j = /*#__PURE__*/ a(A, [["__scopeId", "data-v-bdb328ef"]]), M = { class: "muda:flex muda:flex-col muda:gap-2" }, N = /* @__PURE__ */ f({
60
+ }), j = /*#__PURE__*/ o(A, [["__scopeId", "data-v-bdb328ef"]]), M = { class: "muda:flex muda:flex-col muda:gap-2" }, N = /* @__PURE__ */ f({
61
61
  inheritAttrs: !1,
62
62
  __name: "MudaColorPicker",
63
63
  props: /*@__PURE__*/ p({
@@ -71,21 +71,21 @@ var k = {
71
71
  modelModifiers: {}
72
72
  }),
73
73
  emits: ["update:modelValue"],
74
- setup(a) {
75
- let c = a, f = b(a, "modelValue"), p = _(), S = _(f.value), T = _(!1);
74
+ setup(o) {
75
+ let c = o, f = b(o, "modelValue"), p = _(), S = _(f.value), T = _(!1);
76
76
  x(f, (e) => {
77
77
  T.value || (S.value = e);
78
- }), o((e) => {
78
+ }), e((e) => {
79
79
  if (T.value) switch (e.key) {
80
- case t.Escape: T.value = !1, p.value?.input?.blur();
80
+ case n.Escape: T.value = !1, p.value?.input?.blur();
81
81
  }
82
82
  });
83
83
  let E = () => {
84
84
  f.value = S.value, T.value = !1;
85
85
  };
86
- return (t, a) => (g(), s(y(i), {
86
+ return (e, n) => (g(), s(y(a), {
87
87
  modelValue: T.value,
88
- "onUpdate:modelValue": a[4] ||= (e) => T.value = e,
88
+ "onUpdate:modelValue": n[4] ||= (e) => T.value = e,
89
89
  placement: "bottom-start",
90
90
  "append-to-body": c.appendToBody
91
91
  }, {
@@ -93,8 +93,8 @@ var k = {
93
93
  key: c.size,
94
94
  "initial-color": f.value,
95
95
  size: y(k)[c.size],
96
- onChange: a[3] ||= (e) => S.value = e
97
- }, null, 8, ["initial-color", "size"])), d(y(e), {
96
+ onChange: n[3] ||= (e) => S.value = e
97
+ }, null, 8, ["initial-color", "size"])), d(y(t), {
98
98
  type: "button",
99
99
  variant: "primary",
100
100
  size: "small",
@@ -104,19 +104,19 @@ var k = {
104
104
  default: C(() => [u(v(c.buttonLabel ?? S.value), 1)]),
105
105
  _: 1
106
106
  }, 8, ["style"])])]),
107
- default: C(() => [d(y(r), m({
107
+ default: C(() => [d(y(i), m({
108
108
  ref_key: "inputRef",
109
109
  ref: p
110
- }, t.$attrs, {
110
+ }, e.$attrs, {
111
111
  modelValue: f.value,
112
- "onUpdate:modelValue": a[0] ||= (e) => f.value = e,
112
+ "onUpdate:modelValue": n[0] ||= (e) => f.value = e,
113
113
  disabled: c.disabled,
114
114
  "is-invalid": c.isInvalid,
115
115
  readonly: "",
116
- onFocus: a[1] ||= (e) => T.value = !0,
117
- "onClick:before": a[2] ||= (e) => T.value = !0
116
+ onFocus: n[1] ||= (e) => T.value = !0,
117
+ "onClick:before": n[2] ||= (e) => T.value = !0
118
118
  }), {
119
- before: C(() => [d(y(n), {
119
+ before: C(() => [d(y(r), {
120
120
  icon: "palette:outlined",
121
121
  color: f.value
122
122
  }, null, 8, ["color"])]),
@@ -0,0 +1,55 @@
1
+ import { t as e } from "./useBodyScrollLock-4K-3lAFL.js";
2
+ import { t } from "./useKeyDown-B1jmp4nA.js";
3
+ import { t as n } from "./useZIndex-DWnsohLZ.js";
4
+ import { t as r } from "./keymap-BzfMgdJH.js";
5
+ import { t as i } from "./MudaFocusTrap-CGlvV_MC.js";
6
+ import { Teleport as a, Transition as o, createBlock as s, createCommentVNode as c, createElementVNode as l, createVNode as u, defineComponent as d, mergeProps as f, normalizeStyle as p, openBlock as m, renderSlot as h, unref as g, useModel as _, useTemplateRef as v, withCtx as y, withModifiers as b } from "vue";
7
+ //#region src/components/MudaDialog/MudaDialog.vue?vue&type=script&setup=true&lang.ts
8
+ var x = { class: "muda:fixed muda:inset-0 muda:w-screen muda:overflow-y-auto muda:py-6" }, S = { class: "muda:flex muda:min-h-full muda:items-center muda:justify-center" }, C = /* @__PURE__ */ d({
9
+ inheritAttrs: !1,
10
+ __name: "MudaDialog",
11
+ props: {
12
+ modelValue: {
13
+ type: Boolean,
14
+ required: !0
15
+ },
16
+ modelModifiers: {}
17
+ },
18
+ emits: ["update:modelValue"],
19
+ setup(d) {
20
+ let C = _(d, "modelValue"), w = v("dialog"), T = n();
21
+ e(C), t((e) => {
22
+ if (C.value) switch (e.key) {
23
+ case r.Escape: C.value = !1, e.preventDefault();
24
+ }
25
+ });
26
+ let E = (e) => {
27
+ w.value?.contains(e.target) || (C.value = !1);
28
+ };
29
+ return (e, t) => (m(), s(a, { to: "body" }, [u(o, {
30
+ "enter-active-class": "muda:transition-opacity muda:ease-linear muda:duration-100",
31
+ "leave-active-class": "muda:transition-opacity muda:ease-linear muda:duration-100",
32
+ "enter-from-class": "muda:opacity-0",
33
+ "leave-to-class": "muda:opacity-0"
34
+ }, {
35
+ default: y(() => [C.value ? (m(), s(g(i), {
36
+ key: 0,
37
+ role: "dialog",
38
+ class: "muda:fixed muda:inset-0 muda:bg-gray-500/30 muda:backdrop-blur-xs muda:transition-opacity",
39
+ style: p({ zIndex: g(T) }),
40
+ onClickCapture: E,
41
+ onWheel: t[0] ||= b(() => {}, ["stop"])
42
+ }, {
43
+ default: y(() => [l("div", x, [l("div", S, [l("div", f(e.$attrs, {
44
+ class: "muda:rounded-lg muda:bg-background muda:p-4 muda:focus:outline-hidden",
45
+ tabindex: "0",
46
+ ref: "dialog"
47
+ }), [h(e.$slots, "default")], 16)])])]),
48
+ _: 3
49
+ }, 8, ["style"])) : c("", !0)]),
50
+ _: 3
51
+ })]));
52
+ }
53
+ });
54
+ //#endregion
55
+ export { C as t };
@@ -1,9 +1,9 @@
1
- import { t as e } from "./keymap-BzfMgdJH.js";
2
- import { t } from "./MudaIcon-BwqQQnti.js";
3
- import { t as n } from "./MudaFormInput-D1-kQq9y.js";
4
- import { t as r } from "./useClickOutside-B6tdxsc3.js";
5
- import { t as i } from "./useZIndex-DWnsohLZ.js";
6
- import { t as a } from "./useKeyDown-B1jmp4nA.js";
1
+ import { t as e } from "./useClickOutside-B6tdxsc3.js";
2
+ import { t } from "./useKeyDown-B1jmp4nA.js";
3
+ import { t as n } from "./useZIndex-DWnsohLZ.js";
4
+ import { t as r } from "./keymap-BzfMgdJH.js";
5
+ import { t as i } from "./MudaIcon-BwqQQnti.js";
6
+ import { t as a } from "./MudaFormInput-D1-kQq9y.js";
7
7
  import { t as o } from "./MudaFormCheckbox-C1wTjohm.js";
8
8
  import { Fragment as s, Teleport as c, Transition as l, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createSlots as h, createTextVNode as g, createVNode as _, defineComponent as v, mergeModels as y, mergeProps as b, normalizeClass as x, normalizeStyle as S, openBlock as C, ref as w, renderList as T, renderSlot as E, toDisplayString as D, unref as O, useModel as k, useSlots as A, useTemplateRef as j, watch as M, watchEffect as N, withCtx as P, withModifiers as F } from "vue";
9
9
  import { autoUpdate as I, flip as L, offset as R, shift as z, size as B, useFloating as V } from "@floating-ui/vue";
@@ -24,39 +24,39 @@ var H = { class: "muda:flex muda:flex-col" }, U = {
24
24
  }),
25
25
  emits: ["update:modelValue"],
26
26
  setup(e) {
27
- let r = e, i = A(), a = k(e, "modelValue"), c = w(""), l = u(() => {
27
+ let t = e, n = A(), r = k(e, "modelValue"), c = w(""), l = u(() => {
28
28
  let e = c.value.trim().toLowerCase();
29
- return e === "" ? r.options : r.options.filter((t) => t.label.toLowerCase().includes(e));
29
+ return e === "" ? t.options : t.options.filter((t) => t.label.toLowerCase().includes(e));
30
30
  }), h = () => {
31
- c.value.length > 0 ? c.value = "" : a.value = [];
31
+ c.value.length > 0 ? c.value = "" : r.value = [];
32
32
  };
33
- return (e, u) => (C(), p("div", H, [_(O(n), b(e.$attrs, {
33
+ return (e, u) => (C(), p("div", H, [_(O(a), b(e.$attrs, {
34
34
  modelValue: c.value,
35
35
  "onUpdate:modelValue": u[0] ||= (e) => c.value = e,
36
- placeholder: r.placeholder,
36
+ placeholder: t.placeholder,
37
37
  "onClick:after": h,
38
- disabled: r.disabled
38
+ disabled: t.disabled
39
39
  }), {
40
- after: P(() => [c.value.length > 0 ? (C(), d(O(t), {
40
+ after: P(() => [c.value.length > 0 ? (C(), d(O(i), {
41
41
  key: 0,
42
42
  icon: "close:outlined"
43
- })) : a.value.length > 0 ? (C(), p(s, { key: 1 }, [g(D(a.value.length) + " ", 1), _(O(t), { icon: "close:outlined" })], 64)) : f("", !0)]),
43
+ })) : r.value.length > 0 ? (C(), p(s, { key: 1 }, [g(D(r.value.length) + " ", 1), _(O(i), { icon: "close:outlined" })], 64)) : f("", !0)]),
44
44
  _: 1
45
45
  }, 16, [
46
46
  "modelValue",
47
47
  "placeholder",
48
48
  "disabled"
49
- ]), !r.disabled && l.value.length > 0 ? (C(), p("div", U, [m("ul", W, [(C(!0), p(s, null, T(l.value, (t) => (C(), p("li", { key: t.value }, [m("label", G, [_(O(o), {
50
- modelValue: a.value,
51
- "onUpdate:modelValue": u[1] ||= (e) => a.value = e,
49
+ ]), !t.disabled && l.value.length > 0 ? (C(), p("div", U, [m("ul", W, [(C(!0), p(s, null, T(l.value, (i) => (C(), p("li", { key: i.value }, [m("label", G, [_(O(o), {
50
+ modelValue: r.value,
51
+ "onUpdate:modelValue": u[1] ||= (e) => r.value = e,
52
52
  size: "small",
53
- value: t.value,
54
- disabled: r.disabled
53
+ value: i.value,
54
+ disabled: t.disabled
55
55
  }, null, 8, [
56
56
  "modelValue",
57
57
  "value",
58
58
  "disabled"
59
- ]), i.label == null ? (C(), p(s, { key: 1 }, [g(D(t.label), 1)], 64)) : E(e.$slots, "label", { option: t }, void 0, void 0, 0)])]))), 128))])])) : f("", !0)]));
59
+ ]), n.label == null ? (C(), p(s, { key: 1 }, [g(D(i.label), 1)], 64)) : E(e.$slots, "label", { option: i }, void 0, void 0, 0)])]))), 128))])])) : f("", !0)]));
60
60
  }
61
61
  }), q = {
62
62
  ref: "root",
@@ -75,7 +75,7 @@ var H = { class: "muda:flex muda:flex-col" }, U = {
75
75
  }),
76
76
  emits: ["update:modelValue"],
77
77
  setup(o) {
78
- let m = o, v = A(), y = k(o, "modelValue"), H = w(m.options.find(({ value: e }) => e === y.value)?.label ?? ""), U = j("root"), W = j("list"), G = w(), K = w(!1), Y = w(null), X = i(), Z = u(() => {
78
+ let m = o, v = A(), y = k(o, "modelValue"), H = w(m.options.find(({ value: e }) => e === y.value)?.label ?? ""), U = j("root"), W = j("list"), G = w(), K = w(!1), Y = w(null), X = n(), Z = u(() => {
79
79
  let e = H.value.trim().toLowerCase();
80
80
  return e === "" ? m.options : m.options.filter((t) => t.label.toLowerCase().includes(e));
81
81
  }), { floatingStyles: Q } = V(U, W, {
@@ -97,30 +97,30 @@ var H = { class: "muda:flex muda:flex-col" }, U = {
97
97
  }, ee = (e) => {
98
98
  e.preventDefault(), H.value = "", y.value = void 0;
99
99
  };
100
- return r([U, W], () => {
100
+ return e([U, W], () => {
101
101
  K.value &&= !1;
102
- }), a((t) => {
103
- if (K.value && !t.isComposing) switch (t.key) {
104
- case e.Enter:
105
- case e.Tab:
106
- Y.value != null && ($(Y.value), t.preventDefault());
102
+ }), t((e) => {
103
+ if (K.value && !e.isComposing) switch (e.key) {
104
+ case r.Enter:
105
+ case r.Tab:
106
+ Y.value != null && ($(Y.value), e.preventDefault());
107
107
  break;
108
- case e.Escape:
108
+ case r.Escape:
109
109
  K.value = !1;
110
110
  break;
111
- case e.ArrowDown:
111
+ case r.ArrowDown:
112
112
  if (Z.value.length === 0) {
113
113
  Y.value = null;
114
114
  break;
115
115
  }
116
- Y.value = Y.value == null ? 0 : (Y.value + 1) % Z.value.length, t.preventDefault();
116
+ Y.value = Y.value == null ? 0 : (Y.value + 1) % Z.value.length, e.preventDefault();
117
117
  break;
118
- case e.ArrowUp:
118
+ case r.ArrowUp:
119
119
  if (Z.value.length === 0) {
120
120
  Y.value = null;
121
121
  break;
122
122
  }
123
- Y.value = Y.value == null ? Z.value.length - 1 : (Y.value + Z.value.length - 1) % Z.value.length, t.preventDefault();
123
+ Y.value = Y.value == null ? Z.value.length - 1 : (Y.value + Z.value.length - 1) % Z.value.length, e.preventDefault();
124
124
  }
125
125
  }), N(() => {
126
126
  Y.value != null && W.value?.children[Y.value]?.scrollIntoView({
@@ -133,19 +133,19 @@ var H = { class: "muda:flex muda:flex-col" }, U = {
133
133
  e || G.value?.input?.blur(), Y.value = e && Z.value.length > 0 ? 0 : null;
134
134
  }), M([y, () => m.options], ([e]) => {
135
135
  H.value = m.options.find(({ value: t }) => t === e)?.label ?? "";
136
- }, { deep: !0 }), (e, r) => (C(), p("div", q, [_(O(n), b(e.$attrs, {
136
+ }, { deep: !0 }), (e, t) => (C(), p("div", q, [_(O(a), b(e.$attrs, {
137
137
  modelValue: H.value,
138
- "onUpdate:modelValue": r[0] ||= (e) => H.value = e,
138
+ "onUpdate:modelValue": t[0] ||= (e) => H.value = e,
139
139
  ref_key: "inputRef",
140
140
  ref: G,
141
- onFocus: r[1] ||= (e) => K.value = !0,
141
+ onFocus: t[1] ||= (e) => K.value = !0,
142
142
  "onClick:after": ee,
143
143
  disabled: m.disabled,
144
144
  placeholder: m.placeholder,
145
145
  "is-invalid": m.isInvalid
146
146
  }), h({ _: 2 }, [H.value.length > 0 ? {
147
147
  name: "after",
148
- fn: P(() => [_(O(t), { icon: "close:outlined" })]),
148
+ fn: P(() => [_(O(i), { icon: "close:outlined" })]),
149
149
  key: "0"
150
150
  } : void 0]), 1040, [
151
151
  "modelValue",
@@ -0,0 +1,141 @@
1
+ import { Fragment as e, Transition as t, computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createVNode as s, defineComponent as c, inject as l, mergeModels as u, normalizeClass as d, normalizeStyle as f, openBlock as p, provide as m, renderList as h, renderSlot as g, toRefs as _, unref as v, useModel as y, useSlots as b, vShow as x, withCtx as S, withDirectives as C } from "vue";
2
+ //#region src/components/MudaSidebar/MudaSidebar.types.ts
3
+ var w = "64px", T = "360px", E = Symbol("MUDA_SIDEBAR_CONTEXT");
4
+ function D() {
5
+ return l(E);
6
+ }
7
+ //#endregion
8
+ //#region src/components/MudaSidebar/MudaSidebarDrawer.vue?vue&type=script&setup=true&lang.ts
9
+ var O = { class: "muda:flex muda:items-center" }, k = { class: "muda:flex muda:w-full muda:items-center muda:justify-center" }, A = /* @__PURE__ */ c({
10
+ __name: "MudaSidebarDrawer",
11
+ props: { item: {} },
12
+ setup(e) {
13
+ let r = e, c = b(), { selectedItem: l, mode: u, position: m, paneWidth: h, contentWidth: _, size: y } = D(), w = n(() => c.content != null), T = n(() => r.item.name === l.value), E = (e) => {
14
+ switch (r.item.type) {
15
+ case "pane":
16
+ l.value = l.value === r.item.name ? null : r.item.name;
17
+ break;
18
+ case "button": e.preventDefault(), r.item.onClick();
19
+ }
20
+ };
21
+ return (e, n) => (p(), a("div", O, [o("div", k, [o("button", {
22
+ type: "button",
23
+ class: d(["muda-button-reset muda:flex muda:cursor-pointer muda:items-center muda:justify-center muda:text-xs muda:hover:fill-primary-light muda:hover:text-primary-light", {
24
+ "muda:rounded-md muda:fill-primary muda:text-primary": T.value,
25
+ "muda:fill-secondary muda:text-secondary": !T.value,
26
+ "muda:size-8": v(y) === "small",
27
+ "muda:size-9": v(y) === "medium",
28
+ "muda:size-10": v(y) === "large"
29
+ }]),
30
+ onClick: E
31
+ }, [g(e.$slots, "label", { isActive: T.value })], 2)]), w.value ? (p(), a("div", {
32
+ key: 0,
33
+ class: d(["muda:absolute muda:top-0 muda:bottom-0 muda:z-100 muda:overflow-hidden", {
34
+ "muda:right-full": v(u) === "absolute" && v(m) === "right",
35
+ "muda:left-full": v(u) === "absolute" && v(m) === "left"
36
+ }]),
37
+ style: f({
38
+ left: v(u) === "static" && v(m) === "left" ? v(h) : void 0,
39
+ right: v(u) === "static" && v(m) === "right" ? v(h) : void 0
40
+ })
41
+ }, [s(t, {
42
+ "enter-active-class": "muda:transition-transform muda:duration-300 muda:ease-out muda:overflow-x-hidden",
43
+ "enter-from-class": v(m) === "left" ? "muda:-translate-x-full" : "muda:translate-x-full",
44
+ "enter-to-class": "muda:translate-x-0",
45
+ "leave-active-class": "muda:transition-transform muda:duration-300 muda:ease-out muda:overflow-x-hidden",
46
+ "leave-from-class": "muda:translate-x-0",
47
+ "leave-to-class": v(m) === "left" ? "muda:-translate-x-full" : "muda:translate-x-full"
48
+ }, {
49
+ default: S(() => [C(o("div", {
50
+ class: "muda:relative muda:h-full muda:overflow-hidden",
51
+ style: f({ width: v(_) })
52
+ }, [o("div", { class: d(["muda:absolute muda:inset-0 muda:z-100 muda:border-secondary-light muda:bg-foreground", {
53
+ "muda:before:absolute muda:before:top-0 muda:before:bottom-0 muda:before:z-50 muda:before:w-2 muda:before:from-black muda:before:opacity-10 muda:before:content-['']": v(u) === "absolute",
54
+ "muda:left-2 muda:border-l muda:before:-left-2 muda:before:bg-linear-to-l": v(u) === "absolute" && v(m) === "right",
55
+ "muda:right-2 muda:border-r muda:before:-right-2 muda:before:bg-linear-to-r": v(u) === "absolute" && v(m) === "left",
56
+ "muda:left-0 muda:border-l": v(u) !== "absolute" && v(m) === "right",
57
+ "muda:right-0 muda:border-r": v(u) !== "absolute" && v(m) === "left"
58
+ }]) }, [g(e.$slots, "content", { isActive: T.value })], 2)], 4), [[x, T.value]])]),
59
+ _: 3
60
+ }, 8, ["enter-from-class", "leave-to-class"])], 6)) : i("", !0)]));
61
+ }
62
+ }), j = { class: "muda:flex muda:h-full muda:flex-col" }, M = { class: "muda:flex muda:h-full muda:flex-col muda:justify-end" }, N = /* @__PURE__ */ c({
63
+ __name: "MudaSidebar",
64
+ props: /*@__PURE__*/ u({
65
+ items: {},
66
+ size: { default: "medium" },
67
+ position: { default: "left" },
68
+ mode: { default: "absolute" },
69
+ contentWidth: { default: T },
70
+ paneWidth: { default: w }
71
+ }, {
72
+ modelValue: { required: !0 },
73
+ modelModifiers: {}
74
+ }),
75
+ emits: ["update:modelValue"],
76
+ setup(t) {
77
+ let i = t, s = y(t, "modelValue"), { contentWidth: c, mode: l, paneWidth: u, position: v, size: b } = _(i);
78
+ m(E, {
79
+ selectedItem: s,
80
+ contentWidth: c,
81
+ mode: l,
82
+ paneWidth: u,
83
+ position: v,
84
+ size: b
85
+ });
86
+ let x = n(() => ({
87
+ mode: l.value,
88
+ position: v.value,
89
+ size: b.value
90
+ })), C = n(() => i.items.filter((e) => e.position === "top")), w = n(() => i.items.filter((e) => e.position === "bottom"));
91
+ return (t, n) => (p(), a("div", {
92
+ class: d(["muda:relative muda:flex muda:h-full muda:bg-transparent muda:transition-[width] muda:duration-300 muda:ease-out", {
93
+ "muda:justify-end": i.position === "right",
94
+ "muda:justify-start": i.position === "left"
95
+ }]),
96
+ style: f({ width: i.mode === "static" && s.value != null ? `calc(${i.contentWidth} + ${i.paneWidth})` : i.paneWidth })
97
+ }, [o("div", {
98
+ class: d(["muda:flex muda:h-full muda:flex-col muda:bg-foreground muda:py-4", {
99
+ "muda:border-l muda:border-l-secondary-light": i.position === "right",
100
+ "muda:border-r muda:border-r-secondary-light": i.position === "left"
101
+ }]),
102
+ style: f({ width: i.paneWidth })
103
+ }, [o("div", j, [(p(!0), a(e, null, h(C.value, (e, n) => (p(), r(A, {
104
+ key: e.name,
105
+ item: e
106
+ }, {
107
+ label: S(({ isActive: r }) => [g(t.$slots, `${e.name}-label`, {
108
+ item: e,
109
+ index: n,
110
+ isActive: r,
111
+ context: x.value
112
+ })]),
113
+ content: S(({ isActive: r }) => [g(t.$slots, e.name, {
114
+ item: e,
115
+ index: n,
116
+ isActive: r,
117
+ context: x.value
118
+ })]),
119
+ _: 2
120
+ }, 1032, ["item"]))), 128))]), o("div", M, [(p(!0), a(e, null, h(w.value, (e, n) => (p(), r(A, {
121
+ key: e.name,
122
+ item: e
123
+ }, {
124
+ label: S(({ isActive: r }) => [g(t.$slots, `${e.name}-label`, {
125
+ item: e,
126
+ index: n,
127
+ isActive: r,
128
+ context: x.value
129
+ })]),
130
+ content: S(({ isActive: r }) => [g(t.$slots, e.name, {
131
+ item: e,
132
+ index: n,
133
+ isActive: r,
134
+ context: x.value
135
+ })]),
136
+ _: 2
137
+ }, 1032, ["item"]))), 128))])], 6)], 6));
138
+ }
139
+ });
140
+ //#endregion
141
+ export { T as n, w as r, N as t };
@@ -0,0 +1,2 @@
1
+ import type { MudaComponentVariant } from "../../common/components";
2
+ export type MudaButtonVariant = MudaComponentVariant | `outline-${MudaComponentVariant}` | `link-${MudaComponentVariant}`;
@@ -1,7 +1,8 @@
1
- import type { MudaComponentSize, MudaComponentVariant } from "../../common/components";
1
+ import type { MudaComponentSize } from "../../common/components";
2
+ import { MudaButtonVariant } from "./MudaButton.types";
2
3
  type __VLS_Props = {
3
4
  size?: MudaComponentSize;
4
- variant?: MudaComponentVariant;
5
+ variant?: MudaButtonVariant;
5
6
  disabled?: boolean;
6
7
  as?: "button" | "a";
7
8
  };
@@ -11,7 +12,7 @@ type __VLS_Slots = {} & {
11
12
  };
12
13
  declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
13
14
  size: MudaComponentSize;
14
- variant: MudaComponentVariant;
15
+ variant: MudaButtonVariant;
15
16
  disabled: boolean;
16
17
  as: "button" | "a";
17
18
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
@@ -1 +1,2 @@
1
+ export * from "./MudaButton.types";
1
2
  export { default as MudaButton } from "./MudaButton.vue";
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../MudaButton-CWY0U8WO.js";
1
+ import { t as e } from "../../MudaButton-B9EAJW32.js";
2
2
  export { e as MudaButton };
@@ -1,2 +1,2 @@
1
- import { n as e, t } from "../../MudaColorPicker-CnB1MYB3.js";
1
+ import { n as e, t } from "../../MudaColorPicker-D9BhgHf9.js";
2
2
  export { t as MudaColorPicker, e as MudaColorPickerControl };
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../MudaDialog-DTR4JKpJ.js";
1
+ import { t as e } from "../../MudaDialog-dQSFVdgu.js";
2
2
  export { e as MudaDialog };
@@ -1,2 +1,2 @@
1
- import { n as e, t } from "../../MudaFormCombobox-DqH-EyMV.js";
1
+ import { n as e, t } from "../../MudaFormCombobox-CK2De6Rv.js";
2
2
  export { e as MudaFormComboboxMultiple, t as MudaFormComboboxSingle };
@@ -0,0 +1,16 @@
1
+ export type MudaSidebarMode = "absolute" | "static";
2
+ export type MudaSidebarPosition = "left" | "right";
3
+ export type MudaSidebarItemPosition = "top" | "bottom";
4
+ interface MudaSidebarItemBase<T extends string> {
5
+ name: T;
6
+ position: MudaSidebarItemPosition;
7
+ }
8
+ export type MudaSidebarItem<T extends string> = MudaSidebarItemBase<T> & ({
9
+ type: "pane";
10
+ } | {
11
+ type: "button";
12
+ onClick: () => void;
13
+ });
14
+ export declare const MUDA_SIDEBAR_DEFAULT_PANE_WIDTH = "64px";
15
+ export declare const MUDA_SIDEBAR_DEFAULT_CONTENT_WIDTH = "360px";
16
+ export {};
@@ -0,0 +1,67 @@
1
+ import { MudaComponentSize } from "../../common/components";
2
+ import { type MudaSidebarItem, type MudaSidebarMode, type MudaSidebarPosition } from "./MudaSidebar.types";
3
+ declare const __VLS_export: <T extends string>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
4
+ props: import("vue").PublicProps & __VLS_PrettifyLocal<({
5
+ items: MudaSidebarItem<T>[];
6
+ size?: MudaComponentSize;
7
+ position?: MudaSidebarPosition;
8
+ mode?: MudaSidebarMode;
9
+ contentWidth?: string;
10
+ paneWidth?: string;
11
+ } & {
12
+ modelValue: T | null;
13
+ }) & {
14
+ "onUpdate:modelValue"?: ((value: T | null) => any) | undefined;
15
+ }> & (typeof globalThis extends {
16
+ __VLS_PROPS_FALLBACK: infer P;
17
+ } ? P : {});
18
+ expose: (exposed: {}) => void;
19
+ attrs: any;
20
+ slots: { [K in `${T}-label`]?: ((props: {
21
+ item: MudaSidebarItem<T>;
22
+ index: number;
23
+ isActive: boolean;
24
+ context: {
25
+ mode: MudaSidebarMode;
26
+ position: MudaSidebarPosition;
27
+ size: MudaComponentSize;
28
+ };
29
+ }) => any) | undefined; } & { [K_1 in T]?: ((props: {
30
+ item: MudaSidebarItem<T>;
31
+ index: number;
32
+ isActive: boolean;
33
+ context: {
34
+ mode: MudaSidebarMode;
35
+ position: MudaSidebarPosition;
36
+ size: MudaComponentSize;
37
+ };
38
+ }) => any) | undefined; } & { [K_2 in `${T}-label`]?: ((props: {
39
+ item: MudaSidebarItem<T>;
40
+ index: number;
41
+ isActive: boolean;
42
+ context: {
43
+ mode: MudaSidebarMode;
44
+ position: MudaSidebarPosition;
45
+ size: MudaComponentSize;
46
+ };
47
+ }) => any) | undefined; } & { [K_3 in T]?: ((props: {
48
+ item: MudaSidebarItem<T>;
49
+ index: number;
50
+ isActive: boolean;
51
+ context: {
52
+ mode: MudaSidebarMode;
53
+ position: MudaSidebarPosition;
54
+ size: MudaComponentSize;
55
+ };
56
+ }) => any) | undefined; };
57
+ emit: (event: "update:modelValue", value: T | null) => void;
58
+ }>) => import("vue").VNode & {
59
+ __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
60
+ };
61
+ declare const _default: typeof __VLS_export;
62
+ export default _default;
63
+ type __VLS_PrettifyLocal<T> = (T extends any ? {
64
+ [K in keyof T]: T[K];
65
+ } : {
66
+ [K in keyof T as K]: T[K];
67
+ }) & {};
@@ -0,0 +1,29 @@
1
+ import { type Slot } from "vue";
2
+ import { type MudaSidebarItem } from "./MudaSidebar.types";
3
+ declare const __VLS_export: <T extends string>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
4
+ props: import("vue").PublicProps & __VLS_PrettifyLocal<{
5
+ item: MudaSidebarItem<T>;
6
+ }> & (typeof globalThis extends {
7
+ __VLS_PROPS_FALLBACK: infer P;
8
+ } ? P : {});
9
+ expose: (exposed: {}) => void;
10
+ attrs: any;
11
+ slots: {
12
+ content: Slot<{
13
+ isActive: boolean;
14
+ }>;
15
+ label: Slot<{
16
+ isActive: boolean;
17
+ }>;
18
+ };
19
+ emit: {};
20
+ }>) => import("vue").VNode & {
21
+ __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
22
+ };
23
+ declare const _default: typeof __VLS_export;
24
+ export default _default;
25
+ type __VLS_PrettifyLocal<T> = (T extends any ? {
26
+ [K in keyof T]: T[K];
27
+ } : {
28
+ [K in keyof T as K]: T[K];
29
+ }) & {};
@@ -0,0 +1,2 @@
1
+ export * from "./MudaSidebar.types";
2
+ export { default as MudaSidebar } from "./MudaSidebar.vue";
@@ -0,0 +1,2 @@
1
+ import { n as e, r as t, t as n } from "../../MudaSidebar-DvKS4VtE.js";
2
+ export { e as MUDA_SIDEBAR_DEFAULT_CONTENT_WIDTH, t as MUDA_SIDEBAR_DEFAULT_PANE_WIDTH, n as MudaSidebar };
@@ -0,0 +1,13 @@
1
+ import { InjectionKey, Ref } from "vue";
2
+ import { MudaComponentSize } from "../../common/components";
3
+ import { MudaSidebarMode, MudaSidebarPosition } from "./MudaSidebar.types";
4
+ export declare const MUDA_SIDEBAR_CONTEXT: InjectionKey<MudaSidebarContext<string>>;
5
+ export interface MudaSidebarContext<T extends string> {
6
+ selectedItem: Ref<T | null>;
7
+ size: Ref<MudaComponentSize>;
8
+ position: Ref<MudaSidebarPosition>;
9
+ mode: Ref<MudaSidebarMode>;
10
+ contentWidth: Ref<string>;
11
+ paneWidth: Ref<string>;
12
+ }
13
+ export declare function useMudaSidebarContext<T extends string>(): MudaSidebarContext<T>;
@@ -0,0 +1,5 @@
1
+ export * from "./useBodyScrollLock";
2
+ export * from "./useClickOutside";
3
+ export * from "./useKeyDown";
4
+ export * from "./useResizeObserver";
5
+ export * from "./useZIndex";
@@ -0,0 +1,6 @@
1
+ import { t as e } from "../useBodyScrollLock-4K-3lAFL.js";
2
+ import { t } from "../useClickOutside-B6tdxsc3.js";
3
+ import { t as n } from "../useKeyDown-B1jmp4nA.js";
4
+ import { t as r } from "../useResizeObserver-BYI1Pg1T.js";
5
+ import { t as i } from "../useZIndex-DWnsohLZ.js";
6
+ export { e as useBodyScrollLock, t as useClickOutside, n as useKeyDown, r as useResizeObserver, i as useZIndex };
package/dist/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- export type { MudaComponentVariant } from "./common/components";
1
+ export type { MudaComponentSize, MudaComponentVariant } from "./common/components";
2
2
  export * from "./components/MudaButton";
3
3
  export * from "./components/MudaButtonStack";
4
4
  export * from "./components/MudaCalendar";
@@ -22,6 +22,12 @@ export * from "./components/MudaIconPicker";
22
22
  export * from "./components/MudaMarker";
23
23
  export * from "./components/MudaPagination";
24
24
  export * from "./components/MudaPopover";
25
+ export * from "./components/MudaSidebar";
25
26
  export * from "./components/MudaSpinner";
26
27
  export * from "./components/MudaTable";
27
28
  export * from "./components/MudaTag";
29
+ export * from "./composables/useBodyScrollLock";
30
+ export * from "./composables/useClickOutside";
31
+ export * from "./composables/useKeyDown";
32
+ export * from "./composables/useResizeObserver";
33
+ export * from "./composables/useZIndex";
package/dist/index.js CHANGED
@@ -1,27 +1,33 @@
1
- import { t as e } from "./MudaButton-CWY0U8WO.js";
2
- import { t } from "./MudaButtonStack-8z8FVezw.js";
3
- import { a as n, c as r, i, l as a, n as o, o as s, r as c, s as l, t as u } from "./MudaCalendar-CgKIaHEr.js";
4
- import { a as d, c as f, i as p, l as m, n as h, o as g, r as _, s as v, t as y, u as b } from "./MudaIcon-BwqQQnti.js";
5
- import { t as x } from "./MudaFormInput-D1-kQq9y.js";
6
- import { t as S } from "./MudaPopover-C1fDWbPf.js";
7
- import { t as C } from "./MudaCard-DGdFOdro.js";
8
- import { n as w, t as T } from "./MudaColorPicker-CnB1MYB3.js";
9
- import { t as E } from "./MudaDialog-DTR4JKpJ.js";
10
- import { t as D } from "./MudaFocusTrap-CGlvV_MC.js";
11
- import { t as O } from "./MudaDropdown-Dhv8Mhxm.js";
12
- import { t as k } from "./MudaErrorBox-B9ySoal8.js";
13
- import { t as A } from "./MudaFormCheckbox-C1wTjohm.js";
14
- import { n as j, t as M } from "./MudaFormCombobox-DqH-EyMV.js";
15
- import { n as N, t as P } from "./MudaFormField-dOZRdslO.js";
16
- import { t as F } from "./MudaFormRadio-BXj-XnwW.js";
17
- import { t as I } from "./MudaFormRadioGroup-DnsZT-0C.js";
18
- import { t as L } from "./MudaFormSelect-CLmsuMQG.js";
19
- import { t as R } from "./MudaFormSwitch-C2Hx0mfr.js";
20
- import { t as z } from "./MudaFormText-DbSiSTGh.js";
21
- import { t as B } from "./MudaIconPicker-X5xJ_lbO.js";
22
- import { t as V } from "./MudaMarker-DX1N2YxM.js";
23
- import { t as H } from "./MudaPagination-BoqrKfPw.js";
24
- import { t as U } from "./MudaSpinner-BMR0Shwx.js";
25
- import { i as W, n as G, r as K, t as q } from "./MudaTable-BxKbNx6v.js";
26
- import { t as J } from "./MudaTag-kOu3daeI.js";
27
- export { i as CALENDAR_DAY_FORMAT, n as CALENDAR_MONTH_FORMAT, s as CALENDAR_VALUE_FORMAT, l as CALENDAR_YEAR_FORMAT, r as MONTH_RANGE_SIZE, b as MUDA_ICON_DELIMITER, e as MudaButton, t as MudaButtonStack, o as MudaCalendar, c as MudaCalendarDatePicker, u as MudaCalendarInput, C as MudaCard, T as MudaColorPicker, w as MudaColorPickerControl, E as MudaDialog, O as MudaDropdown, k as MudaErrorBox, D as MudaFocusTrap, A as MudaFormCheckbox, j as MudaFormComboboxMultiple, M as MudaFormComboboxSingle, P as MudaFormField, N as MudaFormFieldErrors, x as MudaFormInput, F as MudaFormRadio, I as MudaFormRadioGroup, L as MudaFormSelect, R as MudaFormSwitch, z as MudaFormText, y as MudaIcon, B as MudaIconPicker, V as MudaMarker, H as MudaPagination, S as MudaPopover, U as MudaSpinner, W as MudaTable, K as MudaTableCell, G as MudaTableHead, q as MudaTableRow, J as MudaTag, a as YEAR_RANGE_SIZE, h as composeIcon, _ as extractIconName, p as extractIconVariant, d as isIconName, g as isIconVariant, v as useMudaIcon, f as useMudaIconNames, m as useMudaIcons };
1
+ import { t as e } from "./useBodyScrollLock-4K-3lAFL.js";
2
+ import { t } from "./useClickOutside-B6tdxsc3.js";
3
+ import { t as n } from "./useKeyDown-B1jmp4nA.js";
4
+ import { t as r } from "./useResizeObserver-BYI1Pg1T.js";
5
+ import { t as i } from "./useZIndex-DWnsohLZ.js";
6
+ import { t as a } from "./MudaButton-B9EAJW32.js";
7
+ import { t as o } from "./MudaButtonStack-8z8FVezw.js";
8
+ import { a as s, c, i as l, l as u, n as d, o as f, r as p, s as m, t as h } from "./MudaCalendar-CgKIaHEr.js";
9
+ import { a as g, c as _, i as v, l as y, n as b, o as x, r as S, s as C, t as w, u as T } from "./MudaIcon-BwqQQnti.js";
10
+ import { t as E } from "./MudaFormInput-D1-kQq9y.js";
11
+ import { t as D } from "./MudaPopover-C1fDWbPf.js";
12
+ import { t as O } from "./MudaCard-DGdFOdro.js";
13
+ import { n as k, t as A } from "./MudaColorPicker-D9BhgHf9.js";
14
+ import { t as j } from "./MudaFocusTrap-CGlvV_MC.js";
15
+ import { t as M } from "./MudaDialog-dQSFVdgu.js";
16
+ import { t as N } from "./MudaDropdown-Dhv8Mhxm.js";
17
+ import { t as P } from "./MudaErrorBox-B9ySoal8.js";
18
+ import { t as F } from "./MudaFormCheckbox-C1wTjohm.js";
19
+ import { n as I, t as L } from "./MudaFormCombobox-CK2De6Rv.js";
20
+ import { n as R, t as z } from "./MudaFormField-dOZRdslO.js";
21
+ import { t as B } from "./MudaFormRadio-BXj-XnwW.js";
22
+ import { t as V } from "./MudaFormRadioGroup-DnsZT-0C.js";
23
+ import { t as H } from "./MudaFormSelect-CLmsuMQG.js";
24
+ import { t as U } from "./MudaFormSwitch-C2Hx0mfr.js";
25
+ import { t as W } from "./MudaFormText-DbSiSTGh.js";
26
+ import { t as G } from "./MudaIconPicker-X5xJ_lbO.js";
27
+ import { t as K } from "./MudaMarker-DX1N2YxM.js";
28
+ import { t as q } from "./MudaPagination-BoqrKfPw.js";
29
+ import { n as J, r as Y, t as X } from "./MudaSidebar-DvKS4VtE.js";
30
+ import { t as Z } from "./MudaSpinner-BMR0Shwx.js";
31
+ import { i as Q, n as $, r as ee, t as te } from "./MudaTable-BxKbNx6v.js";
32
+ import { t as ne } from "./MudaTag-kOu3daeI.js";
33
+ export { l as CALENDAR_DAY_FORMAT, s as CALENDAR_MONTH_FORMAT, f as CALENDAR_VALUE_FORMAT, m as CALENDAR_YEAR_FORMAT, c as MONTH_RANGE_SIZE, T as MUDA_ICON_DELIMITER, J as MUDA_SIDEBAR_DEFAULT_CONTENT_WIDTH, Y as MUDA_SIDEBAR_DEFAULT_PANE_WIDTH, a as MudaButton, o as MudaButtonStack, d as MudaCalendar, p as MudaCalendarDatePicker, h as MudaCalendarInput, O as MudaCard, A as MudaColorPicker, k as MudaColorPickerControl, M as MudaDialog, N as MudaDropdown, P as MudaErrorBox, j as MudaFocusTrap, F as MudaFormCheckbox, I as MudaFormComboboxMultiple, L as MudaFormComboboxSingle, z as MudaFormField, R as MudaFormFieldErrors, E as MudaFormInput, B as MudaFormRadio, V as MudaFormRadioGroup, H as MudaFormSelect, U as MudaFormSwitch, W as MudaFormText, w as MudaIcon, G as MudaIconPicker, K as MudaMarker, q as MudaPagination, D as MudaPopover, X as MudaSidebar, Z as MudaSpinner, Q as MudaTable, ee as MudaTableCell, $ as MudaTableHead, te as MudaTableRow, ne as MudaTag, u as YEAR_RANGE_SIZE, b as composeIcon, S as extractIconName, v as extractIconVariant, g as isIconName, x as isIconVariant, e as useBodyScrollLock, t as useClickOutside, n as useKeyDown, C as useMudaIcon, _ as useMudaIconNames, y as useMudaIcons, r as useResizeObserver, i as useZIndex };
package/dist/style.css CHANGED
@@ -1,2 +1,2 @@
1
- .muda-button-stack-h button:first-of-type{border-top-right-radius:0;border-bottom-right-radius:0}.muda-button-stack-h button:not(:first-of-type):not(:last-of-type){border-radius:0}.muda-button-stack-h button:last-of-type{border-top-left-radius:0;border-bottom-left-radius:0}.muda-button-stack-v button:first-of-type{border-bottom-right-radius:0;border-bottom-left-radius:0}.muda-button-stack-v button:not(:first-of-type):not(:last-of-type){border-radius:0}.muda-button-stack-v button:last-of-type{border-top-left-radius:0;border-top-right-radius:0}.color-picker-saturation[data-v-bdb328ef]{background-image:linear-gradient(#0000,#000),linear-gradient(90deg,#fff,#0000)}.color-picker-hue[data-v-bdb328ef]{background-image:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.muda-form-select[data-v-5c7dda51]:after{clip-path:polygon(100% 0%,0 0%,50% 100%)}@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial;--tw-content:"";--tw-outline-style:solid}}}@layer theme{:root,:host{--muda-color-gray-400:oklch(70.7% .022 261.325);--muda-color-gray-500:oklch(55.1% .027 264.364);--muda-color-gray-600:oklch(44.6% .03 256.802);--muda-color-white:#fff;--muda-spacing:.25rem;--muda-text-xs:.75rem;--muda-text-xs--line-height:calc(1 / .75);--muda-text-sm:.875rem;--muda-text-sm--line-height:calc(1.25 / .875);--muda-text-base:1rem;--muda-text-base--line-height:calc(1.5 / 1);--muda-text-lg:1.125rem;--muda-text-lg--line-height:calc(1.75 / 1.125);--muda-text-xl:1.25rem;--muda-text-xl--line-height:calc(1.75 / 1.25);--muda-text-2xl:1.5rem;--muda-text-2xl--line-height:calc(2 / 1.5);--muda-text-4xl:2.25rem;--muda-text-4xl--line-height:calc(2.5 / 2.25);--muda-font-weight-medium:500;--muda-font-weight-semibold:600;--muda-font-weight-bold:700;--muda-tracking-tight:-.025em;--muda-tracking-widest:.1em;--muda-radius-xs:.125rem;--muda-radius-sm:.25rem;--muda-radius-md:.375rem;--muda-radius-lg:.5rem;--muda-animate-spin:spin 1s linear infinite;--muda-blur-xs:4px;--muda-default-transition-duration:.15s;--muda-default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--muda-color-background:#f5f5f5;--muda-color-foreground:#fff;--muda-color-form-background:#fafafa;--muda-color-primary:#1d4ed8;--muda-color-primary-light:#60a5fa;--muda-color-primary-dark:#1e3a8a;--muda-color-secondary:#78716c;--muda-color-secondary-light:#dcdcdc;--muda-color-secondary-dark:#334155;--muda-color-success:#84cc16;--muda-color-success-light:#d9f99d;--muda-color-success-dark:#4d7c0f;--muda-color-danger:#ef4444;--muda-color-danger-light:#fecaca;--muda-color-danger-dark:#b91c1c;--muda-color-warning:#f59e0b;--muda-color-warning-light:#fde68a;--muda-color-warning-dark:#b45309;--muda-color-info:#60a5fa;--muda-color-info-light:#dbeafe;--muda-color-info-dark:#3b82f6}}@layer base;@layer components{.muda-control-reset,.muda-button-reset{box-sizing:border-box;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;margin:0}.muda-control-reset::placeholder{opacity:1}textarea.muda-control-reset{resize:vertical}.muda-button-reset{background-color:#0000;border:none;padding:0}.muda-button-reset:not(:disabled){cursor:pointer}.muda-button-reset:disabled{cursor:not-allowed}.muda-link-reset{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}}@layer utilities{.muda\:pointer-events-none{pointer-events:none}.muda\:sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.muda\:absolute{position:absolute}.muda\:fixed{position:fixed}.muda\:relative{position:relative}.muda\:sticky{position:sticky}.muda\:inset-0{inset:0}.muda\:inset-y-0{inset-block:0}.muda\:top-0{top:0}.muda\:right-2{right:calc(var(--muda-spacing) * 2)}.muda\:left-2{left:calc(var(--muda-spacing) * 2)}.muda\:isolate{isolation:isolate}.muda\:z-10{z-index:10}.muda\:col-span-3{grid-column:span 3/span 3}.muda\:m-0{margin:0}.muda\:-mt-0\.5{margin-top:calc(var(--muda-spacing) * -.5)}.muda\:-mt-2\.75{margin-top:calc(var(--muda-spacing) * -2.75)}.muda\:mb-1{margin-bottom:var(--muda-spacing)}.muda\:-ml-0\.5{margin-left:calc(var(--muda-spacing) * -.5)}.muda\:no-scrollbar::-webkit-scrollbar{display:none}.muda\:no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.muda\:block{display:block}.muda\:flex{display:flex}.muda\:grid{display:grid}.muda\:hidden{display:none}.muda\:inline-block{display:inline-block}.muda\:inline-flex{display:inline-flex}.muda\:size-4{width:calc(var(--muda-spacing) * 4);height:calc(var(--muda-spacing) * 4)}.muda\:size-5{width:calc(var(--muda-spacing) * 5);height:calc(var(--muda-spacing) * 5)}.muda\:size-6{width:calc(var(--muda-spacing) * 6);height:calc(var(--muda-spacing) * 6)}.muda\:size-7{width:calc(var(--muda-spacing) * 7);height:calc(var(--muda-spacing) * 7)}.muda\:size-10{width:calc(var(--muda-spacing) * 10);height:calc(var(--muda-spacing) * 10)}.muda\:size-14{width:calc(var(--muda-spacing) * 14);height:calc(var(--muda-spacing) * 14)}.muda\:size-24{width:calc(var(--muda-spacing) * 24);height:calc(var(--muda-spacing) * 24)}.muda\:size-min{width:min-content;height:min-content}.muda\:h-4{height:calc(var(--muda-spacing) * 4)}.muda\:h-6{height:calc(var(--muda-spacing) * 6)}.muda\:h-10{height:calc(var(--muda-spacing) * 10)}.muda\:h-14{height:calc(var(--muda-spacing) * 14)}.muda\:h-125{height:calc(var(--muda-spacing) * 125)}.muda\:h-\[100px\]{height:100px}.muda\:h-\[380px\]{height:380px}.muda\:h-\[500px\]{height:500px}.muda\:h-max{height:max-content}.muda\:max-h-52{max-height:calc(var(--muda-spacing) * 52)}.muda\:max-h-60{max-height:calc(var(--muda-spacing) * 60)}.muda\:max-h-64{max-height:calc(var(--muda-spacing) * 64)}.muda\:max-h-80{max-height:calc(var(--muda-spacing) * 80)}.muda\:min-h-10{min-height:calc(var(--muda-spacing) * 10)}.muda\:min-h-50{min-height:calc(var(--muda-spacing) * 50)}.muda\:min-h-full{min-height:100%}.muda\:min-h-screen{min-height:100vh}.muda\:w-4{width:calc(var(--muda-spacing) * 4)}.muda\:w-11{width:calc(var(--muda-spacing) * 11)}.muda\:w-76{width:calc(var(--muda-spacing) * 76)}.muda\:w-80{width:calc(var(--muda-spacing) * 80)}.muda\:w-160{width:calc(var(--muda-spacing) * 160)}.muda\:w-full{width:100%}.muda\:w-max{width:max-content}.muda\:w-screen{width:100vw}.muda\:min-w-10{min-width:calc(var(--muda-spacing) * 10)}.muda\:flex-1{flex:1}.muda\:shrink-0{flex-shrink:0}.muda\:border-collapse{border-collapse:collapse}.muda\:-translate-x-2{--tw-translate-x:calc(var(--muda-spacing) * -2);translate:var(--tw-translate-x) var(--tw-translate-y)}.muda\:-translate-y-2{--tw-translate-y:calc(var(--muda-spacing) * -2);translate:var(--tw-translate-x) var(--tw-translate-y)}.muda\:animate-spin{animation:var(--muda-animate-spin)}.muda\:cursor-not-allowed{cursor:not-allowed}.muda\:cursor-pointer{cursor:pointer}.muda\:list-none{list-style-type:none}.muda\:appearance-none{appearance:none}.muda\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.muda\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.muda\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.muda\:grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}.muda\:grid-cols-\[6rem_repeat\(3\,minmax\(0\,1fr\)\)\]{grid-template-columns:6rem repeat(3,minmax(0,1fr))}.muda\:grid-cols-\[repeat\(2\,1fr\)\]{grid-template-columns:repeat(2,1fr)}.muda\:grid-cols-\[repeat\(4\,1fr\)\]{grid-template-columns:repeat(4,1fr)}.muda\:grid-cols-\[repeat\(7\,auto\)\]{grid-template-columns:repeat(7,auto)}.muda\:flex-col{flex-direction:column}.muda\:flex-row{flex-direction:row}.muda\:items-center{align-items:center}.muda\:justify-center{justify-content:center}.muda\:justify-start{justify-content:flex-start}.muda\:gap-0\.5{gap:calc(var(--muda-spacing) * .5)}.muda\:gap-1{gap:var(--muda-spacing)}.muda\:gap-2{gap:calc(var(--muda-spacing) * 2)}.muda\:gap-4{gap:calc(var(--muda-spacing) * 4)}.muda\:gap-6{gap:calc(var(--muda-spacing) * 6)}.muda\:gap-8{gap:calc(var(--muda-spacing) * 8)}.muda\:gap-px{gap:1px}.muda\:scroll-container-v-form-background{background:linear-gradient(var(--muda-color-form-background) 30%, #fff0), linear-gradient(#fff0, var(--muda-color-form-background) 70%) 0 100%, radial-gradient(farthest-side at 50% 0, #0003, #0000), radial-gradient(farthest-side at 50% 100%, #0003, #0000) 0 100%;background-repeat:no-repeat;background-color:var(--muda-color-form-background);background-size:100% 40px,100% 40px,100% 14px,100% 14px;background-attachment:local,local,scroll,scroll;overflow:auto}.muda\:overflow-auto{overflow:auto}.muda\:overflow-y-auto{overflow-y:auto}.muda\:rounded-full{border-radius:2147483647px}.muda\:rounded-lg{border-radius:var(--muda-radius-lg)}.muda\:rounded-md{border-radius:var(--muda-radius-md)}.muda\:rounded-sm{border-radius:var(--muda-radius-sm)}.muda\:rounded-xs{border-radius:var(--muda-radius-xs)}.muda\:rounded-b-lg{border-bottom-right-radius:var(--muda-radius-lg);border-bottom-left-radius:var(--muda-radius-lg)}.muda\:border{border-style:var(--tw-border-style);border-width:1px}.muda\:border-2{border-style:var(--tw-border-style);border-width:2px}.muda\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.muda\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.muda\:border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.muda\:border-danger{border-color:var(--muda-color-danger)}.muda\:border-danger-dark{border-color:var(--muda-color-danger-dark)}.muda\:border-info-dark{border-color:var(--muda-color-info-dark)}.muda\:border-primary{border-color:var(--muda-color-primary)}.muda\:border-primary-dark{border-color:var(--muda-color-primary-dark)}.muda\:border-secondary-dark,.muda\:border-secondary-dark\/20{border-color:var(--muda-color-secondary-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:border-secondary-dark\/20{border-color:color-mix(in oklab, var(--muda-color-secondary-dark) 20%, transparent)}}.muda\:border-secondary-light{border-color:var(--muda-color-secondary-light)}.muda\:border-success-dark{border-color:var(--muda-color-success-dark)}.muda\:border-warning-dark{border-color:var(--muda-color-warning-dark)}.muda\:border-white{border-color:var(--muda-color-white)}.muda\:border-b-secondary-light{border-bottom-color:var(--muda-color-secondary-light)}.muda\:bg-background{background-color:var(--muda-color-background)}.muda\:bg-danger{background-color:var(--muda-color-danger)}.muda\:bg-danger-light{background-color:var(--muda-color-danger-light)}.muda\:bg-foreground{background-color:var(--muda-color-foreground)}.muda\:bg-form-background{background-color:var(--muda-color-form-background)}.muda\:bg-gray-500\/30{background-color:var(--muda-color-gray-500)}@supports (color:color-mix(in lab, red, red)){.muda\:bg-gray-500\/30{background-color:color-mix(in oklab, var(--muda-color-gray-500) 30%, transparent)}}.muda\:bg-info{background-color:var(--muda-color-info)}.muda\:bg-info-light{background-color:var(--muda-color-info-light)}.muda\:bg-primary{background-color:var(--muda-color-primary)}.muda\:bg-primary-light{background-color:var(--muda-color-primary-light)}.muda\:bg-secondary{background-color:var(--muda-color-secondary)}.muda\:bg-secondary-light,.muda\:bg-secondary-light\/70{background-color:var(--muda-color-secondary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:bg-secondary-light\/70{background-color:color-mix(in oklab, var(--muda-color-secondary-light) 70%, transparent)}}.muda\:bg-success{background-color:var(--muda-color-success)}.muda\:bg-success-light{background-color:var(--muda-color-success-light)}.muda\:bg-warning{background-color:var(--muda-color-warning)}.muda\:bg-warning-light{background-color:var(--muda-color-warning-light)}.muda\:fill-danger{fill:var(--muda-color-danger)}.muda\:fill-info{fill:var(--muda-color-info)}.muda\:fill-primary{fill:var(--muda-color-primary)}.muda\:fill-secondary{fill:var(--muda-color-secondary)}.muda\:fill-secondary-dark{fill:var(--muda-color-secondary-dark)}.muda\:fill-secondary-light\/30{fill:var(--muda-color-secondary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:fill-secondary-light\/30{fill:color-mix(in oklab, var(--muda-color-secondary-light) 30%, transparent)}}.muda\:fill-success{fill:var(--muda-color-success)}.muda\:fill-warning{fill:var(--muda-color-warning)}.muda\:fill-white{fill:var(--muda-color-white)}.muda\:fill-white\!{fill:var(--muda-color-white)!important}.muda\:p-0{padding:0}.muda\:p-2{padding:calc(var(--muda-spacing) * 2)}.muda\:p-4{padding:calc(var(--muda-spacing) * 4)}.muda\:p-5{padding:calc(var(--muda-spacing) * 5)}.muda\:p-10{padding:calc(var(--muda-spacing) * 10)}.muda\:px-2{padding-inline:calc(var(--muda-spacing) * 2)}.muda\:px-2\.5{padding-inline:calc(var(--muda-spacing) * 2.5)}.muda\:px-3{padding-inline:calc(var(--muda-spacing) * 3)}.muda\:px-3\.5{padding-inline:calc(var(--muda-spacing) * 3.5)}.muda\:px-4{padding-inline:calc(var(--muda-spacing) * 4)}.muda\:py-1{padding-block:var(--muda-spacing)}.muda\:py-1\.5{padding-block:calc(var(--muda-spacing) * 1.5)}.muda\:py-2{padding-block:calc(var(--muda-spacing) * 2)}.muda\:py-2\.5{padding-block:calc(var(--muda-spacing) * 2.5)}.muda\:py-3{padding-block:calc(var(--muda-spacing) * 3)}.muda\:py-5{padding-block:calc(var(--muda-spacing) * 5)}.muda\:py-6{padding-block:calc(var(--muda-spacing) * 6)}.muda\:pt-2\.5{padding-top:calc(var(--muda-spacing) * 2.5)}.muda\:pr-9{padding-right:calc(var(--muda-spacing) * 9)}.muda\:pl-9{padding-left:calc(var(--muda-spacing) * 9)}.muda\:text-center{text-align:center}.muda\:text-left{text-align:left}.muda\:text-2xl{font-size:var(--muda-text-2xl);line-height:var(--tw-leading,var(--muda-text-2xl--line-height))}.muda\:text-4xl{font-size:var(--muda-text-4xl);line-height:var(--tw-leading,var(--muda-text-4xl--line-height))}.muda\:text-base{font-size:var(--muda-text-base);line-height:var(--tw-leading,var(--muda-text-base--line-height))}.muda\:text-sm{font-size:var(--muda-text-sm);line-height:var(--tw-leading,var(--muda-text-sm--line-height))}.muda\:text-xs{font-size:var(--muda-text-xs);line-height:var(--tw-leading,var(--muda-text-xs--line-height))}.muda\:text-\[0\.7rem\]{font-size:.7rem}.muda\:leading-6{--tw-leading:calc(var(--muda-spacing) * 6);line-height:calc(var(--muda-spacing) * 6)}.muda\:font-bold{--tw-font-weight:var(--muda-font-weight-bold);font-weight:var(--muda-font-weight-bold)}.muda\:font-medium{--tw-font-weight:var(--muda-font-weight-medium);font-weight:var(--muda-font-weight-medium)}.muda\:font-semibold{--tw-font-weight:var(--muda-font-weight-semibold);font-weight:var(--muda-font-weight-semibold)}.muda\:tracking-tight{--tw-tracking:var(--muda-tracking-tight);letter-spacing:var(--muda-tracking-tight)}.muda\:tracking-widest{--tw-tracking:var(--muda-tracking-widest);letter-spacing:var(--muda-tracking-widest)}.muda\:wrap-break-word{overflow-wrap:break-word}.muda\:whitespace-nowrap{white-space:nowrap}.muda\:text-danger{color:var(--muda-color-danger)}.muda\:text-danger-dark{color:var(--muda-color-danger-dark)}.muda\:text-gray-600{color:var(--muda-color-gray-600)}.muda\:text-info{color:var(--muda-color-info)}.muda\:text-info-dark{color:var(--muda-color-info-dark)}.muda\:text-primary{color:var(--muda-color-primary)}.muda\:text-primary-dark{color:var(--muda-color-primary-dark)}.muda\:text-secondary{color:var(--muda-color-secondary)}.muda\:text-secondary-dark{color:var(--muda-color-secondary-dark)}.muda\:text-secondary-light{color:var(--muda-color-secondary-light)}.muda\:text-success{color:var(--muda-color-success)}.muda\:text-success-dark{color:var(--muda-color-success-dark)}.muda\:text-warning{color:var(--muda-color-warning)}.muda\:text-warning-dark{color:var(--muda-color-warning-dark)}.muda\:text-white{color:var(--muda-color-white)}.muda\:uppercase{text-transform:uppercase}.muda\:opacity-0{opacity:0}.muda\:shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.muda\:shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.muda\:shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.muda\:ring-1{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.muda\:shadow-gray-400{--tw-shadow-color:var(--muda-color-gray-400)}@supports (color:color-mix(in lab, red, red)){.muda\:shadow-gray-400{--tw-shadow-color:color-mix(in oklab, var(--muda-color-gray-400) var(--tw-shadow-alpha), transparent)}}.muda\:ring-danger{--tw-ring-color:var(--muda-color-danger)}.muda\:ring-danger-dark\/20{--tw-ring-color:var(--muda-color-danger-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:ring-danger-dark\/20{--tw-ring-color:color-mix(in oklab, var(--muda-color-danger-dark) 20%, transparent)}}.muda\:ring-info-dark\/20{--tw-ring-color:var(--muda-color-info-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:ring-info-dark\/20{--tw-ring-color:color-mix(in oklab, var(--muda-color-info-dark) 20%, transparent)}}.muda\:ring-primary-dark\/20{--tw-ring-color:var(--muda-color-primary-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:ring-primary-dark\/20{--tw-ring-color:color-mix(in oklab, var(--muda-color-primary-dark) 20%, transparent)}}.muda\:ring-secondary-dark\/20{--tw-ring-color:var(--muda-color-secondary-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:ring-secondary-dark\/20{--tw-ring-color:color-mix(in oklab, var(--muda-color-secondary-dark) 20%, transparent)}}.muda\:ring-secondary-light{--tw-ring-color:var(--muda-color-secondary-light)}.muda\:ring-success-dark\/20{--tw-ring-color:var(--muda-color-success-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:ring-success-dark\/20{--tw-ring-color:color-mix(in oklab, var(--muda-color-success-dark) 20%, transparent)}}.muda\:ring-warning-dark\/20{--tw-ring-color:var(--muda-color-warning-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:ring-warning-dark\/20{--tw-ring-color:color-mix(in oklab, var(--muda-color-warning-dark) 20%, transparent)}}.muda\:outline-hidden{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.muda\:outline-hidden{outline-offset:2px;outline:2px solid #0000}}.muda\:backdrop-blur-xs{--tw-backdrop-blur:blur(var(--muda-blur-xs));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.muda\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--muda-default-transition-timing-function));transition-duration:var(--tw-duration,var(--muda-default-transition-duration))}.muda\:duration-100{--tw-duration:.1s;transition-duration:.1s}.muda\:ease-linear{--tw-ease:linear;transition-timing-function:linear}.muda\:select-none{-webkit-user-select:none;user-select:none}.muda\:ring-inset{--tw-ring-inset:inset}.muda\:peer-checked\:bg-primary:is(:where(.muda\:peer):checked~*){background-color:var(--muda-color-primary)}.muda\:peer-focus\:ring-2:is(:where(.muda\:peer):focus~*){--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.muda\:peer-focus\:ring-primary-light:is(:where(.muda\:peer):focus~*){--tw-ring-color:var(--muda-color-primary-light)}.muda\:peer-focus\:outline-hidden:is(:where(.muda\:peer):focus~*){--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.muda\:peer-focus\:outline-hidden:is(:where(.muda\:peer):focus~*){outline-offset:2px;outline:2px solid #0000}}.muda\:peer-disabled\:bg-secondary-light\/70:is(:where(.muda\:peer):disabled~*){background-color:var(--muda-color-secondary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:peer-disabled\:bg-secondary-light\/70:is(:where(.muda\:peer):disabled~*){background-color:color-mix(in oklab, var(--muda-color-secondary-light) 70%, transparent)}}.muda\:peer-disabled\:ring-secondary-dark\/20:is(:where(.muda\:peer):disabled~*){--tw-ring-color:var(--muda-color-secondary-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:peer-disabled\:ring-secondary-dark\/20:is(:where(.muda\:peer):disabled~*){--tw-ring-color:color-mix(in oklab, var(--muda-color-secondary-dark) 20%, transparent)}}.muda\:placeholder\:text-danger-light::placeholder{color:var(--muda-color-danger-light)}.muda\:placeholder\:text-secondary-light::placeholder{color:var(--muda-color-secondary-light)}.muda\:before\:absolute:before{content:var(--tw-content);position:absolute}.muda\:before\:top-0:before{content:var(--tw-content);top:0}.muda\:before\:right-0:before{content:var(--tw-content);right:0}.muda\:before\:bottom-0:before{content:var(--tw-content);bottom:0}.muda\:before\:left-0:before{content:var(--tw-content);left:0}.muda\:before\:flex:before{content:var(--tw-content);display:flex}.muda\:before\:items-center:before{content:var(--tw-content);align-items:center}.muda\:before\:justify-center:before{content:var(--tw-content);justify-content:center}.muda\:before\:text-lg:before{content:var(--tw-content);font-size:var(--muda-text-lg);line-height:var(--tw-leading,var(--muda-text-lg--line-height))}.muda\:before\:text-sm:before{content:var(--tw-content);font-size:var(--muda-text-sm);line-height:var(--tw-leading,var(--muda-text-sm--line-height))}.muda\:before\:text-xl:before{content:var(--tw-content);font-size:var(--muda-text-xl);line-height:var(--tw-leading,var(--muda-text-xl--line-height))}.muda\:before\:text-xs:before{content:var(--tw-content);font-size:var(--muda-text-xs);line-height:var(--tw-leading,var(--muda-text-xs--line-height))}.muda\:before\:font-bold:before{content:var(--tw-content);--tw-font-weight:var(--muda-font-weight-bold);font-weight:var(--muda-font-weight-bold)}.muda\:before\:text-primary:before{content:var(--tw-content);color:var(--muda-color-primary)}.muda\:after\:pointer-events-none:after{content:var(--tw-content);pointer-events:none}.muda\:after\:absolute:after{content:var(--tw-content);position:absolute}.muda\:after\:start-0\.5:after{content:var(--tw-content);inset-inline-start:calc(var(--muda-spacing) * .5)}.muda\:after\:top-0:after{content:var(--tw-content);top:0}.muda\:after\:top-0\.5:after{content:var(--tw-content);top:calc(var(--muda-spacing) * .5)}.muda\:after\:top-4:after{content:var(--tw-content);top:calc(var(--muda-spacing) * 4)}.muda\:after\:right-0:after{content:var(--tw-content);right:0}.muda\:after\:right-4:after{content:var(--tw-content);right:calc(var(--muda-spacing) * 4)}.muda\:after\:bottom-0:after{content:var(--tw-content);bottom:0}.muda\:after\:left-0:after{content:var(--tw-content);left:0}.muda\:after\:block:after{content:var(--tw-content);display:block}.muda\:after\:h-2:after{content:var(--tw-content);height:calc(var(--muda-spacing) * 2)}.muda\:after\:h-5:after{content:var(--tw-content);height:calc(var(--muda-spacing) * 5)}.muda\:after\:w-3:after{content:var(--tw-content);width:calc(var(--muda-spacing) * 3)}.muda\:after\:w-5:after{content:var(--tw-content);width:calc(var(--muda-spacing) * 5)}.muda\:after\:w-px:after{content:var(--tw-content);width:1px}.muda\:after\:rounded-full:after{content:var(--tw-content);border-radius:2147483647px}.muda\:after\:rounded-lg:after{content:var(--tw-content);border-radius:var(--muda-radius-lg)}.muda\:after\:border-2:after{content:var(--tw-content);border-style:var(--tw-border-style);border-width:2px}.muda\:after\:border-primary:after{content:var(--tw-content);border-color:var(--muda-color-primary)}.muda\:after\:bg-primary:after{content:var(--tw-content);background-color:var(--muda-color-primary)}.muda\:after\:bg-secondary-light:after,.muda\:after\:bg-secondary-light\/20:after{content:var(--tw-content);background-color:var(--muda-color-secondary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:after\:bg-secondary-light\/20:after{background-color:color-mix(in oklab, var(--muda-color-secondary-light) 20%, transparent)}}.muda\:after\:transition-all:after{content:var(--tw-content);transition-property:all;transition-timing-function:var(--tw-ease,var(--muda-default-transition-timing-function));transition-duration:var(--tw-duration,var(--muda-default-transition-duration))}.muda\:after\:content-\[\\\'\\\'\]:after{--tw-content:\'\';content:var(--tw-content)}.muda\:peer-checked\:after\:translate-x-full:is(:where(.muda\:peer):checked~*):after{content:var(--tw-content);--tw-translate-x:100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.muda\:peer-checked\:after\:bg-form-background:is(:where(.muda\:peer):checked~*):after{content:var(--tw-content);background-color:var(--muda-color-form-background)}.muda\:peer-disabled\:after\:bg-secondary-light:is(:where(.muda\:peer):disabled~*):after{content:var(--tw-content);background-color:var(--muda-color-secondary-light)}.muda\:first\:rounded-l-lg:first-child{border-top-left-radius:var(--muda-radius-lg);border-bottom-left-radius:var(--muda-radius-lg)}.muda\:first\:border-l:first-child{border-left-style:var(--tw-border-style);border-left-width:1px}.muda\:first\:pl-0:first-child{padding-left:0}.muda\:last\:rounded-r-lg:last-child{border-top-right-radius:var(--muda-radius-lg);border-bottom-right-radius:var(--muda-radius-lg)}.muda\:last\:border-0:last-child{border-style:var(--tw-border-style);border-width:0}.muda\:last\:border-r:last-child{border-right-style:var(--tw-border-style);border-right-width:1px}.muda\:last\:pr-0:last-child{padding-right:0}.muda\:last\:after\:hidden:last-child:after{content:var(--tw-content);display:none}.muda\:checked\:before\:content-\[attr\(data-checked\)\]:checked:before{--tw-content:attr(data-checked);content:var(--tw-content)}@media (hover:hover){.muda\:hover\:bg-danger:hover{background-color:var(--muda-color-danger)}.muda\:hover\:bg-danger-dark:hover{background-color:var(--muda-color-danger-dark)}.muda\:hover\:bg-info:hover{background-color:var(--muda-color-info)}.muda\:hover\:bg-info-dark:hover{background-color:var(--muda-color-info-dark)}.muda\:hover\:bg-primary:hover{background-color:var(--muda-color-primary)}.muda\:hover\:bg-primary-dark:hover{background-color:var(--muda-color-primary-dark)}.muda\:hover\:bg-primary-light:hover{background-color:var(--muda-color-primary-light)}.muda\:hover\:bg-secondary:hover{background-color:var(--muda-color-secondary)}.muda\:hover\:bg-secondary-dark:hover{background-color:var(--muda-color-secondary-dark)}.muda\:hover\:bg-secondary-light:hover{background-color:var(--muda-color-secondary-light)}.muda\:hover\:bg-success:hover{background-color:var(--muda-color-success)}.muda\:hover\:bg-success-dark:hover{background-color:var(--muda-color-success-dark)}.muda\:hover\:bg-warning:hover{background-color:var(--muda-color-warning)}.muda\:hover\:bg-warning-dark:hover{background-color:var(--muda-color-warning-dark)}.muda\:hover\:fill-primary-dark:hover{fill:var(--muda-color-primary-dark)}.muda\:hover\:fill-white:hover{fill:var(--muda-color-white)}.muda\:hover\:text-primary-dark:hover{color:var(--muda-color-primary-dark)}.muda\:hover\:text-white:hover{color:var(--muda-color-white)}}.muda\:focus\:z-20:focus{z-index:20}.muda\:focus\:rounded-md:focus{border-radius:var(--muda-radius-md)}.muda\:focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.muda\:focus\:ring-danger-light:focus{--tw-ring-color:var(--muda-color-danger-light)}.muda\:focus\:ring-primary:focus{--tw-ring-color:var(--muda-color-primary)}.muda\:focus\:ring-primary-light:focus{--tw-ring-color:var(--muda-color-primary-light)}.muda\:focus\:outline-hidden:focus{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.muda\:focus\:outline-hidden:focus{outline-offset:2px;outline:2px solid #0000}}.muda\:focus-visible\:bg-danger:focus-visible{background-color:var(--muda-color-danger)}.muda\:focus-visible\:bg-info:focus-visible{background-color:var(--muda-color-info)}.muda\:focus-visible\:bg-primary:focus-visible{background-color:var(--muda-color-primary)}.muda\:focus-visible\:bg-secondary:focus-visible{background-color:var(--muda-color-secondary)}.muda\:focus-visible\:bg-success:focus-visible{background-color:var(--muda-color-success)}.muda\:focus-visible\:bg-warning:focus-visible{background-color:var(--muda-color-warning)}.muda\:focus-visible\:outline-2:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px}.muda\:focus-visible\:outline-offset-2:focus-visible{outline-offset:2px}.muda\:disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.muda\:disabled\:border-danger-dark\/20:disabled{border-color:var(--muda-color-danger-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-danger-dark\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-danger-dark) 20%, transparent)}}.muda\:disabled\:border-info-dark\/20:disabled{border-color:var(--muda-color-info-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-info-dark\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-info-dark) 20%, transparent)}}.muda\:disabled\:border-primary-dark\/20:disabled{border-color:var(--muda-color-primary-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-primary-dark\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-primary-dark) 20%, transparent)}}.muda\:disabled\:border-secondary-dark\/20:disabled{border-color:var(--muda-color-secondary-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-secondary-dark\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-secondary-dark) 20%, transparent)}}.muda\:disabled\:border-success-dark\/20:disabled{border-color:var(--muda-color-success-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-success-dark\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-success-dark) 20%, transparent)}}.muda\:disabled\:border-warning-dark\/20:disabled{border-color:var(--muda-color-warning-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-warning-dark\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-warning-dark) 20%, transparent)}}.muda\:disabled\:bg-danger-light\/70:disabled{background-color:var(--muda-color-danger-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-danger-light\/70:disabled{background-color:color-mix(in oklab, var(--muda-color-danger-light) 70%, transparent)}}.muda\:disabled\:bg-info-light\/70:disabled{background-color:var(--muda-color-info-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-info-light\/70:disabled{background-color:color-mix(in oklab, var(--muda-color-info-light) 70%, transparent)}}.muda\:disabled\:bg-primary-light\/70:disabled{background-color:var(--muda-color-primary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-primary-light\/70:disabled{background-color:color-mix(in oklab, var(--muda-color-primary-light) 70%, transparent)}}.muda\:disabled\:bg-secondary-light:disabled,.muda\:disabled\:bg-secondary-light\/20:disabled{background-color:var(--muda-color-secondary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-secondary-light\/20:disabled{background-color:color-mix(in oklab, var(--muda-color-secondary-light) 20%, transparent)}}.muda\:disabled\:bg-secondary-light\/70:disabled{background-color:var(--muda-color-secondary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-secondary-light\/70:disabled{background-color:color-mix(in oklab, var(--muda-color-secondary-light) 70%, transparent)}}.muda\:disabled\:bg-success-light\/70:disabled{background-color:var(--muda-color-success-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-success-light\/70:disabled{background-color:color-mix(in oklab, var(--muda-color-success-light) 70%, transparent)}}.muda\:disabled\:bg-warning-light\/70:disabled{background-color:var(--muda-color-warning-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-warning-light\/70:disabled{background-color:color-mix(in oklab, var(--muda-color-warning-light) 70%, transparent)}}.muda\:disabled\:fill-secondary-light:disabled{fill:var(--muda-color-secondary-light)}.muda\:disabled\:text-secondary-light:disabled{color:var(--muda-color-secondary-light)}.muda\:disabled\:before\:text-secondary-light:disabled:before{content:var(--tw-content);color:var(--muda-color-secondary-light)}@media (hover:hover){.muda\:disabled\:hover\:bg-inherit:disabled:hover{background-color:inherit}.muda\:disabled\:hover\:bg-secondary-light:disabled:hover{background-color:var(--muda-color-secondary-light)}.muda\:disabled\:hover\:fill-secondary-light:disabled:hover{fill:var(--muda-color-secondary-light)}.muda\:disabled\:hover\:text-secondary-light:disabled:hover{color:var(--muda-color-secondary-light)}}@media (width>=64rem){.muda\:lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}.muda\:peer-checked\:rtl\:after\:-translate-x-full:is(:where(.muda\:peer):checked~*):where(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),[dir=rtl],[dir=rtl] *):after{content:var(--tw-content);--tw-translate-x:-100%;translate:var(--tw-translate-x) var(--tw-translate-y)}}[data-theme=dark]{--muda-color-background:#181818;--muda-color-foreground:#1e1e1e;--muda-color-form-background:#282828;--muda-color-primary:#1d4ed8;--muda-color-primary-light:#60a5fa;--muda-color-primary-dark:#1e3a8a;--muda-color-secondary:#78716c;--muda-color-secondary-light:#3c3c3c;--muda-color-secondary-dark:#bfbfbf;--muda-color-success:#84cc16;--muda-color-success-light:#d9f99d;--muda-color-success-dark:#4d7c0f;--muda-color-danger:#ef4444;--muda-color-danger-light:#fecaca;--muda-color-danger-dark:#b91c1c;--muda-color-warning:#f59e0b;--muda-color-warning-light:#fde68a;--muda-color-warning-dark:#b45309;--muda-color-info:#60a5fa;--muda-color-info-light:#dbeafe;--muda-color-info-dark:#3b82f6}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-content{syntax:"*";inherits:false;initial-value:""}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@keyframes spin{to{transform:rotate(360deg)}}
1
+ .muda-button-stack-h button:first-of-type{border-top-right-radius:0;border-bottom-right-radius:0}.muda-button-stack-h button:not(:first-of-type):not(:last-of-type){border-radius:0}.muda-button-stack-h button:last-of-type{border-top-left-radius:0;border-bottom-left-radius:0}.muda-button-stack-v button:first-of-type{border-bottom-right-radius:0;border-bottom-left-radius:0}.muda-button-stack-v button:not(:first-of-type):not(:last-of-type){border-radius:0}.muda-button-stack-v button:last-of-type{border-top-left-radius:0;border-top-right-radius:0}.color-picker-saturation[data-v-bdb328ef]{background-image:linear-gradient(#0000,#000),linear-gradient(90deg,#fff,#0000)}.color-picker-hue[data-v-bdb328ef]{background-image:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.muda-form-select[data-v-5c7dda51]:after{clip-path:polygon(100% 0%,0 0%,50% 100%)}@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial;--tw-content:"";--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-outline-style:solid}}}@layer theme{:root,:host{--muda-color-gray-400:oklch(70.7% .022 261.325);--muda-color-gray-500:oklch(55.1% .027 264.364);--muda-color-gray-600:oklch(44.6% .03 256.802);--muda-color-black:#000;--muda-color-white:#fff;--muda-spacing:.25rem;--muda-text-xs:.75rem;--muda-text-xs--line-height:calc(1 / .75);--muda-text-sm:.875rem;--muda-text-sm--line-height:calc(1.25 / .875);--muda-text-base:1rem;--muda-text-base--line-height:calc(1.5 / 1);--muda-text-lg:1.125rem;--muda-text-lg--line-height:calc(1.75 / 1.125);--muda-text-xl:1.25rem;--muda-text-xl--line-height:calc(1.75 / 1.25);--muda-text-2xl:1.5rem;--muda-text-2xl--line-height:calc(2 / 1.5);--muda-text-4xl:2.25rem;--muda-text-4xl--line-height:calc(2.5 / 2.25);--muda-font-weight-medium:500;--muda-font-weight-semibold:600;--muda-font-weight-bold:700;--muda-tracking-tight:-.025em;--muda-tracking-widest:.1em;--muda-radius-xs:.125rem;--muda-radius-sm:.25rem;--muda-radius-md:.375rem;--muda-radius-lg:.5rem;--muda-ease-out:cubic-bezier(0, 0, .2, 1);--muda-animate-spin:spin 1s linear infinite;--muda-blur-xs:4px;--muda-default-transition-duration:.15s;--muda-default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--muda-color-background:#f6f7f9;--muda-color-foreground:#fbfbfc;--muda-color-form-background:#eef1f4;--muda-color-primary:#6485b2;--muda-color-primary-light:#9db7d8;--muda-color-primary-dark:#435f87;--muda-color-secondary:#7c8999;--muda-color-secondary-light:#bbc3cd;--muda-color-secondary-dark:#4a586a;--muda-color-success:#5f9875;--muda-color-success-light:#9bc7ad;--muda-color-success-dark:#3f6e52;--muda-color-danger:#b86d6d;--muda-color-danger-light:#dda6a6;--muda-color-danger-dark:#844b4b;--muda-color-warning:#af8245;--muda-color-warning-light:#e4c384;--muda-color-warning-dark:#795b35;--muda-color-info:#61969b;--muda-color-info-light:#9cc9cd;--muda-color-info-dark:#416b71}}@layer base;@layer components{.muda-control-reset,.muda-button-reset{box-sizing:border-box;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;margin:0}.muda-control-reset::placeholder{opacity:1}textarea.muda-control-reset{resize:vertical}.muda-button-reset{background-color:#0000;border:none;padding:0}.muda-button-reset:not(:disabled){cursor:pointer}.muda-button-reset:disabled{cursor:not-allowed}.muda-link-reset{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}}@layer utilities{.muda\:pointer-events-none{pointer-events:none}.muda\:sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.muda\:absolute{position:absolute}.muda\:fixed{position:fixed}.muda\:relative{position:relative}.muda\:sticky{position:sticky}.muda\:inset-0{inset:0}.muda\:inset-y-0{inset-block:0}.muda\:top-0{top:0}.muda\:right-0{right:0}.muda\:right-2{right:calc(var(--muda-spacing) * 2)}.muda\:right-full{right:100%}.muda\:bottom-0{bottom:0}.muda\:left-0{left:0}.muda\:left-2{left:calc(var(--muda-spacing) * 2)}.muda\:left-full{left:100%}.muda\:isolate{isolation:isolate}.muda\:z-10{z-index:10}.muda\:z-100{z-index:100}.muda\:order-1{order:1}.muda\:order-2{order:2}.muda\:col-span-3{grid-column:span 3/span 3}.muda\:m-0{margin:0}.muda\:-mt-0\.5{margin-top:calc(var(--muda-spacing) * -.5)}.muda\:-mt-2\.75{margin-top:calc(var(--muda-spacing) * -2.75)}.muda\:mb-1{margin-bottom:var(--muda-spacing)}.muda\:-ml-0\.5{margin-left:calc(var(--muda-spacing) * -.5)}.muda\:no-scrollbar::-webkit-scrollbar{display:none}.muda\:no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.muda\:block{display:block}.muda\:flex{display:flex}.muda\:grid{display:grid}.muda\:hidden{display:none}.muda\:inline-block{display:inline-block}.muda\:inline-flex{display:inline-flex}.muda\:size-4{width:calc(var(--muda-spacing) * 4);height:calc(var(--muda-spacing) * 4)}.muda\:size-5{width:calc(var(--muda-spacing) * 5);height:calc(var(--muda-spacing) * 5)}.muda\:size-6{width:calc(var(--muda-spacing) * 6);height:calc(var(--muda-spacing) * 6)}.muda\:size-7{width:calc(var(--muda-spacing) * 7);height:calc(var(--muda-spacing) * 7)}.muda\:size-8{width:calc(var(--muda-spacing) * 8);height:calc(var(--muda-spacing) * 8)}.muda\:size-9{width:calc(var(--muda-spacing) * 9);height:calc(var(--muda-spacing) * 9)}.muda\:size-10{width:calc(var(--muda-spacing) * 10);height:calc(var(--muda-spacing) * 10)}.muda\:size-14{width:calc(var(--muda-spacing) * 14);height:calc(var(--muda-spacing) * 14)}.muda\:size-24{width:calc(var(--muda-spacing) * 24);height:calc(var(--muda-spacing) * 24)}.muda\:size-min{width:min-content;height:min-content}.muda\:h-4{height:calc(var(--muda-spacing) * 4)}.muda\:h-6{height:calc(var(--muda-spacing) * 6)}.muda\:h-10{height:calc(var(--muda-spacing) * 10)}.muda\:h-14{height:calc(var(--muda-spacing) * 14)}.muda\:h-125{height:calc(var(--muda-spacing) * 125)}.muda\:h-\[100px\]{height:100px}.muda\:h-\[380px\]{height:380px}.muda\:h-\[500px\]{height:500px}.muda\:h-full{height:100%}.muda\:h-max{height:max-content}.muda\:max-h-52{max-height:calc(var(--muda-spacing) * 52)}.muda\:max-h-60{max-height:calc(var(--muda-spacing) * 60)}.muda\:max-h-64{max-height:calc(var(--muda-spacing) * 64)}.muda\:max-h-80{max-height:calc(var(--muda-spacing) * 80)}.muda\:min-h-10{min-height:calc(var(--muda-spacing) * 10)}.muda\:min-h-50{min-height:calc(var(--muda-spacing) * 50)}.muda\:min-h-full{min-height:100%}.muda\:min-h-screen{min-height:100vh}.muda\:w-4{width:calc(var(--muda-spacing) * 4)}.muda\:w-11{width:calc(var(--muda-spacing) * 11)}.muda\:w-76{width:calc(var(--muda-spacing) * 76)}.muda\:w-80{width:calc(var(--muda-spacing) * 80)}.muda\:w-160{width:calc(var(--muda-spacing) * 160)}.muda\:w-full{width:100%}.muda\:w-max{width:max-content}.muda\:w-screen{width:100vw}.muda\:min-w-10{min-width:calc(var(--muda-spacing) * 10)}.muda\:flex-1{flex:1}.muda\:shrink-0{flex-shrink:0}.muda\:border-collapse{border-collapse:collapse}.muda\:-translate-x-2{--tw-translate-x:calc(var(--muda-spacing) * -2);translate:var(--tw-translate-x) var(--tw-translate-y)}.muda\:-translate-x-full{--tw-translate-x:-100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.muda\:translate-x-0{--tw-translate-x:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.muda\:translate-x-full{--tw-translate-x:100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.muda\:-translate-y-2{--tw-translate-y:calc(var(--muda-spacing) * -2);translate:var(--tw-translate-x) var(--tw-translate-y)}.muda\:animate-spin{animation:var(--muda-animate-spin)}.muda\:cursor-not-allowed{cursor:not-allowed}.muda\:cursor-pointer{cursor:pointer}.muda\:list-none{list-style-type:none}.muda\:appearance-none{appearance:none}.muda\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.muda\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.muda\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.muda\:grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}.muda\:grid-cols-\[1fr_auto\]{grid-template-columns:1fr auto}.muda\:grid-cols-\[6rem_repeat\(3\,minmax\(0\,1fr\)\)\]{grid-template-columns:6rem repeat(3,minmax(0,1fr))}.muda\:grid-cols-\[auto_1fr\]{grid-template-columns:auto 1fr}.muda\:grid-cols-\[repeat\(2\,1fr\)\]{grid-template-columns:repeat(2,1fr)}.muda\:grid-cols-\[repeat\(4\,1fr\)\]{grid-template-columns:repeat(4,1fr)}.muda\:grid-cols-\[repeat\(7\,auto\)\]{grid-template-columns:repeat(7,auto)}.muda\:flex-col{flex-direction:column}.muda\:flex-row{flex-direction:row}.muda\:items-center{align-items:center}.muda\:justify-center{justify-content:center}.muda\:justify-end{justify-content:flex-end}.muda\:justify-start{justify-content:flex-start}.muda\:gap-0\.5{gap:calc(var(--muda-spacing) * .5)}.muda\:gap-1{gap:var(--muda-spacing)}.muda\:gap-2{gap:calc(var(--muda-spacing) * 2)}.muda\:gap-4{gap:calc(var(--muda-spacing) * 4)}.muda\:gap-6{gap:calc(var(--muda-spacing) * 6)}.muda\:gap-8{gap:calc(var(--muda-spacing) * 8)}.muda\:gap-px{gap:1px}.muda\:scroll-container-v-form-background{background:linear-gradient(var(--muda-color-form-background) 30%, #fff0), linear-gradient(#fff0, var(--muda-color-form-background) 70%) 0 100%, radial-gradient(farthest-side at 50% 0, #0003, #0000), radial-gradient(farthest-side at 50% 100%, #0003, #0000) 0 100%;background-repeat:no-repeat;background-color:var(--muda-color-form-background);background-size:100% 40px,100% 40px,100% 14px,100% 14px;background-attachment:local,local,scroll,scroll;overflow:auto}.muda\:overflow-auto{overflow:auto}.muda\:overflow-hidden{overflow:hidden}.muda\:overflow-x-hidden{overflow-x:hidden}.muda\:overflow-y-auto{overflow-y:auto}.muda\:rounded-full{border-radius:2147483647px}.muda\:rounded-lg{border-radius:var(--muda-radius-lg)}.muda\:rounded-md{border-radius:var(--muda-radius-md)}.muda\:rounded-sm{border-radius:var(--muda-radius-sm)}.muda\:rounded-xs{border-radius:var(--muda-radius-xs)}.muda\:rounded-b-lg{border-bottom-right-radius:var(--muda-radius-lg);border-bottom-left-radius:var(--muda-radius-lg)}.muda\:border{border-style:var(--tw-border-style);border-width:1px}.muda\:border-2{border-style:var(--tw-border-style);border-width:2px}.muda\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.muda\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.muda\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.muda\:border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.muda\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.muda\:border-danger{border-color:var(--muda-color-danger)}.muda\:border-danger-dark{border-color:var(--muda-color-danger-dark)}.muda\:border-info{border-color:var(--muda-color-info)}.muda\:border-info-dark{border-color:var(--muda-color-info-dark)}.muda\:border-primary{border-color:var(--muda-color-primary)}.muda\:border-primary-dark{border-color:var(--muda-color-primary-dark)}.muda\:border-secondary{border-color:var(--muda-color-secondary)}.muda\:border-secondary-dark,.muda\:border-secondary-dark\/20{border-color:var(--muda-color-secondary-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:border-secondary-dark\/20{border-color:color-mix(in oklab, var(--muda-color-secondary-dark) 20%, transparent)}}.muda\:border-secondary-light{border-color:var(--muda-color-secondary-light)}.muda\:border-success{border-color:var(--muda-color-success)}.muda\:border-success-dark{border-color:var(--muda-color-success-dark)}.muda\:border-warning{border-color:var(--muda-color-warning)}.muda\:border-warning-dark{border-color:var(--muda-color-warning-dark)}.muda\:border-white{border-color:var(--muda-color-white)}.muda\:border-r-secondary-light{border-right-color:var(--muda-color-secondary-light)}.muda\:border-b-secondary-light{border-bottom-color:var(--muda-color-secondary-light)}.muda\:border-l-secondary-light{border-left-color:var(--muda-color-secondary-light)}.muda\:bg-background{background-color:var(--muda-color-background)}.muda\:bg-danger{background-color:var(--muda-color-danger)}.muda\:bg-danger-light{background-color:var(--muda-color-danger-light)}.muda\:bg-foreground{background-color:var(--muda-color-foreground)}.muda\:bg-form-background{background-color:var(--muda-color-form-background)}.muda\:bg-gray-500\/30{background-color:var(--muda-color-gray-500)}@supports (color:color-mix(in lab, red, red)){.muda\:bg-gray-500\/30{background-color:color-mix(in oklab, var(--muda-color-gray-500) 30%, transparent)}}.muda\:bg-info{background-color:var(--muda-color-info)}.muda\:bg-info-light{background-color:var(--muda-color-info-light)}.muda\:bg-primary{background-color:var(--muda-color-primary)}.muda\:bg-primary-light{background-color:var(--muda-color-primary-light)}.muda\:bg-secondary{background-color:var(--muda-color-secondary)}.muda\:bg-secondary-light,.muda\:bg-secondary-light\/70{background-color:var(--muda-color-secondary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:bg-secondary-light\/70{background-color:color-mix(in oklab, var(--muda-color-secondary-light) 70%, transparent)}}.muda\:bg-success{background-color:var(--muda-color-success)}.muda\:bg-success-light{background-color:var(--muda-color-success-light)}.muda\:bg-transparent{background-color:#0000}.muda\:bg-warning{background-color:var(--muda-color-warning)}.muda\:bg-warning-light{background-color:var(--muda-color-warning-light)}.muda\:fill-danger{fill:var(--muda-color-danger)}.muda\:fill-info{fill:var(--muda-color-info)}.muda\:fill-primary{fill:var(--muda-color-primary)}.muda\:fill-secondary{fill:var(--muda-color-secondary)}.muda\:fill-secondary-dark{fill:var(--muda-color-secondary-dark)}.muda\:fill-secondary-light\/30{fill:var(--muda-color-secondary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:fill-secondary-light\/30{fill:color-mix(in oklab, var(--muda-color-secondary-light) 30%, transparent)}}.muda\:fill-success{fill:var(--muda-color-success)}.muda\:fill-warning{fill:var(--muda-color-warning)}.muda\:fill-white{fill:var(--muda-color-white)}.muda\:fill-white\!{fill:var(--muda-color-white)!important}.muda\:p-0{padding:0}.muda\:p-2{padding:calc(var(--muda-spacing) * 2)}.muda\:p-4{padding:calc(var(--muda-spacing) * 4)}.muda\:p-5{padding:calc(var(--muda-spacing) * 5)}.muda\:p-10{padding:calc(var(--muda-spacing) * 10)}.muda\:px-2{padding-inline:calc(var(--muda-spacing) * 2)}.muda\:px-2\.5{padding-inline:calc(var(--muda-spacing) * 2.5)}.muda\:px-3{padding-inline:calc(var(--muda-spacing) * 3)}.muda\:px-3\.5{padding-inline:calc(var(--muda-spacing) * 3.5)}.muda\:px-4{padding-inline:calc(var(--muda-spacing) * 4)}.muda\:py-1{padding-block:var(--muda-spacing)}.muda\:py-1\.5{padding-block:calc(var(--muda-spacing) * 1.5)}.muda\:py-2{padding-block:calc(var(--muda-spacing) * 2)}.muda\:py-2\.5{padding-block:calc(var(--muda-spacing) * 2.5)}.muda\:py-3{padding-block:calc(var(--muda-spacing) * 3)}.muda\:py-4{padding-block:calc(var(--muda-spacing) * 4)}.muda\:py-5{padding-block:calc(var(--muda-spacing) * 5)}.muda\:py-6{padding-block:calc(var(--muda-spacing) * 6)}.muda\:pt-2\.5{padding-top:calc(var(--muda-spacing) * 2.5)}.muda\:pr-9{padding-right:calc(var(--muda-spacing) * 9)}.muda\:pl-9{padding-left:calc(var(--muda-spacing) * 9)}.muda\:text-center{text-align:center}.muda\:text-left{text-align:left}.muda\:text-2xl{font-size:var(--muda-text-2xl);line-height:var(--tw-leading,var(--muda-text-2xl--line-height))}.muda\:text-4xl{font-size:var(--muda-text-4xl);line-height:var(--tw-leading,var(--muda-text-4xl--line-height))}.muda\:text-base{font-size:var(--muda-text-base);line-height:var(--tw-leading,var(--muda-text-base--line-height))}.muda\:text-lg{font-size:var(--muda-text-lg);line-height:var(--tw-leading,var(--muda-text-lg--line-height))}.muda\:text-sm{font-size:var(--muda-text-sm);line-height:var(--tw-leading,var(--muda-text-sm--line-height))}.muda\:text-xs{font-size:var(--muda-text-xs);line-height:var(--tw-leading,var(--muda-text-xs--line-height))}.muda\:text-\[0\.7rem\]{font-size:.7rem}.muda\:leading-6{--tw-leading:calc(var(--muda-spacing) * 6);line-height:calc(var(--muda-spacing) * 6)}.muda\:font-bold{--tw-font-weight:var(--muda-font-weight-bold);font-weight:var(--muda-font-weight-bold)}.muda\:font-medium{--tw-font-weight:var(--muda-font-weight-medium);font-weight:var(--muda-font-weight-medium)}.muda\:font-semibold{--tw-font-weight:var(--muda-font-weight-semibold);font-weight:var(--muda-font-weight-semibold)}.muda\:tracking-tight{--tw-tracking:var(--muda-tracking-tight);letter-spacing:var(--muda-tracking-tight)}.muda\:tracking-widest{--tw-tracking:var(--muda-tracking-widest);letter-spacing:var(--muda-tracking-widest)}.muda\:wrap-break-word{overflow-wrap:break-word}.muda\:whitespace-nowrap{white-space:nowrap}.muda\:text-danger{color:var(--muda-color-danger)}.muda\:text-danger-dark{color:var(--muda-color-danger-dark)}.muda\:text-gray-600{color:var(--muda-color-gray-600)}.muda\:text-info{color:var(--muda-color-info)}.muda\:text-info-dark{color:var(--muda-color-info-dark)}.muda\:text-primary{color:var(--muda-color-primary)}.muda\:text-primary-dark{color:var(--muda-color-primary-dark)}.muda\:text-secondary{color:var(--muda-color-secondary)}.muda\:text-secondary-dark{color:var(--muda-color-secondary-dark)}.muda\:text-secondary-light{color:var(--muda-color-secondary-light)}.muda\:text-success{color:var(--muda-color-success)}.muda\:text-success-dark{color:var(--muda-color-success-dark)}.muda\:text-warning{color:var(--muda-color-warning)}.muda\:text-warning-dark{color:var(--muda-color-warning-dark)}.muda\:text-white{color:var(--muda-color-white)}.muda\:uppercase{text-transform:uppercase}.muda\:opacity-0{opacity:0}.muda\:shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.muda\:shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.muda\:shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.muda\:ring-1{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.muda\:shadow-gray-400{--tw-shadow-color:var(--muda-color-gray-400)}@supports (color:color-mix(in lab, red, red)){.muda\:shadow-gray-400{--tw-shadow-color:color-mix(in oklab, var(--muda-color-gray-400) var(--tw-shadow-alpha), transparent)}}.muda\:ring-danger{--tw-ring-color:var(--muda-color-danger)}.muda\:ring-danger-dark\/20{--tw-ring-color:var(--muda-color-danger-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:ring-danger-dark\/20{--tw-ring-color:color-mix(in oklab, var(--muda-color-danger-dark) 20%, transparent)}}.muda\:ring-info-dark\/20{--tw-ring-color:var(--muda-color-info-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:ring-info-dark\/20{--tw-ring-color:color-mix(in oklab, var(--muda-color-info-dark) 20%, transparent)}}.muda\:ring-primary-dark\/20{--tw-ring-color:var(--muda-color-primary-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:ring-primary-dark\/20{--tw-ring-color:color-mix(in oklab, var(--muda-color-primary-dark) 20%, transparent)}}.muda\:ring-secondary-dark\/20{--tw-ring-color:var(--muda-color-secondary-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:ring-secondary-dark\/20{--tw-ring-color:color-mix(in oklab, var(--muda-color-secondary-dark) 20%, transparent)}}.muda\:ring-secondary-light{--tw-ring-color:var(--muda-color-secondary-light)}.muda\:ring-success-dark\/20{--tw-ring-color:var(--muda-color-success-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:ring-success-dark\/20{--tw-ring-color:color-mix(in oklab, var(--muda-color-success-dark) 20%, transparent)}}.muda\:ring-warning-dark\/20{--tw-ring-color:var(--muda-color-warning-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:ring-warning-dark\/20{--tw-ring-color:color-mix(in oklab, var(--muda-color-warning-dark) 20%, transparent)}}.muda\:outline-hidden{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.muda\:outline-hidden{outline-offset:2px;outline:2px solid #0000}}.muda\:backdrop-blur-xs{--tw-backdrop-blur:blur(var(--muda-blur-xs));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.muda\:transition-\[width\]{transition-property:width;transition-timing-function:var(--tw-ease,var(--muda-default-transition-timing-function));transition-duration:var(--tw-duration,var(--muda-default-transition-duration))}.muda\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--muda-default-transition-timing-function));transition-duration:var(--tw-duration,var(--muda-default-transition-duration))}.muda\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--muda-default-transition-timing-function));transition-duration:var(--tw-duration,var(--muda-default-transition-duration))}.muda\:duration-100{--tw-duration:.1s;transition-duration:.1s}.muda\:duration-300{--tw-duration:.3s;transition-duration:.3s}.muda\:ease-linear{--tw-ease:linear;transition-timing-function:linear}.muda\:ease-out{--tw-ease:var(--muda-ease-out);transition-timing-function:var(--muda-ease-out)}.muda\:select-none{-webkit-user-select:none;user-select:none}.muda\:ring-inset{--tw-ring-inset:inset}.muda\:peer-checked\:bg-primary:is(:where(.muda\:peer):checked~*){background-color:var(--muda-color-primary)}.muda\:peer-focus\:ring-2:is(:where(.muda\:peer):focus~*){--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.muda\:peer-focus\:ring-primary-light:is(:where(.muda\:peer):focus~*){--tw-ring-color:var(--muda-color-primary-light)}.muda\:peer-focus\:outline-hidden:is(:where(.muda\:peer):focus~*){--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.muda\:peer-focus\:outline-hidden:is(:where(.muda\:peer):focus~*){outline-offset:2px;outline:2px solid #0000}}.muda\:peer-disabled\:bg-secondary-light\/70:is(:where(.muda\:peer):disabled~*){background-color:var(--muda-color-secondary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:peer-disabled\:bg-secondary-light\/70:is(:where(.muda\:peer):disabled~*){background-color:color-mix(in oklab, var(--muda-color-secondary-light) 70%, transparent)}}.muda\:peer-disabled\:ring-secondary-dark\/20:is(:where(.muda\:peer):disabled~*){--tw-ring-color:var(--muda-color-secondary-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:peer-disabled\:ring-secondary-dark\/20:is(:where(.muda\:peer):disabled~*){--tw-ring-color:color-mix(in oklab, var(--muda-color-secondary-dark) 20%, transparent)}}.muda\:placeholder\:text-danger-light::placeholder{color:var(--muda-color-danger-light)}.muda\:placeholder\:text-secondary-light::placeholder{color:var(--muda-color-secondary-light)}.muda\:before\:absolute:before{content:var(--tw-content);position:absolute}.muda\:before\:top-0:before{content:var(--tw-content);top:0}.muda\:before\:-right-2:before{content:var(--tw-content);right:calc(var(--muda-spacing) * -2)}.muda\:before\:right-0:before{content:var(--tw-content);right:0}.muda\:before\:bottom-0:before{content:var(--tw-content);bottom:0}.muda\:before\:-left-2:before{content:var(--tw-content);left:calc(var(--muda-spacing) * -2)}.muda\:before\:left-0:before{content:var(--tw-content);left:0}.muda\:before\:z-50:before{content:var(--tw-content);z-index:50}.muda\:before\:flex:before{content:var(--tw-content);display:flex}.muda\:before\:w-2:before{content:var(--tw-content);width:calc(var(--muda-spacing) * 2)}.muda\:before\:items-center:before{content:var(--tw-content);align-items:center}.muda\:before\:justify-center:before{content:var(--tw-content);justify-content:center}.muda\:before\:bg-linear-to-l:before{content:var(--tw-content);--tw-gradient-position:to left}@supports (background-image:linear-gradient(in lab, red, red)){.muda\:before\:bg-linear-to-l:before{--tw-gradient-position:to left in oklab}}.muda\:before\:bg-linear-to-l:before{background-image:linear-gradient(var(--tw-gradient-stops))}.muda\:before\:bg-linear-to-r:before{content:var(--tw-content);--tw-gradient-position:to right}@supports (background-image:linear-gradient(in lab, red, red)){.muda\:before\:bg-linear-to-r:before{--tw-gradient-position:to right in oklab}}.muda\:before\:bg-linear-to-r:before{background-image:linear-gradient(var(--tw-gradient-stops))}.muda\:before\:from-black:before{content:var(--tw-content);--tw-gradient-from:var(--muda-color-black);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.muda\:before\:text-lg:before{content:var(--tw-content);font-size:var(--muda-text-lg);line-height:var(--tw-leading,var(--muda-text-lg--line-height))}.muda\:before\:text-sm:before{content:var(--tw-content);font-size:var(--muda-text-sm);line-height:var(--tw-leading,var(--muda-text-sm--line-height))}.muda\:before\:text-xl:before{content:var(--tw-content);font-size:var(--muda-text-xl);line-height:var(--tw-leading,var(--muda-text-xl--line-height))}.muda\:before\:text-xs:before{content:var(--tw-content);font-size:var(--muda-text-xs);line-height:var(--tw-leading,var(--muda-text-xs--line-height))}.muda\:before\:font-bold:before{content:var(--tw-content);--tw-font-weight:var(--muda-font-weight-bold);font-weight:var(--muda-font-weight-bold)}.muda\:before\:text-primary:before{content:var(--tw-content);color:var(--muda-color-primary)}.muda\:before\:opacity-10:before{content:var(--tw-content);opacity:.1}.muda\:before\:content-\[\\\'\\\'\]:before{--tw-content:\'\';content:var(--tw-content)}.muda\:after\:pointer-events-none:after{content:var(--tw-content);pointer-events:none}.muda\:after\:absolute:after{content:var(--tw-content);position:absolute}.muda\:after\:start-0\.5:after{content:var(--tw-content);inset-inline-start:calc(var(--muda-spacing) * .5)}.muda\:after\:top-0:after{content:var(--tw-content);top:0}.muda\:after\:top-0\.5:after{content:var(--tw-content);top:calc(var(--muda-spacing) * .5)}.muda\:after\:top-4:after{content:var(--tw-content);top:calc(var(--muda-spacing) * 4)}.muda\:after\:right-0:after{content:var(--tw-content);right:0}.muda\:after\:right-4:after{content:var(--tw-content);right:calc(var(--muda-spacing) * 4)}.muda\:after\:bottom-0:after{content:var(--tw-content);bottom:0}.muda\:after\:left-0:after{content:var(--tw-content);left:0}.muda\:after\:block:after{content:var(--tw-content);display:block}.muda\:after\:h-2:after{content:var(--tw-content);height:calc(var(--muda-spacing) * 2)}.muda\:after\:h-5:after{content:var(--tw-content);height:calc(var(--muda-spacing) * 5)}.muda\:after\:w-3:after{content:var(--tw-content);width:calc(var(--muda-spacing) * 3)}.muda\:after\:w-5:after{content:var(--tw-content);width:calc(var(--muda-spacing) * 5)}.muda\:after\:w-px:after{content:var(--tw-content);width:1px}.muda\:after\:rounded-full:after{content:var(--tw-content);border-radius:2147483647px}.muda\:after\:rounded-lg:after{content:var(--tw-content);border-radius:var(--muda-radius-lg)}.muda\:after\:border-2:after{content:var(--tw-content);border-style:var(--tw-border-style);border-width:2px}.muda\:after\:border-primary:after{content:var(--tw-content);border-color:var(--muda-color-primary)}.muda\:after\:bg-primary:after{content:var(--tw-content);background-color:var(--muda-color-primary)}.muda\:after\:bg-secondary-light:after,.muda\:after\:bg-secondary-light\/20:after{content:var(--tw-content);background-color:var(--muda-color-secondary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:after\:bg-secondary-light\/20:after{background-color:color-mix(in oklab, var(--muda-color-secondary-light) 20%, transparent)}}.muda\:after\:transition-all:after{content:var(--tw-content);transition-property:all;transition-timing-function:var(--tw-ease,var(--muda-default-transition-timing-function));transition-duration:var(--tw-duration,var(--muda-default-transition-duration))}.muda\:after\:content-\[\\\'\\\'\]:after{--tw-content:\'\';content:var(--tw-content)}.muda\:peer-checked\:after\:translate-x-full:is(:where(.muda\:peer):checked~*):after{content:var(--tw-content);--tw-translate-x:100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.muda\:peer-checked\:after\:bg-form-background:is(:where(.muda\:peer):checked~*):after{content:var(--tw-content);background-color:var(--muda-color-form-background)}.muda\:peer-disabled\:after\:bg-secondary-light:is(:where(.muda\:peer):disabled~*):after{content:var(--tw-content);background-color:var(--muda-color-secondary-light)}.muda\:first\:rounded-l-lg:first-child{border-top-left-radius:var(--muda-radius-lg);border-bottom-left-radius:var(--muda-radius-lg)}.muda\:first\:border-l:first-child{border-left-style:var(--tw-border-style);border-left-width:1px}.muda\:first\:pl-0:first-child{padding-left:0}.muda\:last\:rounded-r-lg:last-child{border-top-right-radius:var(--muda-radius-lg);border-bottom-right-radius:var(--muda-radius-lg)}.muda\:last\:border-0:last-child{border-style:var(--tw-border-style);border-width:0}.muda\:last\:border-r:last-child{border-right-style:var(--tw-border-style);border-right-width:1px}.muda\:last\:pr-0:last-child{padding-right:0}.muda\:last\:after\:hidden:last-child:after{content:var(--tw-content);display:none}.muda\:checked\:before\:content-\[attr\(data-checked\)\]:checked:before{--tw-content:attr(data-checked);content:var(--tw-content)}@media (hover:hover){.muda\:hover\:bg-danger:hover{background-color:var(--muda-color-danger)}.muda\:hover\:bg-danger-dark:hover{background-color:var(--muda-color-danger-dark)}.muda\:hover\:bg-info:hover{background-color:var(--muda-color-info)}.muda\:hover\:bg-info-dark:hover{background-color:var(--muda-color-info-dark)}.muda\:hover\:bg-primary:hover{background-color:var(--muda-color-primary)}.muda\:hover\:bg-primary-dark:hover{background-color:var(--muda-color-primary-dark)}.muda\:hover\:bg-primary-light:hover{background-color:var(--muda-color-primary-light)}.muda\:hover\:bg-secondary:hover{background-color:var(--muda-color-secondary)}.muda\:hover\:bg-secondary-dark:hover{background-color:var(--muda-color-secondary-dark)}.muda\:hover\:bg-secondary-light:hover{background-color:var(--muda-color-secondary-light)}.muda\:hover\:bg-success:hover{background-color:var(--muda-color-success)}.muda\:hover\:bg-success-dark:hover{background-color:var(--muda-color-success-dark)}.muda\:hover\:bg-warning:hover{background-color:var(--muda-color-warning)}.muda\:hover\:bg-warning-dark:hover{background-color:var(--muda-color-warning-dark)}.muda\:hover\:fill-primary-dark:hover{fill:var(--muda-color-primary-dark)}.muda\:hover\:fill-primary-light:hover{fill:var(--muda-color-primary-light)}.muda\:hover\:fill-white:hover{fill:var(--muda-color-white)}.muda\:hover\:text-primary-dark:hover{color:var(--muda-color-primary-dark)}.muda\:hover\:text-primary-light:hover{color:var(--muda-color-primary-light)}.muda\:hover\:text-white:hover{color:var(--muda-color-white)}}.muda\:focus\:z-20:focus{z-index:20}.muda\:focus\:rounded-md:focus{border-radius:var(--muda-radius-md)}.muda\:focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.muda\:focus\:ring-danger-light:focus{--tw-ring-color:var(--muda-color-danger-light)}.muda\:focus\:ring-primary:focus{--tw-ring-color:var(--muda-color-primary)}.muda\:focus\:ring-primary-light:focus{--tw-ring-color:var(--muda-color-primary-light)}.muda\:focus\:outline-hidden:focus{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.muda\:focus\:outline-hidden:focus{outline-offset:2px;outline:2px solid #0000}}.muda\:focus-visible\:bg-danger:focus-visible{background-color:var(--muda-color-danger)}.muda\:focus-visible\:bg-info:focus-visible{background-color:var(--muda-color-info)}.muda\:focus-visible\:bg-primary:focus-visible{background-color:var(--muda-color-primary)}.muda\:focus-visible\:bg-secondary:focus-visible{background-color:var(--muda-color-secondary)}.muda\:focus-visible\:bg-success:focus-visible{background-color:var(--muda-color-success)}.muda\:focus-visible\:bg-warning:focus-visible{background-color:var(--muda-color-warning)}.muda\:focus-visible\:outline-2:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px}.muda\:focus-visible\:outline-offset-2:focus-visible{outline-offset:2px}@media (hover:hover){.muda\:enabled\:hover\:bg-danger:enabled:hover{background-color:var(--muda-color-danger)}.muda\:enabled\:hover\:bg-info:enabled:hover{background-color:var(--muda-color-info)}.muda\:enabled\:hover\:bg-primary:enabled:hover{background-color:var(--muda-color-primary)}.muda\:enabled\:hover\:bg-secondary:enabled:hover{background-color:var(--muda-color-secondary)}.muda\:enabled\:hover\:bg-success:enabled:hover{background-color:var(--muda-color-success)}.muda\:enabled\:hover\:bg-warning:enabled:hover{background-color:var(--muda-color-warning)}.muda\:enabled\:hover\:fill-white:enabled:hover{fill:var(--muda-color-white)}.muda\:enabled\:hover\:text-danger-dark:enabled:hover{color:var(--muda-color-danger-dark)}.muda\:enabled\:hover\:text-info-dark:enabled:hover{color:var(--muda-color-info-dark)}.muda\:enabled\:hover\:text-primary-dark:enabled:hover{color:var(--muda-color-primary-dark)}.muda\:enabled\:hover\:text-secondary-dark:enabled:hover{color:var(--muda-color-secondary-dark)}.muda\:enabled\:hover\:text-success-dark:enabled:hover{color:var(--muda-color-success-dark)}.muda\:enabled\:hover\:text-warning-dark:enabled:hover{color:var(--muda-color-warning-dark)}.muda\:enabled\:hover\:text-white:enabled:hover{color:var(--muda-color-white)}}.muda\:disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.muda\:disabled\:border-danger-dark\/20:disabled{border-color:var(--muda-color-danger-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-danger-dark\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-danger-dark) 20%, transparent)}}.muda\:disabled\:border-danger\/20:disabled{border-color:var(--muda-color-danger)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-danger\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-danger) 20%, transparent)}}.muda\:disabled\:border-info-dark\/20:disabled{border-color:var(--muda-color-info-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-info-dark\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-info-dark) 20%, transparent)}}.muda\:disabled\:border-info\/20:disabled{border-color:var(--muda-color-info)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-info\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-info) 20%, transparent)}}.muda\:disabled\:border-primary-dark\/20:disabled{border-color:var(--muda-color-primary-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-primary-dark\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-primary-dark) 20%, transparent)}}.muda\:disabled\:border-primary\/20:disabled{border-color:var(--muda-color-primary)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-primary\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-primary) 20%, transparent)}}.muda\:disabled\:border-secondary-dark\/20:disabled{border-color:var(--muda-color-secondary-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-secondary-dark\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-secondary-dark) 20%, transparent)}}.muda\:disabled\:border-secondary\/20:disabled{border-color:var(--muda-color-secondary)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-secondary\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-secondary) 20%, transparent)}}.muda\:disabled\:border-success-dark\/20:disabled{border-color:var(--muda-color-success-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-success-dark\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-success-dark) 20%, transparent)}}.muda\:disabled\:border-success\/20:disabled{border-color:var(--muda-color-success)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-success\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-success) 20%, transparent)}}.muda\:disabled\:border-warning-dark\/20:disabled{border-color:var(--muda-color-warning-dark)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-warning-dark\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-warning-dark) 20%, transparent)}}.muda\:disabled\:border-warning\/20:disabled{border-color:var(--muda-color-warning)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:border-warning\/20:disabled{border-color:color-mix(in oklab, var(--muda-color-warning) 20%, transparent)}}.muda\:disabled\:bg-danger-light\/70:disabled{background-color:var(--muda-color-danger-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-danger-light\/70:disabled{background-color:color-mix(in oklab, var(--muda-color-danger-light) 70%, transparent)}}.muda\:disabled\:bg-info-light\/70:disabled{background-color:var(--muda-color-info-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-info-light\/70:disabled{background-color:color-mix(in oklab, var(--muda-color-info-light) 70%, transparent)}}.muda\:disabled\:bg-primary-light\/70:disabled{background-color:var(--muda-color-primary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-primary-light\/70:disabled{background-color:color-mix(in oklab, var(--muda-color-primary-light) 70%, transparent)}}.muda\:disabled\:bg-secondary-light:disabled,.muda\:disabled\:bg-secondary-light\/20:disabled{background-color:var(--muda-color-secondary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-secondary-light\/20:disabled{background-color:color-mix(in oklab, var(--muda-color-secondary-light) 20%, transparent)}}.muda\:disabled\:bg-secondary-light\/70:disabled{background-color:var(--muda-color-secondary-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-secondary-light\/70:disabled{background-color:color-mix(in oklab, var(--muda-color-secondary-light) 70%, transparent)}}.muda\:disabled\:bg-success-light\/70:disabled{background-color:var(--muda-color-success-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-success-light\/70:disabled{background-color:color-mix(in oklab, var(--muda-color-success-light) 70%, transparent)}}.muda\:disabled\:bg-warning-light\/70:disabled{background-color:var(--muda-color-warning-light)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:bg-warning-light\/70:disabled{background-color:color-mix(in oklab, var(--muda-color-warning-light) 70%, transparent)}}.muda\:disabled\:fill-secondary-light:disabled{fill:var(--muda-color-secondary-light)}.muda\:disabled\:text-danger\/40:disabled{color:var(--muda-color-danger)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:text-danger\/40:disabled{color:color-mix(in oklab, var(--muda-color-danger) 40%, transparent)}}.muda\:disabled\:text-info\/40:disabled{color:var(--muda-color-info)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:text-info\/40:disabled{color:color-mix(in oklab, var(--muda-color-info) 40%, transparent)}}.muda\:disabled\:text-primary\/40:disabled{color:var(--muda-color-primary)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:text-primary\/40:disabled{color:color-mix(in oklab, var(--muda-color-primary) 40%, transparent)}}.muda\:disabled\:text-secondary-light:disabled{color:var(--muda-color-secondary-light)}.muda\:disabled\:text-secondary\/40:disabled{color:var(--muda-color-secondary)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:text-secondary\/40:disabled{color:color-mix(in oklab, var(--muda-color-secondary) 40%, transparent)}}.muda\:disabled\:text-success\/40:disabled{color:var(--muda-color-success)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:text-success\/40:disabled{color:color-mix(in oklab, var(--muda-color-success) 40%, transparent)}}.muda\:disabled\:text-warning\/40:disabled{color:var(--muda-color-warning)}@supports (color:color-mix(in lab, red, red)){.muda\:disabled\:text-warning\/40:disabled{color:color-mix(in oklab, var(--muda-color-warning) 40%, transparent)}}.muda\:disabled\:before\:text-secondary-light:disabled:before{content:var(--tw-content);color:var(--muda-color-secondary-light)}@media (hover:hover){.muda\:disabled\:hover\:bg-inherit:disabled:hover{background-color:inherit}.muda\:disabled\:hover\:bg-secondary-light:disabled:hover{background-color:var(--muda-color-secondary-light)}.muda\:disabled\:hover\:fill-secondary-light:disabled:hover{fill:var(--muda-color-secondary-light)}.muda\:disabled\:hover\:text-secondary-light:disabled:hover{color:var(--muda-color-secondary-light)}}@media (width>=64rem){.muda\:lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}.muda\:peer-checked\:rtl\:after\:-translate-x-full:is(:where(.muda\:peer):checked~*):where(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),[dir=rtl],[dir=rtl] *):after{content:var(--tw-content);--tw-translate-x:-100%;translate:var(--tw-translate-x) var(--tw-translate-y)}}[data-theme=dark]{--muda-color-background:#181d26;--muda-color-foreground:#202733;--muda-color-form-background:#2a3340;--muda-color-primary:#6485b2;--muda-color-primary-light:#9db7d8;--muda-color-primary-dark:#435f87;--muda-color-secondary:#bbc3cd;--muda-color-secondary-light:#3b4656;--muda-color-secondary-dark:#e1e5ea;--muda-color-success:#5f9875;--muda-color-success-light:#9bc7ad;--muda-color-success-dark:#3f6e52;--muda-color-danger:#b86d6d;--muda-color-danger-light:#dda6a6;--muda-color-danger-dark:#844b4b;--muda-color-warning:#af8245;--muda-color-warning-light:#e4c384;--muda-color-warning-dark:#795b35;--muda-color-info:#61969b;--muda-color-info-light:#9cc9cd;--muda-color-info-dark:#416b71}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-content{syntax:"*";inherits:false;initial-value:""}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@keyframes spin{to{transform:rotate(360deg)}}
2
2
  /*$vite$:1*/
@@ -0,0 +1,12 @@
1
+ import { onUnmounted as e, watch as t } from "vue";
2
+ //#region src/composables/useBodyScrollLock.ts
3
+ var n = 0, r = "", i = (i) => {
4
+ let a = !1, o = () => {
5
+ a || typeof document > "u" || (n === 0 && (r = document.body.style.overflow, document.body.style.overflow = "hidden"), n += 1, a = !0);
6
+ }, s = () => {
7
+ !a || typeof document > "u" || (--n, a = !1, n === 0 && (document.body.style.overflow = r));
8
+ };
9
+ t(i, (e) => e ? o() : s(), { immediate: !0 }), e(s);
10
+ };
11
+ //#endregion
12
+ export { i as t };
@@ -0,0 +1,14 @@
1
+ import { onUnmounted as e, ref as t, watch as n } from "vue";
2
+ //#region src/composables/useResizeObserver.ts
3
+ var r = (r, i) => {
4
+ let a = t(!1), o = new ResizeObserver((e) => {
5
+ for (let t of e) i(t);
6
+ });
7
+ e(() => {
8
+ r.value != null && (o.unobserve(r.value), o.disconnect(), a.value = !1);
9
+ }), n(r, (e) => {
10
+ a.value || e != null && (o.observe(e), a.value = !0);
11
+ }, { immediate: !0 });
12
+ };
13
+ //#endregion
14
+ export { r as t };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mudakit/ui",
3
- "version": "0.3.0",
3
+ "version": "0.5.0",
4
4
  "description": "Vue components for Muda",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -34,6 +34,11 @@
34
34
  "import": "./dist/index.js",
35
35
  "default": "./dist/index.js"
36
36
  },
37
+ "./composables": {
38
+ "types": "./dist/composables/index.d.ts",
39
+ "import": "./dist/composables/index.js",
40
+ "default": "./dist/composables/index.js"
41
+ },
37
42
  "./Muda*": {
38
43
  "types": "./dist/components/Muda*/index.d.ts",
39
44
  "import": "./dist/components/Muda*/index.js",
@@ -1,43 +0,0 @@
1
- import { createBlock as e, defineComponent as t, mergeProps as n, openBlock as r, renderSlot as i, resolveDynamicComponent as a, withCtx as o } from "vue";
2
- //#endregion
3
- //#region src/components/MudaButton/MudaButton.vue
4
- var s = /* @__PURE__ */ t({
5
- __name: "MudaButton",
6
- props: {
7
- size: { default: "medium" },
8
- variant: { default: "default" },
9
- disabled: {
10
- type: Boolean,
11
- default: !1
12
- },
13
- as: { default: "button" }
14
- },
15
- setup(t) {
16
- let s = t;
17
- return (t, c) => (r(), e(a(s.as), n(t.$attrs, {
18
- disabled: s.disabled,
19
- class: ["muda:flex muda:items-center muda:justify-center muda:gap-1 muda:focus-visible:outline-2 muda:focus-visible:outline-offset-2", {
20
- "muda-link-reset": s.as === "a",
21
- "muda-button-reset": s.as === "button",
22
- "muda:rounded-md muda:font-semibold muda:shadow-xs": !0,
23
- "muda:px-2.5 muda:py-1.5 muda:text-xs": s.size === "small",
24
- "muda:px-3 muda:py-2 muda:text-sm": s.size === "medium",
25
- "muda:px-3.5 muda:py-2.5 muda:text-sm": s.size === "large",
26
- "muda:cursor-pointer": !s.disabled,
27
- "muda:cursor-not-allowed": s.disabled,
28
- "muda:border muda:border-secondary-light muda:bg-form-background": s.variant === "default",
29
- "muda:border muda:border-primary-dark muda:bg-primary muda:fill-white muda:text-white muda:hover:bg-primary-dark muda:focus-visible:bg-primary muda:disabled:border-primary-dark/20 muda:disabled:bg-primary-light/70": s.variant === "primary",
30
- "muda:border muda:border-secondary-dark muda:bg-secondary muda:fill-white muda:text-white muda:hover:bg-secondary-dark muda:focus-visible:bg-secondary muda:disabled:border-secondary-dark/20 muda:disabled:bg-secondary-light/70": s.variant === "secondary",
31
- "muda:border muda:border-success-dark muda:bg-success muda:fill-white muda:text-white muda:hover:bg-success-dark muda:focus-visible:bg-success muda:disabled:border-success-dark/20 muda:disabled:bg-success-light/70": s.variant === "success",
32
- "muda:border muda:border-warning-dark muda:bg-warning muda:fill-white muda:text-white muda:hover:bg-warning-dark muda:focus-visible:bg-warning muda:disabled:border-warning-dark/20 muda:disabled:bg-warning-light/70": s.variant === "warning",
33
- "muda:border muda:border-danger-dark muda:bg-danger muda:fill-white muda:text-white muda:hover:bg-danger-dark muda:focus-visible:bg-danger muda:disabled:border-danger-dark/20 muda:disabled:bg-danger-light/70": s.variant === "danger",
34
- "muda:border muda:border-info-dark muda:bg-info muda:fill-white muda:text-white muda:hover:bg-info-dark muda:focus-visible:bg-info muda:disabled:border-info-dark/20 muda:disabled:bg-info-light/70": s.variant === "info"
35
- }]
36
- }), {
37
- default: o(() => [i(t.$slots, "default")]),
38
- _: 3
39
- }, 16, ["disabled", "class"]));
40
- }
41
- });
42
- //#endregion
43
- export { s as t };
@@ -1,61 +0,0 @@
1
- import { t as e } from "./keymap-BzfMgdJH.js";
2
- import { t } from "./useZIndex-DWnsohLZ.js";
3
- import { t as n } from "./useKeyDown-B1jmp4nA.js";
4
- import { t as r } from "./MudaFocusTrap-CGlvV_MC.js";
5
- import { Teleport as i, Transition as a, createBlock as o, createCommentVNode as s, createElementVNode as c, createVNode as l, defineComponent as u, mergeProps as d, normalizeStyle as f, onUnmounted as p, openBlock as m, renderSlot as h, unref as g, useModel as _, useTemplateRef as v, watch as y, withCtx as b, withModifiers as x } from "vue";
6
- //#region src/composables/useBodyScrollLock.ts
7
- var S = 0, C = "", w = (e) => {
8
- let t = !1, n = () => {
9
- t || typeof document > "u" || (S === 0 && (C = document.body.style.overflow, document.body.style.overflow = "hidden"), S += 1, t = !0);
10
- }, r = () => {
11
- !t || typeof document > "u" || (--S, t = !1, S === 0 && (document.body.style.overflow = C));
12
- };
13
- y(e, (e) => e ? n() : r(), { immediate: !0 }), p(r);
14
- }, T = { class: "muda:fixed muda:inset-0 muda:w-screen muda:overflow-y-auto muda:py-6" }, E = { class: "muda:flex muda:min-h-full muda:items-center muda:justify-center" }, D = /* @__PURE__ */ u({
15
- inheritAttrs: !1,
16
- __name: "MudaDialog",
17
- props: {
18
- modelValue: {
19
- type: Boolean,
20
- required: !0
21
- },
22
- modelModifiers: {}
23
- },
24
- emits: ["update:modelValue"],
25
- setup(u) {
26
- let p = _(u, "modelValue"), y = v("dialog"), S = t();
27
- w(p), n((t) => {
28
- if (p.value) switch (t.key) {
29
- case e.Escape: p.value = !1, t.preventDefault();
30
- }
31
- });
32
- let C = (e) => {
33
- y.value?.contains(e.target) || (p.value = !1);
34
- };
35
- return (e, t) => (m(), o(i, { to: "body" }, [l(a, {
36
- "enter-active-class": "muda:transition-opacity muda:ease-linear muda:duration-100",
37
- "leave-active-class": "muda:transition-opacity muda:ease-linear muda:duration-100",
38
- "enter-from-class": "muda:opacity-0",
39
- "leave-to-class": "muda:opacity-0"
40
- }, {
41
- default: b(() => [p.value ? (m(), o(g(r), {
42
- key: 0,
43
- role: "dialog",
44
- class: "muda:fixed muda:inset-0 muda:bg-gray-500/30 muda:backdrop-blur-xs muda:transition-opacity",
45
- style: f({ zIndex: g(S) }),
46
- onClickCapture: C,
47
- onWheel: t[0] ||= x(() => {}, ["stop"])
48
- }, {
49
- default: b(() => [c("div", T, [c("div", E, [c("div", d(e.$attrs, {
50
- class: "muda:rounded-lg muda:bg-background muda:p-4 muda:focus:outline-hidden",
51
- tabindex: "0",
52
- ref: "dialog"
53
- }), [h(e.$slots, "default")], 16)])])]),
54
- _: 3
55
- }, 8, ["style"])) : s("", !0)]),
56
- _: 3
57
- })]));
58
- }
59
- });
60
- //#endregion
61
- export { D as t };