@featherds/input-helper - npm Package Compare versions

Comparing version 0.12.11 to 0.12.12

package.json

 {
   "name": "@featherds/input-helper",
-  "version": "0.12.11",
+  "version": "0.12.12",
   "publishConfig": {
@@ -12,3 +12,3 @@ "access": "public"
   "dependencies": {
-    "@featherds/styles": "^0.12.11",
+    "@featherds/styles": "^0.12.12",
     "vue": "^3.1.0-0"
@@ -21,3 +21,3 @@ },
   "types": "./src/index.d.ts",
-  "gitHead": "7feab2d15b93b7bb7a9ec967f0171479ec3fb90b"
+  "gitHead": "6ba4185b793290d8b0592d8d84b39a73cfb56a44"
 }

src/components/InputWrapper.spec.ts

 import InputWrapper from "./InputWrapper.vue";
 import { mount } from "@vue/test-utils";
 import "../../test/MutationObserver";
-import { ref } from "vue";
+import { reactive, ref } from "vue";
 import { expect, describe, it } from "vitest";
@@ -9,12 +9,12 @@
   return {
-    wrapperOptions: {
-      label: ref("test"),
-      error: ref(undefined),
-      clear: ref(""),
-      background: ref(false),
-      disabled: ref(false),
-      inline: ref(false),
-      hideLabel: ref(false),
+    wrapperOptions: reactive({
+      label: "test",
+      error: undefined,
+      clear: "",
+      background: false,
+      disabled: false,
+      inline: false,
+      hideLabel: false,
       ...(opts as Record<string, unknown>),
-    },
+    }),
   };
@@ -28,4 +28,8 @@ };
   };
-  options.global = { provide: provide(options.provide) };
-  return mount(InputWrapper, options);
+  const provideOptions = provide(options.provide);
+  options.global = { provide: provideOptions };
+  return {
+    wrapper: mount(InputWrapper, options),
+    options: provideOptions.wrapperOptions,
+  };
 };
@@ -35,3 +39,3 @@
   it("should render a normal wrapper", () => {
-    const wrapper = getWrapper();
+    const { wrapper } = getWrapper();
     expect(wrapper.element).toMatchSnapshot();
@@ -41,3 +45,3 @@ });
   it("should render a raised label", () => {
-    const wrapper = getWrapper({
+    const { wrapper } = getWrapper({
       props: {
@@ -50,3 +54,3 @@ raised: true,
   it("should render a focused border & raised label", () => {
-    const wrapper = getWrapper({
+    const { wrapper } = getWrapper({
       props: {
@@ -59,3 +63,3 @@ focused: true,
   it("should take into account any prefix elements when not raised", () => {
-    const wrapper = getWrapper({
+    const { wrapper } = getWrapper({
       slots: {
@@ -69,5 +73,5 @@ default:
   it("should render in an error state", () => {
-    const wrapper = getWrapper({
+    const { wrapper } = getWrapper({
       provide: {
-        error: ref("test"),
+        error: "test",
       },
@@ -78,13 +82,16 @@ });
 
-  it("should render in disabled state", () => {
-    const wrapper = getWrapper({
+  it("should render in disabled state", async () => {
+    const { wrapper, options } = getWrapper({
       provide: {
-        disabled: ref(true),
+        disabled: false,
       },
     });
     expect(wrapper.element).toMatchSnapshot();
+    options.disabled = true;
+    await wrapper.vm.$nextTick();
+    expect(wrapper.element).toMatchSnapshot();
   });
 
   it("should render clear icon when clear and show clear is set", () => {
-    const wrapper = getWrapper({
+    const { wrapper } = getWrapper({
       props: {
@@ -94,3 +101,3 @@ showClear: true,
       provide: {
-        clear: ref("Clear Text"),
+        clear: "Clear Text",
       },
@@ -101,3 +108,3 @@ });
   it("should render clear and error icons", () => {
-    const wrapper = getWrapper({
+    const { wrapper } = getWrapper({
       props: {
@@ -107,4 +114,4 @@ showClear: true,
       provide: {
-        error: ref("Error Text"),
-        clear: ref("Clear Text"),
+        error: "Error Text",
+        clear: "Clear Text",
       },
@@ -115,5 +122,5 @@ });
   it("should have an label data-ref", () => {
-    const wrapper = getWrapper({
+    const { wrapper } = getWrapper({
       provide: {
-        label: ref("label"),
+        label: "label",
       },
@@ -126,3 +133,3 @@ });
   it("should hide the label when hideLabel is true", () => {
-    const wrapper = getWrapper({
+    const { wrapper } = getWrapper({
       provide: {
@@ -129,0 +136,0 @@ hideLabel: true,

src/composables/useValidation.ts

@@ -21,3 +21,3 @@ import { inject, ref, provide, watch, isRef, onBeforeUnmount, Ref } from "vue";
       //if error comes from input then we always use it as our validation
-      //this accomodates server side error beiung passed to input
+      //this accomodates server side error being passed to input
       if (errorFromInput && isRef(errorFromInput) && errorFromInput.value) {
@@ -24,0 +24,0 @@ errorMessage.value = errorFromInput.value;

src/index.d.ts

@@ -17,3 +17,5 @@ import { DefineComponent, ExtractPropTypes } from "vue";
 
-export const InputSubText: DefineComponent;
+export const InputSubText: DefineComponent<
+  typeof import("./components/InputSubText.vue").props
+>;
 export const ValidationHeader: DefineComponent<
@@ -20,0 +22,0 @@ typeof import("./components/ValidationHeader.vue").props

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

Improved metrics

Lines of code

1325

increased by2.08%

Worsened metrics

Total package byte prevSize

78485

decreased by-3.17%

Dependency changes

• Updated@featherds/styles@^0.12.12