@bridge-ui/vue 0.1.0 → 0.2.0

package/dist/Components/CalendarDate/composables/useCalendarDate.js

@@ -2,16 +2,15 @@ import { useDateAdapter as e, useDateAdapterContext as t } from "../../../Adapte
 import { mergePartBind as n, useBridgeUIComponent as r, useBridgeUIMergedRegistryClasses as i } from "../../../Utils/index.js";
 import { computed as a, getCurrentInstance as o, ref as s, toValue as c, useAttrs as l } from "vue";
 import { get as ee, isFunction as u, isNil as d, omit as f } from "es-toolkit/compat";
-import { applyDateSelection as te, isDateDisabled as p, isDateInRangePreview as m, isDateRangeValue as h, isDateSelected as g, resolveCalendarDayInteractionState as _, resolveDatePickerMode as v, resolveStartOfWeek as y } from "@bridge-ui/core/Domain";
-import { calendarColorProps as b, calendarDayProps as x, calendarRoundedProps as S } from "@bridge-ui/core/Tokens";
-import { cn as C, getColorToken as w, mergeBridgeUILayeredClasses as T, splitComponentProps as E } from "@bridge-ui/core/Utils";
+import { applyDateSelection as p, isDateDisabled as m, isDateInRangePreview as h, isDateRangeValue as g, isDateSelected as _, resolveCalendarDayInteractionState as v, resolveDatePickerMode as y, resolveStartOfWeek as b } from "@bridge-ui/core/Domain";
+import { calendarColorProps as te, calendarDayProps as ne, calendarRoundedProps as x } from "@bridge-ui/core/Tokens";
+import { cn as S, getColorToken as C, mergeBridgeUILayeredClasses as w, splitComponentProps as re } from "@bridge-ui/core/Utils";
 //#region src/Components/CalendarDate/composables/useCalendarDate.ts
-var D = [
+var T = [
 	"color",
 	"error",
 	"range",
 	"value",
-	"tokens",
 	"classes",
 	"maxDate",
 	"minDate",
@@ -31,113 +30,114 @@ var D = [
 	"disableMonths",
 	"hideOutsideDays"
 ];
-function O(O, k, A) {
-	let ne = l(), j = e(), re = t(), M = a(() => E({
-		bridgeKeys: D,
+function E(E, D, O) {
+	let k = l(), A = e(), ie = t(), j = a(() => re({
+		bridgeKeys: T,
 		props: {
-			...ne,
-			...c(O)
+			...k,
+			...c(E)
 		}
-	})), { merged: N } = r({
-		libDefaults: k,
-		props: () => M.value.componentProps
-	}), P = a(() => N.value.customProps), F = a(() => f(M.value.inheritedAttrs, [
+	})), { merged: M, entry: N } = r({
+		libDefaults: D,
+		componentName: "Calendar",
+		props: () => j.value.componentProps
+	}), P = a(() => M.value.customProps), F = a(() => f(j.value.inheritedAttrs, [
 		"onChange",
 		"onViewDateChange",
 		"onPreviewDateChange"
 	])), I = i({
-		props: () => M.value.componentProps,
+		props: () => j.value.componentProps,
 		entry: a(() => {})
-	}), L = a(() => re(N.value.timeZone)), R = a(() => v({
-		range: N.value.range,
-		multiple: N.value.multiple
-	})), z = a(() => c(O)), B = a(() => !d(z.value.value)), V = a(() => !d(z.value.previewDate)), H = a(() => {
+	}), L = a(() => ie(M.value.timeZone)), R = a(() => y({
+		range: M.value.range,
+		multiple: M.value.multiple
+	})), z = a(() => c(E)), B = a(() => !d(z.value.value)), V = a(() => !d(z.value.previewDate)), H = a(() => {
 		let e = o()?.vnode.props ?? {}, t = u(e.onViewDateChange) || u(e["onUpdate:viewDate"]);
 		return !d(z.value.viewDate) && t;
-	}), U = s(N.value.defaultValue ?? null), W = s(null), G = s(z.value.viewDate ?? N.value.viewDate ?? j.value.startOfMonth(j.value.now(L.value), L.value)), K = a(() => B.value ? z.value.value ?? null : U.value), q = a(() => V.value ? z.value.previewDate : W.value), J = a(() => H.value ? z.value.viewDate : G.value), Y = a(() => y(N.value.startOfWeek)), X = a(() => T(x, N.value.tokens?.day)), ie = a(() => {
-		let e = T(S, N.value.tokens?.rounded);
-		return ee(e, N.value.rounded);
-	}), ae = a(() => {
-		let e = T(b, N.value.tokens?.color);
-		return w({
+	}), U = s(M.value.defaultValue ?? null), W = s(null), G = s(z.value.viewDate ?? M.value.viewDate ?? A.value.startOfMonth(A.value.now(L.value), L.value)), K = a(() => B.value ? z.value.value ?? null : U.value), q = a(() => V.value ? z.value.previewDate : W.value), J = a(() => H.value ? z.value.viewDate : G.value), Y = a(() => b(M.value.startOfWeek)), X = a(() => w(ne, N.value?.tokens?.day)), ae = a(() => {
+		let e = w(x, N.value?.tokens?.rounded);
+		return ee(e, M.value.rounded);
+	}), oe = a(() => {
+		let e = w(te, N.value?.tokens?.color);
+		return C({
 			tokens: e,
-			color: N.value.color,
-			invalid: N.value.error
+			color: M.value.color,
+			invalid: M.value.error
 		});
-	}), oe = a(() => {
-		let e = j.value.getWeekdayNames(L.value), t = Y.value;
-		return Array.from({ length: 7 }, (n, r) => e[(t + r) % 7] ?? "");
 	}), se = a(() => {
-		let e = j.value.getCalendarDays(J.value, Y.value, L.value), t = j.value.now(L.value);
+		let e = A.value.getWeekdayNames(L.value), t = Y.value;
+		return Array.from({ length: 7 }, (n, r) => e[(t + r) % 7] ?? "");
+	}), ce = a(() => {
+		let e = A.value.getCalendarDays(J.value, Y.value, L.value), t = A.value.now(L.value);
 		return e.map((e) => {
-			let n = !!N.value.disabled || p(e, {
-				adapter: j.value,
+			let n = !!M.value.disabled || m(e, {
+				adapter: A.value,
 				context: L.value,
-				maxDate: N.value.maxDate,
-				minDate: N.value.minDate,
-				disableDates: N.value.disableDates,
-				disableYears: N.value.disableYears,
-				disableMonths: N.value.disableMonths
-			}), r = g({
+				maxDate: M.value.maxDate,
+				minDate: M.value.minDate,
+				disableDates: M.value.disableDates,
+				disableYears: M.value.disableYears,
+				disableMonths: M.value.disableMonths
+			}), r = _({
 				date: e,
 				mode: R.value,
 				value: K.value,
-				adapter: j.value,
+				adapter: A.value,
 				context: L.value
-			}), i = R.value === "range" && m({
+			}), i = R.value === "range" && h({
 				date: e,
 				value: K.value,
-				adapter: j.value,
+				adapter: A.value,
 				context: L.value,
 				previewDate: q.value
 			});
 			return {
 				date: e,
-				state: _({
+				state: v({
 					disabled: n,
 					selected: r,
-					readOnly: N.value.readOnly
+					readOnly: M.value.readOnly
 				}),
 				preview: i,
 				selected: r,
-				disabled: n || !!N.value.readOnly,
-				label: String(j.value.getDate(e, L.value)),
-				today: j.value.isSameDay(e, t, L.value),
-				outside: !j.value.isSameMonth(e, J.value, L.value)
+				disabled: n || !!M.value.readOnly,
+				label: String(A.value.getDate(e, L.value)),
+				today: A.value.isSameDay(e, t, L.value),
+				outside: !A.value.isSameMonth(e, J.value, L.value)
 			};
 		});
 	}), Z = (e) => {
-		if (N.value.disabled || N.value.readOnly || p(e, {
-			adapter: j.value,
+		if (M.value.disabled || M.value.readOnly || m(e, {
+			adapter: A.value,
 			context: L.value,
-			maxDate: N.value.maxDate,
-			minDate: N.value.minDate,
-			disableDates: N.value.disableDates,
-			disableYears: N.value.disableYears,
-			disableMonths: N.value.disableMonths
+			maxDate: M.value.maxDate,
+			minDate: M.value.minDate,
+			disableDates: M.value.disableDates,
+			disableYears: M.value.disableYears,
+			disableMonths: M.value.disableMonths
 		})) return;
-		let t = te({
+		let t = p({
 			next: e,
 			mode: R.value,
 			value: K.value,
-			adapter: j.value,
+			adapter: A.value,
 			context: L.value
 		});
-		B.value || (U.value = t), A("change", t), R.value === "range" && Q(null);
+		B.value || (U.value = t), O("change", t), R.value === "range" && Q(null);
 	}, Q = (e) => {
-		V.value || (W.value = e), A("previewDateChange", e);
+		V.value || (W.value = e), O("previewDateChange", e);
 	}, $ = a(() => {
-		if (R.value !== "range" || !h(K.value)) return !1;
+		if (R.value !== "range" || !g(K.value)) return !1;
 		let [e, t] = K.value;
-		return j.value.isSameDay(e, t, L.value);
+		return A.value.isSameDay(e, t, L.value);
 	});
 	return {
-		days: se,
+		days: ce,
 		mode: R,
 		value: K,
-		merged: N,
+		merged: M,
 		context: L,
-		rootBind: a(() => n(P.value?.root, F.value, C({
+		rootBind: a(() => n(P.value?.root, F.value, S({
 			"flex flex-col": !0,
 			[I.value.root ?? ""]: !0
 		}))),
@@ -146,15 +146,15 @@ function O(O, k, A) {
 			onMouseleave: () => {
 				$.value && Q(null);
 			}
-		}, C({
+		}, S({
 			"grid grid-cols-7 gap-1": !0,
 			[I.value.grid ?? ""]: !0
 		}))),
-		weekdays: oe,
+		weekdays: se,
 		viewDate: J,
 		selectDay: Z,
 		getDayBind: (e) => {
-			let t = ae.value;
+			let t = oe.value;
 			return n(P.value?.day, {
 				type: "button",
 				disabled: e.disabled,
@@ -165,9 +165,9 @@ function O(O, k, A) {
 				onMouseenter: () => {
 					$.value && !e.disabled && Q(e.date);
 				}
-			}, C({
+			}, S({
 				"relative flex h-8 w-full cursor-pointer items-center justify-center text-sm focus:outline-none disabled:cursor-not-allowed disabled:opacity-50": !0,
-				[ie.value ?? ""]: !0,
+				[ae.value ?? ""]: !0,
 				[t?.base ?? ""]: e.state === "base",
 				[t?.hover ?? ""]: e.state === "base",
 				[t?.selected ?? ""]: e.state === "selected",
@@ -178,13 +178,13 @@ function O(O, k, A) {
 			}));
 		},
 		previewDate: q,
-		hideWeekdays: a(() => !!N.value.hideWeekdays),
-		getWeekdayBind: (e) => n(P.value?.weekday, {}, C({
+		hideWeekdays: a(() => !!M.value.hideWeekdays),
+		getWeekdayBind: (e) => n(P.value?.weekday, {}, S({
 			[X.value.weekday ?? ""]: !0,
 			[I.value.weekday ?? ""]: !0
 		})),
-		hideOutsideDays: a(() => !!N.value.hideOutsideDays)
+		hideOutsideDays: a(() => !!M.value.hideOutsideDays)
 	};
 }
 //#endregion
-export { O as useCalendarDate };
+export { E as useCalendarDate };

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

@@ -1,3 +1,3 @@
-export type { CalendarDateClasses, CalendarDateColorOverrides, CalendarDateCustomProps, CalendarDateDayCell, CalendarDateEmits, CalendarDateOwnProps, CalendarDateProps, CalendarDateRoundedOverrides, CalendarDateSlots, CalendarDateTokens, } from './calendarDate.types';
+export type { CalendarDateClasses, CalendarDateColorOverrides, CalendarDateCustomProps, CalendarDateDayCell, CalendarDateEmits, CalendarDateOwnProps, CalendarDateProps, CalendarDateRoundedOverrides, CalendarDateSlots, } from './calendarDate.types';
 export { default as CalendarDate } from './CalendarDate.vue';
 export { useCalendarDate } from './composables/useCalendarDate';

package/dist/Components/CalendarMonth/CalendarMonth.vue_vue_type_script_setup_true_lang.js

@@ -16,7 +16,6 @@ var f = /*@__PURE__*/ i({
 		readOnly: { type: Boolean },
 		rounded: {},
 		timeZone: {},
-		tokens: {},
 		value: {},
 		year: {}
 	},

package/dist/Components/CalendarMonth/calendarMonth.types.d.ts

@@ -1,5 +1,5 @@
 import { ButtonHTMLAttributes, HTMLAttributes } from 'vue';
-import { CalendarColor, CalendarColorItem, CalendarRounded } from '@bridge-ui/core/Tokens';
+import { CalendarColor, CalendarRounded } from '@bridge-ui/core/Tokens';
 import { MergeHtmlProps, MergeProps } from '@bridge-ui/core/Utils';
 export interface CalendarMonthColorOverrides {}
 export interface CalendarMonthRoundedOverrides {}
@@ -43,16 +43,6 @@ export interface CalendarMonthEmits {
      */
     change: [month: number];
 }
-export interface CalendarMonthTokens {
-    /**
-     * Color token map overrides.
-     */
-    color?: Record<string, Partial<CalendarColorItem>>;
-    /**
-     * Border radius token map overrides.
-     */
-    rounded?: Record<string, string>;
-}
 export interface CalendarMonthOwnProps {
     /**
      * Classes for calendar regions.
@@ -120,12 +110,6 @@ export interface CalendarMonthOwnProps {
      * @default undefined
      */
     timeZone?: string;
-    /**
-     * Token overrides.
-     *
-     * @default undefined
-     */
-    tokens?: CalendarMonthTokens;
     /**
      * Selected month (`0`–`11`).
      *

package/dist/Components/CalendarMonth/composables/useCalendarMonth.d.ts

@@ -15,7 +15,7 @@ export declare function useCalendarMonth(props: MaybeRefOrGetter<CalendarMonthOw
     year: import('vue').ComputedRef<number>;
     merged: import('vue').ComputedRef<CalendarMonthMerged>;
     months: import('vue').ComputedRef<CalendarMonthCell[]>;
-    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<CalendarMonthOwnProps, "error" | "color" | "value" | "classes" | "tokens" | "customProps" | "rounded" | "disabled" | "readOnly" | "disableMonths" | "maxDate" | "minDate" | "timeZone" | "year">>>>;
+    rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<CalendarMonthOwnProps, "error" | "color" | "value" | "classes" | "customProps" | "rounded" | "disabled" | "readOnly" | "disableMonths" | "maxDate" | "minDate" | "timeZone" | "year">>>>;
     gridBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {
         role: string;
     }>>;

package/dist/Components/CalendarMonth/composables/useCalendarMonth.js

@@ -11,7 +11,6 @@ var y = [
 	"color",
 	"error",
 	"value",
-	"tokens",
 	"classes",
 	"maxDate",
 	"minDate",
@@ -29,28 +28,29 @@ function b(b, x, S) {
 			...C,
 			...o(b)
 		}
-	})), { merged: D } = r({
+	})), { merged: D, entry: O } = r({
 		libDefaults: x,
+		componentName: "Calendar",
 		props: () => E.value.componentProps
-	}), O = a(() => D.value.customProps), k = a(() => u(E.value.inheritedAttrs, ["onChange"])), A = i({
+	}), k = a(() => D.value.customProps), A = a(() => u(E.value.inheritedAttrs, ["onChange"])), j = i({
 		props: () => E.value.componentProps,
 		entry: a(() => {})
-	}), j = a(() => T(D.value.timeZone)), M = a(() => D.value.year ?? w.value.getYear(w.value.now(j.value), j.value)), N = a(() => {
-		let e = _(m, D.value.tokens?.rounded);
+	}), M = a(() => T(D.value.timeZone)), N = a(() => D.value.year ?? w.value.getYear(w.value.now(M.value), M.value)), P = a(() => {
+		let e = _(m, O.value?.tokens?.rounded);
 		return c(e, D.value.rounded);
-	}), P = a(() => {
-		let e = _(p, D.value.tokens?.color);
+	}), F = a(() => {
+		let e = _(p, O.value?.tokens?.color);
 		return g({
 			tokens: e,
 			color: D.value.color,
 			invalid: D.value.error
 		});
-	}), F = a(() => w.value.getMonthNames(j.value).map((e, t) => {
+	}), I = a(() => w.value.getMonthNames(M.value).map((e, t) => {
 		let n = !!D.value.disabled || d({
 			month: t,
-			year: M.value,
+			year: N.value,
 			adapter: w.value,
-			context: j.value,
+			context: M.value,
 			maxDate: D.value.maxDate,
 			minDate: D.value.minDate,
 			disableMonths: D.value.disableMonths
@@ -66,45 +66,45 @@ function b(b, x, S) {
 			selected: r,
 			disabled: n || !!D.value.readOnly
 		};
-	})), I = (e) => {
+	})), L = (e) => {
 		D.value.disabled || D.value.readOnly || d({
 			month: e,
-			year: M.value,
+			year: N.value,
 			adapter: w.value,
-			context: j.value,
+			context: M.value,
 			maxDate: D.value.maxDate,
 			minDate: D.value.minDate,
 			disableMonths: D.value.disableMonths
 		}) || S("change", e);
 	};
 	return {
-		year: M,
+		year: N,
 		merged: D,
-		months: F,
-		rootBind: a(() => n(O.value?.root, k.value, h({
+		months: I,
+		rootBind: a(() => n(k.value?.root, A.value, h({
 			"flex flex-col": !0,
-			[A.value.root ?? ""]: !0
+			[j.value.root ?? ""]: !0
 		}))),
-		gridBind: a(() => n(O.value?.grid, { role: "grid" }, h({
+		gridBind: a(() => n(k.value?.grid, { role: "grid" }, h({
 			"grid grid-cols-3 gap-2": !0,
-			[A.value.grid ?? ""]: !0
+			[j.value.grid ?? ""]: !0
 		}))),
-		selectMonth: I,
+		selectMonth: L,
 		getMonthBind: (e) => {
-			let t = P.value;
-			return n(O.value?.month, {
+			let t = F.value;
+			return n(k.value?.month, {
 				type: "button",
 				disabled: e.disabled,
 				"aria-pressed": e.selected,
-				onClick: () => I(e.month)
+				onClick: () => L(e.month)
 			}, h({
 				"cursor-pointer px-2 py-4 text-xs uppercase transition-all duration-150 ease-in-out outline-none focus:ring-2 focus:ring-offset-2 disabled:cursor-not-allowed": !0,
-				[N.value ?? ""]: !0,
+				[P.value ?? ""]: !0,
 				[t?.soft ?? ""]: e.state === "base",
 				[t?.hover ?? ""]: e.state === "base",
 				[t?.selected ?? ""]: e.state === "selected",
 				[t?.disabled ?? ""]: e.state === "disabled",
-				[A.value.month ?? ""]: !0
+				[j.value.month ?? ""]: !0
 			}));
 		}
 	};

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

@@ -1,3 +1,3 @@
-export type { CalendarMonthClasses, CalendarMonthColorOverrides, CalendarMonthCustomProps, CalendarMonthEmits, CalendarMonthOwnProps, CalendarMonthProps, CalendarMonthRoundedOverrides, CalendarMonthTokens, } from './calendarMonth.types';
+export type { CalendarMonthClasses, CalendarMonthColorOverrides, CalendarMonthCustomProps, CalendarMonthEmits, CalendarMonthOwnProps, CalendarMonthProps, CalendarMonthRoundedOverrides, } from './calendarMonth.types';
 export { default as CalendarMonth } from './CalendarMonth.vue';
 export { useCalendarMonth, type CalendarMonthCell, } from './composables/useCalendarMonth';