iryx-ui 0.10.2 → 0.12.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 (54) hide show
  1. package/README.md +593 -496
  2. package/dist/component-names.d.ts +1 -1
  3. package/dist/component-names.js +1 -1
  4. package/dist/components/Alert.vue_vue_type_script_setup_true_lang.js +42 -42
  5. package/dist/components/Banner.vue_vue_type_script_setup_true_lang.js +40 -40
  6. package/dist/components/BarChart.vue.d.ts +13 -0
  7. package/dist/components/BarChart.vue_vue_type_script_setup_true_lang.js +174 -132
  8. package/dist/components/Breadcrumb.vue_vue_type_script_setup_true_lang.js +28 -28
  9. package/dist/components/Button.vue_vue_type_script_setup_true_lang.js +14 -14
  10. package/dist/components/Checkbox.vue_vue_type_script_setup_true_lang.js +37 -30
  11. package/dist/components/Combobox.vue_vue_type_script_setup_true_lang.js +62 -60
  12. package/dist/components/DatePicker.vue_vue_type_script_setup_true_lang.js +65 -65
  13. package/dist/components/DateRangePicker.vue_vue_type_script_setup_true_lang.js +74 -74
  14. package/dist/components/Dialog.vue_vue_type_script_setup_true_lang.js +34 -34
  15. package/dist/components/Drawer.js +5 -0
  16. package/dist/components/Drawer.vue.d.ts +94 -0
  17. package/dist/components/Drawer.vue_vue_type_script_setup_true_lang.js +144 -0
  18. package/dist/components/DropdownMenuItems.vue_vue_type_script_setup_true_lang.js +42 -42
  19. package/dist/components/FileUpload.vue_vue_type_script_setup_true_lang.js +77 -77
  20. package/dist/components/Icon.vue_vue_type_script_setup_true_lang.js +11 -11
  21. package/dist/components/Input.vue_vue_type_script_setup_true_lang.js +33 -33
  22. package/dist/components/NumberInput.vue_vue_type_script_setup_true_lang.js +68 -66
  23. package/dist/components/Pagination.vue.d.ts +1 -1
  24. package/dist/components/Pagination.vue_vue_type_script_setup_true_lang.js +37 -37
  25. package/dist/components/PasswordInput.vue_vue_type_script_setup_true_lang.js +37 -37
  26. package/dist/components/Progress.vue_vue_type_script_setup_true_lang.js +34 -31
  27. package/dist/components/Select.vue_vue_type_script_setup_true_lang.js +47 -45
  28. package/dist/components/Stat.vue_vue_type_script_setup_true_lang.js +27 -27
  29. package/dist/components/Stepper.vue_vue_type_script_setup_true_lang.js +38 -38
  30. package/dist/components/Switch.vue_vue_type_script_setup_true_lang.js +9 -2
  31. package/dist/components/Table.vue_vue_type_script_setup_true_lang.js +87 -87
  32. package/dist/components/Toaster.vue_vue_type_script_setup_true_lang.js +41 -41
  33. package/dist/components/index.d.ts +1 -0
  34. package/dist/components/index.js +54 -52
  35. package/dist/composables/date.js +12 -15
  36. package/dist/index.d.ts +1 -0
  37. package/dist/index.js +55 -54
  38. package/dist/theme/drawer.d.ts +110 -0
  39. package/dist/theme/drawer.js +100 -0
  40. package/dist/theme/index.d.ts +1 -0
  41. package/package.json +3 -2
  42. package/theme.css +114 -0
  43. package/dist/node_modules/.pnpm/@hugeicons_core-free-icons@4.2.3/node_modules/@hugeicons/core-free-icons/dist/esm/index.js +0 -377
  44. package/dist/node_modules/.pnpm/@hugeicons_vue@1.0.7_vue@3.5.35_typescript@6.0.3_/node_modules/@hugeicons/vue/dist/esm/_virtual/_plugin-vue_export-helper.js +0 -8
  45. package/dist/node_modules/.pnpm/@hugeicons_vue@1.0.7_vue@3.5.35_typescript@6.0.3_/node_modules/@hugeicons/vue/dist/esm/components/HugeiconsIcon.vue.js +0 -25
  46. package/dist/node_modules/.pnpm/@hugeicons_vue@1.0.7_vue@3.5.35_typescript@6.0.3_/node_modules/@hugeicons/vue/dist/esm/components/HugeiconsIcon.vue2.js +0 -63
  47. package/dist/node_modules/.pnpm/@internationalized_date@3.12.3/node_modules/@internationalized/date/dist/private/CalendarDate.js +0 -122
  48. package/dist/node_modules/.pnpm/@internationalized_date@3.12.3/node_modules/@internationalized/date/dist/private/DateFormatter.js +0 -84
  49. package/dist/node_modules/.pnpm/@internationalized_date@3.12.3/node_modules/@internationalized/date/dist/private/calendars/GregorianCalendar.js +0 -91
  50. package/dist/node_modules/.pnpm/@internationalized_date@3.12.3/node_modules/@internationalized/date/dist/private/conversion.js +0 -107
  51. package/dist/node_modules/.pnpm/@internationalized_date@3.12.3/node_modules/@internationalized/date/dist/private/manipulation.js +0 -159
  52. package/dist/node_modules/.pnpm/@internationalized_date@3.12.3/node_modules/@internationalized/date/dist/private/queries.js +0 -29
  53. package/dist/node_modules/.pnpm/@internationalized_date@3.12.3/node_modules/@internationalized/date/dist/private/string.js +0 -37
  54. package/dist/node_modules/.pnpm/@internationalized_date@3.12.3/node_modules/@internationalized/date/dist/private/utils.js +0 -6
@@ -1,20 +1,20 @@
1
- import { ArrowLeft01Icon as e, ArrowRight01Icon as t, Calendar03Icon as n } from "../node_modules/.pnpm/@hugeicons_core-free-icons@4.2.3/node_modules/@hugeicons/core-free-icons/dist/esm/index.js";
2
- import { useIryxUiConfig as r } from "../config.js";
3
- import i from "./Icon.js";
4
- import { useFormField as a } from "../composables/form.js";
5
- import { formatIsoDate as o, toCalendarDate as s, toIsoDate as c } from "../composables/date.js";
1
+ import { useIryxUiConfig as e } from "../config.js";
2
+ import t from "./Icon.js";
3
+ import { useFormField as n } from "../composables/form.js";
4
+ import { formatIsoDate as r, toCalendarDate as i, toIsoDate as a } from "../composables/date.js";
6
5
  import { datePickerTheme as ee } from "../theme/date-picker.js";
7
- import { Fragment as l, computed as u, createBlock as d, createCommentVNode as te, createElementBlock as f, createElementVNode as p, createTextVNode as m, createVNode as h, defineComponent as g, mergeModels as _, normalizeClass as v, openBlock as y, ref as b, renderList as x, shallowRef as S, toDisplayString as C, unref as w, useModel as ne, watch as T, withCtx as E } from "vue";
8
- import { PopoverContent as D, PopoverPortal as O, PopoverRoot as k, PopoverTrigger as A, RangeCalendarCell as re, RangeCalendarCellTrigger as j, RangeCalendarGrid as M, RangeCalendarGridBody as N, RangeCalendarGridHead as P, RangeCalendarGridRow as F, RangeCalendarHeadCell as I, RangeCalendarHeader as L, RangeCalendarHeading as R, RangeCalendarNext as z, RangeCalendarPrev as B, RangeCalendarRoot as V } from "reka-ui";
6
+ import { Fragment as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, createTextVNode as f, createVNode as p, defineComponent as m, mergeModels as h, normalizeClass as g, openBlock as _, ref as v, renderList as y, shallowRef as b, toDisplayString as x, unref as S, useModel as C, watch as w, withCtx as T } from "vue";
7
+ import { ArrowLeft01Icon as E, ArrowRight01Icon as D, Calendar03Icon as te } from "@hugeicons/core-free-icons";
8
+ import { PopoverContent as ne, PopoverPortal as re, PopoverRoot as O, PopoverTrigger as k, RangeCalendarCell as A, RangeCalendarCellTrigger as j, RangeCalendarGrid as M, RangeCalendarGridBody as N, RangeCalendarGridHead as P, RangeCalendarGridRow as F, RangeCalendarHeadCell as I, RangeCalendarHeader as L, RangeCalendarHeading as R, RangeCalendarNext as z, RangeCalendarPrev as B, RangeCalendarRoot as V } from "reka-ui";
9
9
  //#region src/components/DateRangePicker.vue?vue&type=script&setup=true&lang.ts
10
10
  var H = [
11
11
  "id",
12
12
  "disabled",
13
13
  "aria-invalid",
14
14
  "aria-describedby"
15
- ], U = { key: 0 }, W = /*@__PURE__*/ g({
15
+ ], U = { key: 0 }, W = /*@__PURE__*/ m({
16
16
  __name: "DateRangePicker",
17
- props: /*@__PURE__*/ _({
17
+ props: /*@__PURE__*/ h({
18
18
  size: {},
19
19
  placeholder: { default: "Pick a date range" },
20
20
  disabled: { type: Boolean },
@@ -48,30 +48,30 @@ var H = [
48
48
  modelModifiers: {}
49
49
  }),
50
50
  emits: ["update:modelValue"],
51
- setup(g) {
52
- let _ = g, W = ne(g, "modelValue"), G = b(!1), K = a(), q = u(() => _.id ?? K?.id.value), J = u(() => _.invalid ?? K?.invalid.value ?? !1), Y = r(), ie = u(() => _.unstyled ?? Y.unstyled), X = S({
53
- start: s(W.value?.start),
54
- end: s(W.value?.end)
51
+ setup(m) {
52
+ let h = m, W = C(m, "modelValue"), G = v(!1), K = n(), q = s(() => h.id ?? K?.id.value), J = s(() => h.invalid ?? K?.invalid.value ?? !1), Y = e(), ie = s(() => h.unstyled ?? Y.unstyled), X = b({
53
+ start: i(W.value?.start),
54
+ end: i(W.value?.end)
55
55
  });
56
56
  function Z(e) {
57
- return c(e.start) === (W.value?.start ?? null) && c(e.end) === (W.value?.end ?? null);
57
+ return a(e.start) === (W.value?.start ?? null) && a(e.end) === (W.value?.end ?? null);
58
58
  }
59
- T(W, () => {
59
+ w(W, () => {
60
60
  Z(X.value) || (X.value = {
61
- start: s(W.value?.start),
62
- end: s(W.value?.end)
61
+ start: i(W.value?.start),
62
+ end: i(W.value?.end)
63
63
  });
64
- }, { deep: !0 }), T(X, (e) => {
64
+ }, { deep: !0 }), w(X, (e) => {
65
65
  Z(e) || (W.value = {
66
- start: c(e.start),
67
- end: c(e.end)
66
+ start: a(e.start),
67
+ end: a(e.end)
68
68
  });
69
69
  });
70
- let ae = u(() => s(_.min)), oe = u(() => s(_.max)), Q = u(() => {
71
- let e = o(W.value?.start, _.locale, _.format), t = o(W.value?.end, _.locale, _.format);
72
- return !e && !t ? "" : t ? `${e}${_.separator}${t}` : e;
70
+ let ae = s(() => i(h.min)), oe = s(() => i(h.max)), Q = s(() => {
71
+ let e = r(W.value?.start, h.locale, h.format), t = r(W.value?.end, h.locale, h.format);
72
+ return !e && !t ? "" : t ? `${e}${h.separator}${t}` : e;
73
73
  });
74
- T(W, (e) => {
74
+ w(W, (e) => {
75
75
  G.value && e?.start && e?.end && (G.value = !1);
76
76
  }, { deep: !0 });
77
77
  function se() {
@@ -80,95 +80,95 @@ var H = [
80
80
  end: null
81
81
  }, G.value = !1;
82
82
  }
83
- let ce = u(() => ee({
84
- size: _.size,
83
+ let ce = s(() => ee({
84
+ size: h.size,
85
85
  invalid: J.value,
86
86
  range: !0
87
87
  }));
88
88
  function $(e, t) {
89
- let n = _.ui?.[e];
89
+ let n = h.ui?.[e];
90
90
  return ie.value ? [n, t] : ce.value[e]({ class: [n, t] });
91
91
  }
92
- return (r, a) => (y(), d(w(k), {
92
+ return (e, n) => (_(), c(S(O), {
93
93
  open: G.value,
94
- "onUpdate:open": a[1] ||= (e) => G.value = e
94
+ "onUpdate:open": n[1] ||= (e) => G.value = e
95
95
  }, {
96
- default: E(() => [h(w(A), { "as-child": "" }, {
97
- default: E(() => [p("button", {
96
+ default: T(() => [p(S(k), { "as-child": "" }, {
97
+ default: T(() => [d("button", {
98
98
  id: q.value,
99
99
  type: "button",
100
- disabled: _.disabled,
100
+ disabled: h.disabled,
101
101
  "aria-invalid": J.value || void 0,
102
- "aria-describedby": w(K)?.describedBy.value,
103
- class: v($("trigger", _.class))
104
- }, [Q.value ? (y(), f("span", U, C(Q.value), 1)) : (y(), f("span", {
102
+ "aria-describedby": S(K)?.describedBy.value,
103
+ class: g($("trigger", h.class))
104
+ }, [Q.value ? (_(), u("span", U, x(Q.value), 1)) : (_(), u("span", {
105
105
  key: 1,
106
- class: v($("placeholder"))
107
- }, C(_.placeholder), 3)), h(i, { icon: w(n) }, null, 8, ["icon"])], 10, H)]),
106
+ class: g($("placeholder"))
107
+ }, x(h.placeholder), 3)), p(t, { icon: S(te) }, null, 8, ["icon"])], 10, H)]),
108
108
  _: 1
109
- }), h(w(O), null, {
110
- default: E(() => [h(w(D), {
111
- class: v($("content")),
109
+ }), p(S(re), null, {
110
+ default: T(() => [p(S(ne), {
111
+ class: g($("content")),
112
112
  "side-offset": 4,
113
113
  align: "start"
114
114
  }, {
115
- default: E(() => [h(w(V), {
115
+ default: T(() => [p(S(V), {
116
116
  modelValue: X.value,
117
- "onUpdate:modelValue": a[0] ||= (e) => X.value = e,
117
+ "onUpdate:modelValue": n[0] ||= (e) => X.value = e,
118
118
  "min-value": ae.value,
119
119
  "max-value": oe.value,
120
- locale: _.locale,
121
- "week-starts-on": _.weekStartsOn,
122
- "number-of-months": _.months,
120
+ locale: h.locale,
121
+ "week-starts-on": h.weekStartsOn,
122
+ "number-of-months": h.months,
123
123
  "fixed-weeks": "",
124
124
  "initial-focus": ""
125
125
  }, {
126
- default: E(({ grid: n, weekDays: r }) => [h(w(L), { class: v($("header")) }, {
127
- default: E(() => [
128
- h(w(B), {
129
- "aria-label": _.previousLabel,
130
- class: v($("nav"))
126
+ default: T(({ grid: e, weekDays: n }) => [p(S(L), { class: g($("header")) }, {
127
+ default: T(() => [
128
+ p(S(B), {
129
+ "aria-label": h.previousLabel,
130
+ class: g($("nav"))
131
131
  }, {
132
- default: E(() => [h(i, { icon: w(e) }, null, 8, ["icon"])]),
132
+ default: T(() => [p(t, { icon: S(E) }, null, 8, ["icon"])]),
133
133
  _: 1
134
134
  }, 8, ["aria-label", "class"]),
135
- h(w(R), { class: v($("heading")) }, null, 8, ["class"]),
136
- h(w(z), {
137
- "aria-label": _.nextLabel,
138
- class: v($("nav"))
135
+ p(S(R), { class: g($("heading")) }, null, 8, ["class"]),
136
+ p(S(z), {
137
+ "aria-label": h.nextLabel,
138
+ class: g($("nav"))
139
139
  }, {
140
- default: E(() => [h(i, { icon: w(t) }, null, 8, ["icon"])]),
140
+ default: T(() => [p(t, { icon: S(D) }, null, 8, ["icon"])]),
141
141
  _: 1
142
142
  }, 8, ["aria-label", "class"])
143
143
  ]),
144
144
  _: 1
145
- }, 8, ["class"]), p("div", { class: v($("months")) }, [(y(!0), f(l, null, x(n, (e) => (y(), d(w(M), {
145
+ }, 8, ["class"]), d("div", { class: g($("months")) }, [(_(!0), u(o, null, y(e, (e) => (_(), c(S(M), {
146
146
  key: e.value.toString(),
147
- class: v($("grid"))
147
+ class: g($("grid"))
148
148
  }, {
149
- default: E(() => [h(w(P), null, {
150
- default: E(() => [h(w(F), null, {
151
- default: E(() => [(y(!0), f(l, null, x(r, (e) => (y(), d(w(I), {
149
+ default: T(() => [p(S(P), null, {
150
+ default: T(() => [p(S(F), null, {
151
+ default: T(() => [(_(!0), u(o, null, y(n, (e) => (_(), c(S(I), {
152
152
  key: e,
153
- class: v($("headCell"))
153
+ class: g($("headCell"))
154
154
  }, {
155
- default: E(() => [m(C(e), 1)]),
155
+ default: T(() => [f(x(e), 1)]),
156
156
  _: 2
157
157
  }, 1032, ["class"]))), 128))]),
158
158
  _: 2
159
159
  }, 1024)]),
160
160
  _: 2
161
- }, 1024), h(w(N), null, {
162
- default: E(() => [(y(!0), f(l, null, x(e.rows, (t, n) => (y(), d(w(F), { key: `week-${n}` }, {
163
- default: E(() => [(y(!0), f(l, null, x(t, (t) => (y(), d(w(re), {
161
+ }, 1024), p(S(N), null, {
162
+ default: T(() => [(_(!0), u(o, null, y(e.rows, (t, n) => (_(), c(S(F), { key: `week-${n}` }, {
163
+ default: T(() => [(_(!0), u(o, null, y(t, (t) => (_(), c(S(A), {
164
164
  key: t.toString(),
165
165
  date: t,
166
- class: v($("cell"))
166
+ class: g($("cell"))
167
167
  }, {
168
- default: E(() => [h(w(j), {
168
+ default: T(() => [p(S(j), {
169
169
  day: t,
170
170
  month: e.value,
171
- class: v($("cellTrigger"))
171
+ class: g($("cellTrigger"))
172
172
  }, null, 8, [
173
173
  "day",
174
174
  "month",
@@ -190,14 +190,14 @@ var H = [
190
190
  "locale",
191
191
  "week-starts-on",
192
192
  "number-of-months"
193
- ]), _.clearable ? (y(), f("div", {
193
+ ]), h.clearable ? (_(), u("div", {
194
194
  key: 0,
195
- class: v($("footer"))
196
- }, [p("button", {
195
+ class: g($("footer"))
196
+ }, [d("button", {
197
197
  type: "button",
198
- class: v($("action")),
198
+ class: g($("action")),
199
199
  onClick: se
200
- }, C(_.clearLabel), 3)], 2)) : te("", !0)]),
200
+ }, x(h.clearLabel), 3)], 2)) : l("", !0)]),
201
201
  _: 1
202
202
  }, 8, ["class"])]),
203
203
  _: 1
@@ -1,13 +1,13 @@
1
- import { Cancel01Icon as e } from "../node_modules/.pnpm/@hugeicons_core-free-icons@4.2.3/node_modules/@hugeicons/core-free-icons/dist/esm/index.js";
2
- import { useIryxUiConfig as t } from "../config.js";
3
- import n from "./Icon.js";
4
- import { dialogTheme as r } from "../theme/dialog.js";
5
- import { computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, createVNode as u, defineComponent as d, mergeModels as f, mergeProps as p, normalizeClass as m, openBlock as h, renderSlot as g, toDisplayString as _, unref as v, useModel as y, useSlots as b, withCtx as x } from "vue";
1
+ import { useIryxUiConfig as e } from "../config.js";
2
+ import t from "./Icon.js";
3
+ import { dialogTheme as n } from "../theme/dialog.js";
4
+ import { computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, defineComponent as u, mergeModels as d, mergeProps as f, normalizeClass as p, openBlock as m, renderSlot as h, toDisplayString as g, unref as _, useModel as v, useSlots as y, withCtx as b } from "vue";
5
+ import { Cancel01Icon as x } from "@hugeicons/core-free-icons";
6
6
  import { DialogContent as S, DialogDescription as C, DialogOverlay as w, DialogPortal as T, DialogRoot as E, DialogTitle as D, DialogTrigger as O, VisuallyHidden as k } from "reka-ui";
7
7
  //#region src/components/Dialog.vue?vue&type=script&setup=true&lang.ts
8
- var A = ["aria-label"], j = /*@__PURE__*/ d({
8
+ var A = ["aria-label"], j = /*@__PURE__*/ u({
9
9
  __name: "Dialog",
10
- props: /*@__PURE__*/ f({
10
+ props: /*@__PURE__*/ d({
11
11
  title: {},
12
12
  description: {},
13
13
  size: {},
@@ -34,58 +34,58 @@ var A = ["aria-label"], j = /*@__PURE__*/ d({
34
34
  openModifiers: {}
35
35
  }),
36
36
  emits: ["update:open"],
37
- setup(d) {
38
- let f = d, j = y(d, "open"), M = t(), N = i(() => f.unstyled ?? M.unstyled), P = i(() => r({ size: f.size })), F = i(() => N.value ? f.ui?.overlay : P.value.overlay({ class: f.ui?.overlay })), I = i(() => N.value ? [f.ui?.content, f.class] : P.value.content({ class: [f.ui?.content, f.class] })), L = i(() => N.value ? f.ui?.header : P.value.header({ class: f.ui?.header })), R = i(() => N.value ? f.ui?.title : P.value.title({ class: f.ui?.title })), z = i(() => N.value ? f.ui?.description : P.value.description({ class: f.ui?.description })), B = b(), V = i(() => f.description || B.description ? {} : { "aria-describedby": void 0 }), H = i(() => N.value ? f.ui?.body : P.value.body({ class: f.ui?.body })), U = i(() => N.value ? f.ui?.footer : P.value.footer({ class: f.ui?.footer })), W = i(() => N.value ? f.ui?.close : P.value.close({ class: f.ui?.close }));
37
+ setup(u) {
38
+ let d = u, j = v(u, "open"), M = e(), N = r(() => d.unstyled ?? M.unstyled), P = r(() => n({ size: d.size })), F = r(() => N.value ? d.ui?.overlay : P.value.overlay({ class: d.ui?.overlay })), I = r(() => N.value ? [d.ui?.content, d.class] : P.value.content({ class: [d.ui?.content, d.class] })), L = r(() => N.value ? d.ui?.header : P.value.header({ class: d.ui?.header })), R = r(() => N.value ? d.ui?.title : P.value.title({ class: d.ui?.title })), z = r(() => N.value ? d.ui?.description : P.value.description({ class: d.ui?.description })), B = y(), V = r(() => d.description || B.description ? {} : { "aria-describedby": void 0 }), H = r(() => N.value ? d.ui?.body : P.value.body({ class: d.ui?.body })), U = r(() => N.value ? d.ui?.footer : P.value.footer({ class: d.ui?.footer })), W = r(() => N.value ? d.ui?.close : P.value.close({ class: d.ui?.close }));
39
39
  function G(e) {
40
- !e && !f.dismissible || (j.value = e);
40
+ !e && !d.dismissible || (j.value = e);
41
41
  }
42
42
  function K() {
43
43
  j.value = !1;
44
44
  }
45
- return (t, r) => (h(), a(v(E), {
45
+ return (e, n) => (m(), i(_(E), {
46
46
  open: j.value,
47
47
  "onUpdate:open": G
48
48
  }, {
49
- default: x(() => [t.$slots.trigger ? (h(), a(v(O), {
49
+ default: b(() => [e.$slots.trigger ? (m(), i(_(O), {
50
50
  key: 0,
51
51
  "as-child": ""
52
52
  }, {
53
- default: x(() => [g(t.$slots, "trigger")]),
53
+ default: b(() => [h(e.$slots, "trigger")]),
54
54
  _: 3
55
- })) : o("", !0), u(v(T), null, {
56
- default: x(() => [u(v(w), { class: m(F.value) }, null, 8, ["class"]), u(v(S), p({ class: I.value }, V.value), {
57
- default: x(() => [
58
- f.title || f.description || t.$slots.header ? (h(), s("div", {
55
+ })) : a("", !0), l(_(T), null, {
56
+ default: b(() => [l(_(w), { class: p(F.value) }, null, 8, ["class"]), l(_(S), f({ class: I.value }, V.value), {
57
+ default: b(() => [
58
+ d.title || d.description || e.$slots.header ? (m(), o("div", {
59
59
  key: 0,
60
- class: m(L.value)
61
- }, [g(t.$slots, "header", {}, () => [u(v(D), { class: m(R.value) }, {
62
- default: x(() => [g(t.$slots, "title", {}, () => [l(_(f.title), 1)])]),
60
+ class: p(L.value)
61
+ }, [h(e.$slots, "header", {}, () => [l(_(D), { class: p(R.value) }, {
62
+ default: b(() => [h(e.$slots, "title", {}, () => [c(g(d.title), 1)])]),
63
63
  _: 3
64
- }, 8, ["class"]), f.description || t.$slots.description ? (h(), a(v(C), {
64
+ }, 8, ["class"]), d.description || e.$slots.description ? (m(), i(_(C), {
65
65
  key: 0,
66
- class: m(z.value)
66
+ class: p(z.value)
67
67
  }, {
68
- default: x(() => [g(t.$slots, "description", {}, () => [l(_(f.description), 1)])]),
68
+ default: b(() => [h(e.$slots, "description", {}, () => [c(g(d.description), 1)])]),
69
69
  _: 3
70
- }, 8, ["class"])) : o("", !0)])], 2)) : (h(), a(v(k), { key: 1 }, {
71
- default: x(() => [u(v(D), null, {
72
- default: x(() => [l(_(f.closeLabel), 1)]),
70
+ }, 8, ["class"])) : a("", !0)])], 2)) : (m(), i(_(k), { key: 1 }, {
71
+ default: b(() => [l(_(D), null, {
72
+ default: b(() => [c(g(d.closeLabel), 1)]),
73
73
  _: 1
74
74
  })]),
75
75
  _: 1
76
76
  })),
77
- c("div", { class: m(H.value) }, [g(t.$slots, "default")], 2),
78
- t.$slots.footer ? (h(), s("div", {
77
+ s("div", { class: p(H.value) }, [h(e.$slots, "default")], 2),
78
+ e.$slots.footer ? (m(), o("div", {
79
79
  key: 2,
80
- class: m(U.value)
81
- }, [g(t.$slots, "footer", { close: K })], 2)) : o("", !0),
82
- f.showClose ? (h(), s("button", {
80
+ class: p(U.value)
81
+ }, [h(e.$slots, "footer", { close: K })], 2)) : a("", !0),
82
+ d.showClose ? (m(), o("button", {
83
83
  key: 3,
84
84
  type: "button",
85
- "aria-label": f.closeLabel,
86
- class: m(W.value),
85
+ "aria-label": d.closeLabel,
86
+ class: p(W.value),
87
87
  onClick: K
88
- }, [u(n, { icon: v(e) }, null, 8, ["icon"])], 10, A)) : o("", !0)
88
+ }, [l(t, { icon: _(x) }, null, 8, ["icon"])], 10, A)) : a("", !0)
89
89
  ]),
90
90
  _: 3
91
91
  }, 16, ["class"])]),
@@ -0,0 +1,5 @@
1
+ import e from "./Drawer.vue_vue_type_script_setup_true_lang.js";
2
+ //#region src/components/Drawer.vue
3
+ var t = e;
4
+ //#endregion
5
+ export { t as default };
@@ -0,0 +1,94 @@
1
+ export type DrawerSide = 'right' | 'left' | 'top' | 'bottom';
2
+ /** Fractions of the panel (0–1), pixel numbers, or CSS lengths like `'20rem'`. */
3
+ export type DrawerSnapPoint = number | string;
4
+ export interface DrawerProps {
5
+ title?: string;
6
+ description?: string;
7
+ /** Which edge the panel is attached to. Also the direction you swipe to dismiss. */
8
+ side?: DrawerSide;
9
+ /** Width for a left/right drawer, max height for a top/bottom sheet. */
10
+ size?: 'sm' | 'md' | 'lg' | 'xl' | 'full';
11
+ /**
12
+ * Resting positions the panel snaps between, e.g. `[0.4, 1]` for a sheet
13
+ * that opens part-way and can be dragged to full. Sizing is left to the
14
+ * snap points when this is set — see the note in the setup below.
15
+ */
16
+ snapPoints?: DrawerSnapPoint[];
17
+ /** Snap to the next point in order rather than the nearest by distance. */
18
+ snapToSequentialPoints?: boolean;
19
+ /**
20
+ * `true` traps focus and blocks the page behind it; `'trap-focus'` keeps the
21
+ * page interactive while still trapping the Tab ring, which is what a
22
+ * persistent side panel wants; `false` does neither.
23
+ */
24
+ modal?: boolean | 'trap-focus';
25
+ /** Clicking the overlay, pressing Escape or swiping closes it. Set false to force a choice. */
26
+ dismissible?: boolean;
27
+ /** Show the drag handle. Defaults on for top/bottom sheets, off for side drawers. */
28
+ handle?: boolean;
29
+ /** Render the corner dismiss button. */
30
+ showClose?: boolean;
31
+ /** Accessible name for the dismiss button — override for non-English apps. */
32
+ closeLabel?: string;
33
+ /** Skip built-in classes; you take over styling entirely. */
34
+ unstyled?: boolean;
35
+ class?: string;
36
+ /** Override classes per slot, e.g. `{ content: 'sm:max-w-3xl' }`. */
37
+ ui?: {
38
+ overlay?: string;
39
+ content?: string;
40
+ handle?: string;
41
+ header?: string;
42
+ title?: string;
43
+ description?: string;
44
+ body?: string;
45
+ footer?: string;
46
+ close?: string;
47
+ };
48
+ }
49
+ type __VLS_Props = DrawerProps;
50
+ declare function close(): void;
51
+ type __VLS_ModelProps = {
52
+ 'open'?: boolean;
53
+ 'snapPoint'?: DrawerSnapPoint | null;
54
+ };
55
+ type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
56
+ declare var __VLS_16: {}, __VLS_40: {}, __VLS_48: {}, __VLS_56: {}, __VLS_76: {}, __VLS_78: {
57
+ close: typeof close;
58
+ };
59
+ type __VLS_Slots = {} & {
60
+ trigger?: (props: typeof __VLS_16) => any;
61
+ } & {
62
+ header?: (props: typeof __VLS_40) => any;
63
+ } & {
64
+ title?: (props: typeof __VLS_48) => any;
65
+ } & {
66
+ description?: (props: typeof __VLS_56) => any;
67
+ } & {
68
+ default?: (props: typeof __VLS_76) => any;
69
+ } & {
70
+ footer?: (props: typeof __VLS_78) => any;
71
+ };
72
+ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
73
+ "update:open": (value: boolean) => any;
74
+ "update:snapPoint": (value: DrawerSnapPoint | null) => any;
75
+ }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
76
+ "onUpdate:open"?: ((value: boolean) => any) | undefined;
77
+ "onUpdate:snapPoint"?: ((value: DrawerSnapPoint | null) => any) | undefined;
78
+ }>, {
79
+ closeLabel: string;
80
+ unstyled: boolean;
81
+ side: DrawerSide;
82
+ dismissible: boolean;
83
+ showClose: boolean;
84
+ modal: boolean | "trap-focus";
85
+ handle: boolean;
86
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
87
+ declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
88
+ declare const _default: typeof __VLS_export;
89
+ export default _default;
90
+ type __VLS_WithSlots<T, S> = T & {
91
+ new (): {
92
+ $slots: S;
93
+ };
94
+ };
@@ -0,0 +1,144 @@
1
+ import { useIryxUiConfig as e } from "../config.js";
2
+ import t from "./Icon.js";
3
+ import { drawerTheme as n } from "../theme/drawer.js";
4
+ import { computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createTextVNode as s, createVNode as c, defineComponent as l, mergeModels as u, mergeProps as d, normalizeClass as f, openBlock as p, renderSlot as m, toDisplayString as h, unref as g, useModel as _, useSlots as v, withCtx as y } from "vue";
5
+ import { Cancel01Icon as b } from "@hugeicons/core-free-icons";
6
+ import { DrawerContent as x, DrawerDescription as S, DrawerHandle as C, DrawerOverlay as w, DrawerPortal as T, DrawerRoot as E, DrawerTitle as D, DrawerTrigger as O, DrawerViewport as k, VisuallyHidden as A } from "reka-ui";
7
+ //#region src/components/Drawer.vue?vue&type=script&setup=true&lang.ts
8
+ var j = ["aria-label"], M = /*@__PURE__*/ l({
9
+ __name: "Drawer",
10
+ props: /*@__PURE__*/ u({
11
+ title: {},
12
+ description: {},
13
+ side: { default: "right" },
14
+ size: {},
15
+ snapPoints: {},
16
+ snapToSequentialPoints: { type: Boolean },
17
+ modal: {
18
+ type: [Boolean, String],
19
+ default: !0
20
+ },
21
+ dismissible: {
22
+ type: Boolean,
23
+ default: !0
24
+ },
25
+ handle: {
26
+ type: Boolean,
27
+ default: void 0
28
+ },
29
+ showClose: {
30
+ type: Boolean,
31
+ default: !0
32
+ },
33
+ closeLabel: { default: "Close" },
34
+ unstyled: {
35
+ type: Boolean,
36
+ default: void 0
37
+ },
38
+ class: {},
39
+ ui: {}
40
+ }, {
41
+ open: {
42
+ type: Boolean,
43
+ default: !1
44
+ },
45
+ openModifiers: {},
46
+ snapPoint: { default: null },
47
+ snapPointModifiers: {}
48
+ }),
49
+ emits: ["update:open", "update:snapPoint"],
50
+ setup(l) {
51
+ let u = l, M = _(l, "open"), N = _(l, "snapPoint"), P = e(), F = r(() => u.unstyled ?? P.unstyled), I = r(() => ({
52
+ right: "right",
53
+ left: "left",
54
+ top: "up",
55
+ bottom: "down"
56
+ })[u.side]), L = r(() => u.handle ?? (u.side === "top" || u.side === "bottom")), R = r(() => n({
57
+ side: u.side,
58
+ size: u.size
59
+ })), z = r(() => u.snapPoints?.length ? "max-h-dvh" : void 0), B = r(() => F.value ? u.ui?.overlay : R.value.overlay({ class: u.ui?.overlay })), V = r(() => F.value ? [u.ui?.content, u.class] : R.value.content({ class: [
60
+ z.value,
61
+ u.ui?.content,
62
+ u.class
63
+ ] })), H = r(() => F.value ? u.ui?.handle : R.value.handle({ class: u.ui?.handle })), U = r(() => F.value ? u.ui?.header : R.value.header({ class: u.ui?.header })), W = r(() => F.value ? u.ui?.title : R.value.title({ class: u.ui?.title })), G = r(() => F.value ? u.ui?.description : R.value.description({ class: u.ui?.description })), K = r(() => F.value ? u.ui?.body : R.value.body({ class: u.ui?.body })), q = r(() => F.value ? u.ui?.footer : R.value.footer({ class: u.ui?.footer })), J = r(() => F.value ? u.ui?.close : R.value.close({ class: u.ui?.close })), Y = v(), X = r(() => u.description || Y.description ? {} : { "aria-describedby": void 0 });
64
+ function Z(e) {
65
+ !e && !u.dismissible || (M.value = e);
66
+ }
67
+ function Q() {
68
+ M.value = !1;
69
+ }
70
+ return (e, n) => (p(), i(g(E), {
71
+ open: M.value,
72
+ modal: u.modal,
73
+ "swipe-direction": I.value,
74
+ "snap-points": u.snapPoints,
75
+ "snap-point": N.value,
76
+ "snap-to-sequential-points": u.snapToSequentialPoints,
77
+ "onUpdate:open": Z,
78
+ "onUpdate:snapPoint": n[0] ||= (e) => N.value = e
79
+ }, {
80
+ default: y(() => [e.$slots.trigger ? (p(), i(g(O), {
81
+ key: 0,
82
+ "as-child": ""
83
+ }, {
84
+ default: y(() => [m(e.$slots, "trigger")]),
85
+ _: 3
86
+ })) : a("", !0), c(g(T), null, {
87
+ default: y(() => [c(g(w), { class: f(B.value) }, null, 8, ["class"]), c(g(x), d({ class: V.value }, X.value), {
88
+ default: y(() => [
89
+ L.value ? (p(), i(g(C), {
90
+ key: 0,
91
+ class: f(H.value)
92
+ }, null, 8, ["class"])) : a("", !0),
93
+ u.title || u.description || e.$slots.header ? (p(), o("div", {
94
+ key: 1,
95
+ class: f(U.value)
96
+ }, [m(e.$slots, "header", {}, () => [c(g(D), { class: f(W.value) }, {
97
+ default: y(() => [m(e.$slots, "title", {}, () => [s(h(u.title), 1)])]),
98
+ _: 3
99
+ }, 8, ["class"]), u.description || e.$slots.description ? (p(), i(g(S), {
100
+ key: 0,
101
+ class: f(G.value)
102
+ }, {
103
+ default: y(() => [m(e.$slots, "description", {}, () => [s(h(u.description), 1)])]),
104
+ _: 3
105
+ }, 8, ["class"])) : a("", !0)])], 2)) : (p(), i(g(A), { key: 2 }, {
106
+ default: y(() => [c(g(D), null, {
107
+ default: y(() => [s(h(u.closeLabel), 1)]),
108
+ _: 1
109
+ })]),
110
+ _: 1
111
+ })),
112
+ c(g(k), { class: f(K.value) }, {
113
+ default: y(() => [m(e.$slots, "default")]),
114
+ _: 3
115
+ }, 8, ["class"]),
116
+ e.$slots.footer ? (p(), o("div", {
117
+ key: 3,
118
+ class: f(q.value)
119
+ }, [m(e.$slots, "footer", { close: Q })], 2)) : a("", !0),
120
+ u.showClose ? (p(), o("button", {
121
+ key: 4,
122
+ type: "button",
123
+ "aria-label": u.closeLabel,
124
+ class: f(J.value),
125
+ onClick: Q
126
+ }, [c(t, { icon: g(b) }, null, 8, ["icon"])], 10, j)) : a("", !0)
127
+ ]),
128
+ _: 3
129
+ }, 16, ["class"])]),
130
+ _: 3
131
+ })]),
132
+ _: 3
133
+ }, 8, [
134
+ "open",
135
+ "modal",
136
+ "swipe-direction",
137
+ "snap-points",
138
+ "snap-point",
139
+ "snap-to-sequential-points"
140
+ ]));
141
+ }
142
+ });
143
+ //#endregion
144
+ export { M as default };