haya-select 1.0.18 → 1.0.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "haya-select",
-  "version": "1.0.18",
+  "version": "1.0.20",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -12,7 +12,8 @@
     "classnames": "^2.3.1",
     "debounce": "^1.2.1",
     "diggerize": "^1.0.4",
-    "fetching-object": "^1.0.1"
+    "fetching-object": "^1.0.1",
+    "set-state-compare": "^1.0.19"
   },
   "peerDependencies": {
     "prop-types": ">= 15.7.2",

package/src/select/index.jsx

@@ -10,6 +10,7 @@ import Option from "./option"
 import OptionGroup from "./option-group"
 import PropTypes from "prop-types"
 import React from "react"
+import {anythingDifferent} from "set-state-compare"
 
 const nameForComponentWithMultiple = (component) => {
   let name = nameForComponent(component)
@@ -21,7 +22,6 @@ const nameForComponentWithMultiple = (component) => {
 
 export default class HayaSelect extends React.PureComponent {
   static defaultProps = {
-    defaultToggled: {},
     multiple: false,
     search: false
   }
@@ -41,11 +41,13 @@ export default class HayaSelect extends React.PureComponent {
     options: PropTypes.oneOfType([PropTypes.array, PropTypes.func]).isRequired,
     placeholder: PropTypes.node,
     search: PropTypes.bool.isRequired,
+    toggled: PropTypes.object,
     toggleOptions: PropTypes.arrayOf(PropTypes.shape({
       icon: PropTypes.string.isRequired,
       label: PropTypes.string.isRequired,
       value: PropTypes.string.isRequired
-    }))
+    })),
+    values: PropTypes.array
   }
 
   p = fetchingObject(() => this.props)
@@ -65,18 +67,19 @@ export default class HayaSelect extends React.PureComponent {
     optionsWidth: undefined,
     scrollLeft: undefined,
     scrollTop: undefined,
-    toggled: digg(this, "props", "defaultToggled")
+    toggled: this.defaultToggled()
   }
 
   defaultCurrentOptions() {
-    const {defaultValue, defaultValues} = this.props
+    const {defaultValue, defaultValues, values} = this.props
     const {options} = this.p
 
     if (!Array.isArray(options)) return []
 
     return options.filter(({value}) =>
       (defaultValue && value == defaultValue) ||
-        (defaultValues && defaultValues.includes(value))
+        (defaultValues && defaultValues.includes(value)) ||
+        (values && values.includes(value))
     )
   }
 
@@ -92,6 +95,10 @@ export default class HayaSelect extends React.PureComponent {
     throw new Error(`Unknown type of options: ${typeof options}`)
   }
 
+  defaultToggled() {
+    return this.props.defaultToggled || this.props.toggled || {}
+  }
+
   componentDidMount() {
     const {attribute, defaultValue, defaultValues, defaultValuesFromOptions, model, options} = this.props
 
@@ -100,6 +107,30 @@ export default class HayaSelect extends React.PureComponent {
     }
   }
 
+  componentDidUpdate() {
+    this.setState((prevState) => {
+      const stateUpdate = {}
+
+      if ("values" in this.props) {
+        const newCurrentOptions = this.defaultCurrentOptions()
+
+        if (anythingDifferent(prevState.currentOptions, newCurrentOptions)) {
+          stateUpdate.currentOptions = newCurrentOptions
+        }
+      }
+
+      if ("toggled" in this.props) {
+        const newToggled = digg(this, "props", "toggled")
+
+        if (anythingDifferent(prevState.toggled, newToggled)) {
+          stateUpdate.toggled = newToggled
+        }
+      }
+
+      return stateUpdate
+    })
+  }
+
   render() {
     const {endOfSelectRef} = this.t
     const {
@@ -269,7 +300,9 @@ export default class HayaSelect extends React.PureComponent {
       opened: false
     })
 
-    if (this.props.onOptionsClosed) this.props.onOptionsClosed()
+    if (this.props.onOptionsClosed) {
+      this.props.onOptionsClosed({options: this.state.currentOptions})
+    }
   }
 
   openOptions() {

package/src/select/style.scss

@@ -4,6 +4,7 @@
     flex-wrap: wrap;
     background-color: #fff;
     border: 1px solid #999;
+    color: #000;
     cursor: pointer;
     padding-top: 5px;
     padding-bottom: 5px;