@scalar/components 0.12.76 → 0.13.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.
- package/dist/components/ScalarButton/ScalarButton.stories.d.ts +3 -0
- package/dist/components/ScalarButton/ScalarButton.stories.d.ts.map +1 -1
- package/dist/components/ScalarButton/ScalarButton.vue.d.ts.map +1 -1
- package/dist/components/ScalarButton/ScalarButton.vue.js +29 -32
- package/dist/components/ScalarCombobox/ScalarCombobox.stories.d.ts +30 -5
- package/dist/components/ScalarCombobox/ScalarCombobox.stories.d.ts.map +1 -1
- package/dist/components/ScalarCombobox/ScalarCombobox.vue.d.ts +24 -7
- package/dist/components/ScalarCombobox/ScalarCombobox.vue.d.ts.map +1 -1
- package/dist/components/ScalarCombobox/ScalarCombobox.vue.js +34 -18
- package/dist/components/ScalarCombobox/ScalarComboboxMultiselect.vue.d.ts +16 -82
- package/dist/components/ScalarCombobox/ScalarComboboxMultiselect.vue.d.ts.map +1 -1
- package/dist/components/ScalarCombobox/ScalarComboboxMultiselect.vue.js +23 -22
- package/dist/components/ScalarCombobox/ScalarComboboxOption.vue.d.ts +7 -2
- package/dist/components/ScalarCombobox/ScalarComboboxOption.vue.d.ts.map +1 -1
- package/dist/components/ScalarCombobox/ScalarComboboxOption.vue.js +23 -28
- package/dist/components/ScalarCombobox/ScalarComboboxOptions.vue.d.ts +25 -1
- package/dist/components/ScalarCombobox/ScalarComboboxOptions.vue.d.ts.map +1 -1
- package/dist/components/ScalarCombobox/ScalarComboboxOptions.vue.js +58 -56
- package/dist/components/ScalarCombobox/ScalarComboboxPopover.vue.d.ts +5 -11
- package/dist/components/ScalarCombobox/ScalarComboboxPopover.vue.d.ts.map +1 -1
- package/dist/components/ScalarCombobox/ScalarComboboxPopover.vue.js +43 -43
- package/dist/components/ScalarCombobox/types.d.ts +4 -2
- package/dist/components/ScalarCombobox/types.d.ts.map +1 -1
- package/dist/components/ScalarCombobox/types.js +8 -3
- package/dist/components/ScalarDropdown/ScalarDropdown.stories.d.ts +73 -105
- package/dist/components/ScalarDropdown/ScalarDropdown.stories.d.ts.map +1 -1
- package/dist/components/ScalarDropdown/ScalarDropdown.vue.d.ts +40 -22
- package/dist/components/ScalarDropdown/ScalarDropdown.vue.d.ts.map +1 -1
- package/dist/components/ScalarDropdown/ScalarDropdown.vue.js +32 -42
- package/dist/components/ScalarDropdown/ScalarDropdownButton.vue.d.ts +35 -0
- package/dist/components/ScalarDropdown/ScalarDropdownButton.vue.d.ts.map +1 -0
- package/dist/components/ScalarDropdown/ScalarDropdownButton.vue.js +7 -0
- package/dist/components/ScalarDropdown/ScalarDropdownButton.vue2.js +37 -0
- package/dist/components/ScalarDropdown/ScalarDropdownDivider.vue.d.ts +17 -1
- package/dist/components/ScalarDropdown/ScalarDropdownDivider.vue.d.ts.map +1 -1
- package/dist/components/ScalarDropdown/ScalarDropdownDivider.vue.js +7 -6
- package/dist/components/ScalarDropdown/ScalarDropdownDivider.vue2.js +4 -0
- package/dist/components/ScalarDropdown/ScalarDropdownItem.vue.d.ts +18 -15
- package/dist/components/ScalarDropdown/ScalarDropdownItem.vue.d.ts.map +1 -1
- package/dist/components/ScalarDropdown/ScalarDropdownItem.vue.js +2 -2
- package/dist/components/ScalarDropdown/ScalarDropdownItem.vue2.js +19 -29
- package/dist/components/ScalarDropdown/ScalarDropdownMenu.vue.d.ts +32 -0
- package/dist/components/ScalarDropdown/ScalarDropdownMenu.vue.d.ts.map +1 -0
- package/dist/components/ScalarDropdown/ScalarDropdownMenu.vue.js +28 -0
- package/dist/components/ScalarDropdown/ScalarDropdownMenu.vue2.js +4 -0
- package/dist/components/ScalarDropdown/index.d.ts +2 -0
- package/dist/components/ScalarDropdown/index.d.ts.map +1 -1
- package/dist/components/ScalarErrorBoundary/ScalarErrorBoundary.spec.d.ts +2 -0
- package/dist/components/ScalarErrorBoundary/ScalarErrorBoundary.spec.d.ts.map +1 -0
- package/dist/components/ScalarErrorBoundary/ScalarErrorBoundary.stories.d.ts +6 -0
- package/dist/components/ScalarErrorBoundary/ScalarErrorBoundary.stories.d.ts.map +1 -0
- package/dist/components/ScalarErrorBoundary/ScalarErrorBoundary.vue.d.ts +18 -0
- package/dist/components/ScalarErrorBoundary/ScalarErrorBoundary.vue.d.ts.map +1 -0
- package/dist/components/ScalarErrorBoundary/ScalarErrorBoundary.vue.js +23 -0
- package/dist/components/ScalarErrorBoundary/ScalarErrorBoundary.vue2.js +4 -0
- package/dist/components/ScalarErrorBoundary/index.d.ts +2 -0
- package/dist/components/ScalarErrorBoundary/index.d.ts.map +1 -0
- package/dist/components/ScalarFloating/ScalarFloating.stories.d.ts +4 -0
- package/dist/components/ScalarFloating/ScalarFloating.stories.d.ts.map +1 -1
- package/dist/components/ScalarFloating/ScalarFloating.vue.d.ts +5 -4
- package/dist/components/ScalarFloating/ScalarFloating.vue.d.ts.map +1 -1
- package/dist/components/ScalarFloating/ScalarFloating.vue.js +32 -29
- package/dist/components/ScalarFloating/index.d.ts +1 -1
- package/dist/components/ScalarFloating/index.d.ts.map +1 -1
- package/dist/components/ScalarFloating/types.d.ts +15 -7
- package/dist/components/ScalarFloating/types.d.ts.map +1 -1
- package/dist/components/ScalarFloating/useResizeWithTarget.d.ts +3 -0
- package/dist/components/ScalarFloating/useResizeWithTarget.d.ts.map +1 -1
- package/dist/components/ScalarIcon/ScalarIcon.stories.d.ts +1 -0
- package/dist/components/ScalarIcon/ScalarIcon.stories.d.ts.map +1 -1
- package/dist/components/ScalarIcon/ScalarIcon.vue.d.ts.map +1 -1
- package/dist/components/ScalarIcon/ScalarIcon.vue.js +2 -2
- package/dist/components/ScalarIcon/ScalarIcon.vue2.js +18 -15
- package/dist/components/ScalarIcon/icons/Hide.svg.js +10 -9
- package/dist/components/ScalarIcon/icons/Show.svg.js +7 -8
- package/dist/components/ScalarIconButton/ScalarIconButton.stories.d.ts +10 -7
- package/dist/components/ScalarIconButton/ScalarIconButton.stories.d.ts.map +1 -1
- package/dist/components/ScalarIconButton/ScalarIconButton.vue.d.ts +1 -1
- package/dist/components/ScalarIconButton/ScalarIconButton.vue.d.ts.map +1 -1
- package/dist/components/ScalarIconButton/ScalarIconButton.vue.js +19 -21
- package/dist/components/ScalarListbox/ScalarListbox.stories.d.ts +52 -25
- package/dist/components/ScalarListbox/ScalarListbox.stories.d.ts.map +1 -1
- package/dist/components/ScalarListbox/ScalarListbox.vue.d.ts +41 -22
- package/dist/components/ScalarListbox/ScalarListbox.vue.d.ts.map +1 -1
- package/dist/components/ScalarListbox/ScalarListbox.vue.js +46 -85
- package/dist/components/ScalarListbox/ScalarListboxCheckbox.vue.d.ts +8 -0
- package/dist/components/ScalarListbox/ScalarListboxCheckbox.vue.d.ts.map +1 -0
- package/dist/components/ScalarListbox/ScalarListboxCheckbox.vue.js +26 -0
- package/dist/components/ScalarListbox/ScalarListboxCheckbox.vue2.js +4 -0
- package/dist/components/ScalarListbox/ScalarListboxItem.vue.d.ts +8 -0
- package/dist/components/ScalarListbox/ScalarListboxItem.vue.d.ts.map +1 -0
- package/dist/components/ScalarListbox/ScalarListboxItem.vue.js +53 -0
- package/dist/components/ScalarListbox/ScalarListboxItem.vue2.js +4 -0
- package/dist/components/ScalarListbox/index.d.ts +3 -1
- package/dist/components/ScalarListbox/index.d.ts.map +1 -1
- package/dist/components/ScalarListbox/types.d.ts +1 -0
- package/dist/components/ScalarListbox/types.d.ts.map +1 -1
- package/dist/components/ScalarLoading/ScalarLoading.stories.d.ts +28 -6
- package/dist/components/ScalarLoading/ScalarLoading.stories.d.ts.map +1 -1
- package/dist/components/ScalarLoading/ScalarLoading.vue.d.ts +2 -2
- package/dist/components/ScalarLoading/ScalarLoading.vue.d.ts.map +1 -1
- package/dist/components/ScalarLoading/ScalarLoading.vue.js +3 -3
- package/dist/components/ScalarLoading/ScalarLoading.vue2.js +29 -30
- package/dist/components/ScalarMenu/ScalarMenu.stories.d.ts +133 -108
- package/dist/components/ScalarMenu/ScalarMenu.stories.d.ts.map +1 -1
- package/dist/components/ScalarMenu/ScalarMenu.vue.d.ts +34 -18
- package/dist/components/ScalarMenu/ScalarMenu.vue.d.ts.map +1 -1
- package/dist/components/ScalarMenu/ScalarMenu.vue.js +22 -20
- package/dist/components/ScalarMenu/ScalarMenuButton.vue.d.ts +2 -2
- package/dist/components/ScalarMenu/ScalarMenuButton.vue.d.ts.map +1 -1
- package/dist/components/ScalarMenu/ScalarMenuButton.vue.js +25 -17
- package/dist/components/ScalarMenu/ScalarMenuLink.vue.d.ts.map +1 -1
- package/dist/components/ScalarMenu/ScalarMenuLink.vue.js +17 -10
- package/dist/components/ScalarMenu/ScalarMenuProduct.vue.d.ts +2 -2
- package/dist/components/ScalarMenu/ScalarMenuProduct.vue.d.ts.map +1 -1
- package/dist/components/ScalarMenu/ScalarMenuProduct.vue.js +22 -16
- package/dist/components/ScalarMenu/ScalarMenuProducts.vue.d.ts +1 -1
- package/dist/components/ScalarMenu/ScalarMenuProducts.vue.d.ts.map +1 -1
- package/dist/components/ScalarMenu/ScalarMenuProducts.vue.js +25 -22
- package/dist/components/ScalarMenu/ScalarMenuResources.vue.d.ts +1 -1
- package/dist/components/ScalarMenu/ScalarMenuResources.vue.js +3 -3
- package/dist/components/ScalarMenu/ScalarMenuSection.vue.d.ts +2 -2
- package/dist/components/ScalarMenu/ScalarMenuSection.vue.d.ts.map +1 -1
- package/dist/components/ScalarMenu/ScalarMenuSection.vue.js +18 -15
- package/dist/components/ScalarMenu/ScalarMenuSection.vue2.js +4 -0
- package/dist/components/ScalarMenu/ScalarMenuTeamPicker.vue.d.ts +1 -1
- package/dist/components/ScalarMenu/ScalarMenuTeamPicker.vue.d.ts.map +1 -1
- package/dist/components/ScalarMenu/ScalarMenuTeamPicker.vue.js +18 -16
- package/dist/components/ScalarModal/ScalarModal.stories.d.ts +3 -3
- package/dist/components/ScalarModal/ScalarModal.vue.d.ts +2 -2
- package/dist/components/ScalarPopover/ScalarPopover.stories.d.ts +20 -116
- package/dist/components/ScalarPopover/ScalarPopover.stories.d.ts.map +1 -1
- package/dist/components/ScalarPopover/ScalarPopover.vue.d.ts +4 -11
- package/dist/components/ScalarPopover/ScalarPopover.vue.d.ts.map +1 -1
- package/dist/components/ScalarPopover/ScalarPopover.vue.js +23 -24
- package/dist/components/ScalarPopover/index.d.ts +1 -0
- package/dist/components/ScalarPopover/index.d.ts.map +1 -1
- package/dist/components/ScalarPopover/types.d.ts +15 -0
- package/dist/components/ScalarPopover/types.d.ts.map +1 -0
- package/dist/components/ScalarSearchInput/ScalarSearchInput.stories.d.ts +6 -1
- package/dist/components/ScalarSearchInput/ScalarSearchInput.stories.d.ts.map +1 -1
- package/dist/components/ScalarSearchInput/ScalarSearchInput.vue.js +3 -3
- package/dist/components/ScalarSearchInput/ScalarSearchInput.vue2.js +10 -10
- package/dist/components/ScalarSearchResults/ScalarSearchResultItem.vue.d.ts.map +1 -1
- package/dist/components/ScalarSearchResults/ScalarSearchResultItem.vue.js +31 -35
- package/dist/components/ScalarSearchResults/ScalarSearchResultList.vue.d.ts.map +1 -1
- package/dist/components/ScalarSearchResults/ScalarSearchResultList.vue.js +12 -18
- package/dist/components/ScalarToggle/ScalarToggle.stories.d.ts +26 -39
- package/dist/components/ScalarToggle/ScalarToggle.stories.d.ts.map +1 -1
- package/dist/components/ScalarToggle/ScalarToggle.vue.d.ts +3 -5
- package/dist/components/ScalarToggle/ScalarToggle.vue.d.ts.map +1 -1
- package/dist/components/ScalarToggle/ScalarToggle.vue.js +24 -35
- package/dist/hooks/useBindCx.d.ts +51 -0
- package/dist/hooks/useBindCx.d.ts.map +1 -0
- package/dist/hooks/useBindCx.js +34 -0
- package/dist/hooks/useBindCx.stories.d.ts +430 -0
- package/dist/hooks/useBindCx.stories.d.ts.map +1 -0
- package/dist/hooks/useBindCx.test.d.ts +2 -0
- package/dist/hooks/useBindCx.test.d.ts.map +1 -0
- package/dist/index.d.ts +3 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +80 -68
- package/dist/style.css +1 -1
- package/package.json +3 -3
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { cva as
|
|
3
|
-
import
|
|
4
|
-
|
|
1
|
+
import { defineComponent as s, openBlock as l, createElementBlock as a, normalizeClass as n, unref as t, createVNode as i, normalizeStyle as c, createElementVNode as m, renderSlot as p, createBlock as d, withModifiers as u, createCommentVNode as f } from "vue";
|
|
2
|
+
import { cva as y, cx as b } from "../../cva.js";
|
|
3
|
+
import v from "../ScalarListbox/ScalarListboxCheckbox.vue.js";
|
|
4
|
+
import k from "../ScalarIcon/ScalarIcon.vue.js";
|
|
5
|
+
const g = { class: "inline-block min-w-0 flex-1 truncate text-c-1" }, w = /* @__PURE__ */ s({
|
|
5
6
|
__name: "ScalarComboboxOption",
|
|
6
7
|
props: {
|
|
7
8
|
active: { type: Boolean },
|
|
@@ -9,11 +10,13 @@ const k = { class: "inline-block min-w-0 flex-1 truncate text-c-1" }, C = /* @__
|
|
|
9
10
|
style: {},
|
|
10
11
|
isDeletable: { type: Boolean }
|
|
11
12
|
},
|
|
12
|
-
|
|
13
|
-
|
|
13
|
+
emits: ["delete"],
|
|
14
|
+
setup(B) {
|
|
15
|
+
const r = y({
|
|
14
16
|
base: [
|
|
17
|
+
// Group
|
|
18
|
+
"group/item",
|
|
15
19
|
// Layout
|
|
16
|
-
"group",
|
|
17
20
|
"flex min-w-0 items-center gap-1.5 rounded px-2 py-1.5 text-left",
|
|
18
21
|
// Text / background style
|
|
19
22
|
"truncate bg-transparent text-c-1",
|
|
@@ -25,35 +28,27 @@ const k = { class: "inline-block min-w-0 flex-1 truncate text-c-1" }, C = /* @__
|
|
|
25
28
|
active: { true: "bg-b-2" }
|
|
26
29
|
}
|
|
27
30
|
});
|
|
28
|
-
return (e, o) => (
|
|
29
|
-
class:
|
|
31
|
+
return (e, o) => (l(), a("li", {
|
|
32
|
+
class: n(t(b)(t(r)({ active: e.active, selected: e.selected })))
|
|
30
33
|
}, [
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
p(t(n), {
|
|
38
|
-
class: "relative top-[0.5px] size-2.5",
|
|
39
|
-
icon: "Checkmark",
|
|
40
|
-
thickness: "2.5"
|
|
41
|
-
})
|
|
42
|
-
], 2),
|
|
43
|
-
a("span", k, [
|
|
44
|
-
d(e.$slots, "default")
|
|
34
|
+
i(t(v), {
|
|
35
|
+
selected: e.selected,
|
|
36
|
+
style: c(e.style)
|
|
37
|
+
}, null, 8, ["selected", "style"]),
|
|
38
|
+
m("span", g, [
|
|
39
|
+
p(e.$slots, "default")
|
|
45
40
|
]),
|
|
46
|
-
e.isDeletable ? (
|
|
41
|
+
e.isDeletable ? (l(), d(t(k), {
|
|
47
42
|
key: 0,
|
|
48
|
-
class: "text-c-2 opacity-0 group-hover:opacity-100",
|
|
43
|
+
class: "text-c-2 opacity-0 group-hover/item:opacity-100",
|
|
49
44
|
icon: "Delete",
|
|
50
45
|
size: "md",
|
|
51
46
|
thickness: "1.5",
|
|
52
|
-
onClick: o[0] || (o[0] = u((
|
|
53
|
-
})) :
|
|
47
|
+
onClick: o[0] || (o[0] = u((x) => e.$emit("delete"), ["stop"]))
|
|
48
|
+
})) : f("", !0)
|
|
54
49
|
], 2));
|
|
55
50
|
}
|
|
56
51
|
});
|
|
57
52
|
export {
|
|
58
|
-
|
|
53
|
+
w as default
|
|
59
54
|
};
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { type Slot } from 'vue';
|
|
1
2
|
import { type Option, type OptionGroup } from './types.js';
|
|
2
3
|
type __VLS_Props = {
|
|
3
4
|
options: Option[] | OptionGroup[];
|
|
@@ -7,12 +8,35 @@ type __VLS_Props = {
|
|
|
7
8
|
multiselect?: boolean;
|
|
8
9
|
isDeletable?: boolean;
|
|
9
10
|
};
|
|
10
|
-
declare
|
|
11
|
+
declare function __VLS_template(): {
|
|
12
|
+
attrs: Partial<{}>;
|
|
13
|
+
slots: Readonly<{
|
|
14
|
+
/** A slot for contents before the combobox options */
|
|
15
|
+
before(): Slot;
|
|
16
|
+
/** A slot for contents after the combobox options */
|
|
17
|
+
after(): Slot;
|
|
18
|
+
}> & {
|
|
19
|
+
/** A slot for contents before the combobox options */
|
|
20
|
+
before(): Slot;
|
|
21
|
+
/** A slot for contents after the combobox options */
|
|
22
|
+
after(): Slot;
|
|
23
|
+
};
|
|
24
|
+
refs: {};
|
|
25
|
+
rootEl: any;
|
|
26
|
+
};
|
|
27
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
28
|
+
declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
11
29
|
delete: (option: Option) => any;
|
|
12
30
|
"update:modelValue": (v: Option[]) => any;
|
|
13
31
|
}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
14
32
|
onDelete?: ((option: Option) => any) | undefined;
|
|
15
33
|
"onUpdate:modelValue"?: ((v: Option[]) => any) | undefined;
|
|
16
34
|
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
35
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
17
36
|
export default _default;
|
|
37
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
38
|
+
new (): {
|
|
39
|
+
$slots: S;
|
|
40
|
+
};
|
|
41
|
+
};
|
|
18
42
|
//# sourceMappingURL=ScalarComboboxOptions.vue.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScalarComboboxOptions.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCombobox/ScalarComboboxOptions.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ScalarComboboxOptions.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCombobox/ScalarComboboxOptions.vue"],"names":[],"mappings":"AAiKA,OAAO,EAAE,KAAK,IAAI,EAAwB,MAAM,KAAK,CAAA;AAIrD,OAAO,EAAE,KAAK,MAAM,EAAE,KAAK,WAAW,EAAY,MAAM,SAAS,CAAA;AAIjE,KAAK,WAAW,GAAG;IACjB,OAAO,EAAE,MAAM,EAAE,GAAG,WAAW,EAAE,CAAA;IACjC,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB,CAAC;AA8FF,iBAAS,cAAc;WA2JT,OAAO,IAA6B;;QA/OhD,sDAAsD;kBAC5C,IAAI;QACd,qDAAqD;iBAC5C,IAAI;;QAHb,sDAAsD;kBAC5C,IAAI;QACd,qDAAqD;iBAC5C,IAAI;;;;EAiPd;AAmBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;kFAOnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAWpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { nanoid as
|
|
3
|
-
import
|
|
4
|
-
import { isGroups as
|
|
5
|
-
import
|
|
6
|
-
const
|
|
1
|
+
import { defineComponent as T, computed as f, ref as C, watch as S, openBlock as a, createElementBlock as u, Fragment as m, createElementVNode as x, createVNode as q, unref as w, withDirectives as g, withKeys as $, withModifiers as b, vModelText as F, renderSlot as B, renderList as M, toDisplayString as I, createCommentVNode as N, createBlock as G, normalizeStyle as O, withCtx as U, createTextVNode as j, vShow as H } from "vue";
|
|
2
|
+
import { nanoid as J } from "nanoid";
|
|
3
|
+
import P from "./ScalarComboboxOption.vue.js";
|
|
4
|
+
import { isGroups as L } from "./types.js";
|
|
5
|
+
import Q from "../ScalarIcon/ScalarIcon.vue.js";
|
|
6
|
+
const R = { class: "relative flex" }, W = ["aria-controls", "placeholder"], X = ["id"], Y = {
|
|
7
7
|
key: 0,
|
|
8
8
|
class: "min-w-0 truncate px-2 py-1.5 text-left text-c-2"
|
|
9
|
-
},
|
|
9
|
+
}, oe = /* @__PURE__ */ T({
|
|
10
10
|
inheritAttrs: !1,
|
|
11
11
|
__name: "ScalarComboboxOptions",
|
|
12
12
|
props: {
|
|
@@ -18,44 +18,44 @@ const P = { class: "relative flex" }, Q = ["aria-controls", "placeholder"], R =
|
|
|
18
18
|
isDeletable: { type: Boolean }
|
|
19
19
|
},
|
|
20
20
|
emits: ["update:modelValue", "delete"],
|
|
21
|
-
setup(
|
|
22
|
-
var
|
|
23
|
-
const o =
|
|
24
|
-
() =>
|
|
25
|
-
),
|
|
26
|
-
() =>
|
|
27
|
-
),
|
|
28
|
-
|
|
21
|
+
setup(z, { emit: A }) {
|
|
22
|
+
var D;
|
|
23
|
+
const o = z, E = A, h = J(), y = f(
|
|
24
|
+
() => L(o.options) ? o.options.flatMap((e) => e.options) : o.options
|
|
25
|
+
), K = f(
|
|
26
|
+
() => L(o.options) ? o.options : [{ label: "", options: o.options }]
|
|
27
|
+
), i = C(""), r = C(((D = o.modelValue) == null ? void 0 : D[0]) ?? y.value[0]);
|
|
28
|
+
S(
|
|
29
29
|
() => o.open,
|
|
30
|
-
() =>
|
|
31
|
-
),
|
|
32
|
-
() =>
|
|
33
|
-
() => r.value =
|
|
30
|
+
() => i.value = ""
|
|
31
|
+
), S(
|
|
32
|
+
() => i.value,
|
|
33
|
+
() => r.value = v.value[0]
|
|
34
34
|
);
|
|
35
|
-
const
|
|
36
|
-
() =>
|
|
37
|
-
),
|
|
35
|
+
const v = f(
|
|
36
|
+
() => i.value === "" ? y.value : y.value.filter((e) => e.label.toLowerCase().includes(i.value.toLowerCase()))
|
|
37
|
+
), s = f({
|
|
38
38
|
get: () => o.modelValue ?? [],
|
|
39
|
-
set: (e) => e &&
|
|
39
|
+
set: (e) => e && E("update:modelValue", e)
|
|
40
40
|
});
|
|
41
|
-
function
|
|
42
|
-
o.multiselect ?
|
|
41
|
+
function k(e) {
|
|
42
|
+
o.multiselect ? s.value.some((t) => t.id === e.id) ? s.value = s.value.filter((t) => t.id !== e.id) : s.value = [...s.value, e] : s.value = [e];
|
|
43
43
|
}
|
|
44
|
-
function
|
|
45
|
-
const t =
|
|
46
|
-
|
|
44
|
+
function V(e) {
|
|
45
|
+
const t = v.value, c = t.findIndex((l) => l.id === r.value.id) + e;
|
|
46
|
+
c < 0 || c > t.length - 1 || (r.value = t[c]);
|
|
47
47
|
}
|
|
48
|
-
return (e, t) => (
|
|
49
|
-
|
|
50
|
-
|
|
48
|
+
return (e, t) => (a(), u(m, null, [
|
|
49
|
+
x("div", R, [
|
|
50
|
+
q(w(Q), {
|
|
51
51
|
class: "pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 text-c-3",
|
|
52
52
|
icon: "Search",
|
|
53
53
|
size: "sm"
|
|
54
54
|
}),
|
|
55
|
-
|
|
56
|
-
"onUpdate:modelValue": t[0] || (t[0] = (n) =>
|
|
55
|
+
g(x("input", {
|
|
56
|
+
"onUpdate:modelValue": t[0] || (t[0] = (n) => i.value = n),
|
|
57
57
|
"aria-autocomplete": "list",
|
|
58
|
-
"aria-controls": w(
|
|
58
|
+
"aria-controls": w(h),
|
|
59
59
|
class: "min-w-0 flex-1 rounded-none border-0 py-2.5 pl-8 pr-3 leading-none text-c-1 outline-none",
|
|
60
60
|
"data-1p-ignore": "",
|
|
61
61
|
placeholder: e.placeholder,
|
|
@@ -63,52 +63,54 @@ const P = { class: "relative flex" }, Q = ["aria-controls", "placeholder"], R =
|
|
|
63
63
|
tabindex: "0",
|
|
64
64
|
type: "text",
|
|
65
65
|
onKeydown: [
|
|
66
|
-
t[1] || (t[1] =
|
|
67
|
-
t[2] || (t[2] =
|
|
68
|
-
t[3] || (t[3] =
|
|
66
|
+
t[1] || (t[1] = $(b((n) => V(1), ["prevent"]), ["down"])),
|
|
67
|
+
t[2] || (t[2] = $(b((n) => k(r.value), ["prevent"]), ["enter"])),
|
|
68
|
+
t[3] || (t[3] = $(b((n) => V(-1), ["prevent"]), ["up"]))
|
|
69
69
|
]
|
|
70
|
-
}, null, 40,
|
|
71
|
-
[
|
|
70
|
+
}, null, 40, W), [
|
|
71
|
+
[F, i.value]
|
|
72
72
|
])
|
|
73
73
|
]),
|
|
74
|
-
|
|
75
|
-
id: w(
|
|
74
|
+
g(x("ul", {
|
|
75
|
+
id: w(h),
|
|
76
76
|
class: "border-t p-0.75"
|
|
77
77
|
}, [
|
|
78
|
-
|
|
78
|
+
B(e.$slots, "before"),
|
|
79
|
+
(a(!0), u(m, null, M(K.value, (n, c) => (a(), u(m, { key: c }, [
|
|
79
80
|
n.label && // Only show the group label if there are some results
|
|
80
|
-
n.options.some((l) =>
|
|
81
|
-
(
|
|
81
|
+
n.options.some((l) => v.value.some((p) => p.id === l.id)) ? (a(), u("div", Y, I(n.label), 1)) : N("", !0),
|
|
82
|
+
(a(!0), u(m, null, M(v.value, (l) => {
|
|
82
83
|
var p;
|
|
83
|
-
return
|
|
84
|
+
return a(), u(m, {
|
|
84
85
|
key: l.id
|
|
85
86
|
}, [
|
|
86
|
-
n.options.some((d) => d.id === l.id) ? (
|
|
87
|
+
n.options.some((d) => d.id === l.id) ? (a(), G(P, {
|
|
87
88
|
key: 0,
|
|
88
89
|
active: ((p = r.value) == null ? void 0 : p.id) === l.id,
|
|
89
90
|
isDeletable: l.isDeletable ?? e.isDeletable,
|
|
90
|
-
selected:
|
|
91
|
-
style:
|
|
92
|
-
onClick: (d) =>
|
|
91
|
+
selected: s.value.some((d) => d.id === l.id),
|
|
92
|
+
style: O(e.multiselect ? "checkbox" : "radio"),
|
|
93
|
+
onClick: (d) => k(l),
|
|
93
94
|
onDelete: (d) => e.$emit("delete", l),
|
|
94
95
|
onMousedown: t[4] || (t[4] = b(() => {
|
|
95
96
|
}, ["prevent"])),
|
|
96
97
|
onMouseenter: (d) => r.value = l
|
|
97
98
|
}, {
|
|
98
|
-
default:
|
|
99
|
-
|
|
99
|
+
default: U(() => [
|
|
100
|
+
j(I(l.label), 1)
|
|
100
101
|
]),
|
|
101
102
|
_: 2
|
|
102
|
-
}, 1032, ["active", "isDeletable", "selected", "style", "onClick", "onDelete", "onMouseenter"])) :
|
|
103
|
+
}, 1032, ["active", "isDeletable", "selected", "style", "onClick", "onDelete", "onMouseenter"])) : N("", !0)
|
|
103
104
|
], 64);
|
|
104
105
|
}), 128))
|
|
105
|
-
], 64))), 128))
|
|
106
|
-
|
|
107
|
-
|
|
106
|
+
], 64))), 128)),
|
|
107
|
+
B(e.$slots, "after")
|
|
108
|
+
], 8, X), [
|
|
109
|
+
[H, v.value.length || e.$slots.before || e.$slots.after]
|
|
108
110
|
])
|
|
109
111
|
], 64));
|
|
110
112
|
}
|
|
111
113
|
});
|
|
112
114
|
export {
|
|
113
|
-
|
|
115
|
+
oe as default
|
|
114
116
|
};
|
|
@@ -1,14 +1,8 @@
|
|
|
1
|
-
import { type
|
|
2
|
-
type
|
|
1
|
+
import { type ScalarFloatingOptions } from '../ScalarFloating';
|
|
2
|
+
import type { ScalarPopoverSlots } from '../ScalarPopover';
|
|
3
3
|
declare function __VLS_template(): {
|
|
4
4
|
attrs: Partial<{}>;
|
|
5
|
-
slots:
|
|
6
|
-
default?(_: {}): any;
|
|
7
|
-
popover?(_: {
|
|
8
|
-
close: any;
|
|
9
|
-
open: any;
|
|
10
|
-
}): any;
|
|
11
|
-
};
|
|
5
|
+
slots: Readonly<ScalarPopoverSlots> & ScalarPopoverSlots;
|
|
12
6
|
refs: {
|
|
13
7
|
popoverButtonRef: import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
|
|
14
8
|
as: {
|
|
@@ -60,7 +54,7 @@ declare function __VLS_template(): {
|
|
|
60
54
|
rootEl: any;
|
|
61
55
|
};
|
|
62
56
|
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
63
|
-
declare const __VLS_component: import("vue").DefineComponent<
|
|
57
|
+
declare const __VLS_component: import("vue").DefineComponent<ScalarFloatingOptions, {
|
|
64
58
|
popoverButtonRef: import("vue").Ref<import("vue").DefineComponent<{
|
|
65
59
|
as: {
|
|
66
60
|
type: (ObjectConstructor | StringConstructor)[];
|
|
@@ -126,7 +120,7 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
|
|
|
126
120
|
as: string | Record<string, any>;
|
|
127
121
|
disabled: boolean;
|
|
128
122
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any> | null>;
|
|
129
|
-
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<
|
|
123
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ScalarFloatingOptions> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
130
124
|
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
131
125
|
export default _default;
|
|
132
126
|
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScalarComboboxPopover.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCombobox/ScalarComboboxPopover.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ScalarComboboxPopover.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCombobox/ScalarComboboxPopover.vue"],"names":[],"mappings":"AA+DA,OAAO,EAAkB,KAAK,qBAAqB,EAAE,MAAM,mBAAmB,CAAA;AAC9E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AA8B1D,iBAAS,cAAc;WAwGT,OAAO,IAA6B;;;;;;;;;;;;;;;;0BA3IlD,KA1B6B,eA0B7B,KAzBkB,uBAyBlB,KAxBwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAwKvB;AAeD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;;oBAhKrB,KA1B6B,eA0B7B,KAzBkB,uBAyBlB,KAxBwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;8PA+LtB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAWpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
|
|
@@ -1,65 +1,65 @@
|
|
|
1
|
-
import { defineComponent as m, ref as
|
|
2
|
-
import { Popover as
|
|
3
|
-
import
|
|
4
|
-
|
|
1
|
+
import { defineComponent as m, ref as c, openBlock as v, createBlock as y, unref as t, withCtx as r, createVNode as l, normalizeProps as w, guardReactiveProps as _, createSlots as b, renderSlot as s, mergeProps as g, createElementVNode as B } from "vue";
|
|
2
|
+
import { Popover as P, PopoverButton as k, PopoverPanel as x } from "@headlessui/vue";
|
|
3
|
+
import { useBindCx as h } from "../../hooks/useBindCx.js";
|
|
4
|
+
import C from "../ScalarFloating/ScalarFloating.vue.js";
|
|
5
|
+
const K = /* @__PURE__ */ m({
|
|
5
6
|
inheritAttrs: !1,
|
|
6
7
|
__name: "ScalarComboboxPopover",
|
|
7
8
|
props: {
|
|
8
9
|
placement: {},
|
|
9
10
|
resize: { type: Boolean },
|
|
10
|
-
|
|
11
|
-
|
|
11
|
+
target: {},
|
|
12
|
+
middleware: {},
|
|
12
13
|
teleport: { type: [Boolean, String] }
|
|
13
14
|
},
|
|
14
|
-
setup(
|
|
15
|
-
const
|
|
16
|
-
var
|
|
17
|
-
["ArrowUp", "ArrowDown"].includes(e.key) && (e.preventDefault(), (
|
|
15
|
+
setup(E, { expose: p }) {
|
|
16
|
+
const { cx: d } = h(), a = c(null), f = (e) => {
|
|
17
|
+
var o;
|
|
18
|
+
["ArrowUp", "ArrowDown"].includes(e.key) && (e.preventDefault(), (o = e.target) == null || o.dispatchEvent(new KeyboardEvent("keydown", { key: "Enter" })));
|
|
18
19
|
};
|
|
19
|
-
return
|
|
20
|
-
default:
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
resize: e.resize,
|
|
25
|
-
teleport: e.teleport
|
|
26
|
-
}, {
|
|
27
|
-
floating: o(({ width: i }) => [
|
|
28
|
-
n(r(B), y({
|
|
29
|
-
class: "relative flex w-40 flex-col rounded border text-sm",
|
|
30
|
-
focus: "",
|
|
31
|
-
style: { width: i }
|
|
32
|
-
}, e.$attrs), {
|
|
33
|
-
default: o(({ close: d }) => [
|
|
34
|
-
p(e.$slots, "popover", {
|
|
35
|
-
close: d,
|
|
36
|
-
open: s
|
|
37
|
-
}),
|
|
38
|
-
t[0] || (t[0] = w("div", { class: "absolute inset-0 -z-1 rounded bg-b-1 shadow-md brightness-lifted" }, null, -1))
|
|
39
|
-
]),
|
|
40
|
-
_: 2
|
|
41
|
-
}, 1040, ["style"])
|
|
42
|
-
]),
|
|
43
|
-
default: o(() => [
|
|
44
|
-
n(r(g), {
|
|
20
|
+
return p({ popoverButtonRef: a }), (e, o) => (v(), y(t(P), { as: "template" }, {
|
|
21
|
+
default: r(({ open: n }) => [
|
|
22
|
+
l(t(C), w(_(e.$props)), b({
|
|
23
|
+
default: r(() => [
|
|
24
|
+
l(t(k), {
|
|
45
25
|
ref_key: "popoverButtonRef",
|
|
46
|
-
ref:
|
|
26
|
+
ref: a,
|
|
47
27
|
as: "template",
|
|
48
28
|
onKeydown: f
|
|
49
29
|
}, {
|
|
50
|
-
default:
|
|
51
|
-
|
|
30
|
+
default: r(() => [
|
|
31
|
+
s(e.$slots, "default", { open: n })
|
|
52
32
|
]),
|
|
53
|
-
_:
|
|
54
|
-
},
|
|
33
|
+
_: 2
|
|
34
|
+
}, 1536)
|
|
55
35
|
]),
|
|
56
36
|
_: 2
|
|
57
|
-
},
|
|
37
|
+
}, [
|
|
38
|
+
n ? {
|
|
39
|
+
name: "floating",
|
|
40
|
+
fn: r(({ width: i }) => [
|
|
41
|
+
l(t(x), g({
|
|
42
|
+
focus: "",
|
|
43
|
+
style: { width: i }
|
|
44
|
+
}, t(d)("relative flex w-40 flex-col rounded border text-sm")), {
|
|
45
|
+
default: r(({ close: u }) => [
|
|
46
|
+
s(e.$slots, "popover", {
|
|
47
|
+
close: u,
|
|
48
|
+
open: n
|
|
49
|
+
}),
|
|
50
|
+
o[0] || (o[0] = B("div", { class: "absolute inset-0 -z-1 rounded bg-b-1 shadow-md brightness-lifted" }, null, -1))
|
|
51
|
+
]),
|
|
52
|
+
_: 2
|
|
53
|
+
}, 1040, ["style"])
|
|
54
|
+
]),
|
|
55
|
+
key: "0"
|
|
56
|
+
} : void 0
|
|
57
|
+
]), 1040)
|
|
58
58
|
]),
|
|
59
59
|
_: 3
|
|
60
60
|
}));
|
|
61
61
|
}
|
|
62
62
|
});
|
|
63
63
|
export {
|
|
64
|
-
|
|
64
|
+
K as default
|
|
65
65
|
};
|
|
@@ -8,6 +8,8 @@ export type OptionGroup = {
|
|
|
8
8
|
label: string;
|
|
9
9
|
options: Option[];
|
|
10
10
|
};
|
|
11
|
-
|
|
12
|
-
export declare
|
|
11
|
+
/** Type guard to check if an option is a group */
|
|
12
|
+
export declare function isGroup(option: Option | OptionGroup): option is OptionGroup;
|
|
13
|
+
/** Type guard to check if an array of options is an array of groups */
|
|
14
|
+
export declare function isGroups(options: Option[] | OptionGroup[]): options is OptionGroup[];
|
|
13
15
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCombobox/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,MAAM,GAAG;IACnB,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,CAAC,CAAC,EAAE,MAAM,GAAG,GAAG,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,EAAE,CAAA;CAClB,CAAA;AAED,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCombobox/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,MAAM,GAAG;IACnB,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,CAAC,CAAC,EAAE,MAAM,GAAG,GAAG,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,EAAE,CAAA;CAClB,CAAA;AAED,kDAAkD;AAClD,wBAAgB,OAAO,CAAC,MAAM,EAAE,MAAM,GAAG,WAAW,GAAG,MAAM,IAAI,WAAW,CAE3E;AAED,uEAAuE;AACvE,wBAAgB,QAAQ,CACtB,OAAO,EAAE,MAAM,EAAE,GAAG,WAAW,EAAE,GAChC,OAAO,IAAI,WAAW,EAAE,CAE1B"}
|