@indielayer/ui 1.7.5 → 1.8.1

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 (73) hide show
  1. package/README.md +0 -1
  2. package/docs/components/common/CodePreview.vue +1 -1
  3. package/docs/components/common/CopyButton.vue +1 -1
  4. package/docs/components/toolbar/ToolbarColorToggle.vue +4 -4
  5. package/docs/components/toolbar/ToolbarSearch.vue +1 -1
  6. package/docs/layouts/default.vue +2 -2
  7. package/docs/pages/colors.vue +1 -1
  8. package/docs/pages/component/alert/usage.vue +1 -1
  9. package/docs/pages/component/breadcrumbs/usage.vue +1 -1
  10. package/docs/pages/component/button/button-group.vue +1 -1
  11. package/docs/pages/component/button/variants.vue +1 -1
  12. package/docs/pages/component/drawer/usage.vue +1 -1
  13. package/docs/pages/component/form/usage.vue +2 -1
  14. package/docs/pages/component/formGroup/usage.vue +1 -1
  15. package/docs/pages/component/modal/composed.vue +12 -3
  16. package/docs/pages/component/modal/usage.vue +5 -12
  17. package/docs/pages/component/notifications/usage.vue +9 -9
  18. package/docs/pages/component/pagination/usage.vue +2 -1
  19. package/docs/pages/component/progress/variants.vue +8 -8
  20. package/docs/pages/component/radio/states.vue +6 -6
  21. package/docs/pages/component/radio/variants.vue +6 -6
  22. package/docs/pages/component/select/index.vue +5 -5
  23. package/docs/pages/component/select/{variants.vue → size.vue} +11 -15
  24. package/docs/pages/component/select/states.vue +11 -15
  25. package/docs/pages/component/select/usage.vue +19 -22
  26. package/docs/pages/component/spinner/variants.vue +1 -1
  27. package/docs/pages/component/table/usage.vue +1 -1
  28. package/docs/pages/component/tag/usage.vue +10 -18
  29. package/docs/pages/component/toggle/states.vue +6 -6
  30. package/docs/pages/component/toggle/variants.vue +6 -6
  31. package/docs/pages/icons.vue +36 -39
  32. package/docs/router/index.ts +1 -5
  33. package/lib/components/checkbox/Checkbox.vue.d.ts +4 -0
  34. package/lib/components/datepicker/Datepicker.vue.d.ts +4 -0
  35. package/lib/components/datepicker/Datepicker.vue.js +3 -3
  36. package/lib/components/drawer/Drawer.vue.js +1 -1
  37. package/lib/components/formGroup/FormGroup.vue.d.ts +4 -0
  38. package/lib/components/input/Input.vue.d.ts +7 -0
  39. package/lib/components/input/Input.vue.js +26 -24
  40. package/lib/components/menu/MenuItem.vue2.js +1 -1
  41. package/lib/components/modal/Modal.vue.js +74 -70
  42. package/lib/components/popover/Popover.vue.js +1 -1
  43. package/lib/components/radio/Radio.vue.d.ts +4 -0
  44. package/lib/components/scroll/Scroll.vue2.js +1 -1
  45. package/lib/components/select/Select.vue.d.ts +24 -1
  46. package/lib/components/select/Select.vue.js +302 -264
  47. package/lib/components/select/theme/Select.base.theme.js +3 -1
  48. package/lib/components/select/theme/Select.carbon.theme.js +3 -1
  49. package/lib/components/slider/Slider.vue.d.ts +4 -0
  50. package/lib/components/tab/Tab.vue.js +1 -1
  51. package/lib/components/tab/TabGroup.vue.js +2 -2
  52. package/lib/components/textarea/Textarea.vue.d.ts +4 -0
  53. package/lib/components/textarea/Textarea.vue.js +1 -1
  54. package/lib/components/toggle/Toggle.vue.d.ts +4 -0
  55. package/lib/components/tooltip/Tooltip.vue.js +1 -1
  56. package/lib/composables/useInputtable.d.ts +1 -0
  57. package/lib/composables/useInputtable.js +31 -30
  58. package/lib/index.umd.js +4 -4
  59. package/lib/node_modules/.pnpm/{@vueuse_core@10.2.0_vue@3.3.9 → @vueuse_core@10.2.0_vue@3.3.9_typescript@5.2.2_}/node_modules/@vueuse/core/index.js +2 -2
  60. package/lib/version.d.ts +1 -1
  61. package/lib/version.js +1 -1
  62. package/package.json +1 -1
  63. package/src/components/input/Input.vue +3 -1
  64. package/src/components/modal/Modal.vue +11 -2
  65. package/src/components/select/Select.vue +70 -25
  66. package/src/components/select/theme/Select.base.theme.ts +5 -1
  67. package/src/components/select/theme/Select.carbon.theme.ts +5 -1
  68. package/src/composables/useInputtable.ts +6 -3
  69. package/src/version.ts +1 -1
  70. /package/lib/node_modules/.pnpm/{@vuepic_vue-datepicker@8.3.2_vue@3.3.9 → @vuepic_vue-datepicker@8.3.2_vue@3.3.9_typescript@5.2.2_}/node_modules/@vuepic/vue-datepicker/dist/main.css.js +0 -0
  71. /package/lib/node_modules/.pnpm/{@vuepic_vue-datepicker@8.3.2_vue@3.3.9 → @vuepic_vue-datepicker@8.3.2_vue@3.3.9_typescript@5.2.2_}/node_modules/@vuepic/vue-datepicker/dist/vue-datepicker.js +0 -0
  72. /package/lib/node_modules/.pnpm/{@vueuse_shared@10.2.0_vue@3.3.9 → @vueuse_shared@10.2.0_vue@3.3.9_typescript@5.2.2_}/node_modules/@vueuse/shared/index.js +0 -0
  73. /package/lib/node_modules/.pnpm/{floating-vue@5.2.2_vue@3.3.9 → floating-vue@5.2.2_@nuxt_kit@3.10.1_rollup@3.29.4__vue@3.3.9_typescript@5.2.2_}/node_modules/floating-vue/dist/floating-vue.js +0 -0
@@ -1,350 +1,388 @@
1
- import { defineComponent as pe, ref as g, computed as w, watch as O, nextTick as X, unref as s, onUnmounted as ve, openBlock as n, createBlock as c, mergeProps as H, toHandlers as K, withCtx as h, createElementVNode as _, createElementBlock as a, normalizeClass as A, Fragment as p, renderList as $, createTextVNode as C, toDisplayString as m, createVNode as W, withDirectives as ce, vModelSelect as me, renderSlot as ye, createCommentVNode as be } from "vue";
2
- import { useEventListener as he } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.9/node_modules/@vueuse/core/index.js";
3
- import { useColors as ke } from "../../composables/useColors.js";
4
- import { useCommon as J } from "../../composables/useCommon.js";
5
- import { useInputtable as D } from "../../composables/useInputtable.js";
6
- import { useInteractive as Q } from "../../composables/useInteractive.js";
7
- import { useTheme as ge } from "../../composables/useTheme.js";
8
- import { checkIcon as we, selectIcon as Ae } from "../../common/icons.js";
9
- import Ie from "../label/Label.vue.js";
10
- import G from "../tag/Tag.vue.js";
11
- import Re from "../icon/Icon.vue.js";
12
- import Ve from "../menu/MenuItem.vue.js";
1
+ import { defineComponent as ye, ref as y, computed as R, watch as _, nextTick as G, unref as s, onUnmounted as be, resolveComponent as he, openBlock as r, createBlock as b, mergeProps as J, toHandlers as Q, withCtx as A, createElementVNode as z, createElementBlock as n, normalizeClass as h, Fragment as c, renderList as L, createTextVNode as B, toDisplayString as k, createVNode as T, renderSlot as E, createCommentVNode as Y, withDirectives as ke, vModelSelect as ge } from "vue";
2
+ import { useEventListener as we } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.9_typescript@5.2.2_/node_modules/@vueuse/core/index.js";
3
+ import { useColors as Ae } from "../../composables/useColors.js";
4
+ import { useCommon as ee } from "../../composables/useCommon.js";
5
+ import { useInputtable as F } from "../../composables/useInputtable.js";
6
+ import { useInteractive as le } from "../../composables/useInteractive.js";
7
+ import { useTheme as Ve } from "../../composables/useTheme.js";
8
+ import { checkIcon as Re, selectIcon as Ie } from "../../common/icons.js";
9
+ import $e from "../label/Label.vue.js";
10
+ import Z from "../tag/Tag.vue.js";
11
+ import Ce from "../icon/Icon.vue.js";
12
+ import Se from "../menu/MenuItem.vue.js";
13
13
  import _e from "../spinner/Spinner.vue.js";
14
- import $e from "../popover/Popover.vue.js";
14
+ import ze from "../popover/Popover.vue.js";
15
15
  import "../popover/Popover.vue3.js";
16
- import Ce from "../popover/PopoverContainer.vue.js";
17
- import ze from "../inputFooter/InputFooter.vue.js";
18
- const Se = { class: "relative" }, Ne = {
16
+ import Le from "../popover/PopoverContainer.vue.js";
17
+ import Be from "../inputFooter/InputFooter.vue.js";
18
+ const Ne = { class: "relative" }, Oe = {
19
19
  key: 0,
20
20
  class: "flex gap-1 flex-wrap"
21
- }, Oe = {
21
+ }, De = {
22
22
  key: 0,
23
23
  class: "text-secondary-400 dark:text-secondary-500"
24
- }, De = { key: 1 }, Le = {
24
+ }, Te = { key: 1 }, Ee = {
25
25
  key: 0,
26
26
  class: "flex gap-1 flex-wrap"
27
- }, Be = {
27
+ }, Fe = {
28
28
  key: 0,
29
29
  class: "text-secondary-400 dark:text-secondary-500"
30
- }, Ee = { key: 1 }, Te = {
30
+ }, Pe = { key: 1 }, qe = {
31
31
  key: 1,
32
32
  class: "px-2 text-center text-secondary-400"
33
- }, Fe = ["id", "name", "disabled", "multiple", "readonly"], Pe = ["value", "disabled"], qe = {
34
- ...ke.props("primary"),
35
- ...J.props(),
36
- ...Q.props(),
37
- ...D.props(),
33
+ }, Ue = ["id", "name", "disabled", "multiple", "readonly"], je = ["value", "disabled"], Me = {
34
+ ...Ae.props("primary"),
35
+ ...ee.props(),
36
+ ...le.props(),
37
+ ...F.props(),
38
38
  placeholder: String,
39
39
  options: Array,
40
40
  multiple: Boolean,
41
41
  flat: Boolean,
42
- native: Boolean
43
- }, Ue = {
42
+ native: Boolean,
43
+ filterable: Boolean,
44
+ filterPlaceholder: {
45
+ type: String,
46
+ default: "Filter by..."
47
+ }
48
+ }, Xe = {
44
49
  name: "XSelect",
45
50
  validators: {
46
- ...J.validators()
51
+ ...ee.validators()
47
52
  }
48
- }, nl = /* @__PURE__ */ pe({
49
- ...Ue,
50
- props: qe,
51
- emits: D.emits(),
52
- setup(Y, { expose: Z, emit: ee }) {
53
- const r = Y, I = ee, z = g(null), S = g(null), R = g(null), f = g(null), u = g(), t = w({
53
+ }, sl = /* @__PURE__ */ ye({
54
+ ...Xe,
55
+ props: Me,
56
+ emits: F.emits(),
57
+ setup(ie, { expose: te, emit: oe }) {
58
+ const a = ie, I = oe, N = y(null), O = y(null), $ = y(null), v = y(null), u = y(), g = y(""), D = y(null), t = R({
54
59
  get() {
55
- return r.multiple ? r.modelValue ? Array.isArray(r.modelValue) ? r.modelValue : [r.modelValue] : [] : r.modelValue;
60
+ return a.multiple ? a.modelValue ? Array.isArray(a.modelValue) ? a.modelValue : [a.modelValue] : [] : a.modelValue;
56
61
  },
57
62
  set(e) {
58
63
  I("update:modelValue", e);
59
64
  }
60
- }), d = w(() => !r.options || r.options.length === 0 ? [] : r.options.map((e) => {
61
- let i = !1;
62
- return r.multiple && Array.isArray(t.value) ? i = t.value.includes(e.value) : i = e.value === t.value, {
65
+ }), d = R(() => !a.options || a.options.length === 0 ? [] : a.options.filter((e) => g.value === "" || e.label.toLowerCase().includes(g.value.toLowerCase())).map((e) => {
66
+ let l = !1;
67
+ return a.multiple && Array.isArray(t.value) ? l = t.value.includes(e.value) : l = e.value === t.value, {
63
68
  value: e.value,
64
69
  label: e.label,
65
- active: i,
70
+ active: l,
66
71
  disabled: e.disabled,
67
- iconRight: i ? we : void 0,
68
- onClick: () => E(e.value)
72
+ iconRight: l ? Re : void 0,
73
+ onClick: () => U(e.value)
69
74
  };
70
- })), L = w(() => {
71
- var e;
72
- return (e = r.options) == null ? void 0 : e.filter((i) => !i.disabled);
73
- }), y = w(() => {
75
+ })), P = R(() => d.value.filter((e) => !e.disabled)), w = R(() => {
74
76
  var e;
75
- return (e = f.value) == null ? void 0 : e.isOpen;
77
+ return (e = v.value) == null ? void 0 : e.isOpen;
76
78
  });
77
- O(y, (e) => {
78
- e && (le(), setTimeout(() => {
79
- B(u.value || 0);
80
- }, 50), (r.multiple || typeof u.value > "u") && N(-1));
79
+ _(g, (e) => {
80
+ e && (u.value = void 0, C(-1));
81
+ }), _(w, (e) => {
82
+ e ? (re(), (a.multiple || typeof u.value > "u") && C(-1), setTimeout(() => {
83
+ requestAnimationFrame(() => {
84
+ var l;
85
+ q(u.value || 0), a.filterable && ((l = D.value) == null || l.focus());
86
+ });
87
+ }, 50)) : a.filterable && (g.value = "");
81
88
  });
82
- function le() {
83
- if (r.multiple) {
89
+ function re() {
90
+ if (a.multiple) {
84
91
  if (Array.isArray(t.value) && t.value.length > 0) {
85
- const e = d.value.findIndex((i) => i.value === t.value[0]);
92
+ const e = d.value.findIndex((l) => l.value === t.value[0]);
86
93
  e !== -1 && (u.value = e);
87
94
  }
88
95
  } else {
89
- const e = d.value.findIndex((i) => i.value === t.value);
96
+ const e = d.value.findIndex((l) => l.value === t.value);
90
97
  e !== -1 && (u.value = e);
91
98
  }
92
99
  }
93
- function B(e) {
94
- var i;
95
- R.value && ((i = R.value[e]) == null || i.$el.scrollIntoView({ block: "nearest", inline: "nearest" }));
100
+ function q(e) {
101
+ var l;
102
+ $.value && ((l = $.value[e]) == null || l.$el.scrollIntoView({ block: "nearest", inline: "nearest" }));
96
103
  }
97
- O(u, (e) => {
98
- typeof e < "u" && R.value && B(e);
104
+ _(u, (e) => {
105
+ typeof e < "u" && $.value && q(e);
99
106
  });
100
- function N(e, i = "down") {
101
- if (!L.value || L.value.length === 0) {
107
+ function C(e, l = "down") {
108
+ if (!P.value || P.value.length === 0) {
102
109
  u.value = void 0;
103
110
  return;
104
111
  }
105
- if (typeof e > "u" && (e = i === "down" ? -1 : 1), i === "down") {
106
- let l = e + 1;
107
- for (l > d.value.length - 1 && (l = 0); d.value[l].disabled; )
108
- ++l > d.value.length - 1 && (l = 0);
109
- u.value = l;
112
+ if (typeof e > "u" && (e = l === "down" ? -1 : 1), l === "down") {
113
+ let o = e + 1;
114
+ for (o > d.value.length - 1 && (o = 0); d.value[o].disabled; )
115
+ ++o > d.value.length - 1 && (o = 0);
116
+ u.value = o;
110
117
  } else {
111
- let l = e - 1;
112
- for (l < 0 && (l = d.value.length - 1); d.value[l].disabled; )
113
- --l < 0 && (l = d.value.length - 1);
114
- u.value = l;
118
+ let o = e - 1;
119
+ for (o < 0 && (o = d.value.length - 1); d.value[o].disabled; )
120
+ --o < 0 && (o = d.value.length - 1);
121
+ u.value = o;
115
122
  }
116
123
  }
117
- function E(e) {
118
- var l;
119
- const i = (l = r.options) == null ? void 0 : l.find((o) => o.value === e);
120
- if (!(!i || i.disabled)) {
121
- if (r.multiple)
124
+ function U(e) {
125
+ var o;
126
+ const l = (o = a.options) == null ? void 0 : o.find((i) => i.value === e);
127
+ if (!(!l || l.disabled)) {
128
+ if (a.multiple) {
122
129
  if (Array.isArray(t.value)) {
123
- const o = t.value.indexOf(e);
124
- o !== -1 ? t.value.splice(o, 1) : (t.value.push(e), I("update:modelValue", t.value));
130
+ const i = t.value.indexOf(e);
131
+ i !== -1 ? t.value.splice(i, 1) : (t.value.push(e), I("update:modelValue", t.value));
125
132
  } else
126
133
  t.value = [e];
127
- else
134
+ a.filterable && setTimeout(() => {
135
+ var i;
136
+ (i = D.value) == null || i.focus();
137
+ });
138
+ } else
128
139
  t.value = e;
129
- r.native || X(() => {
130
- var o;
131
- j(), (o = S.value) == null || o.$el.focus();
140
+ a.native || G(() => {
141
+ var i;
142
+ W(), (i = O.value) == null || i.$el.focus();
132
143
  });
133
144
  }
134
145
  }
135
- function T(e) {
146
+ function j(e) {
136
147
  return !!(typeof e > "u" || e === null || e === "" || Array.isArray(e) && e.length === 0 || !Array.isArray(e) && typeof e == "object" && Object.keys(e).length === 0);
137
148
  }
138
- function F(e, i) {
149
+ function M(e, l) {
139
150
  e.stopPropagation();
140
- const l = t.value.indexOf(i);
141
- l !== -1 && (t.value.splice(l, 1), I("update:modelValue", t.value));
151
+ const o = t.value.indexOf(l);
152
+ o !== -1 && (t.value.splice(o, 1), I("update:modelValue", t.value));
142
153
  }
143
- function V(e) {
144
- var l;
145
- const i = (l = r.options) == null ? void 0 : l.find((o) => o.value === e);
146
- return i ? i.label : "";
154
+ function S(e) {
155
+ var o;
156
+ const l = (o = a.options) == null ? void 0 : o.find((i) => i.value === e);
157
+ return l ? l.label : "";
147
158
  }
148
- const { focus: P, blur: ie } = Q(z), {
149
- errorInternal: q,
150
- hideFooterInternal: te,
151
- inputListeners: U,
152
- reset: oe,
153
- validate: j,
154
- setError: ne,
155
- isFocused: re,
156
- isInsideForm: ae
157
- } = D(r, { focus: P, emit: I, withListeners: !0 }), se = w(() => {
158
- const { focus: e, blur: i } = s(U);
159
+ const { focus: X, blur: ae } = le(N), {
160
+ errorInternal: H,
161
+ hideFooterInternal: ne,
162
+ inputListeners: K,
163
+ reset: se,
164
+ validate: W,
165
+ setError: ue,
166
+ isFocused: de,
167
+ isInsideForm: fe
168
+ } = F(a, { focus: X, emit: I, withListeners: !0 }), ve = R(() => {
169
+ const { focus: e, blur: l } = s(K);
159
170
  return {
160
171
  focus: e,
161
- blur: i
172
+ blur: l
162
173
  };
163
174
  });
164
- let v = null;
165
- O([re, y], ([e, i]) => {
166
- e || i ? v || (v = he(document, "keydown", ue)) : v && (v(), v = null);
175
+ let m = null;
176
+ _([de, w], ([e, l]) => {
177
+ e || l ? m || (m = we(document, "keydown", pe)) : m && (m(), m = null);
167
178
  }, {
168
179
  immediate: !0
169
- }), ve(() => {
170
- v && v();
180
+ }), be(() => {
181
+ m && m();
171
182
  });
172
- function ue(e) {
173
- var i, l, o, k, x;
183
+ function pe(e) {
184
+ var l, o, i, f, V;
174
185
  if (d.value.length !== 0)
175
186
  if (e.code === "ArrowDown") {
176
- if (e.preventDefault(), !y.value) {
177
- (i = f.value) == null || i.show();
187
+ if (e.preventDefault(), !w.value) {
188
+ (l = v.value) == null || l.show();
178
189
  return;
179
190
  }
180
- N(u.value, "down");
191
+ C(u.value, "down");
181
192
  } else if (e.code === "ArrowUp") {
182
- if (e.preventDefault(), !y.value) {
183
- (l = f.value) == null || l.show();
193
+ if (e.preventDefault(), !w.value) {
194
+ (o = v.value) == null || o.show();
184
195
  return;
185
196
  }
186
- N(u.value, "up");
197
+ C(u.value, "up");
187
198
  } else if (e.code === "Enter" || e.code === "Space") {
188
- if (e.preventDefault(), e.stopPropagation(), !y.value) {
189
- (o = f.value) == null || o.show();
199
+ if (e.code === "Space" && a.filterable)
200
+ return;
201
+ if (e.preventDefault(), e.stopPropagation(), !w.value) {
202
+ (i = v.value) == null || i.show();
190
203
  return;
191
204
  }
192
- typeof u.value < "u" && (E(d.value[u.value].value), r.multiple || (k = f.value) == null || k.hide());
205
+ typeof u.value < "u" && d.value[u.value] && (U(d.value[u.value].value), a.multiple || (f = v.value) == null || f.hide());
193
206
  } else
194
- e.code === "Tab" && y.value && (e.preventDefault(), (x = f.value) == null || x.hide(), r.native || X(() => {
195
- var M;
196
- (M = S.value) == null || M.$el.focus();
207
+ e.code === "Tab" && w.value && (e.preventDefault(), (V = v.value) == null || V.hide(), a.native || G(() => {
208
+ var x;
209
+ (x = O.value) == null || x.$el.focus();
197
210
  }));
198
211
  }
199
- const { styles: de, classes: b, className: fe } = ge("Select", {}, r, { errorInternal: q });
200
- return Z({ focus: P, blur: ie, reset: oe, validate: j, setError: ne }), (e, i) => (n(), c(Ie, H({
201
- ref_key: "labelRef",
202
- ref: S,
203
- tabindex: "0",
204
- class: ["group", [
205
- s(fe),
206
- s(b).wrapper
207
- ]],
208
- style: s(de),
209
- disabled: e.disabled,
210
- required: e.required,
211
- "is-inside-form": s(ae),
212
- label: e.label,
213
- tooltip: e.tooltip
214
- }, K(se.value)), {
215
- default: h(() => [
216
- _("div", Se, [
217
- e.native && !e.multiple ? (n(), a("div", {
218
- key: 0,
219
- class: A(s(b).box),
220
- onClick: i[0] || (i[0] = (l) => {
221
- var o;
222
- return (o = z.value) == null ? void 0 : o.click();
223
- })
224
- }, [
225
- e.multiple && Array.isArray(t.value) && t.value.length > 0 ? (n(), a("div", Ne, [
226
- (n(!0), a(p, null, $(t.value, (l) => (n(), c(G, {
227
- key: l,
228
- size: "xs",
229
- outlined: "",
230
- removable: "",
231
- onRemove: (o) => {
232
- F(o, l);
233
- }
234
- }, {
235
- default: h(() => [
236
- C(m(V(l)), 1)
237
- ]),
238
- _: 2
239
- }, 1032, ["onRemove"]))), 128))
240
- ])) : !e.multiple && !T(t.value) ? (n(), a(p, { key: 1 }, [
241
- C(m(V(t.value)), 1)
242
- ], 64)) : (n(), a(p, { key: 2 }, [
243
- e.placeholder ? (n(), a("div", Oe, m(e.placeholder), 1)) : (n(), a("div", De, " "))
244
- ], 64))
245
- ], 2)) : (n(), c($e, {
246
- key: 1,
247
- ref_key: "popoverRef",
248
- ref: f,
249
- disabled: e.disabled || e.loading || e.readonly
250
- }, {
251
- content: h(() => [
252
- W(Ce, {
253
- class: A(s(b).content)
254
- }, {
255
- default: h(() => [
256
- d.value.length > 0 ? (n(!0), a(p, { key: 0 }, $(d.value, (l, o) => (n(), c(Ve, {
257
- key: o,
258
- ref_for: !0,
259
- ref_key: "itemsRef",
260
- ref: R,
261
- item: l,
262
- size: e.size,
263
- disabled: l.disabled,
264
- selected: o === u.value,
265
- color: e.color,
266
- filled: "",
267
- onClick: i[1] || (i[1] = () => {
268
- var k;
269
- return !e.multiple && ((k = f.value) == null ? void 0 : k.hide());
270
- })
271
- }, null, 8, ["item", "size", "disabled", "selected", "color"]))), 128)) : (n(), a("div", Te, " No options "))
272
- ]),
273
- _: 1
274
- }, 8, ["class"])
275
- ]),
276
- default: h(() => [
277
- _("div", {
278
- class: A([s(b).box])
279
- }, [
280
- e.multiple && Array.isArray(t.value) && t.value.length > 0 ? (n(), a("div", Le, [
281
- (n(!0), a(p, null, $(t.value, (l) => (n(), c(G, {
282
- key: l,
283
- size: "xs",
284
- outlined: "",
285
- removable: "",
286
- onRemove: (o) => {
287
- F(o, l);
288
- }
289
- }, {
290
- default: h(() => [
291
- C(m(V(l)), 1)
212
+ const { styles: ce, classes: p, className: me } = Ve("Select", {}, a, { errorInternal: H });
213
+ return te({ focus: X, blur: ae, reset: se, validate: W, setError: ue }), (e, l) => {
214
+ const o = he("x-input");
215
+ return r(), b($e, J({
216
+ ref_key: "labelRef",
217
+ ref: O,
218
+ tabindex: "0",
219
+ class: ["group", [
220
+ s(me),
221
+ s(p).wrapper
222
+ ]],
223
+ style: s(ce),
224
+ disabled: e.disabled,
225
+ required: e.required,
226
+ "is-inside-form": s(fe),
227
+ label: e.label,
228
+ tooltip: e.tooltip
229
+ }, Q(ve.value)), {
230
+ default: A(() => [
231
+ z("div", Ne, [
232
+ e.native && !e.multiple ? (r(), n("div", {
233
+ key: 0,
234
+ class: h(s(p).box),
235
+ onClick: l[0] || (l[0] = (i) => {
236
+ var f;
237
+ return (f = N.value) == null ? void 0 : f.click();
238
+ })
239
+ }, [
240
+ e.multiple && Array.isArray(t.value) && t.value.length > 0 ? (r(), n("div", Oe, [
241
+ (r(!0), n(c, null, L(t.value, (i) => (r(), b(Z, {
242
+ key: i,
243
+ size: "xs",
244
+ outlined: "",
245
+ removable: "",
246
+ onRemove: (f) => {
247
+ M(f, i);
248
+ }
249
+ }, {
250
+ default: A(() => [
251
+ B(k(S(i)), 1)
252
+ ]),
253
+ _: 2
254
+ }, 1032, ["onRemove"]))), 128))
255
+ ])) : !e.multiple && !j(t.value) ? (r(), n(c, { key: 1 }, [
256
+ B(k(S(t.value)), 1)
257
+ ], 64)) : (r(), n(c, { key: 2 }, [
258
+ e.placeholder ? (r(), n("div", De, k(e.placeholder), 1)) : (r(), n("div", Te, " "))
259
+ ], 64))
260
+ ], 2)) : (r(), b(ze, {
261
+ key: 1,
262
+ ref_key: "popoverRef",
263
+ ref: v,
264
+ disabled: e.disabled || e.loading || e.readonly
265
+ }, {
266
+ content: A(() => [
267
+ T(Le, {
268
+ class: h(s(p).content)
269
+ }, {
270
+ default: A(() => [
271
+ E(e.$slots, "content-header", {}, () => [
272
+ e.filterable ? (r(), n("div", {
273
+ key: 0,
274
+ class: h(s(p).search)
275
+ }, [
276
+ T(o, {
277
+ ref_key: "filterRef",
278
+ ref: D,
279
+ modelValue: g.value,
280
+ "onUpdate:modelValue": l[1] || (l[1] = (i) => g.value = i),
281
+ placeholder: e.filterPlaceholder,
282
+ "skip-form-registry": "",
283
+ size: "sm"
284
+ }, null, 8, ["modelValue", "placeholder"])
285
+ ], 2)) : Y("", !0)
292
286
  ]),
293
- _: 2
294
- }, 1032, ["onRemove"]))), 128))
295
- ])) : !e.multiple && !T(t.value) ? (n(), a(p, { key: 1 }, [
296
- C(m(V(t.value)), 1)
297
- ], 64)) : (n(), a(p, { key: 2 }, [
298
- e.placeholder ? (n(), a("div", Be, m(e.placeholder), 1)) : (n(), a("div", Ee, " "))
299
- ], 64))
300
- ], 2)
287
+ d.value.length > 0 ? (r(), n("div", {
288
+ key: 0,
289
+ class: h(s(p).contentBody)
290
+ }, [
291
+ (r(!0), n(c, null, L(d.value, (i, f) => (r(), b(Se, {
292
+ key: f,
293
+ ref_for: !0,
294
+ ref_key: "itemsRef",
295
+ ref: $,
296
+ item: i,
297
+ size: e.size,
298
+ disabled: i.disabled,
299
+ selected: f === u.value,
300
+ color: e.color,
301
+ filled: "",
302
+ onClick: l[2] || (l[2] = () => {
303
+ var V;
304
+ return !e.multiple && ((V = v.value) == null ? void 0 : V.hide());
305
+ })
306
+ }, null, 8, ["item", "size", "disabled", "selected", "color"]))), 128))
307
+ ], 2)) : (r(), n("div", qe, " No options ")),
308
+ E(e.$slots, "content-footer")
309
+ ]),
310
+ _: 3
311
+ }, 8, ["class"])
312
+ ]),
313
+ default: A(() => [
314
+ z("div", {
315
+ class: h([s(p).box])
316
+ }, [
317
+ e.multiple && Array.isArray(t.value) && t.value.length > 0 ? (r(), n("div", Ee, [
318
+ (r(!0), n(c, null, L(t.value, (i) => (r(), b(Z, {
319
+ key: i,
320
+ size: "xs",
321
+ outlined: "",
322
+ removable: "",
323
+ onRemove: (f) => {
324
+ M(f, i);
325
+ }
326
+ }, {
327
+ default: A(() => [
328
+ B(k(S(i)), 1)
329
+ ]),
330
+ _: 2
331
+ }, 1032, ["onRemove"]))), 128))
332
+ ])) : !e.multiple && !j(t.value) ? (r(), n(c, { key: 1 }, [
333
+ B(k(S(t.value)), 1)
334
+ ], 64)) : (r(), n(c, { key: 2 }, [
335
+ e.placeholder ? (r(), n("div", Fe, k(e.placeholder), 1)) : (r(), n("div", Pe, " "))
336
+ ], 64))
337
+ ], 2)
338
+ ]),
339
+ _: 3
340
+ }, 8, ["disabled"])),
341
+ ke(z("select", J({
342
+ id: e.id,
343
+ ref_key: "elRef",
344
+ ref: N,
345
+ "onUpdate:modelValue": l[3] || (l[3] = (i) => t.value = i),
346
+ tabindex: "-1",
347
+ class: e.native && !e.multiple ? "absolute inset-0 w-full h-full cursor-pointer opacity-0" : "hidden",
348
+ name: e.name,
349
+ disabled: e.disabled || e.loading,
350
+ multiple: e.multiple,
351
+ readonly: e.readonly
352
+ }, Q(s(K), !0)), [
353
+ (r(!0), n(c, null, L(e.options, (i, f) => (r(), n("option", {
354
+ key: f,
355
+ value: i.value,
356
+ disabled: i.disabled
357
+ }, k(i.label), 9, je))), 128))
358
+ ], 16, Ue), [
359
+ [ge, t.value]
301
360
  ]),
302
- _: 1
303
- }, 8, ["disabled"])),
304
- ce(_("select", H({
305
- id: e.id,
306
- ref_key: "elRef",
307
- ref: z,
308
- "onUpdate:modelValue": i[2] || (i[2] = (l) => t.value = l),
309
- tabindex: "-1",
310
- class: e.native && !e.multiple ? "absolute inset-0 w-full h-full cursor-pointer opacity-0" : "hidden",
311
- name: e.name,
312
- disabled: e.disabled || e.loading,
313
- multiple: e.multiple,
314
- readonly: e.readonly
315
- }, K(s(U), !0)), [
316
- (n(!0), a(p, null, $(e.options, (l, o) => (n(), a("option", {
317
- key: o,
318
- value: l.value,
319
- disabled: l.disabled
320
- }, m(l.label), 9, Pe))), 128))
321
- ], 16, Fe), [
322
- [me, t.value]
361
+ z("div", {
362
+ class: h(s(p).iconWrapper)
363
+ }, [
364
+ e.loading ? (r(), b(_e, {
365
+ key: 0,
366
+ size: e.size
367
+ }, null, 8, ["size"])) : E(e.$slots, "icon", { key: 1 }, () => [
368
+ T(Ce, {
369
+ icon: s(Ie),
370
+ class: h([s(p).icon])
371
+ }, null, 8, ["icon", "class"])
372
+ ])
373
+ ], 2)
323
374
  ]),
324
- _("div", {
325
- class: A(s(b).iconWrapper)
326
- }, [
327
- e.loading ? (n(), c(_e, {
328
- key: 0,
329
- size: e.size
330
- }, null, 8, ["size"])) : ye(e.$slots, "icon", { key: 1 }, () => [
331
- W(Re, {
332
- icon: s(Ae),
333
- class: A([s(b).icon])
334
- }, null, 8, ["icon", "class"])
335
- ])
336
- ], 2)
375
+ s(ne) ? Y("", !0) : (r(), b(Be, {
376
+ key: 0,
377
+ error: s(H),
378
+ helper: e.helper
379
+ }, null, 8, ["error", "helper"]))
337
380
  ]),
338
- s(te) ? be("", !0) : (n(), c(ze, {
339
- key: 0,
340
- error: s(q),
341
- helper: e.helper
342
- }, null, 8, ["error", "helper"]))
343
- ]),
344
- _: 3
345
- }, 16, ["style", "disabled", "required", "is-inside-form", "label", "class", "tooltip"]));
381
+ _: 3
382
+ }, 16, ["style", "disabled", "required", "is-inside-form", "label", "class", "tooltip"]);
383
+ };
346
384
  }
347
385
  });
348
386
  export {
349
- nl as default
387
+ sl as default
350
388
  };