@youcan/celeste 0.15.0 → 0.17.0

package/dist/cjs/chunks/dialog.cjs

@@ -0,0 +1,76 @@
+const require_dist = require("./dist2.cjs");
+const require_context = require("../context.cjs");
+const require_drawer = require("./drawer.cjs");
+const require_modal = require("./modal.cjs");
+let vue = require("vue");
+//#region ../celeste-tokens/dist/json/breakpoint.json
+var breakpoint = {
+	"sm": {
+		"$value": 640,
+		"$type": "dimension"
+	},
+	"md": {
+		"$value": 768,
+		"$type": "dimension"
+	},
+	"lg": {
+		"$value": 1024,
+		"$type": "dimension"
+	},
+	"xl": {
+		"$value": 1280,
+		"$type": "dimension"
+	},
+	"2xl": {
+		"$value": 1536,
+		"$type": "dimension"
+	}
+};
+//#endregion
+//#region src/components/dialog/dialog.vue
+var dialog_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	__name: "dialog",
+	props: {
+		open: {
+			type: Boolean,
+			default: void 0
+		},
+		defaultOpen: { type: Boolean },
+		breakpoint: { default: "sm" }
+	},
+	emits: ["update:open"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const open = require_dist.useVModel(props, "open", __emit, {
+			passive: true,
+			defaultValue: props.defaultOpen
+		});
+		const drawer = require_dist.useMediaQuery(() => `(width < ${breakpoint[props.breakpoint].$value}px)`);
+		require_context.provideDialogContext({ drawer });
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(drawer) ? ((0, vue.openBlock)(), (0, vue.createBlock)(require_drawer.drawer_default, {
+				key: 0,
+				open: (0, vue.unref)(open),
+				"onUpdate:open": _cache[0] || (_cache[0] = ($event) => (0, vue.isRef)(open) ? open.value = $event : null),
+				side: "bottom"
+			}, {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+				_: 3
+			}, 8, ["open"])) : ((0, vue.openBlock)(), (0, vue.createBlock)(require_modal.modal_default, {
+				key: 1,
+				open: (0, vue.unref)(open),
+				"onUpdate:open": _cache[1] || (_cache[1] = ($event) => (0, vue.isRef)(open) ? open.value = $event : null)
+			}, {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+				_: 3
+			}, 8, ["open"]));
+		};
+	}
+});
+//#endregion
+Object.defineProperty(exports, "dialog_default", {
+	enumerable: true,
+	get: function() {
+		return dialog_default;
+	}
+});

package/dist/cjs/chunks/digit-input-slot.cjs

@@ -9,7 +9,7 @@ const require_useForwardProps = require("./useForwardProps.cjs");
 const require_usePrimitiveElement = require("./usePrimitiveElement.cjs");
 const require_PinInputRoot = require("./PinInputRoot.cjs");
 let vue = require("vue");
-//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.41_typescript@6.0.3_/node_modules/reka-ui/dist/PinInput/PinInputInput.js
+//#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.41_typescript@6.0.3_/node_modules/reka-ui/dist/PinInput/PinInputInput.js
 var PinInputInput_default = /* @__PURE__ */ (0, vue.defineComponent)({
 	__name: "PinInputInput",
 	props: {
@@ -96,8 +96,10 @@ var PinInputInput_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		}
 		function handleKeydown(event) {
 			if (isComposing.value || event.isComposing) return;
+			const firstEmptyInputIdx = getFirstEmptyInputIndex();
+			const itemsArray = firstEmptyInputIdx === -1 ? inputElements.value : inputElements.value.slice(0, firstEmptyInputIdx + 1);
 			require_useArrowNavigation.useArrowNavigation(event, require_getActiveElement.getActiveElement(), void 0, {
-				itemsArray: inputElements.value,
+				itemsArray,
 				focus: true,
 				loop: false,
 				arrowKeyOptions: "horizontal",
@@ -121,11 +123,29 @@ var PinInputInput_default = /* @__PURE__ */ (0, vue.defineComponent)({
 				updateModelValueAt(props.index, "");
 			}
 		}
+		/**
+		* In OTP mode, inputs should be filled one by one without skipping middle inputs.
+		* Returns the index of the first empty input, or `-1` when not in OTP mode / all filled.
+		*/
+		function getFirstEmptyInputIndex() {
+			if (!context.otp.value) return -1;
+			return inputElements.value.findIndex((_, idx) => context.currentModelValue.value[idx] === "" || context.currentModelValue.value[idx] === void 0);
+		}
+		function getEarlierEmptyInput() {
+			const firstEmptyInputIdx = getFirstEmptyInputIndex();
+			if (firstEmptyInputIdx !== -1 && firstEmptyInputIdx < props.index) return inputElements.value[firstEmptyInputIdx];
+		}
+		function handleMousedown(event) {
+			const earlierEmptyInput = getEarlierEmptyInput();
+			if (!earlierEmptyInput) return;
+			event.preventDefault();
+			earlierEmptyInput.focus();
+		}
 		function handleFocus(event) {
-			if (context.otp.value) {
-				const firstEmptyInputIdx = inputElements.value.findIndex((_, idx) => context.currentModelValue.value[idx] === "" || context.currentModelValue.value[idx] === void 0);
-				if (firstEmptyInputIdx !== -1 && firstEmptyInputIdx < props.index) {
-					inputElements.value[firstEmptyInputIdx].focus();
+			if (!inputElements.value.includes(event.relatedTarget)) {
+				const earlierEmptyInput = getEarlierEmptyInput();
+				if (earlierEmptyInput) {
+					earlierEmptyInput.focus();
 					return;
 				}
 			}
@@ -171,7 +191,7 @@ var PinInputInput_default = /* @__PURE__ */ (0, vue.defineComponent)({
 			const tempModelValue = [...context.currentModelValue.value];
 			if (context.isNumericMode.value) {
 				const num = +value;
-				if (value === "" || isNaN(num)) delete tempModelValue[index];
+				if (value === "" || isNaN(num)) tempModelValue[index] = void 0;
 				else tempModelValue[index] = num;
 			} else tempModelValue[index] = value;
 			context.modelValue.value = removeTrailingEmptyStrings(tempModelValue);
@@ -213,6 +233,7 @@ var PinInputInput_default = /* @__PURE__ */ (0, vue.defineComponent)({
 					(0, vue.withKeys)(handleBackspace, ["backspace"]),
 					(0, vue.withKeys)(handleDelete, ["delete"])
 				],
+				onMousedown: handleMousedown,
 				onFocus: handleFocus,
 				onBlur: handleBlur,
 				onPaste: handlePaste,

package/dist/cjs/chunks/drawer-body.cjs

@@ -0,0 +1,73 @@
+const require_clsx = require("./clsx.cjs");
+const require__plugin_vue_export_helper = require("./_plugin-vue_export-helper.cjs");
+const require_dist = require("./dist.cjs");
+const require_Primitive = require("./Primitive.cjs");
+const require_useForwardExpose = require("./useForwardExpose.cjs");
+const require_DrawerRoot = require("./DrawerRoot.cjs");
+let vue = require("vue");
+//#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.41_typescript@6.0.3_/node_modules/reka-ui/dist/Drawer/DrawerViewport.js
+var DrawerViewport_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	__name: "DrawerViewport",
+	props: {
+		asChild: {
+			type: Boolean,
+			required: false
+		},
+		as: {
+			type: null,
+			required: false,
+			default: "div"
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const { forwardRef } = require_useForwardExpose.useForwardExpose();
+		const rootContext = require_DrawerRoot.injectDrawerRootContext();
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_Primitive.Primitive), (0, vue.mergeProps)(props, {
+				ref: (0, vue.unref)(forwardRef),
+				"data-drawer-viewport": "",
+				"data-state": (0, vue.unref)(rootContext).open.value ? "open" : "closed"
+			}), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["data-state"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/drawer/drawer-body.vue?vue&type=script&setup=true&lang.ts
+var drawer_body_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "drawer-body",
+	props: {
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
+		asChild: { type: Boolean },
+		as: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const delegated = require_dist.reactiveOmit(props, "class");
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(DrawerViewport_default), (0, vue.mergeProps)({ class: (0, vue.unref)(require_clsx.clsx)("celeste-drawer-body", props.class) }, (0, vue.unref)(delegated)), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", {}, void 0, true)]),
+				_: 3
+			}, 16, ["class"]);
+		};
+	}
+});
+//#endregion
+//#region src/components/drawer/drawer-body.vue
+var drawer_body_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(drawer_body_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-8f9ed572"]]);
+//#endregion
+Object.defineProperty(exports, "drawer_body_default", {
+	enumerable: true,
+	get: function() {
+		return drawer_body_default;
+	}
+});

package/dist/cjs/chunks/drawer-close.cjs

@@ -0,0 +1,27 @@
+const require_DrawerClose = require("./DrawerClose.cjs");
+let vue = require("vue");
+//#endregion
+//#region src/components/drawer/drawer-close.vue
+var drawer_close_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	__name: "drawer-close",
+	props: {
+		asChild: { type: Boolean },
+		as: {}
+	},
+	setup(__props) {
+		const props = __props;
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_DrawerClose.DrawerClose_default), (0, vue.normalizeProps)((0, vue.guardReactiveProps)(props)), {
+				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
+				_: 3
+			}, 16);
+		};
+	}
+});
+//#endregion
+Object.defineProperty(exports, "drawer_close_default", {
+	enumerable: true,
+	get: function() {
+		return drawer_close_default;
+	}
+});