@morscherlab/mint-sdk 1.0.0-rc.9 → 1.0.1

package/dist/BaseModal-B9UA8Y_I.js

@@ -0,0 +1,165 @@
+import { t as useEventListener } from "./useEventListener-CfVkP9Xz.js";
+import { Teleport, Transition, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, nextTick, normalizeClass, onUnmounted, openBlock, ref, renderSlot, toDisplayString, watch, withCtx } from "vue";
+//#region src/components/BaseModal.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	key: 0,
+	class: "mint-modal__grab-hint",
+	"aria-hidden": "true"
+};
+var _hoisted_2 = {
+	key: 1,
+	class: "mint-modal__header"
+};
+var _hoisted_3 = {
+	key: 0,
+	class: "mint-modal__header-text"
+};
+var _hoisted_4 = {
+	key: 0,
+	class: "mint-modal__title"
+};
+var _hoisted_5 = {
+	key: 1,
+	class: "mint-modal__subtitle"
+};
+var _hoisted_6 = { class: "mint-modal__body" };
+var _hoisted_7 = {
+	key: 2,
+	class: "mint-modal__footer"
+};
+//#endregion
+//#region src/components/BaseModal.vue
+var BaseModal_default = /* @__PURE__ */ defineComponent({
+	__name: "BaseModal",
+	props: {
+		modelValue: { type: Boolean },
+		title: {},
+		subtitle: {},
+		size: { default: "md" },
+		variant: { default: "centered" },
+		closable: {
+			type: Boolean,
+			default: true
+		},
+		closeOnOverlay: {
+			type: Boolean,
+			default: false
+		},
+		closeOnEscape: {
+			type: Boolean,
+			default: true
+		}
+	},
+	emits: ["update:modelValue", "close"],
+	setup(__props, { emit: __emit }) {
+		/** Modal dialog with backdrop, focus trap, Escape-to-close, and configurable size/variant. */
+		const props = __props;
+		const emit = __emit;
+		const containerRef = ref(null);
+		let previouslyFocused = null;
+		const FOCUSABLE_SELECTOR = [
+			"a[href]",
+			"button:not([disabled])",
+			"input:not([disabled])",
+			"select:not([disabled])",
+			"textarea:not([disabled])",
+			"[tabindex]:not([tabindex=\"-1\"])"
+		].join(", ");
+		function getFocusableElements() {
+			if (!containerRef.value) return [];
+			return Array.from(containerRef.value.querySelectorAll(FOCUSABLE_SELECTOR));
+		}
+		function handleKeydown(event) {
+			if (event.key === "Escape" && props.closeOnEscape && props.modelValue) {
+				close();
+				return;
+			}
+			if (event.key !== "Tab" || !containerRef.value) return;
+			const focusable = getFocusableElements();
+			if (focusable.length === 0) {
+				event.preventDefault();
+				return;
+			}
+			const first = focusable[0];
+			const last = focusable[focusable.length - 1];
+			if (event.shiftKey && document.activeElement === first) {
+				event.preventDefault();
+				last.focus();
+			} else if (!event.shiftKey && document.activeElement === last) {
+				event.preventDefault();
+				first.focus();
+			}
+		}
+		function close() {
+			if (props.closable) {
+				emit("update:modelValue", false);
+				emit("close");
+			}
+		}
+		function handleOverlayClick(event) {
+			if (props.closeOnOverlay && event.target === event.currentTarget) close();
+		}
+		watch(() => props.modelValue, async (isOpen) => {
+			if (isOpen) {
+				previouslyFocused = document.activeElement;
+				document.body.style.overflow = "hidden";
+				await nextTick();
+				const focusable = getFocusableElements();
+				if (focusable.length > 0) focusable[0].focus();
+				else containerRef.value?.focus();
+			} else {
+				document.body.style.overflow = "";
+				previouslyFocused?.focus();
+				previouslyFocused = null;
+			}
+		});
+		useEventListener(() => document, "keydown", handleKeydown);
+		onUnmounted(() => {
+			document.body.style.overflow = "";
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(Teleport, { to: "body" }, [createVNode(Transition, { name: `modal-${__props.variant}` }, {
+				default: withCtx(() => [__props.modelValue ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: normalizeClass(["mint-modal", `mint-modal--${__props.variant}`]),
+					onClick: handleOverlayClick
+				}, [_cache[1] || (_cache[1] = createElementVNode("div", { class: "mint-modal__overlay" }, null, -1)), createElementVNode("div", {
+					ref_key: "containerRef",
+					ref: containerRef,
+					class: normalizeClass([
+						"mint-modal__container",
+						`mint-modal__container--${__props.size}`,
+						`mint-modal__container--${__props.variant}`
+					]),
+					role: "dialog",
+					"aria-modal": "true",
+					tabindex: "-1"
+				}, [
+					__props.variant === "sheet" ? (openBlock(), createElementBlock("div", _hoisted_1)) : createCommentVNode("", true),
+					__props.title || __props.subtitle || __props.closable || _ctx.$slots.header ? (openBlock(), createElementBlock("div", _hoisted_2, [__props.title || __props.subtitle || _ctx.$slots.header ? (openBlock(), createElementBlock("div", _hoisted_3, [renderSlot(_ctx.$slots, "header", {}, () => [__props.title ? (openBlock(), createElementBlock("h3", _hoisted_4, toDisplayString(__props.title), 1)) : createCommentVNode("", true), __props.subtitle ? (openBlock(), createElementBlock("p", _hoisted_5, toDisplayString(__props.subtitle), 1)) : createCommentVNode("", true)])])) : createCommentVNode("", true), __props.closable ? (openBlock(), createElementBlock("button", {
+						key: 1,
+						type: "button",
+						class: "mint-modal__close",
+						"aria-label": "Close modal",
+						onClick: close
+					}, [..._cache[0] || (_cache[0] = [createElementVNode("svg", {
+						class: "mint-modal__close-icon",
+						fill: "none",
+						stroke: "currentColor",
+						"stroke-width": "2",
+						"stroke-linecap": "round",
+						"stroke-linejoin": "round",
+						viewBox: "0 0 24 24"
+					}, [createElementVNode("path", { d: "M18 6 6 18" }), createElementVNode("path", { d: "m6 6 12 12" })], -1)])])) : createCommentVNode("", true)])) : createCommentVNode("", true),
+					createElementVNode("div", _hoisted_6, [renderSlot(_ctx.$slots, "default")]),
+					_ctx.$slots.footer ? (openBlock(), createElementBlock("div", _hoisted_7, [renderSlot(_ctx.$slots, "footer")])) : createCommentVNode("", true)
+				], 2)], 2)) : createCommentVNode("", true)]),
+				_: 3
+			}, 8, ["name"])]);
+		};
+	}
+});
+//#endregion
+export { BaseModal_default as t };
+
+//# sourceMappingURL=BaseModal-B9UA8Y_I.js.map

package/dist/BaseModal-B9UA8Y_I.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseModal-B9UA8Y_I.js","names":["$slots"],"sources":["../src/components/BaseModal.vue","../src/components/BaseModal.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/** Modal dialog with backdrop, focus trap, Escape-to-close, and configurable size/variant. */\nimport { ref, watch, nextTick, onUnmounted } from 'vue'\nimport type { ModalSize, ModalVariant } from '../types'\nimport { useEventListener } from '../composables/useEventListener'\n\ninterface Props {\n  modelValue: boolean\n  title?: string\n  subtitle?: string\n  size?: ModalSize\n  variant?: ModalVariant\n  closable?: boolean\n  closeOnOverlay?: boolean\n  closeOnEscape?: boolean\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  size: 'md',\n  variant: 'centered',\n  closable: true,\n  closeOnOverlay: false,\n  closeOnEscape: true,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean]\n  close: []\n}>()\n\nconst containerRef = ref<HTMLElement | null>(null)\nlet previouslyFocused: HTMLElement | null = null\n\nconst FOCUSABLE_SELECTOR = [\n  'a[href]',\n  'button:not([disabled])',\n  'input:not([disabled])',\n  'select:not([disabled])',\n  'textarea:not([disabled])',\n  '[tabindex]:not([tabindex=\"-1\"])',\n].join(', ')\n\nfunction getFocusableElements(): HTMLElement[] {\n  if (!containerRef.value) return []\n  return Array.from(containerRef.value.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR))\n}\n\nfunction handleKeydown(event: KeyboardEvent) {\n  if (event.key === 'Escape' && props.closeOnEscape && props.modelValue) {\n    close()\n    return\n  }\n\n  if (event.key !== 'Tab' || !containerRef.value) return\n\n  const focusable = getFocusableElements()\n  if (focusable.length === 0) {\n    event.preventDefault()\n    return\n  }\n\n  const first = focusable[0]\n  const last = focusable[focusable.length - 1]\n\n  if (event.shiftKey && document.activeElement === first) {\n    event.preventDefault()\n    last.focus()\n  } else if (!event.shiftKey && document.activeElement === last) {\n    event.preventDefault()\n    first.focus()\n  }\n}\n\nfunction close() {\n  if (props.closable) {\n    emit('update:modelValue', false)\n    emit('close')\n  }\n}\n\nfunction handleOverlayClick(event: MouseEvent) {\n  if (props.closeOnOverlay && event.target === event.currentTarget) {\n    close()\n  }\n}\n\nwatch(() => props.modelValue, async (isOpen) => {\n  if (isOpen) {\n    previouslyFocused = document.activeElement as HTMLElement | null\n    document.body.style.overflow = 'hidden'\n    await nextTick()\n    const focusable = getFocusableElements()\n    if (focusable.length > 0) {\n      focusable[0].focus()\n    } else {\n      containerRef.value?.focus()\n    }\n  } else {\n    document.body.style.overflow = ''\n    previouslyFocused?.focus()\n    previouslyFocused = null\n  }\n})\n\nuseEventListener(() => document, 'keydown', handleKeydown)\n\nonUnmounted(() => {\n  document.body.style.overflow = ''\n})\n</script>\n\n<template>\n  <Teleport to=\"body\">\n    <Transition :name=\"`modal-${variant}`\">\n      <div\n        v-if=\"modelValue\"\n        :class=\"['mint-modal', `mint-modal--${variant}`]\"\n        @click=\"handleOverlayClick\"\n      >\n        <!-- Overlay -->\n        <div class=\"mint-modal__overlay\" />\n\n        <!-- Modal -->\n        <div\n          ref=\"containerRef\"\n          :class=\"[\n            'mint-modal__container',\n            `mint-modal__container--${size}`,\n            `mint-modal__container--${variant}`,\n          ]\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          tabindex=\"-1\"\n        >\n          <!-- Sheet grab-hint bar (sheet variant only) -->\n          <div v-if=\"variant === 'sheet'\" class=\"mint-modal__grab-hint\" aria-hidden=\"true\" />\n\n          <!-- Header -->\n          <div v-if=\"title || subtitle || closable || $slots.header\" class=\"mint-modal__header\">\n            <div v-if=\"title || subtitle || $slots.header\" class=\"mint-modal__header-text\">\n              <slot name=\"header\">\n                <h3 v-if=\"title\" class=\"mint-modal__title\">\n                  {{ title }}\n                </h3>\n                <p v-if=\"subtitle\" class=\"mint-modal__subtitle\">\n                  {{ subtitle }}\n                </p>\n              </slot>\n            </div>\n            <button\n              v-if=\"closable\"\n              type=\"button\"\n              class=\"mint-modal__close\"\n              aria-label=\"Close modal\"\n              @click=\"close\"\n            >\n              <svg class=\"mint-modal__close-icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" viewBox=\"0 0 24 24\">\n                <path d=\"M18 6 6 18\" /><path d=\"m6 6 12 12\" />\n              </svg>\n            </button>\n          </div>\n\n          <!-- Body -->\n          <div class=\"mint-modal__body\">\n            <slot />\n          </div>\n\n          <!-- Footer -->\n          <div v-if=\"$slots.footer\" class=\"mint-modal__footer\">\n            <slot name=\"footer\" />\n          </div>\n        </div>\n      </div>\n    </Transition>\n  </Teleport>\n</template>\n\n<style>\n@import '../styles/components/modal.css';\n</style>\n","<script setup lang=\"ts\">\n/** Modal dialog with backdrop, focus trap, Escape-to-close, and configurable size/variant. */\nimport { ref, watch, nextTick, onUnmounted } from 'vue'\nimport type { ModalSize, ModalVariant } from '../types'\nimport { useEventListener } from '../composables/useEventListener'\n\ninterface Props {\n  modelValue: boolean\n  title?: string\n  subtitle?: string\n  size?: ModalSize\n  variant?: ModalVariant\n  closable?: boolean\n  closeOnOverlay?: boolean\n  closeOnEscape?: boolean\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  size: 'md',\n  variant: 'centered',\n  closable: true,\n  closeOnOverlay: false,\n  closeOnEscape: true,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean]\n  close: []\n}>()\n\nconst containerRef = ref<HTMLElement | null>(null)\nlet previouslyFocused: HTMLElement | null = null\n\nconst FOCUSABLE_SELECTOR = [\n  'a[href]',\n  'button:not([disabled])',\n  'input:not([disabled])',\n  'select:not([disabled])',\n  'textarea:not([disabled])',\n  '[tabindex]:not([tabindex=\"-1\"])',\n].join(', ')\n\nfunction getFocusableElements(): HTMLElement[] {\n  if (!containerRef.value) return []\n  return Array.from(containerRef.value.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR))\n}\n\nfunction handleKeydown(event: KeyboardEvent) {\n  if (event.key === 'Escape' && props.closeOnEscape && props.modelValue) {\n    close()\n    return\n  }\n\n  if (event.key !== 'Tab' || !containerRef.value) return\n\n  const focusable = getFocusableElements()\n  if (focusable.length === 0) {\n    event.preventDefault()\n    return\n  }\n\n  const first = focusable[0]\n  const last = focusable[focusable.length - 1]\n\n  if (event.shiftKey && document.activeElement === first) {\n    event.preventDefault()\n    last.focus()\n  } else if (!event.shiftKey && document.activeElement === last) {\n    event.preventDefault()\n    first.focus()\n  }\n}\n\nfunction close() {\n  if (props.closable) {\n    emit('update:modelValue', false)\n    emit('close')\n  }\n}\n\nfunction handleOverlayClick(event: MouseEvent) {\n  if (props.closeOnOverlay && event.target === event.currentTarget) {\n    close()\n  }\n}\n\nwatch(() => props.modelValue, async (isOpen) => {\n  if (isOpen) {\n    previouslyFocused = document.activeElement as HTMLElement | null\n    document.body.style.overflow = 'hidden'\n    await nextTick()\n    const focusable = getFocusableElements()\n    if (focusable.length > 0) {\n      focusable[0].focus()\n    } else {\n      containerRef.value?.focus()\n    }\n  } else {\n    document.body.style.overflow = ''\n    previouslyFocused?.focus()\n    previouslyFocused = null\n  }\n})\n\nuseEventListener(() => document, 'keydown', handleKeydown)\n\nonUnmounted(() => {\n  document.body.style.overflow = ''\n})\n</script>\n\n<template>\n  <Teleport to=\"body\">\n    <Transition :name=\"`modal-${variant}`\">\n      <div\n        v-if=\"modelValue\"\n        :class=\"['mint-modal', `mint-modal--${variant}`]\"\n        @click=\"handleOverlayClick\"\n      >\n        <!-- Overlay -->\n        <div class=\"mint-modal__overlay\" />\n\n        <!-- Modal -->\n        <div\n          ref=\"containerRef\"\n          :class=\"[\n            'mint-modal__container',\n            `mint-modal__container--${size}`,\n            `mint-modal__container--${variant}`,\n          ]\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          tabindex=\"-1\"\n        >\n          <!-- Sheet grab-hint bar (sheet variant only) -->\n          <div v-if=\"variant === 'sheet'\" class=\"mint-modal__grab-hint\" aria-hidden=\"true\" />\n\n          <!-- Header -->\n          <div v-if=\"title || subtitle || closable || $slots.header\" class=\"mint-modal__header\">\n            <div v-if=\"title || subtitle || $slots.header\" class=\"mint-modal__header-text\">\n              <slot name=\"header\">\n                <h3 v-if=\"title\" class=\"mint-modal__title\">\n                  {{ title }}\n                </h3>\n                <p v-if=\"subtitle\" class=\"mint-modal__subtitle\">\n                  {{ subtitle }}\n                </p>\n              </slot>\n            </div>\n            <button\n              v-if=\"closable\"\n              type=\"button\"\n              class=\"mint-modal__close\"\n              aria-label=\"Close modal\"\n              @click=\"close\"\n            >\n              <svg class=\"mint-modal__close-icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" viewBox=\"0 0 24 24\">\n                <path d=\"M18 6 6 18\" /><path d=\"m6 6 12 12\" />\n              </svg>\n            </button>\n          </div>\n\n          <!-- Body -->\n          <div class=\"mint-modal__body\">\n            <slot />\n          </div>\n\n          <!-- Footer -->\n          <div v-if=\"$slots.footer\" class=\"mint-modal__footer\">\n            <slot name=\"footer\" />\n          </div>\n        </div>\n      </div>\n    </Transition>\n  </Teleport>\n</template>\n\n<style>\n@import '../styles/components/modal.css';\n</style>\n"],"mappings":"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"}

package/dist/BaseSelect-DksaKYq_.js

@@ -0,0 +1,176 @@
+import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, renderList, toDisplayString } from "vue";
+//#region src/components/BaseInput.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$1 = [
+	"type",
+	"value",
+	"placeholder",
+	"disabled",
+	"readonly",
+	"autocomplete",
+	"autofocus",
+	"min",
+	"max",
+	"step",
+	"aria-invalid",
+	"aria-describedby"
+];
+//#endregion
+//#region src/components/BaseInput.vue
+var BaseInput_default = /* @__PURE__ */ defineComponent({
+	__name: "BaseInput",
+	props: {
+		modelValue: {},
+		type: { default: "text" },
+		placeholder: {},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		readonly: {
+			type: Boolean,
+			default: false
+		},
+		error: {
+			type: Boolean,
+			default: false
+		},
+		size: { default: "md" },
+		autocomplete: {},
+		autofocus: { type: Boolean },
+		min: {},
+		max: {},
+		step: {},
+		ariaDescribedby: {}
+	},
+	emits: [
+		"update:modelValue",
+		"focus",
+		"blur",
+		"keydown"
+	],
+	setup(__props, { emit: __emit }) {
+		/** Renders a styled `<input>` supporting text/number/email types, size, error, and readonly states. */
+		const props = __props;
+		const emit = __emit;
+		function handleInput(event) {
+			const target = event.target;
+			emit("update:modelValue", props.type === "number" ? target.value === "" ? null : Number(target.value) : target.value);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("input", {
+				type: __props.type,
+				value: __props.modelValue,
+				placeholder: __props.placeholder,
+				disabled: __props.disabled,
+				readonly: __props.readonly,
+				autocomplete: __props.autocomplete,
+				autofocus: __props.autofocus,
+				min: __props.min,
+				max: __props.max,
+				step: __props.step,
+				"aria-invalid": __props.error || void 0,
+				"aria-describedby": __props.ariaDescribedby || void 0,
+				class: normalizeClass([
+					"mint-input",
+					`mint-input--${__props.size}`,
+					__props.error ? "mint-input--error" : "",
+					__props.disabled ? "mint-input--disabled" : ""
+				]),
+				onInput: handleInput,
+				onFocus: _cache[0] || (_cache[0] = ($event) => emit("focus", $event)),
+				onBlur: _cache[1] || (_cache[1] = ($event) => emit("blur", $event)),
+				onKeydown: _cache[2] || (_cache[2] = ($event) => emit("keydown", $event))
+			}, null, 42, _hoisted_1$1);
+		};
+	}
+});
+//#endregion
+//#region src/utils/options.ts
+function normalizeOptionInput(option) {
+	if (typeof option === "object") return option;
+	return {
+		value: option,
+		label: String(option)
+	};
+}
+function findOptionByDomValue(options, value) {
+	return options.find((option) => String(option.value) === value);
+}
+//#endregion
+//#region src/components/BaseSelect.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "mint-select" };
+var _hoisted_2 = [
+	"value",
+	"disabled",
+	"aria-invalid",
+	"aria-describedby"
+];
+var _hoisted_3 = {
+	key: 0,
+	value: "",
+	disabled: ""
+};
+var _hoisted_4 = ["value", "disabled"];
+//#endregion
+//#region src/components/BaseSelect.vue
+var BaseSelect_default = /* @__PURE__ */ defineComponent({
+	__name: "BaseSelect",
+	props: {
+		modelValue: {},
+		options: {},
+		placeholder: {},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		error: {
+			type: Boolean,
+			default: false
+		},
+		size: { default: "md" },
+		ariaDescribedby: {}
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		/** Renders a native `<select>` element with size, error, and disabled states. */
+		const props = __props;
+		const emit = __emit;
+		const normalizedOptions = computed(() => props.options.map(normalizeOptionInput));
+		function handleChange(event) {
+			const target = event.target;
+			emit("update:modelValue", findOptionByDomValue(normalizedOptions.value, target.value)?.value ?? target.value);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1, [createElementVNode("select", {
+				value: __props.modelValue,
+				disabled: __props.disabled,
+				"aria-invalid": __props.error || void 0,
+				"aria-describedby": __props.ariaDescribedby || void 0,
+				class: normalizeClass([
+					"mint-select__control",
+					`mint-select__control--${__props.size}`,
+					__props.error ? "mint-select__control--error" : "",
+					__props.disabled ? "mint-select__control--disabled" : ""
+				]),
+				onChange: handleChange
+			}, [__props.placeholder ? (openBlock(), createElementBlock("option", _hoisted_3, toDisplayString(__props.placeholder), 1)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(normalizedOptions.value, (option) => {
+				return openBlock(), createElementBlock("option", {
+					key: String(option.value),
+					value: option.value,
+					disabled: option.disabled
+				}, toDisplayString(option.label), 9, _hoisted_4);
+			}), 128))], 42, _hoisted_2), _cache[0] || (_cache[0] = createElementVNode("div", { class: "mint-select__icon" }, [createElementVNode("svg", {
+				fill: "none",
+				stroke: "currentColor",
+				"stroke-width": "2",
+				"stroke-linecap": "round",
+				"stroke-linejoin": "round",
+				viewBox: "0 0 24 24"
+			}, [createElementVNode("path", { d: "m6 9 6 6 6-6" })])], -1))]);
+		};
+	}
+});
+//#endregion
+export { normalizeOptionInput as n, BaseInput_default as r, BaseSelect_default as t };
+
+//# sourceMappingURL=BaseSelect-DksaKYq_.js.map

package/dist/BaseSelect-DksaKYq_.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseSelect-DksaKYq_.js","names":[],"sources":["../src/components/BaseInput.vue","../src/components/BaseInput.vue","../src/utils/options.ts","../src/components/BaseSelect.vue","../src/components/BaseSelect.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/** Renders a styled `<input>` supporting text/number/email types, size, error, and readonly states. */\nimport type { InputType } from '../types'\n\ninterface Props {\n  modelValue?: string | number\n  type?: InputType\n  placeholder?: string\n  disabled?: boolean\n  readonly?: boolean\n  error?: boolean\n  size?: 'sm' | 'md' | 'lg'\n  autocomplete?: string\n  autofocus?: boolean\n  min?: number\n  max?: number\n  step?: number\n  ariaDescribedby?: string\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  type: 'text',\n  disabled: false,\n  readonly: false,\n  error: false,\n  size: 'md',\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | number | null]\n  focus: [event: FocusEvent]\n  blur: [event: FocusEvent]\n  keydown: [event: KeyboardEvent]\n}>()\n\nfunction handleInput(event: Event) {\n  const target = event.target as HTMLInputElement\n  const value = props.type === 'number'\n    ? (target.value === '' ? null : Number(target.value))\n    : target.value\n  emit('update:modelValue', value as string | number)\n}\n</script>\n\n<template>\n  <input\n    :type=\"type\"\n    :value=\"modelValue\"\n    :placeholder=\"placeholder\"\n    :disabled=\"disabled\"\n    :readonly=\"readonly\"\n    :autocomplete=\"autocomplete\"\n    :autofocus=\"autofocus\"\n    :min=\"min\"\n    :max=\"max\"\n    :step=\"step\"\n    :aria-invalid=\"error || undefined\"\n    :aria-describedby=\"ariaDescribedby || undefined\"\n    :class=\"[\n      'mint-input',\n      `mint-input--${size}`,\n      error ? 'mint-input--error' : '',\n      disabled ? 'mint-input--disabled' : '',\n    ]\"\n    @input=\"handleInput\"\n    @focus=\"emit('focus', $event)\"\n    @blur=\"emit('blur', $event)\"\n    @keydown=\"emit('keydown', $event)\"\n  />\n</template>\n\n<style>\n@import '../styles/components/input.css';\n</style>\n","<script setup lang=\"ts\">\n/** Renders a styled `<input>` supporting text/number/email types, size, error, and readonly states. */\nimport type { InputType } from '../types'\n\ninterface Props {\n  modelValue?: string | number\n  type?: InputType\n  placeholder?: string\n  disabled?: boolean\n  readonly?: boolean\n  error?: boolean\n  size?: 'sm' | 'md' | 'lg'\n  autocomplete?: string\n  autofocus?: boolean\n  min?: number\n  max?: number\n  step?: number\n  ariaDescribedby?: string\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  type: 'text',\n  disabled: false,\n  readonly: false,\n  error: false,\n  size: 'md',\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | number | null]\n  focus: [event: FocusEvent]\n  blur: [event: FocusEvent]\n  keydown: [event: KeyboardEvent]\n}>()\n\nfunction handleInput(event: Event) {\n  const target = event.target as HTMLInputElement\n  const value = props.type === 'number'\n    ? (target.value === '' ? null : Number(target.value))\n    : target.value\n  emit('update:modelValue', value as string | number)\n}\n</script>\n\n<template>\n  <input\n    :type=\"type\"\n    :value=\"modelValue\"\n    :placeholder=\"placeholder\"\n    :disabled=\"disabled\"\n    :readonly=\"readonly\"\n    :autocomplete=\"autocomplete\"\n    :autofocus=\"autofocus\"\n    :min=\"min\"\n    :max=\"max\"\n    :step=\"step\"\n    :aria-invalid=\"error || undefined\"\n    :aria-describedby=\"ariaDescribedby || undefined\"\n    :class=\"[\n      'mint-input',\n      `mint-input--${size}`,\n      error ? 'mint-input--error' : '',\n      disabled ? 'mint-input--disabled' : '',\n    ]\"\n    @input=\"handleInput\"\n    @focus=\"emit('focus', $event)\"\n    @blur=\"emit('blur', $event)\"\n    @keydown=\"emit('keydown', $event)\"\n  />\n</template>\n\n<style>\n@import '../styles/components/input.css';\n</style>\n","export type OptionLike<TValue extends string | number> = {\n  value: TValue\n  label: string\n}\n\nexport function normalizeOptionInput<\n  TValue extends string | number,\n  TOption extends OptionLike<TValue>,\n>(option: TOption | TValue): TOption {\n  if (typeof option === 'object') return option\n\n  return {\n    value: option,\n    label: String(option),\n  } as TOption\n}\n\nexport function findOptionByDomValue<\n  TValue extends string | number,\n  TOption extends OptionLike<TValue>,\n>(options: TOption[], value: string): TOption | undefined {\n  return options.find(option => String(option.value) === value)\n}\n","<script setup lang=\"ts\">\n/** Renders a native `<select>` element with size, error, and disabled states. */\nimport { computed } from 'vue'\nimport type { SelectOption, SelectOptionInput } from '../types'\nimport { findOptionByDomValue, normalizeOptionInput } from '../utils/options'\n\ninterface Props {\n  modelValue?: string | number\n  options: SelectOptionInput<string | number>[]\n  placeholder?: string\n  disabled?: boolean\n  error?: boolean\n  size?: 'sm' | 'md' | 'lg'\n  ariaDescribedby?: string\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  disabled: false,\n  error: false,\n  size: 'md',\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | number]\n}>()\n\nconst normalizedOptions = computed<SelectOption<string | number>[]>(() =>\n  props.options.map(normalizeOptionInput)\n)\n\nfunction handleChange(event: Event) {\n  const target = event.target as HTMLSelectElement\n  const option = findOptionByDomValue(normalizedOptions.value, target.value)\n  emit('update:modelValue', option?.value ?? target.value)\n}\n</script>\n\n<template>\n  <div class=\"mint-select\">\n    <select\n      :value=\"modelValue\"\n      :disabled=\"disabled\"\n      :aria-invalid=\"error || undefined\"\n      :aria-describedby=\"ariaDescribedby || undefined\"\n      :class=\"[\n        'mint-select__control',\n        `mint-select__control--${size}`,\n        error ? 'mint-select__control--error' : '',\n        disabled ? 'mint-select__control--disabled' : '',\n      ]\"\n      @change=\"handleChange\"\n    >\n      <option v-if=\"placeholder\" value=\"\" disabled>\n        {{ placeholder }}\n      </option>\n      <option\n        v-for=\"option in normalizedOptions\"\n        :key=\"String(option.value)\"\n        :value=\"option.value\"\n        :disabled=\"option.disabled\"\n      >\n        {{ option.label }}\n      </option>\n    </select>\n    <div class=\"mint-select__icon\">\n      <svg fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" viewBox=\"0 0 24 24\">\n        <path d=\"m6 9 6 6 6-6\" />\n      </svg>\n    </div>\n  </div>\n</template>\n\n<style>\n@import '../styles/components/select.css';\n</style>\n","<script setup lang=\"ts\">\n/** Renders a native `<select>` element with size, error, and disabled states. */\nimport { computed } from 'vue'\nimport type { SelectOption, SelectOptionInput } from '../types'\nimport { findOptionByDomValue, normalizeOptionInput } from '../utils/options'\n\ninterface Props {\n  modelValue?: string | number\n  options: SelectOptionInput<string | number>[]\n  placeholder?: string\n  disabled?: boolean\n  error?: boolean\n  size?: 'sm' | 'md' | 'lg'\n  ariaDescribedby?: string\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  disabled: false,\n  error: false,\n  size: 'md',\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | number]\n}>()\n\nconst normalizedOptions = computed<SelectOption<string | number>[]>(() =>\n  props.options.map(normalizeOptionInput)\n)\n\nfunction handleChange(event: Event) {\n  const target = event.target as HTMLSelectElement\n  const option = findOptionByDomValue(normalizedOptions.value, target.value)\n  emit('update:modelValue', option?.value ?? target.value)\n}\n</script>\n\n<template>\n  <div class=\"mint-select\">\n    <select\n      :value=\"modelValue\"\n      :disabled=\"disabled\"\n      :aria-invalid=\"error || undefined\"\n      :aria-describedby=\"ariaDescribedby || undefined\"\n      :class=\"[\n        'mint-select__control',\n        `mint-select__control--${size}`,\n        error ? 'mint-select__control--error' : '',\n        disabled ? 'mint-select__control--disabled' : '',\n      ]\"\n      @change=\"handleChange\"\n    >\n      <option v-if=\"placeholder\" value=\"\" disabled>\n        {{ placeholder }}\n      </option>\n      <option\n        v-for=\"option in normalizedOptions\"\n        :key=\"String(option.value)\"\n        :value=\"option.value\"\n        :disabled=\"option.disabled\"\n      >\n        {{ option.label }}\n      </option>\n    </select>\n    <div class=\"mint-select__icon\">\n      <svg fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" viewBox=\"0 0 24 24\">\n        <path d=\"m6 9 6 6 6-6\" />\n      </svg>\n    </div>\n  </div>\n</template>\n\n<style>\n@import '../styles/components/select.css';\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ECoBA,MAAM,QAAQ;EAQd,MAAM,OAAO;EAOb,SAAS,YAAY,OAAc;GACjC,MAAM,SAAS,MAAM;AAIrB,QAAK,qBAHS,MAAM,SAAS,WACxB,OAAO,UAAU,KAAK,OAAO,OAAO,OAAO,MAAM,GAClD,OAAO,MACuC;;;uBAKlD,mBAuBE,SAAA;IAtBC,MAAM,QAAA;IACN,OAAO,QAAA;IACP,aAAa,QAAA;IACb,UAAU,QAAA;IACV,UAAU,QAAA;IACV,cAAc,QAAA;IACd,WAAW,QAAA;IACX,KAAK,QAAA;IACL,KAAK,QAAA;IACL,MAAM,QAAA;IACN,gBAAc,QAAA,SAAS,KAAA;IACvB,oBAAkB,QAAA,mBAAmB,KAAA;IACrC,OAAK,eAAA;;oBAA6C,QAAA;KAAc,QAAA,QAAK,sBAAA;KAAmC,QAAA,WAAQ,yBAAA;;IAMhH,SAAO;IACP,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,SAAU,OAAM;IAC3B,QAAI,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,QAAS,OAAM;IACzB,WAAO,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,WAAY,OAAM;;;;;;;AC9DpC,SAAgB,qBAGd,QAAmC;AACnC,KAAI,OAAO,WAAW,SAAU,QAAO;AAEvC,QAAO;EACL,OAAO;EACP,OAAO,OAAO,OAAO;EACtB;;AAGH,SAAgB,qBAGd,SAAoB,OAAoC;AACxD,QAAO,QAAQ,MAAK,WAAU,OAAO,OAAO,MAAM,KAAK,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EEL/D,MAAM,QAAQ;EAMd,MAAM,OAAO;EAIb,MAAM,oBAAoB,eACxB,MAAM,QAAQ,IAAI,qBAAoB,CACxC;EAEA,SAAS,aAAa,OAAc;GAClC,MAAM,SAAS,MAAM;AAErB,QAAK,qBADU,qBAAqB,kBAAkB,OAAO,OAAO,MAAK,EACvC,SAAS,OAAO,MAAK;;;uBAKvD,mBA+BM,OA/BN,YA+BM,CA9BJ,mBAwBS,UAAA;IAvBN,OAAO,QAAA;IACP,UAAU,QAAA;IACV,gBAAc,QAAA,SAAS,KAAA;IACvB,oBAAkB,QAAA,mBAAmB,KAAA;IACrC,OAAK,eAAA;;8BAAqE,QAAA;KAAgB,QAAA,QAAK,gCAAA;KAA+C,QAAA,WAAQ,mCAAA;;IAMtJ,UAAQ;OAEK,QAAA,eAAA,WAAA,EAAd,mBAES,UAFT,YAES,gBADJ,QAAA,YAAW,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA,GAAA,UAAA,KAAA,EAEhB,mBAOS,UAAA,MAAA,WANU,kBAAA,QAAV,WAAM;wBADf,mBAOS,UAAA;KALN,KAAK,OAAO,OAAO,MAAK;KACxB,OAAO,OAAO;KACd,UAAU,OAAO;uBAEf,OAAO,MAAK,EAAA,GAAA,WAAA;0DAGnB,mBAIM,OAAA,EAJD,OAAM,qBAAmB,EAAA,CAC5B,mBAEM,OAAA;IAFD,MAAK;IAAO,QAAO;IAAe,gBAAa;IAAI,kBAAe;IAAQ,mBAAgB;IAAQ,SAAQ;OAC7G,mBAAyB,QAAA,EAAnB,GAAE,gBAAc,CAAA,CAAA,CAAA,CAAA,EAAA,GAAA,EAAA,CAAA"}