@bridge-ui/vue 0.0.0

package/dist/Components/Select/Select.vue.d.ts

@@ -0,0 +1,40 @@
+import { SelectOwnProps, SelectSlots, SelectValue } from './select.types';
+type __VLS_Slots = SelectSlots;
+type __VLS_Props = SelectOwnProps;
+type __VLS_ModelProps = {
+    modelValue?: null | SelectValue | SelectValue[];
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    search: (query: string) => any;
+    select: (option: import('@bridge-ui/core').ListboxOption) => any;
+    "update:modelValue": (...args: unknown[]) => any;
+    clear: () => any;
+    change: (value: import('@bridge-ui/core').SelectModel) => any;
+    close: () => any;
+    open: () => any;
+    deselect: (option: import('@bridge-ui/core').ListboxOption) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onSearch?: ((query: string) => any) | undefined;
+    onSelect?: ((option: import('@bridge-ui/core').ListboxOption) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: unknown[]) => any) | undefined;
+    onClear?: (() => any) | undefined;
+    onChange?: ((value: import('@bridge-ui/core').SelectModel) => any) | undefined;
+    onClose?: (() => any) | undefined;
+    onOpen?: (() => any) | undefined;
+    onDeselect?: ((option: import('@bridge-ui/core').ListboxOption) => any) | undefined;
+}>, {
+    withErrorIcon: boolean;
+    emptyMessage: string;
+    clearable: boolean;
+    minItemsForSearch: number;
+    searchable: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/Components/Select/Select.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,191 @@
+import { hasNamedSlot as e, resolveNamedSlot as t } from "../../Utils/slotOrProp.js";
+import n from "../Icon/Icon.js";
+import r from "../FormField/FormField.js";
+import i from "../Listbox/Listbox.js";
+import { useSelect as a } from "./composables/useSelect.js";
+import { SELECT_OPTION_KEY as o } from "./selectInjectionKey.js";
+import { Fragment as s, createBlock as c, createCommentVNode as ee, createElementBlock as l, createElementVNode as u, createSlots as d, createVNode as f, defineComponent as p, guardReactiveProps as m, isRef as h, mergeModels as g, mergeProps as _, normalizeProps as v, openBlock as y, provide as b, ref as x, renderList as S, renderSlot as C, resolveDynamicComponent as w, toDisplayString as T, unref as E, useModel as te, useTemplateRef as D, withCtx as O, withKeys as k, withModifiers as A } from "vue";
+import { X as j } from "lucide-vue-next";
+//#region src/Components/Select/Select.vue?vue&type=script&setup=true&lang.ts
+var ne = {
+	key: 0,
+	class: "flex min-w-0 flex-1 flex-wrap items-center gap-1"
+}, M = { class: "truncate" }, N = [
+	"aria-label",
+	"onClick",
+	"onKeydown"
+], P = {
+	key: 1,
+	class: "flex min-w-0 flex-1 items-center gap-1"
+}, F = /* @__PURE__ */ p({
+	inheritAttrs: !1,
+	__name: "Select",
+	props: /* @__PURE__ */ g({
+		asyncData: {},
+		clearable: {
+			type: Boolean,
+			default: !0
+		},
+		defaultValue: {},
+		disableMaxHeight: { type: Boolean },
+		emptyMessage: { default: "No options" },
+		flipOptions: { type: Boolean },
+		hideEmptyMessage: { type: Boolean },
+		loading: { type: Boolean },
+		maxHeight: {},
+		minItemsForSearch: { default: 11 },
+		multiple: { type: Boolean },
+		optionDescription: {},
+		optionLabel: {},
+		options: {},
+		optionValue: {},
+		placeholder: {},
+		searchable: {
+			type: Boolean,
+			default: !1
+		},
+		classes: {},
+		color: {},
+		controlId: {},
+		corner: {},
+		customProps: {},
+		description: {},
+		disabled: { type: Boolean },
+		end: {},
+		endIcon: {},
+		error: { type: Boolean },
+		errorIcon: {},
+		errorMessage: {},
+		label: {},
+		readonly: { type: Boolean },
+		required: { type: Boolean },
+		rounded: {},
+		size: {},
+		slots: {},
+		start: {},
+		startIcon: {},
+		variant: {},
+		withErrorIcon: {
+			type: Boolean,
+			default: !0
+		},
+		withoutErrorMessage: { type: Boolean }
+	}, {
+		modelValue: {},
+		modelModifiers: {}
+	}),
+	emits: /* @__PURE__ */ g([
+		"change",
+		"clear",
+		"close",
+		"deselect",
+		"open",
+		"search",
+		"select",
+		"update:modelValue"
+	], ["update:modelValue"]),
+	setup(p, { emit: g }) {
+		let F = te(p, "modelValue"), I = p, L = g, R = D("trigger"), z = x([]);
+		b(o, {
+			unregister(e) {
+				z.value = z.value.filter((t) => String(t.value) !== String(e));
+			},
+			register(e) {
+				z.value.some((t) => String(t.value) === String(e.value)) || (z.value = [...z.value, e]);
+			}
+		});
+		let { open: B, slots: V, hasValue: H, multiple: U, listboxId: W, formField: G, isLoading: K, clearable: q, clearBind: J, isSelected: Y, clearValue: X, removeChip: Z, triggerBind: Q, selectOption: re, containerRef: ie, emptyMessage: ae, clearIconSize: $, visibleOptions: oe, selectedOptions: se, highlightedIndex: ce, hideEmptyMessage: le } = a(I, F, R, L, z);
+		return (a, o) => (y(), l(s, null, [
+			f(E(r), { field: E(G) }, {
+				default: O(() => [E(U) ? (y(), l("div", ne, [(y(!0), l(s, null, S(E(se), (e) => (y(), l("span", {
+					key: String(e.value),
+					class: "inline-flex max-w-full items-center gap-1 rounded-md bg-gray-100 px-2 py-0.5 text-sm text-gray-800 dark:bg-gray-700 dark:text-gray-100"
+				}, [C(a.$slots, "chip", { option: e }, () => [u("span", M, T(e.label), 1)]), u("span", _({ ref_for: !0 }, E(J), {
+					"aria-label": `Remove ${e.label}`,
+					onClick: (t) => E(Z)(e, t),
+					onKeydown: [k(A((t) => E(Z)(e, t), ["prevent"]), ["enter"]), k(A((t) => E(Z)(e, t), ["prevent"]), ["space"])]
+				}), [f(E(n), {
+					icon: E(j),
+					size: E($)
+				}, null, 8, ["icon", "size"])], 16, N)]))), 128)), u("textarea", _({ ref: "trigger" }, E(Q)), null, 16)])) : (y(), l("div", P, [u("input", _({
+					ref: "trigger",
+					class: "min-w-0 flex-1"
+				}, E(Q)), null, 16), E(q) && E(H) && !E(G).isDisabled.value ? (y(), l("span", _({ key: 0 }, E(J), {
+					onClick: o[0] ||= (...e) => E(X) && E(X)(...e),
+					"aria-label": "Clear selection",
+					onKeydown: [o[1] ||= k(A((...e) => E(X) && E(X)(...e), ["prevent"]), ["enter"]), o[2] ||= k(A((...e) => E(X) && E(X)(...e), ["prevent"]), ["space"])]
+				}), [f(E(n), {
+					icon: E(j),
+					size: E($)
+				}, null, 8, ["icon", "size"])], 16)) : ee("", !0)]))]),
+				_: 3
+			}, 8, ["field"]),
+			f(E(i), {
+				modelValue: E(B),
+				"onUpdate:modelValue": o[3] ||= (e) => h(B) ? B.value = e : null,
+				loading: E(K),
+				multiple: E(U),
+				"listbox-id": E(W),
+				"anchor-el": E(ie),
+				options: E(oe),
+				"is-selected": E(Y),
+				onSelect: E(re),
+				"disable-auto-focus": !0,
+				"empty-message": E(ae),
+				"max-height": I.maxHeight,
+				color: E(G).merged.value.color,
+				"highlighted-index": E(ce),
+				"hide-empty-message": E(le),
+				"labelled-by": E(G).controlId.value,
+				invalidated: E(G).invalidated.value,
+				"disable-max-height": I.disableMaxHeight
+			}, d({ _: 2 }, [
+				E(e)(E(V), "beforeOptions") ? {
+					name: "beforeOptions",
+					fn: O(() => [(y(), c(w(E(t)(E(V), "beforeOptions"))))]),
+					key: "0"
+				} : void 0,
+				E(e)(E(V), "loading") ? {
+					name: "loading",
+					fn: O(() => [(y(), c(w(E(t)(E(V), "loading"))))]),
+					key: "1"
+				} : void 0,
+				E(e)(E(V), "option") ? {
+					name: "option",
+					fn: O((e) => [C(a.$slots, "option", v(m(e)))]),
+					key: "2"
+				} : void 0,
+				E(e)(E(V), "empty") ? {
+					name: "empty",
+					fn: O(() => [(y(), c(w(E(t)(E(V), "empty"))))]),
+					key: "3"
+				} : void 0,
+				E(e)(E(V), "afterOptions") ? {
+					name: "afterOptions",
+					fn: O(() => [(y(), c(w(E(t)(E(V), "afterOptions"))))]),
+					key: "4"
+				} : void 0
+			]), 1032, [
+				"modelValue",
+				"loading",
+				"multiple",
+				"listbox-id",
+				"anchor-el",
+				"options",
+				"is-selected",
+				"onSelect",
+				"empty-message",
+				"max-height",
+				"color",
+				"highlighted-index",
+				"hide-empty-message",
+				"labelled-by",
+				"invalidated",
+				"disable-max-height"
+			]),
+			C(a.$slots, "default")
+		], 64));
+	}
+});
+//#endregion
+export { F as default };

package/dist/Components/Select/SelectOption.js

@@ -0,0 +1,5 @@
+import e from "./SelectOption.vue_vue_type_script_setup_true_lang.js";
+//#region src/Components/Select/SelectOption.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/Components/Select/SelectOption.vue.d.ts

@@ -0,0 +1,4 @@
+import { SelectOptionProps } from './select.types';
+declare const __VLS_export: import('vue').DefineComponent<SelectOptionProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<SelectOptionProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/Components/Select/SelectOption.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,30 @@
+import { SELECT_OPTION_KEY as e } from "./selectInjectionKey.js";
+import { createElementBlock as t, defineComponent as n, inject as r, onBeforeUnmount as i, onMounted as a, openBlock as o } from "vue";
+//#region src/Components/Select/SelectOption.vue?vue&type=script&setup=true&lang.ts
+var s = {
+	hidden: "",
+	"aria-hidden": "true"
+}, c = /* @__PURE__ */ n({
+	__name: "SelectOption",
+	props: {
+		description: {},
+		disabled: { type: Boolean },
+		label: {},
+		value: {}
+	},
+	setup(n) {
+		let c = n, l = r(e, null);
+		return a(() => {
+			l?.register({
+				label: c.label,
+				value: c.value,
+				disabled: c.disabled,
+				description: c.description
+			});
+		}), i(() => {
+			l?.unregister(c.value);
+		}), (e, n) => (o(), t("span", s));
+	}
+});
+//#endregion
+export { c as default };