@wirekyt/vue 0.0.1 → 0.0.3

package/dist/listbox.js

@@ -0,0 +1,361 @@
+import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.js";
+import { c as normalizeProps$1, d as useForwardExpose, m as createContext, s as useMachine } from "./utils-D95V66v9.js";
+import { a as DEFAULT_LOCALE, d as useEnvironmentContext, o as useLocaleContext, u as DEFAULT_ENVIRONMENT } from "./providers-C3XQH-uu.js";
+import { t as cleanProps } from "./clean-props--1kqQE0Y.js";
+import { n as wire } from "./factory-8Ao0DEy3.js";
+import { o as createListCollection } from "./collection-Dg6EtML_.js";
+import { computed, createBlock, createCommentVNode, createTextVNode, defineComponent, guardReactiveProps, mergeDefaults, mergeProps, normalizeProps, openBlock, renderSlot, toDisplayString, toValue, unref, useId, useSlots, withCtx } from "vue";
+import * as listbox from "@wirekyt/dom/machines/listbox";
+import { anatomy } from "@wirekyt/dom/machines/listbox";
+//#region src/components/listbox/use-context.ts
+const [ListboxProvider, useListboxContext] = createContext("ListboxContext");
+//#endregion
+//#region src/components/listbox/context.vue
+const _sfc_main$1 = /*@__PURE__*/ defineComponent({
+	__name: "context",
+	setup(__props) {
+		const listbox = useListboxContext();
+		return (_ctx, _cache) => {
+			return renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(listbox))));
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/content.vue
+const _sfc_main = /*@__PURE__*/ defineComponent({
+	__name: "content",
+	props: { asChild: { type: Boolean } },
+	setup(__props) {
+		const listbox = useListboxContext();
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(wire).div, mergeProps(unref(listbox).getContentProps(), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/anatomy.ts
+const listboxAnatomy = anatomy.extendWith("empty");
+//#endregion
+//#region src/components/listbox/empty.vue
+const _sfc_main$2 = /*@__PURE__*/ defineComponent({
+	__name: "empty",
+	props: { asChild: { type: Boolean } },
+	setup(__props) {
+		const parts = listboxAnatomy.build();
+		const listbox = useListboxContext();
+		const isEmpty = computed(() => listbox.value.collection.size === 0);
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return isEmpty.value ? (openBlock(), createBlock(unref(wire).div, mergeProps({ key: 0 }, unref(parts).empty.attrs, {
+				role: "presentation",
+				"as-child": __props.asChild
+			}), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"])) : createCommentVNode("v-if", true);
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/input.vue
+const _sfc_main$3 = /*@__PURE__*/ defineComponent({
+	__name: "input",
+	props: {
+		autoHighlight: { type: Boolean },
+		keyboardPriority: {},
+		asChild: { type: Boolean }
+	},
+	setup(__props) {
+		const props = __props;
+		const listbox = useListboxContext();
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(wire).input, mergeProps(unref(listbox).getInputProps({
+				autoHighlight: props.autoHighlight,
+				keyboardPriority: props.keyboardPriority
+			}), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/use-item-context.ts
+const [ListboxItemProvider, useListboxItemContext] = createContext("ListboxItemContext");
+//#endregion
+//#region src/components/listbox/use-item-props-context.ts
+const [ListboxItemPropsProvider, useListboxItemPropsContext] = createContext("ListboxItemPropsContext");
+//#endregion
+//#region src/components/listbox/item.vue
+const _sfc_main$4 = /*@__PURE__*/ defineComponent({
+	__name: "item",
+	props: {
+		item: {},
+		highlightOnHover: { type: Boolean },
+		asChild: { type: Boolean }
+	},
+	setup(__props) {
+		const props = __props;
+		const listbox = useListboxContext();
+		ListboxItemPropsProvider(props);
+		ListboxItemProvider(computed(() => listbox.value.getItemState(props)));
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(wire).div, mergeProps(unref(listbox).getItemProps(props), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/item-context.vue
+const _sfc_main$5 = /*@__PURE__*/ defineComponent({
+	__name: "item-context",
+	setup(__props) {
+		const context = useListboxItemContext();
+		return (_ctx, _cache) => {
+			return renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(context))));
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/use-item-group-props-context.ts
+const [ListboxItemGroupPropsProvider, useListboxItemGroupPropsContext] = createContext("ListboxItemGroupPropsContext");
+//#endregion
+//#region src/components/listbox/item-group.vue
+const _sfc_main$6 = /*@__PURE__*/ defineComponent({
+	__name: "item-group",
+	props: {
+		id: {},
+		asChild: { type: Boolean }
+	},
+	setup(__props) {
+		const props = __props;
+		const listbox = useListboxContext();
+		const uid = useId();
+		const id = props.id ?? uid;
+		ListboxItemGroupPropsProvider({ id });
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(wire).div, mergeProps(unref(listbox).getItemGroupProps({ id: unref(id) }), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/item-group-label.vue
+const _sfc_main$7 = /*@__PURE__*/ defineComponent({
+	__name: "item-group-label",
+	props: { asChild: { type: Boolean } },
+	setup(__props) {
+		const listbox = useListboxContext();
+		const itemGroupProps = useListboxItemGroupPropsContext();
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(wire).div, mergeProps(unref(listbox).getItemGroupLabelProps({ htmlFor: unref(itemGroupProps).id }), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/item-indicator.vue
+const _sfc_main$8 = /*@__PURE__*/ defineComponent({
+	__name: "item-indicator",
+	props: { asChild: { type: Boolean } },
+	setup(__props) {
+		const listbox = useListboxContext();
+		const itemProps = useListboxItemPropsContext();
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(wire).div, mergeProps(unref(listbox).getItemIndicatorProps(unref(itemProps)), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/item-text.vue
+const _sfc_main$9 = /*@__PURE__*/ defineComponent({
+	__name: "item-text",
+	props: { asChild: { type: Boolean } },
+	setup(__props) {
+		const listbox = useListboxContext();
+		const ItemProps = useListboxItemPropsContext();
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(wire).div, mergeProps(unref(listbox).getItemTextProps(unref(ItemProps)), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/label.vue
+const _sfc_main$10 = /*@__PURE__*/ defineComponent({
+	__name: "label",
+	props: { asChild: { type: Boolean } },
+	setup(__props) {
+		const listbox = useListboxContext();
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(wire).span, mergeProps(unref(listbox).getLabelProps(), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/use-listbox.ts
+const useListbox = (props, emit) => {
+	const id = useId();
+	const env = useEnvironmentContext(DEFAULT_ENVIRONMENT);
+	const locale = useLocaleContext(DEFAULT_LOCALE);
+	const context = computed(() => {
+		const localProps = toValue(props);
+		return {
+			id,
+			dir: locale.value.dir,
+			value: localProps.modelValue,
+			getRootNode: env?.value.getRootNode,
+			...cleanProps(localProps),
+			onValueChange: (details) => {
+				emit?.("valueChange", details);
+				emit?.("update:modelValue", details.value);
+				localProps.onValueChange?.(details);
+			},
+			onHighlightChange: (details) => {
+				emit?.("highlightChange", details);
+				localProps.onHighlightChange?.(details);
+			},
+			onSelect: (details) => {
+				emit?.("select", details);
+				localProps.onSelect?.(details);
+			}
+		};
+	});
+	const service = useMachine(listbox.machine, context);
+	return computed(() => listbox.connect(service, normalizeProps$1));
+};
+//#endregion
+//#region src/components/listbox/root.vue
+const _sfc_main$11 = /*@__PURE__*/ defineComponent({
+	__name: "root",
+	props: /*@__PURE__*/ mergeDefaults({
+		collection: {},
+		defaultHighlightedValue: {},
+		defaultValue: {},
+		deselectable: { type: Boolean },
+		disabled: { type: Boolean },
+		disallowSelectAll: { type: Boolean },
+		highlightedValue: {},
+		id: {},
+		ids: {},
+		loopFocus: { type: Boolean },
+		modelValue: {},
+		orientation: {},
+		scrollToIndexFn: { type: Function },
+		selectOnHighlight: { type: Boolean },
+		selectionMode: {},
+		typeahead: { type: Boolean },
+		asChild: { type: Boolean }
+	}, {
+		deselectable: void 0,
+		disabled: void 0,
+		disallowSelectAll: void 0,
+		loopFocus: void 0,
+		selectOnHighlight: void 0,
+		typeahead: void 0
+	}),
+	emits: [
+		"highlightChange",
+		"select",
+		"valueChange",
+		"update:modelValue"
+	],
+	setup(__props, { emit: __emit }) {
+		const listbox = useListbox(__props, __emit);
+		ListboxProvider(listbox);
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(wire).div, mergeProps(unref(listbox).getRootProps(), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/root-provider.vue
+const _sfc_main$12 = /*@__PURE__*/ defineComponent({
+	__name: "root-provider",
+	props: {
+		value: {},
+		asChild: { type: Boolean }
+	},
+	setup(__props) {
+		const props = __props;
+		const listbox = computed(() => props.value);
+		ListboxProvider(listbox);
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(wire).div, mergeProps(listbox.value.getRootProps(), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/value-text.vue
+const _sfc_main$13 = /*@__PURE__*/ defineComponent({
+	__name: "value-text",
+	props: {
+		placeholder: {},
+		asChild: { type: Boolean }
+	},
+	setup(__props) {
+		const props = __props;
+		const listbox = useListboxContext();
+		const slots = useSlots();
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(wire).span, mergeProps(unref(listbox).getValueTextProps(), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", {}, () => [createTextVNode(toDisplayString(slots.default?.() || unref(listbox).valueAsString || props.placeholder), 1)])]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/listbox/listbox.ts
+var listbox_exports = /* @__PURE__ */ __exportAll({
+	Content: () => _sfc_main,
+	Context: () => _sfc_main$1,
+	Empty: () => _sfc_main$2,
+	Input: () => _sfc_main$3,
+	Item: () => _sfc_main$4,
+	ItemContext: () => _sfc_main$5,
+	ItemGroup: () => _sfc_main$6,
+	ItemGroupLabel: () => _sfc_main$7,
+	ItemIndicator: () => _sfc_main$8,
+	ItemText: () => _sfc_main$9,
+	Label: () => _sfc_main$10,
+	Root: () => _sfc_main$11,
+	RootProvider: () => _sfc_main$12,
+	ValueText: () => _sfc_main$13
+});
+//#endregion
+export { listbox_exports as Listbox, _sfc_main as ListboxContent, _sfc_main$1 as ListboxContext, _sfc_main$2 as ListboxEmpty, _sfc_main$3 as ListboxInput, _sfc_main$4 as ListboxItem, _sfc_main$5 as ListboxItemContext, _sfc_main$6 as ListboxItemGroup, _sfc_main$7 as ListboxItemGroupLabel, _sfc_main$8 as ListboxItemIndicator, _sfc_main$9 as ListboxItemText, _sfc_main$10 as ListboxLabel, _sfc_main$11 as ListboxRoot, _sfc_main$12 as ListboxRootProvider, _sfc_main$13 as ListboxValueText, createListCollection, listboxAnatomy, useListbox, useListboxContext, useListboxItemContext };

package/dist/marquee.cjs

@@ -0,0 +1,256 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_rolldown_runtime = require("./rolldown-runtime-DakpK96I.cjs");
+const require_utils = require("./utils-XrBZd2Yk.cjs");
+const require_providers = require("./providers-5QhcwgSd.cjs");
+const require_clean_props = require("./clean-props-MyKqus13.cjs");
+const require_factory = require("./factory-JL7MPjkk.cjs");
+let vue = require("vue");
+let _wirekyt_dom_utils = require("@wirekyt/dom/utils");
+let _wirekyt_dom_machines_marquee = require("@wirekyt/dom/machines/marquee");
+_wirekyt_dom_machines_marquee = require_rolldown_runtime.__toESM(_wirekyt_dom_machines_marquee, 1);
+//#region src/utils/use-scope-id.ts
+function hasVnodeScopeId(vnode) {
+	if (vnode === null || typeof vnode !== "object") return false;
+	const vnodeObj = vnode;
+	return (0, _wirekyt_dom_utils.hasProp)(vnodeObj, "scopeId") && (0, _wirekyt_dom_utils.isString)(vnodeObj.scopeId);
+}
+function hasTypeScopeId(type) {
+	if (type === null || typeof type !== "object") return false;
+	const typeObj = type;
+	return (0, _wirekyt_dom_utils.hasProp)(typeObj, "__scopeId") && (0, _wirekyt_dom_utils.isString)(typeObj.__scopeId);
+}
+function getScopeIdFromInstance(instance) {
+	if (hasVnodeScopeId(instance.vnode)) return instance.vnode.scopeId;
+	if (hasTypeScopeId(instance.type)) return instance.type.__scopeId;
+}
+function useScopeId() {
+	const instance = (0, vue.getCurrentInstance)();
+	if (!instance) return;
+	let scopeId = getScopeIdFromInstance(instance);
+	if (!scopeId && instance.parent) {
+		let parent = instance.parent;
+		while (parent && !scopeId) {
+			scopeId = getScopeIdFromInstance(parent);
+			parent = parent.parent;
+		}
+	}
+	return scopeId;
+}
+//#endregion
+//#region src/components/marquee/use-context.ts
+const [MarqueeProvider, useMarqueeContext] = require_utils.createContext("MarqueeContext");
+//#endregion
+//#region src/components/marquee/content.vue
+const _sfc_main = /*@__PURE__*/ (0, vue.defineComponent)({
+	inheritAttrs: false,
+	__name: "content",
+	props: { asChild: { type: Boolean } },
+	setup(__props) {
+		const marquee = useMarqueeContext();
+		const attrs = (0, vue.useAttrs)();
+		const scopeId = useScopeId();
+		require_utils.useForwardExpose();
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(Array.from({ length: (0, vue.unref)(marquee).contentCount }), (_, index) => {
+				return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_factory.wire).div, (0, vue.mergeProps)({ key: index }, { ref_for: true }, {
+					...(0, vue.unref)(attrs),
+					...(0, vue.unref)(scopeId) ? { [(0, vue.unref)(scopeId)]: "" } : {},
+					...(0, vue.unref)(marquee).getContentProps({ index })
+				}, { "as-child": __props.asChild }), {
+					default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+					_: 3
+				}, 16, ["as-child"]);
+			}), 128);
+		};
+	}
+});
+//#endregion
+//#region src/components/marquee/context.vue
+const _sfc_main$1 = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "context",
+	setup(__props) {
+		const api = useMarqueeContext();
+		return (_ctx, _cache) => {
+			return (0, vue.renderSlot)(_ctx.$slots, "default", (0, vue.normalizeProps)((0, vue.guardReactiveProps)((0, vue.unref)(api))));
+		};
+	}
+});
+//#endregion
+//#region src/components/marquee/edge.vue
+const _sfc_main$2 = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "edge",
+	props: {
+		side: {},
+		asChild: { type: Boolean }
+	},
+	setup(__props) {
+		const props = __props;
+		const marquee = useMarqueeContext();
+		require_utils.useForwardExpose();
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_factory.wire).div, (0, vue.mergeProps)((0, vue.unref)(marquee).getEdgeProps({ side: props.side }), { "as-child": __props.asChild }), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/marquee/item.vue
+const _sfc_main$3 = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "item",
+	props: { asChild: { type: Boolean } },
+	setup(__props) {
+		const marquee = useMarqueeContext();
+		require_utils.useForwardExpose();
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_factory.wire).div, (0, vue.mergeProps)((0, vue.unref)(marquee).getItemProps(), { "as-child": __props.asChild }), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/marquee/use-marquee.ts
+const useMarquee = (props = {}, emit) => {
+	const id = (0, vue.useId)();
+	const env = require_providers.useEnvironmentContext(require_providers.DEFAULT_ENVIRONMENT);
+	const locale = require_providers.useLocaleContext(require_providers.DEFAULT_LOCALE);
+	const context = (0, vue.computed)(() => {
+		const localeProps = (0, vue.toValue)(props);
+		return {
+			id,
+			dir: locale.value.dir,
+			getRootNode: env?.value.getRootNode,
+			...require_clean_props.cleanProps(localeProps),
+			onPauseChange: (details) => {
+				emit?.("pauseChange", details);
+				localeProps.onPauseChange?.(details);
+			},
+			onLoopComplete: () => {
+				emit?.("loopComplete");
+				localeProps.onLoopComplete?.();
+			},
+			onComplete: () => {
+				emit?.("complete");
+				localeProps.onComplete?.();
+			}
+		};
+	});
+	const service = require_utils.useMachine(_wirekyt_dom_machines_marquee.machine, context);
+	return (0, vue.computed)(() => _wirekyt_dom_machines_marquee.connect(service, require_utils.normalizeProps));
+};
+//#endregion
+//#region src/components/marquee/root.vue
+const _sfc_main$4 = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "root",
+	props: /*@__PURE__*/ (0, vue.mergeDefaults)({
+		autoFill: { type: Boolean },
+		defaultPaused: { type: Boolean },
+		delay: {},
+		id: {},
+		ids: {},
+		loopCount: {},
+		pauseOnInteraction: { type: Boolean },
+		paused: { type: Boolean },
+		reverse: { type: Boolean },
+		side: {},
+		spacing: {},
+		speed: {},
+		translations: {},
+		asChild: { type: Boolean }
+	}, {
+		autoFill: void 0,
+		defaultPaused: void 0,
+		pauseOnInteraction: void 0,
+		paused: void 0,
+		reverse: void 0
+	}),
+	emits: [
+		"complete",
+		"loopComplete",
+		"pauseChange"
+	],
+	setup(__props, { emit: __emit }) {
+		const marquee = useMarquee(__props, __emit);
+		MarqueeProvider(marquee);
+		require_utils.useForwardExpose();
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_factory.wire).div, (0, vue.mergeProps)((0, vue.unref)(marquee).getRootProps(), { "as-child": __props.asChild }), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/marquee/root-provider.vue
+const _sfc_main$5 = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "root-provider",
+	props: {
+		value: {},
+		asChild: { type: Boolean }
+	},
+	setup(__props) {
+		const props = __props;
+		const marquee = (0, vue.computed)(() => props.value);
+		MarqueeProvider(marquee);
+		require_utils.useForwardExpose();
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_factory.wire).div, (0, vue.mergeProps)(marquee.value.getRootProps(), { "as-child": __props.asChild }), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/marquee/viewport.vue
+const _sfc_main$6 = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "viewport",
+	props: { asChild: { type: Boolean } },
+	setup(__props) {
+		const marquee = useMarqueeContext();
+		require_utils.useForwardExpose();
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_factory.wire).div, (0, vue.mergeProps)((0, vue.unref)(marquee).getViewportProps(), { "as-child": __props.asChild }), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/marquee/marquee.ts
+var marquee_exports = /* @__PURE__ */ require_rolldown_runtime.__exportAll({
+	Content: () => _sfc_main,
+	Context: () => _sfc_main$1,
+	Edge: () => _sfc_main$2,
+	Item: () => _sfc_main$3,
+	Root: () => _sfc_main$4,
+	RootProvider: () => _sfc_main$5,
+	Viewport: () => _sfc_main$6
+});
+//#endregion
+Object.defineProperty(exports, "Marquee", {
+	enumerable: true,
+	get: function() {
+		return marquee_exports;
+	}
+});
+exports.MarqueeContent = _sfc_main;
+exports.MarqueeContext = _sfc_main$1;
+exports.MarqueeEdge = _sfc_main$2;
+exports.MarqueeItem = _sfc_main$3;
+exports.MarqueeRoot = _sfc_main$4;
+exports.MarqueeRootProvider = _sfc_main$5;
+exports.MarqueeViewport = _sfc_main$6;
+Object.defineProperty(exports, "marqueeAnatomy", {
+	enumerable: true,
+	get: function() {
+		return _wirekyt_dom_machines_marquee.anatomy;
+	}
+});
+exports.useMarquee = useMarquee;
+exports.useMarqueeContext = useMarqueeContext;