ropav 0.1.4 → 0.1.5

package/dist/pagination.css

@@ -0,0 +1,140 @@
+@layer ropav.components {
+.rp-pagination[data-v-6ae45781] {
+    --_rp-pagination-item-size: var(--rp-size-control-md);
+    --_rp-pagination-font-size: var(--rp-font-size-md);
+    --_rp-pagination-radius: var(--rp-radius-sm);
+    --_rp-pagination-gap: var(--rp-spacing-1);
+    --_rp-pagination-active-bg: var(--rp-color-control-selected-bg);
+    --_rp-pagination-active-bg-hover: var(--rp-primary-color-filled-hover);
+    --_rp-pagination-active-fg: var(--rp-color-control-selected-fg);
+    --_rp-pagination-active-fg-hover: var(--_rp-pagination-active-fg);
+    display: inline-flex;
+    max-width: 100%;
+    color: var(--rp-color-control-fg);
+    font-family: var(--rp-font-family);
+    font-size: var(--_rp-pagination-font-size);
+    line-height: 1;
+    vertical-align: middle;
+}
+.rp-pagination__items[data-v-6ae45781] {
+    display: flex;
+    align-items: center;
+    max-width: 100%;
+    padding: 0;
+    margin: 0;
+    gap: var(--_rp-pagination-gap);
+    list-style: none;
+}
+.rp-pagination__item[data-v-6ae45781] {
+    display: flex;
+    flex: 0 0 auto;
+}
+.rp-pagination__page[data-v-6ae45781], .rp-pagination__control[data-v-6ae45781], .rp-pagination__ellipsis[data-v-6ae45781] {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    box-sizing: border-box;
+    width: var(--_rp-pagination-item-size);
+    min-width: var(--_rp-pagination-item-size);
+    height: var(--_rp-pagination-item-size);
+    padding: 0;
+    color: inherit;
+    font: inherit;
+    line-height: 1;
+    background: transparent;
+    border: var(--rp-border-width-thin) solid transparent;
+    border-radius: var(--_rp-pagination-radius);
+}
+.rp-pagination__page[data-v-6ae45781], .rp-pagination__control[data-v-6ae45781] {
+    appearance: none;
+    cursor: pointer;
+}
+.rp-pagination__page[data-v-6ae45781]:hover:not(:disabled), .rp-pagination__control[data-v-6ae45781]:hover:not(:disabled) {
+    background-color: var(--rp-color-default-hover);
+}
+.rp-pagination__page[data-v-6ae45781]:focus-visible, .rp-pagination__control[data-v-6ae45781]:focus-visible {
+    outline: none;
+    border-color: var(--rp-color-control-border-focus);
+    box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
+}
+.rp-pagination__page[data-v-6ae45781]:disabled, .rp-pagination__control[data-v-6ae45781]:disabled {
+    opacity: var(--rp-opacity-disabled);
+    cursor: not-allowed;
+}
+.rp-pagination__page[data-v-6ae45781] {
+    width: auto;
+    padding-inline: var(--rp-spacing-2);
+    font-variant-numeric: tabular-nums;
+    transition: box-shadow var(--rp-transition-fast);
+}
+.rp-pagination__page--active[data-v-6ae45781] {
+    color: var(--_rp-pagination-active-fg);
+    font-weight: var(--rp-font-weight-medium);
+    background-color: var(--_rp-pagination-active-bg);
+    border-color: var(--_rp-pagination-active-bg);
+}
+.rp-pagination__page--active[data-v-6ae45781]:hover:not(:disabled) {
+    background-color: var(--_rp-pagination-active-bg-hover);
+    border-color: var(--_rp-pagination-active-bg-hover);
+    color: var(--_rp-pagination-active-fg-hover);
+}
+.rp-pagination__control[data-v-6ae45781] {
+    transition: color var(--rp-transition-fast), background-color var(--rp-transition-fast), border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
+}
+.rp-pagination__control-icon[data-v-6ae45781], .rp-pagination__ellipsis[data-v-6ae45781] >  svg {
+    display: block;
+    width: 1em;
+    height: 1em;
+}
+.rp-pagination__ellipsis[data-v-6ae45781] {
+    color: var(--rp-color-dimmed);
+}
+.rp-pagination:dir(rtl) .rp-pagination__control-icon[data-v-6ae45781] {
+    transform: rotate(180deg);
+}
+.rp-pagination--disabled .rp-pagination__page[data-v-6ae45781]:not(:disabled), .rp-pagination--disabled .rp-pagination__control[data-v-6ae45781]:not(:disabled) {
+    opacity: var(--rp-opacity-disabled);
+    cursor: not-allowed;
+}
+.rp-pagination--size-xs[data-v-6ae45781] {
+    --_rp-pagination-item-size: var(--rp-size-control-xs);
+    --_rp-pagination-font-size: var(--rp-font-size-xs);
+}
+.rp-pagination--size-sm[data-v-6ae45781] {
+    --_rp-pagination-item-size: var(--rp-size-control-sm);
+    --_rp-pagination-font-size: var(--rp-font-size-sm);
+}
+.rp-pagination--size-md[data-v-6ae45781] {
+    --_rp-pagination-item-size: var(--rp-size-control-md);
+    --_rp-pagination-font-size: var(--rp-font-size-md);
+}
+.rp-pagination--size-lg[data-v-6ae45781] {
+    --_rp-pagination-item-size: var(--rp-size-control-lg);
+    --_rp-pagination-font-size: var(--rp-font-size-lg);
+}
+.rp-pagination--size-xl[data-v-6ae45781] {
+    --_rp-pagination-item-size: var(--rp-size-control-xl);
+    --_rp-pagination-font-size: var(--rp-font-size-xl);
+}
+.rp-pagination--radius-none[data-v-6ae45781] {
+    --_rp-pagination-radius: var(--rp-radius-none);
+}
+.rp-pagination--radius-xs[data-v-6ae45781] {
+    --_rp-pagination-radius: var(--rp-radius-xs);
+}
+.rp-pagination--radius-sm[data-v-6ae45781] {
+    --_rp-pagination-radius: var(--rp-radius-sm);
+}
+.rp-pagination--radius-md[data-v-6ae45781] {
+    --_rp-pagination-radius: var(--rp-radius-md);
+}
+.rp-pagination--radius-lg[data-v-6ae45781] {
+    --_rp-pagination-radius: var(--rp-radius-lg);
+}
+.rp-pagination--radius-xl[data-v-6ae45781] {
+    --_rp-pagination-radius: var(--rp-radius-xl);
+}
+.rp-pagination--radius-full[data-v-6ae45781] {
+    --_rp-pagination-radius: var(--rp-radius-full);
+}
+}

package/dist/pagination.js

@@ -0,0 +1,442 @@
+import './pagination.css';
+import { t as bem } from "./bem.js";
+import { n as useStylesApi, t as presence } from "./styles-api.js";
+import { i as getComponentVariantColorRoles, t as componentColors } from "./componentColors.js";
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { t as useControllableValue } from "./useControllableValue.js";
+import { t as chevron_right_default } from "./chevron-right.js";
+import { child, computed, createComponent, createFor, createIf, createInvoker, createSlot, defineVaporComponent, delegateEvents, markRaw, renderEffect, setDynamicProps, setInsertionState, setText, template, toDisplayString, unref } from "vue";
+//#region ~icons/lucide/chevron-left
+var t0$4 = template("<svg viewBox=\"0 0 24 24\"width=1.2em height=1.2em><path fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 d=\"m15 18l-6-6l6-6\">", 3, 1);
+function render$3(_ctx) {
+	return t0$4();
+}
+var chevron_left_default = markRaw(defineVaporComponent({
+	name: "lucide-chevron-left",
+	render: render$3
+}));
+//#endregion
+//#region ~icons/lucide/chevrons-left
+var t0$3 = template("<svg viewBox=\"0 0 24 24\"width=1.2em height=1.2em><path fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 d=\"m11 17l-5-5l5-5m7 10l-5-5l5-5\">", 3, 1);
+function render$2(_ctx) {
+	return t0$3();
+}
+var chevrons_left_default = markRaw(defineVaporComponent({
+	name: "lucide-chevrons-left",
+	render: render$2
+}));
+//#endregion
+//#region ~icons/lucide/chevrons-right
+var t0$2 = template("<svg viewBox=\"0 0 24 24\"width=1.2em height=1.2em><path fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 d=\"m6 17l5-5l-5-5m7 10l5-5l-5-5\">", 3, 1);
+function render$1(_ctx) {
+	return t0$2();
+}
+var chevrons_right_default = markRaw(defineVaporComponent({
+	name: "lucide-chevrons-right",
+	render: render$1
+}));
+//#endregion
+//#region ~icons/lucide/ellipsis
+var t0$1 = template("<svg viewBox=\"0 0 24 24\"width=1.2em height=1.2em><g fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2><circle cx=12 cy=12 r=1></circle><circle cx=19 cy=12 r=1></circle><circle cx=5 cy=12 r=1>", 3, 1);
+function render(_ctx) {
+	return t0$1();
+}
+var ellipsis_default = markRaw(defineVaporComponent({
+	name: "lucide-ellipsis",
+	render
+}));
+//#endregion
+//#region src/components/pagination/usePagination.ts
+function normalizeCount(value, fallback) {
+	return Number.isFinite(value) ? Math.max(0, Math.floor(value)) : fallback;
+}
+function normalizePaginationTotal(total) {
+	return normalizeCount(total, 0);
+}
+function normalizePaginationPage(page, total) {
+	const safeTotal = normalizePaginationTotal(total);
+	return Math.min(Math.max(Number.isFinite(page) ? Math.floor(page) : 1, 1), Math.max(safeTotal, 1));
+}
+function getRange(start, end) {
+	return Array.from({ length: Math.max(end - start + 1, 0) }, (_, index) => start + index);
+}
+function getPaginationItems(total, page, siblings = 1, boundaries = 1) {
+	const safeTotal = normalizePaginationTotal(total);
+	if (safeTotal === 0) return [];
+	const currentPage = normalizePaginationPage(page, safeTotal);
+	const siblingCount = normalizeCount(siblings, 1);
+	const boundaryCount = normalizeCount(boundaries, 1);
+	if (safeTotal <= siblingCount * 2 + boundaryCount * 2 + 3) return getRange(1, safeTotal).map((pageValue) => ({
+		type: "page",
+		key: `page-${pageValue}`,
+		page: pageValue
+	}));
+	const leftSibling = Math.max(currentPage - siblingCount, boundaryCount);
+	const rightSibling = Math.min(currentPage + siblingCount, safeTotal - boundaryCount);
+	const showLeftEllipsis = leftSibling > boundaryCount + 2;
+	const showRightEllipsis = rightSibling < safeTotal - boundaryCount - 1;
+	let pages;
+	if (!showLeftEllipsis && showRightEllipsis) pages = [...getRange(1, siblingCount * 2 + boundaryCount + 2), ...getRange(safeTotal - boundaryCount + 1, safeTotal)];
+	else if (showLeftEllipsis && !showRightEllipsis) {
+		const rightItemCount = siblingCount * 2 + boundaryCount + 2;
+		pages = [...getRange(1, boundaryCount), ...getRange(safeTotal - rightItemCount + 1, safeTotal)];
+	} else pages = [
+		...getRange(1, boundaryCount),
+		...getRange(leftSibling, rightSibling),
+		...getRange(safeTotal - boundaryCount + 1, safeTotal)
+	];
+	const items = [];
+	let previous = 0;
+	function addGap(next) {
+		const missingPages = next - previous - 1;
+		if (missingPages === 1) {
+			const pageValue = previous + 1;
+			items.push({
+				type: "page",
+				key: `page-${pageValue}`,
+				page: pageValue
+			});
+		} else if (missingPages > 1) items.push({
+			type: "ellipsis",
+			key: `ellipsis-${previous}-${next}`
+		});
+	}
+	for (const pageValue of pages) {
+		addGap(pageValue);
+		items.push({
+			type: "page",
+			key: `page-${pageValue}`,
+			page: pageValue
+		});
+		previous = pageValue;
+	}
+	addGap(safeTotal + 1);
+	return items;
+}
+function getPaginationColorStyle(color, autoContrast, contrastColor) {
+	const roles = getComponentVariantColorRoles({
+		color: color ?? "primary",
+		variant: "solid",
+		autoContrast,
+		contrastColor
+	});
+	if (!roles) return void 0;
+	return {
+		"--_rp-pagination-active-bg": roles.background,
+		"--_rp-pagination-active-bg-hover": roles.hover,
+		"--_rp-pagination-active-fg": roles.color,
+		"--_rp-pagination-active-fg-hover": roles.colorHover
+	};
+}
+function usePagination(props, getCurrentValue, onChange) {
+	const totalPages = computed(() => normalizePaginationTotal(props.total));
+	const currentPage = computed(() => normalizePaginationPage(getCurrentValue(), totalPages.value));
+	const items = computed(() => getPaginationItems(totalPages.value, currentPage.value, props.siblings ?? 1, props.boundaries ?? 1));
+	const rootClass = computed(() => bem("rp-pagination", {
+		[`size-${props.size}`]: Boolean(props.size),
+		[`radius-${props.radius}`]: Boolean(props.radius),
+		disabled: props.disabled
+	}));
+	const rootStyle = computed(() => getPaginationColorStyle(props.color, props.autoContrast ?? true, props.contrastColor));
+	const firstPage = computed(() => 1);
+	const previousPage = computed(() => Math.max(1, currentPage.value - 1));
+	const nextPage = computed(() => Math.min(Math.max(totalPages.value, 1), currentPage.value + 1));
+	const lastPage = computed(() => Math.max(totalPages.value, 1));
+	const isFirstDisabled = computed(() => props.disabled || totalPages.value === 0 || currentPage.value <= 1);
+	const isLastDisabled = computed(() => props.disabled || totalPages.value === 0 || currentPage.value >= totalPages.value);
+	function selectPage(page) {
+		if (props.disabled || totalPages.value === 0) return false;
+		const next = normalizePaginationPage(page, totalPages.value);
+		if (next === currentPage.value) return false;
+		onChange(next);
+		return true;
+	}
+	return {
+		totalPages,
+		currentPage,
+		items,
+		rootClass,
+		rootStyle,
+		firstPage,
+		previousPage,
+		nextPage,
+		lastPage,
+		isFirstDisabled,
+		isLastDisabled,
+		selectPage
+	};
+}
+//#endregion
+//#region src/components/pagination/pagination.vue?vue&type=script&setup=true&vapor=true&lang.ts
+var t0 = template("<li data-v-6ae45781 class=rp-pagination__item><button data-v-6ae45781></button>");
+var t1 = template(" ");
+var t2 = template("<button data-v-6ae45781></button>");
+var t3 = template("<span data-v-6ae45781>");
+var t4 = template("<li data-v-6ae45781 class=rp-pagination__item>");
+var t5 = template("<li data-v-6ae45781 class=rp-pagination__item><button data-v-6ae45781>");
+var t6 = template("<nav data-v-6ae45781><ul data-v-6ae45781>", 1);
+delegateEvents("click");
+//#endregion
+//#region src/components/pagination/pagination.vue
+var pagination_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
+	name: "RpPagination",
+	inheritAttrs: false,
+	__name: "pagination",
+	props: {
+		id: {},
+		modelValue: { default: void 0 },
+		defaultValue: { default: 1 },
+		total: {},
+		siblings: { default: 1 },
+		boundaries: { default: 1 },
+		withControls: {
+			type: Boolean,
+			default: true
+		},
+		withEdges: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		color: {},
+		autoContrast: {
+			type: Boolean,
+			default: true
+		},
+		contrastColor: {},
+		size: { default: "md" },
+		radius: { default: "sm" },
+		ariaLabel: { default: "Pagination" },
+		labelledby: {},
+		describedby: {},
+		firstLabel: { default: "Go to first page" },
+		previousLabel: { default: "Go to previous page" },
+		nextLabel: { default: "Go to next page" },
+		lastLabel: { default: "Go to last page" },
+		getPageAriaLabel: {},
+		classNames: {},
+		styles: {}
+	},
+	emits: ["update:modelValue", "change"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const controllable = useControllableValue({
+			modelValue: () => props.modelValue,
+			defaultValue: () => props.defaultValue,
+			onChange(page) {
+				emit("update:modelValue", page);
+				emit("change", page);
+			}
+		});
+		const { totalPages, currentPage, items, rootClass, rootStyle, firstPage, previousPage, nextPage, lastPage, isFirstDisabled, isLastDisabled, selectPage } = usePagination(props, () => controllable.value.value, (page) => controllable.setValue(page));
+		const { getPartAttrs, getRootAttrs } = useStylesApi(props, "root");
+		const rootAttrs = computed(() => getRootAttrs({
+			id: props.id,
+			class: rootClass.value,
+			style: rootStyle.value,
+			"data-page": currentPage.value,
+			"data-total": totalPages.value,
+			"data-disabled": presence(props.disabled),
+			"aria-label": props.ariaLabel || void 0,
+			"aria-labelledby": props.labelledby,
+			"aria-describedby": props.describedby
+		}));
+		function getControlAttrs(control, isDisabled) {
+			return {
+				...getPartAttrs("control", { class: ["rp-pagination__control", `rp-pagination__control--${control}`] }),
+				"data-control": control,
+				"data-disabled": presence(isDisabled)
+			};
+		}
+		function getPageAttrs(page) {
+			const active = page === currentPage.value;
+			return {
+				...getPartAttrs("page", { class: ["rp-pagination__page", { "rp-pagination__page--active": active }] }),
+				"data-page": page,
+				"data-active": presence(active),
+				"data-disabled": presence(props.disabled)
+			};
+		}
+		function getPageLabel(page) {
+			const active = page === currentPage.value;
+			if (props.getPageAriaLabel) return props.getPageAriaLabel(page, active);
+			return active ? `Page ${page}, current page` : `Go to page ${page}`;
+		}
+		const n43 = t6();
+		const n42 = child(n43);
+		renderEffect(() => {
+			setDynamicProps(n43, [rootAttrs.value]);
+			setDynamicProps(n42, [unref(getPartAttrs)("items", { class: "rp-pagination__items" })]);
+		});
+		setInsertionState(n42, null, 0);
+		createIf(() => __props.withEdges, () => {
+			const n6 = t0();
+			const n5 = child(n6);
+			renderEffect(() => {
+				const _isFirstDisabled = unref(isFirstDisabled);
+				setDynamicProps(n5, [getControlAttrs("first", _isFirstDisabled), {
+					type: "button",
+					"aria-label": __props.firstLabel,
+					disabled: _isFirstDisabled
+				}]);
+			});
+			setInsertionState(n5, null, 0);
+			createSlot("first", {
+				page: () => unref(firstPage),
+				disabled: () => unref(isFirstDisabled)
+			}, () => {
+				return createComponent(unref(chevrons_left_default), {
+					class: "rp-pagination__control-icon",
+					"aria-hidden": "true"
+				});
+			}, 1);
+			n5.$evtclick = createInvoker(() => unref(selectPage)(unref(firstPage)));
+			return n6;
+		});
+		setInsertionState(n42, null, 1);
+		createIf(() => __props.withControls, () => {
+			const n13 = t0();
+			const n12 = child(n13);
+			renderEffect(() => {
+				const _isFirstDisabled = unref(isFirstDisabled);
+				setDynamicProps(n12, [getControlAttrs("previous", _isFirstDisabled), {
+					type: "button",
+					"aria-label": __props.previousLabel,
+					disabled: _isFirstDisabled
+				}]);
+			});
+			setInsertionState(n12, null, 0);
+			createSlot("previous", {
+				page: () => unref(previousPage),
+				disabled: () => unref(isFirstDisabled)
+			}, () => {
+				return createComponent(unref(chevron_left_default), {
+					class: "rp-pagination__control-icon",
+					"aria-hidden": "true"
+				});
+			}, 1);
+			n12.$evtclick = createInvoker(() => unref(selectPage)(unref(previousPage)));
+			return n13;
+		});
+		setInsertionState(n42, null, 2);
+		createFor(() => unref(items), (_for_item0) => {
+			const n27 = t4();
+			setInsertionState(n27, null, 0);
+			createIf(() => _for_item0.value.type === "page", () => {
+				const n21 = t2();
+				renderEffect(() => {
+					const _item = _for_item0.value;
+					setDynamicProps(n21, [getPageAttrs(_item.page), {
+						type: "button",
+						"aria-label": getPageLabel(_item.page),
+						"aria-current": _item.page === unref(currentPage) ? "page" : void 0,
+						disabled: __props.disabled
+					}]);
+				});
+				setInsertionState(n21, null, 0);
+				createSlot("page", {
+					page: () => _for_item0.value.page,
+					active: () => _for_item0.value.page === unref(currentPage)
+				}, () => {
+					const n20 = t1();
+					renderEffect(() => setText(n20, toDisplayString(_for_item0.value.page)));
+					return n20;
+				}, 1);
+				n21.$evtclick = createInvoker(() => unref(selectPage)(_for_item0.value.page));
+				return n21;
+			}, () => {
+				const n26 = t3();
+				renderEffect(() => setDynamicProps(n26, [unref(getPartAttrs)("ellipsis", { class: "rp-pagination__ellipsis" }), { "aria-hidden": "true" }]));
+				setInsertionState(n26, null, 0);
+				createSlot("ellipsis", null, () => {
+					return createComponent(unref(ellipsis_default));
+				}, 1);
+				return n26;
+			}, 773);
+			return n27;
+		}, (item) => item.key, 8);
+		setInsertionState(n42, null, 3);
+		createIf(() => __props.withControls, () => {
+			const n34 = t0();
+			const n33 = child(n34);
+			renderEffect(() => {
+				const _isLastDisabled = unref(isLastDisabled);
+				setDynamicProps(n33, [getControlAttrs("next", _isLastDisabled), {
+					type: "button",
+					"aria-label": __props.nextLabel,
+					disabled: _isLastDisabled
+				}]);
+			});
+			setInsertionState(n33, null, 0);
+			createSlot("next", {
+				page: () => unref(nextPage),
+				disabled: () => unref(isLastDisabled)
+			}, () => {
+				return createComponent(unref(chevron_right_default), {
+					class: "rp-pagination__control-icon",
+					"aria-hidden": "true"
+				});
+			}, 1);
+			n33.$evtclick = createInvoker(() => unref(selectPage)(unref(nextPage)));
+			return n34;
+		});
+		setInsertionState(n42, null, 4);
+		createIf(() => __props.withEdges, () => {
+			const n41 = t5();
+			const n40 = child(n41);
+			renderEffect(() => {
+				const _isLastDisabled = unref(isLastDisabled);
+				setDynamicProps(n40, [getControlAttrs("last", _isLastDisabled), {
+					type: "button",
+					"aria-label": __props.lastLabel,
+					disabled: _isLastDisabled
+				}]);
+			});
+			setInsertionState(n40, null, 0);
+			createSlot("last", {
+				page: () => unref(lastPage),
+				disabled: () => unref(isLastDisabled)
+			}, () => {
+				return createComponent(unref(chevrons_right_default), {
+					class: "rp-pagination__control-icon",
+					"aria-hidden": "true"
+				});
+			}, 1);
+			n40.$evtclick = createInvoker(() => unref(selectPage)(unref(lastPage)));
+			return n41;
+		});
+		return n43;
+	}
+}), [["__scopeId", "data-v-6ae45781"]]);
+//#endregion
+//#region src/components/pagination/types.ts
+var paginationParts = [
+	"root",
+	"items",
+	"control",
+	"page",
+	"ellipsis"
+];
+var paginationColors = componentColors;
+var paginationSizes = [
+	"xs",
+	"sm",
+	"md",
+	"lg",
+	"xl"
+];
+var paginationRadiuses = [
+	"none",
+	"xs",
+	"sm",
+	"md",
+	"lg",
+	"xl",
+	"full"
+];
+//#endregion
+export { pagination_default as a, normalizePaginationTotal as c, paginationSizes as i, usePagination as l, paginationParts as n, getPaginationItems as o, paginationRadiuses as r, normalizePaginationPage as s, paginationColors as t };

package/dist/radio.js

@@ -3,7 +3,8 @@ import { t as bem } from "./bem.js";
 import { n as useStylesApi, t as presence } from "./styles-api.js";
 import { n as getComponentColorValue, r as getComponentContrastColor } from "./componentColors.js";
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
-import { i as useFormControl, o as useControllableValue } from "./useFormControl.js";
+import { t as useControllableValue } from "./useControllableValue.js";
+import { i as useFormControl } from "./useFormControl.js";
 import { t as useControlState } from "./useControlState.js";
 import { child, computed, createIf, createSlot, defineVaporComponent, inject, next, onBeforeUnmount, onMounted, provide, ref, renderEffect, setDynamicProps, setInsertionState, setStaticTemplateRef, shallowRef, template, unref, useId } from "vue";
 //#region src/components/radio/types.ts
@@ -17,13 +18,16 @@ var radioGroupParts = ["root"];
 var radioGroupKey = Symbol("radioGroup");
 //#endregion
 //#region src/components/radio/useRadio.ts
-function getRadioColorStyle(color, autoContrast) {
+function getRadioColorStyle(color, autoContrast, contrastColor) {
 	const colorValue = getComponentColorValue(color);
 	if (color && !colorValue) return void 0;
-	if (!colorValue && !autoContrast) return void 0;
+	if (!colorValue && autoContrast === false && contrastColor === void 0) return void 0;
 	const style = {};
 	if (colorValue) style["--_rp-radio-color"] = colorValue;
-	if (autoContrast) style["--_rp-radio-on-color"] = getComponentContrastColor(color ?? "primary", { autoContrast });
+	if (autoContrast !== false || contrastColor !== void 0) style["--_rp-radio-on-color"] = getComponentContrastColor(color ?? "primary", {
+		autoContrast,
+		contrastColor
+	});
 	return style;
 }
 function useRadio(props, emitChange) {
@@ -39,6 +43,7 @@ function useRadio(props, emitChange) {
 	const variant = computed(() => props.variant ?? group?.variant);
 	const color = computed(() => props.color ?? group?.color);
 	const autoContrast = computed(() => props.autoContrast ?? group?.autoContrast);
+	const contrastColor = computed(() => props.contrastColor ?? group?.contrastColor);
 	const size = computed(() => props.size ?? group?.size);
 	const rootClass = computed(() => bem("rp-radio", {
 		checked: isChecked.value,
@@ -47,7 +52,7 @@ function useRadio(props, emitChange) {
 		[variant.value ?? ""]: Boolean(variant.value),
 		[`size-${size.value}`]: Boolean(size.value)
 	}));
-	const rootStyle = computed(() => getRadioColorStyle(color.value, autoContrast.value));
+	const rootStyle = computed(() => getRadioColorStyle(color.value, autoContrast.value, contrastColor.value));
 	function onSelect(event) {
 		if (isDisabled.value) return;
 		group?.select(props.value);
@@ -163,6 +168,9 @@ function useRadioGroup(props, emitUpdate) {
 		get autoContrast() {
 			return props.autoContrast;
 		},
+		get contrastColor() {
+			return props.contrastColor;
+		},
 		get size() {
 			return props.size;
 		},
@@ -205,6 +213,7 @@ var radio_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			type: Boolean,
 			default: void 0
 		},
+		contrastColor: {},
 		size: { default: void 0 },
 		disabled: {
 			type: Boolean,
@@ -325,6 +334,7 @@ var radio_group_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__
 			type: Boolean,
 			default: void 0
 		},
+		contrastColor: {},
 		size: { default: void 0 },
 		orientation: { default: "vertical" },
 		disabled: {