@youcan/celeste 0.6.102 → 0.7.0

package/dist/cjs/chunks/RovingFocusGroup.cjs

@@ -0,0 +1,146 @@
+require("./chunk.cjs");
+const require_createContext = require("./createContext.cjs");
+const require_dist = require("./dist.cjs");
+const require_Primitive = require("./Primitive.cjs");
+const require_useDirection = require("./useDirection.cjs");
+const require_Collection = require("./Collection.cjs");
+const require_utils = require("./utils2.cjs");
+let vue = require("vue");
+//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.13_typescript@5.9.3_/node_modules/reka-ui/dist/RovingFocus/RovingFocusGroup.js
+var [injectRovingFocusGroupContext, provideRovingFocusGroupContext] = /* @__PURE__ */ require_createContext.createContext("RovingFocusGroup");
+var RovingFocusGroup_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	__name: "RovingFocusGroup",
+	props: {
+		orientation: {
+			type: String,
+			required: false,
+			default: void 0
+		},
+		dir: {
+			type: String,
+			required: false
+		},
+		loop: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		currentTabStopId: {
+			type: [String, null],
+			required: false
+		},
+		defaultCurrentTabStopId: {
+			type: String,
+			required: false
+		},
+		preventScrollOnEntryFocus: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		asChild: {
+			type: Boolean,
+			required: false
+		},
+		as: {
+			type: null,
+			required: false
+		}
+	},
+	emits: ["entryFocus", "update:currentTabStopId"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emits = __emit;
+		const { loop, orientation, dir: propDir } = (0, vue.toRefs)(props);
+		const dir = require_useDirection.useDirection(propDir);
+		const currentTabStopId = require_dist.useVModel(props, "currentTabStopId", emits, {
+			defaultValue: props.defaultCurrentTabStopId,
+			passive: props.currentTabStopId === void 0
+		});
+		const isTabbingBackOut = (0, vue.ref)(false);
+		const isClickFocus = (0, vue.ref)(false);
+		const focusableItemsCount = (0, vue.ref)(0);
+		const { getItems, CollectionSlot } = require_Collection.useCollection({ isProvider: true });
+		function handleFocus(event) {
+			const isKeyboardFocus = !isClickFocus.value;
+			if (event.currentTarget && event.target === event.currentTarget && isKeyboardFocus && !isTabbingBackOut.value) {
+				const entryFocusEvent = new CustomEvent(require_utils.ENTRY_FOCUS, require_utils.EVENT_OPTIONS);
+				event.currentTarget.dispatchEvent(entryFocusEvent);
+				emits("entryFocus", entryFocusEvent);
+				if (!entryFocusEvent.defaultPrevented) {
+					const items = getItems().map((i) => i.ref).filter((i) => i.dataset.disabled !== "");
+					require_utils.focusFirst([
+						items.find((item) => item.getAttribute("data-active") === ""),
+						items.find((item) => item.getAttribute("data-highlighted") === ""),
+						items.find((item) => item.id === currentTabStopId.value),
+						...items
+					].filter(Boolean), props.preventScrollOnEntryFocus);
+				}
+			}
+			isClickFocus.value = false;
+		}
+		function handleMouseUp() {
+			setTimeout(() => {
+				isClickFocus.value = false;
+			}, 1);
+		}
+		__expose({ getItems });
+		provideRovingFocusGroupContext({
+			loop,
+			dir,
+			orientation,
+			currentTabStopId,
+			onItemFocus: (tabStopId) => {
+				currentTabStopId.value = tabStopId;
+			},
+			onItemShiftTab: () => {
+				isTabbingBackOut.value = true;
+			},
+			onFocusableItemAdd: () => {
+				focusableItemsCount.value++;
+			},
+			onFocusableItemRemove: () => {
+				focusableItemsCount.value--;
+			}
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(CollectionSlot), null, {
+				default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(require_Primitive.Primitive), {
+					tabindex: isTabbingBackOut.value || focusableItemsCount.value === 0 ? -1 : 0,
+					"data-orientation": (0, vue.unref)(orientation),
+					as: _ctx.as,
+					"as-child": _ctx.asChild,
+					dir: (0, vue.unref)(dir),
+					style: { "outline": "none" },
+					onMousedown: _cache[0] || (_cache[0] = ($event) => isClickFocus.value = true),
+					onMouseup: handleMouseUp,
+					onFocus: handleFocus,
+					onBlur: _cache[1] || (_cache[1] = ($event) => isTabbingBackOut.value = false)
+				}, {
+					default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+					_: 3
+				}, 8, [
+					"tabindex",
+					"data-orientation",
+					"as",
+					"as-child",
+					"dir"
+				])]),
+				_: 3
+			});
+		};
+	}
+});
+//#endregion
+Object.defineProperty(exports, "RovingFocusGroup_default", {
+	enumerable: true,
+	get: function() {
+		return RovingFocusGroup_default;
+	}
+});
+Object.defineProperty(exports, "injectRovingFocusGroupContext", {
+	enumerable: true,
+	get: function() {
+		return injectRovingFocusGroupContext;
+	}
+});

package/dist/cjs/chunks/RovingFocusItem.cjs

@@ -0,0 +1,114 @@
+require("./chunk.cjs");
+const require_Primitive = require("./Primitive.cjs");
+const require_useId = require("./useId.cjs");
+const require_Collection = require("./Collection.cjs");
+const require_utils = require("./utils2.cjs");
+const require_RovingFocusGroup = require("./RovingFocusGroup.cjs");
+let vue = require("vue");
+//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.13_typescript@5.9.3_/node_modules/reka-ui/dist/RovingFocus/RovingFocusItem.js
+var RovingFocusItem_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	__name: "RovingFocusItem",
+	props: {
+		tabStopId: {
+			type: String,
+			required: false
+		},
+		focusable: {
+			type: Boolean,
+			required: false,
+			default: true
+		},
+		active: {
+			type: Boolean,
+			required: false
+		},
+		allowShiftKey: {
+			type: Boolean,
+			required: false
+		},
+		asChild: {
+			type: Boolean,
+			required: false
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "span"
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const context = require_RovingFocusGroup.injectRovingFocusGroupContext();
+		const randomId = require_useId.useId();
+		const id = (0, vue.computed)(() => props.tabStopId || randomId);
+		const isCurrentTabStop = (0, vue.computed)(() => context.currentTabStopId.value === id.value);
+		const { getItems, CollectionItem } = require_Collection.useCollection();
+		(0, vue.onMounted)(() => {
+			if (props.focusable) context.onFocusableItemAdd();
+		});
+		(0, vue.onUnmounted)(() => {
+			if (props.focusable) context.onFocusableItemRemove();
+		});
+		(0, vue.watch)(() => props.focusable, (newVal, oldVal) => {
+			if (newVal === oldVal) return;
+			if (newVal) context.onFocusableItemAdd();
+			else context.onFocusableItemRemove();
+		});
+		function handleKeydown(event) {
+			if (event.key === "Tab" && event.shiftKey) {
+				context.onItemShiftTab();
+				return;
+			}
+			if (event.target !== event.currentTarget) return;
+			const focusIntent = require_utils.getFocusIntent(event, context.orientation.value, context.dir.value);
+			if (focusIntent !== void 0) {
+				if (event.metaKey || event.ctrlKey || event.altKey || (props.allowShiftKey ? false : event.shiftKey)) return;
+				event.preventDefault();
+				let candidateNodes = [...getItems().map((i) => i.ref).filter((i) => i.dataset.disabled !== "")];
+				if (focusIntent === "last") candidateNodes.reverse();
+				else if (focusIntent === "prev" || focusIntent === "next") {
+					if (focusIntent === "prev") candidateNodes.reverse();
+					const currentIndex = candidateNodes.indexOf(event.currentTarget);
+					candidateNodes = context.loop.value ? require_utils.wrapArray(candidateNodes, currentIndex + 1) : candidateNodes.slice(currentIndex + 1);
+				}
+				(0, vue.nextTick)(() => require_utils.focusFirst(candidateNodes));
+			}
+		}
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(CollectionItem), null, {
+				default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(require_Primitive.Primitive), {
+					tabindex: isCurrentTabStop.value ? 0 : -1,
+					"data-orientation": (0, vue.unref)(context).orientation.value,
+					"data-active": _ctx.active ? "" : void 0,
+					"data-disabled": !_ctx.focusable ? "" : void 0,
+					as: _ctx.as,
+					"as-child": _ctx.asChild,
+					onMousedown: _cache[0] || (_cache[0] = (event) => {
+						if (!_ctx.focusable) event.preventDefault();
+						else (0, vue.unref)(context).onItemFocus(id.value);
+					}),
+					onFocus: _cache[1] || (_cache[1] = ($event) => (0, vue.unref)(context).onItemFocus(id.value)),
+					onKeydown: handleKeydown
+				}, {
+					default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+					_: 3
+				}, 8, [
+					"tabindex",
+					"data-orientation",
+					"data-active",
+					"data-disabled",
+					"as",
+					"as-child"
+				])]),
+				_: 3
+			});
+		};
+	}
+});
+//#endregion
+Object.defineProperty(exports, "RovingFocusItem_default", {
+	enumerable: true,
+	get: function() {
+		return RovingFocusItem_default;
+	}
+});

package/dist/cjs/chunks/SelectGroup.cjs

@@ -0,0 +1,44 @@
+require("./chunk.cjs");
+const require_createContext = require("./createContext.cjs");
+const require_Primitive = require("./Primitive.cjs");
+const require_useId = require("./useId.cjs");
+let vue = require("vue");
+//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.13_typescript@5.9.3_/node_modules/reka-ui/dist/Select/SelectGroup.js
+var [injectSelectGroupContext, provideSelectGroupContext] = /* @__PURE__ */ require_createContext.createContext("SelectGroup");
+var SelectGroup_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	__name: "SelectGroup",
+	props: {
+		asChild: {
+			type: Boolean,
+			required: false
+		},
+		as: {
+			type: null,
+			required: false
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const id = require_useId.useId(void 0, "reka-select-group");
+		provideSelectGroupContext({ id });
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_Primitive.Primitive), (0, vue.mergeProps)({ role: "group" }, props, { "aria-labelledby": (0, vue.unref)(id) }), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["aria-labelledby"]);
+		};
+	}
+});
+//#endregion
+Object.defineProperty(exports, "SelectGroup_default", {
+	enumerable: true,
+	get: function() {
+		return SelectGroup_default;
+	}
+});
+Object.defineProperty(exports, "injectSelectGroupContext", {
+	enumerable: true,
+	get: function() {
+		return injectSelectGroupContext;
+	}
+});