@featherds/input-helper - npm Package Compare versions

Comparing version 0.10.2 to 0.10.3

dist/app.es.js

@@ -21,9 +21,9 @@ var __defProp = Object.defineProperty;
 import { FeatherIcon } from "@featherds/icon";
-import { resolveComponent, openBlock, createElementBlock, createVNode, createBlock, withModifiers, markRaw, inject, computed, normalizeClass, createElementVNode, toDisplayString, renderSlot, createCommentVNode, withDirectives, vShow, ref, toRef, nextTick, watch, createTextVNode, Fragment, renderList, provide, isRef, onBeforeUnmount } from "vue";
+import { defineComponent, resolveComponent, openBlock, createElementBlock, createVNode, createBlock, withModifiers, inject, computed, normalizeClass, createElementVNode, toDisplayString, renderSlot, createCommentVNode, withDirectives, vShow, ref, toRef, nextTick, watch, createTextVNode, Fragment, renderList, provide, isRef, onBeforeUnmount } from "vue";
 import Cancel from "@featherds/icon/navigation/Cancel";
 import Error2 from "@featherds/icon/notification/Warning";
 var ActionIcon_vue_vue_type_style_index_0_scoped_true_lang = "";
-var _export_sfc = (sfc, props) => {
+var _export_sfc = (sfc, props2) => {
   const target = sfc.__vccOpts || sfc;
-  for (const [key, val] of props) {
+  for (const [key, val] of props2) {
     target[key] = val;
@@ -33,17 +33,18 @@ }
 };
-const _sfc_main$5 = {
-  props: {
-    title: {
-      type: String,
-      default: ""
-    },
-    icon: {
-      type: Object,
-      required: true
-    }
+const props$2 = {
+  title: {
+    type: String,
+    default: ""
   },
+  icon: {
+    type: Object,
+    required: true
+  }
+};
+const _sfc_main$5 = defineComponent({
+  props: props$2,
   components: {
     FeatherIcon
   }
-};
+});
 const _hoisted_1$3 = ["title"];
@@ -53,11 +54,11 @@ function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("a", {
-    title: $props.title,
+    title: _ctx.title,
     class: "action-icon hide-when-disabled",
     href: "#"
   }, [
-    createVNode(_component_FeatherIcon, { icon: $props.icon }, null, 8, ["icon"])
+    createVNode(_component_FeatherIcon, { icon: _ctx.icon }, null, 8, ["icon"])
   ], 8, _hoisted_1$3);
 }
-var ActionIcon = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["render", _sfc_render$5], ["__scopeId", "data-v-5ae6c940"]]);
-const _sfc_main$4 = {
+var ActionIcon = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["render", _sfc_render$5], ["__scopeId", "data-v-4265058e"]]);
+const _sfc_main$4 = defineComponent({
   emits: ["clear"],
@@ -78,3 +79,3 @@ props: {
   }
-};
+});
 function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
@@ -84,4 +85,4 @@ const _component_ActionIcon = resolveComponent("ActionIcon");
     onClick: _cache[0] || (_cache[0] = withModifiers(($event) => _ctx.$emit("clear"), ["stop", "prevent"])),
-    title: $props.clear,
-    icon: $options.clearIcon,
+    title: _ctx.clear,
+    icon: _ctx.clearIcon,
     "data-ref-id": "feather-form-element-clear"
@@ -92,6 +93,6 @@ }, null, 8, ["title", "icon"]);
 var ErrorIcon_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _sfc_main$3 = {
+const _sfc_main$3 = defineComponent({
   computed: {
     errorIcon() {
-      return markRaw(Error2);
+      return Error2;
     }
@@ -102,7 +103,7 @@ },
   }
-};
+});
 function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_FeatherIcon = resolveComponent("FeatherIcon");
   return openBlock(), createBlock(_component_FeatherIcon, {
-    icon: $options.errorIcon,
+    icon: _ctx.errorIcon,
     class: "error-icon hide-when-disabled",
@@ -112,35 +113,40 @@ "data-ref-id": "error-icon"
 }
-var ErrorIcon = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3], ["__scopeId", "data-v-6151f1fb"]]);
+var ErrorIcon = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3], ["__scopeId", "data-v-0b8faef3"]]);
 var InputWrapper_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _sfc_main$2 = {
-  emits: ["clear", "wrapper-click"],
-  props: {
-    for: {
-      type: String,
-      required: true
-    },
-    focused: {
-      type: Boolean,
-      default: false
-    },
-    showClear: {
-      type: Boolean,
-      default: false
-    },
-    clearText: {
-      type: String
-    },
-    raised: {
-      type: Boolean,
-      default: false
-    }
+const props$1 = {
+  for: {
+    type: String,
+    required: true
   },
+  focused: {
+    type: Boolean,
+    default: false
+  },
+  showClear: {
+    type: Boolean,
+    default: false
+  },
+  clearText: {
+    type: String
+  },
+  raised: {
+    type: Boolean,
+    default: false
+  }
+};
+const emits = {
+  clear: () => true,
+  "wrapper-click": (e) => true
+};
+const _sfc_main$2 = defineComponent({
+  emits,
+  props: props$1,
   data() {
     return {
       prefixWidth: 0,
-      prefixObserver: null
+      prefixObserver: void 0
     };
   },
   setup() {
-    const options = inject("wrapperOptions");
+    const options = inject("wrapperOptions", {});
     const errorMessage = inject("validationErrorMessage", false);
@@ -233,3 +239,3 @@ const error = computed(() => {
   }
-};
+});
 const _hoisted_1$2 = {
@@ -246,3 +252,3 @@ "aria-hidden": "true",
   return openBlock(), createElementBlock("div", {
-    class: normalizeClass(["feather-input-wrapper-container", $options.containerCls])
+    class: normalizeClass(["feather-input-wrapper-container", _ctx.containerCls])
   }, [
@@ -254,3 +260,3 @@ createElementVNode("fieldset", _hoisted_1$2, [
       class: "feather-input-label",
-      for: $options.inputId,
+      for: _ctx.inputId,
       "data-ref-id": "feather-form-element-label"
@@ -260,3 +266,3 @@ }, toDisplayString(_ctx.label), 9, _hoisted_2$2),
       class: "feather-input-wrapper",
-      onClick: _cache[1] || (_cache[1] = (...args) => $options.handleWrapperClick && $options.handleWrapperClick(...args))
+      onClick: _cache[1] || (_cache[1] = (...args) => _ctx.handleWrapperClick && _ctx.handleWrapperClick(...args))
     }, [
@@ -268,8 +274,8 @@ createElementVNode("div", _hoisted_3$2, [
       createElementVNode("div", _hoisted_4$2, [
-        $props.showClear && $options.computedClearText ? (openBlock(), createBlock(_component_ClearIcon, {
+        _ctx.showClear && _ctx.computedClearText ? (openBlock(), createBlock(_component_ClearIcon, {
           key: 0,
-          clear: $options.computedClearText,
+          clear: _ctx.computedClearText,
           onClear: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("clear"))
         }, null, 8, ["clear"])) : createCommentVNode("", true),
-        $setup.error ? (openBlock(), createBlock(_component_ErrorIcon, { key: 1 })) : createCommentVNode("", true),
+        _ctx.error ? (openBlock(), createBlock(_component_ErrorIcon, { key: 1 })) : createCommentVNode("", true),
         renderSlot(_ctx.$slots, "post", {}, void 0, true)
@@ -280,49 +286,7 @@ ])
 }
-var InputWrapper = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2], ["__scopeId", "data-v-35706372"]]);
-var InputWrapperMixin = {
-  props: {
-    label: {
-      type: String,
-      required: true
-    },
-    error: {
-      type: String
-    },
-    clear: {
-      type: String,
-      default: ""
-    },
-    background: {
-      type: Boolean,
-      default: false
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    inline: {
-      type: Boolean,
-      default: false
-    },
-    hideLabel: {
-      type: Boolean,
-      default: false
-    }
-  },
-  provide() {
-    return {
-      wrapperOptions: this.$props
-    };
-  }
-};
+var InputWrapper = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2], ["__scopeId", "data-v-a340a5b4"]]);
 var InputSubText_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _sfc_main$1 = {
-  props: {
-    id: {
-      type: String,
-      required: true
-    }
-  },
+const _sfc_main$1 = defineComponent({
   setup() {
-    const options = inject("subTextOptions");
+    const options = inject("subTextOptions", {});
     const errorMessage = inject("validationErrorMessage", false);
@@ -340,4 +304,4 @@ const error = computed(() => {
   }
-};
-const _hoisted_1$1 = ["id"];
+});
+const _hoisted_1$1 = { class: "feather-input-sub-text" };
 const _hoisted_2$1 = {
@@ -359,63 +323,40 @@ key: 0,
 function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
-  return withDirectives((openBlock(), createElementBlock("div", {
-    class: "feather-input-sub-text",
-    id: $props.id
-  }, [
-    !_ctx.hint && !$setup.error.length ? (openBlock(), createElementBlock("div", _hoisted_2$1, "\xA0")) : createCommentVNode("", true),
-    _ctx.hint && !$setup.error.length ? (openBlock(), createElementBlock("div", _hoisted_3$1, toDisplayString(_ctx.hint), 1)) : createCommentVNode("", true),
-    $setup.error.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_4$1, toDisplayString($setup.error), 1)) : createCommentVNode("", true),
+  return withDirectives((openBlock(), createElementBlock("div", _hoisted_1$1, [
+    !_ctx.hint && !_ctx.error.length ? (openBlock(), createElementBlock("div", _hoisted_2$1, "\xA0")) : createCommentVNode("", true),
+    _ctx.hint && !_ctx.error.length ? (openBlock(), createElementBlock("div", _hoisted_3$1, toDisplayString(_ctx.hint), 1)) : createCommentVNode("", true),
+    _ctx.error.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_4$1, toDisplayString(_ctx.error), 1)) : createCommentVNode("", true),
     renderSlot(_ctx.$slots, "right", {}, void 0, true)
-  ], 8, _hoisted_1$1)), [
-    [vShow, !_ctx.inline || _ctx.hint || $setup.error.length]
+  ], 512)), [
+    [vShow, !_ctx.inline || _ctx.hint || _ctx.error.length]
   ]);
 }
-var InputSubText = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1], ["__scopeId", "data-v-7fc42122"]]);
-var InputSubTextMixin = {
-  props: {
-    hint: {
-      type: String
-    },
-    error: {
-      type: String
-    },
-    inline: {
-      type: Boolean,
-      default: false
+var InputSubText = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1], ["__scopeId", "data-v-8e0ac99e"]]);
+const props = {
+  headingText: {
+    type: Function,
+    default: (errors) => {
+      if (errors.length && errors.length === 1)
+        return "1 error";
+      return `${errors.length} errors`;
     }
   },
-  provide() {
-    return {
-      subTextOptions: this.$props
-    };
+  errorList: {
+    type: Array,
+    default: () => []
+  },
+  generalError: {
+    type: String,
+    default: ""
   }
 };
-var InputInheritAttrsMixin = {
-  inheritAttrs: false,
-  computed: {
-    inherittedAttrs() {
-      return {
-        class: this.$attrs.class,
-        "data-ref-id": this.$attrs["data-ref-id"]
-      };
-    }
-  }
-};
-const _sfc_main = {
-  props: {
-    headingText: {
-      type: Function,
-      default: (errors) => {
-        if (errors.length && errors.length === 1)
-          return "1 error";
-        return `${errors.length} errors`;
-      }
-    },
-    generalError: {
-      type: String,
-      default: ""
-    }
-  },
-  setup(props) {
-    const errorList = inject("featherFormErrors", ref([]));
-    const mainError = toRef(props, "generalError");
+const _sfc_main = defineComponent({
+  props,
+  setup(props2) {
+    const formErrors = inject("featherFormErrors", ref([]));
+    const propErrors = toRef(props2, "errorList");
+    const errors = computed(() => {
+      var _a;
+      return ((_a = propErrors.value) == null ? void 0 : _a.length) ? propErrors.value : formErrors.value;
+    });
+    const mainError = toRef(props2, "generalError");
     const focusElement = (id) => {
@@ -428,8 +369,5 @@ document.getElementById(id).focus();
     const heading = ref();
-    const errors = computed(() => {
-      return errorList.value.map((v) => {
-        v.fullMessage = `${removeAsteriks(v.label)} - ${v.message}`;
-        return v;
-      });
-    });
+    const getFullMessage = (v) => {
+      return `${removeAsteriks(v.label)} - ${v.message}`;
+    };
     const errorsHeading = computed(() => {
@@ -439,3 +377,3 @@ if (errors.value.length) {
       }
-      return props.headingText(errors.value);
+      return props2.headingText(errors.value);
     });
@@ -452,6 +390,7 @@ watch(mainError, (v) => {
       focusElement,
-      mainError
+      mainError,
+      getFullMessage
     };
   }
-};
+});
 const _hoisted_1 = {
@@ -471,12 +410,12 @@ key: 0,
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return $setup.errors.length || $setup.mainError.length ? (openBlock(), createElementBlock("div", _hoisted_1, [
+  return _ctx.errors.length || _ctx.mainError.length ? (openBlock(), createElementBlock("div", _hoisted_1, [
     createElementVNode("div", _hoisted_2, [
-      $setup.errors.length ? (openBlock(), createElementBlock("span", _hoisted_3, [
-        createTextVNode(toDisplayString($setup.errorsHeading), 1),
+      _ctx.errors.length ? (openBlock(), createElementBlock("span", _hoisted_3, [
+        createTextVNode(toDisplayString(_ctx.errorsHeading), 1),
         _hoisted_4
       ])) : createCommentVNode("", true),
-      createTextVNode(" " + toDisplayString($setup.mainError), 1)
+      createTextVNode(" " + toDisplayString(_ctx.mainError), 1)
     ], 512),
     createElementVNode("ul", null, [
-      (openBlock(true), createElementBlock(Fragment, null, renderList($setup.errors, (item) => {
+      (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.errors, (item) => {
         return openBlock(), createElementBlock("li", {
@@ -487,4 +426,4 @@ key: item.inputId
             href: "#",
-            onClick: withModifiers(($event) => $setup.focusElement(item.inputId), ["prevent"])
-          }, toDisplayString(item.fullMessage), 9, _hoisted_5)
+            onClick: withModifiers(($event) => _ctx.focusElement(item.inputId), ["prevent"])
+          }, toDisplayString(_ctx.getFullMessage(item)), 9, _hoisted_5)
         ]);
@@ -552,6 +491,7 @@ }), 128))
       } catch (e) {
-        errorMessage.value = e.errors[0];
+        const err = e;
+        errorMessage.value = err.errors[0];
         return {
           success: false,
-          message: e.errors[0],
+          message: err.errors[0],
           inputId: inputId.value,
@@ -568,6 +508,6 @@ label
     watch(inputId, (curr, old) => {
-      if (curr) {
+      if (curr && form) {
         form.register(curr, validate);
       }
-      if (old) {
+      if (old && form) {
         form.deregister(old);
@@ -640,2 +580,2 @@ }
 };
-export { ActionIcon, InputInheritAttrsMixin, InputSubText, InputSubTextMixin, InputSubTextProps, InputWrapper, InputWrapperMixin, InputWrapperProps, ValidationHeader, useForm, useInputInheritAttrs, useInputSubText, useInputWrapper, useValidation };
+export { ActionIcon, InputSubText, InputSubTextProps, InputWrapper, InputWrapperProps, ValidationHeader, useForm, useInputInheritAttrs, useInputSubText, useInputWrapper, useValidation };

package.json

 {
   "name": "@featherds/input-helper",
-  "version": "0.10.2",
+  "version": "0.10.3",
   "publishConfig": {
@@ -12,3 +12,3 @@ "access": "public"
   "dependencies": {
-    "@featherds/styles": "^0.10.2",
+    "@featherds/styles": "^0.10.3",
     "vue": "^3.1.0-0"
@@ -21,3 +21,3 @@ },
   "types": "./src/index.d.ts",
-  "gitHead": "962dcee415575770eb0bc2781bfd29288873176e"
+  "gitHead": "52cfa2d3253a4db3ec6c1b66bb77dc5b1faff3c2"
 }

src/composables/InputWrapper.ts

@@ -31,3 +31,3 @@ import { provide, ExtractPropTypes } from "vue";
   },
-};
+} as const;
 
@@ -34,0 +34,0 @@ export const useInputWrapper = (

src/index.d.ts

@@ -1,65 +0,39 @@
-declare module "@featherds/input-helper" {
-  import { DefineComponent, Ref, ComputedRef, ExtractPropTypes } from "vue";
-  const ActionIcon: DefineComponent;
-  const InputWrapper: DefineComponent;
-  const InputWrapperMixin: DefineComponent;
-  const InputSubText: DefineComponent;
-  const InputSubTextMixin: DefineComponent;
-  const InputInheritAttrsMixin: DefineComponent;
-  const ValidationHeader: DefineComponent;
-  const useInputInheritAttrs: (attrs: Record<string, unknown>) => {
-    inherittedAttrs: ComputedRef<{
-      class: string;
-      "data-ref-id": string;
-    }>;
-  };
-  type InputSubTextProps =
-    typeof import("./composables/InputSubText").InputSubTextProps;
-  const useInputSubText: (u: ExtractPropTypes<InputSubTextProps>) => void;
-  const InputSubTextProps: InputSubTextProps;
+import { DefineComponent, ExtractPropTypes } from "vue";
+export const InputWrapper: DefineComponent<
+  typeof import("./components/InputWrapper.vue").props,
+  {},
+  {},
+  {},
+  {},
+  {},
+  {},
+  typeof import("./components/InputWrapper.vue").emits
+>;
 
-  type InputWrapperProps =
-    typeof import("./composables/InputWrapper").InputWrapperProps;
-  const useInputWrapper: (u: ExtractPropTypes<InputWrapperProps>) => void;
-  const InputWrapperProps: InputWrapperProps;
+export const ActionIcon: DefineComponent<
+  typeof import("./components/ActionIcon.vue").props
+>;
 
-  const useForm: () => {
-    validate: () => {
-      success: boolean;
-      message: string;
-      inputId: string;
-      label: string;
-    }[];
-  };
-  const useValidation: (
-    inputId: Ref<string | undefined>,
-    value: Ref<unknown>,
-    label: string,
-    schema: Object,
-    error?: Ref<string>
-  ) => {
-    validate: () => {
-      success: boolean;
-      message: string;
-      inputId: string;
-      label: string;
-    };
-  };
+export const InputSubText: DefineComponent;
+export const ValidationHeader: DefineComponent<
+  typeof import("./components/ValidationHeader.vue").props
+>;
 
-  export {
-    ActionIcon,
-    InputWrapper,
-    InputWrapperMixin,
-    InputSubText,
-    InputSubTextMixin,
-    InputInheritAttrsMixin,
-    ValidationHeader,
-    useForm,
-    useValidation,
-    useInputInheritAttrs,
-    useInputSubText,
-    InputSubTextProps,
-    useInputWrapper,
-    InputWrapperProps,
-  };
-}
+export const useInputInheritAttrs: typeof import("./composables/InputInheritAttrs").useInputInheritAttrs;
+
+export const InputSubTextProps: typeof import("./composables/InputSubText").InputSubTextProps;
+export const useInputSubText: (
+  u: ExtractPropTypes<typeof InputSubTextProps>
+) => void;
+
+export const InputWrapperProps: typeof import("./composables/InputWrapper").InputWrapperProps;
+export const useInputWrapper: (
+  u: ExtractPropTypes<typeof InputWrapperProps>
+) => void;
+export const useForm: typeof import("./composables/useForm").useForm;
+export const useValidation: typeof import("./composables/useValidation").useValidation;
+export {
+  IValidationResult,
+  IValidationFailure,
+  IValidationSuccess,
+} from "./composables/useForm";

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

76275

decreased by-0.12%

Number of package files

24

decreased by-11.11%

Lines of code

1224

decreased by-9.06%

Dependency changes

• Updated@featherds/styles@^0.10.3