haya-select 1.0.42 → 1.0.44

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "haya-select",
-  "version": "1.0.42",
+  "version": "1.0.44",
   "description": "",
   "main": "index.js",
   "scripts": {

package/src/select/index.jsx

@@ -39,6 +39,7 @@ export default memo(shapeComponent(class HayaSelect extends ShapeComponent {
     multiple: PropTypes.bool.isRequired,
     name: PropTypes.string,
     onChange: PropTypes.func,
+    onChangeValue: PropTypes.func,
     onOptionsClosed: PropTypes.func,
     options: PropTypes.oneOfType([PropTypes.array, PropTypes.func]).isRequired,
     placeholder: PropTypes.node,
@@ -127,7 +128,21 @@ export default memo(shapeComponent(class HayaSelect extends ShapeComponent {
     if ("values" in this.props && typeof this.props.values != "undefined") {
       if (this.s.loadedOptions || typeof this.props.options == "function" && this.props.values) {
         if (this.s.loadedOptions) {
-          return this.p.values.map((value) => this.s.loadedOptions.find((option) => option.value == value))
+          const result = this.p.values.map((value) => {
+            let foundOption = this.s.loadedOptions.find((option) => option.value == value)
+
+            if (!foundOption) {
+              foundOption = this.s.currentOptions.find((option) => option.value == value)
+
+              if (!foundOption) {
+                throw new Error(`Couldn't find option: ${value} in loadedOptions or state currentOptions`)
+              }
+            }
+
+            return foundOption
+          })
+
+          return result
         } else {
           this.setCurrentFromGivenValues()
         }
@@ -141,6 +156,14 @@ export default memo(shapeComponent(class HayaSelect extends ShapeComponent {
     return this.s.currentOptions
   }
 
+  getCurrentOptionValues() {
+    if ("values" in this.props) {
+      return this.p.values
+    }
+
+    return this.getCurrentOptions().map((option) => option.value)
+  }
+
   componentDidMount() {
     const {attribute, defaultValue, defaultValues, defaultValuesFromOptions, model, options} = this.props
 
@@ -382,7 +405,7 @@ export default memo(shapeComponent(class HayaSelect extends ShapeComponent {
 
     return (
       <Option
-        currentOptions={this.getCurrentOptions()}
+        currentOptionValues={this.getCurrentOptionValues()}
         icon={this.iconForOption(loadedOption)}
         key={key}
         option={loadedOption}
@@ -624,14 +647,28 @@ export default memo(shapeComponent(class HayaSelect extends ShapeComponent {
       }
     }
 
+    const options = newState.currentOptions || currentOptions
+
     if (onChange) {
       onChange({
         event,
-        options: newState.currentOptions || currentOptions,
+        options,
         toggles: newToggled
       })
     }
 
+    if (this.props.onChangeValue) {
+      let optionValue
+
+      if (multiple) {
+        optionValue = options.map((option) => option.value)
+      } else {
+        optionValue = dig(options, 0, "value")
+      }
+
+      this.p.onChangeValue(optionValue)
+    }
+
     if (!multiple) this.closeOptions()
     this.setState(newState)
   }

package/src/select/option.jsx

@@ -5,7 +5,7 @@ import {View} from "react-native"
 
 export default memo(shapeComponent(class Option extends ShapeComponent {
   static propTypes = {
-    currentOptions: PropTypes.array.isRequired,
+    currentOptionValues: PropTypes.array.isRequired,
     disabled: PropTypes.bool,
     icon: PropTypes.string,
     onOptionClicked: PropTypes.func.isRequired,
@@ -20,8 +20,9 @@ export default memo(shapeComponent(class Option extends ShapeComponent {
   }
 
   render() {
-    const disabled = Boolean(this.props.option.disabled)
-    const selected = Boolean(this.props.currentOptions.find((currentOption) => currentOption.value == this.props.option.value))
+    const {currentOptionValues, option} = this.p
+    const disabled = Boolean(option.disabled)
+    const selected = Boolean(currentOptionValues.find((currentOptionValue) => currentOptionValue == option.value))
     const style = {
       paddingTop: 4,
       paddingRight: 8,
@@ -53,12 +54,12 @@ export default memo(shapeComponent(class Option extends ShapeComponent {
           selected,
           value: this.props.option.value
         }}
-        onClick={this.onClick}
-        onPointerOver={this.onPointerOver}
-        onPointerOut={this.onPointerOut}
+        onClick={this.tt.onClick}
+        onPointerOver={this.tt.onPointerOver}
+        onPointerOut={this.tt.onPointerOut}
         style={style}
       >
-        {this.props.presentOption(this.props.option)}
+        {this.props.presentOption(option)}
       </View>
     )
   }