ropav 0.1.3 → 0.1.5

package/dist/collectionNavigation.js

@@ -0,0 +1,120 @@
+import { onBeforeUnmount } from "vue";
+//#region src/composables/useTypeahead.ts
+var DEFAULT_TYPEAHEAD_TIMEOUT = 1e3;
+var COMBINING_MARKS = /\p{M}/gu;
+var WHITESPACE = /\s+/g;
+function normalizeTypeaheadText(value, locales) {
+	return value.toLocaleLowerCase(locales).normalize("NFKD").replace(COMBINING_MARKS, "").replace(WHITESPACE, " ").trim();
+}
+function isRepeatedQuery(query) {
+	const characters = [...query];
+	return characters.length > 1 && characters.every((character) => character === characters[0]);
+}
+function useTypeahead(options) {
+	let buffer = "";
+	let timer;
+	let lastMatch;
+	let currentScope = options.scopeKey?.();
+	const isDisabled = options.isDisabled ?? (() => false);
+	function clearTimer() {
+		if (timer !== void 0) clearTimeout(timer);
+		timer = void 0;
+	}
+	function reset() {
+		clearTimer();
+		buffer = "";
+		lastMatch = void 0;
+		currentScope = options.scopeKey?.();
+	}
+	function scheduleReset() {
+		clearTimer();
+		timer = setTimeout(reset, options.timeout ?? DEFAULT_TYPEAHEAD_TIMEOUT);
+	}
+	function hasBuffer() {
+		return buffer.length > 0;
+	}
+	function getMatchIndex(query, startIndex, keepCurrent) {
+		const items = options.items();
+		if (items.length === 0) return -1;
+		function matches(index) {
+			const item = items[index];
+			return Boolean(item && !isDisabled(item) && normalizeTypeaheadText(options.getTextValue(item)).startsWith(query));
+		}
+		if (keepCurrent && startIndex >= 0 && matches(startIndex)) return startIndex;
+		for (let offset = 1; offset <= items.length; offset += 1) {
+			const index = (startIndex + offset + items.length) % items.length;
+			if (matches(index)) return index;
+		}
+		return -1;
+	}
+	function getLastMatchIndex(items) {
+		const match = lastMatch;
+		if (!match) return -1;
+		if (Object.is(items[match.index], match.item)) return match.index;
+		const identityIndex = items.findIndex((item) => Object.is(item, match.item));
+		if (identityIndex >= 0) return identityIndex;
+		let keyIndex = -1;
+		for (let index = 0; index < items.length; index += 1) {
+			if (!Object.is(options.getKey(items[index]), match.key)) continue;
+			if (keyIndex >= 0) return -1;
+			keyIndex = index;
+		}
+		return keyIndex;
+	}
+	function handleKey(event) {
+		const nextScope = options.scopeKey?.();
+		if (!Object.is(currentScope, nextScope)) reset();
+		currentScope = nextScope;
+		if (event.ctrlKey || event.metaKey || event.altKey || event.isComposing || [...event.key].length !== 1 || event.key === " " && !hasBuffer()) return false;
+		event.preventDefault();
+		buffer += event.key;
+		scheduleReset();
+		const normalizedBuffer = normalizeTypeaheadText(buffer);
+		if (!normalizedBuffer) return true;
+		const repeated = isRepeatedQuery(normalizedBuffer);
+		const query = repeated ? [...normalizedBuffer][0] : normalizedBuffer;
+		const items = options.items();
+		const lastMatchIndex = getLastMatchIndex(items);
+		const matchIndex = getMatchIndex(query, lastMatchIndex >= 0 ? lastMatchIndex : options.activeIndex(), !repeated && [...query].length > 1);
+		if (matchIndex < 0) return true;
+		const item = items[matchIndex];
+		if (!item) return true;
+		lastMatch = {
+			item,
+			index: matchIndex,
+			key: options.getKey(item)
+		};
+		options.onMatch(item, matchIndex);
+		return true;
+	}
+	onBeforeUnmount(clearTimer);
+	return {
+		handleKey,
+		hasBuffer,
+		reset
+	};
+}
+//#endregion
+//#region src/composables/collectionNavigation.ts
+function getEnabledIndexes(items, isDisabled) {
+	return items.map((item, index) => isDisabled(item) ? -1 : index).filter((index) => index >= 0);
+}
+function getNextEnabledIndex(items, currentIndex, direction, isDisabled, loop = true) {
+	const enabledIndexes = getEnabledIndexes(items, isDisabled);
+	if (enabledIndexes.length === 0) return void 0;
+	const currentPosition = enabledIndexes.indexOf(currentIndex);
+	if (currentPosition < 0) {
+		if (direction === 1) return enabledIndexes.find((index) => index > currentIndex) ?? (loop ? enabledIndexes[0] : enabledIndexes[enabledIndexes.length - 1]);
+		for (let index = enabledIndexes.length - 1; index >= 0; index -= 1) {
+			const candidate = enabledIndexes[index];
+			if (candidate < currentIndex) return candidate;
+		}
+		return loop ? enabledIndexes[enabledIndexes.length - 1] : enabledIndexes[0];
+	}
+	const nextPosition = currentPosition + direction;
+	if (nextPosition >= 0 && nextPosition < enabledIndexes.length) return enabledIndexes[nextPosition];
+	if (!loop) return enabledIndexes[currentPosition];
+	return direction === 1 ? enabledIndexes[0] : enabledIndexes[enabledIndexes.length - 1];
+}
+//#endregion
+export { getNextEnabledIndex as n, useTypeahead as r, getEnabledIndexes as t };

package/dist/color-input.js

@@ -2,7 +2,8 @@ import './color-input.css';
 import { t as bem } from "./bem.js";
 import { n as useStylesApi, t as presence } from "./styles-api.js";
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
-import { a as useTextFormControl, n as provideNestedFormControlOwner, o as useControllableValue } from "./useFormControl.js";
+import { t as useControllableValue } from "./useControllableValue.js";
+import { a as useTextFormControl, n as provideNestedFormControlOwner } from "./useFormControl.js";
 import { t as useControlState } from "./useControlState.js";
 import { t as color_swatch_default } from "./color-swatch.js";
 import { n as formatColorPickerValue, r as parseColorPickerValue, t as color_picker_default } from "./color-picker.js";

package/dist/componentColors.js

@@ -59,13 +59,20 @@ function getComponentColorValue(color) {
 	if (parsed.kind === "custom") return parsed.value;
 }
 function getComponentContrastColor(color, options = {}) {
-	if (!options.autoContrast) return "var(--rp-color-white)";
+	return getComponentContrastColorRoles(color, options).color;
+}
+function getComponentContrastColorRoles(color, options = {}) {
+	if (options.contrastColor !== void 0) return createContrastColorRoles(options.contrastColor);
+	if (options.autoContrast === false) return createContrastColorRoles("var(--rp-color-white)");
 	const parsed = parseComponentColor(color);
-	if (parsed.kind === "primary") return "var(--rp-primary-color-contrast)";
-	if (parsed.kind === "preset") return `var(--rp-color-${parsed.color}-contrast)`;
-	if (parsed.kind === "shade") return `var(--rp-color-${parsed.color}-${parsed.shade}-contrast)`;
-	if (parsed.kind === "custom") return getReadableColorVariable(parsed.value);
-	return "var(--rp-color-white)";
+	if (parsed.kind === "custom") return getCustomContrastColorRoles(parsed.value, true);
+	const roles = getComponentColorRoles(color);
+	if (!roles) return createContrastColorRoles("var(--rp-color-white)");
+	return {
+		color: roles.contrast,
+		hover: roles.contrastHover,
+		active: roles.contrastActive
+	};
 }
 function getComponentColorRoles(color) {
 	const parsed = parseComponentColor(color);
@@ -90,32 +97,49 @@ function getComponentColorRoles(color) {
 	});
 	if (parsed.kind === "shade") {
 		const base = `var(--rp-color-${parsed.color}-${parsed.shade})`;
+		const hoverShade = Math.min(Number(parsed.shade) + 1, 9);
 		return createComponentColorRoles(base, {
-			hover: `var(--rp-color-${parsed.color}-${Math.min(Number(parsed.shade) + 1, 9)})`,
+			hover: `var(--rp-color-${parsed.color}-${hoverShade})`,
 			contrast: `var(--rp-color-${parsed.color}-${parsed.shade}-contrast)`,
+			contrastHover: `var(--rp-color-${parsed.color}-${hoverShade}-contrast)`,
+			contrastActive: `var(--rp-color-${parsed.color}-${parsed.shade}-active-contrast)`,
 			foreground: base
 		});
 	}
-	return createComponentColorRoles(parsed.value, { contrast: getReadableColorVariable(parsed.value) });
+	const contrast = getCustomContrastColorRoles(parsed.value);
+	return createComponentColorRoles(parsed.value, {
+		contrast: contrast.color,
+		contrastHover: contrast.hover,
+		contrastActive: contrast.active
+	});
 }
-function getComponentVariantColorRoles({ color, variant, defaultColor = "primary", autoContrast }) {
+function getComponentVariantColorRoles({ color, variant, defaultColor = "primary", autoContrast, contrastColor }) {
 	const roles = getComponentColorRoles(color ?? defaultColor);
 	if (!roles) return void 0;
-	const contrast = getComponentContrastColor(color ?? defaultColor, { autoContrast });
-	if (variant === "solid") return {
-		background: roles.filled,
-		hover: roles.hover,
-		active: roles.active,
-		color: contrast,
-		border: roles.filled,
-		borderHover: roles.hover,
-		borderActive: roles.active
-	};
+	if (variant === "solid") {
+		const contrast = getComponentContrastColorRoles(color ?? defaultColor, {
+			autoContrast,
+			contrastColor
+		});
+		return {
+			background: roles.filled,
+			hover: roles.hover,
+			active: roles.active,
+			color: contrast.color,
+			colorHover: contrast.hover,
+			colorActive: contrast.active,
+			border: roles.filled,
+			borderHover: roles.hover,
+			borderActive: roles.active
+		};
+	}
 	if (variant === "subtle") return {
 		background: roles.light,
 		hover: roles.lightHover,
 		active: roles.lightActive,
 		color: roles.foreground,
+		colorHover: roles.foreground,
+		colorActive: roles.foreground,
 		border: "transparent",
 		borderHover: "transparent",
 		borderActive: "transparent"
@@ -125,6 +149,8 @@ function getComponentVariantColorRoles({ color, variant, defaultColor = "primary
 		hover: roles.lightHover,
 		active: roles.lightActive,
 		color: roles.foreground,
+		colorHover: roles.foreground,
+		colorActive: roles.foreground,
 		border: roles.outline,
 		borderHover: roles.lightHover,
 		borderActive: roles.outlineHover
@@ -134,6 +160,8 @@ function getComponentVariantColorRoles({ color, variant, defaultColor = "primary
 		hover: roles.lightHover,
 		active: roles.lightActive,
 		color: roles.foreground,
+		colorHover: roles.foreground,
+		colorActive: roles.foreground,
 		border: roles.outline,
 		borderHover: roles.outlineHover,
 		borderActive: roles.outlineHover
@@ -143,6 +171,8 @@ function getComponentVariantColorRoles({ color, variant, defaultColor = "primary
 		hover: roles.lightHover,
 		active: roles.lightActive,
 		color: roles.foreground,
+		colorHover: roles.foreground,
+		colorActive: roles.foreground,
 		border: "transparent",
 		borderHover: "transparent",
 		borderActive: "transparent"
@@ -152,6 +182,8 @@ function getComponentVariantColorRoles({ color, variant, defaultColor = "primary
 		hover: "transparent",
 		active: "transparent",
 		color: roles.foreground,
+		colorHover: roles.foreground,
+		colorActive: roles.foreground,
 		border: "transparent",
 		borderHover: "transparent",
 		borderActive: "transparent"
@@ -161,17 +193,21 @@ function getComponentVariantColorRoles({ color, variant, defaultColor = "primary
 		hover: roles.lightHover,
 		active: roles.lightActive,
 		color: roles.foreground,
+		colorHover: roles.foreground,
+		colorActive: roles.foreground,
 		border: roles.outline,
 		borderHover: roles.outlineHover,
 		borderActive: roles.outlineHover
 	};
 }
 function createComponentColorRoles(color, overrides = {}) {
-	return {
+	const roles = {
 		filled: color,
 		hover: `color-mix(in srgb, ${color} 90%, var(--rp-color-black))`,
 		active: `color-mix(in srgb, ${color} 80%, var(--rp-color-black))`,
 		contrast: "var(--rp-color-white)",
+		contrastHover: "var(--rp-color-white)",
+		contrastActive: "var(--rp-color-white)",
 		light: `color-mix(in srgb, ${color} 12%, transparent)`,
 		lightHover: `color-mix(in srgb, ${color} 18%, transparent)`,
 		lightActive: `color-mix(in srgb, ${color} 24%, transparent)`,
@@ -180,10 +216,31 @@ function createComponentColorRoles(color, overrides = {}) {
 		foreground: color,
 		...overrides
 	};
+	return {
+		...roles,
+		contrastHover: overrides.contrastHover ?? roles.contrast,
+		contrastActive: overrides.contrastActive ?? roles.contrast
+	};
 }
-function getReadableColorVariable(color) {
+function getCustomContrastColorRoles(color, warnForTranslucentColor = false) {
 	const parsed = parseCssColor(color);
-	if (!parsed) return "var(--rp-color-white)";
+	if (!parsed) return createContrastColorRoles("var(--rp-color-white)");
+	if (parsed.opacity < 100) {
+		if (warnForTranslucentColor);
+		return createContrastColorRoles("var(--rp-color-white)");
+	}
+	const black = {
+		red: 0,
+		green: 0,
+		blue: 0
+	};
+	return {
+		color: getReadableParsedColorVariable(parsed),
+		hover: getReadableParsedColorVariable(mixOpaqueColors(parsed, .9, black)),
+		active: getReadableParsedColorVariable(mixOpaqueColors(parsed, .8, black))
+	};
+}
+function getReadableParsedColorVariable(parsed) {
 	return contrastRatio({
 		red: 0,
 		green: 0,
@@ -194,6 +251,21 @@ function getReadableColorVariable(color) {
 		blue: 255
 	}, parsed) ? "var(--rp-color-black)" : "var(--rp-color-white)";
 }
+function createContrastColorRoles(color) {
+	return {
+		color,
+		hover: color,
+		active: color
+	};
+}
+function mixOpaqueColors(first, firstWeight, second) {
+	const secondWeight = 1 - firstWeight;
+	return {
+		red: first.red * firstWeight + second.red * secondWeight,
+		green: first.green * firstWeight + second.green * secondWeight,
+		blue: first.blue * firstWeight + second.blue * secondWeight
+	};
+}
 function contrastRatio(foreground, background) {
 	const foregroundLuminance = relativeLuminance(foreground);
 	const backgroundLuminance = relativeLuminance(background);

package/dist/components/alert/types.d.ts

@@ -16,6 +16,7 @@ export interface AlertProps extends StylesApiProps<AlertPart> {
     variant?: AlertVariant;
     color?: AlertColor;
     autoContrast?: boolean;
+    contrastColor?: string;
     radius?: AlertRadius;
     role?: AlertRole;
     closable?: boolean;

package/dist/components/alert/useAlertColor.d.ts

@@ -1,3 +1,3 @@
 import { CSSProperties } from 'vue';
 import { AlertColor, AlertVariant } from './types.js';
-export declare function getAlertColorStyle(color: AlertColor | undefined, variant: AlertVariant | undefined, autoContrast: boolean | undefined): CSSProperties | undefined;
+export declare function getAlertColorStyle(color: AlertColor | undefined, variant: AlertVariant | undefined, autoContrast: boolean | undefined, contrastColor?: string): CSSProperties | undefined;

package/dist/components/avatar/types.d.ts

@@ -18,6 +18,7 @@ export interface AvatarProps extends StylesApiProps<AvatarPart> {
     variant?: AvatarVariant;
     color?: AvatarColor;
     autoContrast?: boolean;
+    contrastColor?: string;
     size?: AvatarSize;
     radius?: AvatarRadius;
 }

package/dist/components/avatar/useAvatarColor.d.ts

@@ -1,3 +1,3 @@
 import { CSSProperties } from 'vue';
 import { AvatarColor, AvatarVariant } from './types.js';
-export declare function getAvatarColorStyle(color: AvatarColor | undefined, variant: AvatarVariant | undefined, autoContrast: boolean | undefined): CSSProperties | undefined;
+export declare function getAvatarColorStyle(color: AvatarColor | undefined, variant: AvatarVariant | undefined, autoContrast: boolean | undefined, contrastColor?: string): CSSProperties | undefined;

package/dist/components/badge/types.d.ts

@@ -14,6 +14,7 @@ export interface BadgeProps extends StylesApiProps<BadgePart> {
     variant?: BadgeVariant;
     color?: BadgeColor;
     autoContrast?: boolean;
+    contrastColor?: string;
     size?: BadgeSize;
     radius?: BadgeRadius;
     ariaLabel?: string;

package/dist/components/badge/useBadgeColor.d.ts

@@ -1,3 +1,3 @@
 import { CSSProperties } from 'vue';
 import { BadgeColor, BadgeVariant } from './types.js';
-export declare function getBadgeColorStyle(color: BadgeColor | undefined, variant: BadgeVariant | undefined, autoContrast: boolean | undefined): CSSProperties | undefined;
+export declare function getBadgeColorStyle(color: BadgeColor | undefined, variant: BadgeVariant | undefined, autoContrast: boolean | undefined, contrastColor?: string): CSSProperties | undefined;

package/dist/components/button/types.d.ts

@@ -10,6 +10,7 @@ export interface ButtonProps extends StylesApiProps<ButtonPart> {
     variant?: ButtonVariant;
     color?: ButtonColor;
     autoContrast?: boolean;
+    contrastColor?: string;
     size?: ButtonSize;
     radius?: ButtonRadius;
     type?: 'button' | 'submit' | 'reset';

package/dist/components/button/useButtonColor.d.ts

@@ -1,3 +1,3 @@
 import { CSSProperties } from 'vue';
 import { ButtonColor, ButtonVariant } from './types.js';
-export declare function getButtonColorStyle(color: ButtonColor | undefined, variant: ButtonVariant | undefined, autoContrast: boolean | undefined): CSSProperties | undefined;
+export declare function getButtonColorStyle(color: ButtonColor | undefined, variant: ButtonVariant | undefined, autoContrast: boolean | undefined, contrastColor?: string): CSSProperties | undefined;

package/dist/components/button-link/types.d.ts

@@ -16,6 +16,7 @@ export interface ButtonLinkProps extends StylesApiProps<ButtonLinkPart> {
     variant?: ButtonLinkVariant;
     color?: ButtonLinkColor;
     autoContrast?: boolean;
+    contrastColor?: string;
     size?: ButtonLinkSize;
     radius?: ButtonLinkRadius;
     disabled?: boolean;

package/dist/components/checkbox/types.d.ts

@@ -17,6 +17,7 @@ export interface CheckboxProps extends StylesApiProps<CheckboxPart> {
     variant?: CheckboxVariant;
     color?: CheckboxColor;
     autoContrast?: boolean;
+    contrastColor?: string;
     size?: CheckboxSize;
     radius?: CheckboxRadius;
     disabled?: boolean;

package/dist/components/dropdown-menu/dropdown-menu-primitive-core.d.ts

@@ -8,6 +8,7 @@ export type ComponentRefValue = Element | ComponentPublicInstance | VaporCompone
 export interface MenuItemRegistration {
     id: string;
     element: () => HTMLElement | null;
+    textValue: () => string;
     disabled: () => boolean;
     activate: (event: Event) => void;
     submenu?: DropdownMenuSubContext;

package/dist/components/dropdown-menu/dropdown-menu-utils.d.ts

@@ -19,5 +19,3 @@ export declare function normalizePath(indexOrPath: number | ItemPath): ItemPath;
 export declare function getEventPoint(event: MouseEvent): PointerPoint;
 export declare function hasMeasuredRect(rect: DOMRect): boolean;
 export declare function isPointInRect(point: PointerPoint, rect: DOMRect, padding?: number): boolean;
-export declare function getEnabledIndexes(items: DropdownMenuItem[]): number[];
-export declare function getNextEnabledIndex(items: DropdownMenuItem[], index: number, direction: 1 | -1): number | undefined;

package/dist/components/dropdown-menu/index.d.ts

@@ -13,6 +13,7 @@ export declare const DropdownMenuItem: (__VLS_props: NonNullable<Awaited<typeof
         id?: string | undefined;
         as?: import('./types.js').DropdownMenuAs | undefined;
         value?: import('./types.js').DropdownMenuItemValue | undefined;
+        textValue?: string | undefined;
         disabled?: boolean | undefined;
         destructive?: boolean | undefined;
         closeOnSelect?: boolean | undefined;

package/dist/components/dropdown-menu/types.d.ts

@@ -190,6 +190,8 @@ export interface DropdownMenuItemPrimitiveProps {
     id?: string;
     as?: DropdownMenuAs;
     value?: DropdownMenuItemValue;
+    /** Text used for keyboard typeahead. Falls back to the rendered text content. */
+    textValue?: string;
     disabled?: boolean;
     destructive?: boolean;
     closeOnSelect?: boolean;
@@ -234,6 +236,8 @@ export interface DropdownMenuSubPrimitiveProps {
 export interface DropdownMenuSubTriggerPrimitiveProps {
     id?: string;
     as?: DropdownMenuAs;
+    /** Text used for keyboard typeahead. Falls back to the rendered text content. */
+    textValue?: string;
     disabled?: boolean;
 }
 export interface DropdownMenuSubContentPrimitiveProps extends Omit<DropdownMenuContentPrimitiveProps, 'arrow' | 'ignore' | 'placement'> {

package/dist/components/dropdown-menu/useDropdownMenuInteractions.d.ts

@@ -31,12 +31,13 @@ type UseDropdownMenuInteractionsOptions = {
     getItemAtPath: (path: ItemPath) => DropdownMenuItem | undefined;
     focusItem: (target: DropdownMenuFocusTarget, menuPath?: ItemPath) => boolean;
     moveFocus: (direction: 1 | -1) => ItemPath | undefined;
+    handleTypeahead: (event: KeyboardEvent) => boolean;
     submenus: SubmenuControls;
     hoverIntent: HoverIntentControls;
     disclosure: DisclosureControls;
     isSubmenuOpeningLeft: (path: ItemPath) => boolean;
 };
-export declare function useDropdownMenuInteractions({ props, emit, isDisabled, focusedPath, openSubmenuPath, getItemAtPath, focusItem, moveFocus, submenus, hoverIntent, disclosure, isSubmenuOpeningLeft, }: UseDropdownMenuInteractionsOptions): {
+export declare function useDropdownMenuInteractions({ props, emit, isDisabled, focusedPath, openSubmenuPath, getItemAtPath, focusItem, moveFocus, handleTypeahead, submenus, hoverIntent, disclosure, isSubmenuOpeningLeft, }: UseDropdownMenuInteractionsOptions): {
     activateItem: (item: DropdownMenuItem, path: ItemPath, event?: MouseEvent | KeyboardEvent) => void;
     selectItem: (item: DropdownMenuItem, originalEvent?: Event) => void;
     openSubmenu: (path: ItemPath, focus?: SubmenuFocusTarget, point?: PointerPoint) => boolean;

package/dist/components/dropdown-menu/useDropdownMenuNavigation.d.ts

@@ -10,6 +10,7 @@ export declare function useDropdownMenuNavigation(items: DropdownMenuItemsSource
     getItemAtPath: (path: ItemPath) => DropdownMenuItem | undefined;
     focusItem: (target: DropdownMenuFocusTarget, menuPath?: ItemPath) => boolean;
     resetFocus: () => void;
+    setFocusedIndex: (index: number, menuPath?: ItemPath) => boolean;
     isItemFocused: (indexOrPath: number | ItemPath) => boolean;
     moveFocus: (direction: 1 | -1) => number[] | undefined;
 };

package/dist/components/icon-button/types.d.ts

@@ -11,6 +11,7 @@ export interface IconButtonProps extends StylesApiProps<IconButtonPart> {
     variant?: IconButtonVariant;
     color?: IconButtonColor;
     autoContrast?: boolean;
+    contrastColor?: string;
     size?: IconButtonSize;
     radius?: IconButtonRadius;
     type?: 'button' | 'submit' | 'reset';

package/dist/components/pagination/index.d.ts

@@ -0,0 +1,4 @@
+export { default as Pagination } from './pagination.js';
+export { paginationColors, paginationParts, paginationRadiuses, paginationSizes } from './types.js';
+export type { PaginationColor, PaginationControl, PaginationControlSlotProps, PaginationEllipsisItem, PaginationGetPageAriaLabel, PaginationItem, PaginationPageItem, PaginationPageSlotProps, PaginationPart, PaginationProps, PaginationRadius, PaginationSize, } from './types.js';
+export { getPaginationItems, normalizePaginationPage, normalizePaginationTotal, usePagination, } from './usePagination.js';

package/dist/components/pagination/index.js

@@ -0,0 +1,2 @@
+import { a as pagination_default, c as normalizePaginationTotal, i as paginationSizes, l as usePagination, n as paginationParts, o as getPaginationItems, r as paginationRadiuses, s as normalizePaginationPage, t as paginationColors } from "../../pagination.js";
+export { pagination_default as Pagination, getPaginationItems, normalizePaginationPage, normalizePaginationTotal, paginationColors, paginationParts, paginationRadiuses, paginationSizes, usePagination };

package/dist/components/pagination/pagination.d.ts

@@ -0,0 +1,49 @@
+import { PaginationProps } from './types.js';
+declare const __VLS_export: (__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import('vue').PublicProps & __VLS_PrettifyLocal<PaginationProps & {
+        "onUpdate:modelValue"?: ((page: number) => any) | undefined;
+        onChange?: ((page: number) => any) | undefined;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: {
+        first?: (props: {
+            page: number;
+            disabled: boolean;
+        }) => any;
+    } & {
+        previous?: (props: {
+            page: number;
+            disabled: boolean;
+        }) => any;
+    } & {
+        page?: (props: {
+            page: number;
+            active: boolean;
+        }) => any;
+    } & {
+        ellipsis?: (props: {}) => any;
+    } & {
+        next?: (props: {
+            page: number;
+            disabled: boolean;
+        }) => any;
+    } & {
+        last?: (props: {
+            page: number;
+            disabled: boolean;
+        }) => any;
+    };
+    emit: ((evt: "update:modelValue", page: number) => void) & ((evt: "change", page: number) => void);
+}>) => import('vue').VNode & {
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/components/pagination/types.d.ts

@@ -0,0 +1,54 @@
+import { ComponentColorValue } from '../../utils/componentColors.js';
+import { StylesApiProps } from '../../styles-api.js';
+export declare const paginationParts: readonly ["root", "items", "control", "page", "ellipsis"];
+export type PaginationPart = (typeof paginationParts)[number];
+export declare const paginationColors: readonly ["dark", "gray", "red", "pink", "grape", "violet", "indigo", "blue", "cyan", "teal", "green", "lime", "yellow", "orange"];
+export declare const paginationSizes: readonly ["xs", "sm", "md", "lg", "xl"];
+export declare const paginationRadiuses: readonly ["none", "xs", "sm", "md", "lg", "xl", "full"];
+export type PaginationColor = ComponentColorValue;
+export type PaginationSize = (typeof paginationSizes)[number];
+export type PaginationRadius = (typeof paginationRadiuses)[number];
+export type PaginationControl = 'first' | 'previous' | 'next' | 'last';
+export type PaginationGetPageAriaLabel = (page: number, active: boolean) => string;
+export interface PaginationPageItem {
+    type: 'page';
+    key: string;
+    page: number;
+}
+export interface PaginationEllipsisItem {
+    type: 'ellipsis';
+    key: string;
+}
+export type PaginationItem = PaginationPageItem | PaginationEllipsisItem;
+export interface PaginationPageSlotProps {
+    page: number;
+    active: boolean;
+}
+export interface PaginationControlSlotProps {
+    page: number;
+    disabled: boolean;
+}
+export interface PaginationProps extends StylesApiProps<PaginationPart> {
+    id?: string;
+    modelValue?: number;
+    defaultValue?: number;
+    total: number;
+    siblings?: number;
+    boundaries?: number;
+    withControls?: boolean;
+    withEdges?: boolean;
+    disabled?: boolean;
+    color?: PaginationColor;
+    autoContrast?: boolean;
+    contrastColor?: string;
+    size?: PaginationSize;
+    radius?: PaginationRadius;
+    ariaLabel?: string;
+    labelledby?: string;
+    describedby?: string;
+    firstLabel?: string;
+    previousLabel?: string;
+    nextLabel?: string;
+    lastLabel?: string;
+    getPageAriaLabel?: PaginationGetPageAriaLabel;
+}

package/dist/components/pagination/usePagination.d.ts

@@ -0,0 +1,19 @@
+import { CSSProperties } from 'vue';
+import { PaginationItem, PaginationProps } from './types.js';
+export declare function normalizePaginationTotal(total: number): number;
+export declare function normalizePaginationPage(page: number, total: number): number;
+export declare function getPaginationItems(total: number, page: number, siblings?: number, boundaries?: number): PaginationItem[];
+export declare function usePagination(props: Readonly<PaginationProps>, getCurrentValue: () => number, onChange: (page: number) => void): {
+    totalPages: import('vue').ComputedRef<number>;
+    currentPage: import('vue').ComputedRef<number>;
+    items: import('vue').ComputedRef<PaginationItem[]>;
+    rootClass: import('vue').ComputedRef<string[]>;
+    rootStyle: import('vue').ComputedRef<CSSProperties | undefined>;
+    firstPage: import('vue').ComputedRef<number>;
+    previousPage: import('vue').ComputedRef<number>;
+    nextPage: import('vue').ComputedRef<number>;
+    lastPage: import('vue').ComputedRef<number>;
+    isFirstDisabled: import('vue').ComputedRef<boolean>;
+    isLastDisabled: import('vue').ComputedRef<boolean>;
+    selectPage: (page: number) => boolean;
+};

package/dist/components/radio/types.d.ts

@@ -18,6 +18,7 @@ export interface RadioProps extends StylesApiProps<RadioPart> {
     variant?: RadioVariant;
     color?: RadioColor;
     autoContrast?: boolean;
+    contrastColor?: string;
     size?: RadioSize;
     disabled?: boolean;
     required?: boolean;
@@ -37,6 +38,7 @@ export interface RadioGroupProps extends StylesApiProps<RadioGroupPart> {
     variant?: RadioVariant;
     color?: RadioColor;
     autoContrast?: boolean;
+    contrastColor?: string;
     size?: RadioSize;
     orientation?: RadioGroupOrientation;
     disabled?: boolean;
@@ -65,6 +67,7 @@ export interface RadioGroupContext {
     variant?: RadioVariant;
     color?: RadioColor;
     autoContrast?: boolean;
+    contrastColor?: string;
     size?: RadioSize;
     inputAttrs: InputHTMLAttributes | undefined;
     select: (value: string | number) => void;