@morscherlab/mld-sdk 0.6.0

package/dist/components/StepWizard.vue.js

@@ -0,0 +1,213 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, normalizeClass, renderSlot, createElementVNode, Fragment, renderList, createCommentVNode, createTextVNode, toDisplayString, withDirectives, vShow } from "vue";
+const _hoisted_1 = {
+  key: 0,
+  class: "mld-wizard__progress"
+};
+const _hoisted_2 = { class: "mld-wizard__steps-indicator" };
+const _hoisted_3 = ["onClick"];
+const _hoisted_4 = { class: "mld-wizard__step-dot" };
+const _hoisted_5 = {
+  key: 0,
+  width: "12",
+  height: "12",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "3",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+};
+const _hoisted_6 = { class: "mld-wizard__step-label" };
+const _hoisted_7 = { class: "mld-wizard__body" };
+const _hoisted_8 = { class: "mld-wizard__navigation" };
+const _hoisted_9 = ["disabled"];
+const _hoisted_10 = ["disabled"];
+const _hoisted_11 = ["disabled"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "StepWizard",
+  props: {
+    steps: {},
+    modelValue: { default: 0 },
+    linear: { type: Boolean, default: true },
+    showProgress: { type: Boolean, default: true },
+    showStepNumbers: { type: Boolean, default: true },
+    size: { default: "md" }
+  },
+  emits: ["update:modelValue", "complete", "cancel", "step-change"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const stepValidity = ref([]);
+    if (stepValidity.value.length === 0) {
+      stepValidity.value = props.steps.map(() => true);
+    }
+    const stepStates = computed(() => {
+      return props.steps.map((_, index) => {
+        if (index === props.modelValue) return "active";
+        if (index < props.modelValue && stepValidity.value[index] !== false) return "completed";
+        if (index > props.modelValue && props.linear) {
+          for (let i = props.modelValue; i < index; i++) {
+            if (stepValidity.value[i] === false) return "disabled";
+          }
+        }
+        return "pending";
+      });
+    });
+    function setStepValid(index, valid) {
+      if (index >= 0 && index < props.steps.length) {
+        stepValidity.value[index] = valid;
+      }
+    }
+    function goToStep(index) {
+      if (index < 0 || index >= props.steps.length) return;
+      if (stepStates.value[index] === "disabled") return;
+      if (props.linear && index > props.modelValue) {
+        for (let i = props.modelValue; i < index; i++) {
+          if (stepValidity.value[i] === false) return;
+        }
+      }
+      const from = props.modelValue;
+      emit("step-change", [from, index]);
+      emit("update:modelValue", index);
+    }
+    function goNext() {
+      if (stepValidity.value[props.modelValue] === false) return;
+      if (props.modelValue < props.steps.length - 1) {
+        goToStep(props.modelValue + 1);
+      }
+    }
+    function goBack() {
+      if (props.modelValue > 0) {
+        goToStep(props.modelValue - 1);
+      }
+    }
+    function finish() {
+      if (stepValidity.value[props.modelValue] === false) return;
+      if (props.modelValue === props.steps.length - 1) {
+        emit("complete");
+      }
+    }
+    function cancel() {
+      emit("cancel");
+    }
+    function handleKeydown(event) {
+      switch (event.key) {
+        case "ArrowLeft":
+          event.preventDefault();
+          goBack();
+          break;
+        case "ArrowRight":
+          event.preventDefault();
+          goNext();
+          break;
+        case "Escape":
+          cancel();
+          break;
+      }
+    }
+    __expose({ setStepValid });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["mld-wizard", `mld-wizard--${props.size}`]),
+        tabindex: "0",
+        onKeydown: handleKeydown
+      }, [
+        props.showProgress ? (openBlock(), createElementBlock("div", _hoisted_1, [
+          renderSlot(_ctx.$slots, "progress", {
+            steps: props.steps,
+            current: props.modelValue,
+            states: stepStates.value
+          }, () => [
+            createElementVNode("div", _hoisted_2, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(props.steps, (step, index) => {
+                return openBlock(), createElementBlock(Fragment, {
+                  key: step.id
+                }, [
+                  index > 0 ? (openBlock(), createElementBlock("div", {
+                    key: 0,
+                    class: normalizeClass([
+                      "mld-wizard__step-connector",
+                      stepStates.value[index - 1] === "completed" ? "mld-wizard__step-connector--completed" : ""
+                    ])
+                  }, null, 2)) : createCommentVNode("", true),
+                  createElementVNode("div", {
+                    class: normalizeClass([
+                      "mld-wizard__step-indicator",
+                      `mld-wizard__step-indicator--${stepStates.value[index]}`
+                    ]),
+                    onClick: ($event) => goToStep(index)
+                  }, [
+                    createElementVNode("div", _hoisted_4, [
+                      stepStates.value[index] === "completed" ? (openBlock(), createElementBlock("svg", _hoisted_5, [..._cache[0] || (_cache[0] = [
+                        createElementVNode("path", { d: "M20 6 9 17l-5-5" }, null, -1)
+                      ])])) : props.showStepNumbers ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                        createTextVNode(toDisplayString(index + 1), 1)
+                      ], 64)) : createCommentVNode("", true)
+                    ]),
+                    createElementVNode("div", _hoisted_6, toDisplayString(step.label), 1)
+                  ], 10, _hoisted_3)
+                ], 64);
+              }), 128))
+            ])
+          ])
+        ])) : createCommentVNode("", true),
+        createElementVNode("div", _hoisted_7, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(props.steps, (step, index) => {
+            return withDirectives((openBlock(), createElementBlock("div", {
+              key: step.id,
+              class: "mld-wizard__step-content"
+            }, [
+              renderSlot(_ctx.$slots, `step-${step.id}`, {
+                step,
+                index
+              })
+            ])), [
+              [vShow, index === props.modelValue]
+            ]);
+          }), 128))
+        ]),
+        createElementVNode("div", _hoisted_8, [
+          renderSlot(_ctx.$slots, "navigation", {
+            goBack,
+            goNext,
+            finish,
+            cancel,
+            isFirst: props.modelValue === 0,
+            isLast: props.modelValue === props.steps.length - 1,
+            canProceed: stepValidity.value[props.modelValue] !== false
+          }, () => [
+            createElementVNode("button", {
+              type: "button",
+              class: "mld-wizard__nav-btn mld-wizard__nav-btn--cancel",
+              onClick: cancel
+            }, " Cancel "),
+            _cache[1] || (_cache[1] = createElementVNode("div", { style: { "flex": "1" } }, null, -1)),
+            createElementVNode("button", {
+              type: "button",
+              class: "mld-wizard__nav-btn mld-wizard__nav-btn--back",
+              disabled: props.modelValue === 0,
+              onClick: goBack
+            }, " Back ", 8, _hoisted_9),
+            props.modelValue < props.steps.length - 1 ? (openBlock(), createElementBlock("button", {
+              key: 0,
+              type: "button",
+              class: "mld-wizard__nav-btn mld-wizard__nav-btn--next",
+              disabled: stepValidity.value[props.modelValue] === false,
+              onClick: goNext
+            }, " Next ", 8, _hoisted_10)) : (openBlock(), createElementBlock("button", {
+              key: 1,
+              type: "button",
+              class: "mld-wizard__nav-btn mld-wizard__nav-btn--finish",
+              disabled: stepValidity.value[props.modelValue] === false,
+              onClick: finish
+            }, " Finish ", 8, _hoisted_11))
+          ])
+        ])
+      ], 34);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=StepWizard.vue.js.map

package/dist/components/StepWizard.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StepWizard.vue.js","sources":["../../src/components/StepWizard.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, computed } from 'vue'\n\ninterface WizardStep {\n  id: string\n  label: string\n  description?: string\n  icon?: string\n  optional?: boolean\n}\n\ntype WizardStepState = 'pending' | 'active' | 'completed' | 'disabled'\n\ninterface Props {\n  steps: WizardStep[]\n  modelValue?: number\n  linear?: boolean\n  showProgress?: boolean\n  showStepNumbers?: boolean\n  size?: 'sm' | 'md' | 'lg'\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  modelValue: 0,\n  linear: true,\n  showProgress: true,\n  showStepNumbers: true,\n  size: 'md',\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [index: number]\n  'complete': []\n  'cancel': []\n  'step-change': [change: [from: number, to: number]]\n}>()\n\nconst stepValidity = ref<boolean[]>([])\n\n// Initialize validity for all steps to true\nif (stepValidity.value.length === 0) {\n  stepValidity.value = props.steps.map(() => true)\n}\n\nconst stepStates = computed<WizardStepState[]>(() => {\n  return props.steps.map((_, index) => {\n    if (index === props.modelValue) return 'active'\n    if (index < props.modelValue && stepValidity.value[index] !== false) return 'completed'\n    if (index > props.modelValue && props.linear) {\n      for (let i = props.modelValue; i < index; i++) {\n        if (stepValidity.value[i] === false) return 'disabled'\n      }\n    }\n    return 'pending'\n  })\n})\n\nfunction setStepValid(index: number, valid: boolean) {\n  if (index >= 0 && index < props.steps.length) {\n    stepValidity.value[index] = valid\n  }\n}\n\nfunction goToStep(index: number) {\n  if (index < 0 || index >= props.steps.length) return\n  if (stepStates.value[index] === 'disabled') return\n\n  if (props.linear && index > props.modelValue) {\n    for (let i = props.modelValue; i < index; i++) {\n      if (stepValidity.value[i] === false) return\n    }\n  }\n\n  const from = props.modelValue\n  emit('step-change', [from, index])\n  emit('update:modelValue', index)\n}\n\nfunction goNext() {\n  if (stepValidity.value[props.modelValue] === false) return\n  if (props.modelValue < props.steps.length - 1) {\n    goToStep(props.modelValue + 1)\n  }\n}\n\nfunction goBack() {\n  if (props.modelValue > 0) {\n    goToStep(props.modelValue - 1)\n  }\n}\n\nfunction finish() {\n  if (stepValidity.value[props.modelValue] === false) return\n  if (props.modelValue === props.steps.length - 1) {\n    emit('complete')\n  }\n}\n\nfunction cancel() {\n  emit('cancel')\n}\n\nfunction handleKeydown(event: KeyboardEvent) {\n  switch (event.key) {\n    case 'ArrowLeft':\n      event.preventDefault()\n      goBack()\n      break\n    case 'ArrowRight':\n      event.preventDefault()\n      goNext()\n      break\n    case 'Escape':\n      cancel()\n      break\n  }\n}\n\ndefineExpose({ setStepValid })\n</script>\n\n<template>\n  <div\n    :class=\"['mld-wizard', `mld-wizard--${props.size}`]\"\n    tabindex=\"0\"\n    @keydown=\"handleKeydown\"\n  >\n    <!-- Progress indicator -->\n    <div v-if=\"props.showProgress\" class=\"mld-wizard__progress\">\n      <slot name=\"progress\" :steps=\"props.steps\" :current=\"props.modelValue\" :states=\"stepStates\">\n        <div class=\"mld-wizard__steps-indicator\">\n          <template v-for=\"(step, index) in props.steps\" :key=\"step.id\">\n            <!-- Connector line (before each step except first) -->\n            <div\n              v-if=\"index > 0\"\n              :class=\"[\n                'mld-wizard__step-connector',\n                stepStates[index - 1] === 'completed' ? 'mld-wizard__step-connector--completed' : '',\n              ]\"\n            />\n            <!-- Step indicator -->\n            <div\n              :class=\"[\n                'mld-wizard__step-indicator',\n                `mld-wizard__step-indicator--${stepStates[index]}`,\n              ]\"\n              @click=\"goToStep(index)\"\n            >\n              <div class=\"mld-wizard__step-dot\">\n                <template v-if=\"stepStates[index] === 'completed'\">\n                  <svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                    <path d=\"M20 6 9 17l-5-5\" />\n                  </svg>\n                </template>\n                <template v-else-if=\"props.showStepNumbers\">\n                  {{ index + 1 }}\n                </template>\n              </div>\n              <div class=\"mld-wizard__step-label\">{{ step.label }}</div>\n            </div>\n          </template>\n        </div>\n      </slot>\n    </div>\n\n    <!-- Step content -->\n    <div class=\"mld-wizard__body\">\n      <div\n        v-for=\"(step, index) in props.steps\"\n        :key=\"step.id\"\n        v-show=\"index === props.modelValue\"\n        class=\"mld-wizard__step-content\"\n      >\n        <slot :name=\"`step-${step.id}`\" :step=\"step\" :index=\"index\" />\n      </div>\n    </div>\n\n    <!-- Navigation -->\n    <div class=\"mld-wizard__navigation\">\n      <slot\n        name=\"navigation\"\n        :go-back=\"goBack\"\n        :go-next=\"goNext\"\n        :finish=\"finish\"\n        :cancel=\"cancel\"\n        :is-first=\"props.modelValue === 0\"\n        :is-last=\"props.modelValue === props.steps.length - 1\"\n        :can-proceed=\"stepValidity[props.modelValue] !== false\"\n      >\n        <button\n          type=\"button\"\n          class=\"mld-wizard__nav-btn mld-wizard__nav-btn--cancel\"\n          @click=\"cancel\"\n        >\n          Cancel\n        </button>\n        <div style=\"flex: 1\" />\n        <button\n          type=\"button\"\n          class=\"mld-wizard__nav-btn mld-wizard__nav-btn--back\"\n          :disabled=\"props.modelValue === 0\"\n          @click=\"goBack\"\n        >\n          Back\n        </button>\n        <button\n          v-if=\"props.modelValue < props.steps.length - 1\"\n          type=\"button\"\n          class=\"mld-wizard__nav-btn mld-wizard__nav-btn--next\"\n          :disabled=\"stepValidity[props.modelValue] === false\"\n          @click=\"goNext\"\n        >\n          Next\n        </button>\n        <button\n          v-else\n          type=\"button\"\n          class=\"mld-wizard__nav-btn mld-wizard__nav-btn--finish\"\n          :disabled=\"stepValidity[props.modelValue] === false\"\n          @click=\"finish\"\n        >\n          Finish\n        </button>\n      </slot>\n    </div>\n  </div>\n</template>\n\n<style>\n@import '../styles/components/step-wizard.css';\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_openBlock","_renderSlot","_createElementVNode","_Fragment","_toDisplayString"],"mappings":"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"}

package/dist/components/StepWizard.vue3.js

@@ -0,0 +1,6 @@
+import _sfc_main from "./StepWizard.vue.js";
+/* empty css                */
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=StepWizard.vue3.js.map

package/dist/components/StepWizard.vue3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StepWizard.vue3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/components/TagsInput.vue.d.ts

@@ -0,0 +1,23 @@
+interface Props {
+    modelValue?: string[];
+    placeholder?: string;
+    disabled?: boolean;
+    error?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+    maxTags?: number;
+    allowDuplicates?: boolean;
+}
+declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string[]) => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
+}>, {
+    error: boolean;
+    disabled: boolean;
+    size: "sm" | "md" | "lg";
+    modelValue: string[];
+    allowDuplicates: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    inputRef: HTMLInputElement;
+}, HTMLDivElement>;
+export default _default;

package/dist/components/TagsInput.vue.js

@@ -0,0 +1,124 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, normalizeClass, Fragment, renderList, createTextVNode, toDisplayString, withModifiers, createElementVNode, createCommentVNode, withDirectives, vModelText } from "vue";
+const _hoisted_1 = ["aria-label", "onClick"];
+const _hoisted_2 = ["placeholder", "disabled"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "TagsInput",
+  props: {
+    modelValue: { default: () => [] },
+    placeholder: {},
+    disabled: { type: Boolean, default: false },
+    error: { type: Boolean, default: false },
+    size: { default: "md" },
+    maxTags: {},
+    allowDuplicates: { type: Boolean, default: false }
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const inputValue = ref("");
+    const inputRef = ref();
+    const canAddMore = computed(() => {
+      if (props.maxTags === void 0) return true;
+      return props.modelValue.length < props.maxTags;
+    });
+    function addTag(value) {
+      const trimmed = value.trim();
+      if (!trimmed) return;
+      if (!canAddMore.value) return;
+      if (!props.allowDuplicates && props.modelValue.includes(trimmed)) return;
+      emit("update:modelValue", [...props.modelValue, trimmed]);
+      inputValue.value = "";
+    }
+    function removeTag(index) {
+      if (props.disabled) return;
+      const newTags = [...props.modelValue];
+      newTags.splice(index, 1);
+      emit("update:modelValue", newTags);
+    }
+    function handleKeydown(event) {
+      if (event.key === "Enter" || event.key === ",") {
+        event.preventDefault();
+        addTag(inputValue.value);
+      } else if (event.key === "Backspace" && !inputValue.value && props.modelValue.length > 0) {
+        removeTag(props.modelValue.length - 1);
+      }
+    }
+    function handlePaste(event) {
+      var _a;
+      event.preventDefault();
+      const text = (_a = event.clipboardData) == null ? void 0 : _a.getData("text");
+      if (!text) return;
+      const tags = text.split(/[,\n]/).map((t) => t.trim()).filter(Boolean);
+      const newTags = [...props.modelValue];
+      for (const tag of tags) {
+        if (!canAddMore.value) break;
+        if (!props.allowDuplicates && newTags.includes(tag)) continue;
+        newTags.push(tag);
+      }
+      emit("update:modelValue", newTags);
+    }
+    function focusInput() {
+      var _a;
+      (_a = inputRef.value) == null ? void 0 : _a.focus();
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([
+          "mld-tags-input",
+          `mld-tags-input--${__props.size}`,
+          __props.error ? "mld-tags-input--error" : "",
+          __props.disabled ? "mld-tags-input--disabled" : ""
+        ]),
+        onClick: focusInput
+      }, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(__props.modelValue, (tag, index) => {
+          return openBlock(), createElementBlock("span", {
+            key: `${tag}-${index}`,
+            class: normalizeClass(["mld-tags-input__tag", `mld-tags-input__tag--${__props.size}`])
+          }, [
+            createTextVNode(toDisplayString(tag) + " ", 1),
+            !__props.disabled ? (openBlock(), createElementBlock("button", {
+              key: 0,
+              type: "button",
+              "aria-label": `Remove ${tag}`,
+              class: "mld-tags-input__tag-remove",
+              onClick: withModifiers(($event) => removeTag(index), ["stop"])
+            }, [..._cache[2] || (_cache[2] = [
+              createElementVNode("svg", {
+                class: "mld-tags-input__tag-remove-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)
+            ])], 8, _hoisted_1)) : createCommentVNode("", true)
+          ], 2);
+        }), 128)),
+        withDirectives(createElementVNode("input", {
+          ref_key: "inputRef",
+          ref: inputRef,
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inputValue.value = $event),
+          type: "text",
+          placeholder: __props.modelValue.length === 0 ? __props.placeholder : "",
+          disabled: __props.disabled || !canAddMore.value,
+          class: normalizeClass(["mld-tags-input__input", `mld-tags-input__input--${__props.size}`]),
+          onKeydown: handleKeydown,
+          onPaste: handlePaste,
+          onBlur: _cache[1] || (_cache[1] = ($event) => addTag(inputValue.value))
+        }, null, 42, _hoisted_2), [
+          [vModelText, inputValue.value]
+        ])
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=TagsInput.vue.js.map

package/dist/components/TagsInput.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagsInput.vue.js","sources":["../../src/components/TagsInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, computed } from 'vue'\n\ninterface Props {\n  modelValue?: string[]\n  placeholder?: string\n  disabled?: boolean\n  error?: boolean\n  size?: 'sm' | 'md' | 'lg'\n  maxTags?: number\n  allowDuplicates?: boolean\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  modelValue: () => [],\n  disabled: false,\n  error: false,\n  size: 'md',\n  allowDuplicates: false,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string[]]\n}>()\n\nconst inputValue = ref('')\nconst inputRef = ref<HTMLInputElement>()\n\nconst canAddMore = computed(() => {\n  if (props.maxTags === undefined) return true\n  return props.modelValue.length < props.maxTags\n})\n\nfunction addTag(value: string) {\n  const trimmed = value.trim()\n  if (!trimmed) return\n  if (!canAddMore.value) return\n  if (!props.allowDuplicates && props.modelValue.includes(trimmed)) return\n\n  emit('update:modelValue', [...props.modelValue, trimmed])\n  inputValue.value = ''\n}\n\nfunction removeTag(index: number) {\n  if (props.disabled) return\n  const newTags = [...props.modelValue]\n  newTags.splice(index, 1)\n  emit('update:modelValue', newTags)\n}\n\nfunction handleKeydown(event: KeyboardEvent) {\n  if (event.key === 'Enter' || event.key === ',') {\n    event.preventDefault()\n    addTag(inputValue.value)\n  } else if (event.key === 'Backspace' && !inputValue.value && props.modelValue.length > 0) {\n    removeTag(props.modelValue.length - 1)\n  }\n}\n\nfunction handlePaste(event: ClipboardEvent) {\n  event.preventDefault()\n  const text = event.clipboardData?.getData('text')\n  if (!text) return\n\n  const tags = text.split(/[,\\n]/).map(t => t.trim()).filter(Boolean)\n  const newTags = [...props.modelValue]\n\n  for (const tag of tags) {\n    if (!canAddMore.value) break\n    if (!props.allowDuplicates && newTags.includes(tag)) continue\n    newTags.push(tag)\n  }\n\n  emit('update:modelValue', newTags)\n}\n\nfunction focusInput() {\n  inputRef.value?.focus()\n}\n</script>\n\n<template>\n  <div\n    :class=\"[\n      'mld-tags-input',\n      `mld-tags-input--${size}`,\n      error ? 'mld-tags-input--error' : '',\n      disabled ? 'mld-tags-input--disabled' : '',\n    ]\"\n    @click=\"focusInput\"\n  >\n    <span\n      v-for=\"(tag, index) in modelValue\"\n      :key=\"`${tag}-${index}`\"\n      :class=\"['mld-tags-input__tag', `mld-tags-input__tag--${size}`]\"\n    >\n      {{ tag }}\n      <button\n        v-if=\"!disabled\"\n        type=\"button\"\n        :aria-label=\"`Remove ${tag}`\"\n        class=\"mld-tags-input__tag-remove\"\n        @click.stop=\"removeTag(index)\"\n      >\n        <svg class=\"mld-tags-input__tag-remove-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    </span>\n\n    <input\n      ref=\"inputRef\"\n      v-model=\"inputValue\"\n      type=\"text\"\n      :placeholder=\"modelValue.length === 0 ? placeholder : ''\"\n      :disabled=\"disabled || !canAddMore\"\n      :class=\"['mld-tags-input__input', `mld-tags-input__input--${size}`]\"\n      @keydown=\"handleKeydown\"\n      @paste=\"handlePaste\"\n      @blur=\"addTag(inputValue)\"\n    />\n  </div>\n</template>\n\n<style>\n@import '../styles/components/tags-input.css';\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_openBlock","_Fragment","_renderList","_createTextVNode","_toDisplayString","_withModifiers","_createElementVNode"],"mappings":";;;;;;;;;;;;;;;;AAaA,UAAM,QAAQ;AAQd,UAAM,OAAO;AAIb,UAAM,aAAa,IAAI,EAAE;AACzB,UAAM,WAAW,IAAA;AAEjB,UAAM,aAAa,SAAS,MAAM;AAChC,UAAI,MAAM,YAAY,OAAW,QAAO;AACxC,aAAO,MAAM,WAAW,SAAS,MAAM;AAAA,IACzC,CAAC;AAED,aAAS,OAAO,OAAe;AAC7B,YAAM,UAAU,MAAM,KAAA;AACtB,UAAI,CAAC,QAAS;AACd,UAAI,CAAC,WAAW,MAAO;AACvB,UAAI,CAAC,MAAM,mBAAmB,MAAM,WAAW,SAAS,OAAO,EAAG;AAElE,WAAK,qBAAqB,CAAC,GAAG,MAAM,YAAY,OAAO,CAAC;AACxD,iBAAW,QAAQ;AAAA,IACrB;AAEA,aAAS,UAAU,OAAe;AAChC,UAAI,MAAM,SAAU;AACpB,YAAM,UAAU,CAAC,GAAG,MAAM,UAAU;AACpC,cAAQ,OAAO,OAAO,CAAC;AACvB,WAAK,qBAAqB,OAAO;AAAA,IACnC;AAEA,aAAS,cAAc,OAAsB;AAC3C,UAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;AAC9C,cAAM,eAAA;AACN,eAAO,WAAW,KAAK;AAAA,MACzB,WAAW,MAAM,QAAQ,eAAe,CAAC,WAAW,SAAS,MAAM,WAAW,SAAS,GAAG;AACxF,kBAAU,MAAM,WAAW,SAAS,CAAC;AAAA,MACvC;AAAA,IACF;AAEA,aAAS,YAAY,OAAuB;;AAC1C,YAAM,eAAA;AACN,YAAM,QAAO,WAAM,kBAAN,mBAAqB,QAAQ;AAC1C,UAAI,CAAC,KAAM;AAEX,YAAM,OAAO,KAAK,MAAM,OAAO,EAAE,IAAI,CAAA,MAAK,EAAE,KAAA,CAAM,EAAE,OAAO,OAAO;AAClE,YAAM,UAAU,CAAC,GAAG,MAAM,UAAU;AAEpC,iBAAW,OAAO,MAAM;AACtB,YAAI,CAAC,WAAW,MAAO;AACvB,YAAI,CAAC,MAAM,mBAAmB,QAAQ,SAAS,GAAG,EAAG;AACrD,gBAAQ,KAAK,GAAG;AAAA,MAClB;AAEA,WAAK,qBAAqB,OAAO;AAAA,IACnC;AAEA,aAAS,aAAa;;AACpB,qBAAS,UAAT,mBAAgB;AAAA,IAClB;;0BAIEA,mBAuCM,OAAA;AAAA,QAtCH,OAAKC,eAAA;AAAA;6BAAqD,QAAA,IAAI;AAAA,UAAU,QAAA,QAAK,0BAAA;AAAA,UAAuC,QAAA,WAAQ,6BAAA;AAAA,QAAA;QAM5H,SAAO;AAAA,MAAA;SAERC,UAAA,IAAA,GAAAF,mBAiBOG,UAAA,MAAAC,WAhBkB,QAAA,YAAU,CAAzB,KAAK,UAAK;8BADpBJ,mBAiBO,QAAA;AAAA,YAfJ,KAAG,GAAK,GAAG,IAAI,KAAK;AAAA,YACpB,sEAAuD,QAAA,IAAI,EAAA,CAAA;AAAA,UAAA;YAEzDK,gBAAAC,gBAAA,GAAG,IAAG,KACT,CAAA;AAAA,aACS,QAAA,yBADTN,mBAUS,UAAA;AAAA;cARP,MAAK;AAAA,cACJ,wBAAsB,GAAG;AAAA,cAC1B,OAAM;AAAA,cACL,SAAKO,cAAA,CAAA,WAAO,UAAU,KAAK,GAAA,CAAA,MAAA,CAAA;AAAA,YAAA;cAE5BC,mBAEM,OAAA;AAAA,gBAFD,OAAM;AAAA,gBAAkC,MAAK;AAAA,gBAAO,QAAO;AAAA,gBAAe,gBAAa;AAAA,gBAAI,kBAAe;AAAA,gBAAQ,mBAAgB;AAAA,gBAAQ,SAAQ;AAAA,cAAA;gBACrJA,mBAAuB,QAAA,EAAjB,GAAE,cAAY;AAAA,gBAAGA,mBAAuB,QAAA,EAAjB,GAAE,cAAY;AAAA,cAAA;;;;uBAKjDA,mBAUE,SAAA;AAAA,mBATI;AAAA,UAAJ,KAAI;AAAA,uEACK,WAAU,QAAA;AAAA,UACnB,MAAK;AAAA,UACJ,aAAa,QAAA,WAAW,eAAe,QAAA,cAAW;AAAA,UAClD,UAAU,QAAA,YAAQ,CAAK,WAAA;AAAA,UACvB,0EAA2D,QAAA,IAAI,EAAA,CAAA;AAAA,UAC/D,WAAS;AAAA,UACT,SAAO;AAAA,UACP,QAAI,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,CAAA,WAAE,OAAO,WAAA,KAAU;AAAA,QAAA;uBAPf,WAAA,KAAU;AAAA,QAAA;;;;;"}

package/dist/components/TagsInput.vue3.js

@@ -0,0 +1,6 @@
+import _sfc_main from "./TagsInput.vue.js";
+/* empty css               */
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=TagsInput.vue3.js.map

package/dist/components/TagsInput.vue3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagsInput.vue3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/components/ThemeToggle.vue.d.ts

@@ -0,0 +1,7 @@
+interface Props {
+    size?: 'sm' | 'md' | 'lg';
+}
+declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    size: "sm" | "md" | "lg";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLButtonElement>;
+export default _default;

package/dist/components/ThemeToggle.vue.js

@@ -0,0 +1,49 @@
+import { defineComponent, openBlock, createElementBlock, unref, normalizeClass, createStaticVNode, createElementVNode } from "vue";
+import { useTheme } from "../composables/useTheme.js";
+const _hoisted_1 = ["aria-label"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ThemeToggle",
+  props: {
+    size: { default: "md" }
+  },
+  setup(__props) {
+    const { isDark, toggleTheme } = useTheme();
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("button", {
+        type: "button",
+        class: normalizeClass(["mld-theme-toggle", `mld-theme-toggle--${__props.size}`]),
+        "aria-label": unref(isDark) ? "Switch to light mode" : "Switch to dark mode",
+        onClick: _cache[0] || (_cache[0] = //@ts-ignore
+        (...args) => unref(toggleTheme) && unref(toggleTheme)(...args))
+      }, [
+        unref(isDark) ? (openBlock(), createElementBlock("svg", {
+          key: 0,
+          class: normalizeClass(`mld-theme-toggle__icon--${__props.size}`),
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          "stroke-width": "2",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round"
+        }, [..._cache[1] || (_cache[1] = [
+          createStaticVNode('<circle cx="12" cy="12" r="4"></circle><path d="M12 2v2"></path><path d="M12 20v2"></path><path d="m4.93 4.93 1.41 1.41"></path><path d="m17.66 17.66 1.41 1.41"></path><path d="M2 12h2"></path><path d="M20 12h2"></path><path d="m6.34 17.66-1.41 1.41"></path><path d="m19.07 4.93-1.41 1.41"></path>', 9)
+        ])], 2)) : (openBlock(), createElementBlock("svg", {
+          key: 1,
+          class: normalizeClass(`mld-theme-toggle__icon--${__props.size}`),
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          "stroke-width": "2",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round"
+        }, [..._cache[2] || (_cache[2] = [
+          createElementVNode("path", { d: "M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401" }, null, -1)
+        ])], 2))
+      ], 10, _hoisted_1);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=ThemeToggle.vue.js.map

package/dist/components/ThemeToggle.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeToggle.vue.js","sources":["../../src/components/ThemeToggle.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useTheme } from '../composables/useTheme'\n\ninterface Props {\n  size?: 'sm' | 'md' | 'lg'\n}\n\nwithDefaults(defineProps<Props>(), {\n  size: 'md',\n})\n\nconst { isDark, toggleTheme } = useTheme()\n</script>\n\n<template>\n  <button\n    type=\"button\"\n    :class=\"['mld-theme-toggle', `mld-theme-toggle--${size}`]\"\n    :aria-label=\"isDark ? 'Switch to light mode' : 'Switch to dark mode'\"\n    @click=\"toggleTheme\"\n  >\n    <!-- Lucide sun -->\n    <svg\n      v-if=\"isDark\"\n      :class=\"`mld-theme-toggle__icon--${size}`\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n    >\n      <circle cx=\"12\" cy=\"12\" r=\"4\" /><path d=\"M12 2v2\" /><path d=\"M12 20v2\" /><path d=\"m4.93 4.93 1.41 1.41\" /><path d=\"m17.66 17.66 1.41 1.41\" /><path d=\"M2 12h2\" /><path d=\"M20 12h2\" /><path d=\"m6.34 17.66-1.41 1.41\" /><path d=\"m19.07 4.93-1.41 1.41\" />\n    </svg>\n    <!-- Lucide moon -->\n    <svg\n      v-else\n      :class=\"`mld-theme-toggle__icon--${size}`\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n    >\n      <path d=\"M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401\" />\n    </svg>\n  </button>\n</template>\n\n<style>\n@import '../styles/components/theme-toggle.css';\n</style>\n"],"names":["_createElementBlock","_unref","_createElementVNode"],"mappings":";;;;;;;;;AAWA,UAAM,EAAE,QAAQ,YAAA,IAAgB,SAAA;;0BAI9BA,mBAgCS,UAAA;AAAA,QA/BP,MAAK;AAAA,QACJ,gEAAiD,QAAA,IAAI,EAAA,CAAA;AAAA,QACrD,cAAYC,MAAA,MAAA,IAAM,yBAAA;AAAA,QAClB,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA;AAAA,qBAAEA,MAAA,WAAA,KAAAA,MAAA,WAAA,EAAA,GAAA,IAAA;AAAA,MAAA;QAIAA,MAAA,MAAA,kBADRD,mBAWM,OAAA;AAAA;UATH,iDAAkC,QAAA,IAAI,EAAA;AAAA,UACvC,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,QAAO;AAAA,UACP,gBAAa;AAAA,UACb,kBAAe;AAAA,UACf,mBAAgB;AAAA,QAAA;;iCAKlBA,mBAWM,OAAA;AAAA;UATH,iDAAkC,QAAA,IAAI,EAAA;AAAA,UACvC,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,QAAO;AAAA,UACP,gBAAa;AAAA,UACb,kBAAe;AAAA,UACf,mBAAgB;AAAA,QAAA;UAEhBE,mBAA2H,QAAA,EAArH,GAAE,iHAAA,GAAgH,MAAA,EAAA;AAAA,QAAA;;;;;"}

package/dist/components/ThemeToggle.vue3.js

@@ -0,0 +1,6 @@
+import _sfc_main from "./ThemeToggle.vue.js";
+/* empty css                 */
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=ThemeToggle.vue3.js.map

package/dist/components/ThemeToggle.vue3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeToggle.vue3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/components/TimePicker.vue.d.ts

@@ -0,0 +1,29 @@
+interface Props {
+    modelValue?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    error?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+    min?: string;
+    max?: string;
+    step?: number;
+    format?: '12h' | '24h';
+    clearable?: boolean;
+}
+declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string | undefined) => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
+}>, {
+    error: boolean;
+    disabled: boolean;
+    size: "sm" | "md" | "lg";
+    placeholder: string;
+    step: number;
+    clearable: boolean;
+    format: "12h" | "24h";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    containerRef: HTMLDivElement;
+    listRef: HTMLUListElement;
+}, HTMLDivElement>;
+export default _default;