ropav 0.0.7 → 0.0.9

package/dist/dropdown-menu.js

@@ -899,5 +899,3 @@ var dropdown_menu_default = /* @__PURE__ */ defineVaporComponent({
 });
 //#endregion
 export { useDropdownMenu as n, dropdown_menu_default as t };
-
-//# sourceMappingURL=dropdown-menu.js.map

package/dist/field.css

@@ -1,15 +1,15 @@
-.rp-field[data-v-50e7f3a5] {
-  --_rp-field-danger: var(--rp-color-danger);
+.rp-field[data-v-f9e37351] {
+  --_rp-field-danger: var(--rp-color-red-filled);
   display: grid;
   gap: var(--rp-spacing-1);
   min-width: 0;
   font-family: var(--rp-font-family);
   color: var(--rp-color-text);
 }
-html.dark .rp-field[data-v-50e7f3a5] {
-  --_rp-field-danger: var(--rp-color-danger-fg);
+html.dark .rp-field[data-v-f9e37351], [data-rp-color-scheme=dark] .rp-field[data-v-f9e37351] {
+  --_rp-field-danger: var(--rp-color-red-light-color);
 }
-.rp-field__label[data-v-50e7f3a5] {
+.rp-field__label[data-v-f9e37351] {
   display: inline-flex;
   width: fit-content;
   align-items: center;
@@ -17,24 +17,24 @@ html.dark .rp-field[data-v-50e7f3a5] {
   color: var(--rp-color-text);
   font-size: var(--rp-font-size-sm);
   font-weight: var(--rp-font-weight-medium);
-  line-height: var(--rp-line-height-normal);
+  line-height: var(--rp-line-height-md);
 }
-.rp-field__required[data-v-50e7f3a5] {
+.rp-field__required[data-v-f9e37351] {
   color: var(--_rp-field-danger);
-  line-height: var(--rp-line-height-none);
+  line-height: 1;
 }
-.rp-field__control[data-v-50e7f3a5] {
+.rp-field__label + .rp-field__control[data-v-f9e37351] {
+  margin-block-start: var(--rp-spacing-1);
+}
+.rp-field__control[data-v-f9e37351] {
   min-width: 0;
 }
-.rp-field__description[data-v-50e7f3a5], .rp-field__message[data-v-50e7f3a5] {
+.rp-field__description[data-v-f9e37351] {
   margin: 0;
-  color: var(--rp-color-text-secondary);
+  color: var(--rp-color-dimmed);
   font-size: var(--rp-font-size-sm);
-  line-height: var(--rp-line-height-normal);
-}
-.rp-field--invalid .rp-field__message[data-v-50e7f3a5] {
-  color: var(--_rp-field-danger);
+  line-height: var(--rp-line-height-md);
 }
-.rp-field--disabled .rp-field__label[data-v-50e7f3a5], .rp-field--disabled .rp-field__description[data-v-50e7f3a5], .rp-field--disabled .rp-field__message[data-v-50e7f3a5] {
-  color: var(--rp-color-text-disabled);
+.rp-field--disabled .rp-field__label[data-v-f9e37351], .rp-field--disabled .rp-field__description[data-v-f9e37351] {
+  color: var(--rp-color-disabled-color);
 }

package/dist/field.js

@@ -1,57 +1,76 @@
 import './field.css';
 import { t as bem } from "./bem.js";
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
-import { child, computed, createIf, createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, setProp, setText, template, toDisplayString, unref, useId, useSlots } from "vue";
+import { child, computed, createIf, createInvoker, createSlot, defineVaporComponent, delegateEvents, renderEffect, setClass, setInsertionState, setProp, setText, template, toDisplayString, unref, useId, useSlots } from "vue";
 //#region src/components/field/useField.ts
+var INTERACTIVE_LABEL_SELECTOR = [
+	"button",
+	"a[href]",
+	"input",
+	"select",
+	"textarea",
+	"[contenteditable=\"true\"]",
+	"[tabindex]:not([tabindex=\"-1\"])"
+].join(",");
+function isInteractiveLabelTarget(target) {
+	return Boolean(target.closest(INTERACTIVE_LABEL_SELECTOR));
+}
 function useField(props) {
 	const slots = useSlots();
 	const generatedId = useId();
 	const controlId = computed(() => props.id ?? `${generatedId}-control`);
 	const labelId = computed(() => `${controlId.value}-label`);
 	const descriptionId = computed(() => `${controlId.value}-description`);
-	const messageId = computed(() => `${controlId.value}-message`);
-	const isInvalid = computed(() => Boolean(props.invalid || props.error));
-	const messageText = computed(() => props.error || props.message);
+	const isInvalid = computed(() => Boolean(props.invalid));
 	const hasLabel = computed(() => Boolean(props.label || slots.label));
 	const hasDescription = computed(() => Boolean(props.description || slots.description));
-	const hasMessage = computed(() => Boolean(messageText.value || slots.message));
+	const hasMessage = computed(() => Boolean(slots.message));
 	const controlLabelledby = computed(() => hasLabel.value ? labelId.value : void 0);
-	const controlDescribedby = computed(() => [hasDescription.value ? descriptionId.value : void 0, hasMessage.value ? messageId.value : void 0].filter(Boolean).join(" ") || void 0);
+	const controlDescribedby = computed(() => hasDescription.value ? descriptionId.value : void 0);
+	const rootClass = computed(() => bem("rp-field", {
+		disabled: props.disabled,
+		required: props.required,
+		invalid: isInvalid.value
+	}));
+	const controlProps = computed(() => ({
+		id: controlId.value,
+		disabled: props.disabled || void 0,
+		required: props.required || void 0,
+		invalid: isInvalid.value || void 0,
+		labelledby: controlLabelledby.value,
+		describedby: controlDescribedby.value
+	}));
+	function focusControl(e) {
+		if (props.disabled) return;
+		const target = e.target;
+		if (target instanceof Element && isInteractiveLabelTarget(target)) return;
+		const label = e.currentTarget;
+		const control = label instanceof HTMLLabelElement ? label.control ?? label.ownerDocument.getElementById(controlId.value) : void 0;
+		if (control instanceof HTMLElement) control.focus();
+	}
 	return {
 		controlId,
 		labelId,
 		descriptionId,
-		messageId,
 		isInvalid,
-		messageText,
 		hasLabel,
 		hasDescription,
 		hasMessage,
 		controlLabelledby,
 		controlDescribedby,
-		rootClass: computed(() => bem("rp-field", {
-			disabled: props.disabled,
-			required: props.required,
-			invalid: isInvalid.value
-		})),
-		controlProps: computed(() => ({
-			id: controlId.value,
-			disabled: props.disabled || void 0,
-			required: props.required || void 0,
-			invalid: isInvalid.value || void 0,
-			labelledby: controlLabelledby.value,
-			describedby: controlDescribedby.value
-		}))
+		rootClass,
+		controlProps,
+		focusControl
 	};
 }
 //#endregion
 //#region src/components/field/field.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template(" ");
-var t1 = template("<span data-v-50e7f3a5 class=rp-field__required aria-hidden=true>*", 2);
-var t2 = template("<label data-v-50e7f3a5 class=rp-field__label>");
-var t3 = template("<p data-v-50e7f3a5 class=rp-field__description>");
-var t4 = template("<p data-v-50e7f3a5 class=rp-field__message>");
-var t5 = template("<div data-v-50e7f3a5><div data-v-50e7f3a5 class=rp-field__control></div>", 1);
+var t1 = template("<span data-v-f9e37351 class=rp-field__required aria-hidden=true>*", 2);
+var t2 = template("<label data-v-f9e37351 class=rp-field__label>");
+var t3 = template("<p data-v-f9e37351 class=rp-field__description>");
+var t4 = template("<div data-v-f9e37351><div data-v-f9e37351 class=rp-field__control></div>", 1);
+delegateEvents("mousedown");
 //#endregion
 //#region src/components/field/field.vue
 var field_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
@@ -61,8 +80,6 @@ var field_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 		id: {},
 		label: { default: "" },
 		description: { default: "" },
-		message: { default: "" },
-		error: { default: "" },
 		disabled: {
 			type: Boolean,
 			default: void 0
@@ -77,11 +94,11 @@ var field_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 		}
 	},
 	setup(__props) {
-		const { controlId, labelId, descriptionId, messageId, isInvalid, messageText, hasLabel, hasDescription, hasMessage, controlLabelledby, controlDescribedby, rootClass, controlProps } = useField(__props);
-		const n23 = t5();
-		const n10 = child(n23, 1);
-		renderEffect(() => setClass(n23, unref(rootClass)));
-		setInsertionState(n23, 0, 0);
+		const { controlId, labelId, descriptionId, isInvalid, hasLabel, hasDescription, hasMessage, controlLabelledby, controlDescribedby, rootClass, controlProps, focusControl } = useField(__props);
+		const n20 = t4();
+		const n10 = child(n20, 1);
+		renderEffect(() => setClass(n20, unref(rootClass)));
+		setInsertionState(n20, 0, 0);
 		createIf(() => unref(hasLabel), () => {
 			const n8 = t2();
 			renderEffect(() => {
@@ -98,6 +115,7 @@ var field_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			createIf(() => __props.required, () => {
 				return t1();
 			});
+			n8.$evtmousedown = createInvoker((e) => unref(focusControl)(e));
 			return n8;
 		});
 		setInsertionState(n10, null, 0);
@@ -110,7 +128,7 @@ var field_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			describedby: () => unref(controlDescribedby),
 			controlProps: () => unref(controlProps)
 		}, null, 1);
-		setInsertionState(n23, null, 2);
+		setInsertionState(n20, null, 2);
 		createIf(() => unref(hasDescription), () => {
 			const n16 = t3();
 			renderEffect(() => setProp(n16, "id", unref(descriptionId)));
@@ -122,25 +140,12 @@ var field_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
 			}, 1);
 			return n16;
 		});
-		setInsertionState(n23, null, 3);
+		setInsertionState(n20, null, 3);
 		createIf(() => unref(hasMessage), () => {
-			const n22 = t4();
-			renderEffect(() => {
-				setProp(n22, "id", unref(messageId));
-				setProp(n22, "role", unref(isInvalid) ? "alert" : void 0);
-			});
-			setInsertionState(n22, null, 0);
-			createSlot("message", null, () => {
-				const n21 = t0();
-				renderEffect(() => setText(n21, toDisplayString(unref(messageText))));
-				return n21;
-			}, 1);
-			return n22;
+			return createSlot("message", null, null, 1);
 		});
-		return n23;
+		return n20;
 	}
-}), [["__scopeId", "data-v-50e7f3a5"]]);
+}), [["__scopeId", "data-v-f9e37351"]]);
 //#endregion
 export { field_default as t };
-
-//# sourceMappingURL=field.js.map

package/dist/icon-button.css

@@ -1,36 +1,14 @@
-.rp-button[data-v-7005752e] {
-  --_rp-button-accent: var(--_rp-button-custom-color, var(--rp-color-primary));
-  --_rp-button-accent-hover: var(--_rp-button-custom-hover, var(--rp-color-primary-hover));
-  --_rp-button-accent-active: var(--_rp-button-custom-active, var(--rp-color-primary-active));
-  --_rp-button-accent-on: var(--_rp-button-custom-on, var(--rp-color-on-primary));
-  --_rp-button-accent-subtle-bg: var(
-      --_rp-button-custom-subtle-bg,
-      var(--rp-color-primary-subtle-bg)
-  );
-  --_rp-button-accent-subtle-bg-hover: var(
-      --_rp-button-custom-subtle-bg-hover,
-      var(--rp-color-primary-subtle-bg-hover)
-  );
-  --_rp-button-accent-subtle-bg-active: var(
-      --_rp-button-custom-subtle-bg-active,
-      var(--rp-color-primary-subtle-bg-active)
-  );
-  --_rp-button-accent-border: var(--_rp-button-custom-border, var(--rp-color-primary-border));
-  --_rp-button-accent-border-hover: var(
-      --_rp-button-custom-border-hover,
-      var(--rp-color-primary-border-hover)
-  );
-  --_rp-button-accent-fg: var(--_rp-button-custom-fg, var(--rp-color-primary-fg));
-  --_rp-button-bg: var(--rp-color-button-default-bg);
-  --_rp-button-bg-hover: var(--rp-color-button-default-bg-hover);
-  --_rp-button-bg-active: var(--rp-color-button-default-bg-active);
-  --_rp-button-border: var(--rp-color-border);
-  --_rp-button-border-hover: var(--rp-color-border-hover);
+.rp-button[data-v-9f46a6a3] {
+  --_rp-button-bg: var(--rp-color-default);
+  --_rp-button-bg-hover: var(--rp-color-default-hover);
+  --_rp-button-bg-active: var(--rp-color-disabled);
+  --_rp-button-border: var(--rp-color-default-border);
+  --_rp-button-border-hover: var(--_rp-button-border);
   --_rp-button-border-active: var(--_rp-button-border-hover);
-  --_rp-button-fg: var(--rp-color-text);
+  --_rp-button-fg: var(--rp-color-default-color);
   --_rp-button-height: var(--rp-size-control-md);
-  --_rp-button-padding-x: var(--rp-spacing-4);
-  --_rp-button-font-size: var(--rp-font-size-base);
+  --_rp-button-padding-x: 22px;
+  --_rp-button-font-size: var(--rp-font-size-md);
   --_rp-button-radius: var(--rp-radius-sm);
   --_rp-button-shadow: var(--rp-shadow-sm);
   --_rp-button-shadow-hover: var(--rp-shadow-base);
@@ -42,13 +20,14 @@
   box-sizing: border-box;
   font-family: var(--rp-font-family);
   font-weight: var(--rp-font-weight-medium);
-  line-height: var(--rp-line-height-none);
+  line-height: 1;
   appearance: none;
   background-color: var(--_rp-button-bg);
   border: var(--rp-border-width-thin) solid var(--_rp-button-border);
   box-shadow: var(--_rp-button-shadow);
   color: var(--_rp-button-fg);
   cursor: pointer;
+  text-decoration: none;
   transition: background-color var(--rp-transition-fast), color var(--rp-transition-fast), border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast), transform var(--rp-transition-fast);
   white-space: nowrap;
   user-select: none;
@@ -57,266 +36,108 @@
   font-size: var(--_rp-button-font-size);
   border-radius: var(--_rp-button-radius);
 }
-.rp-button[data-v-7005752e]:hover:not(:disabled) {
+.rp-button[data-v-9f46a6a3]:hover:not(:disabled):not(.rp-button--disabled) {
   background-color: var(--_rp-button-bg-hover);
   border-color: var(--_rp-button-border-hover);
   box-shadow: var(--_rp-button-shadow-hover);
 }
-.rp-button[data-v-7005752e]:active:not(:disabled) {
+.rp-button[data-v-9f46a6a3]:active:not(:disabled):not(.rp-button--disabled) {
   background-color: var(--_rp-button-bg-active);
   border-color: var(--_rp-button-border-active);
   box-shadow: var(--_rp-button-shadow-active);
   transform: translateY(1px);
 }
-.rp-button--color-primary[data-v-7005752e] {
-  --_rp-button-accent: var(--rp-color-primary);
-  --_rp-button-accent-hover: var(--rp-color-primary-hover);
-  --_rp-button-accent-active: var(--rp-color-primary-active);
-  --_rp-button-accent-on: var(--rp-color-on-primary);
-  --_rp-button-accent-subtle-bg: var(--rp-color-primary-subtle-bg);
-  --_rp-button-accent-subtle-bg-hover: var(--rp-color-primary-subtle-bg-hover);
-  --_rp-button-accent-subtle-bg-active: var(--rp-color-primary-subtle-bg-active);
-  --_rp-button-accent-border: var(--rp-color-primary-border);
-  --_rp-button-accent-border-hover: var(--rp-color-primary-border-hover);
-  --_rp-button-accent-fg: var(--rp-color-primary-fg);
-  --_rp-button-bg-hover: var(--_rp-button-accent-subtle-bg-hover);
-  --_rp-button-bg-active: var(--_rp-button-accent-subtle-bg-active);
-  --_rp-button-border: var(--_rp-button-accent-border);
-  --_rp-button-border-hover: var(--_rp-button-accent-border-hover);
-  --_rp-button-fg: var(--_rp-button-accent-fg);
-}
-.rp-button--color-secondary[data-v-7005752e] {
-  --_rp-button-accent: var(--rp-color-secondary);
-  --_rp-button-accent-hover: var(--rp-color-secondary-hover);
-  --_rp-button-accent-active: var(--rp-color-secondary-active);
-  --_rp-button-accent-on: var(--rp-color-on-secondary);
-  --_rp-button-accent-subtle-bg: var(--rp-color-secondary-subtle-bg);
-  --_rp-button-accent-subtle-bg-hover: var(--rp-color-secondary-subtle-bg-hover);
-  --_rp-button-accent-subtle-bg-active: var(--rp-color-secondary-subtle-bg-active);
-  --_rp-button-accent-border: var(--rp-color-secondary-border);
-  --_rp-button-accent-border-hover: var(--rp-color-secondary-border-hover);
-  --_rp-button-accent-fg: var(--rp-color-secondary-fg);
-  --_rp-button-bg-hover: var(--_rp-button-accent-subtle-bg-hover);
-  --_rp-button-bg-active: var(--_rp-button-accent-subtle-bg-active);
-  --_rp-button-border: var(--_rp-button-accent-border);
-  --_rp-button-border-hover: var(--_rp-button-accent-border-hover);
-  --_rp-button-fg: var(--_rp-button-accent-fg);
-}
-.rp-button--color-success[data-v-7005752e] {
-  --_rp-button-accent: var(--rp-color-success);
-  --_rp-button-accent-hover: var(--rp-color-success-hover);
-  --_rp-button-accent-active: var(--rp-color-success-active);
-  --_rp-button-accent-on: var(--rp-color-on-success);
-  --_rp-button-accent-subtle-bg: var(--rp-color-success-subtle-bg);
-  --_rp-button-accent-subtle-bg-hover: var(--rp-color-success-subtle-bg-hover);
-  --_rp-button-accent-subtle-bg-active: var(--rp-color-success-subtle-bg-active);
-  --_rp-button-accent-border: var(--rp-color-success-border);
-  --_rp-button-accent-border-hover: var(--rp-color-success-border-hover);
-  --_rp-button-accent-fg: var(--rp-color-success-fg);
-  --_rp-button-bg-hover: var(--_rp-button-accent-subtle-bg-hover);
-  --_rp-button-bg-active: var(--_rp-button-accent-subtle-bg-active);
-  --_rp-button-border: var(--_rp-button-accent-border);
-  --_rp-button-border-hover: var(--_rp-button-accent-border-hover);
-  --_rp-button-fg: var(--_rp-button-accent-fg);
-}
-.rp-button--color-warning[data-v-7005752e] {
-  --_rp-button-accent: var(--rp-color-warning);
-  --_rp-button-accent-hover: var(--rp-color-warning-hover);
-  --_rp-button-accent-active: var(--rp-color-warning-active);
-  --_rp-button-accent-on: var(--rp-color-on-warning);
-  --_rp-button-accent-subtle-bg: var(--rp-color-warning-subtle-bg);
-  --_rp-button-accent-subtle-bg-hover: var(--rp-color-warning-subtle-bg-hover);
-  --_rp-button-accent-subtle-bg-active: var(--rp-color-warning-subtle-bg-active);
-  --_rp-button-accent-border: var(--rp-color-warning-border);
-  --_rp-button-accent-border-hover: var(--rp-color-warning-border-hover);
-  --_rp-button-accent-fg: var(--rp-color-warning-fg);
-  --_rp-button-bg-hover: var(--_rp-button-accent-subtle-bg-hover);
-  --_rp-button-bg-active: var(--_rp-button-accent-subtle-bg-active);
-  --_rp-button-border: var(--_rp-button-accent-border);
-  --_rp-button-border-hover: var(--_rp-button-accent-border-hover);
-  --_rp-button-fg: var(--_rp-button-accent-fg);
-}
-.rp-button--color-danger[data-v-7005752e] {
-  --_rp-button-accent: var(--rp-color-danger);
-  --_rp-button-accent-hover: var(--rp-color-danger-hover);
-  --_rp-button-accent-active: var(--rp-color-danger-active);
-  --_rp-button-accent-on: var(--rp-color-on-danger);
-  --_rp-button-accent-subtle-bg: var(--rp-color-danger-subtle-bg);
-  --_rp-button-accent-subtle-bg-hover: var(--rp-color-danger-subtle-bg-hover);
-  --_rp-button-accent-subtle-bg-active: var(--rp-color-danger-subtle-bg-active);
-  --_rp-button-accent-border: var(--rp-color-danger-border);
-  --_rp-button-accent-border-hover: var(--rp-color-danger-border-hover);
-  --_rp-button-accent-fg: var(--rp-color-danger-fg);
-  --_rp-button-bg-hover: var(--_rp-button-accent-subtle-bg-hover);
-  --_rp-button-bg-active: var(--_rp-button-accent-subtle-bg-active);
-  --_rp-button-border: var(--_rp-button-accent-border);
-  --_rp-button-border-hover: var(--_rp-button-accent-border-hover);
-  --_rp-button-fg: var(--_rp-button-accent-fg);
-}
-.rp-button--color-info[data-v-7005752e] {
-  --_rp-button-accent: var(--rp-color-info);
-  --_rp-button-accent-hover: var(--rp-color-info-hover);
-  --_rp-button-accent-active: var(--rp-color-info-active);
-  --_rp-button-accent-on: var(--rp-color-on-info);
-  --_rp-button-accent-subtle-bg: var(--rp-color-info-subtle-bg);
-  --_rp-button-accent-subtle-bg-hover: var(--rp-color-info-subtle-bg-hover);
-  --_rp-button-accent-subtle-bg-active: var(--rp-color-info-subtle-bg-active);
-  --_rp-button-accent-border: var(--rp-color-info-border);
-  --_rp-button-accent-border-hover: var(--rp-color-info-border-hover);
-  --_rp-button-accent-fg: var(--rp-color-info-fg);
-  --_rp-button-bg-hover: var(--_rp-button-accent-subtle-bg-hover);
-  --_rp-button-bg-active: var(--_rp-button-accent-subtle-bg-active);
-  --_rp-button-border: var(--_rp-button-accent-border);
-  --_rp-button-border-hover: var(--_rp-button-accent-border-hover);
-  --_rp-button-fg: var(--_rp-button-accent-fg);
-}
-.rp-button--color-neutral[data-v-7005752e] {
-  --_rp-button-accent: var(--rp-color-neutral);
-  --_rp-button-accent-hover: var(--rp-color-neutral-hover);
-  --_rp-button-accent-active: var(--rp-color-neutral-active);
-  --_rp-button-accent-on: var(--rp-color-on-neutral);
-  --_rp-button-accent-subtle-bg: var(--rp-color-neutral-subtle-bg);
-  --_rp-button-accent-subtle-bg-hover: var(--rp-color-neutral-subtle-bg-hover);
-  --_rp-button-accent-subtle-bg-active: var(--rp-color-neutral-subtle-bg-active);
-  --_rp-button-accent-border: var(--rp-color-neutral-border);
-  --_rp-button-accent-border-hover: var(--rp-color-neutral-border-hover);
-  --_rp-button-accent-fg: var(--rp-color-neutral-fg);
-  --_rp-button-bg-hover: var(--_rp-button-accent-subtle-bg-hover);
-  --_rp-button-bg-active: var(--_rp-button-accent-subtle-bg-active);
-  --_rp-button-border: var(--_rp-button-accent-border);
-  --_rp-button-border-hover: var(--_rp-button-accent-border-hover);
-  --_rp-button-fg: var(--_rp-button-accent-fg);
-}
-.rp-button--size-xs[data-v-7005752e] {
-  --_rp-button-height: calc(var(--rp-size-control-sm) - var(--rp-spacing-1));
-  --_rp-button-padding-x: var(--rp-spacing-2);
+.rp-button--size-xs[data-v-9f46a6a3] {
+  --_rp-button-height: var(--rp-size-control-xs);
+  --_rp-button-padding-x: 14px;
   --_rp-button-font-size: var(--rp-font-size-xs);
 }
-.rp-button--size-sm[data-v-7005752e] {
+.rp-button--size-sm[data-v-9f46a6a3] {
   --_rp-button-height: var(--rp-size-control-sm);
-  --_rp-button-padding-x: var(--rp-spacing-3);
+  --_rp-button-padding-x: 18px;
   --_rp-button-font-size: var(--rp-font-size-sm);
 }
-.rp-button--size-lg[data-v-7005752e] {
+.rp-button--size-md[data-v-9f46a6a3] {
+  --_rp-button-height: var(--rp-size-control-md);
+  --_rp-button-padding-x: 22px;
+  --_rp-button-font-size: var(--rp-font-size-md);
+}
+.rp-button--size-lg[data-v-9f46a6a3] {
   --_rp-button-height: var(--rp-size-control-lg);
-  --_rp-button-padding-x: var(--rp-spacing-5);
+  --_rp-button-padding-x: 26px;
   --_rp-button-font-size: var(--rp-font-size-lg);
 }
-.rp-button--size-xl[data-v-7005752e] {
-  --_rp-button-height: calc(var(--rp-size-control-lg) + var(--rp-spacing-2));
-  --_rp-button-padding-x: var(--rp-spacing-6);
-  --_rp-button-font-size: var(--rp-font-size-lg);
+.rp-button--size-xl[data-v-9f46a6a3] {
+  --_rp-button-height: var(--rp-size-control-xl);
+  --_rp-button-padding-x: 32px;
+  --_rp-button-font-size: var(--rp-font-size-xl);
 }
-.rp-button--radius-xs[data-v-7005752e] {
+.rp-button--radius-xs[data-v-9f46a6a3] {
   --_rp-button-radius: var(--rp-radius-xs);
 }
-.rp-button--radius-sm[data-v-7005752e] {
+.rp-button--radius-sm[data-v-9f46a6a3] {
   --_rp-button-radius: var(--rp-radius-sm);
 }
-.rp-button--radius-md[data-v-7005752e] {
+.rp-button--radius-md[data-v-9f46a6a3] {
   --_rp-button-radius: var(--rp-radius-md);
 }
-.rp-button--radius-lg[data-v-7005752e] {
+.rp-button--radius-lg[data-v-9f46a6a3] {
   --_rp-button-radius: var(--rp-radius-lg);
 }
-.rp-button--radius-xl[data-v-7005752e] {
+.rp-button--radius-xl[data-v-9f46a6a3] {
   --_rp-button-radius: var(--rp-radius-xl);
 }
-.rp-button--solid[data-v-7005752e] {
-  --_rp-button-bg: var(--_rp-button-accent);
-  --_rp-button-bg-hover: var(--_rp-button-accent-hover);
-  --_rp-button-bg-active: var(--_rp-button-accent-active);
-  --_rp-button-border: var(--_rp-button-accent);
-  --_rp-button-border-hover: var(--_rp-button-accent-hover);
-  --_rp-button-border-active: var(--_rp-button-accent-active);
-  --_rp-button-fg: var(--_rp-button-accent-on);
-}
-.rp-button--subtle[data-v-7005752e] {
-  --_rp-button-bg: var(--_rp-button-accent-subtle-bg);
-  --_rp-button-bg-hover: var(--_rp-button-accent-subtle-bg-hover);
-  --_rp-button-bg-active: var(--_rp-button-accent-subtle-bg-active);
-  --_rp-button-border: transparent;
-  --_rp-button-border-hover: transparent;
-  --_rp-button-border-active: transparent;
-  --_rp-button-fg: var(--_rp-button-accent-fg);
+.rp-button--subtle[data-v-9f46a6a3] {
   --_rp-button-shadow: none;
   --_rp-button-shadow-hover: none;
   --_rp-button-shadow-active: none;
 }
-.rp-button--surface[data-v-7005752e] {
-  --_rp-button-bg: var(--_rp-button-accent-subtle-bg);
-  --_rp-button-bg-hover: var(--_rp-button-accent-subtle-bg-hover);
-  --_rp-button-bg-active: var(--_rp-button-accent-subtle-bg-active);
-  --_rp-button-border: var(--_rp-button-accent-border);
-  --_rp-button-border-hover: var(--_rp-button-accent-subtle-bg-hover);
-  --_rp-button-border-active: var(--_rp-button-accent-border-hover);
-  --_rp-button-fg: var(--_rp-button-accent-fg);
+.rp-button--surface[data-v-9f46a6a3] {
   --_rp-button-shadow: none;
   --_rp-button-shadow-hover: none;
   --_rp-button-shadow-active: none;
 }
-.rp-button--outline[data-v-7005752e] {
-  --_rp-button-bg: transparent;
-  --_rp-button-bg-hover: var(--_rp-button-accent-subtle-bg-hover);
-  --_rp-button-bg-active: var(--_rp-button-accent-subtle-bg-active);
-  --_rp-button-border: var(--_rp-button-accent-border);
-  --_rp-button-border-hover: var(--_rp-button-accent-border-hover);
-  --_rp-button-border-active: var(--_rp-button-accent-border-hover);
-  --_rp-button-fg: var(--_rp-button-accent-fg);
+.rp-button--outline[data-v-9f46a6a3] {
   --_rp-button-shadow: none;
   --_rp-button-shadow-hover: none;
   --_rp-button-shadow-active: none;
 }
-.rp-button--ghost[data-v-7005752e] {
-  --_rp-button-bg: transparent;
-  --_rp-button-bg-hover: var(--_rp-button-accent-subtle-bg-hover);
-  --_rp-button-bg-active: var(--_rp-button-accent-subtle-bg-active);
-  --_rp-button-border: transparent;
-  --_rp-button-border-hover: transparent;
-  --_rp-button-border-active: transparent;
-  --_rp-button-fg: var(--_rp-button-accent-fg);
+.rp-button--ghost[data-v-9f46a6a3] {
   --_rp-button-shadow: none;
   --_rp-button-shadow-hover: none;
   --_rp-button-shadow-active: none;
 }
-.rp-button--plain[data-v-7005752e] {
-  --_rp-button-bg: transparent;
-  --_rp-button-bg-hover: transparent;
-  --_rp-button-bg-active: transparent;
-  --_rp-button-border: transparent;
-  --_rp-button-border-hover: transparent;
-  --_rp-button-border-active: transparent;
-  --_rp-button-fg: var(--_rp-button-accent-fg);
+.rp-button--plain[data-v-9f46a6a3] {
   --_rp-button-shadow: none;
   --_rp-button-shadow-hover: none;
   --_rp-button-shadow-active: none;
 }
-.rp-button[data-v-7005752e]:disabled {
+.rp-button[data-v-9f46a6a3]:disabled, .rp-button--disabled[data-v-9f46a6a3] {
   opacity: var(--rp-opacity-disabled);
   cursor: not-allowed;
   box-shadow: none;
   transform: none;
 }
-.rp-button[data-v-7005752e]:focus-visible {
+.rp-button[data-v-9f46a6a3]:focus-visible {
   outline: none;
-  border-color: var(--rp-color-primary);
+  border-color: var(--rp-color-control-border-focus);
   box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
 }
-.rp-button--loading .rp-button__content[data-v-7005752e] {
-  visibility: hidden;
+.rp-button--loading .rp-button__content[data-v-9f46a6a3] {
+  opacity: 0;
 }
-.rp-button__content[data-v-7005752e] {
+.rp-button__content[data-v-9f46a6a3] {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: var(--rp-spacing-2);
 }
-.rp-button__left[data-v-7005752e], .rp-button__right[data-v-7005752e] {
+.rp-button__left[data-v-9f46a6a3], .rp-button__right[data-v-9f46a6a3] {
   display: inline-flex;
   align-items: center;
   flex-shrink: 0;
 }
-.rp-button__loading[data-v-7005752e] {
+.rp-button__loading[data-v-9f46a6a3] {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -325,47 +146,47 @@
   left: 50%;
   translate: -50% -50%;
 }
-.rp-button__spinner[data-v-7005752e] {
+.rp-button__spinner[data-v-9f46a6a3] {
   display: block;
   width: 1em;
   height: 1em;
   flex-shrink: 0;
   transform-origin: center;
-  animation: rp-spinner-spin-7005752e 700ms linear infinite;
+  animation: rp-spinner-spin-9f46a6a3 700ms linear infinite;
 }
-@keyframes rp-spinner-spin-7005752e {
+@keyframes rp-spinner-spin-9f46a6a3 {
 to {
     transform: rotate(360deg);
 }
-}.rp-icon-button[data-v-7005752e] {
+}.rp-icon-button[data-v-9f46a6a3] {
   width: var(--_rp-button-height);
   padding: 0;
 }
-.rp-icon-button__icon[data-v-7005752e] {
+.rp-icon-button__icon[data-v-9f46a6a3] {
   width: 1em;
   height: 1em;
   flex-shrink: 0;
 }
-.rp-icon-button__icon[data-v-7005752e] {
+.rp-icon-button__icon[data-v-9f46a6a3] {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   line-height: 0;
 }
-.rp-icon-button__icon[data-v-7005752e] >  svg {
+.rp-icon-button__icon[data-v-9f46a6a3] >  svg {
   display: block;
   width: 1em;
   height: 1em;
 }
-.rp-icon-button__spinner[data-v-7005752e] {
+.rp-icon-button__spinner[data-v-9f46a6a3] {
   display: block;
   width: 1em;
   height: 1em;
   flex-shrink: 0;
   transform-origin: center;
-  animation: rp-spinner-spin-7005752e 700ms linear infinite;
+  animation: rp-spinner-spin-9f46a6a3 700ms linear infinite;
 }
-@keyframes rp-spinner-spin-7005752e {
+@keyframes rp-spinner-spin-9f46a6a3 {
 to {
     transform: rotate(360deg);
 }