@atscript/vue-form 0.1.58

package/dist/as-time-CQsxUs8P.mjs

@@ -0,0 +1,253 @@
+import { t as as_field_shell_default } from "./as-field-shell-Pdy3sAvr.mjs";
+import { t as as_adornment_shell_default } from "./as-adornment-shell-knFiB7Ct.mjs";
+import { n as as_date_control_default, t as useAsDate } from "./use-as-date-C39i9mzE.mjs";
+import { computed, createBlock, createVNode, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, unref, withCtx } from "vue";
+//#endregion
+//#region src/components/defaults/as-time.vue
+var as_time_default = /* @__PURE__ */ defineComponent({
+	__name: "as-time",
+	props: {
+		onBlur: {
+			type: Function,
+			required: true
+		},
+		error: {
+			type: String,
+			required: false
+		},
+		model: {
+			type: Object,
+			required: true
+		},
+		value: {
+			type: null,
+			required: false
+		},
+		label: {
+			type: String,
+			required: false
+		},
+		description: {
+			type: String,
+			required: false
+		},
+		hint: {
+			type: String,
+			required: false
+		},
+		placeholder: {
+			type: String,
+			required: false
+		},
+		prefixIcon: {
+			type: String,
+			required: false
+		},
+		suffixIcon: {
+			type: String,
+			required: false
+		},
+		class: {
+			type: [Object, String],
+			required: false
+		},
+		style: {
+			type: [Object, String],
+			required: false
+		},
+		optional: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		onToggleOptional: {
+			type: Function,
+			required: false
+		},
+		required: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		readonly: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		type: {
+			type: String,
+			required: true
+		},
+		formAction: {
+			type: Object,
+			required: false
+		},
+		name: {
+			type: String,
+			required: false
+		},
+		field: {
+			type: Object,
+			required: false
+		},
+		options: {
+			type: Array,
+			required: false
+		},
+		maxLength: {
+			type: Number,
+			required: false
+		},
+		autocomplete: {
+			type: String,
+			required: false
+		},
+		title: {
+			type: String,
+			required: false
+		},
+		level: {
+			type: Number,
+			required: false
+		},
+		onRemove: {
+			type: Function,
+			required: false
+		},
+		canRemove: {
+			type: Boolean,
+			required: false
+		},
+		removeLabel: {
+			type: String,
+			required: false
+		},
+		arrayIndex: {
+			type: Number,
+			required: false
+		},
+		path: {
+			type: String,
+			required: true
+		},
+		valueHelp: {
+			type: Object,
+			required: false
+		},
+		singularLabel: {
+			type: String,
+			required: false
+		},
+		inputId: {
+			type: String,
+			required: true
+		},
+		errorId: {
+			type: String,
+			required: true
+		},
+		descId: {
+			type: String,
+			required: true
+		},
+		ariaDescribedBy: {
+			type: String,
+			required: false
+		},
+		currencyCode: {
+			type: String,
+			required: false
+		},
+		unitCode: {
+			type: String,
+			required: false
+		},
+		precisionScale: {
+			type: Number,
+			required: false
+		},
+		prefix: {
+			type: String,
+			required: false
+		},
+		suffix: {
+			type: String,
+			required: false
+		},
+		scale: {
+			type: Number,
+			required: false
+		},
+		hasAdornment: {
+			type: Boolean,
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false
+		},
+		hidden: {
+			type: Boolean,
+			required: false
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const { inputType, displayValue, setFromInput } = useAsDate({
+			modelValue: () => props.model.value,
+			kind: "time",
+			onCommit: (v) => {
+				props.model.value = v;
+			}
+		});
+		const shellTitle = computed(() => props.currencyCode ?? props.unitCode ?? void 0);
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(as_field_shell_default, normalizeProps(guardReactiveProps(_ctx.$props)), {
+				default: withCtx(({ inputId }) => [__props.hasAdornment ? (openBlock(), createBlock(as_adornment_shell_default, {
+					key: 0,
+					"prefix-icon": __props.prefixIcon,
+					prefix: __props.prefix,
+					suffix: __props.suffix,
+					"suffix-icon": __props.suffixIcon,
+					error: __props.error,
+					required: __props.required,
+					title: shellTitle.value
+				}, {
+					default: withCtx(() => [createVNode(as_date_control_default, mergeProps(_ctx.$props, {
+						"input-id": inputId,
+						"input-type": unref(inputType),
+						"display-value": unref(displayValue),
+						"set-from-input": unref(setFromInput)
+					}), null, 16, [
+						"input-id",
+						"input-type",
+						"display-value",
+						"set-from-input"
+					])]),
+					_: 2
+				}, 1032, [
+					"prefix-icon",
+					"prefix",
+					"suffix",
+					"suffix-icon",
+					"error",
+					"required",
+					"title"
+				])) : (openBlock(), createBlock(as_date_control_default, mergeProps({ key: 1 }, _ctx.$props, {
+					"input-id": inputId,
+					"input-type": unref(inputType),
+					"display-value": unref(displayValue),
+					"set-from-input": unref(setFromInput)
+				}), null, 16, [
+					"input-id",
+					"input-type",
+					"display-value",
+					"set-from-input"
+				]))]),
+				_: 1
+			}, 16);
+		};
+	}
+});
+//#endregion
+export { as_time_default as t };

package/dist/as-time.cjs

@@ -0,0 +1,8 @@
+require("./use-form-context-Dwr8Ai1v.cjs");
+require("./use-as-dropdown-C-Qy7Vt0.cjs");
+require("./as-field-shell-B2iTn-iM.cjs");
+require("./as-variant-picker-DObQZHmm.cjs");
+require("./as-adornment-shell-9UmdNIPR.cjs");
+require("./use-as-date-B7CtcRQd.cjs");
+const require_as_time = require("./as-time-C24rvslH.cjs");
+module.exports = require_as_time.as_time_default;

package/dist/as-time.d.cts

@@ -0,0 +1,2 @@
+import { t as _default } from "./as-time.vue-nMEHLXke.cjs";
+export = _default;

package/dist/as-time.d.mts

@@ -0,0 +1,2 @@
+import { t as _default } from "./as-time.vue-huLx2B4l.mjs";
+export { _default as default };

package/dist/as-time.mjs

@@ -0,0 +1,8 @@
+import "./use-form-context-bAj7UoSe.mjs";
+import "./use-as-dropdown-BMnEm6jF.mjs";
+import "./as-field-shell-Pdy3sAvr.mjs";
+import "./as-variant-picker-BVs0AvjK.mjs";
+import "./as-adornment-shell-knFiB7Ct.mjs";
+import "./use-as-date-C39i9mzE.mjs";
+import { t as as_time_default } from "./as-time-CQsxUs8P.mjs";
+export { as_time_default as default };

package/dist/as-time.vue-huLx2B4l.d.mts

@@ -0,0 +1,9 @@
+import { i as TAsComponentProps } from "./types-Czm-Gtud.mjs";
+import * as vue from "vue";
+
+//#region src/components/defaults/as-time.vue.d.ts
+type __VLS_Props = TAsComponentProps<number | string | null | undefined>;
+declare const __VLS_export: vue.DefineComponent<__VLS_Props, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+//#endregion
+export { _default as t };

package/dist/as-time.vue-nMEHLXke.d.cts

@@ -0,0 +1,9 @@
+import { i as TAsComponentProps } from "./types-C4HRSxgV.cjs";
+import * as vue from "vue";
+
+//#region src/components/defaults/as-time.vue.d.ts
+type __VLS_Props = TAsComponentProps<number | string | null | undefined>;
+declare const __VLS_export: vue.DefineComponent<__VLS_Props, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+//#endregion
+export { _default as t };

package/dist/as-tuple-BU--cuuI.cjs

@@ -0,0 +1,351 @@
+const require_use_form_context = require("./use-form-context-Dwr8Ai1v.cjs");
+const require_as_field = require("./as-field-wLYoaZnT.cjs");
+const require_as_variant_picker = require("./as-variant-picker-DObQZHmm.cjs");
+const require_use_as_optional_add_flow = require("./use-as-optional-add-flow-STOaQWo9.cjs");
+const require_as_collapsible = require("./as-collapsible-CqxeJut7.cjs");
+const require_as_array_clear_btn = require("./as-array-clear-btn-DAGervXL.cjs");
+let vue = require("vue");
+let _atscript_ui = require("@atscript/ui");
+//#region src/composables/use-as-tuple.ts
+/** Composable for managing tuple field state. Fixed-length, position-typed; auto-fills missing positions on mount unless optional. */
+function useAsTuple(field) {
+	const { rootFormData, formContext, pathPrefix, getByPath, setByPath } = require_use_form_context.useFormContext("useAsTuple");
+	const handleChange = (0, vue.inject)(require_use_form_context.CHANGE_HANDLER_KEY, () => {});
+	const isOptional = field.prop.optional ?? false;
+	const itemFields = [];
+	const positionLabeled = [];
+	for (let i = 0; i < field.itemFields.length; i++) {
+		const itemField = field.itemFields[i];
+		const labeled = (0, _atscript_ui.getFieldMeta)(itemField.prop, _atscript_ui.META_LABEL) !== void 0;
+		const fallbackName = labeled ? "" : itemField.type;
+		itemFields.push({
+			...itemField,
+			path: String(i),
+			name: fallbackName
+		});
+		positionLabeled.push(labeled);
+	}
+	const isEmpty = (0, vue.computed)(() => {
+		const v = getByPath(pathPrefix.value);
+		return !Array.isArray(v) || v.length === 0;
+	});
+	function fillMissing() {
+		let arr = getByPath(pathPrefix.value);
+		if (!Array.isArray(arr)) {
+			arr = [];
+			setByPath(pathPrefix.value, arr);
+		}
+		const tail = arr;
+		if (tail.length >= itemFields.length) return;
+		const resolver = (0, _atscript_ui.createFormValueResolver)(rootFormData().value, formContext.value);
+		for (let i = tail.length; i < itemFields.length; i++) tail.push((0, _atscript_ui.createFormData)(field.itemFields[i].prop, resolver).value);
+		handleChange("array-add", pathPrefix.value, tail);
+	}
+	function clear() {
+		if (!isOptional) return;
+		setByPath(pathPrefix.value, void 0);
+		handleChange("array-remove", pathPrefix.value, void 0);
+	}
+	(0, vue.onMounted)(() => {
+		if (!isOptional) fillMissing();
+	});
+	return {
+		itemFields,
+		positionLabeled,
+		isOptional,
+		isEmpty,
+		clear,
+		fillMissing
+	};
+}
+//#endregion
+//#region src/components/defaults/as-tuple.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1 = {
+	key: 0,
+	class: "as-collapsible-description"
+};
+//#endregion
+//#region src/components/defaults/as-tuple.vue
+var as_tuple_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	__name: "as-tuple",
+	props: {
+		onBlur: {
+			type: Function,
+			required: true
+		},
+		error: {
+			type: String,
+			required: false
+		},
+		model: {
+			type: Object,
+			required: true
+		},
+		value: {
+			type: null,
+			required: false
+		},
+		label: {
+			type: String,
+			required: false
+		},
+		description: {
+			type: String,
+			required: false
+		},
+		hint: {
+			type: String,
+			required: false
+		},
+		placeholder: {
+			type: String,
+			required: false
+		},
+		prefixIcon: {
+			type: String,
+			required: false
+		},
+		suffixIcon: {
+			type: String,
+			required: false
+		},
+		class: {
+			type: [Object, String],
+			required: false
+		},
+		style: {
+			type: [Object, String],
+			required: false
+		},
+		optional: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		onToggleOptional: {
+			type: Function,
+			required: false
+		},
+		required: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		readonly: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		type: {
+			type: String,
+			required: true
+		},
+		formAction: {
+			type: Object,
+			required: false
+		},
+		name: {
+			type: String,
+			required: false
+		},
+		field: {
+			type: Object,
+			required: false
+		},
+		options: {
+			type: Array,
+			required: false
+		},
+		maxLength: {
+			type: Number,
+			required: false
+		},
+		autocomplete: {
+			type: String,
+			required: false
+		},
+		title: {
+			type: String,
+			required: false
+		},
+		level: {
+			type: Number,
+			required: false
+		},
+		onRemove: {
+			type: Function,
+			required: false
+		},
+		canRemove: {
+			type: Boolean,
+			required: false
+		},
+		removeLabel: {
+			type: String,
+			required: false
+		},
+		arrayIndex: {
+			type: Number,
+			required: false
+		},
+		path: {
+			type: String,
+			required: true
+		},
+		valueHelp: {
+			type: Object,
+			required: false
+		},
+		singularLabel: {
+			type: String,
+			required: false
+		},
+		inputId: {
+			type: String,
+			required: true
+		},
+		errorId: {
+			type: String,
+			required: true
+		},
+		descId: {
+			type: String,
+			required: true
+		},
+		ariaDescribedBy: {
+			type: String,
+			required: false
+		},
+		currencyCode: {
+			type: String,
+			required: false
+		},
+		unitCode: {
+			type: String,
+			required: false
+		},
+		precisionScale: {
+			type: Number,
+			required: false
+		},
+		prefix: {
+			type: String,
+			required: false
+		},
+		suffix: {
+			type: String,
+			required: false
+		},
+		scale: {
+			type: Number,
+			required: false
+		},
+		hasAdornment: {
+			type: Boolean,
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false
+		},
+		hidden: {
+			type: Boolean,
+			required: false
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const tupleField = props.field;
+		const unionCtx = require_use_form_context.useAsUnionVariant();
+		const hasVariantPicker = (0, vue.computed)(() => unionCtx !== void 0 && unionCtx.variants.length > 1);
+		const optionalEnabled = (0, vue.computed)(() => Array.isArray(props.model?.value));
+		const disabled = (0, vue.computed)(() => props.disabled ?? false);
+		const { itemFields, positionLabeled, isOptional, clear, fillMissing } = useAsTuple(tupleField);
+		const level = (0, vue.computed)(() => props.level ?? 0);
+		const defaultOpen = !isOptional;
+		const collapsibleRef = (0, vue.useTemplateRef)("collapsibleRef");
+		const { composeAction } = require_use_as_optional_add_flow.useAsOptionalAddFlow({ path: () => props.path });
+		function handleEnableOptional() {
+			collapsibleRef.value?.runAndFocusNew(composeAction(() => {
+				props.onToggleOptional?.(true);
+				fillMissing();
+			}), 2);
+		}
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)(require_as_collapsible.as_collapsible_default, {
+				ref_key: "collapsibleRef",
+				ref: collapsibleRef,
+				class: (0, vue.normalizeClass)(_ctx.$props.class),
+				title: __props.title,
+				"array-index": __props.arrayIndex,
+				description: __props.description,
+				level: level.value,
+				optional: !!__props.optional,
+				"optional-enabled": optionalEnabled.value,
+				path: __props.path,
+				error: __props.error,
+				hidden: __props.hidden,
+				"default-open": defaultOpen
+			}, (0, vue.createSlots)({
+				"title-extras": (0, vue.withCtx)(() => [hasVariantPicker.value ? ((0, vue.openBlock)(), (0, vue.createBlock)(require_as_variant_picker.as_variant_picker_default, {
+					key: 0,
+					"union-context": (0, vue.unref)(unionCtx),
+					disabled: disabled.value
+				}, null, 8, ["union-context", "disabled"])) : (0, vue.createCommentVNode)("v-if", true)]),
+				body: (0, vue.withCtx)(() => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(itemFields), (itemField, i) => {
+					return (0, vue.openBlock)(), (0, vue.createBlock)(require_as_field.as_field_default, {
+						key: i,
+						field: itemField,
+						"array-index": (0, vue.unref)(positionLabeled)[i] ? void 0 : i
+					}, null, 8, ["field", "array-index"]);
+				}), 128))]),
+				empty: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(["as-object-empty as-grid-item", _ctx.$props.class]) }, [(0, vue.createElementVNode)("button", {
+					type: "button",
+					class: "as-object-empty-add",
+					onClick: handleEnableOptional
+				}, [_cache[0] || (_cache[0] = (0, vue.createElementVNode)("span", {
+					class: "i-as-field-fill as-object-empty-add-icon",
+					"aria-hidden": "true"
+				}, null, -1)), (0, vue.createTextVNode)(" Add " + (0, vue.toDisplayString)(__props.title), 1)]), __props.description ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("p", _hoisted_1, (0, vue.toDisplayString)(__props.description), 1)) : (0, vue.createCommentVNode)("v-if", true)], 2), [[vue.vShow, !__props.hidden]])]),
+				_: 2
+			}, [(0, vue.unref)(isOptional) && optionalEnabled.value ? {
+				name: "actions",
+				fn: (0, vue.withCtx)(() => [(0, vue.createVNode)(require_as_array_clear_btn.as_array_clear_btn_default, {
+					optional: true,
+					label: __props.title,
+					disabled: disabled.value,
+					onClear: (0, vue.unref)(clear)
+				}, null, 8, [
+					"label",
+					"disabled",
+					"onClear"
+				])]),
+				key: "0"
+			} : void 0]), 1032, [
+				"class",
+				"title",
+				"array-index",
+				"description",
+				"level",
+				"optional",
+				"optional-enabled",
+				"path",
+				"error",
+				"hidden"
+			]);
+		};
+	}
+});
+//#endregion
+Object.defineProperty(exports, "as_tuple_default", {
+	enumerable: true,
+	get: function() {
+		return as_tuple_default;
+	}
+});
+Object.defineProperty(exports, "useAsTuple", {
+	enumerable: true,
+	get: function() {
+		return useAsTuple;
+	}
+});