@wavemaker/app-rn-runtime 12.0.0-next.46502 → 12.0.0-next.47810

package/components/basic/progress-circle/progress-circle.component.js

@@ -0,0 +1,79 @@
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import React from 'react';
+import { View, Text } from 'react-native';
+import { isNumber } from 'lodash';
+import { AnimatedCircularProgress } from 'react-native-circular-progress';
+import { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';
+import { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';
+import { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';
+import WmProgressCircleProps from './progress-circle.props';
+import { DEFAULT_CLASS } from './progress-circle.styles';
+export class WmProgressCircleState extends BaseComponentState {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "radius", 10);
+  }
+}
+export default class WmProgressCircle extends BaseComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmProgressCircleProps(), new WmProgressCircleState());
+  }
+  onLayout(e) {
+    const width = e.nativeEvent.layout.width;
+    const height = e.nativeEvent.layout.height;
+    let radius = this.state.radius;
+    if (!width) {
+      radius = height;
+    } else if (!height) {
+      radius = width;
+    } else {
+      radius = Math.min(width, height);
+    }
+    this.handleLayout(e);
+    this.updateState({
+      radius: radius
+    });
+  }
+  renderWidget(props) {
+    let value = 0;
+    if (isNumber(props.datavalue) && isNumber(props.minvalue) && isNumber(props.maxvalue)) {
+      value = (+props.datavalue - +props.minvalue) / (+props.maxvalue - +props.minvalue) * 100;
+    }
+    const styles = this.theme.mergeStyle(this.theme.getStyle(`app-${props.type}-progress-circle`), this.styles);
+    const showText = props.captionplacement !== 'hidden';
+    return /*#__PURE__*/React.createElement(View, _extends({
+      style: styles.root,
+      onLayout: this.onLayout.bind(this)
+    }, getAccessibilityProps(AccessibilityWidgetType.PROGRESSCIRCLE, props), this.getTestPropsForAction('progresscircle')), this._background, /*#__PURE__*/React.createElement(Tappable, {
+      target: this,
+      styles: {
+        root: {
+          width: '100%',
+          height: '100%'
+        }
+      },
+      disableTouchEffect: this.state.props.disabletoucheffect
+    }, /*#__PURE__*/React.createElement(AnimatedCircularProgress, {
+      fill: value,
+      width: styles.progressValue.height,
+      backgroundWidth: styles.progressValue.height,
+      rotation: 0,
+      tintColor: styles.progressValue.backgroundColor,
+      lineCap: styles.progressValue.buttStyle || "butt",
+      backgroundColor: styles.progressCircle.backgroundColor,
+      size: this.state.radius
+    }, fill => /*#__PURE__*/React.createElement(View, {
+      style: {
+        alignItems: 'center'
+      }
+    }, /*#__PURE__*/React.createElement(Text, _extends({
+      style: styles.text
+    }, this.getTestPropsForLabel('title')), showText ? props.title || value : ''), showText && props.subtitle ? /*#__PURE__*/React.createElement(Text, _extends({
+      style: styles.subTitle
+    }, this.getTestPropsForLabel('subtitle')), props.subtitle) : null))));
+  }
+}
+//# sourceMappingURL=progress-circle.component.js.map

package/components/basic/progress-circle/progress-circle.component.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Text","isNumber","AnimatedCircularProgress","Tappable","BaseComponent","BaseComponentState","AccessibilityWidgetType","getAccessibilityProps","WmProgressCircleProps","DEFAULT_CLASS","WmProgressCircleState","constructor","args","_defineProperty","WmProgressCircle","props","onLayout","e","width","nativeEvent","layout","height","radius","state","Math","min","handleLayout","updateState","renderWidget","value","datavalue","minvalue","maxvalue","styles","theme","mergeStyle","getStyle","type","showText","captionplacement","createElement","_extends","style","root","bind","PROGRESSCIRCLE","getTestPropsForAction","_background","target","disableTouchEffect","disabletoucheffect","fill","progressValue","backgroundWidth","rotation","tintColor","backgroundColor","lineCap","buttStyle","progressCircle","size","alignItems","text","getTestPropsForLabel","title","subtitle","subTitle"],"sources":["progress-circle.component.tsx"],"sourcesContent":["import React from 'react';\nimport { LayoutChangeEvent, View, Text } from 'react-native';\nimport { isNumber } from 'lodash';\nimport { AnimatedCircularProgress } from 'react-native-circular-progress';\nimport { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';\n\nimport WmProgressCircleProps from './progress-circle.props';\nimport { DEFAULT_CLASS, WmProgressCircleStyles } from './progress-circle.styles';\n\n\nexport class WmProgressCircleState extends BaseComponentState<WmProgressCircleProps> {\n  radius = 10;\n}\n\nexport default class WmProgressCircle extends BaseComponent<WmProgressCircleProps, WmProgressCircleState, WmProgressCircleStyles> {\n\n  constructor(props: WmProgressCircleProps) {\n    super(props, DEFAULT_CLASS, new WmProgressCircleProps(), new WmProgressCircleState());\n  }\n\n  onLayout(e: LayoutChangeEvent) {\n    const width = e.nativeEvent.layout.width;\n    const height = e.nativeEvent.layout.height;\n    let radius = this.state.radius;\n    if (!width) {\n      radius = height;\n    } else if (!height) {\n      radius = width;\n    } else {\n      radius = Math.min(width, height);\n    }\n    \n    this.handleLayout(e)\n\n    this.updateState({\n      radius: radius\n    } as WmProgressCircleState);\n  }\n\n  renderWidget(props: WmProgressCircleProps) {\n    let value = 0;\n    if (isNumber(props.datavalue) && isNumber(props.minvalue) && isNumber(props.maxvalue)) {\n      value = (+props.datavalue - (+props.minvalue)) / (+props.maxvalue - (+props.minvalue)) * 100;\n    }\n    const styles = this.theme.mergeStyle(this.theme.getStyle(`app-${props.type}-progress-circle`), this.styles);\n    const showText = props.captionplacement !== 'hidden';\n    return (\n    <View style={styles.root} onLayout={this.onLayout.bind(this)} {...getAccessibilityProps(AccessibilityWidgetType.PROGRESSCIRCLE, props)} {...this.getTestPropsForAction('progresscircle')}>\n      {this._background}\n      <Tappable target={this} styles={{root:{width: '100%', height: '100%'}}} disableTouchEffect={this.state.props.disabletoucheffect}>\n        <AnimatedCircularProgress\n          fill={value}\n          width={styles.progressValue.height}\n          backgroundWidth={styles.progressValue.height}\n          rotation={0}\n          tintColor={styles.progressValue.backgroundColor}\n          lineCap={styles.progressValue.buttStyle || \"butt\"}\n          backgroundColor={styles.progressCircle.backgroundColor}\n          size={this.state.radius}>\n            {(fill) => (<View style={{alignItems: 'center'}}>\n                          <Text style={styles.text} {...this.getTestPropsForLabel('title')}>{ showText ? props.title || value : '' }</Text>\n                          {showText && props.subtitle ? (<Text style={styles.subTitle} {...this.getTestPropsForLabel('subtitle')}>{ props.subtitle }</Text>) : null}\n                        </View>)}  \n        </AnimatedCircularProgress>\n      </Tappable>\n    </View>); \n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/components/basic/progress-circle/progress-circle.props.js

@@ -0,0 +1,19 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';
+export default class WmProgressCircleProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "type", 'default');
+    _defineProperty(this, "datavalue", 30);
+    _defineProperty(this, "minvalue", 0);
+    _defineProperty(this, "maxvalue", 100);
+    _defineProperty(this, "captionplacement", 'inside');
+    _defineProperty(this, "title", '');
+    _defineProperty(this, "subtitle", '');
+    _defineProperty(this, "accessibilitylabel", undefined);
+    _defineProperty(this, "accessibilityrole", 'progressbar');
+  }
+}
+//# sourceMappingURL=progress-circle.props.js.map

package/components/basic/search/local-data-provider.js

@@ -0,0 +1,113 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { filter, includes, values, isNumber, split, toLower, get, toString, isArray, isObject, isString } from 'lodash';
+export class DataProvider {
+  constructor() {
+    _defineProperty(this, "localDataProvider", new LocalDataProvider());
+  }
+  // check if the variable is of type service variable and whether update is required.
+  init(self) {
+    let response = self.invokeEventCallback('isUpdateRequired', []);
+    return response;
+  }
+
+  // setting the inputFields and invoking the variable
+  invokeVariable(self, query) {
+    var _self$props;
+    let paramsObj = null;
+    ((_self$props = self.props) === null || _self$props === void 0 ? void 0 : _self$props.searchkey) && self.props.searchkey.split(',').forEach(k => {
+      if (!paramsObj) {
+        paramsObj = {};
+      }
+      paramsObj[k] = query;
+    });
+    let invokeEvent = get(self.props, 'formfield') ? self.props.invokeEvent : self.invokeEventCallback;
+    if (invokeEvent) {
+      return invokeEvent.call(self, 'onQuerySearch', [paramsObj]);
+    }
+    return Promise.resolve();
+  }
+  filter(config, cb) {
+    const props = config.props;
+    if (props.searchkey) {
+      const keys = split(props.searchkey, ',');
+      if (keys.length && cb) {
+        cb();
+        return;
+      }
+    }
+    return this.localDataProvider.filter(config);
+  }
+}
+export class LocalDataProvider {
+  applyFilter(entry, queryText) {
+    entry = isNumber(entry) ? entry.toString() : entry;
+    return includes(entry, queryText);
+  }
+  filter(config) {
+    const entries = config.entries;
+    let queryText = config.query;
+    const props = config.props;
+    let filteredData;
+    const casesensitive = false;
+
+    /**
+     * If searchkey is defined, then check for match string against each item in the dataset with item's field name as the searchkey
+     * return the filtered data containing the matching string.
+     */
+    if (props.searchkey) {
+      const keys = split(props.searchkey, ',');
+      if (!entries.length) {
+        return [];
+      }
+      let entryObj = entries[0];
+      entryObj = entryObj.hasOwnProperty('dataObject') ? entryObj['dataObject'] : entryObj;
+      const entryKeys = Object.keys(entryObj);
+      const hasEntry = keys.find(k => {
+        if (k.includes('.')) {
+          k = split(k, '.')[0];
+        }
+        return entryKeys.includes(k);
+      });
+      if (!hasEntry) {
+        // widget bound to query variable, searchkey is query or path params and not the key from the entry obj
+        return entries;
+      }
+      filteredData = filter(entries, item => {
+        return keys.some(key => {
+          let a = get(item.dataObject, key),
+            b = queryText;
+          if (!casesensitive) {
+            a = toLower(toString(a));
+            b = toLower(toString(b));
+          }
+          return this.applyFilter(a, b);
+        });
+      });
+    } else {
+      // local search on data with array of objects.
+      // Iterate over each item and return the filtered data containing the matching string.
+      if (isArray(entries) && isObject(entries[0])) {
+        filteredData = filter(entries, entry => {
+          let a = isString(entry.dataObject) ? entry.dataObject : values(entry.dataObject).join(' ');
+          if (!casesensitive) {
+            a = toLower(a);
+            queryText = toLower(queryText);
+          }
+          return this.applyFilter(a, queryText);
+        });
+      } else {
+        filteredData = filter(entries, entry => {
+          if (!casesensitive) {
+            entry = toLower(entry);
+            queryText = toLower(queryText);
+          }
+          return this.applyFilter(entry, queryText);
+        });
+      }
+    }
+    return filteredData;
+  }
+}
+//# sourceMappingURL=local-data-provider.js.map

package/components/basic/search/search.component.js

@@ -0,0 +1,455 @@
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import React from 'react';
+import { Keyboard, Platform, Text, TextInput, View } from 'react-native';
+import { ScrollView } from 'react-native-gesture-handler';
+import { find, isNull } from 'lodash';
+import WmSearchProps from './search.props';
+import { DEFAULT_CLASS } from './search.styles';
+import { ModalConsumer } from "@wavemaker/app-rn-runtime/core/modal.service";
+import { DataProvider } from '@wavemaker/app-rn-runtime/components/basic/search/local-data-provider';
+import { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';
+import { BaseDatasetComponent, BaseDatasetState } from '@wavemaker/app-rn-runtime/components/input/basedataset/basedataset.component';
+import WmAnchor from '@wavemaker/app-rn-runtime/components/basic/anchor/anchor.component';
+import WmPicture from '@wavemaker/app-rn-runtime/components/basic/picture/picture.component';
+import { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';
+import WmButton from '@wavemaker/app-rn-runtime/components/basic/button/button.component';
+import { get, isArray, isEmpty, isObject } from "lodash-es";
+import { AssetProvider } from '@wavemaker/app-rn-runtime/core/asset.provider';
+import { createSkeleton } from '../skeleton/skeleton.component';
+export class WmSearchState extends BaseDatasetState {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "isOpened", false);
+    _defineProperty(this, "modalOptions", {});
+    _defineProperty(this, "template", "");
+    _defineProperty(this, "position", {
+      top: 0,
+      left: 0
+    });
+    _defineProperty(this, "data", []);
+  }
+}
+export default class WmSearch extends BaseDatasetComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmSearchProps(), new WmSearchState());
+    _defineProperty(this, "view", null);
+    _defineProperty(this, "prevDatavalue", void 0);
+    _defineProperty(this, "queryModel", void 0);
+    _defineProperty(this, "searchInputWidth", void 0);
+    _defineProperty(this, "isDefaultQuery", true);
+    _defineProperty(this, "dataProvider", void 0);
+    _defineProperty(this, "widgetRef", null);
+    _defineProperty(this, "cursor", 0);
+    _defineProperty(this, "isFocused", false);
+    _defineProperty(this, "updateRequired", void 0);
+    _defineProperty(this, "timer", null);
+    _defineProperty(this, "computePosition", () => {
+      return new Promise(resolve => {
+        const position = {};
+        this.view.measure((x = 0, y = 0, width = 0, height = 0, px = 0, py = 0) => {
+          position.left = px;
+          Platform.OS === 'ios' ? position.top = py : position.top = py + height;
+          this.updateState({
+            position: position
+          }, resolve);
+        });
+      });
+    });
+    _defineProperty(this, "handleChange", value => {
+      this.isDefaultQuery = false;
+      const prevQuery = this.state.props.query;
+      if (this.state.props.searchon === 'onsearchiconclick') {
+        this.updateState({
+          props: {
+            result: [],
+            query: value
+          },
+          data: []
+        });
+      } else {
+        this.updateFilteredData(value);
+      }
+      if (value === '') {
+        this.validate(value);
+        this.updateState({
+          props: {
+            datavalue: ''
+          }
+        });
+        if (value === prevQuery) {
+          return;
+        }
+      }
+      setTimeout(() => {
+        if (this.props.invokeEvent) {
+          this.props.invokeEvent('onChange', [undefined, this.proxy, value, prevQuery]);
+        }
+        this.invokeEventCallback('onChange', [undefined, this.proxy, value, prevQuery]);
+      }, 300);
+    });
+    _defineProperty(this, "showPopover", () => {
+      this.computePosition().then(() => {
+        this.updateState({
+          isOpened: true
+        });
+      });
+    });
+    _defineProperty(this, "hide", () => {});
+    this.dataProvider = new DataProvider();
+    if (this.props.datavalue) {
+      this.updateState({
+        props: {
+          query: this.props.datavalue
+        }
+      });
+    }
+  }
+  clearSearch() {
+    this.invokeEventCallback('onClear', [null, this]);
+    this.hide();
+    this.updateState({
+      props: {
+        query: ''
+      },
+      dataItems: this.state.dataItems ? this.state.dataItems.map(item => {
+        item.selected = false;
+        return item;
+      }) : []
+    }, () => {
+      if (this.state.props.type === 'autocomplete') {
+        this.updateFilteredData('');
+      }
+    });
+  }
+  updateFilteredData(queryText = '') {
+    var _filteredData;
+    const props = this.state.props;
+    const filterOptions = {
+      query: queryText,
+      props: props,
+      entries: this.state.dataItems
+    };
+    let filteredData = [];
+    if (props.minchars && queryText.length < props.minchars) {
+      filteredData = [];
+    } else if (props.type === 'search' && !queryText) {
+      filteredData = [];
+    } else {
+      var _this$dataProvider;
+      if (this.props.searchkey && this.updateRequired === undefined) {
+        this.updateRequired = this.dataProvider.init(this);
+      }
+      // for service variables invoke the variable with params.
+      if (this.props.searchkey && this.updateRequired && this.state.props.query !== queryText) {
+        this.dataProvider.invokeVariable(this, queryText).then(response => {
+          if (response) {
+            response = response.dataSet;
+            if (isEmpty(response)) {
+              filteredData = [];
+            } else {
+              if (isObject(response) && !isArray(response)) {
+                response = [response];
+              }
+              this.setDataItems(response);
+            }
+          }
+        }, () => {});
+        return;
+      }
+      filteredData = (_this$dataProvider = this.dataProvider) === null || _this$dataProvider === void 0 ? void 0 : _this$dataProvider.filter(filterOptions);
+    }
+    this.updateState({
+      props: {
+        result: (_filteredData = filteredData) === null || _filteredData === void 0 ? void 0 : _filteredData.map(item => item.dataObject),
+        query: queryText
+      },
+      data: filteredData
+    });
+    if (!this.state.isOpened && this.isFocused && filteredData.length > 0) {
+      if (this.styles.modal.display !== "none") {
+        this.showPopover && this.showPopover();
+      }
+    }
+  }
+  focus() {
+    var _this$widgetRef;
+    this === null || this === void 0 || (_this$widgetRef = this.widgetRef) === null || _this$widgetRef === void 0 || _this$widgetRef.focus();
+  }
+  onChange(value) {
+    if (this.state.props.debouncetime && this.state.props.debouncetime > 0) {
+      if (this.timer !== null) {
+        clearTimeout(this.timer);
+        this.timer = null;
+      }
+      this.timer = setTimeout(() => {
+        this.handleChange(value);
+      }, this.state.props.debouncetime);
+    } else {
+      this.handleChange(value);
+    }
+  }
+  invokeChange(e) {
+    if (Platform.OS === 'web') {
+      this.cursor = e.target.selectionStart;
+      this.updateState({
+        props: {
+          query: e.target.value
+        }
+      });
+    }
+  }
+  onFocus() {
+    this.isFocused = true;
+    if (!(this.state.props.disabled || this.state.props.readonly) && this.state.props.type === 'autocomplete') {
+      var _this$state$props$que;
+      this.cursor = ((_this$state$props$que = this.state.props.query) === null || _this$state$props$que === void 0 ? void 0 : _this$state$props$que.length) || 0;
+      this.updateFilteredData(this.state.props.query || '');
+    }
+    this.invokeEventCallback('onFocus', [null, this]);
+  }
+  onBlur() {
+    this.isFocused = false;
+    this.validate(this.state.props.datavalue);
+    if (!this.state.props.datavalue) {
+      setTimeout(() => {
+        this.props.triggerValidation && this.props.triggerValidation();
+      });
+    }
+    this.invokeEventCallback('onBlur', [null, this]);
+  }
+  prepareModalOptions(content, styles, modalService) {
+    const o = this.state.modalOptions;
+    const modalContentSTyles = {
+      width: this.searchInputWidth - 2 * (styles.modalContent.borderWidth || 0),
+      left: (this.state.position.left || 0) + 2 * (styles.modalContent.borderWidth || 0)
+    };
+    o.modalStyle = {
+      ...styles.modal
+    };
+    o.contentStyle = {
+      ...styles.modalContent,
+      ...this.state.position,
+      ...modalContentSTyles
+    };
+    o.content = content;
+    o.isModal = true;
+    o.onClose = () => {
+      this.hide = () => {};
+      Keyboard.dismiss();
+      if (this.state.isOpened) {
+        this.setState({
+          isOpened: false,
+          modalOptions: {}
+        });
+      }
+    };
+    this.hide = () => {
+      modalService.hideModal(this.state.modalOptions);
+      if (this.state.isOpened) {
+        this.setState({
+          isOpened: false,
+          modalOptions: {}
+        });
+      }
+    };
+    return o;
+  }
+  searchIconPress() {
+    this.isFocused = false;
+    if (this.state.props.searchon === 'onsearchiconclick') {
+      this.updateFilteredData(this.state.props.query);
+    } else {
+      this.onItemSelect(this.state.data[0]);
+    }
+    if (get(this.props, 'formfield')) {
+      // @ts-ignore
+      // @ts-ignore
+      this.props.invokeEvent('onSubmit', [null, this]);
+    } else {
+      this.invokeEventCallback('onSubmit', [null, this]);
+    }
+  }
+  onItemSelect(item) {
+    this.isFocused = false;
+    this.updateState({
+      props: {
+        query: item.displayexp || item.displayfield
+      }
+    });
+    this.validate(item.datafield);
+    this.updateDatavalue(item.datafield);
+    this.prevDatavalue = item.datafield;
+    this.queryModel = item;
+    if (get(this.props, 'formfield')) {
+      // @ts-ignore
+      this.props.invokeEvent('onSelect', [null, this, item.datafield]);
+      // @ts-ignore
+      this.props.invokeEvent('onSubmit', [null, this]);
+    } else {
+      this.invokeEventCallback('onSelect', [null, this, item.datafield]);
+      this.invokeEventCallback('onSubmit', [null, this]);
+    }
+    this.hide();
+  }
+  renderSkeleton(props) {
+    const rootStyle = {
+      ...this.styles.searchInputWrapper,
+      ...this.styles.root,
+      ...this.styles.text
+    };
+    return createSkeleton(this.theme, this.styles.skeleton, rootStyle);
+  }
+  renderSearchBar() {
+    var _this$state$dataItems;
+    const props = this.state.props;
+    let opts = {};
+    const valueExpr = Platform.OS === 'web' ? 'value' : 'defaultValue';
+    opts[valueExpr] = this.state.props.query || '';
+    return (
+      /*#__PURE__*/
+      /*
+       * onLayout function is required.
+       * https://github.com/naoufal/react-native-accordion/pull/19/files
+       */
+      React.createElement(View, {
+        style: this.styles.root,
+        ref: ref => {
+          this.view = ref;
+        },
+        onLayout: () => {}
+      }, /*#__PURE__*/React.createElement(View, {
+        style: this.styles.searchInputWrapper
+      }, /*#__PURE__*/React.createElement(TextInput, _extends({
+        style: [this.styles.text, this.state.isValid ? {} : this.styles.invalid, this.state.isOpened && ((_this$state$dataItems = this.state.dataItems) === null || _this$state$dataItems === void 0 ? void 0 : _this$state$dataItems.length) > 0 ? this.styles.focusedText : null],
+        ref: ref => {
+          this.widgetRef = ref;
+          // @ts-ignore
+          if (ref && !isNull(ref.selectionStart) && !isNull(ref.selectionEnd)) {
+            // @ts-ignore
+            ref.selectionStart = ref.selectionEnd = this.cursor;
+          }
+        }
+      }, this.getTestPropsForInput(), getAccessibilityProps(AccessibilityWidgetType.SEARCH, props), {
+        placeholderTextColor: this.styles.placeholderText.color,
+        placeholder: props.placeholder || 'Search',
+        autoFocus: props.autofocus,
+        editable: props.disabled || props.readonly ? false : true,
+        onChangeText: this.onChange.bind(this),
+        onChange: this.invokeChange.bind(this),
+        onFocus: this.onFocus.bind(this),
+        onLayout: e => {
+          this.searchInputWidth = e.nativeEvent.layout.width;
+        },
+        onBlur: this.onBlur.bind(this)
+      }, opts)), props.showclear && !(this.state.props.disabled || this.state.props.readonly) && this.state.props.query ? /*#__PURE__*/React.createElement(WmButton, {
+        onTap: this.clearSearch.bind(this),
+        id: this.getTestId('clear'),
+        styles: this.styles.clearButton,
+        iconclass: props.clearsearchiconclass || 'wi wi-clear'
+      }) : null), props.showSearchIcon && props.type === 'search' ? /*#__PURE__*/React.createElement(WmButton, {
+        styles: this.styles.searchButton,
+        id: this.getTestId('search'),
+        iconclass: props.searchiconclass || props.iconclass,
+        onTap: this.searchIconPress.bind(this)
+      }) : null)
+    );
+  }
+  reset() {
+    if (this.state.props.query) {
+      this.updateState({
+        props: {
+          query: ''
+        }
+      });
+    }
+  }
+  renderSearchItem(item, index) {
+    const props = this.state.props;
+    const imageStyles = {
+      root: {
+        height: props.imagewidth,
+        width: props.imagewidth
+      }
+    };
+    return /*#__PURE__*/React.createElement(Tappable, _extends({
+      onTap: this.onItemSelect.bind(this, item)
+    }, this.getTestProps(`action${index}`), {
+      disableTouchEffect: this.state.props.disabletoucheffect
+    }), /*#__PURE__*/React.createElement(View, {
+      style: this.styles.searchItem
+    }, !isEmpty(this.state.template) && this.props.renderitempartial ? this.props.renderitempartial(item.dataObject, index, this.state.template) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(WmPicture, {
+      id: this.getTestId(`picture${index}`),
+      styles: imageStyles,
+      name: props.name + '_image',
+      picturesource: item.imgSrc
+    }), /*#__PURE__*/React.createElement(Text, _extends({}, this.getTestPropsForLabel(index + ''), {
+      style: this.styles.searchItemText
+    }), item.displayexp || item.displayfield))));
+  }
+  updateDefaultQueryModel() {
+    if (this.state.dataItems && this.state.dataItems.length && this.isDefaultQuery) {
+      const selectedItem = find(this.state.dataItems, item => item.selected);
+      this.updateState({
+        props: {
+          query: selectedItem ? selectedItem.displayexp || selectedItem.displayfield : ''
+        }
+      });
+    }
+  }
+  onDataItemsUpdate() {
+    super.onDataItemsUpdate();
+    this.isFocused && this.state.dataItems.length && this.updateFilteredData(this.state.props.query);
+    this.updateDefaultQueryModel();
+  }
+  componentDidMount() {
+    super.componentDidMount();
+    this.updateDefaultQueryModel();
+  }
+  onPropertyChange(name, $new, $old) {
+    switch (name) {
+      case 'dataset':
+        if (!isEmpty($new) && isObject($new) && !isArray($new)) {
+          $new = [$new];
+          this.updateState({
+            props: {
+              dataset: $new
+            }
+          });
+        }
+        break;
+    }
+    super.onPropertyChange(name, $new, $old);
+  }
+  setTemplate(partialName) {
+    this.updateState({
+      template: partialName
+    });
+  }
+  renderWidget(props) {
+    const result = this.state.data;
+    return /*#__PURE__*/React.createElement(View, {
+      onLayout: event => this.handleLayout(event),
+      style: [this.styles.rootWrapper]
+    }, this.renderSearchBar(), this.state.isOpened ? /*#__PURE__*/React.createElement(ModalConsumer, null, modalService => {
+      modalService.showModal(this.prepareModalOptions(/*#__PURE__*/React.createElement(ScrollView, {
+        style: {
+          width: '100%',
+          maxHeight: 200
+        },
+        contentContainerStyle: this.styles.dropDownContent
+      }, /*#__PURE__*/React.createElement(AssetProvider, {
+        value: this.loadAsset
+      }, result && result.map((item, index) => /*#__PURE__*/React.createElement(View, {
+        key: item.key
+      }, !props.limit || props.limit && index + 1 <= props.limit ? this.renderSearchItem(item, index) : null, index === result.length - 1 ? /*#__PURE__*/React.createElement(WmAnchor, {
+        caption: props.datacompletemsg,
+        styles: this.styles.dataCompleteItem
+      }) : null)))), this.styles, modalService));
+      return null;
+    }) : null);
+  }
+}
+//# sourceMappingURL=search.component.js.map