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

package/dist/Components/Button/Button.vue_vue_type_script_setup_true_lang.js

@@ -34,10 +34,8 @@ var b = /* @__PURE__ */ u({
 			variant: "solid",
 			density: "default"
 		});
-		return (i, u) => (p(), o(m(g(S)), d({
+		return (i, u) => (p(), o(m(g(S)), d({ href: g(D) }, g(E), {
 			type: g(O),
-			href: g(D)
-		}, g(E), {
 			disabled: g(M),
 			"aria-busy": g(j),
 			"aria-disabled": g(I)
@@ -62,8 +60,8 @@ var b = /* @__PURE__ */ u({
 			], 64))]),
 			_: 1
 		}, 16, [
-			"type",
 			"href",
+			"type",
 			"disabled",
 			"aria-busy",
 			"aria-disabled"

package/dist/Components/Button/composables/useButton.js

@@ -1,10 +1,10 @@
 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, isNil as o } from "es-toolkit/compat";
-import { cn as s, mergeBridgeUILayeredClasses as c, splitComponentProps as l } from "@bridge-ui/core";
-import { densityProps as u, roundedProps as d, variantProps as f } from "@bridge-ui/core/Components/Button";
+import { get as a, includes as o, isNil as s } from "es-toolkit/compat";
+import { cn as c, mergeBridgeUILayeredClasses as l, splitComponentProps as u } from "@bridge-ui/core";
+import { densityProps as d, roundedProps as f, variantProps as p } from "@bridge-ui/core/Components/Button";
 //#region src/Components/Button/composables/useButton.ts
-var p = [
+var m = [
 	"as",
 	"full",
 	"href",
@@ -22,70 +22,78 @@ var p = [
 	"startIcon",
 	"customProps"
 ];
-function m(m, h) {
-	let g = i(), _ = r(() => l({
-		bridgeKeys: p,
+function h(h, g) {
+	let _ = i(), v = r(() => u({
+		bridgeKeys: m,
 		props: {
-			...g,
-			...m
+			..._,
+			...h
 		}
-	})), { merged: v, entry: y } = t({
-		libDefaults: h,
+	})), { merged: y, entry: b } = t({
+		libDefaults: g,
 		componentName: "Button",
-		props: () => _.value.componentProps
-	}), b = r(() => v.value.customProps), x = n({
-		entry: y,
-		props: () => _.value.componentProps
-	}), S = r(() => v.value.as ?? "button"), C = r(() => S.value === "a"), w = r(() => S.value === "button"), T = r(() => v.value.density === "mini"), E = r(() => v.value.disabled || v.value.loading), D = r(() => w.value ? "button" : void 0), O = r(() => w.value ? E.value : void 0), k = r(() => v.value.loading ? !0 : void 0), A = r(() => E.value && !w.value ? !0 : void 0), j = r(() => {
-		if (!(!C.value || E.value || !v.value.href)) return v.value.href;
-	}), M = r(() => a(c(u, y.value?.customProps?.density), [v.value.density, v.value.size])), N = r(() => o(_.value.componentProps.variant) ? T.value ? "flat" : v.value.variant : _.value.componentProps.variant), P = r(() => a(c(f, y.value?.customProps?.variant), [N.value, v.value.color])), F = r(() => a(c(d, y.value?.customProps?.rounded), v.value.rounded));
+		props: () => v.value.componentProps
+	}), x = r(() => y.value.customProps), S = n({
+		entry: b,
+		props: () => v.value.componentProps
+	}), C = r(() => y.value.as ?? "button"), w = r(() => C.value === "a"), T = r(() => C.value === "button"), E = r(() => y.value.density === "mini"), D = r(() => y.value.disabled || y.value.loading), O = r(() => T.value ? D.value : void 0), k = r(() => y.value.loading ? !0 : void 0), A = r(() => D.value && !T.value ? !0 : void 0), j = r(() => {
+		if (!(!w.value || D.value || !y.value.href)) return y.value.href;
+	}), M = r(() => {
+		if (!T.value) return;
+		let e = a(v.value.inheritedAttrs, "type");
+		return o([
+			"submit",
+			"reset",
+			"button"
+		], e) ? e : "button";
+	}), N = r(() => a(l(d, b.value?.customProps?.density), [y.value.density, y.value.size])), P = r(() => s(v.value.componentProps.variant) ? E.value ? "flat" : y.value.variant : v.value.componentProps.variant), F = r(() => a(l(p, b.value?.customProps?.variant), [P.value, y.value.color])), I = r(() => a(l(f, b.value?.customProps?.rounded), y.value.rounded));
 	return {
-		tag: S,
-		merged: v,
-		isMini: T,
-		iconBind: r(() => e(b.value?.icon, {}, s({
+		tag: C,
+		merged: y,
+		isMini: E,
+		iconBind: r(() => e(x.value?.icon, {}, c({
 			"shrink-0": !0,
-			[x.value.icon ?? ""]: !0
+			[S.value.icon ?? ""]: !0
 		}))),
-		rootBind: r(() => e(b.value?.root, _.value.inheritedAttrs, s({
+		rootBind: r(() => e(x.value?.root, v.value.inheritedAttrs, c({
 			"inline-flex items-center justify-center": !0,
 			"cursor-pointer outline-none outline-hidden": !0,
-			"shrink-0": T.value,
-			[M.value ?? ""]: !0,
-			[F.value ?? ""]: !0,
-			"w-full": !T.value && v.value.full,
-			"w-fit": !T.value && !v.value.full,
-			"group hover:shadow-xs": !T.value,
-			[a(P.value, "base") ?? ""]: !0,
-			[a(P.value, "hover") ?? ""]: !0,
-			[a(P.value, "focus") ?? ""]: !0,
+			"shrink-0": E.value,
+			[N.value ?? ""]: !0,
+			[I.value ?? ""]: !0,
+			"w-full": !E.value && y.value.full,
+			"w-fit": !E.value && !y.value.full,
+			"group hover:shadow-xs": !E.value,
+			[a(F.value, "base") ?? ""]: !0,
+			[a(F.value, "hover") ?? ""]: !0,
+			[a(F.value, "focus") ?? ""]: !0,
 			"transition-all ease-in-out duration-200": !0,
 			"focus:ring-2": !0,
 			"focus:ring-offset-background-white dark:focus:ring-offset-background-dark": !0,
 			"disabled:opacity-80 disabled:cursor-not-allowed": !0,
 			"aria-disabled:opacity-80 aria-disabled:cursor-not-allowed aria-disabled:pointer-events-none": !0,
-			[x.value.root ?? ""]: !0
+			[S.value.root ?? ""]: !0
 		}))),
 		rootHref: j,
-		rootType: D,
-		endIconBind: r(() => e(b.value?.endIcon, {}, s({
+		rootType: M,
+		endIconBind: r(() => e(x.value?.endIcon, {}, c({
 			"shrink-0": !0,
-			[x.value.endIcon ?? ""]: !0
+			[S.value.endIcon ?? ""]: !0
 		}))),
-		endSlotBind: r(() => e(b.value?.end, {}, "inline-flex shrink-0 items-center")),
+		endSlotBind: r(() => e(x.value?.end, {}, "inline-flex shrink-0 items-center")),
 		rootAriaBusy: k,
 		rootDisabled: O,
-		startIconBind: r(() => e(b.value?.startIcon, {}, s({
+		startIconBind: r(() => e(x.value?.startIcon, {}, c({
 			"shrink-0": !0,
-			[x.value.startIcon ?? ""]: !0
+			[S.value.startIcon ?? ""]: !0
 		}))),
-		startSlotBind: r(() => e(b.value?.start, {}, "inline-flex shrink-0 items-center")),
-		loadingIconBind: r(() => e(b.value?.loading, {}, s({
+		startSlotBind: r(() => e(x.value?.start, {}, "inline-flex shrink-0 items-center")),
+		loadingIconBind: r(() => e(x.value?.loading, {}, c({
 			"shrink-0 animate-spin": !0,
-			[x.value.loading ?? ""]: !0
+			[S.value.loading ?? ""]: !0
 		}))),
 		rootAriaDisabled: A
 	};
 }
 //#endregion
-export { m as useButton };
+export { h as useButton };

package/dist/Components/Divider/Divider.js

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

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

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

package/dist/Components/Divider/Divider.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,21 @@
+import { useDivider as e } from "./composables/useDivider.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/Divider/Divider.vue?vue&type=script&setup=true&lang.ts
+var s = /* @__PURE__ */ n({
+	inheritAttrs: !1,
+	__name: "Divider",
+	props: {
+		classes: {},
+		color: {},
+		orientation: {}
+	},
+	setup(n) {
+		let { rootBind: s } = e(n, {
+			color: "dark",
+			orientation: "horizontal"
+		});
+		return (e, n) => (a(), t("hr", i(r(o(s))), null, 16));
+	}
+});
+//#endregion
+export { s as default };

package/dist/Components/Divider/composables/useDivider.d.ts

@@ -0,0 +1,13 @@
+import { LibDefaultsShape, MergeLibDefaults } from '@bridge-ui/core';
+import { DividerOwnProps, DividerProps } from '../divider.types';
+type DividerLibDefaults = LibDefaultsShape<DividerOwnProps, "color" | "orientation">;
+type DividerMerged = MergeLibDefaults<DividerOwnProps, DividerLibDefaults>;
+export declare function useDivider(props: DividerOwnProps, libDefaults: DividerLibDefaults): {
+    merged: import('vue').ComputedRef<DividerMerged>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<{
+        role: string;
+        "aria-orientation": NonNullable<keyof import('@bridge-ui/core').DividerOrientation | undefined>;
+        class: string;
+    }, "class", {}, Omit<DividerProps, "color" | "orientation" | "classes">>>;
+};
+export {};

package/dist/Components/Divider/composables/useDivider.js

@@ -0,0 +1,42 @@
+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 { colorProps as l, orientationProps as u } from "@bridge-ui/core/Components/Divider";
+//#region src/Components/Divider/composables/useDivider.ts
+var d = [
+	"color",
+	"classes",
+	"orientation"
+];
+function f(f, p) {
+	let m = i(), h = r(() => c({
+		props: {
+			...m,
+			...f
+		},
+		bridgeKeys: d
+	})), { merged: g, entry: _ } = t({
+		libDefaults: p,
+		componentName: "Divider",
+		props: () => h.value.componentProps
+	}), v = n({
+		entry: _,
+		props: () => h.value.componentProps
+	}), y = r(() => a(s(l, _.value?.customProps?.color), g.value.color)), b = r(() => a(s(u, _.value?.customProps?.orientation), g.value.orientation));
+	return {
+		merged: g,
+		rootBind: r(() => e({}, h.value.inheritedAttrs, {
+			role: "separator",
+			"aria-orientation": g.value.orientation,
+			class: o({
+				"m-0 shrink-0 border-0 border-solid": !0,
+				[y.value ?? ""]: !0,
+				[b.value ?? ""]: !0,
+				[v.value.root ?? ""]: !0
+			})
+		}))
+	};
+}
+//#endregion
+export { f as useDivider };

package/dist/Components/Divider/divider.types.d.ts

@@ -0,0 +1,31 @@
+import { HTMLAttributes } from 'vue';
+import { DividerColor, DividerOrientation, MergeHtmlProps, MergeProps } from '@bridge-ui/core';
+export interface DividerColorOverrides {}
+export interface DividerOrientationOverrides {}
+export interface DividerClasses {
+    /**
+     * The classes to apply to the root.
+     */
+    root?: string;
+}
+export interface DividerOwnProps {
+    /**
+     * The classes to apply to the divider.
+     *
+     * @default undefined
+     */
+    classes?: DividerClasses;
+    /**
+     * The color of the divider.
+     *
+     * @default "dark"
+     */
+    color?: MergeProps<DividerColor, DividerColorOverrides>;
+    /**
+     * The orientation of the divider.
+     *
+     * @default "horizontal"
+     */
+    orientation?: MergeProps<DividerOrientation, DividerOrientationOverrides>;
+}
+export type DividerProps = MergeHtmlProps<DividerOwnProps, HTMLAttributes>;

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

@@ -0,0 +1,3 @@
+export { useDivider } from './composables/useDivider';
+export type { DividerClasses, DividerColorOverrides, DividerOrientationOverrides, DividerOwnProps, DividerProps, } from './divider.types';
+export { default as Divider } from './Divider.vue';

package/dist/Components/Divider/index.js

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

package/dist/Components/Listbox/Listbox.vue_vue_type_script_setup_true_lang.js

@@ -59,32 +59,32 @@ var M = { key: 1 }, N = /* @__PURE__ */ m({
 		O(F, (e) => {
 			P("show-change", e);
 		});
-		let I = m, { checkClass: L, scrollBind: R, contentBind: z, messageBind: B, loadingBind: V, sizeClasses: H, mergedClasses: U, loadingTrackBind: W, optionSelectedClass: G, optionHighlightedClass: K } = r(I, {
+		let I = m, { merged: L, checkClass: R, scrollBind: z, messageBind: B, loadingBind: V, sizeClasses: H, mergedClasses: U, loadingTrackBind: W, optionSelectedClass: G, optionHighlightedClass: K } = r(I, {
 			size: "md",
 			color: "primary"
-		}), q = s(() => ({ content: z.value })), J = s(() => !I.loading && I.options.length === 0 && I.hideEmptyMessage !== !0), Y = s(() => A(L.value, U.value.check));
-		function X(e) {
+		}), q = s(() => !I.loading && I.options.length === 0 && I.hideEmptyMessage !== !0), J = s(() => A(R.value, U.value.check));
+		function Y(e) {
 			return I.isSelected?.(e) ?? !1;
 		}
-		function Z(e) {
+		function X(e) {
 			return I.highlightedIndex === e;
 		}
-		function Q(e) {
+		function Z(e) {
 			e.preventDefault();
 		}
-		function $(e, t) {
+		function Q(e, t) {
 			let n = {
 				tabindex: -1,
-				onMousedown: Q,
+				onMousedown: Z,
 				class: A(H.value?.option)
 			};
-			return X(e.value) ? n.class = A(n.class, G.value, U.value.optionSelected) : Z(t) && (n.class = A(n.class, K.value, U.value.optionHighlighted)), {
+			return Y(e.value) ? n.class = A(n.class, G.value, U.value.optionSelected) : X(t) && (n.class = A(n.class, K.value, U.value.optionHighlighted)), {
 				interactive: n,
 				primary: { class: H.value?.primary },
 				secondary: { class: H.value?.secondary }
 			};
 		}
-		function ee(e) {
+		function $(e) {
 			e.disabled || P("select", e);
 		}
 		return (r, s) => (b(), c(T(a), {
@@ -93,12 +93,12 @@ var M = { key: 1 }, N = /* @__PURE__ */ m({
 			"anchor-el": m.anchorEl,
 			placement: m.placement,
 			"close-on-click-away": !0,
-			"custom-props": q.value,
-			"disable-auto-focus": m.disableAutoFocus
+			"disable-auto-focus": m.disableAutoFocus,
+			"custom-props": { content: T(L).customProps?.content }
 		}, {
 			default: k(() => [
 				T(e)(T(N), "beforeOptions") ? (b(), c(C(T(t)(T(N), "beforeOptions")), { key: 0 })) : l("", !0),
-				m.loading ? (b(), u(o, { key: 1 }, [d("div", y(h(T(W))), [d("div", y(h(T(V))), null, 16)], 16), d("div", y(h(T(B))), [T(e)(T(N), "loading") ? (b(), c(C(T(t)(T(N), "loading")), { key: 0 })) : (b(), u("span", M, w(m.loadingMessage), 1))], 16)], 64)) : (b(), u("div", y(_({ key: 2 }, T(R))), [p(T(n), {
+				m.loading ? (b(), u(o, { key: 1 }, [d("div", y(h(T(W))), [d("div", y(h(T(V))), null, 16)], 16), d("div", y(h(T(B))), [T(e)(T(N), "loading") ? (b(), c(C(T(t)(T(N), "loading")), { key: 0 })) : (b(), u("span", M, w(m.loadingMessage), 1))], 16)], 64)) : (b(), u("div", y(_({ key: 2 }, T(z))), [p(T(n), {
 					dense: "",
 					role: "listbox",
 					padding: "none",
@@ -114,20 +114,20 @@ var M = { key: 1 }, N = /* @__PURE__ */ m({
 						key: String(t.value),
 						disabled: t.disabled,
 						secondary: t.description,
-						onClick: (e) => ee(t),
+						onClick: (e) => $(t),
 						id: `${m.listboxId}-option-${n}`,
-						"aria-selected": X(t.value),
-						"custom-props": $(t, n)
+						"aria-selected": Y(t.value),
+						"custom-props": Q(t, n)
 					}, f({ _: 2 }, [T(e)(T(N), "option") ? {
 						name: "default",
 						fn: k(() => [S(r.$slots, "option", {
 							option: t,
-							selected: X(t.value)
+							selected: Y(t.value)
 						})]),
 						key: "0"
-					} : void 0, m.showCheckmark && X(t.value) ? {
+					} : void 0, m.showCheckmark && Y(t.value) ? {
 						name: "end",
-						fn: k(() => [p(T(j), { class: v(Y.value) }, null, 8, ["class"])]),
+						fn: k(() => [p(T(j), { class: v(J.value) }, null, 8, ["class"])]),
 						key: "1"
 					} : void 0]), 1032, [
 						"primary",
@@ -144,7 +144,7 @@ var M = { key: 1 }, N = /* @__PURE__ */ m({
 					"aria-labelledby",
 					"aria-multiselectable"
 				])], 16)),
-				J.value && !T(e)(T(N), "empty") ? (b(), u("div", y(_({ key: 3 }, T(B))), w(m.emptyMessage), 17)) : J.value && T(e)(T(N), "empty") ? (b(), c(C(T(t)(T(N), "empty")), { key: 4 })) : l("", !0),
+				q.value && !T(e)(T(N), "empty") ? (b(), u("div", y(_({ key: 3 }, T(B))), w(m.emptyMessage), 17)) : q.value && T(e)(T(N), "empty") ? (b(), c(C(T(t)(T(N), "empty")), { key: 4 })) : l("", !0),
 				T(e)(T(N), "afterOptions") ? (b(), c(C(T(t)(T(N), "afterOptions")), { key: 5 })) : l("", !0)
 			]),
 			_: 3
@@ -152,8 +152,8 @@ var M = { key: 1 }, N = /* @__PURE__ */ m({
 			"modelValue",
 			"anchor-el",
 			"placement",
-			"custom-props",
-			"disable-auto-focus"
+			"disable-auto-focus",
+			"custom-props"
 		]));
 	}
 });

package/dist/Components/Listbox/composables/useListbox.d.ts

@@ -7,7 +7,6 @@ export declare function useListbox(props: ListboxOwnProps, libDefaults: ListboxL
     merged: import('vue').ComputedRef<ListboxMerged>;
     checkClass: import('vue').ComputedRef<string>;
     scrollBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
-    contentBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
     messageBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", {}, {}>>;
     loadingBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
     sizeClasses: import('vue').ComputedRef<import('@bridge-ui/core').ListboxSizeItem | undefined>;

package/dist/Components/Listbox/composables/useListbox.js

@@ -27,17 +27,17 @@ function p(p, m) {
 	}), y = n({
 		entry: v,
 		props: () => g.value.componentProps
-	}), b = r(() => a(s(l, v.value?.customProps?.color), _.value.color ?? "primary")), x = r(() => s(u, v.value?.customProps?.invalidated)), S = r(() => _.value.invalidated ? x.value : b.value), C = r(() => a(s(d, v.value?.customProps?.size), _.value.size ?? "md")), w = r(() => S.value?.selected), T = r(() => S.value?.highlighted), E = r(() => o(C.value?.check, S.value?.check)), D = r(() => e(_.value.customProps?.content, {}, o({ relative: !0 }))), O = r(() => {
+	}), b = r(() => a(s(l, v.value?.customProps?.color), _.value.color ?? "primary")), x = r(() => s(u, v.value?.customProps?.invalidated)), S = r(() => _.value.invalidated ? x.value : b.value), C = r(() => a(s(d, v.value?.customProps?.size), _.value.size ?? "md")), w = r(() => S.value?.selected), T = r(() => S.value?.highlighted), E = r(() => o(C.value?.check, S.value?.check)), D = r(() => {
 		let t = _.value.maxHeight ?? "max-h-60", n = _.value.disableMaxHeight === !0;
 		return e(_.value.customProps?.scroll, {}, o({
 			"overflow-y-auto overscroll-contain": !n,
 			[t]: !n,
 			[y.value.scroll ?? ""]: !0
 		}));
-	}), k = r(() => e({}, {
+	}), O = r(() => e({}, {
 		role: "progressbar",
 		"aria-hidden": !0
-	}, o({ "h-0.5 w-full shrink-0 overflow-hidden": !0 }))), A = r(() => e(_.value.customProps?.loading, {}, o({
+	}, o({ "h-0.5 w-full shrink-0 overflow-hidden": !0 }))), k = r(() => e(_.value.customProps?.loading, {}, o({
 		"h-full w-1/3 animate-bridge-listbox-indeterminate": !0,
 		[b.value?.progressColor ?? ""]: !0,
 		[y.value.loading ?? ""]: !0
@@ -45,16 +45,15 @@ function p(p, m) {
 	return {
 		merged: _,
 		checkClass: E,
-		scrollBind: O,
-		contentBind: D,
+		scrollBind: D,
 		messageBind: r(() => e({}, {}, o({
 			"text-gray-500": !0,
 			[C.value?.message ?? ""]: !0
 		}))),
-		loadingBind: A,
+		loadingBind: k,
 		sizeClasses: C,
 		mergedClasses: y,
-		loadingTrackBind: k,
+		loadingTrackBind: O,
 		optionSelectedClass: w,
 		optionHighlightedClass: T
 	};

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/augments.d.ts

@@ -5,6 +5,7 @@ import { ButtonClasses, ButtonProps } from './Components/Button';
 import { CardClasses, CardProps } from './Components/Card';
 import { CheckboxClasses, CheckboxProps } from './Components/Checkbox';
 import { ChipClasses, ChipProps } from './Components/Chip';
+import { DividerClasses, DividerProps } from './Components/Divider';
 import { FormControlClasses, FormControlProps } from './Components/FormControl';
 import { FormFieldClasses, FormFieldProps } from './Components/FormField';
 import { IconProps } from './Components/Icon';
@@ -19,6 +20,7 @@ import { NumberFieldClasses } from './Components/NumberField';
 import { PasswordFieldClasses } from './Components/PasswordField';
 import { RadioClasses, RadioProps } from './Components/Radio';
 import { SelectClasses, SelectProps } from './Components/Select';
+import { SkeletonClasses, SkeletonProps } from './Components/Skeleton';
 import { SnackbarClasses, SnackbarProps } from './Components/Snackbar';
 import { SwitchClasses, SwitchProps } from './Components/Switch';
 import { TextareaClasses, TextareaProps } from './Components/Textarea';
@@ -51,6 +53,10 @@ declare module "@bridge-ui/core" {
         classes: ChipClasses;
         defaultProps: Partial<Pick<ChipProps, "size">>;
     }
+    interface DividerConfigOverrides {
+        classes: DividerClasses;
+        defaultProps: Partial<Pick<DividerProps, "color" | "orientation">>;
+    }
     interface FormControlConfigOverrides {
         classes: FormControlClasses;
         defaultProps: Partial<Pick<FormControlProps, "size" | "error" | "withoutErrorMessage">>;
@@ -107,6 +113,10 @@ declare module "@bridge-ui/core" {
         classes: SelectClasses;
         defaultProps: Partial<Pick<SelectProps, "size" | "color" | "rounded" | "variant">>;
     }
+    interface SkeletonConfigOverrides {
+        classes: SkeletonClasses;
+        defaultProps: Partial<Pick<SkeletonProps, "rounded">>;
+    }
     interface SwitchConfigOverrides {
         classes: SwitchClasses;
         defaultProps: Partial<Pick<SwitchProps, "size" | "color" | "rounded">>;

package/dist/index.d.ts

@@ -12,6 +12,8 @@ export { Checkbox, useCheckbox } from './Components/Checkbox';
 export type { CheckboxClasses, CheckboxColorOverrides, CheckboxCustomProps, CheckboxOwnProps, CheckboxProps, CheckboxRoundedOverrides, CheckboxSizeOverrides, CheckboxSlots, } from './Components/Checkbox';
 export { Chip, useChip } from './Components/Chip';
 export type { ChipClasses, ChipCustomProps, ChipEmits, ChipOwnProps, ChipProps, ChipSizeOverrides, ChipSlots, } from './Components/Chip';
+export { Divider, useDivider } from './Components/Divider';
+export type { DividerClasses, DividerColorOverrides, DividerOrientationOverrides, DividerOwnProps, DividerProps, } from './Components/Divider';
 export { FormControl, useFormControl } from './Components/FormControl';
 export type { FormControlClasses, FormControlCustomProps, FormControlOwnProps, FormControlProps, FormControlSizeOverrides, FormControlSlots, UseFormControlReturn, } from './Components/FormControl';
 export { FormField, useFormField } from './Components/FormField';
@@ -42,6 +44,8 @@ export { Radio, useRadio } from './Components/Radio';
 export type { RadioClasses, RadioColorOverrides, RadioCustomProps, RadioOwnProps, RadioProps, RadioRoundedOverrides, RadioSizeOverrides, RadioSlots, } from './Components/Radio';
 export { Select, SelectOption } from './Components/Select';
 export type { SelectAsyncData, SelectClasses, SelectEmits, SelectModel, SelectOptionData, SelectOptionProps, SelectProps, SelectSlots, SelectValue, } from './Components/Select';
+export { Skeleton, useSkeleton } from './Components/Skeleton';
+export type { SkeletonClasses, SkeletonOwnProps, SkeletonProps, SkeletonRoundedOverrides, } from './Components/Skeleton';
 export { Snackbar, useSnackbar } from './Components/Snackbar';
 export type { SnackbarClasses, SnackbarColorOverrides, SnackbarCustomProps, SnackbarEmits, SnackbarOwnProps, SnackbarPaddingOverrides, SnackbarProps, SnackbarSlots, SnackbarTransitionOverrides, } from './Components/Snackbar';
 export { Switch, useSwitch } from './Components/Switch';

package/dist/index.js

@@ -16,40 +16,44 @@ import { useCheckbox as h } from "./Components/Checkbox/composables/useCheckbox.
 import g from "./Components/Checkbox/Checkbox.js";
 import { useChip as _ } from "./Components/Chip/composables/useChip.js";
 import v from "./Components/Chip/Chip.js";
-import { useFormField as y } from "./Components/FormField/composables/useFormField.js";
-import b from "./Components/FormField/FormField.js";
-import { useLabel as x } from "./Components/Label/composables/useLabel.js";
-import S from "./Components/Label/Label.js";
-import { useLink as C } from "./Components/Link/composables/useLink.js";
-import w from "./Components/Link/Link.js";
-import { useList as T } from "./Components/List/composables/useList.js";
-import E from "./Components/List/List.js";
-import { useListbox as D } from "./Components/Listbox/composables/useListbox.js";
-import { findFirstEnabledOptionIndex as O, findLastEnabledOptionIndex as k, getListboxActiveDescendantId as A, getListboxOptionId as j, moveListboxHighlight as M, useListboxNavigation as N } from "./Components/Listbox/composables/useListboxNavigation.js";
-import P from "./Components/ListItem/ListItem.js";
-import { useMenu as F } from "./Components/Menu/composables/useMenu.js";
-import I from "./Components/Menu/Menu.js";
-import L from "./Components/Listbox/Listbox.js";
-import R from "./Components/ListSection/ListSection.js";
-import { useModal as z } from "./Components/Modal/composables/useModal.js";
-import B from "./Components/Modal/Modal.js";
-import { useNumberField as V } from "./Components/NumberField/composables/useNumberField.js";
-import H from "./Components/NumberField/NumberField.js";
-import { usePasswordField as U } from "./Components/PasswordField/composables/usePasswordField.js";
-import W from "./Components/PasswordField/PasswordField.js";
-import { useRadio as G } from "./Components/Radio/composables/useRadio.js";
-import K from "./Components/Radio/Radio.js";
-import q from "./Components/Select/Select.js";
-import J from "./Components/Select/SelectOption.js";
-import { useSnackbar as Y } from "./Components/Snackbar/composables/useSnackbar.js";
-import X from "./Components/Snackbar/Snackbar.js";
-import { useSwitch as Z } from "./Components/Switch/composables/useSwitch.js";
-import Q from "./Components/Switch/Switch.js";
-import { useTextarea as $ } from "./Components/Textarea/composables/useTextarea.js";
-import ee from "./Components/Textarea/Textarea.js";
-import { useTextField as te } from "./Components/TextField/composables/useTextField.js";
-import ne from "./Components/TextField/TextField.js";
-import re from "./Provider/BridgeUIProvider.js";
-import { createBridgeUI as ie } from "./Provider/createBridgeUI.js";
-import { BRIDGE_UI_DEFAULT_GLOBAL as ae, cn as oe, mergeBridgeUIComponents as se, mergeBridgeUIGlobal as ce, resolveBridgeUIOptions as le } from "@bridge-ui/core";
-export { a as Alert, o as Avatar, ae as BRIDGE_UI_DEFAULT_GLOBAL, c as Badge, re as BridgeUIProvider, u as Button, f as Card, g as Checkbox, v as Chip, m as FormControl, b as FormField, i as Icon, S as Label, w as Link, E as List, P as ListItem, R as ListSection, L as Listbox, I as Menu, B as Modal, H as NumberField, W as PasswordField, K as Radio, q as Select, J as SelectOption, X as Snackbar, Q as Switch, ne as TextField, ee as Textarea, oe as cn, ie as createBridgeUI, O as findFirstEnabledOptionIndex, k as findLastEnabledOptionIndex, A as getListboxActiveDescendantId, j as getListboxOptionId, se as mergeBridgeUIComponents, ce as mergeBridgeUIGlobal, M as moveListboxHighlight, le as resolveBridgeUIOptions, r as useAlert, s as useBadge, e as useBridgeUI, t as useBridgeUIComponent, n as useBridgeUIMergedRegistryClasses, l as useButton, d as useCard, h as useCheckbox, _ as useChip, p as useFormControl, y as useFormField, x as useLabel, C as useLink, T as useList, D as useListbox, N as useListboxNavigation, F as useMenu, z as useModal, V as useNumberField, U as usePasswordField, G as useRadio, Y as useSnackbar, Z as useSwitch, te as useTextField, $ as useTextarea };
+import { useDivider as y } from "./Components/Divider/composables/useDivider.js";
+import b from "./Components/Divider/Divider.js";
+import { useFormField as x } from "./Components/FormField/composables/useFormField.js";
+import S from "./Components/FormField/FormField.js";
+import { useLabel as C } from "./Components/Label/composables/useLabel.js";
+import w from "./Components/Label/Label.js";
+import { useLink as T } from "./Components/Link/composables/useLink.js";
+import E from "./Components/Link/Link.js";
+import { useList as D } from "./Components/List/composables/useList.js";
+import O from "./Components/List/List.js";
+import { useListbox as k } from "./Components/Listbox/composables/useListbox.js";
+import { findFirstEnabledOptionIndex as A, findLastEnabledOptionIndex as j, getListboxActiveDescendantId as M, getListboxOptionId as N, moveListboxHighlight as P, useListboxNavigation as F } from "./Components/Listbox/composables/useListboxNavigation.js";
+import I from "./Components/ListItem/ListItem.js";
+import { useMenu as L } from "./Components/Menu/composables/useMenu.js";
+import R from "./Components/Menu/Menu.js";
+import z from "./Components/Listbox/Listbox.js";
+import B from "./Components/ListSection/ListSection.js";
+import { useModal as V } from "./Components/Modal/composables/useModal.js";
+import H from "./Components/Modal/Modal.js";
+import { useNumberField as U } from "./Components/NumberField/composables/useNumberField.js";
+import W from "./Components/NumberField/NumberField.js";
+import { usePasswordField as G } from "./Components/PasswordField/composables/usePasswordField.js";
+import K from "./Components/PasswordField/PasswordField.js";
+import { useRadio as q } from "./Components/Radio/composables/useRadio.js";
+import J from "./Components/Radio/Radio.js";
+import Y from "./Components/Select/Select.js";
+import X from "./Components/Select/SelectOption.js";
+import { useSkeleton as Z } from "./Components/Skeleton/composables/useSkeleton.js";
+import Q from "./Components/Skeleton/Skeleton.js";
+import { useSnackbar as $ } from "./Components/Snackbar/composables/useSnackbar.js";
+import ee from "./Components/Snackbar/Snackbar.js";
+import { useSwitch as te } from "./Components/Switch/composables/useSwitch.js";
+import ne from "./Components/Switch/Switch.js";
+import { useTextarea as re } from "./Components/Textarea/composables/useTextarea.js";
+import ie from "./Components/Textarea/Textarea.js";
+import { useTextField as ae } from "./Components/TextField/composables/useTextField.js";
+import oe from "./Components/TextField/TextField.js";
+import se from "./Provider/BridgeUIProvider.js";
+import { createBridgeUI as ce } from "./Provider/createBridgeUI.js";
+import { BRIDGE_UI_DEFAULT_GLOBAL as le, cn as ue, mergeBridgeUIComponents as de, mergeBridgeUIGlobal as fe, resolveBridgeUIOptions as pe } from "@bridge-ui/core";
+export { a as Alert, o as Avatar, le as BRIDGE_UI_DEFAULT_GLOBAL, c as Badge, se as BridgeUIProvider, u as Button, f as Card, g as Checkbox, v as Chip, b as Divider, m as FormControl, S as FormField, i as Icon, w as Label, E as Link, O as List, I as ListItem, B as ListSection, z as Listbox, R as Menu, H as Modal, W as NumberField, K as PasswordField, J as Radio, Y as Select, X as SelectOption, Q as Skeleton, ee as Snackbar, ne as Switch, oe as TextField, ie as Textarea, ue as cn, ce as createBridgeUI, A as findFirstEnabledOptionIndex, j as findLastEnabledOptionIndex, M as getListboxActiveDescendantId, N as getListboxOptionId, de as mergeBridgeUIComponents, fe as mergeBridgeUIGlobal, P as moveListboxHighlight, pe as resolveBridgeUIOptions, r as useAlert, s as useBadge, e as useBridgeUI, t as useBridgeUIComponent, n as useBridgeUIMergedRegistryClasses, l as useButton, d as useCard, h as useCheckbox, _ as useChip, y as useDivider, p as useFormControl, x as useFormField, C as useLabel, T as useLink, D as useList, k as useListbox, F as useListboxNavigation, L as useMenu, V as useModal, U as useNumberField, G as usePasswordField, q as useRadio, Z as useSkeleton, $ as useSnackbar, te as useSwitch, ae as useTextField, re as useTextarea };

package/package.json

@@ -1,7 +1,7 @@
 {
   "type": "module",
   "license": "MIT",
-  "version": "0.0.1-beta.3",
+  "version": "0.0.1-beta.4",
   "author": "BridgeUI",
   "sideEffects": false,
   "name": "@bridge-ui/vue",
@@ -60,7 +60,7 @@
     "dist"
   ],
   "peerDependencies": {
-    "@bridge-ui/core": "^0.0.1-beta.3",
+    "@bridge-ui/core": "^0.0.1-beta.4",
     "@lucide/vue": ">=1.0.0",
     "vue": "^3.4.0"
   },