@mekari/pixel-autocomplete - npm Package Compare versions

Comparing version 0.5.0 to 0.5.1

dist/mekari-pixel-autocomplete.cjs.dev.js

@@ -10,3 +10,2 @@ 'use strict';
 var pixelIcon = require('@mekari/pixel-icon');
-var pixelPseudoBox = require('@mekari/pixel-pseudo-box');
 var pixelSpinner = require('@mekari/pixel-spinner');
@@ -16,2 +15,15 @@ var pixelUtils = require('@mekari/pixel-utils');
 /**
+ * Exported autocomplete utilities.
+ */
+
+/**
+ * isObject
+ * @param {*} obj
+ * @returns {Boolean}
+ */
+function isObject(obj) {
+  return Object.prototype.toString.call(obj) === '[object Object]';
+}
+
+/**
  * Exported autocomplete properties.
@@ -125,2 +137,12 @@ *
   mounted() {
+    if (!pixelUtils.isUndef(this.data)) {
+      this.data.forEach((item, index) => {
+        if (isObject(item)) {
+          if (!item.value) {
+            console.error(`[MpAutocomplete] Missing required property : "value". Found in prop "data" index "${index}."`);
+          }
+        }
+      });
+    }
+
     if (!pixelUtils.isUndef(this.value) && this.labelProp !== 'value') {
@@ -175,2 +197,14 @@ const data = this.data.find(item => item.value === this.value);
       this.currentValue = e;
+
+      if (!pixelUtils.isUndef(this.value) && this.labelProp === 'value') {
+        this.currentSearch = e;
+        this.currentLabel = e;
+      } else {
+        const data = this.data.find(item => item.value === this.value);
+
+        if (pixelUtils.isNonNullObject(data)) {
+          this.currentSearch = data[this.labelProp];
+          this.currentLabel = data[this.labelProp];
+        }
+      }
     },
@@ -317,10 +351,3 @@
       }
-    }) : h(pixelPseudoBox.MpPseudoBox, {
-      attrs: {
-        display: 'flex'
-      },
-      on: {
-        click: this.handleFocus
-      }
-    }, [h(pixelIcon.MpIcon, {
+    }) : h(pixelIcon.MpIcon, {
       props: {
@@ -334,4 +361,7 @@ name: 'chevrons-down',
         focusable: false
+      },
+      nativeOn: {
+        click: this.handleFocus
       }
-    })])])])])]), h(pixelPopover.MpPopoverContent, {
+    })])])])]), h(pixelPopover.MpPopoverContent, {
       attrs: {
@@ -338,0 +368,0 @@ width: 'auto',

dist/mekari-pixel-autocomplete.cjs.prod.js

@@ -10,3 +10,2 @@ 'use strict';
 var pixelIcon = require('@mekari/pixel-icon');
-var pixelPseudoBox = require('@mekari/pixel-pseudo-box');
 var pixelSpinner = require('@mekari/pixel-spinner');
@@ -16,2 +15,15 @@ var pixelUtils = require('@mekari/pixel-utils');
 /**
+ * Exported autocomplete utilities.
+ */
+
+/**
+ * isObject
+ * @param {*} obj
+ * @returns {Boolean}
+ */
+function isObject(obj) {
+  return Object.prototype.toString.call(obj) === '[object Object]';
+}
+
+/**
  * Exported autocomplete properties.
@@ -125,2 +137,12 @@ *
   mounted() {
+    if (!pixelUtils.isUndef(this.data)) {
+      this.data.forEach((item, index) => {
+        if (isObject(item)) {
+          if (!item.value) {
+            console.error(`[MpAutocomplete] Missing required property : "value". Found in prop "data" index "${index}."`);
+          }
+        }
+      });
+    }
+
     if (!pixelUtils.isUndef(this.value) && this.labelProp !== 'value') {
@@ -175,2 +197,14 @@ const data = this.data.find(item => item.value === this.value);
       this.currentValue = e;
+
+      if (!pixelUtils.isUndef(this.value) && this.labelProp === 'value') {
+        this.currentSearch = e;
+        this.currentLabel = e;
+      } else {
+        const data = this.data.find(item => item.value === this.value);
+
+        if (pixelUtils.isNonNullObject(data)) {
+          this.currentSearch = data[this.labelProp];
+          this.currentLabel = data[this.labelProp];
+        }
+      }
     },
@@ -317,10 +351,3 @@
       }
-    }) : h(pixelPseudoBox.MpPseudoBox, {
-      attrs: {
-        display: 'flex'
-      },
-      on: {
-        click: this.handleFocus
-      }
-    }, [h(pixelIcon.MpIcon, {
+    }) : h(pixelIcon.MpIcon, {
       props: {
@@ -334,4 +361,7 @@ name: 'chevrons-down',
         focusable: false
+      },
+      nativeOn: {
+        click: this.handleFocus
       }
-    })])])])])]), h(pixelPopover.MpPopoverContent, {
+    })])])])]), h(pixelPopover.MpPopoverContent, {
       attrs: {
@@ -338,0 +368,0 @@ width: 'auto',

dist/mekari-pixel-autocomplete.esm.js

@@ -6,3 +6,2 @@ import { MpInputGroup, MpInput, MpInputRightAddon } from '@mekari/pixel-input';
 import { MpIcon } from '@mekari/pixel-icon';
-import { MpPseudoBox } from '@mekari/pixel-pseudo-box';
 import { MpSpinner } from '@mekari/pixel-spinner';
@@ -12,2 +11,15 @@ import { createStyledAttrsMixin, isUndef, isNonNullObject, useId, getElementById } from '@mekari/pixel-utils';
 /**
+ * Exported autocomplete utilities.
+ */
+
+/**
+ * isObject
+ * @param {*} obj
+ * @returns {Boolean}
+ */
+function isObject(obj) {
+  return Object.prototype.toString.call(obj) === '[object Object]';
+}
+
+/**
  * Exported autocomplete properties.
@@ -121,2 +133,12 @@ *
   mounted() {
+    if (!isUndef(this.data)) {
+      this.data.forEach((item, index) => {
+        if (isObject(item)) {
+          if (!item.value) {
+            console.error(`[MpAutocomplete] Missing required property : "value". Found in prop "data" index "${index}."`);
+          }
+        }
+      });
+    }
+
     if (!isUndef(this.value) && this.labelProp !== 'value') {
@@ -171,2 +193,14 @@ const data = this.data.find(item => item.value === this.value);
       this.currentValue = e;
+
+      if (!isUndef(this.value) && this.labelProp === 'value') {
+        this.currentSearch = e;
+        this.currentLabel = e;
+      } else {
+        const data = this.data.find(item => item.value === this.value);
+
+        if (isNonNullObject(data)) {
+          this.currentSearch = data[this.labelProp];
+          this.currentLabel = data[this.labelProp];
+        }
+      }
     },
@@ -313,10 +347,3 @@
       }
-    }) : h(MpPseudoBox, {
-      attrs: {
-        display: 'flex'
-      },
-      on: {
-        click: this.handleFocus
-      }
-    }, [h(MpIcon, {
+    }) : h(MpIcon, {
       props: {
@@ -330,4 +357,7 @@ name: 'chevrons-down',
         focusable: false
+      },
+      nativeOn: {
+        click: this.handleFocus
       }
-    })])])])])]), h(MpPopoverContent, {
+    })])])])]), h(MpPopoverContent, {
       attrs: {
@@ -334,0 +364,0 @@ width: 'auto',

package.json

 {
   "name": "@mekari/pixel-autocomplete",
   "description": "Mekari Pixel | Selecting items in a list from a text input component",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "homepage": "https://mekari.design/",
@@ -28,3 +28,3 @@ "repository": {
     "@mekari/pixel-box": "^0.0.9",
-    "@mekari/pixel-icon": "^0.8.2",
+    "@mekari/pixel-icon": "^0.8.3",
     "@mekari/pixel-input": "^0.3.7",
@@ -31,0 +31,0 @@ "@mekari/pixel-popover": "^0.2.8",

src/autocomplete.js

@@ -12,3 +12,2 @@ import { MpInput, MpInputGroup, MpInputRightAddon } from '@mekari/pixel-input'
 import { MpIcon } from '@mekari/pixel-icon'
-import { MpPseudoBox } from '@mekari/pixel-pseudo-box'
 import { MpSpinner } from '@mekari/pixel-spinner'
@@ -22,2 +21,3 @@ import {
 } from '@mekari/pixel-utils'
+import { isObject } from './utils/autocomplete.utils'
 import { useAutocompleteProps } from './utils/autocomplete.props'
@@ -50,5 +50,16 @@
   mounted() {
+    if (!isUndef(this.data)) {
+      this.data.forEach((item, index) => {
+        if (isObject(item)) {
+          if (!item.value) {
+            console.error(
+              `[MpAutocomplete] Missing required property : "value". Found in prop "data" index "${index}."`
+            )
+          }
+        }
+      })
+    }
+
     if (!isUndef(this.value) && this.labelProp !== 'value') {
       const data = this.data.find((item) => item.value === this.value)
-
       if (isNonNullObject(data)) {
@@ -97,2 +108,13 @@ this.currentSearch = data[this.labelProp]
       this.currentValue = e
+
+      if (!isUndef(this.value) && this.labelProp === 'value') {
+        this.currentSearch = e
+        this.currentLabel = e
+      } else {
+        const data = this.data.find((item) => item.value === this.value)
+        if (isNonNullObject(data)) {
+          this.currentSearch = data[this.labelProp]
+          this.currentLabel = data[this.labelProp]
+        }
+      }
     },
@@ -248,26 +270,16 @@ data(e) {
                             })
-                          : h(
-                              MpPseudoBox,
-                              {
-                                attrs: {
-                                  display: 'flex'
-                                },
-                                on: {
-                                  click: this.handleFocus
-                                }
+                          : h(MpIcon, {
+                              props: {
+                                name: 'chevrons-down',
+                                size: 'sm',
+                                color: 'gray.600'
                               },
-                              [
-                                h(MpIcon, {
-                                  props: {
-                                    name: 'chevrons-down',
-                                    size: 'sm',
-                                    color: 'gray.600'
-                                  },
-                                  attrs: {
-                                    color: 'currentColor',
-                                    focusable: false
-                                  }
-                                })
-                              ]
-                            )
+                              attrs: {
+                                color: 'currentColor',
+                                focusable: false
+                              },
+                              nativeOn: {
+                                click: this.handleFocus
+                              }
+                            })
                       ]
@@ -274,0 +286,0 @@ )

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

Total package byte prevSize

52571

increased by5.56%

Number of package files

10

increased by11.11%

Lines of code

1651

increased by6.24%

Dependency changes

• Updated@mekari/pixel-icon@^0.8.3