@bridge-ui/vue 0.5.1 → 0.7.0

package/dist/Components/Pagination/composables/usePagination.js

@@ -1,11 +1,12 @@
-import { mergePartBind as e, useBridgeUIComponent as t, useBridgeUIMergedRegistryClasses as n } from "../../../Utils/index.js";
-import { computed as r, useAttrs as i, useSlots as a } from "vue";
-import { get as o } from "es-toolkit/compat";
-import { getPaginationItems as s } from "@bridge-ui/core/Domain";
-import { paginationColorProps as ee, paginationRoundedProps as c, paginationSizeProps as l, paginationVariantProps as u } from "@bridge-ui/core/Tokens";
-import { cn as d, mergeBridgeUILayeredClasses as f, splitComponentProps as p } from "@bridge-ui/core/Utils";
+import { useResolveMessage as e } from "../../../Adapters/I18n/useI18nAdapter.js";
+import { mergePartBind as t, useBridgeUIComponent as n, useBridgeUIMergedRegistryClasses as r } from "../../../Utils/index.js";
+import { computed as i, useAttrs as a, useSlots as o } from "vue";
+import { get as s } from "es-toolkit/compat";
+import { getPaginationItems as c } from "@bridge-ui/core/Domain";
+import { paginationColorProps as l, paginationRoundedProps as u, paginationSizeProps as d, paginationVariantProps as f } from "@bridge-ui/core/Tokens";
+import { cn as p, mergeBridgeUILayeredClasses as m, splitComponentProps as h } from "@bridge-ui/core/Utils";
 //#region src/Components/Pagination/composables/usePagination.ts
-var m = [
+var g = [
 	"mode",
 	"size",
 	"color",
@@ -23,166 +24,163 @@ var m = [
 	"hideNextButton",
 	"hidePrevButton"
 ];
-function h(h, g, _, v) {
-	let y = i(), b = a(), x = r(() => p({
+function _(_, v, y, b) {
+	let x = e(), S = a(), C = o(), w = i(() => h({
 		props: {
-			...y,
-			...h
+			...S,
+			..._
 		},
-		bridgeKeys: m
-	})), { merged: S, entry: C } = t({
-		libDefaults: g,
+		bridgeKeys: g
+	})), { merged: T, entry: E } = n({
+		libDefaults: v,
 		componentName: "Pagination",
-		props: () => x.value.componentProps
-	}), w = r(() => S.value.customProps), T = r(() => S.value.mode === "simple" ? 1 : _.value ?? 1), E = r(() => S.value.mode === "simple" ? [] : s({
-		page: T.value,
-		count: S.value.count ?? 0,
-		siblingCount: S.value.siblingCount,
-		boundaryCount: S.value.boundaryCount
-	})), D = n({
-		entry: C,
-		props: () => x.value.componentProps
-	}), O = r(() => f(l, C.value?.tokens?.size)), k = r(() => f(u, C.value?.tokens?.variant)), A = r(() => f(ee, C.value?.tokens?.color)), j = r(() => f(c, C.value?.tokens?.rounded)), M = r(() => o(O.value, S.value.size)), N = r(() => o(k.value, S.value.variant)), P = r(() => o(A.value, S.value.color)), F = r(() => o(j.value, S.value.rounded)), I = (e) => {
-		if (S.value.disabled) return;
-		let t = S.value.count ?? 0, n = Math.min(Math.max(1, e), Math.max(t, 1));
-		_.value = n, v("change", n), v("update:modelValue", n);
-	}, L = () => {
-		if (!S.value.disabled) {
-			if (S.value.mode === "simple") {
-				if (S.value.hasPrevious === !1) return;
-				v("previous");
+		props: () => w.value.componentProps
+	}), D = i(() => T.value.customProps), O = i(() => T.value.mode === "simple" ? 1 : y.value ?? 1), k = i(() => T.value.mode === "simple" ? [] : c({
+		page: O.value,
+		count: T.value.count ?? 0,
+		siblingCount: T.value.siblingCount,
+		boundaryCount: T.value.boundaryCount
+	})), A = r({
+		entry: E,
+		props: () => w.value.componentProps
+	}), j = i(() => m(d, E.value?.tokens?.size)), M = i(() => m(f, E.value?.tokens?.variant)), ee = i(() => m(l, E.value?.tokens?.color)), te = i(() => m(u, E.value?.tokens?.rounded)), N = i(() => s(j.value, T.value.size)), P = i(() => s(M.value, T.value.variant)), F = i(() => s(ee.value, T.value.color)), I = i(() => s(te.value, T.value.rounded)), L = (e) => {
+		if (T.value.disabled) return;
+		let t = T.value.count ?? 0, n = Math.min(Math.max(1, e), Math.max(t, 1));
+		y.value = n, b("change", n), b("update:modelValue", n);
+	}, R = () => {
+		if (!T.value.disabled) {
+			if (T.value.mode === "simple") {
+				if (T.value.hasPrevious === !1) return;
+				b("previous");
 				return;
 			}
-			I(T.value - 1);
+			L(O.value - 1);
 		}
-	}, R = () => {
-		if (!S.value.disabled) {
-			if (S.value.mode === "simple") {
-				if (S.value.hasNext === !1) return;
-				v("next");
+	}, z = () => {
+		if (!T.value.disabled) {
+			if (T.value.mode === "simple") {
+				if (T.value.hasNext === !1) return;
+				b("next");
 				return;
 			}
-			I(T.value + 1);
+			L(O.value + 1);
 		}
-	}, z = r(() => S.value.disabled ? !0 : S.value.mode === "simple" ? S.value.hasPrevious === !1 : T.value <= 1), B = r(() => S.value.disabled ? !0 : S.value.mode === "simple" ? S.value.hasNext === !1 : T.value >= (S.value.count ?? 0)), V = r(() => !S.value.hidePrevButton), H = r(() => !S.value.hideNextButton), U = r(() => S.value.variant === "outlined"), W = r(() => S.value.variant === "ghost"), G = r(() => d({
-		[o(M.value, "item") ?? ""]: !0,
-		[o(N.value, "item") ?? ""]: !0,
-		[o(F.value, "item") ?? ""]: W.value
-	})), K = r(() => d({
-		[o(M.value, "itemIcon") ?? ""]: !0,
-		[o(N.value, "item") ?? ""]: !0,
-		[o(F.value, "item") ?? ""]: W.value
-	})), q = r(() => {
-		let e = S.value.variant;
-		return d({
-			[o(N.value, "itemSelected") ?? ""]: !0,
-			[o(P.value, "itemSelectedFilled") ?? ""]: e === "outlined",
-			[o(P.value, "itemSelectedAccent") ?? ""]: e === "text" || e === "ghost",
-			[o(P.value, "itemSelectedSoft") ?? ""]: e === "ghost"
-		});
-	}), J = r(() => {
-		let e = E.value.filter((e) => e.type === "page");
+	}, B = i(() => T.value.disabled ? !0 : T.value.mode === "simple" ? T.value.hasPrevious === !1 : O.value <= 1), V = i(() => T.value.disabled ? !0 : T.value.mode === "simple" ? T.value.hasNext === !1 : O.value >= (T.value.count ?? 0)), H = i(() => !T.value.hidePrevButton), U = i(() => !T.value.hideNextButton), W = i(() => T.value.variant === "outlined"), G = i(() => T.value.variant === "ghost" || T.value.variant === "text"), K = i(() => p({
+		[s(N.value, "item") ?? ""]: !0,
+		[s(P.value, "item") ?? ""]: !0,
+		[s(I.value, "item") ?? ""]: G.value
+	})), q = i(() => p({
+		[s(N.value, "itemIcon") ?? ""]: !0,
+		[s(P.value, "item") ?? ""]: !0,
+		[s(I.value, "item") ?? ""]: G.value
+	})), J = i(() => p({
+		[s(P.value, "itemSelected") ?? ""]: !0,
+		[s(F.value, "itemSelectedAccent") ?? ""]: !0
+	})), Y = i(() => {
+		let e = k.value.filter((e) => e.type === "page");
 		return {
 			first: e[0]?.page,
 			last: e[e.length - 1]?.page
 		};
-	}), Y = (e, t) => {
-		if (!U.value) return !1;
+	}), X = (e, t) => {
+		if (!W.value) return !1;
 		if (e === "prev") return !0;
-		if (V.value) return !1;
-		let n = E.value[0];
+		if (H.value) return !1;
+		let n = k.value[0];
 		return e === "page" ? n?.type === "page" && n.page === t : e === "ellipsis" && n?.type === "ellipsis" && t === 0;
-	}, X = r(() => {
-		let t = x.value.inheritedAttrs;
-		return e(w.value?.root, t, {
-			"aria-label": t["aria-label"] ?? "Pagination",
-			class: d({
-				[o(M.value, "root") ?? ""]: !0,
-				[o(D.value, "root") ?? ""]: !0
+	}, Z = i(() => x("Previous")), Q = i(() => x("Next")), ne = i(() => {
+		let e = w.value.inheritedAttrs;
+		return t(D.value?.root, e, {
+			"aria-label": e["aria-label"] ?? x("Pagination"),
+			class: p({
+				[s(N.value, "root") ?? ""]: !0,
+				[s(A.value, "root") ?? ""]: !0
 			})
 		});
-	}), Z = r(() => e(w.value?.list, {}, { class: d({
-		[o(M.value, "list") ?? ""]: !0,
-		[o(N.value, "list") ?? ""]: !0,
-		[o(F.value, "list") ?? ""]: U.value,
-		[o(D.value, "list") ?? ""]: !0
-	}) })), Q = (t) => {
-		let n = t === T.value, r = U.value && !V.value && t === J.value.first, i = U.value && !H.value && t === J.value.last;
-		return e(w.value?.item, {}, {
+	}), re = i(() => t(D.value?.list, {}, { class: p({
+		[s(N.value, "list") ?? ""]: !0,
+		[s(P.value, "list") ?? ""]: !0,
+		[s(I.value, "list") ?? ""]: W.value,
+		[s(A.value, "list") ?? ""]: !0
+	}) })), ie = (e) => {
+		let n = e === O.value, r = W.value && !H.value && e === Y.value.first, i = W.value && !U.value && e === Y.value.last;
+		return t(D.value?.item, {}, {
 			type: "button",
-			disabled: S.value.disabled,
-			"aria-label": `Page ${t}`,
+			disabled: T.value.disabled,
+			"aria-label": `Page ${e}`,
 			"aria-current": n ? "page" : void 0,
 			onClick: () => {
-				n || I(t);
+				n || L(e);
 			},
-			class: d({
-				[G.value]: !0,
-				[q.value]: n,
-				[o(D.value, "item") ?? ""]: !0,
-				"ml-0": Y("page", t),
-				[o(F.value, "itemStart") ?? ""]: r,
-				[o(F.value, "itemEnd") ?? ""]: i
+			class: p({
+				[K.value]: !0,
+				[J.value]: n,
+				[s(A.value, "item") ?? ""]: !0,
+				"ml-0": X("page", e),
+				[s(I.value, "itemStart") ?? ""]: r,
+				[s(I.value, "itemEnd") ?? ""]: i
 			})
 		});
-	}, te = (t) => e(w.value?.ellipsis, {}, {
+	}, ae = (e) => t(D.value?.ellipsis, {}, {
 		"aria-hidden": !0,
-		"data-ellipsis-index": t,
-		class: d({
-			[o(M.value, "ellipsis") ?? ""]: !0,
-			[o(N.value, "ellipsis") ?? ""]: !0,
-			[o(F.value, "item") ?? ""]: W.value,
-			[o(D.value, "ellipsis") ?? ""]: !0,
-			"ml-0": Y("ellipsis", t)
+		"data-ellipsis-index": e,
+		class: p({
+			[s(N.value, "ellipsis") ?? ""]: !0,
+			[s(P.value, "ellipsis") ?? ""]: !0,
+			[s(I.value, "item") ?? ""]: G.value,
+			[s(A.value, "ellipsis") ?? ""]: !0,
+			"ml-0": X("ellipsis", e)
 		})
-	}), $ = r(() => o(M.value, "icon") ?? "sm");
+	}), $ = i(() => s(N.value, "icon") ?? "sm");
 	return {
-		page: T,
-		slots: b,
-		merged: S,
-		entries: E,
-		showPrev: V,
-		showNext: H,
-		rootBind: X,
-		listBind: Z,
-		prevBind: r(() => e(w.value?.prev, {}, {
-			onClick: L,
+		page: O,
+		slots: C,
+		merged: T,
+		entries: k,
+		showPrev: H,
+		showNext: U,
+		rootBind: ne,
+		listBind: re,
+		prevBind: i(() => t(D.value?.prev, {}, {
+			onClick: R,
 			type: "button",
-			"aria-label": "Previous",
-			disabled: z.value,
-			class: d({
-				[K.value]: !0,
-				[o(D.value, "prev") ?? ""]: !0,
-				[o(D.value, "item") ?? ""]: !0,
-				"ml-0": U.value,
-				[o(F.value, "itemStart") ?? ""]: U.value
+			disabled: B.value,
+			"aria-label": Z.value,
+			class: p({
+				[q.value]: !0,
+				[s(A.value, "prev") ?? ""]: !0,
+				[s(A.value, "item") ?? ""]: !0,
+				"ml-0": W.value,
+				[s(I.value, "itemStart") ?? ""]: W.value
 			})
 		})),
-		nextBind: r(() => e(w.value?.next, {}, {
-			onClick: R,
-			"aria-label": "Next",
+		nextBind: i(() => t(D.value?.next, {}, {
+			onClick: z,
 			type: "button",
-			disabled: B.value,
-			class: d({
-				[K.value]: !0,
-				[o(D.value, "next") ?? ""]: !0,
-				[o(D.value, "item") ?? ""]: !0,
-				[o(F.value, "itemEnd") ?? ""]: U.value
+			disabled: V.value,
+			"aria-label": Q.value,
+			class: p({
+				[q.value]: !0,
+				[s(A.value, "next") ?? ""]: !0,
+				[s(A.value, "item") ?? ""]: !0,
+				[s(I.value, "itemEnd") ?? ""]: W.value
 			})
 		})),
-		getItemBind: Q,
-		prevIconBind: r(() => e(w.value?.prevIcon, {}, {
+		prevLabel: Z,
+		nextLabel: Q,
+		getItemBind: ie,
+		prevIconBind: i(() => t(D.value?.prevIcon, {}, {
 			"aria-hidden": !0,
 			size: $.value,
 			class: "shrink-0 pointer-events-none"
 		})),
-		nextIconBind: r(() => e(w.value?.nextIcon, {}, {
+		nextIconBind: i(() => t(D.value?.nextIcon, {}, {
 			"aria-hidden": !0,
 			size: $.value,
 			class: "shrink-0 pointer-events-none"
 		})),
-		getEllipsisBind: te
+		getEllipsisBind: ae
 	};
 }
 //#endregion
-export { h as usePagination };
+export { _ as usePagination };

package/dist/Components/Pagination/pagination.types.d.ts

@@ -117,9 +117,9 @@ export interface PaginationOwnProps {
      */
     classes?: PaginationClasses;
     /**
-     * Selected page accent color.
+     * Optional text accent for the selected page. Selected surface comes from `variant`.
      *
-     * @default "primary"
+     * @default "dark"
      */
     color?: MergeProps<PaginationColor, PaginationColorOverrides>;
     /**
@@ -165,7 +165,7 @@ export interface PaginationOwnProps {
      */
     hidePrevButton?: boolean;
     /**
-     * Numbered pages vs prev/next only.
+     * Numbered pages, or prev/next only.
      *
      * @default "numbered"
      */
@@ -177,7 +177,7 @@ export interface PaginationOwnProps {
      */
     modelValue?: number;
     /**
-     * Control corner radius (`ghost` items / `outlined` group edges).
+     * Control corner radius (`ghost` / `text` items and `outlined` group edges).
      *
      * @default "md"
      */
@@ -197,7 +197,7 @@ export interface PaginationOwnProps {
     /**
      * Visual style of page / control buttons.
      *
-     * @default "text"
+     * @default "ghost"
      */
     variant?: MergeProps<PaginationVariant, PaginationVariantOverrides>;
 }

package/dist/Components/PasswordField/composables/usePasswordField.d.ts

@@ -437,7 +437,6 @@ export declare function usePasswordField(props: PasswordFieldOwnProps, options?:
         isNotched: import('vue').ComputedRef<boolean>;
         isStacked: import('vue').ComputedRef<boolean>;
         startBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
-        cornerBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         headerBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         isDisabled: import('vue').ComputedRef<boolean>;
         isReadonly: import('vue').ComputedRef<boolean>;
@@ -455,6 +454,7 @@ export declare function usePasswordField(props: PasswordFieldOwnProps, options?:
         ariaDescribedBy: import('vue').ComputedRef<string | undefined>;
         descriptionBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         stackedBodyBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", {}, {}>>;
+        fieldCornerProps: import('vue').ComputedRef<import('../../Label').LabelProps>;
         hasInsetLabelRow: import('vue').ComputedRef<boolean>;
         insetLabelRowBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         stackedInputRowBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", {}, {}>>;

package/dist/Components/Radio/composables/useRadio.js

@@ -73,7 +73,8 @@ function v(v, y, b) {
 	return {
 		merged: w,
 		dotBind: i(() => e(E.value?.dot, {}, p({
-			"rounded-full bg-white transition-transform duration-100": !0,
+			"rounded-full transition-transform duration-100": !0,
+			[k.value?.dot ?? "bg-white"]: !0,
 			"scale-0": !O.value,
 			"scale-100": O.value,
 			"h-[42%] w-[42%]": !0,

package/dist/Components/Select/composables/useSelect.d.ts

@@ -441,7 +441,6 @@ export declare function useSelect(props: SelectOwnProps, model: Ref<null | undef
         isNotched: import('vue').ComputedRef<boolean>;
         isStacked: import('vue').ComputedRef<boolean>;
         startBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
-        cornerBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         headerBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         isDisabled: import('vue').ComputedRef<boolean>;
         isReadonly: import('vue').ComputedRef<boolean>;
@@ -459,6 +458,7 @@ export declare function useSelect(props: SelectOwnProps, model: Ref<null | undef
         ariaDescribedBy: import('vue').ComputedRef<string | undefined>;
         descriptionBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         stackedBodyBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", {}, {}>>;
+        fieldCornerProps: import('vue').ComputedRef<import('../../Label').LabelProps>;
         hasInsetLabelRow: import('vue').ComputedRef<boolean>;
         insetLabelRowBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
         stackedInputRowBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", {}, {}>>;
@@ -729,7 +729,7 @@ export declare function useSelect(props: SelectOwnProps, model: Ref<null | undef
     listboxProps: import('vue').ComputedRef<{
         anchorEl?: null | HTMLElement;
         classes?: import('../../Listbox').ListboxClasses;
-        color: "info" | "error" | "success" | "warning" | "dark" | "primary" | "secondary";
+        color: "info" | "error" | "success" | "warning" | "black" | "dark" | "primary" | "secondary";
         customProps?: import('../../Listbox').ListboxCustomProps;
         disableAutoFocus: boolean;
         disableMaxHeight: boolean;