├── .gitignore ├── .npmignore ├── LICENSE ├── README.md ├── demo-ng ├── app │ ├── App_Resources │ │ ├── Android │ │ │ ├── AndroidManifest.xml │ │ │ ├── app.gradle │ │ │ ├── drawable-hdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-ldpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-mdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-nodpi │ │ │ │ └── splash_screen.xml │ │ │ ├── drawable-xhdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-xxhdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-xxxhdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── values-v21 │ │ │ │ ├── colors.xml │ │ │ │ └── styles.xml │ │ │ └── values │ │ │ │ ├── colors.xml │ │ │ │ └── styles.xml │ │ └── iOS │ │ │ ├── Assets.xcassets │ │ │ ├── AppIcon.appiconset │ │ │ │ ├── Contents.json │ │ │ │ ├── icon-29.png │ │ │ │ ├── icon-29@2x.png │ │ │ │ ├── icon-29@3x.png │ │ │ │ ├── icon-40.png │ │ │ │ ├── icon-40@2x.png │ │ │ │ ├── icon-40@3x.png │ │ │ │ ├── icon-60@2x.png │ │ │ │ ├── icon-60@3x.png │ │ │ │ ├── icon-76.png │ │ │ │ ├── icon-76@2x.png │ │ │ │ └── icon-83.5@2x.png │ │ │ ├── Contents.json │ │ │ ├── LaunchImage.launchimage │ │ │ │ ├── Contents.json │ │ │ │ ├── Default-568h@2x.png │ │ │ │ ├── Default-667h@2x.png │ │ │ │ ├── Default-736h@3x.png │ │ │ │ ├── Default-Landscape.png │ │ │ │ ├── Default-Landscape@2x.png │ │ │ │ ├── Default-Landscape@3x.png │ │ │ │ ├── Default-Portrait.png │ │ │ │ ├── Default-Portrait@2x.png │ │ │ │ ├── Default.png │ │ │ │ └── Default@2x.png │ │ │ ├── LaunchScreen.AspectFill.imageset │ │ │ │ ├── Contents.json │ │ │ │ ├── LaunchScreen-AspectFill.png │ │ │ │ └── LaunchScreen-AspectFill@2x.png │ │ │ └── LaunchScreen.Center.imageset │ │ │ │ ├── Contents.json │ │ │ │ ├── LaunchScreen-Center.png │ │ │ │ └── LaunchScreen-Center@2x.png │ │ │ ├── Info.plist │ │ │ ├── LaunchScreen.storyboard │ │ │ └── build.xcconfig │ ├── app.component.html │ ├── app.component.ts │ ├── app.css │ ├── app.module.ts │ ├── app.routing.ts │ ├── item │ │ ├── item-detail.component.html │ │ ├── item-detail.component.ts │ │ ├── item.service.ts │ │ ├── item.ts │ │ ├── items.component.html │ │ └── items.component.ts │ ├── main.aot.ts │ ├── main.ts │ └── package.json ├── package.json └── tsconfig.json ├── demo-webpack ├── app │ ├── App_Resources │ │ ├── Android │ │ │ ├── AndroidManifest.xml │ │ │ ├── app.gradle │ │ │ ├── drawable-hdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-ldpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-mdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-nodpi │ │ │ │ └── splash_screen.xml │ │ │ ├── drawable-xhdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-xxhdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-xxxhdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── values-v21 │ │ │ │ ├── colors.xml │ │ │ │ └── styles.xml │ │ │ └── values │ │ │ │ ├── colors.xml │ │ │ │ └── styles.xml │ │ └── iOS │ │ │ ├── Assets.xcassets │ │ │ ├── AppIcon.appiconset │ │ │ │ ├── Contents.json │ │ │ │ ├── icon-1024.png │ │ │ │ ├── icon-29.png │ │ │ │ ├── icon-29@2x.png │ │ │ │ ├── icon-29@3x.png │ │ │ │ ├── icon-40.png │ │ │ │ ├── icon-40@2x.png │ │ │ │ ├── icon-40@3x.png │ │ │ │ ├── icon-60@2x.png │ │ │ │ ├── icon-60@3x.png │ │ │ │ ├── icon-76.png │ │ │ │ ├── icon-76@2x.png │ │ │ │ └── icon-83.5@2x.png │ │ │ ├── Contents.json │ │ │ ├── LaunchImage.launchimage │ │ │ │ ├── Contents.json │ │ │ │ ├── Default-568h@2x.png │ │ │ │ ├── Default-667h@2x.png │ │ │ │ ├── Default-736h@3x.png │ │ │ │ ├── Default-Landscape.png │ │ │ │ ├── Default-Landscape@2x.png │ │ │ │ ├── Default-Landscape@3x.png │ │ │ │ ├── Default-Portrait.png │ │ │ │ ├── Default-Portrait@2x.png │ │ │ │ ├── Default.png │ │ │ │ └── Default@2x.png │ │ │ ├── LaunchScreen.AspectFill.imageset │ │ │ │ ├── Contents.json │ │ │ │ ├── LaunchScreen-AspectFill.png │ │ │ │ └── LaunchScreen-AspectFill@2x.png │ │ │ └── LaunchScreen.Center.imageset │ │ │ │ ├── Contents.json │ │ │ │ ├── LaunchScreen-Center.png │ │ │ │ └── LaunchScreen-Center@2x.png │ │ │ ├── Info.plist │ │ │ ├── LaunchScreen.storyboard │ │ │ └── build.xcconfig │ ├── README.md │ ├── app.css │ ├── app.ts │ ├── bundle-config.ts │ ├── main-page.ts │ ├── main-page.xml │ ├── main-view-model.ts │ └── package.json ├── package.json └── tsconfig.json ├── demo ├── .DS_Store ├── app │ ├── App_Resources │ │ ├── Android │ │ │ ├── AndroidManifest.xml │ │ │ ├── app.gradle │ │ │ ├── drawable-hdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-ldpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-mdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-nodpi │ │ │ │ └── splash_screen.xml │ │ │ ├── drawable-xhdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-xxhdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── drawable-xxxhdpi │ │ │ │ ├── background.png │ │ │ │ ├── icon.png │ │ │ │ └── logo.png │ │ │ ├── values-v21 │ │ │ │ ├── colors.xml │ │ │ │ └── styles.xml │ │ │ └── values │ │ │ │ ├── colors.xml │ │ │ │ └── styles.xml │ │ └── iOS │ │ │ ├── Assets.xcassets │ │ │ ├── AppIcon.appiconset │ │ │ │ ├── Contents.json │ │ │ │ ├── icon-29.png │ │ │ │ ├── icon-29@2x.png │ │ │ │ ├── icon-29@3x.png │ │ │ │ ├── icon-40.png │ │ │ │ ├── icon-40@2x.png │ │ │ │ ├── icon-40@3x.png │ │ │ │ ├── icon-50.png │ │ │ │ ├── icon-50@2x.png │ │ │ │ ├── icon-57.png │ │ │ │ ├── icon-57@2x.png │ │ │ │ ├── icon-60@2x.png │ │ │ │ ├── icon-60@3x.png │ │ │ │ ├── icon-72.png │ │ │ │ ├── icon-72@2x.png │ │ │ │ ├── icon-76.png │ │ │ │ ├── icon-76@2x.png │ │ │ │ └── icon-83.5@2x.png │ │ │ ├── Contents.json │ │ │ ├── LaunchImage.launchimage │ │ │ │ ├── Contents.json │ │ │ │ ├── Default-568h@2x.png │ │ │ │ ├── Default-667h@2x.png │ │ │ │ ├── Default-736h@3x.png │ │ │ │ ├── Default-Landscape.png │ │ │ │ ├── Default-Landscape@2x.png │ │ │ │ ├── Default-Landscape@3x.png │ │ │ │ ├── Default-Portrait.png │ │ │ │ ├── Default-Portrait@2x.png │ │ │ │ ├── Default.png │ │ │ │ └── Default@2x.png │ │ │ ├── LaunchScreen.AspectFill.imageset │ │ │ │ ├── Contents.json │ │ │ │ ├── LaunchScreen-AspectFill.png │ │ │ │ └── LaunchScreen-AspectFill@2x.png │ │ │ └── LaunchScreen.Center.imageset │ │ │ │ ├── Contents.json │ │ │ │ ├── LaunchScreen-Center.png │ │ │ │ └── LaunchScreen-Center@2x.png │ │ │ ├── Info.plist │ │ │ ├── LaunchScreen.storyboard │ │ │ └── build.xcconfig │ ├── app.css │ ├── app.ts │ ├── countries.json │ ├── font-awesome.css │ ├── fonts │ │ └── fontawesome-webfont.ttf │ ├── icon.png │ ├── main-page.css │ ├── main-page.ts │ ├── main-page.xml │ ├── main-view-model.ts │ ├── package.json │ ├── pages │ │ └── label │ │ │ ├── label-view-model.ts │ │ │ ├── label.css │ │ │ ├── label.ts │ │ │ └── label.xml │ └── tests │ │ └── tests.js ├── package-lock.json ├── package.json └── tsconfig.json ├── filter-select.android.d.ts ├── filter-select.android.ts ├── filter-select.common.d.ts ├── filter-select.common.ts ├── filter-select.ios.d.ts ├── filter-select.ios.ts ├── index.d.ts ├── package.json ├── screenshots ├── android-filter-select.gif └── ios-filter-select.gif ├── scripts └── postclone.js ├── styles.css └── tsconfig.json /.gitignore: -------------------------------------------------------------------------------- 1 | *.js 2 | *.js.map 3 | *.log 4 | !scripts/*.js 5 | demo/app/*.js 6 | !demo/karma.conf.js 7 | !demo/app/tests/*.js 8 | demo/*.d.ts 9 | !demo/references.d.ts 10 | demo/lib 11 | demo/platforms 12 | demo/node_modules 13 | node_modules 14 | demo-ng/app/*.js 15 | !demo-ng/karma.conf.js 16 | !demo-ng/app/tests/*.js 17 | demo-ng/*.d.ts 18 | !demo-ng/references.d.ts 19 | demo-ng/lib 20 | demo-ng/platforms 21 | demo-ng/node_modules 22 | *.d.ts 23 | .DS_Store 24 | demo/.nsbuildinfo 25 | demo/.nslivesyncinfo 26 | demo/app/tns_modules/ 27 | 28 | 29 | demo-webpack/app/*.js 30 | !demo-webpack/karma.conf.js 31 | !demo-webpack/app/tests/*.js 32 | demo-webpack/*.d.ts 33 | !demo-webpack/references.d.ts 34 | demo-webpack/platforms 35 | demo-webpack/node_modules 36 | demo-webpack/app/vendor* 37 | demo-webpack/report 38 | 39 | .tmp_backup -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | demo/ 2 | demo-ng/ 3 | demo-webpack/ 4 | screenshots/ 5 | node_modules/ 6 | scripts/ 7 | *.gif 8 | *.png 9 | *.log 10 | *.map 11 | *.ts 12 | !*.d.ts 13 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | nativescript-yourplugin 4 | Copyright (c) 2016, Your Name 5 | 6 | Permission is hereby granted, free of charge, to any person obtaining a copy of 7 | this software and associated documentation files (the "Software"), to deal in 8 | the Software without restriction, including without limitation the rights to 9 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of 10 | the Software, and to permit persons to whom the Software is furnished to do so, 11 | subject to the following conditions: 12 | 13 | The above copyright notice and this permission notice shall be included in all 14 | copies or substantial portions of the Software. 15 | 16 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 17 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS 18 | FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR 19 | COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER 20 | IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN 21 | CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | # No active maintinance please go to https://www.npmjs.com/package/@ticnat/nativescript-searchable-select 4 | # FilterSelect 5 | [![npm](https://img.shields.io/npm/v/nativescript-filter-select.svg?maxAge=2592000?style=plastic)](https://www.npmjs.com/package/nativescript-filter-select) 6 | [![npm](https://img.shields.io/npm/dt/nativescript-filter-select.svg?maxAge=2592000?style=plastic)](https://www.npmjs.com/package/nativescript-filter-select) 7 | 8 | A NativeScript plugin to provide an listview widget to select AND filter items. 9 | ## Sample Screenshots 10 | 11 | #### Android and ios 12 | 13 | Sample 1 | Sample 2 14 | -------- | --------- 15 | ![Sample1](http://codeobia.com/screenshots/filter-label.gif) | ![Sample2](http://codeobia.com/screenshots/ios-filter-select.gif) 16 | ## Installation 17 | 18 | ##### NativeScript 4.x 19 | - `tns plugin add nativescript-filter-select` 20 | 21 | ## import css 22 | ` @import 'nativescript-filter-select/styles.css'; ` 23 | 24 | *Be sure to run a new build after adding plugins to avoid any issues 25 | ## Vanilla NativeScript 26 | 27 | IMPORTANT: *Make sure you include `xmlns:FS="nativescript-filter-select"` on the Page element* 28 | 29 | ### XML 30 | ```XML 31 | 32 | 33 | 40 | 41 | 42 | ``` 43 | ## Angular NativeScript 44 | ### Regiter plugin in Component class 45 | 46 | ```JAVASCRIPT 47 | 48 | import { registerElement } from 'nativescript-angular/element-registry'; 49 | import { FilterSelect } from 'nativescript-filter-select'; 50 | registerElement('FilterSelect', () => FilterSelect); 51 | 52 | ``` 53 | 54 | ### HTML 55 | ```HTML 56 | 63 | 64 | 65 | ``` 66 | 67 | 68 | 69 | 70 | ## Attributes 71 | 72 | ### see [demo](https://github.com/moayadnajd/nativescript-filter-select/tree/master/demo) examples for more information 73 | 74 | | Attribute | Description |Default 75 | | ------------- | ------------------------------------------------------- |-------- 76 | | render | to render "tags" or "label" or "drop" | string : tags 77 | | multiple | to limit the options selected to one if set to false | boolean : true 78 | |search_param| index of the string value in the items object to search on it |string : name 79 | |item_template|xml template for the listview items | string : `