ropav 0.0.6 → 0.0.8

package/dist/_plugin-vue_export-helper.js

@@ -1,11 +1,3 @@
-//#region src/utils/bem.ts
-function bem(block, ...modifiers) {
-	const classes = [block];
-	for (const mod of modifiers) if (typeof mod === "string") classes.push(`${block}--${mod}`);
-	else for (const [key, val] of Object.entries(mod)) if (val) classes.push(`${block}--${key}`);
-	return classes;
-}
-//#endregion
 //#region \0plugin-vue:export-helper
 var _plugin_vue_export_helper_default = (sfc, props) => {
 	const target = sfc.__vccOpts || sfc;
@@ -13,6 +5,4 @@ var _plugin_vue_export_helper_default = (sfc, props) => {
 	return target;
 };
 //#endregion
-export { bem as n, _plugin_vue_export_helper_default as t };
-
-//# sourceMappingURL=_plugin-vue_export-helper.js.map
+export { _plugin_vue_export_helper_default as t };

package/dist/accordion.css

@@ -0,0 +1,112 @@
+.rp-accordion[data-v-c0aaa9d9] {
+  --_rp-accordion-radius: var(--rp-radius-sm);
+  --_rp-accordion-duration: var(--rp-transition-fast);
+  box-sizing: border-box;
+  display: grid;
+  min-width: 0;
+  overflow: hidden;
+  font-family: var(--rp-font-family);
+  color: var(--rp-color-text);
+  background-color: var(--rp-color-surface-raised);
+  border: var(--rp-border-width-thin) solid var(--rp-color-border);
+  border-radius: var(--_rp-accordion-radius);
+}
+.rp-accordion--disabled[data-v-c0aaa9d9] {
+  opacity: var(--rp-opacity-disabled);
+  cursor: not-allowed;
+}
+.rp-accordion--horizontal[data-v-c0aaa9d9] {
+  display: flex;
+  align-items: stretch;
+}.rp-accordion-item[data-v-8528e537] {
+  --_rp-accordion-duration: var(--rp-transition-fast);
+  box-sizing: border-box;
+  min-width: 0;
+  border-top: var(--rp-border-width-thin) solid var(--rp-color-border);
+}
+.rp-accordion-item[data-v-8528e537]:first-child {
+  border-top: 0;
+}
+.rp-accordion-item--horizontal[data-v-8528e537] {
+  flex: 1 1 0;
+  border-top: 0;
+  border-left: var(--rp-border-width-thin) solid var(--rp-color-border);
+}
+.rp-accordion-item--horizontal[data-v-8528e537]:first-child {
+  border-left: 0;
+}
+.rp-accordion-item--disabled[data-v-8528e537] {
+  opacity: var(--rp-opacity-disabled);
+  cursor: not-allowed;
+}
+.rp-accordion-item__heading[data-v-8528e537] {
+  margin: 0;
+  font: inherit;
+}
+.rp-accordion-item__trigger[data-v-8528e537] {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  box-sizing: border-box;
+  width: 100%;
+  min-height: var(--rp-size-control-lg);
+  gap: var(--rp-spacing-3);
+  padding: var(--rp-spacing-3) var(--rp-spacing-4);
+  color: var(--rp-color-text);
+  font-family: var(--rp-font-family);
+  font-size: var(--rp-font-size-base);
+  font-weight: var(--rp-font-weight-medium);
+  line-height: var(--rp-line-height-tight);
+  text-align: left;
+  appearance: none;
+  cursor: pointer;
+  background: transparent;
+  border: 0;
+  transition: background-color var(--_rp-accordion-duration), color var(--_rp-accordion-duration);
+}
+.rp-accordion-item__trigger[data-v-8528e537]:hover:not(:disabled) {
+  background-color: var(--rp-color-surface-hover);
+}
+.rp-accordion-item__trigger[data-v-8528e537]:focus-visible {
+  outline: none;
+  border-color: var(--rp-color-primary);
+  box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
+}
+.rp-accordion-item__trigger[data-v-8528e537]:disabled {
+  cursor: default;
+}
+.rp-accordion-item__title[data-v-8528e537] {
+  min-width: 0;
+}
+.rp-accordion-item__icon[data-v-8528e537] {
+  display: inline-flex;
+  flex: 0 0 auto;
+  color: var(--rp-color-control-icon);
+  transition: transform var(--_rp-accordion-duration);
+}
+.rp-accordion-item--open .rp-accordion-item__icon[data-v-8528e537] {
+  transform: rotate(180deg);
+}
+.rp-accordion-item__content[data-v-8528e537] {
+  box-sizing: border-box;
+  display: grid;
+  min-width: 0;
+  overflow: hidden;
+  padding: 0 var(--rp-spacing-4) var(--rp-spacing-4);
+  color: var(--rp-color-text);
+  font-size: var(--rp-font-size-base);
+  line-height: var(--rp-line-height-normal);
+  grid-template-rows: 1fr;
+  transition: grid-template-rows var(--_rp-accordion-duration), opacity var(--_rp-accordion-duration), padding-bottom var(--_rp-accordion-duration);
+}
+.rp-accordion-item__inner[data-v-8528e537] {
+  min-height: 0;
+  min-width: 0;
+  overflow: hidden;
+}
+.rp-accordion-content-enter-from[data-v-8528e537],
+.rp-accordion-content-leave-to[data-v-8528e537] {
+  opacity: 0;
+  grid-template-rows: 0fr;
+  padding-bottom: 0;
+}

package/dist/accordion.js

@@ -0,0 +1,358 @@
+import './accordion.css';
+import { t as useRequiredInject } from "./useRequiredInject.js";
+import { t as bem } from "./bem.js";
+import { t as useCollapse } from "./useCollapse.js";
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { VaporTransition, applyVShow, child, computed, createComponent, createIf, createSlot, defineVaporComponent, extend, markRaw, next, provide, ref, renderEffect, setDynamicProps, setInsertionState, setText, template, toDisplayString, unref, useId } from "vue";
+//#region src/components/accordion/types.ts
+var accordionKey = Symbol("accordion");
+//#endregion
+//#region src/components/accordion/useAccordion.ts
+var ACCORDION_SELECTOR = ".rp-accordion";
+var TRIGGER_SELECTOR = ".rp-accordion-item__trigger";
+function normalizeValue(value, multiple) {
+	if (value == null) return [];
+	const values = Array.isArray(value) ? value : [value];
+	return multiple ? values : values.slice(0, 1);
+}
+function toModelValue(values, multiple) {
+	return multiple ? [...values] : values[0] ?? null;
+}
+function hasValue(values, value) {
+	return values.some((itemValue) => itemValue === value);
+}
+function withoutValue(values, value) {
+	return values.filter((itemValue) => itemValue !== value);
+}
+var ORIENTATION_NAVIGATION_KEYS = {
+	vertical: {
+		ArrowDown: 1,
+		ArrowUp: -1
+	},
+	horizontal: {
+		ArrowRight: 1,
+		ArrowLeft: -1
+	}
+};
+function getAccordionTrigger(event, root) {
+	const target = event.target;
+	if (!(target instanceof Element)) return void 0;
+	const trigger = target.closest(TRIGGER_SELECTOR);
+	if (!trigger || trigger.closest(ACCORDION_SELECTOR) !== root) return void 0;
+	return trigger;
+}
+function getAccordionTriggers(root) {
+	return Array.from(root.querySelectorAll(TRIGGER_SELECTOR)).filter((trigger) => trigger.closest(ACCORDION_SELECTOR) === root && !trigger.disabled);
+}
+function getNextTrigger(root, currentTrigger, key, orientation) {
+	const triggers = getAccordionTriggers(root);
+	const currentIndex = triggers.indexOf(currentTrigger);
+	if (currentIndex === -1 || triggers.length === 0) return void 0;
+	if (key === "Home") return triggers[0];
+	if (key === "End") return triggers[triggers.length - 1];
+	const direction = ORIENTATION_NAVIGATION_KEYS[orientation][key];
+	if (!direction) return void 0;
+	return triggers[(currentIndex + direction + triggers.length) % triggers.length];
+}
+function useAccordion(props, emitUpdate) {
+	const isMultiple = computed(() => Boolean(props.multiple));
+	const isCollapsible = computed(() => props.collapsible !== false);
+	const isDisabled = computed(() => Boolean(props.disabled));
+	const orientation = computed(() => props.orientation ?? "vertical");
+	const isControlled = computed(() => props.modelValue !== void 0);
+	const uncontrolledValue = ref(props.defaultValue ?? null);
+	const openValues = computed(() => normalizeValue(isControlled.value ? props.modelValue : uncontrolledValue.value, isMultiple.value));
+	const rootClass = computed(() => bem("rp-accordion", {
+		disabled: isDisabled.value,
+		multiple: isMultiple.value,
+		[`${orientation.value}`]: true
+	}));
+	const rootProps = computed(() => ({
+		id: props.id,
+		class: rootClass.value,
+		"data-disabled": isDisabled.value || void 0,
+		"data-orientation": orientation.value,
+		"aria-label": props.ariaLabel || void 0,
+		"aria-labelledby": props.labelledby || void 0,
+		"aria-describedby": props.describedby || void 0,
+		onKeydown: onRootKeydown
+	}));
+	function setValues(nextValues) {
+		const nextModelValue = toModelValue(nextValues, isMultiple.value);
+		if (!isControlled.value) uncontrolledValue.value = nextModelValue;
+		emitUpdate(nextModelValue);
+	}
+	function setItemOpen(value, open) {
+		if (isDisabled.value) return;
+		const values = openValues.value;
+		if (hasValue(values, value) === open) return;
+		if (!open && !isCollapsible.value) return;
+		if (isMultiple.value) {
+			setValues(open ? [...values, value] : withoutValue(values, value));
+			return;
+		}
+		setValues(open ? [value] : []);
+	}
+	function onRootKeydown(event) {
+		const root = event.currentTarget;
+		if (!root) return;
+		const trigger = getAccordionTrigger(event, root);
+		if (!trigger) return;
+		const nextTrigger = getNextTrigger(root, trigger, event.key, orientation.value);
+		if (!nextTrigger) return;
+		event.preventDefault();
+		nextTrigger.focus();
+	}
+	provide(accordionKey, {
+		get multiple() {
+			return isMultiple.value;
+		},
+		get collapsible() {
+			return isCollapsible.value;
+		},
+		get disabled() {
+			return isDisabled.value;
+		},
+		get unmountOnExit() {
+			return Boolean(props.unmountOnExit);
+		},
+		get orientation() {
+			return orientation.value;
+		},
+		isItemOpen(value) {
+			return hasValue(openValues.value, value);
+		},
+		setItemOpen
+	});
+	return {
+		rootClass,
+		rootProps,
+		openValues,
+		setItemOpen
+	};
+}
+function useAccordionItem(props) {
+	const group = useRequiredInject(accordionKey, "RpAccordionItem");
+	const generatedId = useId();
+	const id = computed(() => props.id ?? `${generatedId}-accordion-item`);
+	const triggerId = computed(() => `${id.value}-trigger`);
+	const contentId = computed(() => `${id.value}-content`);
+	const isOpen = computed(() => group.isItemOpen(props.value));
+	const isDisabled = computed(() => Boolean(group.disabled || props.disabled));
+	const shouldUnmountOnExit = computed(() => props.unmountOnExit ?? group.unmountOnExit);
+	const state = computed(() => isOpen.value ? "open" : "closed");
+	const triggerAriaDisabled = computed(() => isDisabled.value || !group.collapsible && isOpen.value);
+	const collapse = useCollapse({
+		id: contentId,
+		open: isOpen,
+		disabled: isDisabled,
+		unmountOnExit: shouldUnmountOnExit,
+		role: () => props.role ?? "region",
+		ariaLabel: () => props.ariaLabel,
+		ariaDescribedby: () => props.ariaDescribedby,
+		ariaLabelledby: () => props.ariaLabelledby ?? triggerId.value
+	}, (nextOpen) => {
+		setOpen(nextOpen);
+	});
+	const rootClass = computed(() => bem("rp-accordion-item", {
+		open: isOpen.value,
+		closed: !isOpen.value,
+		disabled: isDisabled.value,
+		[`${group.orientation}`]: true
+	}));
+	const rootProps = computed(() => ({
+		id: id.value,
+		class: rootClass.value,
+		"data-state": state.value,
+		"data-disabled": isDisabled.value || void 0
+	}));
+	const triggerProps = computed(() => ({
+		...collapse.triggerProps.value,
+		id: triggerId.value,
+		class: "rp-accordion-item__trigger",
+		"aria-controls": contentId.value,
+		"aria-expanded": isOpen.value,
+		"aria-disabled": triggerAriaDisabled.value || void 0,
+		disabled: isDisabled.value || void 0,
+		onClick: onTriggerClick
+	}));
+	const contentProps = computed(() => ({
+		...collapse.contentProps.value,
+		class: "rp-accordion-item__content",
+		id: contentId.value,
+		"aria-labelledby": props.ariaLabelledby ?? triggerId.value
+	}));
+	const contentSlotProps = computed(() => ({
+		value: props.value,
+		isOpen: isOpen.value,
+		disabled: isDisabled.value,
+		open,
+		close,
+		toggle
+	}));
+	const triggerSlotProps = computed(() => ({
+		triggerProps: triggerProps.value,
+		...contentSlotProps.value
+	}));
+	function open() {
+		setOpen(true);
+	}
+	function close() {
+		setOpen(false);
+	}
+	function toggle() {
+		setOpen(!isOpen.value);
+	}
+	function setOpen(nextOpen) {
+		if (isDisabled.value) return;
+		group.setItemOpen(props.value, nextOpen);
+	}
+	function onTriggerClick() {
+		toggle();
+	}
+	return {
+		group,
+		id,
+		triggerId,
+		contentId,
+		state,
+		isOpen,
+		isDisabled,
+		shouldRenderContent: collapse.shouldRenderContent,
+		rootClass,
+		rootProps,
+		triggerProps,
+		contentProps,
+		triggerSlotProps,
+		contentSlotProps,
+		open,
+		close,
+		toggle
+	};
+}
+//#endregion
+//#region src/components/accordion/accordion.vue?vue&type=script&setup=true&vapor=true&lang.ts
+var t0$2 = template("<div data-v-c0aaa9d9>", 1);
+//#endregion
+//#region src/components/accordion/accordion.vue
+var accordion_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
+	name: "RpAccordion",
+	__name: "accordion",
+	props: {
+		id: {},
+		modelValue: { default: void 0 },
+		defaultValue: { default: void 0 },
+		multiple: {
+			type: Boolean,
+			default: false
+		},
+		collapsible: {
+			type: Boolean,
+			default: true
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		unmountOnExit: {
+			type: Boolean,
+			default: false
+		},
+		orientation: { default: "vertical" },
+		ariaLabel: {},
+		describedby: {},
+		labelledby: {}
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { rootProps } = useAccordion(props, (value) => {
+			emit("update:modelValue", value);
+		});
+		const n1 = t0$2();
+		renderEffect(() => setDynamicProps(n1, [unref(rootProps)]));
+		setInsertionState(n1, null, 0);
+		createSlot("default", null, null, 1);
+		return n1;
+	}
+}), [["__scopeId", "data-v-c0aaa9d9"]]);
+//#endregion
+//#region ~icons/lucide/chevron-down
+var t0$1 = 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 9l6 6l6-6\">", 3, 1);
+function render(_ctx) {
+	return t0$1();
+}
+var chevron_down_default = markRaw(defineVaporComponent({
+	name: "lucide-chevron-down",
+	render
+}));
+//#endregion
+//#region src/components/accordion/accordion-item.vue?vue&type=script&setup=true&vapor=true&lang.ts
+var t0 = template(" ");
+var t1 = template("<button data-v-8528e537><span data-v-8528e537 class=rp-accordion-item__title></span><span data-v-8528e537 class=rp-accordion-item__icon aria-hidden=true>");
+var t2 = template("<section data-v-8528e537><div data-v-8528e537 class=rp-accordion-item__inner>");
+var t3 = template("<div data-v-8528e537><h3 data-v-8528e537 class=rp-accordion-item__heading>", 1);
+//#endregion
+//#region src/components/accordion/accordion-item.vue
+var accordion_item_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
+	name: "RpAccordionItem",
+	__name: "accordion-item",
+	props: {
+		id: {},
+		value: {},
+		title: { default: "" },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		unmountOnExit: {
+			type: Boolean,
+			default: void 0
+		},
+		role: { default: "region" },
+		ariaLabel: {},
+		ariaDescribedby: {},
+		ariaLabelledby: {}
+	},
+	setup(__props) {
+		const { rootProps, triggerProps, contentProps, triggerSlotProps, contentSlotProps, isOpen, shouldRenderContent } = useAccordionItem(__props);
+		const n16 = t3();
+		const n9 = child(n16);
+		renderEffect(() => setDynamicProps(n16, [unref(rootProps)]));
+		setInsertionState(n9, null, 0);
+		createSlot("trigger", { $: [() => unref(triggerSlotProps)] }, () => {
+			const n8 = t1();
+			const n5 = child(n8);
+			const n7 = next(n5, 1);
+			renderEffect(() => setDynamicProps(n8, [unref(triggerProps)]));
+			setInsertionState(n5, null, 0);
+			createSlot("title", null, () => {
+				const n4 = t0();
+				renderEffect(() => setText(n4, toDisplayString(__props.title)));
+				return n4;
+			}, 1);
+			setInsertionState(n7, null, 0);
+			createComponent(unref(chevron_down_default));
+			return n8;
+		}, 1);
+		setInsertionState(n16, null, 1);
+		createComponent(VaporTransition, {
+			name: "rp-accordion-content",
+			persisted: ""
+		}, extend(() => {
+			return createIf(() => unref(shouldRenderContent), () => {
+				const n14 = t2();
+				const n13 = child(n14);
+				renderEffect(() => setDynamicProps(n14, [unref(contentProps)]));
+				setInsertionState(n13, null, 0);
+				createSlot("default", { $: [() => unref(contentSlotProps)] }, null, 1);
+				applyVShow(n14, () => unref(isOpen));
+				return n14;
+			}, null, 129);
+		}, { _: 8 }));
+		return n16;
+	}
+}), [["__scopeId", "data-v-8528e537"]]);
+//#endregion
+export { useAccordionItem as i, accordion_default as n, useAccordion as r, accordion_item_default as t };

package/dist/badge.css

@@ -0,0 +1,169 @@
+.rp-badge[data-v-ab51b365] {
+  --_rp-badge-accent: var(--_rp-badge-custom-color, var(--rp-color-primary));
+  --_rp-badge-accent-fg: var(--_rp-badge-custom-fg, var(--rp-color-primary-fg));
+  --_rp-badge-accent-on: var(--_rp-badge-custom-on, var(--rp-color-on-primary));
+  --_rp-badge-accent-subtle-bg: var(
+      --_rp-badge-custom-subtle-bg,
+      var(--rp-color-primary-subtle-bg)
+  );
+  --_rp-badge-accent-border: var(--_rp-badge-custom-border, var(--rp-color-primary-border));
+  --_rp-badge-height: 1.5rem;
+  --_rp-badge-padding-x: var(--rp-spacing-2);
+  --_rp-badge-font-size: var(--rp-font-size-sm);
+  --_rp-badge-radius: var(--rp-radius-full);
+  --_rp-badge-bg: var(--rp-color-button-default-bg);
+  --_rp-badge-fg: var(--rp-color-text);
+  --_rp-badge-border: var(--rp-color-border);
+  box-sizing: border-box;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  max-width: 100%;
+  min-width: 0;
+  height: var(--_rp-badge-height);
+  padding: 0 var(--_rp-badge-padding-x);
+  gap: var(--rp-spacing-1);
+  color: var(--_rp-badge-fg);
+  font-family: var(--rp-font-family);
+  font-size: var(--_rp-badge-font-size);
+  font-weight: var(--rp-font-weight-medium);
+  line-height: var(--rp-line-height-none);
+  vertical-align: middle;
+  white-space: nowrap;
+  background-color: var(--_rp-badge-bg);
+  border: var(--rp-border-width-thin) solid var(--_rp-badge-border);
+  border-radius: var(--_rp-badge-radius);
+  transition: background-color var(--rp-transition-fast), color var(--rp-transition-fast), border-color var(--rp-transition-fast);
+}
+.rp-badge--color-primary[data-v-ab51b365] {
+  --_rp-badge-accent: var(--rp-color-primary);
+  --_rp-badge-accent-fg: var(--rp-color-primary-fg);
+  --_rp-badge-accent-on: var(--rp-color-on-primary);
+  --_rp-badge-accent-subtle-bg: var(--rp-color-primary-subtle-bg);
+  --_rp-badge-accent-border: var(--rp-color-primary-border);
+}
+.rp-badge--color-secondary[data-v-ab51b365] {
+  --_rp-badge-accent: var(--rp-color-secondary);
+  --_rp-badge-accent-fg: var(--rp-color-secondary-fg);
+  --_rp-badge-accent-on: var(--rp-color-on-secondary);
+  --_rp-badge-accent-subtle-bg: var(--rp-color-secondary-subtle-bg);
+  --_rp-badge-accent-border: var(--rp-color-secondary-border);
+}
+.rp-badge--color-success[data-v-ab51b365] {
+  --_rp-badge-accent: var(--rp-color-success);
+  --_rp-badge-accent-fg: var(--rp-color-success-fg);
+  --_rp-badge-accent-on: var(--rp-color-on-success);
+  --_rp-badge-accent-subtle-bg: var(--rp-color-success-subtle-bg);
+  --_rp-badge-accent-border: var(--rp-color-success-border);
+}
+.rp-badge--color-warning[data-v-ab51b365] {
+  --_rp-badge-accent: var(--rp-color-warning);
+  --_rp-badge-accent-fg: var(--rp-color-warning-fg);
+  --_rp-badge-accent-on: var(--rp-color-on-warning);
+  --_rp-badge-accent-subtle-bg: var(--rp-color-warning-subtle-bg);
+  --_rp-badge-accent-border: var(--rp-color-warning-border);
+}
+.rp-badge--color-danger[data-v-ab51b365] {
+  --_rp-badge-accent: var(--rp-color-danger);
+  --_rp-badge-accent-fg: var(--rp-color-danger-fg);
+  --_rp-badge-accent-on: var(--rp-color-on-danger);
+  --_rp-badge-accent-subtle-bg: var(--rp-color-danger-subtle-bg);
+  --_rp-badge-accent-border: var(--rp-color-danger-border);
+}
+.rp-badge--color-info[data-v-ab51b365] {
+  --_rp-badge-accent: var(--rp-color-info);
+  --_rp-badge-accent-fg: var(--rp-color-info-fg);
+  --_rp-badge-accent-on: var(--rp-color-on-info);
+  --_rp-badge-accent-subtle-bg: var(--rp-color-info-subtle-bg);
+  --_rp-badge-accent-border: var(--rp-color-info-border);
+}
+.rp-badge--color-neutral[data-v-ab51b365] {
+  --_rp-badge-accent: var(--rp-color-neutral);
+  --_rp-badge-accent-fg: var(--rp-color-neutral-fg);
+  --_rp-badge-accent-on: var(--rp-color-on-neutral);
+  --_rp-badge-accent-subtle-bg: var(--rp-color-neutral-subtle-bg);
+  --_rp-badge-accent-border: var(--rp-color-neutral-border);
+}
+.rp-badge--solid[data-v-ab51b365] {
+  --_rp-badge-bg: var(--_rp-badge-accent);
+  --_rp-badge-fg: var(--_rp-badge-accent-on);
+  --_rp-badge-border: var(--_rp-badge-accent);
+}
+.rp-badge--subtle[data-v-ab51b365] {
+  --_rp-badge-bg: var(--_rp-badge-accent-subtle-bg);
+  --_rp-badge-fg: var(--_rp-badge-accent-fg);
+  --_rp-badge-border: transparent;
+}
+.rp-badge--surface[data-v-ab51b365] {
+  --_rp-badge-bg: var(--_rp-badge-accent-subtle-bg);
+  --_rp-badge-fg: var(--_rp-badge-accent-fg);
+  --_rp-badge-border: var(--_rp-badge-accent-border);
+}
+.rp-badge--outline[data-v-ab51b365] {
+  --_rp-badge-bg: transparent;
+  --_rp-badge-fg: var(--_rp-badge-accent-fg);
+  --_rp-badge-border: var(--_rp-badge-accent-border);
+}
+.rp-badge--size-xs[data-v-ab51b365] {
+  --_rp-badge-height: 1rem;
+  --_rp-badge-padding-x: var(--rp-spacing-1);
+  --_rp-badge-font-size: var(--rp-font-size-xs);
+}
+.rp-badge--size-sm[data-v-ab51b365] {
+  --_rp-badge-height: 1.25rem;
+  --_rp-badge-padding-x: var(--rp-spacing-2);
+  --_rp-badge-font-size: var(--rp-font-size-xs);
+}
+.rp-badge--size-md[data-v-ab51b365] {
+  --_rp-badge-height: 1.5rem;
+  --_rp-badge-padding-x: var(--rp-spacing-2);
+  --_rp-badge-font-size: var(--rp-font-size-sm);
+}
+.rp-badge--size-lg[data-v-ab51b365] {
+  --_rp-badge-height: 1.75rem;
+  --_rp-badge-padding-x: var(--rp-spacing-3);
+  --_rp-badge-font-size: var(--rp-font-size-base);
+}
+.rp-badge--size-xl[data-v-ab51b365] {
+  --_rp-badge-height: 2rem;
+  --_rp-badge-padding-x: var(--rp-spacing-4);
+  --_rp-badge-font-size: var(--rp-font-size-base);
+}
+.rp-badge--radius-none[data-v-ab51b365] {
+  --_rp-badge-radius: var(--rp-radius-none);
+}
+.rp-badge--radius-xs[data-v-ab51b365] {
+  --_rp-badge-radius: var(--rp-radius-xs);
+}
+.rp-badge--radius-sm[data-v-ab51b365] {
+  --_rp-badge-radius: var(--rp-radius-sm);
+}
+.rp-badge--radius-md[data-v-ab51b365] {
+  --_rp-badge-radius: var(--rp-radius-md);
+}
+.rp-badge--radius-lg[data-v-ab51b365] {
+  --_rp-badge-radius: var(--rp-radius-lg);
+}
+.rp-badge--radius-xl[data-v-ab51b365] {
+  --_rp-badge-radius: var(--rp-radius-xl);
+}
+.rp-badge--radius-full[data-v-ab51b365] {
+  --_rp-badge-radius: var(--rp-radius-full);
+}
+.rp-badge__left[data-v-ab51b365], .rp-badge__right[data-v-ab51b365] {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  line-height: 0;
+}
+.rp-badge__left[data-v-ab51b365] >  svg, .rp-badge__right[data-v-ab51b365] >  svg {
+  display: block;
+  width: 1em;
+  height: 1em;
+}
+.rp-badge__label[data-v-ab51b365] {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}