Initial commit
This commit is contained in:
15
LICENSE
Normal file
15
LICENSE
Normal file
@@ -0,0 +1,15 @@
|
||||
The Apache License v2.0
|
||||
|
||||
Copyright 2020 Incentro Business Acceleration B.V.
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
25
README.md
Normal file
25
README.md
Normal file
@@ -0,0 +1,25 @@
|
||||
## Autosearch
|
||||
Mendix Native textbox with an onchange event for searching values when user input is detected
|
||||
|
||||
## Usage
|
||||
For development:
|
||||
- Create customwidgets folder in root of project directory
|
||||
- Git clone this repo into customwidgets folder
|
||||
- Open command prompt in cloned folder
|
||||
- npm i
|
||||
- npm run dev / npm run build
|
||||
|
||||
Widget can now be used inside Mendix.
|
||||
|
||||
For plain usage:
|
||||
|
||||
- Copy MPK file in releases to widgets directory.
|
||||
|
||||
## Demo project
|
||||
Not available yet.
|
||||
|
||||
## Issues, suggestions and feature requests
|
||||
https://github.com/IncentroBA/autosearch/issues
|
||||
|
||||
## Development and contribution
|
||||
N/A
|
||||
BIN
dist/1.0.0/incentro.Autosearch.mpk
vendored
Normal file
BIN
dist/1.0.0/incentro.Autosearch.mpk
vendored
Normal file
Binary file not shown.
31
dist/tmp/widgets/Autosearch.xml
vendored
Normal file
31
dist/tmp/widgets/Autosearch.xml
vendored
Normal file
@@ -0,0 +1,31 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<widget id="incentro.autosearch.Autosearch" pluginWidget="true" needsEntityContext="true" offlineCapable="true"
|
||||
supportedPlatform="Native"
|
||||
xmlns="http://www.mendix.com/widget/1.0/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
|
||||
xsi:schemaLocation="http://www.mendix.com/widget/1.0/ ../node_modules/mendix/custom_widget.xsd">
|
||||
<name>Autosearch</name>
|
||||
<description>Mendix Native textbox with an onchange event for searching values when user input is detected</description>
|
||||
<icon/>
|
||||
<properties>
|
||||
<propertyGroup caption="General">
|
||||
<propertyGroup caption="Data source">
|
||||
<property key="searchvalue" type="attribute">
|
||||
<caption>Search value</caption>
|
||||
<description>The attribute which will hold the search value.</description>
|
||||
<attributeTypes>
|
||||
<attributeType name="String"/>
|
||||
</attributeTypes>
|
||||
</property>
|
||||
</propertyGroup>
|
||||
<propertyGroup caption="Events">
|
||||
<property key="onChange" type="action" required="false">
|
||||
<caption>On change</caption>
|
||||
<description/>
|
||||
</property>
|
||||
</propertyGroup>
|
||||
<propertyGroup caption="Common">
|
||||
<systemProperty key="Name"/>
|
||||
</propertyGroup>
|
||||
</propertyGroup>
|
||||
</properties>
|
||||
</widget>
|
||||
302
dist/tmp/widgets/incentro/autosearch/Autosearch.js
vendored
Normal file
302
dist/tmp/widgets/incentro/autosearch/Autosearch.js
vendored
Normal file
@@ -0,0 +1,302 @@
|
||||
module.exports =
|
||||
/******/ (function(modules) { // webpackBootstrap
|
||||
/******/ // The module cache
|
||||
/******/ var installedModules = {};
|
||||
/******/
|
||||
/******/ // The require function
|
||||
/******/ function __webpack_require__(moduleId) {
|
||||
/******/
|
||||
/******/ // Check if module is in cache
|
||||
/******/ if(installedModules[moduleId]) {
|
||||
/******/ return installedModules[moduleId].exports;
|
||||
/******/ }
|
||||
/******/ // Create a new module (and put it into the cache)
|
||||
/******/ var module = installedModules[moduleId] = {
|
||||
/******/ i: moduleId,
|
||||
/******/ l: false,
|
||||
/******/ exports: {}
|
||||
/******/ };
|
||||
/******/
|
||||
/******/ // Execute the module function
|
||||
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
|
||||
/******/
|
||||
/******/ // Flag the module as loaded
|
||||
/******/ module.l = true;
|
||||
/******/
|
||||
/******/ // Return the exports of the module
|
||||
/******/ return module.exports;
|
||||
/******/ }
|
||||
/******/
|
||||
/******/
|
||||
/******/ // expose the modules object (__webpack_modules__)
|
||||
/******/ __webpack_require__.m = modules;
|
||||
/******/
|
||||
/******/ // expose the module cache
|
||||
/******/ __webpack_require__.c = installedModules;
|
||||
/******/
|
||||
/******/ // define getter function for harmony exports
|
||||
/******/ __webpack_require__.d = function(exports, name, getter) {
|
||||
/******/ if(!__webpack_require__.o(exports, name)) {
|
||||
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
|
||||
/******/ }
|
||||
/******/ };
|
||||
/******/
|
||||
/******/ // define __esModule on exports
|
||||
/******/ __webpack_require__.r = function(exports) {
|
||||
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
|
||||
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
||||
/******/ }
|
||||
/******/ Object.defineProperty(exports, '__esModule', { value: true });
|
||||
/******/ };
|
||||
/******/
|
||||
/******/ // create a fake namespace object
|
||||
/******/ // mode & 1: value is a module id, require it
|
||||
/******/ // mode & 2: merge all properties of value into the ns
|
||||
/******/ // mode & 4: return value when already ns object
|
||||
/******/ // mode & 8|1: behave like require
|
||||
/******/ __webpack_require__.t = function(value, mode) {
|
||||
/******/ if(mode & 1) value = __webpack_require__(value);
|
||||
/******/ if(mode & 8) return value;
|
||||
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
|
||||
/******/ var ns = Object.create(null);
|
||||
/******/ __webpack_require__.r(ns);
|
||||
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
|
||||
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
|
||||
/******/ return ns;
|
||||
/******/ };
|
||||
/******/
|
||||
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
||||
/******/ __webpack_require__.n = function(module) {
|
||||
/******/ var getter = module && module.__esModule ?
|
||||
/******/ function getDefault() { return module['default']; } :
|
||||
/******/ function getModuleExports() { return module; };
|
||||
/******/ __webpack_require__.d(getter, 'a', getter);
|
||||
/******/ return getter;
|
||||
/******/ };
|
||||
/******/
|
||||
/******/ // Object.prototype.hasOwnProperty.call
|
||||
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
|
||||
/******/
|
||||
/******/ // __webpack_public_path__
|
||||
/******/ __webpack_require__.p = "";
|
||||
/******/
|
||||
/******/
|
||||
/******/ // Load entry module and return exports
|
||||
/******/ return __webpack_require__(__webpack_require__.s = "./src/Autosearch.tsx");
|
||||
/******/ })
|
||||
/************************************************************************/
|
||||
/******/ ({
|
||||
|
||||
/***/ "./node_modules/@babel/runtime/helpers/arrayLikeToArray.js":
|
||||
/*!*****************************************************************!*\
|
||||
!*** ./node_modules/@babel/runtime/helpers/arrayLikeToArray.js ***!
|
||||
\*****************************************************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports) {
|
||||
|
||||
function _arrayLikeToArray(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++){arr2[i]=arr[i];}return arr2;}module.exports=_arrayLikeToArray;
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./node_modules/@babel/runtime/helpers/arrayWithoutHoles.js":
|
||||
/*!******************************************************************!*\
|
||||
!*** ./node_modules/@babel/runtime/helpers/arrayWithoutHoles.js ***!
|
||||
\******************************************************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports, __webpack_require__) {
|
||||
|
||||
var arrayLikeToArray=__webpack_require__(/*! ./arrayLikeToArray */ "./node_modules/@babel/runtime/helpers/arrayLikeToArray.js");function _arrayWithoutHoles(arr){if(Array.isArray(arr))return arrayLikeToArray(arr);}module.exports=_arrayWithoutHoles;
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./node_modules/@babel/runtime/helpers/defineProperty.js":
|
||||
/*!***************************************************************!*\
|
||||
!*** ./node_modules/@babel/runtime/helpers/defineProperty.js ***!
|
||||
\***************************************************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports) {
|
||||
|
||||
function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}module.exports=_defineProperty;
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./node_modules/@babel/runtime/helpers/extends.js":
|
||||
/*!********************************************************!*\
|
||||
!*** ./node_modules/@babel/runtime/helpers/extends.js ***!
|
||||
\********************************************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports) {
|
||||
|
||||
function _extends(){module.exports=_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}module.exports=_extends;
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js":
|
||||
/*!**********************************************************************!*\
|
||||
!*** ./node_modules/@babel/runtime/helpers/interopRequireDefault.js ***!
|
||||
\**********************************************************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports) {
|
||||
|
||||
function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{"default":obj};}module.exports=_interopRequireDefault;
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./node_modules/@babel/runtime/helpers/iterableToArray.js":
|
||||
/*!****************************************************************!*\
|
||||
!*** ./node_modules/@babel/runtime/helpers/iterableToArray.js ***!
|
||||
\****************************************************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports) {
|
||||
|
||||
function _iterableToArray(iter){if(typeof Symbol!=="undefined"&&Symbol.iterator in Object(iter))return Array.from(iter);}module.exports=_iterableToArray;
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./node_modules/@babel/runtime/helpers/nonIterableSpread.js":
|
||||
/*!******************************************************************!*\
|
||||
!*** ./node_modules/@babel/runtime/helpers/nonIterableSpread.js ***!
|
||||
\******************************************************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports) {
|
||||
|
||||
function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}module.exports=_nonIterableSpread;
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./node_modules/@babel/runtime/helpers/toConsumableArray.js":
|
||||
/*!******************************************************************!*\
|
||||
!*** ./node_modules/@babel/runtime/helpers/toConsumableArray.js ***!
|
||||
\******************************************************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports, __webpack_require__) {
|
||||
|
||||
var arrayWithoutHoles=__webpack_require__(/*! ./arrayWithoutHoles */ "./node_modules/@babel/runtime/helpers/arrayWithoutHoles.js");var iterableToArray=__webpack_require__(/*! ./iterableToArray */ "./node_modules/@babel/runtime/helpers/iterableToArray.js");var unsupportedIterableToArray=__webpack_require__(/*! ./unsupportedIterableToArray */ "./node_modules/@babel/runtime/helpers/unsupportedIterableToArray.js");var nonIterableSpread=__webpack_require__(/*! ./nonIterableSpread */ "./node_modules/@babel/runtime/helpers/nonIterableSpread.js");function _toConsumableArray(arr){return arrayWithoutHoles(arr)||iterableToArray(arr)||unsupportedIterableToArray(arr)||nonIterableSpread();}module.exports=_toConsumableArray;
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./node_modules/@babel/runtime/helpers/unsupportedIterableToArray.js":
|
||||
/*!***************************************************************************!*\
|
||||
!*** ./node_modules/@babel/runtime/helpers/unsupportedIterableToArray.js ***!
|
||||
\***************************************************************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports, __webpack_require__) {
|
||||
|
||||
var arrayLikeToArray=__webpack_require__(/*! ./arrayLikeToArray */ "./node_modules/@babel/runtime/helpers/arrayLikeToArray.js");function _unsupportedIterableToArray(o,minLen){if(!o)return;if(typeof o==="string")return arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(o);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return arrayLikeToArray(o,minLen);}module.exports=_unsupportedIterableToArray;
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./node_modules/@mendix/pluggable-widgets-tools/dist/index.js":
|
||||
/*!********************************************************************!*\
|
||||
!*** ./node_modules/@mendix/pluggable-widgets-tools/dist/index.js ***!
|
||||
\********************************************************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports, __webpack_require__) {
|
||||
|
||||
"use strict";
|
||||
var __createBinding=this&&this.__createBinding||(Object.create?function(o,m,k,k2){if(k2===undefined)k2=k;Object.defineProperty(o,k2,{enumerable:true,get:function get(){return m[k];}});}:function(o,m,k,k2){if(k2===undefined)k2=k;o[k2]=m[k];});var __exportStar=this&&this.__exportStar||function(m,exports){for(var p in m){if(p!=="default"&&!exports.hasOwnProperty(p))__createBinding(exports,m,p);}};Object.defineProperty(exports,"__esModule",{value:true});__exportStar(__webpack_require__(/*! ./native/common */ "./node_modules/@mendix/pluggable-widgets-tools/dist/native/common.js"),exports);__exportStar(__webpack_require__(/*! ./web/common */ "./node_modules/@mendix/pluggable-widgets-tools/dist/web/common.js"),exports);
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./node_modules/@mendix/pluggable-widgets-tools/dist/native/common.js":
|
||||
/*!****************************************************************************!*\
|
||||
!*** ./node_modules/@mendix/pluggable-widgets-tools/dist/native/common.js ***!
|
||||
\****************************************************************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports, __webpack_require__) {
|
||||
|
||||
"use strict";
|
||||
var _interopRequireDefault=__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js");var _defineProperty2=_interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/defineProperty */ "./node_modules/@babel/runtime/helpers/defineProperty.js"));var _extends3=_interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/extends.js"));var _toConsumableArray2=_interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/toConsumableArray */ "./node_modules/@babel/runtime/helpers/toConsumableArray.js"));Object.defineProperty(exports,"__esModule",{value:true});exports.mergeNativeStyles=void 0;function mergeNativeStyles(defaultStyle,overrideStyles){var styles=[defaultStyle].concat((0,_toConsumableArray2.default)(overrideStyles.filter(function(object){return object!==undefined;})));return Object.keys(defaultStyle).reduce(function(flattened,currentKey){var styleItems=styles.map(function(object){return object[currentKey];});return(0,_extends3.default)((0,_extends3.default)({},flattened),(0,_defineProperty2.default)({},currentKey,flattenObjects(styleItems)));},{});}exports.mergeNativeStyles=mergeNativeStyles;function flattenObjects(objects){return objects.reduce(function(merged,object){return(0,_extends3.default)((0,_extends3.default)({},merged),object);},{});}
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./node_modules/@mendix/pluggable-widgets-tools/dist/web/common.js":
|
||||
/*!*************************************************************************!*\
|
||||
!*** ./node_modules/@mendix/pluggable-widgets-tools/dist/web/common.js ***!
|
||||
\*************************************************************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports, __webpack_require__) {
|
||||
|
||||
"use strict";
|
||||
Object.defineProperty(exports,"__esModule",{value:true});exports.parseInlineStyle=void 0;function parseInlineStyle(){var style=arguments.length>0&&arguments[0]!==undefined?arguments[0]:"";try{return style.split(";").reduce(function(styleObject,line){var pair=line.split(":");if(pair.length===2){var name=pair[0].trim().replace(/(-.)/g,function(match){return match[1].toUpperCase();});styleObject[name]=pair[1].trim();}return styleObject;},{});}catch(_){return{};}}exports.parseInlineStyle=parseInlineStyle;
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./src/Autosearch.tsx":
|
||||
/*!****************************!*\
|
||||
!*** ./src/Autosearch.tsx ***!
|
||||
\****************************/
|
||||
/*! exports provided: Autosearch */
|
||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
||||
|
||||
"use strict";
|
||||
__webpack_require__.r(__webpack_exports__);
|
||||
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Autosearch", function() { return Autosearch; });
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var react_native__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-native */ "react-native");
|
||||
/* harmony import */ var react_native__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_native__WEBPACK_IMPORTED_MODULE_1__);
|
||||
/* harmony import */ var _mendix_pluggable_widgets_tools__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mendix/pluggable-widgets-tools */ "./node_modules/@mendix/pluggable-widgets-tools/dist/index.js");
|
||||
/* harmony import */ var _mendix_pluggable_widgets_tools__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_mendix_pluggable_widgets_tools__WEBPACK_IMPORTED_MODULE_2__);
|
||||
|
||||
|
||||
|
||||
const defaultStyle = {
|
||||
container: {},
|
||||
label: {
|
||||
color: "#F6BB42"
|
||||
},
|
||||
input: {
|
||||
height: 45,
|
||||
borderBottomWidth: 1,
|
||||
borderBottomColor: '#de712b',
|
||||
}
|
||||
};
|
||||
class Autosearch extends react__WEBPACK_IMPORTED_MODULE_0__["Component"] {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.styles = Object(_mendix_pluggable_widgets_tools__WEBPACK_IMPORTED_MODULE_2__["mergeNativeStyles"])(defaultStyle, this.props.style);
|
||||
this.onChangeHandler = this.onChange.bind(this);
|
||||
this.state = {
|
||||
textboxValue: '',
|
||||
};
|
||||
}
|
||||
render() {
|
||||
return (Object(react__WEBPACK_IMPORTED_MODULE_0__["createElement"])(react_native__WEBPACK_IMPORTED_MODULE_1__["View"], { style: this.styles.container },
|
||||
Object(react__WEBPACK_IMPORTED_MODULE_0__["createElement"])(react_native__WEBPACK_IMPORTED_MODULE_1__["TextInput"], { style: this.styles.input, value: this.state.textboxValue, onChangeText: this.onChangeHandler, placeholder: 'Zoeken...' })));
|
||||
}
|
||||
onChange(text) {
|
||||
var _a;
|
||||
this.setState({ textboxValue: text });
|
||||
this.props.searchvalue.setValue(text);
|
||||
(_a = this.props.onChange) === null || _a === void 0 ? void 0 : _a.execute();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "react":
|
||||
/*!************************!*\
|
||||
!*** external "react" ***!
|
||||
\************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports) {
|
||||
|
||||
module.exports = require("react");
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "react-native":
|
||||
/*!*******************************!*\
|
||||
!*** external "react-native" ***!
|
||||
\*******************************/
|
||||
/*! no static exports found */
|
||||
/***/ (function(module, exports) {
|
||||
|
||||
module.exports = require("react-native");
|
||||
|
||||
/***/ })
|
||||
|
||||
/******/ });
|
||||
//# sourceMappingURL=Autosearch.js.map
|
||||
1
dist/tmp/widgets/incentro/autosearch/Autosearch.js.map
vendored
Normal file
1
dist/tmp/widgets/incentro/autosearch/Autosearch.js.map
vendored
Normal file
File diff suppressed because one or more lines are too long
11
dist/tmp/widgets/package.xml
vendored
Normal file
11
dist/tmp/widgets/package.xml
vendored
Normal file
@@ -0,0 +1,11 @@
|
||||
<?xml version="1.0" encoding="utf-8" ?>
|
||||
<package xmlns="http://www.mendix.com/package/1.0/">
|
||||
<clientModule name="Autosearch" version="1.0.0" xmlns="http://www.mendix.com/clientModule/1.0/">
|
||||
<widgetFiles>
|
||||
<widgetFile path="Autosearch.xml"/>
|
||||
</widgetFiles>
|
||||
<files>
|
||||
<file path="incentro/autosearch"/>
|
||||
</files>
|
||||
</clientModule>
|
||||
</package>
|
||||
20547
package-lock.json
generated
Normal file
20547
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
32
package.json
Normal file
32
package.json
Normal file
@@ -0,0 +1,32 @@
|
||||
{
|
||||
"name": "autosearch",
|
||||
"widgetName": "Autosearch",
|
||||
"version": "1.0.0",
|
||||
"description": "Mendix Native textbox with an onchange event for searching values when user input is detected",
|
||||
"copyright": "2020 Incentro Business Acceleration B.V.",
|
||||
"author": "Bart Onstee",
|
||||
"config": {
|
||||
"projectPath": "../..//"
|
||||
},
|
||||
"packagePath": "incentro",
|
||||
"scripts": {
|
||||
"start": "npm run dev",
|
||||
"build": "pluggable-widgets-tools build:native",
|
||||
"dev": "pluggable-widgets-tools start:native",
|
||||
"lint": "pluggable-widgets-tools lint",
|
||||
"lint:fix": "pluggable-widgets-tools lint:fix",
|
||||
"prerelease": "npm run lint",
|
||||
"release": "pluggable-widgets-tools release:native"
|
||||
},
|
||||
"license": "Apache-2.0",
|
||||
"bugs": {
|
||||
"url": "https://github.com/Bart Onstee/autosearch/issues"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@mendix/pluggable-widgets-tools": "^8.12.0",
|
||||
"@types/big.js": "^4.0.5",
|
||||
"@types/react": "~16.9.0",
|
||||
"@types/react-native": "~0.61.23"
|
||||
},
|
||||
"dependencies": {}
|
||||
}
|
||||
5
prettier.config.js
Normal file
5
prettier.config.js
Normal file
@@ -0,0 +1,5 @@
|
||||
const base = require("@mendix/pluggable-widgets-tools/configs/prettier.base.json");
|
||||
|
||||
module.exports = {
|
||||
...base
|
||||
};
|
||||
54
src/Autosearch.tsx
Normal file
54
src/Autosearch.tsx
Normal file
@@ -0,0 +1,54 @@
|
||||
import { Component, ReactNode, createElement } from "react";
|
||||
import { TextStyle, ViewStyle, TextInput, View } from "react-native";
|
||||
|
||||
import { Style, mergeNativeStyles } from "@mendix/pluggable-widgets-tools";
|
||||
|
||||
import { AutosearchProps } from "../typings/AutosearchProps";
|
||||
|
||||
export interface AutosearchStyle extends Style {
|
||||
container: ViewStyle;
|
||||
label: TextStyle;
|
||||
input: ViewStyle;
|
||||
}
|
||||
|
||||
interface State {
|
||||
textboxValue?: string;
|
||||
}
|
||||
|
||||
const defaultStyle: AutosearchStyle = {
|
||||
container: {},
|
||||
label: {
|
||||
color: "#F6BB42"
|
||||
},
|
||||
input: {
|
||||
height: 45,
|
||||
borderBottomWidth: 1,
|
||||
borderBottomColor: '#de712b',
|
||||
}
|
||||
};
|
||||
|
||||
export class Autosearch extends Component<AutosearchProps<AutosearchStyle>, State> {
|
||||
private readonly styles = mergeNativeStyles(defaultStyle, this.props.style);
|
||||
private readonly onChangeHandler = this.onChange.bind(this);
|
||||
constructor(props: AutosearchProps<AutosearchStyle>){
|
||||
super(props)
|
||||
this.state = {
|
||||
textboxValue: '',
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
render(): ReactNode {
|
||||
return (
|
||||
<View style={this.styles.container}>
|
||||
<TextInput style={this.styles.input} value={this.state.textboxValue} onChangeText={this.onChangeHandler} placeholder={'Zoeken...'}></TextInput>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
private onChange(text: string) {
|
||||
this.setState({textboxValue: text});
|
||||
this.props.searchvalue.setValue(text);
|
||||
this.props.onChange?.execute();
|
||||
}
|
||||
}
|
||||
31
src/Autosearch.xml
Normal file
31
src/Autosearch.xml
Normal file
@@ -0,0 +1,31 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<widget id="incentro.autosearch.Autosearch" pluginWidget="true" needsEntityContext="true" offlineCapable="true"
|
||||
supportedPlatform="Native"
|
||||
xmlns="http://www.mendix.com/widget/1.0/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
|
||||
xsi:schemaLocation="http://www.mendix.com/widget/1.0/ ../node_modules/mendix/custom_widget.xsd">
|
||||
<name>Autosearch</name>
|
||||
<description>Mendix Native textbox with an onchange event for searching values when user input is detected</description>
|
||||
<icon/>
|
||||
<properties>
|
||||
<propertyGroup caption="General">
|
||||
<propertyGroup caption="Data source">
|
||||
<property key="searchvalue" type="attribute">
|
||||
<caption>Search value</caption>
|
||||
<description>The attribute which will hold the search value.</description>
|
||||
<attributeTypes>
|
||||
<attributeType name="String"/>
|
||||
</attributeTypes>
|
||||
</property>
|
||||
</propertyGroup>
|
||||
<propertyGroup caption="Events">
|
||||
<property key="onChange" type="action" required="false">
|
||||
<caption>On change</caption>
|
||||
<description/>
|
||||
</property>
|
||||
</propertyGroup>
|
||||
<propertyGroup caption="Common">
|
||||
<systemProperty key="Name"/>
|
||||
</propertyGroup>
|
||||
</propertyGroup>
|
||||
</properties>
|
||||
</widget>
|
||||
11
src/package.xml
Normal file
11
src/package.xml
Normal file
@@ -0,0 +1,11 @@
|
||||
<?xml version="1.0" encoding="utf-8" ?>
|
||||
<package xmlns="http://www.mendix.com/package/1.0/">
|
||||
<clientModule name="Autosearch" version="1.0.0" xmlns="http://www.mendix.com/clientModule/1.0/">
|
||||
<widgetFiles>
|
||||
<widgetFile path="Autosearch.xml"/>
|
||||
</widgetFiles>
|
||||
<files>
|
||||
<file path="incentro/autosearch"/>
|
||||
</files>
|
||||
</clientModule>
|
||||
</package>
|
||||
3
tsconfig.json
Normal file
3
tsconfig.json
Normal file
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"extends": "./node_modules/@mendix/pluggable-widgets-tools/configs/tsconfig.base.json"
|
||||
}
|
||||
20
typings/AutosearchProps.d.ts
vendored
Normal file
20
typings/AutosearchProps.d.ts
vendored
Normal file
@@ -0,0 +1,20 @@
|
||||
/**
|
||||
* This file was generated from Autosearch.xml
|
||||
* WARNING: All changes made to this file will be overwritten
|
||||
* @author Mendix UI Content Team
|
||||
*/
|
||||
import { ActionValue, EditableValue } from "mendix";
|
||||
|
||||
export interface AutosearchProps<Style> {
|
||||
name: string;
|
||||
style: Style[];
|
||||
searchvalue: EditableValue<string>;
|
||||
onChange?: ActionValue;
|
||||
}
|
||||
|
||||
export interface AutosearchPreviewProps {
|
||||
class: string;
|
||||
style: string;
|
||||
searchvalue: string;
|
||||
onChange: {} | null;
|
||||
}
|
||||
Reference in New Issue
Block a user