ropav 0.8.1 → 0.10.0

package/dist/components/meter/meter-track.js

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

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

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

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

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

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

@@ -1,5 +1,4 @@
 import { useFieldIdsContext } from "../../composables/use-field-ids.js";
-import { useModalContext } from "./modal.context.js";
 import { computed, createDynamicComponent, createSlot, defineVaporComponent, extend, unref } from "vue";
 //#region src/components/modal/modal-heading.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var modal_heading_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -10,7 +9,6 @@ var modal_heading_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
 	},
 	setup(__props) {
 		const props = __props;
-		const { slots } = useModalContext();
 		const id = useFieldIdsContext()?.claimHeadingId();
 		/**
 		* Two by default.
@@ -19,10 +17,9 @@ var modal_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-modal__heading", props.class],
 			"data-slot": "modal-heading"
 		}, extend(() => {
 			return createSlot("default", null, null, 4);

package/dist/components/modal/modal-icon.js

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

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

@@ -1,8 +1,7 @@
 import { dataAttr } from "../../utils/assertion.js";
 import { useInteractionStates } from "../../composables/use-interaction-states.js";
 import { composePressResponder, usePressResponder } from "../../composables/press-responder.js";
-import { useModalContext } from "./modal.context.js";
-import { computed, createSlot, defineVaporComponent, on, renderEffect, setDynamicProps, setInsertionState, setTemplateRefBinding, template, unref } from "vue";
+import { createSlot, defineVaporComponent, on, renderEffect, setDynamicProps, setInsertionState, setTemplateRefBinding, template, unref } from "vue";
 //#region src/components/modal/modal-trigger.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<div>", 1);
 var modal_trigger_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -10,9 +9,7 @@ var modal_trigger_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useModalContext();
 		const responder = usePressResponder();
-		const styles = computed(() => slots.value.trigger({ class: props.class }));
 		const setElement = (element) => {
 			responder?.registerElement(element ?? null);
 		};
@@ -23,7 +20,7 @@ var modal_trigger_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
 			const _dataAttr = unref(dataAttr);
 			const _responder = unref(responder);
 			setDynamicProps(n1, [{
-				class: styles.value,
+				class: ["rp-modal__trigger", props.class],
 				"data-focus-visible": _dataAttr(unref(isFocusVisible)),
 				"data-pressed": _dataAttr(_responder?.isPressed.value),
 				"data-slot": "modal-trigger",

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

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

package/dist/components/pagination/pagination-ellipsis.js

@@ -1,6 +1,4 @@
-import { composeSlotClassName } from "../../utils/compose.js";
-import { usePaginationContext } from "./pagination.context.js";
-import { defineVaporComponent, renderEffect, setClass, template, unref } from "vue";
+import { defineVaporComponent, renderEffect, setClass, template } from "vue";
 //#region src/components/pagination/pagination-ellipsis.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<span aria-hidden=true data-slot=pagination-ellipsis>…", 1);
 var pagination_ellipsis_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -8,9 +6,8 @@ var pagination_ellipsis_vue_vue_type_script_setup_true_vapor_true_lang_default =
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = usePaginationContext();
 		const n0 = t0();
-		renderEffect(() => setClass(n0, unref(composeSlotClassName)(unref(slots).ellipsis, props.class)));
+		renderEffect(() => setClass(n0, ["rp-pagination__ellipsis", props.class]));
 		return n0;
 	}
 });

package/dist/components/pagination/pagination-item.js

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

package/dist/components/pagination/pagination-summary.js

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

package/dist/components/popover/index.d.ts

@@ -6,7 +6,5 @@ import PopoverRoot from "./popover-root.js";
 import PopoverTrigger from "./popover-trigger.js";
 export { PopoverArrow, PopoverContent, PopoverDialog, PopoverHeading, PopoverRoot as Popover, PopoverTrigger, };
 export type { PopoverArrowProps, PopoverContentProps, PopoverDialogProps, PopoverDialogSlotProps, PopoverHeadingProps, PopoverRootEmits as PopoverEmits, PopoverRootProps as PopoverProps, PopoverTriggerProps, } from "./popover.types.js";
-export { usePopoverContext } from "./popover.context.js";
-export type { PopoverContext } from "./popover.context.js";
 export { popoverVariants } from "@ropav/styles";
 export type { PopoverVariants } from "@ropav/styles";

package/dist/components/popover/index.js

@@ -1,9 +1,8 @@
 import popover_arrow_default from "./popover-arrow.js";
-import { usePopoverContext } from "./popover.context.js";
 import popover_content_default from "./popover-content.js";
 import popover_dialog_default from "./popover-dialog.js";
 import popover_heading_default from "./popover-heading.js";
 import popover_root_default from "./popover-root.js";
 import popover_trigger_default from "./popover-trigger.js";
 import { popoverVariants } from "@ropav/styles";
-export { popover_root_default as Popover, popover_arrow_default as PopoverArrow, popover_content_default as PopoverContent, popover_dialog_default as PopoverDialog, popover_heading_default as PopoverHeading, popover_trigger_default as PopoverTrigger, popoverVariants, usePopoverContext };
+export { popover_root_default as Popover, popover_arrow_default as PopoverArrow, popover_content_default as PopoverContent, popover_dialog_default as PopoverDialog, popover_heading_default as PopoverHeading, popover_trigger_default as PopoverTrigger, popoverVariants };

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

@@ -1,7 +1,6 @@
 import { createOverlaySlotContexts, provideOverlaySlotContexts } from "../overlay/overlay-slots.js";
 import overlay_popover_default from "../overlay/overlay-popover.js";
-import { usePopoverContext } from "./popover.context.js";
-import { computed, createComponent, createSlot, defineVaporComponent, extend, unref } from "vue";
+import { createComponent, createSlot, defineVaporComponent, extend, normalizeClass, unref } from "vue";
 //#region src/components/popover/popover-content.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var popover_content_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
 	__name: "popover-content",
@@ -39,7 +38,6 @@ var popover_content_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@
 	},
 	setup(__props) {
 		const props = __props;
-		const { slots } = usePopoverContext();
 		/**
 		* Owned here rather than by the overlay itself.
 		*
@@ -50,10 +48,9 @@ var popover_content_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@
 		*/
 		const contexts = createOverlaySlotContexts();
 		provideOverlaySlotContexts(contexts);
-		const styles = computed(() => slots.value.base({ class: props.class }));
 		return createComponent(unref(overlay_popover_default), {
 			"arrow-boundary-offset": () => props.arrowBoundaryOffset,
-			class: () => styles.value,
+			class: () => normalizeClass(["rp-popover", props.class]),
 			"container-padding": () => props.containerPadding,
 			"cross-offset": () => props.crossOffset,
 			"is-entering": () => props.isEntering,

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

@@ -1,6 +1,5 @@
 import { useOverlayScopeContext, useOverlayTargetContext } from "../overlay/overlay.context.js";
 import { provideFieldIdsContext, useFieldIds } from "../../composables/use-field-ids.js";
-import { usePopoverContext } from "./popover.context.js";
 import { computed, createSlot, defineVaporComponent, onScopeDispose, renderEffect, setAttr, setClass, setInsertionState, setProp, setTemplateRefBinding, shallowRef, template, unref, watch } from "vue";
 //#region src/components/popover/popover-dialog.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<section data-slot=popover-dialog role=dialog tabindex=-1>", 1);
@@ -9,7 +8,6 @@ var popover_dialog_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@_
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = usePopoverContext();
 		const target = useOverlayTargetContext();
 		const scope = useOverlayScopeContext();
 		const element = shallowRef(null);
@@ -36,7 +34,6 @@ var popover_dialog_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@_
 		* fallback exists rather than the reference simply being dropped.
 		*/
 		const labelledBy = computed(() => headingId.value ?? target.labelledBy.value);
-		const styles = computed(() => slots.value.dialog({ class: props.class }));
 		const setElement = (next) => {
 			element.value = next ?? null;
 		};
@@ -59,7 +56,7 @@ var popover_dialog_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@_
 		renderEffect(() => {
 			setProp(n1, "id", unref(scope)?.dialogId.value);
 			setAttr(n1, "aria-labelledby", labelledBy.value);
-			setClass(n1, styles.value);
+			setClass(n1, ["rp-popover__dialog", props.class]);
 		});
 		setInsertionState(n1);
 		createSlot("default", { close: () => unref(target).state.close });

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

@@ -1,5 +1,4 @@
 import { useFieldIdsContext } from "../../composables/use-field-ids.js";
-import { usePopoverContext } from "./popover.context.js";
 import { computed, createDynamicComponent, createSlot, defineVaporComponent, extend, unref } from "vue";
 //#region src/components/popover/popover-heading.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var popover_heading_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -10,7 +9,6 @@ var popover_heading_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@
 	},
 	setup(__props) {
 		const props = __props;
-		const { slots } = usePopoverContext();
 		const fieldIds = useFieldIdsContext();
 		const id = fieldIds?.claimHeadingId();
 		/**
@@ -20,10 +18,9 @@ var popover_heading_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@
 		* starts one level below the page title; a heading floating in the page cannot assume that.
 		*/
 		const tag = computed(() => `h${props.level ?? (fieldIds ? 2 : 3)}`);
-		const styles = computed(() => slots.value.heading({ class: props.class }));
 		return createDynamicComponent(() => tag.value, {
 			id: () => unref(id),
-			class: () => styles.value
+			class: () => ["rp-popover__heading", props.class]
 		}, extend(() => {
 			return createSlot("default", null, null, 4);
 		}, { _: 1 }), 1);

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

@@ -2,9 +2,7 @@ import { providePressResponder } from "../../composables/press-responder.js";
 import { provideOverlayTargetContext } from "../overlay/overlay.context.js";
 import { useDialogTrigger } from "../../composables/use-dialog-trigger.js";
 import { useOverlayTriggerState } from "../../composables/use-overlay-trigger-state.js";
-import { providePopoverContext } from "./popover.context.js";
 import { computed, createSlot, defineVaporComponent } from "vue";
-import { popoverVariants } from "@ropav/styles";
 //#region src/components/popover/popover-root.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var popover_root_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
 	__name: "popover-root",
@@ -29,7 +27,6 @@ var popover_root_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__P
 		});
 		const trigger = useDialogTrigger({}, state);
 		providePressResponder(trigger.responder);
-		providePopoverContext({ slots: computed(() => popoverVariants()) });
 		provideOverlayTargetContext({
 			autoFocus: computed(() => false),
 			closeAll: state.close,

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

@@ -2,7 +2,6 @@ import { dataAttr } from "../../utils/assertion.js";
 import { useInteractionStates } from "../../composables/use-interaction-states.js";
 import { composePressResponder, usePressResponder } from "../../composables/press-responder.js";
 import { FOCUSABLE_SELECTOR } from "../../utils/focus.js";
-import { usePopoverContext } from "./popover.context.js";
 import { computed, createSlot, defineVaporComponent, on, renderEffect, setDynamicProps, setInsertionState, setTemplateRefBinding, shallowRef, template, unref, watch } from "vue";
 //#region src/components/popover/popover-trigger.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<div>", 1);
@@ -11,9 +10,7 @@ var popover_trigger_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = usePopoverContext();
 		const responder = usePressResponder();
-		const styles = computed(() => slots.value.trigger({ class: props.class }));
 		const host = shallowRef(null);
 		const hasFocusableContent = shallowRef(false);
 		const setElement = (element) => {
@@ -30,7 +27,7 @@ var popover_trigger_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@
 		renderEffect(() => {
 			const _dataAttr = unref(dataAttr);
 			setDynamicProps(n1, [{
-				class: styles.value,
+				class: ["rp-popover__trigger", props.class],
 				"data-focus-visible": _dataAttr(unref(isFocusVisible)),
 				"data-pressed": _dataAttr(unref(responder)?.isPressed.value),
 				"data-slot": "popover-trigger",

package/dist/components/progress-bar/progress-bar-track.js

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

package/dist/components/progress-circle/progress-circle-track-circle.js

@@ -1,5 +1,3 @@
-import { composeSlotClassName } from "../../utils/compose.js";
-import { useProgressCircleContext } from "./progress-circle.context.js";
 import { defineVaporComponent, renderEffect, setAttr, setClass, template, unref } from "vue";
 //#region src/components/progress-circle/progress-circle-track-circle.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<circle data-slot=progress-circle-track-circle>", 1, 1);
@@ -8,11 +6,10 @@ var progress_circle_track_circle_vue_vue_type_script_setup_true_vapor_true_lang_
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useProgressCircleContext();
 		const n0 = t0();
 		renderEffect(() => {
 			const _CENTER = unref(18);
-			setClass(n0, unref(composeSlotClassName)(unref(slots).trackCircle, props.class), true);
+			setClass(n0, ["rp-progress-circle__track-circle", props.class], true);
 			setAttr(n0, "cx", _CENTER, true);
 			setAttr(n0, "cy", _CENTER, true);
 			setAttr(n0, "r", unref(16), true);

package/dist/components/progress-circle/progress-circle-track.js

@@ -1,6 +1,4 @@
-import { composeSlotClassName } from "../../utils/compose.js";
 import { VIEW_BOX } from "./progress-circle.constants.js";
-import { useProgressCircleContext } from "./progress-circle.context.js";
 import { createSlot, defineVaporComponent, renderEffect, setAttr, setClass, setInsertionState, template, unref } from "vue";
 //#region src/components/progress-circle/progress-circle-track.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<svg data-slot=progress-circle-track fill=none>", 1, 1);
@@ -9,10 +7,9 @@ var progress_circle_track_vue_vue_type_script_setup_true_vapor_true_lang_default
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useProgressCircleContext();
 		const n1 = t0();
 		renderEffect(() => {
-			setClass(n1, unref(composeSlotClassName)(unref(slots).track, props.class), true);
+			setClass(n1, ["rp-progress-circle__track", props.class], true);
 			setAttr(n1, "viewBox", unref(VIEW_BOX), true);
 		});
 		setInsertionState(n1);

package/dist/components/radio/radio-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 { useInteractionStates } from "../../composables/use-interaction-states.js";
 import { useFormReset } from "../../composables/use-form-reset.js";
 import { useFormValidation } from "../../composables/use-form-validation.js";

package/dist/components/radio/radio-control.js

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

package/dist/components/range-calendar/index.js

@@ -1,6 +1,6 @@
-import { provideRangeCalendarContext, provideRangeCalendarOwnerContext, useRangeCalendarContext, useRangeCalendarOwnerContext } from "./range-calendar.context.js";
 import range_calendar_cell_indicator_default from "./range-calendar-cell-indicator.js";
 import range_calendar_cell_default from "./range-calendar-cell.js";
+import { provideRangeCalendarContext, provideRangeCalendarOwnerContext, useRangeCalendarContext, useRangeCalendarOwnerContext } from "./range-calendar.context.js";
 import range_calendar_grid_body_default from "./range-calendar-grid-body.js";
 import range_calendar_grid_header_default from "./range-calendar-grid-header.js";
 import range_calendar_grid_default from "./range-calendar-grid.js";

package/dist/components/range-calendar/range-calendar-cell-indicator.js

@@ -1,5 +1,4 @@
-import { useRangeCalendarContext } from "./range-calendar.context.js";
-import { computed, createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
+import { createSlot, defineVaporComponent, renderEffect, setClass, setInsertionState, template } from "vue";
 //#region src/components/range-calendar/range-calendar-cell-indicator.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<span aria-hidden=true data-slot=range-calendar-cell-indicator>", 1);
 var range_calendar_cell_indicator_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -7,10 +6,8 @@ var range_calendar_cell_indicator_vue_vue_type_script_setup_true_vapor_true_lang
 	props: { class: {} },
 	setup(__props) {
 		const props = __props;
-		const { slots } = useRangeCalendarContext();
-		const styles = computed(() => slots.value.cellIndicator({ class: props.class }));
 		const n1 = t0();
-		renderEffect(() => setClass(n1, styles.value));
+		renderEffect(() => setClass(n1, ["rp-range-calendar__cell-indicator", props.class]));
 		setInsertionState(n1);
 		createSlot();
 		return n1;

package/dist/components/range-calendar/range-calendar-cell.js

@@ -1,14 +1,13 @@
 import { dataAttr } from "../../utils/assertion.js";
 import { useInteractionStates } from "../../composables/use-interaction-states.js";
-import { useCalendarGridContext, useCalendarStateContext } from "../calendar/calendar.context.js";
 import { isRangeCalendarState } from "../../composables/use-calendar.js";
 import { useCalendarCell } from "../../composables/use-calendar-cell.js";
-import { useRangeCalendarContext } from "./range-calendar.context.js";
-import { child, computed, createSlot, defineVaporComponent, on, renderEffect, setAttr, setClass, setDynamicProps, setInsertionState, setStaticTemplateRef, setText, shallowRef, template, toDisplayString, unref } from "vue";
+import { useCalendarGridContext, useCalendarStateContext } from "../calendar/calendar.context.js";
+import { child, computed, createSlot, defineVaporComponent, on, renderEffect, setAttr, setDynamicProps, setInsertionState, setStaticTemplateRef, setText, shallowRef, template, toDisplayString, unref } from "vue";
 import { isSameDay, isSameMonth } from "@internationalized/date";
 //#region src/components/range-calendar/range-calendar-cell.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template(" ");
-var t1 = template("<td><div><span data-slot=range-calendar-cell-button>", 1);
+var t1 = template("<td><div><span class=rp-range-calendar__cell-button data-slot=range-calendar-cell-button>", 1);
 var range_calendar_cell_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
 	__name: "range-calendar-cell",
 	props: {
@@ -17,7 +16,6 @@ var range_calendar_cell_vue_vue_type_script_setup_true_vapor_true_lang_default =
 	},
 	setup(__props) {
 		const props = __props;
-		const { slots } = useRangeCalendarContext();
 		const { calendar, state } = useCalendarStateContext();
 		const { startDate } = useCalendarGridContext();
 		const element = shallowRef(null);
@@ -60,8 +58,6 @@ var range_calendar_cell_vue_vue_type_script_setup_true_vapor_true_lang_default =
 				isSelectionStart: isSameDay(props.date, range.start)
 			};
 		});
-		const styles = computed(() => slots.value.cell({ class: props.class }));
-		const buttonStyles = computed(() => slots.value.cellButton());
 		const slotProps = computed(() => ({
 			date: props.date,
 			formattedDate: cell.formattedDate.value,
@@ -91,7 +87,7 @@ var range_calendar_cell_vue_vue_type_script_setup_true_vapor_true_lang_default =
 			const _dataAttr_cell_isPressed_value = _dataAttr(_cell.isPressed.value);
 			setDynamicProps(n5, [_cell.cellAttrs.value]);
 			setDynamicProps(n4, [{
-				class: styles.value,
+				class: ["rp-range-calendar__cell", props.class],
 				"data-disabled": _dataAttr_cell_isDisabled_value,
 				"data-focus-visible": _dataAttr(isFocusVisible.value),
 				"data-focused": _dataAttr(_cell.isFocused.value),
@@ -107,7 +103,6 @@ var range_calendar_cell_vue_vue_type_script_setup_true_vapor_true_lang_default =
 				"data-today": _dataAttr(_cell.isToday.value),
 				"data-unavailable": _dataAttr(_cell.isUnavailable.value)
 			}, _cell.buttonAttrs.value]);
-			setClass(n3, buttonStyles.value);
 			setAttr(n3, "data-disabled", _dataAttr_cell_isDisabled_value);
 			setAttr(n3, "data-hovered", _dataAttr_interaction_isHovered_value);
 			setAttr(n3, "data-pressed", _dataAttr_cell_isPressed_value);

package/dist/components/range-calendar/range-calendar-header-cell.js

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

package/dist/components/range-calendar/range-calendar-header.js

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

package/dist/components/range-calendar/range-calendar-heading.js

@@ -1,7 +1,6 @@
 import { useCalendarStateContext } from "../calendar/calendar.context.js";
 import { useCalendarHeading } from "../../composables/use-calendar-heading.js";
-import { useRangeCalendarContext } from "./range-calendar.context.js";
-import { computed, defineVaporComponent, renderEffect, setClass, setText, template, toDisplayString, txt, unref } from "vue";
+import { defineVaporComponent, renderEffect, setClass, setText, template, toDisplayString, txt, unref } from "vue";
 //#region src/components/range-calendar/range-calendar-heading.vue?vue&type=script&setup=true&vapor=true&lang.ts
 var t0 = template("<h2 aria-hidden=true data-slot=range-calendar-heading> ", 1);
 var range_calendar_heading_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
@@ -13,17 +12,15 @@ var range_calendar_heading_vue_vue_type_script_setup_true_vapor_true_lang_defaul
 	},
 	setup(__props) {
 		const props = __props;
-		const { slots } = useRangeCalendarContext();
 		const { state } = useCalendarStateContext();
 		const heading = useCalendarHeading({
 			format: () => props.format,
 			offset: () => props.offset
 		}, state);
-		const styles = computed(() => slots.value.heading({ class: props.class }));
 		const n0 = t0();
 		const x0 = txt(n0);
 		renderEffect(() => {
-			setClass(n0, styles.value);
+			setClass(n0, ["rp-range-calendar__heading", props.class]);
 			setText(x0, toDisplayString(unref(heading)));
 		});
 		return n0;