ropav 0.0.8 → 0.0.9

package/dist/field.js

@@ -21,14 +21,12 @@ function useField(props) {
 	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,
@@ -54,9 +52,7 @@ function useField(props) {
 		controlId,
 		labelId,
 		descriptionId,
-		messageId,
 		isInvalid,
-		messageText,
 		hasLabel,
 		hasDescription,
 		hasMessage,
@@ -70,11 +66,10 @@ function useField(props) {
 //#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-0d027ead class=rp-field__required aria-hidden=true>*", 2);
-var t2 = template("<label data-v-0d027ead class=rp-field__label>");
-var t3 = template("<p data-v-0d027ead class=rp-field__description>");
-var t4 = template("<p data-v-0d027ead class=rp-field__message>");
-var t5 = template("<div data-v-0d027ead><div data-v-0d027ead 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
@@ -85,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
@@ -101,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, focusControl } = 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(() => {
@@ -135,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)));
@@ -147,23 +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-0d027ead"]]);
+}), [["__scopeId", "data-v-f9e37351"]]);
 //#endregion
 export { field_default as t };

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);
 }

package/dist/icon-button.js

@@ -1,12 +1,11 @@
 import './icon-button.css';
 import { t as bem } from "./bem.js";
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
-import { r as isComponentPresetColor } from "./componentColors.js";
 import { n as loader_circle_default, t as getButtonColorStyle } from "./useButtonColor.js";
 import { computed, createComponent, createIf, createSlot, defineVaporComponent, renderEffect, setAttr, setClass, setInsertionState, setProp, setStyle, template, unref } from "vue";
 //#region src/components/icon-button/icon-button.vue?vue&type=script&setup=true&vapor=true&lang.ts
-var t0 = template("<span data-v-7005752e class=rp-icon-button__icon aria-hidden=true>");
-var t1 = template("<button data-v-7005752e>", 1);
+var t0 = template("<span data-v-9f46a6a3 class=rp-icon-button__icon aria-hidden=true>");
+var t1 = template("<button data-v-9f46a6a3>", 1);
 //#endregion
 //#region src/components/icon-button/icon-button.vue
 var icon_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
@@ -16,6 +15,7 @@ var icon_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__
 		ariaLabel: {},
 		variant: {},
 		color: {},
+		autoContrast: { type: Boolean },
 		size: {},
 		radius: {},
 		type: { default: "button" },
@@ -32,11 +32,10 @@ var icon_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__
 		const props = __props;
 		const rootClass = computed(() => [...bem("rp-button", {
 			[props.variant ?? ""]: Boolean(props.variant),
-			[`color-${props.color}`]: isComponentPresetColor(props.color),
 			[`size-${props.size}`]: Boolean(props.size),
 			[`radius-${props.radius}`]: Boolean(props.radius)
 		}), "rp-icon-button"]);
-		const rootStyle = computed(() => getButtonColorStyle(props.color));
+		const rootStyle = computed(() => getButtonColorStyle(props.color, props.variant, props.autoContrast));
 		const n6 = t1();
 		renderEffect(() => {
 			const _loading = __props.loading;
@@ -61,6 +60,6 @@ var icon_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__
 		}, 261);
 		return n6;
 	}
-}), [["__scopeId", "data-v-7005752e"]]);
+}), [["__scopeId", "data-v-9f46a6a3"]]);
 //#endregion
 export { icon_button_default as t };

package/dist/index.d.ts

@@ -1,15 +1,23 @@
+export * from './components/alert';
 export * from './components/accordion';
+export * from './components/aspect-ratio';
+export * from './components/avatar';
 export * from './components/badge';
 export * from './components/button';
+export * from './components/button-link';
 export * from './components/button-group';
 export * from './components/card';
 export * from './components/checkbox';
 export * from './components/collapse';
+export * from './components/color-input';
+export * from './components/color-picker';
+export * from './components/color-swatch';
 export * from './components/dropdown-menu';
 export * from './components/field';
 export * from './components/icon-button';
 export * from './components/input';
 export * from './components/modal';
+export * from './components/number-input';
 export * from './components/overlay';
 export * from './components/popover';
 export * from './components/progress';

package/dist/index.js

@@ -1,27 +1,39 @@
+import { i as alert_default, n as alertRadiuses, r as alertVariants, t as alertColors } from "./alert.js";
 import { t as useCollapse } from "./useCollapse.js";
 import { i as useAccordionItem, n as accordion_default, r as useAccordion, t as accordion_item_default } from "./accordion.js";
+import { t as aspect_ratio_default } from "./aspect-ratio.js";
+import { a as avatar_default, i as avatarVariants, n as avatarRadiuses, r as avatarSizes, t as avatarColors } from "./avatar.js";
 import { a as badge_default, i as badgeVariants, n as badgeRadiuses, r as badgeSizes, t as badgeColors } from "./badge.js";
 import { t as button_default } from "./button.js";
+import { t as button_link_default } from "./button-link.js";
 import { t as button_group_default } from "./button-group.js";
 import { t as card_default } from "./card.js";
 import { t as checkbox_default } from "./checkbox.js";
 import { t as collapse_default } from "./collapse.js";
+import { t as color_input_default } from "./color-input.js";
+import { t as color_swatch_default } from "./color-swatch.js";
+import { t as color_picker_default } from "./color-picker.js";
+import { t as input_default } from "./input.js";
+import { t as popover_default } from "./popover.js";
+import { n as colorPickerSizes, t as colorPickerFormats } from "./color-picker2.js";
+import "./components/color-swatch/index.js";
 import { n as useDropdownMenu, t as dropdown_menu_default } from "./dropdown-menu.js";
 import { t as field_default } from "./field.js";
 import { t as icon_button_default } from "./icon-button.js";
 import "./components/icon-button/index.js";
-import { t as input_default } from "./input.js";
+import "./components/input/index.js";
 import { t as overlay_default } from "./overlay.js";
 import { t as modal_default } from "./modal.js";
+import { t as number_input_default } from "./number-input.js";
 import "./components/overlay/index.js";
-import { t as popover_default } from "./popover.js";
+import { t as popoverPlacements } from "./popover2.js";
 import { i as progress_default, n as progressRadiuses, r as progressSizes, t as progressColors } from "./progress.js";
 import { n as radio_default, t as radio_group_default } from "./radio.js";
 import { t as select_default } from "./select.js";
 import { t as tooltip_default } from "./tooltip.js";
-import { i as sliderSizes, n as sliderColors, r as sliderOrientations, t as slider_default } from "./slider.js";
+import { a as slider_default, i as range_slider_default, n as sliderOrientations, r as sliderSizes, t as sliderColors } from "./slider.js";
 import { t as switch_default } from "./switch.js";
 import { a as useTabs, c as useTabsTrigger, i as tabs_default, n as tabs_list_default, o as useTabsContent, r as tabs_content_default, s as useTabsList, t as tabs_trigger_default } from "./tabs.js";
 import { t as textarea_default } from "./textarea.js";
 import "./components/tooltip/index.js";
-export { accordion_default as Accordion, accordion_item_default as AccordionItem, badge_default as Badge, button_default as Button, button_group_default as ButtonGroup, card_default as Card, checkbox_default as Checkbox, collapse_default as Collapse, dropdown_menu_default as DropdownMenu, field_default as Field, icon_button_default as IconButton, input_default as Input, modal_default as Modal, overlay_default as Overlay, popover_default as Popover, progress_default as Progress, radio_default as Radio, radio_group_default as RadioGroup, select_default as Select, slider_default as Slider, switch_default as Switch, tabs_default as Tabs, tabs_content_default as TabsContent, tabs_list_default as TabsList, tabs_trigger_default as TabsTrigger, textarea_default as Textarea, tooltip_default as Tooltip, badgeColors, badgeRadiuses, badgeSizes, badgeVariants, progressColors, progressRadiuses, progressSizes, sliderColors, sliderOrientations, sliderSizes, useAccordion, useAccordionItem, useCollapse, useDropdownMenu, useTabs, useTabsContent, useTabsList, useTabsTrigger };
+export { accordion_default as Accordion, accordion_item_default as AccordionItem, alert_default as Alert, aspect_ratio_default as AspectRatio, avatar_default as Avatar, badge_default as Badge, button_default as Button, button_group_default as ButtonGroup, button_link_default as ButtonLink, card_default as Card, checkbox_default as Checkbox, collapse_default as Collapse, color_input_default as ColorInput, color_picker_default as ColorPicker, color_swatch_default as ColorSwatch, dropdown_menu_default as DropdownMenu, field_default as Field, icon_button_default as IconButton, input_default as Input, modal_default as Modal, number_input_default as NumberInput, overlay_default as Overlay, popover_default as Popover, progress_default as Progress, radio_default as Radio, radio_group_default as RadioGroup, range_slider_default as RangeSlider, select_default as Select, slider_default as Slider, switch_default as Switch, tabs_default as Tabs, tabs_content_default as TabsContent, tabs_list_default as TabsList, tabs_trigger_default as TabsTrigger, textarea_default as Textarea, tooltip_default as Tooltip, alertColors, alertRadiuses, alertVariants, avatarColors, avatarRadiuses, avatarSizes, avatarVariants, badgeColors, badgeRadiuses, badgeSizes, badgeVariants, colorPickerFormats, colorPickerSizes, popoverPlacements, progressColors, progressRadiuses, progressSizes, sliderColors, sliderOrientations, sliderSizes, useAccordion, useAccordionItem, useCollapse, useDropdownMenu, useTabs, useTabsContent, useTabsList, useTabsTrigger };