@elvia/elvis-dropdown - npm Package Compare versions

Comparing version 2.3.0 to 2.4.0

CHANGELOG.json

@@ -5,2 +5,14 @@ {
     {
+      "date": "12.04.22",
+      "version": "2.4.0 ",
+      "changelog": [
+        {
+          "type": "new_feature",
+          "changes": [
+            "Now possible to add icon in the options object to display icons in the dropdown options. Note that you need to pass icons to all objects in the options array to display icons."
+          ]
+        }
+      ]
+    },
+    {
       "date": "07.04.22",
@@ -7,0 +19,0 @@ "version": "2.3.0 ",

dist/react/js/elvia-dropdown.js

@@ -177,6 +177,8 @@ /*
       display: 'flex',
-      alignContent: 'center',
+      alignItems: 'center',
       backgroundColor: decideOptionBg(state.isFocused, state.isSelected, state.isMulti),
       color: getColor('black'),
       height: isCompact ? '36px' : '48px',
+      paddingTop: '7px',
+      paddingBottom: '7px',
       paddingLeft: isCompact ? '9px' : '15px',
@@ -225,3 +227,5 @@ fontSize: isCompact ? '14px' : '16px',
       margin: '0px',
-      maxWidth: 'calc(100% - 12px)'
+      maxWidth: 'calc(100% - 12px)',
+      display: 'flex',
+      alignItems: 'center'
     }),
@@ -238,4 +242,15 @@ valueContainer: (provided, state) => ({ ...provided,
     })
+  }; // helper function to determine if options array have valid icon attributes.
+
+  const allOptionsHaveIconAttribute = () => {
+    for (const dropdownOption of options) {
+      if (dropdownOption.icon === undefined) {
+        return false;
+      }
+    }
+
+    return true;
   }; // Custom components for Elvia dropdown
 
+
   const ElviaDropdownIndicator = props => {
@@ -251,3 +266,9 @@ return /*#__PURE__*/React.createElement(components.DropdownIndicator, props, /*#__PURE__*/React.createElement(Icon, {
     if (!isMulti) {
-      return /*#__PURE__*/React.createElement(components.Option, props, props.children);
+      return /*#__PURE__*/React.createElement(components.Option, props, allOptionsHaveIconAttribute() ? /*#__PURE__*/React.createElement(Icon, {
+        inlineStyle: {
+          marginRight: '16px'
+        },
+        name: props.data.icon,
+        size: isCompact ? 'xs' : 'sm'
+      }) : '', props.children);
     }
@@ -302,2 +323,12 @@
   };
+
+  const ElviaSingleValue = props => {
+    return /*#__PURE__*/React.createElement(components.SingleValue, props, allOptionsHaveIconAttribute() ? /*#__PURE__*/React.createElement(Icon, {
+      inlineStyle: {
+        marginRight: '16px'
+      },
+      name: props.data.icon,
+      size: isCompact ? 'xs' : 'sm'
+    }) : '', props.children);
+  };
   /** Object containing all components overriden in react-select by Elvis dropdown */
@@ -313,3 +344,4 @@
     MultiValueRemove: () => null,
-    Placeholder: ElviaPlaceholder
+    Placeholder: ElviaPlaceholder,
+    SingleValue: ElviaSingleValue
   }; // handle focus on dropdown, running on first render only (on mount)
@@ -316,0 +348,0 @@

package.json

 {
   "name": "@elvia/elvis-dropdown",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "description": "",
@@ -5,0 +5,0 @@ "main": "web_component.js",

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

65198

decreased by-91.15%

Number of package files

14

decreased by-12.5%

Lines of code

1957

decreased by-19%

No dependency changes