@evance/evance-ui 1.0.37 → 1.0.39

package/dist/esm/chunks/toggleScope-BHFzqgW8.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"toggleScope-BHFzqgW8.mjs","sources":["../../../src/composables/toggleScope.ts"],"sourcesContent":["/**\n * # Toggle Scope Utility\n *\n * Manage an effect scope based on changes in a watched source.\n *\n * We use effectScope() to capture the reactive effects of reactive/computed property.\n * @see https://vuejs.org/api/reactivity-advanced.html#effectscope\n */\n// Utilities\nimport { effectScope, onScopeDispose, watch } from \"vue\";\n\n// Types\nimport type { EffectScope, WatchSource } from \"vue\";\n\nexport function useToggleScope(\n    source: WatchSource<boolean>,\n    fn: (reset: () => void) => void,\n): void {\n    let scope: EffectScope | undefined;\n\n    function start(): void {\n        scope = effectScope();\n        scope.run(() => {\n            return fn.length\n                ? fn(() => {\n                      scope?.stop();\n                      start();\n                  })\n                : (fn as any)();\n        });\n    }\n\n    function watchCallback(active: boolean): void {\n        if (active && !scope) {\n            start();\n        } else if (!active) {\n            scope?.stop();\n            scope = undefined;\n        }\n    }\n\n    const watchOptions = {\n        immediate: true,\n    };\n\n    watch(source, watchCallback, watchOptions);\n\n    onScopeDispose(() => {\n        scope?.stop();\n    });\n}\n"],"names":[],"mappings":";;AAcgB,SAAA,eACZ,QACA,IACI;AACA,MAAA;AAEJ,WAAS,QAAc;AACnB,YAAQ,YAAY;AACpB,UAAM,IAAI,MAAM;AACL,aAAA,GAAG,SACJ,GAAG,MAAM;AACL,uCAAO;AACD,cAAA;AAAA,MACT,CAAA,IACA,GAAW;AAAA,IAAA,CACrB;AAAA,EAAA;AAGL,WAAS,cAAc,QAAuB;AACtC,QAAA,UAAU,CAAC,OAAO;AACZ,YAAA;AAAA,IAAA,WACC,CAAC,QAAQ;AAChB,qCAAO;AACC,cAAA;AAAA,IAAA;AAAA,EACZ;AAGJ,QAAM,eAAe;AAAA,IACjB,WAAW;AAAA,EACf;AAEM,QAAA,QAAQ,eAAe,YAAY;AAEzC,iBAAe,MAAM;AACjB,mCAAO;AAAA,EAAK,CACf;AACL;"}

package/dist/esm/chunks/units-HJ_5926T.mjs

@@ -1,38 +0,0 @@
-/*! Evance UI v1.0.37 | MIT License */
-import { d as isEmpty } from "./is-functions-cWaLib1L.mjs";
-function toWebUnit(value, unit = "px") {
-  if (isEmpty(value)) {
-    return void 0;
-  }
-  if (isNaN(+value)) {
-    return String(value);
-  }
-  if (!isFinite(+value)) {
-    return void 0;
-  }
-  return `${value}${unit}`;
-}
-function pixelRound(value) {
-  return Math.round(value * devicePixelRatio) / devicePixelRatio;
-}
-function pixelCeil(value) {
-  return Math.round(value * devicePixelRatio) / devicePixelRatio;
-}
-function extractWebUnit(value) {
-  const regex = /^(-?\d+(?:\.\d+)?)\s*([a-zA-Z%]*)$/;
-  const match = value.match(regex);
-  if (!match) {
-    return void 0;
-  }
-  return {
-    value: parseFloat(match[1]),
-    unit: match[2] ?? "px"
-  };
-}
-export {
-  pixelRound as a,
-  extractWebUnit as e,
-  pixelCeil as p,
-  toWebUnit as t
-};
-//# sourceMappingURL=units-HJ_5926T.mjs.map

package/dist/esm/chunks/units-HJ_5926T.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"units-HJ_5926T.mjs","sources":["../../../src/util/units.ts"],"sourcesContent":["import { isEmpty } from \"./is-functions\";\n\n/**\n * # To Web Unit\n * @param value\n * @param unit\n */\nexport function toWebUnit(\n    value?: string | number,\n    unit: string = \"px\",\n): string | undefined {\n    if (isEmpty(value)) {\n        return undefined;\n    }\n    if (isNaN(+value!)) {\n        return String(value);\n    }\n    if (!isFinite(+value!)) {\n        return undefined;\n    }\n    return `${value}${unit}`;\n}\n\n/**\n * # Pixel Round\n * @param value\n */\nexport function pixelRound(value: number): number {\n    return Math.round(value * devicePixelRatio) / devicePixelRatio;\n}\n\n/**\n * # Pixel Ceil\n * @param value\n */\nexport function pixelCeil(value: number): number {\n    return Math.round(value * devicePixelRatio) / devicePixelRatio;\n}\n\n/**\n * # extractWebUnit\n * @param value\n */\nexport function extractWebUnit(value: string) {\n    const regex = /^(-?\\d+(?:\\.\\d+)?)\\s*([a-zA-Z%]*)$/;\n    const match = value.match(regex);\n    if (!match) {\n        return undefined;\n    }\n    return {\n        value: parseFloat(match[1]),\n        unit: match[2] ?? \"px\",\n    };\n}\n"],"names":[],"mappings":";;AAOgB,SAAA,UACZ,OACA,OAAe,MACG;AACd,MAAA,QAAQ,KAAK,GAAG;AACT,WAAA;AAAA,EAAA;AAEP,MAAA,MAAM,CAAC,KAAM,GAAG;AAChB,WAAO,OAAO,KAAK;AAAA,EAAA;AAEvB,MAAI,CAAC,SAAS,CAAC,KAAM,GAAG;AACb,WAAA;AAAA,EAAA;AAEJ,SAAA,GAAG,KAAK,GAAG,IAAI;AAC1B;AAMO,SAAS,WAAW,OAAuB;AAC9C,SAAO,KAAK,MAAM,QAAQ,gBAAgB,IAAI;AAClD;AAMO,SAAS,UAAU,OAAuB;AAC7C,SAAO,KAAK,MAAM,QAAQ,gBAAgB,IAAI;AAClD;AAMO,SAAS,eAAe,OAAe;AAC1C,QAAM,QAAQ;AACR,QAAA,QAAQ,MAAM,MAAM,KAAK;AAC/B,MAAI,CAAC,OAAO;AACD,WAAA;AAAA,EAAA;AAEJ,SAAA;AAAA,IACH,OAAO,WAAW,MAAM,CAAC,CAAC;AAAA,IAC1B,MAAM,MAAM,CAAC,KAAK;AAAA,EACtB;AACJ;"}

package/dist/esm/chunks/validation-DEqs8Ujs.mjs

@@ -1,319 +0,0 @@
-var __defProp = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-/*! Evance UI v1.0.37 | MIT License */
-import { ref, watch, computed, onBeforeMount, onBeforeUnmount, onMounted, shallowRef, nextTick } from "vue";
-import { p as propsFactory } from "./props-C5O_XLol.mjs";
-import { u as useForm } from "./form-BFL0Wju5.mjs";
-import { u as useToggleScope } from "./toggleScope-BHFzqgW8.mjs";
-import { u as useModelProxy } from "./modelProxy-DgW6Hnv7.mjs";
-import { e as setPropertyValueByPath, h as getPropertyValueByPath, g as getNextId, w as wrapInArray, B as Browser } from "./helpers-BObZTKcX.mjs";
-import { g as getCurrentComponent } from "./components-DxAovLdY.mjs";
-import { i as isString, f as isFunction } from "./is-functions-cWaLib1L.mjs";
-import { c as consoleWarn } from "./console-SaH-o8AB.mjs";
-const makeFocusProps = propsFactory(
-  {
-    focused: Boolean
-  },
-  "focus"
-);
-function useAutofocus(props) {
-  return {
-    mounted: (el) => {
-      if (!props.autofocus) {
-        return;
-      }
-      el.focus();
-    }
-  };
-}
-class FormField {
-  constructor(form, props, group = void 0) {
-    __publicField(this, "focused");
-    __publicField(this, "focusedVisible");
-    __publicField(this, "messages", ref([]));
-    __publicField(this, "model");
-    __publicField(this, "pristine", shallowRef(true));
-    __publicField(this, "uid", getNextId());
-    __publicField(this, "validating", shallowRef(false));
-    __publicField(this, "validationModel");
-    this.form = form;
-    this.props = props;
-    this.group = group;
-    const component = getCurrentComponent("FormField");
-    const internalModel = ref(props.modelValue);
-    watch(
-      () => props.modelValue,
-      (value) => {
-        internalModel.value = value;
-      }
-    );
-    this.model = computed({
-      get() {
-        if (group) {
-          return group.model.value;
-        }
-        if ((form == null ? void 0 : form.data.value) && props.name) {
-          return getPropertyValueByPath(form.data.value, props.name);
-        }
-        return internalModel.value;
-      },
-      set(value) {
-        if (group) {
-          group.model.value = value;
-        } else if ((form == null ? void 0 : form.data.value) && props.name) {
-          setPropertyValueByPath(form.data.value, props.name, value);
-        } else {
-          internalModel.value = value;
-        }
-        component.emit("update:modelValue", value);
-      }
-    });
-    this.focused = useModelProxy(this.props, "focused");
-    this.focusedVisible = ref(false);
-    this.validationModel = computed(() => {
-      return this.props.validationValue === void 0 ? this.model.value : this.props.validationValue;
-    });
-    onBeforeMount(() => {
-      var _a;
-      (_a = this.form) == null ? void 0 : _a.addField(this);
-    });
-    onBeforeUnmount(() => {
-      var _a;
-      (_a = this.form) == null ? void 0 : _a.removeField(this.id);
-    });
-    onMounted(async () => {
-      if (!this.validateOn.lazy) {
-        await this.validate(true);
-      }
-    });
-    useToggleScope(
-      () => this.validateOn.input,
-      () => {
-        watch(this.validationModel, () => {
-          if (this.validationModel.value != null) {
-            this.validate();
-          } else if (this.isFocused) {
-            const unwatch = watch(
-              () => this.focused.value,
-              (value) => {
-                if (!value) {
-                  this.validate();
-                }
-                unwatch();
-              }
-            );
-          }
-        });
-      }
-    );
-    useToggleScope(
-      () => this.validateOn.blur,
-      () => {
-        watch(
-          () => this.focused.value,
-          (value) => {
-            if (!value) {
-              this.validate();
-            }
-          }
-        );
-      }
-    );
-  }
-  get classes() {
-    return {
-      "is-error": this.isValid === false,
-      "is-dirty": this.isDirty,
-      "is-disabled": this.isDisabled,
-      "is-readonly": this.isReadonly,
-      "is-focused": this.isFocused,
-      "is-focused-visible": this.isFocusedVisible
-    };
-  }
-  get errorMessages() {
-    return this.messages.value;
-  }
-  get id() {
-    return this.props.id || `input-${this.uid}`;
-  }
-  get isDirty() {
-    return !!(wrapInArray(this.model.value === "" ? null : this.model.value).length || wrapInArray(
-      this.validationModel.value === "" ? null : this.validationModel.value
-    ).length);
-  }
-  get isDisabled() {
-    var _a, _b;
-    return !!(this.props.disabled || ((_a = this.group) == null ? void 0 : _a.isDisabled) || ((_b = this.form) == null ? void 0 : _b.isDisabled));
-  }
-  get isFocused() {
-    return this.focused.value;
-  }
-  get isFocusedVisible() {
-    return this.focusedVisible.value;
-  }
-  get isReadonly() {
-    var _a, _b;
-    return !!(this.props.readonly || ((_a = this.group) == null ? void 0 : _a.isReadonly) || ((_b = this.form) == null ? void 0 : _b.isReadonly));
-  }
-  get isPristine() {
-    return this.pristine.value;
-  }
-  get isShowErrorMessages() {
-    return !!this.errorMessages.length && !this.isPristine;
-  }
-  get isValid() {
-    if (this.group && this.group.isValid === false) {
-      return false;
-    }
-    if (this.props.error) {
-      return false;
-    }
-    if (!this.props.validators.length) ;
-    if (this.isPristine) {
-      return this.messages.value.length || this.validateOn.lazy ? null : true;
-    } else {
-      return !this.messages.value.length;
-    }
-  }
-  get isValidating() {
-    return this.validating.value;
-  }
-  get name() {
-    var _a;
-    return ((_a = this.group) == null ? void 0 : _a.name) ?? this.props.name ?? this.id;
-  }
-  get validateOn() {
-    var _a;
-    let value = (this.props.validateOn ?? ((_a = this.form) == null ? void 0 : _a.validateOn.value)) || "input";
-    if (value === "lazy") {
-      value = "input lazy";
-    }
-    const set = new Set((value == null ? void 0 : value.split(" ")) ?? []);
-    return {
-      blur: set.has("blur") || set.has("input"),
-      input: set.has("input"),
-      submit: set.has("submit"),
-      lazy: set.has("lazy")
-    };
-  }
-  get value() {
-    return this.model.value;
-  }
-  set value(value) {
-    this.model.value = value;
-  }
-  /**
-   * ## Add Error Message
-   *
-   * Add one or more validation messages to the field.
-   *
-   * @param message
-   */
-  addError(...message) {
-    this.messages.value.push(...message);
-  }
-  /**
-   * ## Add Validator
-   *
-   * Add one or more validation functions to the field.
-   *
-   * @param validator
-   */
-  addValidator(...validator) {
-    this.props.validators.push(...validator);
-  }
-  /**
-   * ## Blur
-   * @param e
-   */
-  blur() {
-    this.focused.value = false;
-    this.focusedVisible.value = false;
-  }
-  /**
-   * ## Focus
-   *
-   * @param e
-   */
-  focus(e) {
-    this.focused.value = true;
-    const el = e == null ? void 0 : e.target;
-    if (Browser.supportsFocusVisible && (el == null ? void 0 : el.matches(":focus-visible"))) {
-      this.focusedVisible.value = true;
-    }
-  }
-  /**
-   * ## Reset
-   */
-  reset() {
-    this.model.value = null;
-    nextTick(() => {
-      this.resetValidation();
-    });
-  }
-  /**
-   * ## Reset Validation
-   */
-  resetValidation() {
-    this.pristine.value = true;
-    if (!this.validateOn.lazy) {
-      this.validate(true);
-    } else {
-      this.messages.value = [];
-    }
-  }
-  /**
-   * ## Validate
-   */
-  async validate(silent = false) {
-    const results = [];
-    this.validating.value = true;
-    for (const validator of this.props.validators) {
-      const validatorFn = isFunction(validator) ? validator : () => validator;
-      const result = await validatorFn(this.validationModel.value);
-      if (result === true) {
-        continue;
-      }
-      if (!isString(result)) {
-        consoleWarn(
-          `${result} is not a valid value. Validator functions must return boolean true or a string.`
-        );
-        continue;
-      }
-      results.push(result);
-    }
-    this.messages.value = results;
-    this.validating.value = false;
-    this.pristine.value = silent;
-    return this.messages.value;
-  }
-}
-const makeFormFieldProps = propsFactory(
-  {
-    id: String,
-    disabled: Boolean,
-    error: Boolean,
-    name: String,
-    readonly: Boolean,
-    validators: {
-      type: Array,
-      default: []
-    },
-    modelValue: null,
-    validateOn: String,
-    validationValue: null,
-    ...makeFocusProps()
-  },
-  "validation"
-);
-function useFormField(props, group = void 0) {
-  const form = useForm();
-  return new FormField(form, props, group);
-}
-export {
-  useAutofocus as a,
-  makeFormFieldProps as m,
-  useFormField as u
-};
-//# sourceMappingURL=validation-DEqs8Ujs.mjs.map

package/dist/esm/chunks/validation-DEqs8Ujs.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"validation-DEqs8Ujs.mjs","sources":["../../../src/composables/focus.ts","../../../src/modules/Form/FormField.ts","../../../src/composables/validation.ts"],"sourcesContent":["import { useModelProxy } from \"./modelProxy\";\nimport { computed, ref } from \"vue\";\nimport { Browser, propsFactory } from \"@/util\";\n\n/**\n * # Focus Props Type\n */\nexport interface FocusProps {\n    focused?: boolean;\n    \"onUpdate:focused\"?: ((focused: boolean) => any) | undefined;\n}\n\n/**\n * # Make Focus Props\n */\nexport const makeFocusProps = propsFactory(\n    {\n        focused: Boolean,\n    },\n    \"focus\",\n);\n\n/**\n * # Use Focus Composable\n */\nexport function useFocus(props: FocusProps) {\n    const isFocused = useModelProxy(props, \"focused\");\n    const isFocusedVisible = ref(false);\n    const focusClasses = computed(() => {\n        return {\n            \"is-focused\": isFocused.value,\n            \"is-focused-visible\": isFocusedVisible.value,\n        };\n    });\n\n    function focus(e?: Event): void {\n        isFocused.value = true;\n        const el: HTMLElement | null = e?.target as HTMLElement;\n        if (Browser.supportsFocusVisible && el?.matches(\":focus-visible\")) {\n            isFocusedVisible.value = true;\n        }\n    }\n\n    function blur(): void {\n        isFocused.value = false;\n        isFocusedVisible.value = false;\n    }\n\n    return { isFocused, isFocusedVisible, focusClasses, focus, blur };\n}\n\n/**\n * ## Auto Focus\n */\nexport interface AutofocusProps {\n    autofocus: boolean;\n}\n\n/**\n * # Use Auto Focus\n * @param props\n */\nexport function useAutofocus(props: AutofocusProps) {\n    return {\n        mounted: (el: HTMLElement) => {\n            if (!props.autofocus) {\n                return;\n            }\n            el.focus();\n        },\n    };\n}\n","import {\r\n    computed,\r\n    nextTick,\r\n    onBeforeMount,\r\n    onBeforeUnmount,\r\n    onMounted,\r\n    Ref,\r\n    ref,\r\n    shallowRef,\r\n    watch,\r\n} from \"vue\";\r\nimport { FormFieldProps, Validator } from \"@/composables/validation\";\r\nimport {\r\n    Browser,\r\n    consoleWarn,\r\n    getCurrentComponent,\r\n    getNextId,\r\n    getPropertyValueByPath,\r\n    isFunction,\r\n    isString,\r\n    setPropertyValueByPath,\r\n    wrapInArray,\r\n} from \"@/util\";\r\nimport { Form } from \"@/modules/Form/Form\";\r\nimport { useToggleScope } from \"@/composables/toggleScope\";\r\nimport { useModelProxy } from \"@/composables/modelProxy\";\r\n\r\n/**\r\n * # Form Field\r\n *\r\n * @todo: decide on terminology for shapers/validators/resolvers/rules (it would be good to have shapers)\r\n *\r\n */\r\nexport class FormField {\r\n    public readonly focused: Ref<boolean>;\r\n    public readonly focusedVisible: Ref<boolean>;\r\n    private readonly messages: Ref<string[]> = ref([]);\r\n    public readonly model: Ref<any>;\r\n    public readonly pristine = shallowRef(true);\r\n    public readonly uid = getNextId();\r\n    public readonly validating = shallowRef(false);\r\n    private readonly validationModel: Ref<any>;\r\n\r\n    constructor(\r\n        public readonly form: Form | null,\r\n        private props: FormFieldProps,\r\n        private group: FormField | undefined = undefined,\r\n    ) {\r\n        const component = getCurrentComponent(\"FormField\");\r\n        const internalModel = ref(props.modelValue);\r\n\r\n        watch(\r\n            () => props.modelValue,\r\n            (value) => {\r\n                internalModel.value = value;\r\n            },\r\n        );\r\n\r\n        this.model = computed({\r\n            get() {\r\n                if (group) {\r\n                    return group.model.value;\r\n                }\r\n                if (form?.data.value && props.name) {\r\n                    return getPropertyValueByPath(form.data.value, props.name);\r\n                }\r\n                return internalModel.value;\r\n            },\r\n            set(value) {\r\n                if (group) {\r\n                    group.model.value = value;\r\n                } else if (form?.data.value && props.name) {\r\n                    setPropertyValueByPath(form.data.value, props.name, value);\r\n                } else {\r\n                    internalModel.value = value;\r\n                }\r\n                component.emit(\"update:modelValue\", value);\r\n            },\r\n        });\r\n\r\n        this.focused = useModelProxy(this.props, \"focused\");\r\n        this.focusedVisible = ref(false);\r\n\r\n        // We use a computed() Ref here for a valid watch()\r\n        this.validationModel = computed(() => {\r\n            return this.props.validationValue === undefined\r\n                ? this.model.value\r\n                : this.props.validationValue;\r\n        });\r\n\r\n        onBeforeMount(() => {\r\n            this.form?.addField(this);\r\n        });\r\n\r\n        onBeforeUnmount(() => {\r\n            this.form?.removeField(this.id);\r\n        });\r\n\r\n        onMounted(async () => {\r\n            if (!this.validateOn.lazy) {\r\n                await this.validate(true);\r\n            }\r\n        });\r\n\r\n        useToggleScope(\r\n            () => this.validateOn.input,\r\n            () => {\r\n                watch(this.validationModel, () => {\r\n                    if (this.validationModel.value != null) {\r\n                        this.validate();\r\n                    } else if (this.isFocused) {\r\n                        const unwatch = watch(\r\n                            () => this.focused.value,\r\n                            (value) => {\r\n                                if (!value) {\r\n                                    this.validate();\r\n                                }\r\n                                unwatch();\r\n                            },\r\n                        );\r\n                    }\r\n                });\r\n            },\r\n        );\r\n\r\n        useToggleScope(\r\n            () => this.validateOn.blur,\r\n            () => {\r\n                watch(\r\n                    () => this.focused.value,\r\n                    (value) => {\r\n                        if (!value) {\r\n                            this.validate();\r\n                        }\r\n                    },\r\n                );\r\n            },\r\n        );\r\n    }\r\n\r\n    get classes() {\r\n        return {\r\n            \"is-error\": this.isValid === false,\r\n            \"is-dirty\": this.isDirty,\r\n            \"is-disabled\": this.isDisabled,\r\n            \"is-readonly\": this.isReadonly,\r\n            \"is-focused\": this.isFocused,\r\n            \"is-focused-visible\": this.isFocusedVisible,\r\n        };\r\n    }\r\n\r\n    get errorMessages() {\r\n        return this.messages.value;\r\n    }\r\n\r\n    get id() {\r\n        return this.props.id || `input-${this.uid}`;\r\n    }\r\n\r\n    get isDirty() {\r\n        return !!(\r\n            wrapInArray(this.model.value === \"\" ? null : this.model.value)\r\n                .length ||\r\n            wrapInArray(\r\n                this.validationModel.value === \"\"\r\n                    ? null\r\n                    : this.validationModel.value,\r\n            ).length\r\n        );\r\n    }\r\n\r\n    get isDisabled(): boolean {\r\n        return !!(\r\n            this.props.disabled ||\r\n            this.group?.isDisabled ||\r\n            this.form?.isDisabled\r\n        );\r\n    }\r\n\r\n    get isFocused(): boolean {\r\n        return this.focused.value;\r\n    }\r\n\r\n    get isFocusedVisible(): boolean {\r\n        return this.focusedVisible.value;\r\n    }\r\n\r\n    get isReadonly(): boolean {\r\n        return !!(\r\n            this.props.readonly ||\r\n            this.group?.isReadonly ||\r\n            this.form?.isReadonly\r\n        );\r\n    }\r\n\r\n    get isPristine(): boolean {\r\n        return this.pristine.value;\r\n    }\r\n\r\n    get isShowErrorMessages(): boolean {\r\n        return !!this.errorMessages.length && !this.isPristine;\r\n    }\r\n\r\n    get isValid(): boolean | null {\r\n        if (this.group && this.group.isValid === false) {\r\n            return false;\r\n        }\r\n        if (this.props.error) {\r\n            return false;\r\n        }\r\n        if (!this.props.validators.length) {\r\n            // @todo: determine if this is needed\r\n            // I commented it out since it prevents server-side errors from being added\r\n            // return true;\r\n        }\r\n        if (this.isPristine) {\r\n            return this.messages.value.length || this.validateOn.lazy\r\n                ? null\r\n                : true;\r\n        } else {\r\n            return !this.messages.value.length;\r\n        }\r\n    }\r\n\r\n    get isValidating() {\r\n        return this.validating.value;\r\n    }\r\n\r\n    get name(): string {\r\n        return this.group?.name ?? this.props.name ?? this.id;\r\n    }\r\n\r\n    get validateOn() {\r\n        let value =\r\n            (this.props.validateOn ?? this.form?.validateOn.value) || \"input\";\r\n        if (value === \"lazy\") {\r\n            value = \"input lazy\";\r\n        }\r\n        const set = new Set(value?.split(\" \") ?? []);\r\n        return {\r\n            blur: set.has(\"blur\") || set.has(\"input\"),\r\n            input: set.has(\"input\"),\r\n            submit: set.has(\"submit\"),\r\n            lazy: set.has(\"lazy\"),\r\n        };\r\n    }\r\n\r\n    get value() {\r\n        return this.model.value;\r\n    }\r\n\r\n    set value(value) {\r\n        this.model.value = value;\r\n    }\r\n\r\n    /**\r\n     * ## Add Error Message\r\n     *\r\n     * Add one or more validation messages to the field.\r\n     *\r\n     * @param message\r\n     */\r\n    public addError(...message: string[]) {\r\n        this.messages.value.push(...message);\r\n    }\r\n\r\n    /**\r\n     * ## Add Validator\r\n     *\r\n     * Add one or more validation functions to the field.\r\n     *\r\n     * @param validator\r\n     */\r\n    public addValidator(...validator: Validator[]) {\r\n        this.props.validators.push(...validator);\r\n    }\r\n\r\n    /**\r\n     * ## Blur\r\n     * @param e\r\n     */\r\n    public blur(): void {\r\n        this.focused.value = false;\r\n        this.focusedVisible.value = false;\r\n    }\r\n\r\n    /**\r\n     * ## Focus\r\n     *\r\n     * @param e\r\n     */\r\n    public focus(e?: Event): void {\r\n        this.focused.value = true;\r\n        const el = e?.target as HTMLElement;\r\n        if (Browser.supportsFocusVisible && el?.matches(\":focus-visible\")) {\r\n            this.focusedVisible.value = true;\r\n        }\r\n    }\r\n\r\n    /**\r\n     * ## Reset\r\n     */\r\n    public reset() {\r\n        this.model.value = null;\r\n        nextTick(() => {\r\n            this.resetValidation();\r\n        });\r\n    }\r\n\r\n    /**\r\n     * ## Reset Validation\r\n     */\r\n    public resetValidation() {\r\n        this.pristine.value = true;\r\n        if (!this.validateOn.lazy) {\r\n            this.validate(true);\r\n        } else {\r\n            this.messages.value = [];\r\n        }\r\n    }\r\n\r\n    /**\r\n     * ## Validate\r\n     */\r\n    public async validate(silent = false) {\r\n        const results: string[] = [];\r\n        this.validating.value = true;\r\n        for (const validator of this.props.validators) {\r\n            const validatorFn = isFunction(validator)\r\n                ? validator\r\n                : () => validator;\r\n            const result = await validatorFn(this.validationModel.value);\r\n            if (result === true) {\r\n                continue;\r\n            }\r\n            if (!isString(result)) {\r\n                consoleWarn(\r\n                    `${result} is not a valid value. Validator functions must return boolean true or a string.`,\r\n                );\r\n                continue;\r\n            }\r\n            results.push(result);\r\n        }\r\n        this.messages.value = results;\r\n        this.validating.value = false;\r\n        this.pristine.value = silent;\r\n        return this.messages.value;\r\n    }\r\n}\r\n","import { propsFactory } from \"@/util\";\nimport { PropType } from \"vue\";\nimport { makeFocusProps } from \"@/composables/focus\";\nimport { useForm } from \"@/composables/form\";\nimport { FormField } from \"@/modules/Form/FormField\";\n\n/**\n * # Validation Error\n *\n * Represents a single error message with a name identifier.\n */\nexport interface ValidationError {\n    name: number | string;\n    message: string;\n}\n\n/**\n * # Validation Result\n */\nexport type ValidationResult = string | boolean;\n\n/**\n * # Validator\n */\nexport type Validator =\n    | ValidationResult\n    | PromiseLike<ValidationResult>\n    | ((value: any) => ValidationResult)\n    | ((value: any) => PromiseLike<ValidationResult>);\n\n/**\n * # Validate On Event\n */\nexport type ValidateOnEvent = \"blur\" | \"input\" | \"submit\";\n\n/**\n * # Form Field Props\n */\nexport interface FormFieldProps {\n    id?: string;\n    disabled?: boolean;\n    error?: boolean;\n    focused?: boolean;\n    name?: string;\n    readonly?: boolean;\n    validators: Validator[];\n    modelValue?: any;\n    validateOn?:\n        | ValidateOnEvent\n        | `${ValidateOnEvent} lazy`\n        | `lazy ${ValidateOnEvent}`\n        | \"lazy\";\n    validationValue?: any;\n}\n\n/**\n * # Make Form Field Props\n */\nexport const makeFormFieldProps = propsFactory(\n    {\n        id: String,\n        disabled: Boolean,\n        error: Boolean,\n        name: String,\n        readonly: Boolean,\n        validators: {\n            type: Array as PropType<FormFieldProps[\"validators\"]>,\n            default: [],\n        },\n        modelValue: null,\n        validateOn: String as PropType<FormFieldProps[\"validateOn\"]>,\n        validationValue: null,\n\n        ...makeFocusProps(),\n    },\n    \"validation\",\n);\n\n/**\n * # Use Form Field\n * @param props\n * @param group\n */\nexport function useFormField(\n    props: FormFieldProps,\n    group: FormField | undefined = undefined,\n) {\n    const form = useForm();\n    return new FormField(form, props, group);\n}\n"],"names":[],"mappings":"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"}