@bridge-ui/vue 0.0.1-beta.2 → 0.0.1-beta.4

package/dist/Components/Select/composables/useSelect.js

@@ -1,14 +1,14 @@
 import { hasNamedSlot as e } from "../../../Utils/slotOrProp.js";
 import { mergePartBind as t, resolveFieldAdornmentIconSize as n, useBridgeUIComponent as r, useBridgeUIMergedRegistryClasses as ee } from "../../../Utils/index.js";
-import { formFieldBridgeKeys as te, useFormField as ne } from "../../FormField/composables/useFormField.js";
-import { useListboxNavigation as re } from "../../Listbox/composables/useListboxNavigation.js";
-import { computed as i, nextTick as a, onBeforeUnmount as ie, onMounted as ae, ref as o, useAttrs as oe, useId as se, useSlots as ce, watch as s } from "vue";
-import { get as c, isNil as le, omit as ue } from "es-toolkit/compat";
-import { adjustAutosizeTextareaHeight as de, cn as l, createSelectAsyncSearch as fe, mergeBridgeUILayeredClasses as u, normalizeSelectOptions as d, resolveSelectAsyncDebounce as pe, resolveSelectAsyncOptions as me, selectValuesEqual as f, splitComponentProps as p } from "@bridge-ui/core";
-import { ChevronsUpDown as he } from "lucide-vue-next";
-import { colorProps as ge, invalidatedProps as _e } from "@bridge-ui/core/Components/Listbox";
+import { formFieldBridgeKeys as te, useFormField as i } from "../../FormField/composables/useFormField.js";
+import { useListboxNavigation as ne } from "../../Listbox/composables/useListboxNavigation.js";
+import { computed as a, nextTick as o, onBeforeUnmount as re, onMounted as ie, ref as s, useAttrs as ae, useId as oe, useSlots as se, watch as c } from "vue";
+import { get as l, isNil as ce, omit as le } from "es-toolkit/compat";
+import { adjustAutosizeTextareaHeight as ue, cn as u, createSelectAsyncSearch as de, mergeBridgeUILayeredClasses as d, normalizeSelectOptions as f, resolveSelectAsyncDebounce as fe, resolveSelectAsyncOptions as pe, selectValuesEqual as p, splitComponentProps as m } from "@bridge-ui/core";
+import { ChevronsUpDown as me } from "@lucide/vue";
+import { colorProps as he, invalidatedProps as ge } from "@bridge-ui/core/Components/Listbox";
 //#region src/Components/Select/composables/useSelect.ts
-var ve = [
+var _e = [
 	"classes",
 	"loading",
 	"options",
@@ -23,146 +23,147 @@ var ve = [
 	"placeholder",
 	"defaultValue",
 	"emptyMessage",
+	"loadingMessage",
 	"disableMaxHeight",
 	"hideEmptyMessage",
 	"minItemsForSearch",
 	"optionDescription"
 ];
-function m(m, h, g, _, v) {
-	let ye = oe(), y = ce(), b = se(), x = o(!1), S = o(""), C = o(-1), w = o(null), T = o(!1), E = o([]), D = null, O = o([]), k = i(() => p({
-		bridgeKeys: ve,
+function h(h, g, _, v, y) {
+	let ve = ae(), ye = se(), b = oe(), x = s(!1), S = s(""), C = s(-1), be = s(null), w = s(!1), T = s([]), E = null, D = s([]), O = a(() => m({
+		bridgeKeys: _e,
 		props: {
-			...ye,
-			...m
+			...ve,
+			...h
 		}
-	})), A = i(() => k.value.componentProps), j = i(() => ({ classes: A.value.classes })), { components: M, entry: be } = r({
+	})), k = a(() => O.value.componentProps), A = a(() => ({ classes: k.value.classes })), { components: j, entry: xe } = r({
 		componentName: "Select",
-		props: () => j.value
-	}), N = ee({
-		entry: be,
-		props: () => j.value
-	}), P = i(() => !!A.value.multiple), F = i(() => ({
-		optionLabel: A.value.optionLabel ?? "label",
-		optionValue: A.value.optionValue ?? "value",
-		optionDescription: A.value.optionDescription ?? "description"
-	})), I = i(() => v.value.length > 0 ? v.value : d(A.value.options, F.value)), L = i(() => {
-		let e = E.value.length > 0 ? E.value : I.value;
-		return A.value.flipOptions ? [...e].reverse() : e;
-	}), R = i(() => {
-		let e = h.value;
-		return P.value ? Array.isArray(e) ? e : [] : !le(e) && e !== "" ? [e] : [];
-	}), z = i(() => {
+		props: () => A.value
+	}), M = ee({
+		entry: xe,
+		props: () => A.value
+	}), N = a(() => !!k.value.multiple), P = a(() => ({
+		optionLabel: k.value.optionLabel ?? "label",
+		optionValue: k.value.optionValue ?? "value",
+		optionDescription: k.value.optionDescription ?? "description"
+	})), F = a(() => y.value.length > 0 ? y.value : f(k.value.options, P.value)), I = a(() => {
+		let e = T.value.length > 0 ? T.value : F.value;
+		return k.value.flipOptions ? [...e].reverse() : e;
+	}), L = a(() => {
+		let e = g.value;
+		return N.value ? Array.isArray(e) ? e : [] : !ce(e) && e !== "" ? [e] : [];
+	}), R = a(() => {
 		let e = /* @__PURE__ */ new Map();
-		for (let t of [...L.value, ...O.value]) e.set(t.value, t);
-		return R.value.map((t) => e.get(t) ?? {
+		for (let t of [...I.value, ...D.value]) e.set(t.value, t);
+		return L.value.map((t) => e.get(t) ?? {
 			value: t,
 			label: String(t)
 		});
-	}), B = i(() => R.value.length > 0), xe = i(() => A.value.clearable !== !1), V = i(() => !!A.value.asyncData), H = i(() => {
-		if (V.value || A.value.searchable) return !0;
-		let e = A.value.minItemsForSearch ?? 11;
-		return I.value.length >= e;
-	}), U = i(() => x.value && H.value), Se = i(() => !!A.value.loading || T.value), W = i(() => {
-		if (!U.value || !S.value.trim()) return L.value;
+	}), z = a(() => L.value.length > 0), Se = a(() => k.value.clearable !== !1), B = a(() => !!k.value.asyncData), V = a(() => {
+		if (B.value || k.value.searchable) return !0;
+		let e = k.value.minItemsForSearch ?? 11;
+		return F.value.length >= e;
+	}), H = a(() => x.value && V.value), U = a(() => !!k.value.loading || w.value), W = a(() => {
+		if (!H.value || !S.value.trim()) return I.value;
 		let e = S.value.trim().toLowerCase();
-		return L.value.filter((t) => t.label.toLowerCase().includes(e));
-	}), G = re(() => W.value, C, b), Ce = i(() => m.readonly || m.disabled ? !0 : !U.value), we = i(() => U.value || P.value ? S.value : z.value[0]?.label ?? ""), Te = (e) => {
-		w.value = e instanceof HTMLElement ? e : null;
+		return I.value.filter((t) => t.label.toLowerCase().includes(e));
+	}), G = ne(() => W.value, C, b), Ce = a(() => h.readonly || h.disabled ? !0 : !H.value), we = a(() => H.value || N.value ? S.value : R.value[0]?.label ?? ""), Te = (e) => {
+		be.value = e instanceof HTMLElement ? e : null;
 	};
 	function Ee(e) {
 		e.preventDefault();
 	}
 	function De(e) {
-		if (m.disabled || m.readonly) return;
+		if (h.disabled || h.readonly) return;
 		let t = e.target;
 		if (!t.closest("[data-select-clear]") && !(t.closest(".wrapper-start-slot") || t.closest(".wrapper-end-slot"))) {
 			if (!x.value) {
 				Z();
 				return;
 			}
-			U.value || (Q(), g.value?.focus({ preventScroll: !0 }));
+			H.value || (Q(), _.value?.focus({ preventScroll: !0 }));
 		}
 	}
-	let Oe = i(() => {
-		let n = p({
+	let Oe = a(() => {
+		let n = m({
 			bridgeKeys: te,
-			props: ue(k.value.inheritedAttrs, ["class"])
-		}).componentProps, r = n.endIcon ?? (e(y, "end") ? void 0 : he);
+			props: le(O.value.inheritedAttrs, ["class"])
+		}).componentProps, r = n.endIcon ?? (e(ye, "end") ? void 0 : me), { listbox: ee, ...i } = n.customProps ?? {};
 		return {
 			...n,
 			endIcon: r,
-			classes: N.value,
+			classes: M.value,
 			customProps: {
-				...n.customProps,
-				container: t(n.customProps?.container, {}, {
+				...i,
+				container: t(i.container, {}, {
 					ref: Te,
 					onClick: De,
-					class: l({ "cursor-pointer": !m.disabled && !m.readonly && !U.value })
+					class: u({ "cursor-pointer": !h.disabled && !h.readonly && !H.value })
 				})
 			}
 		};
-	}), K = ne(() => Oe.value, {
+	}), ke = a(() => h.customProps?.listbox), K = i(() => Oe.value, {
 		size: "md",
 		rounded: "md",
 		color: "primary",
 		variant: "outline",
 		withErrorIcon: !0
 	}, {
-		likeInput: () => P.value,
-		control: () => P.value ? "textarea" : "input"
+		likeInput: () => N.value,
+		control: () => N.value ? "textarea" : "input"
 	}), q = (e) => {
-		!e || !P.value || de(e);
+		!e || !N.value || ue(e);
 	};
 	function J(e) {
-		return R.value.some((t) => f(t, e));
+		return L.value.some((t) => p(t, e));
 	}
 	function Y(e) {
-		h.value = e;
+		g.value = e;
 	}
 	function X(e) {
-		if (P.value) {
+		if (N.value) {
 			let t = Array.isArray(e) ? e : [];
-			_("update:modelValue", t), _("change", t);
+			v("update:modelValue", t), v("change", t);
 			return;
 		}
 		let t = e ?? "";
-		_("update:modelValue", t), _("change", t);
+		v("update:modelValue", t), v("change", t);
 	}
 	function Z() {
-		m.disabled || m.readonly || x.value || (x.value = !0, S.value = "", G.highlightCurrentSelection(J), _("open"), V.value && A.value.asyncData && D?.searchImmediate(""));
+		h.disabled || h.readonly || x.value || (x.value = !0, S.value = "", G.highlightCurrentSelection(J), v("open"), B.value && k.value.asyncData && E?.searchImmediate(""));
 	}
 	function Q() {
-		D?.cancel(), x.value && (x.value = !1, S.value = "", C.value = -1, _("close"));
+		E?.cancel(), x.value && (x.value = !1, S.value = "", C.value = -1, v("close"));
 	}
-	function ke(e) {
+	function Ae(e) {
 		if (!e.disabled) {
-			if (P.value) {
-				let t = [...R.value], n = t.findIndex((t) => f(t, e.value));
-				n >= 0 ? (t.splice(n, 1), _("deselect", e)) : (t.push(e.value), _("select", e)), Y(t), X(t), S.value = "", C.value = -1, a(() => {
-					q(g.value), g.value?.focus({ preventScroll: !0 });
+			if (N.value) {
+				let t = [...L.value], n = t.findIndex((t) => p(t, e.value));
+				n >= 0 ? (t.splice(n, 1), v("deselect", e)) : (t.push(e.value), v("select", e)), Y(t), X(t), S.value = "", C.value = -1, o(() => {
+					q(_.value), _.value?.focus({ preventScroll: !0 });
 				});
 				return;
 			}
-			Y(e.value), X(e.value), _("select", e), Q();
+			Y(e.value), X(e.value), v("select", e), Q();
 		}
 	}
-	function Ae(e) {
-		e?.preventDefault(), e?.stopPropagation(), P.value ? (Y([]), X([])) : (Y(null), X(null)), _("clear"), Q();
+	function je(e) {
+		e?.preventDefault(), e?.stopPropagation(), N.value ? (Y([]), X([])) : (Y(null), X(null)), v("clear"), Q();
 	}
-	function je(e, t) {
-		if (t.preventDefault(), t.stopPropagation(), !P.value) return;
-		let n = R.value.filter((t) => !f(t, e.value));
-		Y(n), X(n), _("deselect", e), a(() => q(g.value));
+	function Me(e, t) {
+		if (t.preventDefault(), t.stopPropagation(), !N.value) return;
+		let n = L.value.filter((t) => !p(t, e.value));
+		Y(n), X(n), v("deselect", e), o(() => q(_.value));
 	}
-	function Me() {
+	function Ne() {
 		let e = G.getHighlightedOption();
-		e && ke(e);
-	}
-	function Ne(e) {
-		S.value = e.target.value, _("search", S.value), x.value || Z(), G.resetHighlight(), V.value && D?.searchDebounced(S.value);
+		e && Ae(e);
 	}
 	function Pe(e) {
-		if (!(m.disabled || m.readonly)) switch (e.key) {
+		S.value = e.target.value, v("search", S.value), x.value || Z(), G.resetHighlight(), B.value && E?.searchDebounced(S.value);
+	}
+	function Fe(e) {
+		if (!(h.disabled || h.readonly)) switch (e.key) {
 			case "ArrowDown":
 				e.preventDefault(), x.value ? G.moveHighlight(1) : Z();
 				break;
@@ -170,7 +171,7 @@ function m(m, h, g, _, v) {
 				e.preventDefault(), x.value ? G.moveHighlight(-1) : Z();
 				break;
 			case "Enter":
-				e.preventDefault(), x.value ? Me() : Z();
+				e.preventDefault(), x.value ? Ne() : Z();
 				break;
 			case "Escape":
 				e.preventDefault(), Q();
@@ -182,10 +183,10 @@ function m(m, h, g, _, v) {
 				x.value && (e.preventDefault(), G.highlightLast());
 				break;
 			case "Backspace":
-				if (P.value && !S.value && z.value.length > 0) {
+				if (N.value && !S.value && R.value.length > 0) {
 					e.preventDefault();
-					let t = z.value.at(-1);
-					t && je(t, e);
+					let t = R.value.at(-1);
+					t && Me(t, e);
 				}
 				break;
 			case "Tab":
@@ -194,112 +195,133 @@ function m(m, h, g, _, v) {
 			default: break;
 		}
 	}
-	async function Fe(e) {
-		let t = A.value.asyncData;
+	async function Ie(e) {
+		let t = k.value.asyncData;
 		if (t) {
-			T.value = !0;
+			w.value = !0;
 			try {
-				let { options: n, resolvedSelected: r } = await me(t, e, R.value, (e) => d(e, F.value));
-				r.length > 0 && (O.value = r), E.value = n;
+				let { options: n, resolvedSelected: r } = await pe(t, e, L.value, (e) => f(e, P.value));
+				r.length > 0 && (D.value = r), T.value = n;
 			} finally {
-				T.value = !1;
+				w.value = !1;
 			}
 		}
 	}
-	async function Ie() {
-		let e = A.value.asyncData;
-		!e?.resolve || R.value.length === 0 || (O.value = d(await e.resolve(R.value), F.value));
+	async function Le() {
+		let e = k.value.asyncData;
+		!e?.resolve || L.value.length === 0 || (D.value = f(await e.resolve(L.value), P.value));
 	}
-	let $ = i(() => {
-		let e = c(u(ge, c(M.value, [
+	let $ = a(() => {
+		let e = l(d(he, l(j.value, [
 			"Listbox",
 			"customProps",
 			"color"
 		])), K.merged.value.color ?? "primary");
-		return K.invalidated.value ? u(_e, c(M.value, [
+		return K.invalidated.value ? d(ge, l(j.value, [
 			"Listbox",
 			"customProps",
 			"invalidated"
 		])) : e;
-	}), Le = i(() => $.value?.value), Re = i(() => {
-		let e = !m.disabled && !m.readonly && !U.value, n = !m.disabled && !m.readonly && U.value && H.value, r = B.value && !P.value && !U.value;
+	}), Re = a(() => $.value?.value), ze = a(() => {
+		let e = !h.disabled && !h.readonly && !H.value, n = !h.disabled && !h.readonly && H.value && V.value, r = z.value && !N.value && !H.value;
 		return t({
 			role: "combobox",
 			value: we.value,
 			"aria-controls": b,
 			"aria-expanded": x.value,
 			readonly: Ce.value,
-			onKeydown: Pe,
-			placeholder: A.value.placeholder,
-			"aria-autocomplete": H.value ? "list" : void 0,
+			onKeydown: Fe,
+			placeholder: k.value.placeholder,
+			"aria-autocomplete": V.value ? "list" : void 0,
 			"aria-activedescendant": x.value ? G.activeDescendantId.value : void 0,
-			...P.value ? {
+			...N.value ? {
 				rows: 1,
 				onInput: (e) => {
-					Ne(e), q(e.target);
+					Pe(e), q(e.target);
 				}
-			} : { onInput: Ne }
-		}, K.inputBind.value, l({
+			} : { onInput: Pe }
+		}, K.inputBind.value, u({
 			"cursor-text": n,
 			"cursor-pointer": e,
-			"resize-none overflow-hidden": P.value,
-			[l(Le.value, N.value.value) ?? ""]: r
+			"resize-none overflow-hidden": N.value,
+			[u(Re.value, M.value.value) ?? ""]: r
 		}));
 	});
-	s(() => [
+	c(() => [
 		x.value,
-		P.value,
-		g.value
+		N.value,
+		_.value
 	], () => {
-		q(g.value);
-	}, { immediate: !0 }), s(() => h.value, () => {
-		Ie();
-	}, { immediate: !0 }), s(() => A.value.asyncData, (e) => {
-		if (D?.cancel(), E.value = [], Ie(), !e) {
-			D = null;
+		q(_.value);
+	}, { immediate: !0 }), c(() => g.value, () => {
+		Le();
+	}, { immediate: !0 }), c(() => k.value.asyncData, (e) => {
+		if (E?.cancel(), T.value = [], Le(), !e) {
+			E = null;
 			return;
 		}
-		D = fe((e) => void Fe(e), pe(e));
-	}, { immediate: !0 }), ie(() => {
-		D?.cancel();
-	}), ae(() => {
-		q(g.value);
+		E = de((e) => void Ie(e), fe(e));
+	}, { immediate: !0 }), re(() => {
+		E?.cancel();
+	}), ie(() => {
+		q(_.value);
 	});
-	let ze = i(() => n(K.merged.value.size));
+	let Be = a(() => n(K.merged.value.size));
 	return {
 		open: x,
-		slots: y,
-		hasValue: B,
-		multiple: P,
+		slots: ye,
+		hasValue: z,
+		multiple: N,
 		listboxId: b,
 		formField: K,
-		isLoading: Se,
-		clearable: xe,
-		clearBind: i(() => t({}, {}, {
+		isLoading: U,
+		clearable: Se,
+		clearBind: a(() => t({}, {}, {
 			tabindex: 0,
 			role: "button",
 			"data-select-clear": !0,
 			onMousedown: Ee,
-			class: l({
+			class: u({
 				"inline-flex shrink-0 cursor-pointer items-center justify-center rounded-sm transition-colors duration-150": !0,
 				[$.value?.clear ?? ""]: !0,
-				[N.value.clear ?? ""]: !0
+				[M.value.clear ?? ""]: !0
 			})
 		})),
 		isSelected: J,
-		clearValue: Ae,
-		removeChip: je,
-		triggerBind: Re,
-		selectOption: ke,
-		containerRef: w,
-		clearIconSize: ze,
+		clearValue: je,
+		removeChip: Me,
+		triggerBind: ze,
+		selectOption: Ae,
+		containerRef: be,
+		listboxProps: a(() => ({
+			disableAutoFocus: !0,
+			maxHeight: h.maxHeight,
+			size: K.merged.value.size,
+			color: K.merged.value.color,
+			disableMaxHeight: h.disableMaxHeight === !0,
+			emptyMessage: k.value.emptyMessage ?? "No options",
+			hideEmptyMessage: k.value.hideEmptyMessage === !0,
+			loadingMessage: k.value.loadingMessage ?? "Loading...",
+			...ke.value,
+			listboxId: b,
+			isSelected: J,
+			loading: U.value,
+			multiple: N.value,
+			options: W.value,
+			labelledBy: K.controlId.value,
+			highlightedIndex: C.value,
+			invalidated: K.invalidated.value
+		})),
+		clearIconSize: Be,
+		mergedClasses: M,
 		visibleOptions: W,
-		isSearchActive: U,
-		selectedOptions: z,
+		isSearchActive: H,
+		selectedOptions: R,
 		highlightedIndex: C,
-		emptyMessage: i(() => A.value.emptyMessage ?? "No options"),
-		hideEmptyMessage: i(() => A.value.hideEmptyMessage === !0)
+		emptyMessage: a(() => k.value.emptyMessage ?? "No options"),
+		hideEmptyMessage: a(() => k.value.hideEmptyMessage === !0),
+		loadingMessage: a(() => k.value.loadingMessage ?? "Loading...")
 	};
 }
 //#endregion
-export { m as useSelect };
+export { h as useSelect };

package/dist/Components/Select/select.types.d.ts

@@ -1,6 +1,7 @@
 import { InputHTMLAttributes, Slot, TextareaHTMLAttributes } from 'vue';
 import { MergeHtmlProps, SelectAsyncData, SelectModel, SelectOption, SelectOptionInput, SelectValue } from '@bridge-ui/core';
 import { FormFieldClasses, FormFieldCustomProps, FormFieldOwnProps, FormFieldSlots } from '../FormField/formField.types';
+import { ListboxOwnProps } from '../Listbox/listbox.types';
 export type { SelectAsyncData, SelectModel, SelectOption, SelectOptionInput, SelectOptionLike, SelectValue, } from '@bridge-ui/core';
 export interface SelectClasses extends FormFieldClasses {
     /**
@@ -24,7 +25,15 @@ export interface SelectClasses extends FormFieldClasses {
      */
     value?: string;
 }
-export interface SelectCustomProps extends FormFieldCustomProps {}
+export interface SelectCustomProps extends FormFieldCustomProps {
+    /**
+     * Props forwarded to the internal `Listbox`.
+     * Open state, options, and selection handlers stay owned by `Select`.
+     *
+     * @default undefined
+     */
+    listbox?: Partial<Omit<ListboxOwnProps, "options" | "anchorEl" | "listboxId" | "isSelected" | "highlightedIndex">>;
+}
 export interface SelectEmits {
     /**
      * Emitted when the selection changes.
@@ -88,6 +97,12 @@ export interface SelectOwnProps extends Omit<FormFieldOwnProps, "field"> {
      * @default true
      */
     clearable?: boolean;
+    /**
+     * Extra props for FormField parts and the internal `Listbox`.
+     *
+     * @default undefined
+     */
+    customProps?: SelectCustomProps;
     /**
      * Initial value when uncontrolled.
      */
@@ -121,6 +136,12 @@ export interface SelectOwnProps extends Omit<FormFieldOwnProps, "field"> {
      * External or async loading state.
      */
     loading?: boolean;
+    /**
+     * Message shown in the dropdown while loading.
+     *
+     * @default "Loading..."
+     */
+    loadingMessage?: string;
     /**
      * Tailwind max-height class for the dropdown options area.
      * Forwarded to the internal `Listbox`.

package/dist/Components/Skeleton/Skeleton.js

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

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

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

package/dist/Components/Skeleton/Skeleton.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,17 @@
+import { useSkeleton as e } from "./composables/useSkeleton.js";
+import { createElementBlock as t, defineComponent as n, guardReactiveProps as r, normalizeProps as i, openBlock as a, unref as o } from "vue";
+//#region src/Components/Skeleton/Skeleton.vue?vue&type=script&setup=true&lang.ts
+var s = /* @__PURE__ */ n({
+	inheritAttrs: !1,
+	__name: "Skeleton",
+	props: {
+		classes: {},
+		rounded: {}
+	},
+	setup(n) {
+		let { rootBind: s } = e(n, { rounded: "md" });
+		return (e, n) => (a(), t("div", i(r(o(s))), null, 16));
+	}
+});
+//#endregion
+export { s as default };

package/dist/Components/Skeleton/composables/useSkeleton.d.ts

@@ -0,0 +1,9 @@
+import { LibDefaultsShape, MergeLibDefaults } from '@bridge-ui/core';
+import { SkeletonOwnProps, SkeletonProps } from '../skeleton.types';
+type SkeletonLibDefaults = LibDefaultsShape<SkeletonOwnProps, "rounded">;
+type SkeletonMerged = MergeLibDefaults<SkeletonOwnProps, SkeletonLibDefaults>;
+export declare function useSkeleton(props: SkeletonOwnProps, libDefaults: SkeletonLibDefaults): {
+    merged: import('vue').ComputedRef<SkeletonMerged>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", {}, Omit<SkeletonProps, "classes" | "rounded">>>;
+};
+export {};

package/dist/Components/Skeleton/composables/useSkeleton.js

@@ -0,0 +1,33 @@
+import { mergePartBind as e, useBridgeUIComponent as t, useBridgeUIMergedRegistryClasses as n } from "../../../Utils/index.js";
+import { computed as r, useAttrs as i } from "vue";
+import { get as a } from "es-toolkit/compat";
+import { cn as o, mergeBridgeUILayeredClasses as s, splitComponentProps as c } from "@bridge-ui/core";
+import { roundedProps as l } from "@bridge-ui/core/Components/Skeleton";
+//#region src/Components/Skeleton/composables/useSkeleton.ts
+var u = ["classes", "rounded"];
+function d(d, f) {
+	let p = i(), m = r(() => c({
+		props: {
+			...p,
+			...d
+		},
+		bridgeKeys: u
+	})), { merged: h, entry: g } = t({
+		libDefaults: f,
+		componentName: "Skeleton",
+		props: () => m.value.componentProps
+	}), _ = n({
+		entry: g,
+		props: () => m.value.componentProps
+	}), v = r(() => a(s(l, g.value?.customProps?.rounded), h.value.rounded));
+	return {
+		merged: h,
+		rootBind: r(() => e({}, m.value.inheritedAttrs, o({
+			"block animate-pulse bg-gray-200 dark:bg-gray-700": !0,
+			[v.value ?? ""]: !0,
+			[_.value.root ?? ""]: !0
+		})))
+	};
+}
+//#endregion
+export { d as useSkeleton };

package/dist/Components/Skeleton/index.d.ts

@@ -0,0 +1,3 @@
+export { useSkeleton } from './composables/useSkeleton';
+export type { SkeletonClasses, SkeletonOwnProps, SkeletonProps, SkeletonRoundedOverrides, } from './skeleton.types';
+export { default as Skeleton } from './Skeleton.vue';

package/dist/Components/Skeleton/index.js

@@ -0,0 +1,3 @@
+import { useSkeleton as e } from "./composables/useSkeleton.js";
+import t from "./Skeleton.js";
+export { t as Skeleton, e as useSkeleton };

package/dist/Components/Skeleton/skeleton.types.d.ts

@@ -0,0 +1,24 @@
+import { HTMLAttributes } from 'vue';
+import { MergeHtmlProps, MergeProps, SkeletonRounded } from '@bridge-ui/core';
+export interface SkeletonRoundedOverrides {}
+export interface SkeletonClasses {
+    /**
+     * The classes to apply to the root.
+     */
+    root?: string;
+}
+export interface SkeletonOwnProps {
+    /**
+     * The classes to apply to the skeleton.
+     *
+     * @default undefined
+     */
+    classes?: SkeletonClasses;
+    /**
+     * The roundedness of the skeleton.
+     *
+     * @default "md"
+     */
+    rounded?: MergeProps<SkeletonRounded, SkeletonRoundedOverrides>;
+}
+export type SkeletonProps = MergeHtmlProps<SkeletonOwnProps, HTMLAttributes>;

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

@@ -17,10 +17,10 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {
     "onLeave-complete"?: (() => any) | undefined;
 }>, {
     teleportTo: false | string;
+    progressbar: boolean;
     closeButton: boolean;
     duration: false | number;
     position: import('@bridge-ui/core').MergeProps<import('@bridge-ui/core').SnackbarPosition, import('./snackbar.types').SnackbarPositionOverrides>;
-    progressbar: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/Components/Snackbar/Snackbar.vue_vue_type_script_setup_true_lang.js

@@ -2,7 +2,7 @@ import e from "../Icon/Icon.js";
 import { useSnackbar as t } from "./composables/useSnackbar.js";
 import { Teleport as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, defineComponent as u, guardReactiveProps as d, mergeModels as f, mergeProps as p, normalizeClass as m, normalizeProps as h, openBlock as g, renderSlot as _, toDisplayString as v, unref as y, useModel as b, useSlots as x } from "vue";
 import { cn as S } from "@bridge-ui/core";
-import { X as C } from "lucide-vue-next";
+import { X as C } from "@lucide/vue";
 //#region src/Components/Snackbar/Snackbar.vue?vue&type=script&setup=true&lang.ts
 var w = { class: "w-full max-w-sm pointer-events-auto" }, T = ["src"], E = { class: "flex ml-4 shrink-0" }, D = ["src"], O = { class: "flex ml-4 shrink-0" }, k = /* @__PURE__ */ u({
 	inheritAttrs: !1,

package/dist/Components/Snackbar/composables/useSnackbar.d.ts

@@ -1,4 +1,4 @@
-import { LucideIcon } from 'lucide-vue-next';
+import { LucideIcon } from '@lucide/vue';
 import { Ref } from 'vue';
 import { LibDefaultsShape, MergeLibDefaults } from '@bridge-ui/core';
 import { SnackbarOwnProps, SnackbarProps } from '../snackbar.types';