ropav 0.9.0 → 0.11.0

package/dist/components/color-slider/color-slider-output.js

@@ -1,5 +1,5 @@
-import { composeSlotClassName } from "../../utils/compose.js";
 import { dataAttr } from "../../utils/assertion.js";
+import { composeSlotClassName } from "../../utils/compose.js";
 import { useColorSliderContext } from "./color-slider.context.js";
 import { computed, createSlot, defineVaporComponent, renderEffect, setDynamicProps, setInsertionState, setText, template, toDisplayString, unref } from "vue";
 //#region src/components/color-slider/color-slider-output.vue?vue&type=script&setup=true&vapor=true&lang.ts

package/dist/components/color-slider/color-slider-thumb.js

@@ -1,5 +1,5 @@
-import { composeSlotClassName } from "../../utils/compose.js";
 import { dataAttr } from "../../utils/assertion.js";
+import { composeSlotClassName } from "../../utils/compose.js";
 import { useInteractionStates } from "../../composables/use-interaction-states.js";
 import { useColorSliderContext } from "./color-slider.context.js";
 import { child, computed, createSlot, createTemplateRefSetter, defineVaporComponent, on, renderEffect, setAttr, setClass, setDynamicProps, setInsertionState, setStyle, template, unref } from "vue";

package/dist/components/color-slider/color-slider-track.js

@@ -1,5 +1,5 @@
-import { composeSlotClassName } from "../../utils/compose.js";
 import { dataAttr } from "../../utils/assertion.js";
+import { composeSlotClassName } from "../../utils/compose.js";
 import { useColorSliderContext } from "./color-slider.context.js";
 import { computed, createSlot, defineVaporComponent, on, renderEffect, setDynamicProps, setInsertionState, setTemplateRefBinding, template, unref } from "vue";
 //#region src/components/color-slider/color-slider-track.vue?vue&type=script&setup=true&vapor=true&lang.ts

package/dist/components/color-swatch-picker/color-swatch-picker-indicator.js

@@ -1,5 +1,5 @@
 import { dataAttr } from "../../utils/assertion.js";
-import { useColorSwatchPickerContext, useColorSwatchPickerItemContext } from "./color-swatch-picker.context.js";
+import { useColorSwatchPickerItemContext } from "./color-swatch-picker.context.js";
 import { computed, createSlot, defineVaporComponent, renderEffect, setAttr, setClass, setInsertionState, template, unref } from "vue";
 //#region src/components/color-swatch-picker/color-swatch-picker-indicator.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<svg aria-hidden=true data-slot=color-swatch-picker-checkmark fill=none role=presentation stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=1.5 viewBox=\"0 0 12 12\"><polyline points=\"2.5 6 5 8.5 9.5 3\">", 2, 1);
@@ -9,7 +9,6 @@ var color_swatch_picker_indicator_vue_vue_type_script_setup_true_vapor_true_lang
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useColorSwatchPickerContext();
 		const item = useColorSwatchPickerItemContext();
 		/**
 		* Relative luminance, `(0.2126r + 0.7152g + 0.0722b) / 255`.
@@ -24,7 +23,7 @@ var color_swatch_picker_indicator_vue_vue_type_script_setup_true_vapor_true_lang
 		});
 		const n3 = t1();
 		renderEffect(() => {
-			setClass(n3, unref(slots).indicator({ class: props.class }));
+			setClass(n3, ["rp-color-swatch-picker__indicator", props.class]);
 			setAttr(n3, "data-light-color", unref(dataAttr)(isLightColor.value));
 		});
 		setInsertionState(n3);

package/dist/components/color-swatch-picker/color-swatch-picker-swatch.js

@@ -1,5 +1,5 @@
 import { useColorSwatch } from "../../composables/use-color-swatch.js";
-import { useColorSwatchPickerContext, useColorSwatchPickerItemContext } from "./color-swatch-picker.context.js";
+import { useColorSwatchPickerItemContext } from "./color-swatch-picker.context.js";
 import { computed, defineVaporComponent, renderEffect, setDynamicProps, template, unref } from "vue";
 //#region src/components/color-swatch-picker/color-swatch-picker-swatch.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<div>", 1);
@@ -15,7 +15,6 @@ var color_swatch_picker_swatch_vue_vue_type_script_setup_true_vapor_true_lang_de
 	},
 	setup(__props) {
 		const props = __props;
-		const { slots } = useColorSwatchPickerContext();
 		const item = useColorSwatchPickerItemContext();
 		const swatch = useColorSwatch({
 			ariaLabel: () => props.ariaLabel,
@@ -36,7 +35,7 @@ var color_swatch_picker_swatch_vue_vue_type_script_setup_true_vapor_true_lang_de
 		const style = computed(() => swatch.style.value);
 		const n0 = t0();
 		renderEffect(() => setDynamicProps(n0, [unref(swatch).attrs.value, {
-			class: unref(slots).swatch({ class: props.class }),
+			class: ["rp-color-swatch-picker__swatch", props.class],
 			"data-slot": "color-swatch-picker-swatch",
 			style: style.value
 		}]));

package/dist/components/disclosure/disclosure-body.js

@@ -1,21 +1,14 @@
-import { composeSlotClassName } from "../../utils/compose.js";
-import { useDisclosureContext } from "./disclosure.context.js";
-import { child, createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template, unref } from "vue";
+import { child, createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
 //#region src/components/disclosure/disclosure-body.vue?vue&type=script&setup=true&vapor=true&lang.ts
-var t0 = template("<div data-slot=disclosure-body><div>", 1);
+var t0 = template("<div class=rp-disclosure__body data-slot=disclosure-body><div>", 1);
 var disclosure_body_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
 	__name: "disclosure-body",
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useDisclosureContext();
 		const n2 = t0();
 		const n1 = child(n2);
-		renderEffect(() => {
-			const _slots = unref(slots);
-			setClass(n2, _slots.body());
-			setClass(n1, unref(composeSlotClassName)(_slots.bodyInner, props.class));
-		});
+		renderEffect(() => setClass(n1, ["rp-disclosure__body-inner", props.class]));
 		setInsertionState(n1);
 		createSlot();
 		return n2;

package/dist/components/disclosure/disclosure-content.js

@@ -1,5 +1,5 @@
-import { composeSlotClassName } from "../../utils/compose.js";
 import { dataAttr } from "../../utils/assertion.js";
+import { composeSlotClassName } from "../../utils/compose.js";
 import { useDisclosurePanel } from "../../composables/use-disclosure-panel.js";
 import { providePressResponder } from "../../composables/press-responder.js";
 import { useDisclosureContext } from "./disclosure.context.js";

package/dist/components/disclosure/disclosure-heading.js

@@ -1,6 +1,4 @@
-import { composeSlotClassName } from "../../utils/compose.js";
-import { useDisclosureContext } from "./disclosure.context.js";
-import { createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template, unref } from "vue";
+import { createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
 //#region src/components/disclosure/disclosure-heading.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<h3 data-slot=disclosure-heading>", 1);
 var disclosure_heading_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -8,9 +6,8 @@ var disclosure_heading_vue_vue_type_script_setup_true_vapor_true_lang_default =
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useDisclosureContext();
 		const n1 = t0();
-		renderEffect(() => setClass(n1, unref(composeSlotClassName)(unref(slots).heading, props.class)));
+		renderEffect(() => setClass(n1, ["rp-disclosure__heading", props.class]));
 		setInsertionState(n1);
 		createSlot();
 		return n1;

package/dist/components/disclosure/disclosure-indicator.js

@@ -1,6 +1,6 @@
-import { composeSlotClassName } from "../../utils/compose.js";
 import { dataAttr } from "../../utils/assertion.js";
 import icon_chevron_down_default from "../icons/icon-chevron-down.js";
+import { composeSlotClassName } from "../../utils/compose.js";
 import { useDisclosureContext } from "./disclosure.context.js";
 import { computed, createComponent, createIf, createSlot, defineVaporComponent, renderEffect, setAttr, setClass, setInsertionState, template, unref, useSlots } from "vue";
 //#region src/components/disclosure/disclosure-indicator.vue?vue&type=script&setup=true&vapor=true&lang.ts

package/dist/components/disclosure/disclosure-trigger.js

@@ -1,5 +1,5 @@
-import { composeSlotClassName } from "../../utils/compose.js";
 import { dataAttr } from "../../utils/assertion.js";
+import { composeSlotClassName } from "../../utils/compose.js";
 import { useInteractionStates } from "../../composables/use-interaction-states.js";
 import { useDisclosureContext } from "./disclosure.context.js";
 import { computed, createSlot, defineVaporComponent, on, renderEffect, setAttr, setClass, setInsertionState, setProp, setTemplateRefBinding, shallowRef, template, unref, watch } from "vue";

package/dist/components/disclosure/index.js

@@ -1,5 +1,5 @@
-import { useDisclosureContext } from "./disclosure.context.js";
 import disclosure_body_default from "./disclosure-body.js";
+import { useDisclosureContext } from "./disclosure.context.js";
 import disclosure_content_default from "./disclosure-content.js";
 import disclosure_heading_default from "./disclosure-heading.js";
 import disclosure_indicator_default from "./disclosure-indicator.js";

package/dist/components/drawer/drawer-body.js

@@ -1,5 +1,4 @@
-import { useDrawerContext } from "./drawer.context.js";
-import { computed, createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
+import { createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
 //#region src/components/drawer/drawer-body.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<div data-slot=drawer-body style=\"touch-action: pan-y\">", 1);
 var drawer_body_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -7,8 +6,6 @@ var drawer_body_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PU
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useDrawerContext();
-		const styles = computed(() => slots.value.body({ class: props.class }));
 		/**
 		* Vertical scrolling is opted back in here.
 		*
@@ -18,7 +15,7 @@ var drawer_body_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PU
 		* behaviour, not only of the styling.
 		*/
 		const n1 = t0();
-		renderEffect(() => setClass(n1, styles.value));
+		renderEffect(() => setClass(n1, ["rp-drawer__body", props.class]));
 		setInsertionState(n1);
 		createSlot();
 		return n1;

package/dist/components/drawer/drawer-footer.js

@@ -1,5 +1,4 @@
-import { useDrawerContext } from "./drawer.context.js";
-import { computed, createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
+import { createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
 //#region src/components/drawer/drawer-footer.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<div data-slot=drawer-footer>", 1);
 var drawer_footer_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -7,10 +6,8 @@ var drawer_footer_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useDrawerContext();
-		const styles = computed(() => slots.value.footer({ class: props.class }));
 		const n1 = t0();
-		renderEffect(() => setClass(n1, styles.value));
+		renderEffect(() => setClass(n1, ["rp-drawer__footer", props.class]));
 		setInsertionState(n1);
 		createSlot();
 		return n1;

package/dist/components/drawer/drawer-handle.js

@@ -1,5 +1,4 @@
-import { useDrawerContext } from "./drawer.context.js";
-import { computed, defineVaporComponent, renderEffect, setClass, template } from "vue";
+import { defineVaporComponent, renderEffect, setClass, template } from "vue";
 //#region src/components/drawer/drawer-handle.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<div aria-hidden=true data-slot=drawer-handle><div data-slot=drawer-handle-bar>", 1);
 var drawer_handle_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -7,8 +6,6 @@ var drawer_handle_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useDrawerContext();
-		const styles = computed(() => slots.value.handle({ class: props.class }));
 		/**
 		* No content slot, deliberately.
 		*
@@ -21,7 +18,7 @@ var drawer_handle_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
 		* announce.
 		*/
 		const n0 = t0();
-		renderEffect(() => setClass(n0, styles.value));
+		renderEffect(() => setClass(n0, ["rp-drawer__handle", props.class]));
 		return n0;
 	}
 });

package/dist/components/drawer/drawer-header.js

@@ -1,5 +1,4 @@
-import { useDrawerContext } from "./drawer.context.js";
-import { computed, createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
+import { createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
 //#region src/components/drawer/drawer-header.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<div data-slot=drawer-header>", 1);
 var drawer_header_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -7,10 +6,8 @@ var drawer_header_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useDrawerContext();
-		const styles = computed(() => slots.value.header({ class: props.class }));
 		const n1 = t0();
-		renderEffect(() => setClass(n1, styles.value));
+		renderEffect(() => setClass(n1, ["rp-drawer__header", props.class]));
 		setInsertionState(n1);
 		createSlot();
 		return n1;

package/dist/components/drawer/drawer-heading.js

@@ -1,5 +1,4 @@
 import { useFieldIdsContext } from "../../composables/use-field-ids.js";
-import { useDrawerContext } from "./drawer.context.js";
 import { computed, createDynamicComponent, createSlot, defineVaporComponent, extend, unref } from "vue";
 //#region src/components/drawer/drawer-heading.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var drawer_heading_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -10,7 +9,6 @@ var drawer_heading_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@_
 	},
 	setup(__props) {
 		const props = __props;
-		const { slots } = useDrawerContext();
 		const id = useFieldIdsContext()?.claimHeadingId();
 		/**
 		* Two by default.
@@ -19,10 +17,9 @@ var drawer_heading_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@_
 		* starts one level below the page title rather than continuing the page's outline.
 		*/
 		const tag = computed(() => `h${props.level ?? 2}`);
-		const styles = computed(() => slots.value.heading({ class: props.class }));
 		return createDynamicComponent(() => tag.value, {
 			id: () => unref(id),
-			class: () => styles.value,
+			class: () => ["rp-drawer__heading", props.class],
 			"data-slot": "drawer-heading"
 		}, extend(() => {
 			return createSlot("default", null, null, 4);

package/dist/components/drawer/drawer-trigger.js

@@ -2,7 +2,6 @@ import { dataAttr } from "../../utils/assertion.js";
 import { useInteractionStates } from "../../composables/use-interaction-states.js";
 import { composeFocusResponder, useFocusResponder } from "../../composables/focus-responder.js";
 import { composePressResponder, usePressResponder } from "../../composables/press-responder.js";
-import { useDrawerContext } from "./drawer.context.js";
 import { computed, createSlot, defineVaporComponent, on, renderEffect, setDynamicProps, setInsertionState, setTemplateRefBinding, template, unref } from "vue";
 //#region src/components/drawer/drawer-trigger.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<button>", 1);
@@ -14,10 +13,8 @@ var drawer_trigger_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@_
 	},
 	setup(__props) {
 		const props = __props;
-		const { slots } = useDrawerContext();
 		const responder = usePressResponder();
 		const focusResponder = useFocusResponder();
-		const styles = computed(() => slots.value.trigger({ class: props.class }));
 		const setElement = (element) => {
 			const next = element ?? null;
 			responder?.registerElement(next);
@@ -60,10 +57,10 @@ var drawer_trigger_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@_
 		});
 		const n1 = t0();
 		renderEffect(() => {
-			const _dataAttr = unref(dataAttr);
 			const _props = props;
+			const _dataAttr = unref(dataAttr);
 			setDynamicProps(n1, [{
-				class: styles.value,
+				class: ["rp-drawer__trigger", _props.class],
 				"data-disabled": _dataAttr(_props.isDisabled),
 				"data-focus-visible": _dataAttr(unref(isFocusVisible)),
 				"data-focused": _dataAttr(unref(isFocused)),

package/dist/components/drop-zone/drop-zone-root.js

@@ -5,7 +5,6 @@ import { isVirtualDragging } from "../../composables/drag-manager.js";
 import { useDrop } from "../../composables/use-drop.js";
 import { isDirectoryDropItem, isFileDropItem } from "../../utils/dnd-types.js";
 import { isDragRefused, isFileAccepted, parseAccept } from "./drop-zone.accept.js";
-import { provideDropZoneContext } from "./drop-zone.context.js";
 import { child, computed, createSlot, createTemplateRefSetter, defineVaporComponent, on, renderEffect, setAttr, setClass, setInsertionState, setProp, setStyle, setTemplateRefBinding, shallowRef, template, unref } from "vue";
 import { dropZoneVariants } from "@ropav/styles";
 //#region src/components/drop-zone/drop-zone-root.vue?vue&type=script&setup=true&vapor=true&lang.ts
@@ -104,7 +103,6 @@ var drop_zone_root_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@_
 			return ids.length > 0 ? ids.join(" ") : void 0;
 		});
 		const styles = computed(() => dropZoneVariants());
-		provideDropZoneContext({ slots: styles });
 		const _setTemplateRef = createTemplateRefSetter();
 		const n3 = t0();
 		const n1 = child(n3);

package/dist/components/drop-zone/drop-zone-trigger.js

@@ -1,6 +1,4 @@
-import { composeSlotClassName } from "../../utils/compose.js";
-import { useDropZoneContext } from "./drop-zone.context.js";
-import { createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template, unref } from "vue";
+import { createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
 //#region src/components/drop-zone/drop-zone-trigger.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<span data-slot=drop-zone-trigger>", 1);
 var drop_zone_trigger_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -8,9 +6,8 @@ var drop_zone_trigger_vue_vue_type_script_setup_true_vapor_true_lang_default = /
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useDropZoneContext();
 		const n1 = t0();
-		renderEffect(() => setClass(n1, unref(composeSlotClassName)(unref(slots).trigger, props.class)));
+		renderEffect(() => setClass(n1, ["rp-drop-zone__trigger", props.class]));
 		setInsertionState(n1);
 		createSlot();
 		return n1;

package/dist/components/drop-zone/index.d.ts

@@ -2,7 +2,5 @@ import DropZoneRoot from "./drop-zone-root.js";
 import DropZoneTrigger from "./drop-zone-trigger.js";
 export { DropZoneRoot as DropZone, DropZoneTrigger };
 export type { DropZoneRootProps as DropZoneProps, DropZoneSlotProps, DropZoneStatus, DropZoneTriggerProps, } from "./drop-zone.types.js";
-export { useDropZoneContext, provideDropZoneContext } from "./drop-zone.context.js";
-export type { DropZoneContext } from "./drop-zone.context.js";
 export { dropZoneVariants } from "@ropav/styles";
 export type { DropZoneVariants } from "@ropav/styles";

package/dist/components/drop-zone/index.js

@@ -1,5 +1,4 @@
-import { provideDropZoneContext, useDropZoneContext } from "./drop-zone.context.js";
 import drop_zone_root_default from "./drop-zone-root.js";
 import drop_zone_trigger_default from "./drop-zone-trigger.js";
 import { dropZoneVariants } from "@ropav/styles";
-export { drop_zone_root_default as DropZone, drop_zone_trigger_default as DropZoneTrigger, dropZoneVariants, provideDropZoneContext, useDropZoneContext };
+export { drop_zone_root_default as DropZone, drop_zone_trigger_default as DropZoneTrigger, dropZoneVariants };

package/dist/components/dropdown/dropdown-menu.js

@@ -1,6 +1,6 @@
 import { provideSeparatorContext } from "../separator/separator.context.js";
 import { useMenu } from "../../composables/use-menu.js";
-import { useDropdownContext, useDropdownPopoverTarget } from "./dropdown.context.js";
+import { useDropdownPopoverTarget } from "./dropdown.context.js";
 import { computed, createIf, createSlot, defineVaporComponent, on, renderEffect, setDynamicProps, setInsertionState, setTemplateRefBinding, template, unref, useSlots } from "vue";
 //#region src/components/dropdown/dropdown-menu.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<div>");
@@ -34,9 +34,7 @@ var dropdown_menu_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
 		const props = __props;
 		const emit = __emit;
 		const callerSlots = useSlots();
-		const { slots } = useDropdownContext();
 		const target = useDropdownPopoverTarget();
-		const styles = computed(() => slots.value.menu({ class: props.class }));
 		provideSeparatorContext({ elementType: "div" });
 		const menu = useMenu({
 			autoFocus: target.autoFocus,
@@ -62,11 +60,14 @@ var dropdown_menu_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
 		};
 		const hasEmptySlot = computed(() => Boolean(callerSlots["empty"]));
 		const n5 = t1();
-		renderEffect(() => setDynamicProps(n5, [{
-			class: styles.value,
-			"data-selection-mode": props.selectionMode,
-			"data-slot": "dropdown-menu"
-		}, unref(menu).menuAttributes.value]));
+		renderEffect(() => {
+			const _props = props;
+			setDynamicProps(n5, [{
+				class: ["rp-menu rp-dropdown__menu", _props.class],
+				"data-selection-mode": _props.selectionMode,
+				"data-slot": "dropdown-menu"
+			}, unref(menu).menuAttributes.value]);
+		});
 		setInsertionState(n5);
 		createIf(() => hasEmptySlot.value && unref(menu).isEmpty.value, () => {
 			const n3 = t0();

package/dist/components/dropdown/dropdown-popover.js

@@ -1,7 +1,6 @@
 import { createOverlaySlotContexts, provideOverlaySlotContexts } from "../overlay/overlay-slots.js";
 import overlay_popover_default from "../overlay/overlay-popover.js";
-import { useDropdownContext } from "./dropdown.context.js";
-import { computed, createComponent, createSlot, defineVaporComponent, extend, unref } from "vue";
+import { createComponent, createSlot, defineVaporComponent, extend, normalizeClass, unref } from "vue";
 //#region src/components/dropdown/dropdown-popover.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var dropdown_popover_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
 	__name: "dropdown-popover",
@@ -23,7 +22,6 @@ var dropdown_popover_vue_vue_type_script_setup_true_vapor_true_lang_default = /*
 	},
 	setup(__props) {
 		const props = __props;
-		const { slots } = useDropdownContext();
 		/**
 		* Owned here rather than by the overlay itself.
 		*
@@ -34,10 +32,9 @@ var dropdown_popover_vue_vue_type_script_setup_true_vapor_true_lang_default = /*
 		*/
 		const contexts = createOverlaySlotContexts();
 		provideOverlaySlotContexts(contexts);
-		const styles = computed(() => slots.value.popover({ class: props.class }));
 		return createComponent(unref(overlay_popover_default), {
 			"arrow-boundary-offset": () => props.arrowBoundaryOffset,
-			class: () => styles.value,
+			class: () => normalizeClass(["rp-dropdown__popover", props.class]),
 			"container-padding": () => props.containerPadding,
 			"cross-offset": () => props.crossOffset,
 			"data-slot": "dropdown-popover",

package/dist/components/dropdown/dropdown-trigger.js

@@ -1,6 +1,6 @@
 import { dataAttr } from "../../utils/assertion.js";
+import { useInteractionStates } from "../../composables/use-interaction-states.js";
 import { composePressResponder, usePressResponder } from "../../composables/press-responder.js";
-import { useDropdownContext } from "./dropdown.context.js";
 import { computed, createSlot, defineVaporComponent, on, renderEffect, setDynamicProps, setInsertionState, setTemplateRefBinding, template, unref } from "vue";
 //#region src/components/dropdown/dropdown-trigger.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<button>", 1);
@@ -8,32 +8,51 @@ var dropdown_trigger_vue_vue_type_script_setup_true_vapor_true_lang_default = /*
 	__name: "dropdown-trigger",
 	props: {
 		class: {},
+		isDisabled: {
+			type: Boolean,
+			default: void 0
+		},
 		type: { default: "button" }
 	},
 	setup(__props) {
 		const props = __props;
-		const { slots } = useDropdownContext();
 		const responder = usePressResponder();
-		const styles = computed(() => slots.value.trigger({ class: props.class }));
 		const setElement = (element) => {
 			responder?.registerElement(element ?? null);
 		};
-		const press = composePressResponder(responder);
+		const resolvedIsDisabled = computed(() => props.isDisabled ?? responder?.isDisabled?.value);
+		const { isFocusVisible, isFocused, isHovered, isPressed, onBlur, onFocus, onPointerdown, onPointerenter, onPointerleave } = useInteractionStates({ isDisabled: () => resolvedIsDisabled.value });
+		const tabindex = computed(() => resolvedIsDisabled.value ? void 0 : 0);
+		const press = composePressResponder(responder, {
+			onPointerdown,
+			onPointerenter,
+			onPointerleave
+		});
 		const n1 = t0();
 		renderEffect(() => {
+			const _props = props;
+			const _dataAttr = unref(dataAttr);
+			const _resolvedIsDisabled = resolvedIsDisabled.value;
 			const _responder = unref(responder);
 			setDynamicProps(n1, [{
-				class: styles.value,
-				"data-pressed": unref(dataAttr)(_responder?.isPressed.value),
+				class: ["rp-dropdown__trigger", _props.class],
+				"data-disabled": _dataAttr(_resolvedIsDisabled),
+				"data-focus-visible": _dataAttr(unref(isFocusVisible)),
+				"data-focused": _dataAttr(unref(isFocused)),
+				"data-hovered": _dataAttr(unref(isHovered)),
+				"data-pressed": _dataAttr(unref(isPressed) || _responder?.isPressed.value),
 				"data-slot": "dropdown-trigger",
-				tabindex: "0",
-				type: props.type
+				disabled: _resolvedIsDisabled || void 0,
+				tabindex: tabindex.value,
+				type: _props.type
 			}, _responder?.attrs.value]);
 		});
 		setInsertionState(n1);
 		createSlot();
+		on(n1, "blur", (e) => unref(onBlur)(e));
 		on(n1, "click", (e) => unref(press).onClick(e));
 		on(n1, "dragstart", (e) => unref(press).onDragstart(e));
+		on(n1, "focus", (e) => unref(onFocus)(e));
 		on(n1, "keydown", (e) => unref(press).onKeydown(e));
 		on(n1, "mousedown", (e) => unref(press).onMousedown(e));
 		on(n1, "pointerdown", (e) => unref(press).onPointerdown(e));

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

@@ -15,6 +15,8 @@ export interface DropdownRootEmits {
 }
 export interface DropdownTriggerProps {
     class?: string;
+    /** Disables the trigger. Falls back to the state the dropdown root supplies. */
+    isDisabled?: boolean;
     /** Native button type. @default "button" */
     type?: "button" | "reset" | "submit";
 }

package/dist/components/index.d.ts

@@ -3,6 +3,7 @@ export * from "./alert/index.js";
 export * from "./alert-dialog/index.js";
 export * from "./autocomplete/index.js";
 export * from "./avatar/index.js";
+export * from "./avatar-group/index.js";
 export * from "./badge/index.js";
 export * from "./breadcrumbs/index.js";
 export * from "./button/index.js";

package/dist/components/input-group/index.d.ts

@@ -5,7 +5,5 @@ import InputGroupSuffix from "./input-group-suffix.js";
 import InputGroupTextArea from "./input-group-textarea.js";
 export { InputGroupInput, InputGroupPrefix, InputGroupRoot as InputGroup, InputGroupSuffix, InputGroupTextArea, };
 export type { InputGroupRootProps as InputGroupProps, InputGroupRootSlotProps as InputGroupSlotProps, InputGroupInputProps, InputGroupTextAreaProps, InputGroupPrefixProps, InputGroupSuffixProps, } from "./input-group.types.js";
-export { provideInputGroupContext, useInputGroupContext } from "./input-group.context.js";
-export type { InputGroupContext } from "./input-group.context.js";
 export { inputGroupVariants } from "@ropav/styles";
 export type { InputGroupVariants } from "@ropav/styles";

package/dist/components/input-group/index.js

@@ -1,8 +1,7 @@
-import { provideInputGroupContext, useInputGroupContext } from "./input-group.context.js";
 import input_group_input_default from "./input-group-input.js";
 import input_group_prefix_default from "./input-group-prefix.js";
 import input_group_root_default from "./input-group-root.js";
 import input_group_suffix_default from "./input-group-suffix.js";
 import input_group_textarea_default from "./input-group-textarea.js";
 import { inputGroupVariants } from "@ropav/styles";
-export { input_group_root_default as InputGroup, input_group_input_default as InputGroupInput, input_group_prefix_default as InputGroupPrefix, input_group_suffix_default as InputGroupSuffix, input_group_textarea_default as InputGroupTextArea, inputGroupVariants, provideInputGroupContext, useInputGroupContext };
+export { input_group_root_default as InputGroup, input_group_input_default as InputGroupInput, input_group_prefix_default as InputGroupPrefix, input_group_suffix_default as InputGroupSuffix, input_group_textarea_default as InputGroupTextArea, inputGroupVariants };

package/dist/components/input-group/input-group-input.js

@@ -2,7 +2,6 @@ import { dataAttr } from "../../utils/assertion.js";
 import { useInteractionStates } from "../../composables/use-interaction-states.js";
 import { setFormValue } from "../../utils/form-value.js";
 import { useTextFieldControlContext } from "../../composables/use-text-field.js";
-import { useInputGroupContext } from "./input-group.context.js";
 import { computed, createTemplateRefSetter, defineVaporComponent, on, renderEffect, setDynamicProps, shallowRef, template, unref, watch } from "vue";
 //#region src/components/input-group/input-group-input.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<input>", 1);
@@ -17,14 +16,12 @@ var input_group_input_vue_vue_type_script_setup_true_vapor_true_lang_default = /
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
-		const { slots } = useInputGroupContext();
 		const control = useTextFieldControlContext();
 		const element = shallowRef(null);
 		const setElement = (next) => {
 			element.value = next instanceof HTMLInputElement ? next : null;
 			control?.registerElement(element.value);
 		};
-		const styles = computed(() => slots.value.input({ class: props.class }));
 		const attrs = computed(() => {
 			const merged = { ...control?.attrs.value };
 			if (props.placeholder !== void 0) merged["placeholder"] = props.placeholder;
@@ -86,7 +83,7 @@ var input_group_input_vue_vue_type_script_setup_true_vapor_true_lang_default = /
 			const _control = unref(control);
 			const _interaction = unref(interaction);
 			setDynamicProps(n0, [{
-				class: styles.value,
+				class: ["rp-input-group__input", props.class],
 				"data-disabled": _dataAttr(_control?.isDisabled.value),
 				"data-focus-visible": _dataAttr(_interaction.isFocusVisible.value),
 				"data-focused": _dataAttr(_interaction.isFocused.value),

package/dist/components/input-group/input-group-prefix.js

@@ -1,5 +1,4 @@
-import { useInputGroupContext } from "./input-group.context.js";
-import { computed, createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
+import { createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
 //#region src/components/input-group/input-group-prefix.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<div data-slot=input-group-prefix>", 1);
 var input_group_prefix_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -7,10 +6,8 @@ var input_group_prefix_vue_vue_type_script_setup_true_vapor_true_lang_default =
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useInputGroupContext();
-		const styles = computed(() => slots.value.prefix({ class: props.class }));
 		const n1 = t0();
-		renderEffect(() => setClass(n1, styles.value));
+		renderEffect(() => setClass(n1, ["rp-input-group__prefix", props.class]));
 		setInsertionState(n1);
 		createSlot();
 		return n1;

package/dist/components/input-group/input-group-root.js

@@ -2,7 +2,6 @@ import { dataAttr } from "../../utils/assertion.js";
 import { useFocusWithin, useInteractionStates } from "../../composables/use-interaction-states.js";
 import { useTextFieldControlContext } from "../../composables/use-text-field.js";
 import { useTextFieldContext } from "../textfield/textfield.context.js";
-import { provideInputGroupContext } from "./input-group.context.js";
 import { computed, createSlot, defineVaporComponent, on, renderEffect, setAttr, setClass, setInsertionState, setProp, setTemplateRefBinding, shallowRef, template, unref } from "vue";
 import { inputGroupVariants } from "@ropav/styles";
 //#region src/components/input-group/input-group-root.vue?vue&type=script&setup=true&vapor=true&lang.ts
@@ -47,7 +46,6 @@ var input_group_root_vue_vue_type_script_setup_true_vapor_true_lang_default = /*
 			size: resolvedSize.value,
 			variant: resolvedVariant.value
 		}));
-		provideInputGroupContext({ slots });
 		const styles = computed(() => slots.value.base({ class: props.class }));
 		const interaction = useInteractionStates({ isDisabled: resolvedIsDisabled });
 		const focusWithin = useFocusWithin();

package/dist/components/input-group/input-group-suffix.js

@@ -1,5 +1,4 @@
-import { useInputGroupContext } from "./input-group.context.js";
-import { computed, createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
+import { createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
 //#region src/components/input-group/input-group-suffix.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<div data-slot=input-group-suffix>", 1);
 var input_group_suffix_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -7,10 +6,8 @@ var input_group_suffix_vue_vue_type_script_setup_true_vapor_true_lang_default =
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useInputGroupContext();
-		const styles = computed(() => slots.value.suffix({ class: props.class }));
 		const n1 = t0();
-		renderEffect(() => setClass(n1, styles.value));
+		renderEffect(() => setClass(n1, ["rp-input-group__suffix", props.class]));
 		setInsertionState(n1);
 		createSlot();
 		return n1;