Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
ng-select2-component
Advanced tools
ng-select2-component - npm Package Compare versions
Comparing version 15.0.1 to 15.1.0
| # Changelog of ng-select2 | ||
| ## V15.1.0 (2024-08-02) | ||
| ### Changes | ||
| - Add grid layout mode in dropdown #72 | ||
| - Fix init value in multiple mode #73 | ||
| - Fix reset value | ||
| ## V15.0.1 (2024-07-24) | ||
@@ -4,0 +12,0 @@ |
@@ -78,2 +78,8 @@ import { ConnectedPosition } from '@angular/cdk/overlay'; | ||
| resetSelectedValue: any; | ||
| /** grid: item by line | ||
| * * 0 = no grid | ||
| * * number = item by line (4) | ||
| * * string = minimal size item (100px) | ||
| */ | ||
| grid: string; | ||
| update: EventEmitter<Select2UpdateEvent<Select2UpdateValue>>; | ||
@@ -152,2 +158,3 @@ autoCreateItem: EventEmitter<Select2AutoCreateEvent<Select2UpdateValue>>; | ||
| triggerRect(): void; | ||
| isNumber(o: any): boolean; | ||
| private testSelection; | ||
@@ -224,3 +231,3 @@ private testValueChange; | ||
| static ɵfac: i0.ɵɵFactoryDeclaration<Select2, [null, null, { optional: true; }, { optional: true; }, { optional: true; self: true; }, { attribute: "tabindex"; }]>; | ||
| static ɵcmp: i0.ɵɵComponentDeclaration<Select2, "select2", never, { "data": { "alias": "data"; "required": true; }; "minCharForSearch": { "alias": "minCharForSearch"; "required": false; }; "displaySearchStatus": { "alias": "displaySearchStatus"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "limitSelection": { "alias": "limitSelection"; "required": false; }; "listPosition": { "alias": "listPosition"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "overlay": { "alias": "overlay"; "required": false; }; "styleMode": { "alias": "styleMode"; "required": false; }; "noResultMessage": { "alias": "noResultMessage"; "required": false; }; "maxResults": { "alias": "maxResults"; "required": false; }; "maxResultsMessage": { "alias": "maxResultsMessage"; "required": false; }; "infiniteScrollDistance": { "alias": "infiniteScrollDistance"; "required": false; }; "infiniteScrollThrottle": { "alias": "infiniteScrollThrottle"; "required": false; }; "infiniteScroll": { "alias": "infiniteScroll"; "required": false; }; "autoCreate": { "alias": "autoCreate"; "required": false; }; "noLabelTemplate": { "alias": "noLabelTemplate"; "required": false; }; "editPattern": { "alias": "editPattern"; "required": false; }; "templates": { "alias": "templates"; "required": false; }; "resultMaxHeight": { "alias": "resultMaxHeight"; "required": false; }; "customSearchEnabled": { "alias": "customSearchEnabled"; "required": false; }; "minCountForSearch": { "alias": "minCountForSearch"; "required": false; }; "id": { "alias": "id"; "required": false; }; "required": { "alias": "required"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "hideSelectedItems": { "alias": "hideSelectedItems"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "value": { "alias": "value"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "resettable": { "alias": "resettable"; "required": false; }; "resetSelectedValue": { "alias": "resetSelectedValue"; "required": false; }; }, { "update": "update"; "autoCreateItem": "autoCreateItem"; "open": "open"; "close": "close"; "focus": "focus"; "blur": "blur"; "search": "search"; "scroll": "scroll"; "removeOption": "removeOption"; }, never, ["select2-label", "select2-hint"], false, never>; | ||
| static ɵcmp: i0.ɵɵComponentDeclaration<Select2, "select2", never, { "data": { "alias": "data"; "required": true; }; "minCharForSearch": { "alias": "minCharForSearch"; "required": false; }; "displaySearchStatus": { "alias": "displaySearchStatus"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "limitSelection": { "alias": "limitSelection"; "required": false; }; "listPosition": { "alias": "listPosition"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "overlay": { "alias": "overlay"; "required": false; }; "styleMode": { "alias": "styleMode"; "required": false; }; "noResultMessage": { "alias": "noResultMessage"; "required": false; }; "maxResults": { "alias": "maxResults"; "required": false; }; "maxResultsMessage": { "alias": "maxResultsMessage"; "required": false; }; "infiniteScrollDistance": { "alias": "infiniteScrollDistance"; "required": false; }; "infiniteScrollThrottle": { "alias": "infiniteScrollThrottle"; "required": false; }; "infiniteScroll": { "alias": "infiniteScroll"; "required": false; }; "autoCreate": { "alias": "autoCreate"; "required": false; }; "noLabelTemplate": { "alias": "noLabelTemplate"; "required": false; }; "editPattern": { "alias": "editPattern"; "required": false; }; "templates": { "alias": "templates"; "required": false; }; "resultMaxHeight": { "alias": "resultMaxHeight"; "required": false; }; "customSearchEnabled": { "alias": "customSearchEnabled"; "required": false; }; "minCountForSearch": { "alias": "minCountForSearch"; "required": false; }; "id": { "alias": "id"; "required": false; }; "required": { "alias": "required"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "hideSelectedItems": { "alias": "hideSelectedItems"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "value": { "alias": "value"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "resettable": { "alias": "resettable"; "required": false; }; "resetSelectedValue": { "alias": "resetSelectedValue"; "required": false; }; "grid": { "alias": "grid"; "required": false; }; }, { "update": "update"; "autoCreateItem": "autoCreateItem"; "open": "open"; "close": "close"; "focus": "focus"; "blur": "blur"; "search": "search"; "scroll": "scroll"; "removeOption": "removeOption"; }, never, ["select2-label", "select2-hint"], false, never>; | ||
| static ngAcceptInputType_minCharForSearch: unknown; | ||
@@ -227,0 +234,0 @@ static ngAcceptInputType_limitSelection: unknown; |
| { | ||
| "name": "ng-select2-component", | ||
| "version": "15.0.1", | ||
| "version": "15.1.0", | ||
| "description": "An Angular select2 component.", | ||
@@ -5,0 +5,0 @@ "author": "York Yao, Célian Veyssière", |
@@ -42,3 +42,3 @@ [](https://badge.fury.io/js/ng-select2-component) [](https://www.npmjs.com/package/ng-select2-component) [](https://raw.githubusercontent.com/Harvest-Dev/ng-select2/master/LICENSE.md) | ||
| - select one | ||
| - options or groups | ||
| - options or groups (list or grid) | ||
| - scroll | ||
@@ -78,40 +78,41 @@ - local search | ||
| | name | type | status | default | description | required | | ||
| | ------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------- | -------- | -------------------- | -------------------------------------------------------------------------------------- | ------------------------------------ | | ||
| | `data` | [`Select2Data`](#select2-data-structure) | required | | the data of the select2 | | | ||
| | `value` | [`Select2Value`](#select2-data-structure) | | | initial value | | | ||
| | `minCharForSearch` | `number` | | `0` | start the search when the number of characters is reached (`0` = unlimited) | | | ||
| | `minCountForSearch` | `number` | | `6` | hide search box if `options.length < minCountForSearch` | | | ||
| | `displaySearchStatus` | `'default'`<br>`'hidden'`<br>`'always'` | | `'default'` | display the search box (`default` : is based on `minCountForSearch`) | | | ||
| | `placeholder` | `string` | | | the placeholder string if nothing selected | | | ||
| | `noResultMessage` | `string` | | | the message string if no results when using the search field | | | ||
| | `customSearchEnabled` | `boolean` | | `false` | will trigger `search` event, and disable inside filter | | | ||
| | `multiple` | `boolean` | | `false` | select multiple options | | | ||
| | `resettable` | `boolean` | | `false` | add a button to reset value | not `multiple` | | ||
| | `resetSelectedValue` | `any` | | `undefined` | selected option when × is clicked | not `multiple` and with `resettable` | | ||
| | `autoCreate` | `boolean` | | `false` | gives the possibility to add elements not present in the list. | | | ||
| | `limitSelection` | `number` | | `0` | to limit multiple selection (`0` = unlimited) | | | ||
| | `hideSelectedItems` | `boolean` | | `false` | remove selected values | with `multiple` | | ||
| | `resultMaxHeight` | `string` | | `'200px'` | change the height size of results | | | ||
| | `maxResults` | `number` | | `0` | maximum results limit (`0` = unlimited) | | | ||
| | `maxResultsMessage` | `string` | | `'Too much result…'` | message when maximum result | | | ||
| | `listPosition` | `'below'`<br>`'above'`<br>`'auto'` ¹ | | `'below'` | the position for the dropdown list | ¹ `'auto'`: only with `overlay` | | ||
| | `infiniteScroll` | `boolean` | | `false` | active infiniteScroll on dropdown list | with `ngx-infinite-scroll` | | ||
| | `infiniteScrollDistance` | `number` | | `1.5` | infiniteScroll distance | with `ngx-infinite-scroll` | | ||
| | `infiniteScrollThrottle` | `number` | | `150` | infiniteScroll throttle | | | ||
| | `overlay` | `boolean` | | `false` | active an overlay mode for dropdown list (with angular cdk). (See [Overlay](#overlay)) | | | ||
| | `styleMode` | `'default'`<br>`'material'`<br>`'noStyle'`<br>`'borderless'` | | `'default'` | change style for material style or remove border and background color | | | ||
| | `templates` | `TemplateRef`<br>`{option?: TemplateRef, group?: TemplateRef}`<br>`{templateId1: TemplateRef, ...}` | | | use templates for formatting content (see [Templating](#templating)) | | | ||
| | `noLabelTemplate` | `boolean` | | `false` | do not use the template in the selection, stay in text mode | | | ||
| | `editPattern` | `(str: string) => string` | | | use it for change the pattern of the filter search | | | ||
| | `ngModel`<br>`id`<br>`required`<br>`disabled`<br>`readonly`<br>`tabIndex` | | | | just like a `select` control | | | ||
| | `(update)` | `(event: `[`Select2UpdateEvent`](#select2-data-structure)`) => void` | event | | triggered when user select an option | | | ||
| | `(open)` | `(event: Select2) => void` | event | | triggered when user open the options | | | ||
| | `(close)` | `(event: Select2) => void` | event | | triggered when user close the options | | | ||
| | `(focus)` | `(event: Select2) => void` | event | | triggered when user enters the component | | | ||
| | `(blur)` | `(event: Select2) => void` | event | | triggered when user leaves the component | | | ||
| | `(search)` | `(event: `[`Select2SearchEvent`](#select2-data-structure)`) => void` | event | | triggered when search text changed | with `customSearchEnabled` | | ||
| | `(scroll)` | `(event: `[`Select2ScrollEvent`](#select2-data-structure)`) => void` | event | | triggered when infiniteScroll is on `up` or `down` position | with `ngx-infinite-scroll` | | ||
| | `(removeOption)` | `(event: `[`Select2RemoveEvent`](#select2-data-structure)`) => void` | event | | triggered when an option is removed from the list of selected options options list | with `multiple` | | ||
| | `(autoCreateItem)` | `(event: `[`Select2AutoCreateEvent`](#select2-data-structure)`) => void` | event | | triggered when a new item has been added | with `autoCreate` | | ||
| | name | type | status | default | description | required | | ||
| | ------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------- | -------- | -------------------- | ------------------------------------------------------------------------------------------------------------------- | ------------------------------------ | | ||
| | `data` | [`Select2Data`](#select2-data-structure) | required | | the data of the select2 | | | ||
| | `value` | [`Select2Value`](#select2-data-structure) | | | initial value | | | ||
| | `minCharForSearch` | `number` | | `0` | start the search when the number of characters is reached (`0` = unlimited) | | | ||
| | `minCountForSearch` | `number` | | `6` | hide search box if `options.length < minCountForSearch` | | | ||
| | `displaySearchStatus` | `'default'`<br>`'hidden'`<br>`'always'` | | `'default'` | display the search box (`default` : is based on `minCountForSearch`) | | | ||
| | `placeholder` | `string` | | | the placeholder string if nothing selected | | | ||
| | `noResultMessage` | `string` | | | the message string if no results when using the search field | | | ||
| | `customSearchEnabled` | `boolean` | | `false` | will trigger `search` event, and disable inside filter | | | ||
| | `multiple` | `boolean` | | `false` | select multiple options | | | ||
| | `resettable` | `boolean` | | `false` | add a button to reset value | not `multiple` | | ||
| | `resetSelectedValue` | `any` | | `undefined` | selected option when × is clicked | not `multiple` and with `resettable` | | ||
| | `autoCreate` | `boolean` | | `false` | gives the possibility to add elements not present in the list. | | | ||
| | `limitSelection` | `number` | | `0` | to limit multiple selection (`0` = unlimited) | | | ||
| | `hideSelectedItems` | `boolean` | | `false` | remove selected values | with `multiple` | | ||
| | `resultMaxHeight` | `string` | | `'200px'` | change the height size of results | | | ||
| | `maxResults` | `number` | | `0` | maximum results limit (`0` = unlimited) | | | ||
| | `maxResultsMessage` | `string` | | `'Too much result…'` | message when maximum result | | | ||
| | `grid` | `number` or `string` | | | option by line in grid layout (empty or `0` = no grid layout)<br>number: item by line<br>string: minimal item width | | | ||
| | `listPosition` | `'below'`<br>`'above'`<br>`'auto'` ¹ | | `'below'` | the position for the dropdown list | ¹ `'auto'`: only with `overlay` | | ||
| | `infiniteScroll` | `boolean` | | `false` | active infiniteScroll on dropdown list | with `ngx-infinite-scroll` | | ||
| | `infiniteScrollDistance` | `number` | | `1.5` | infiniteScroll distance | with `ngx-infinite-scroll` | | ||
| | `infiniteScrollThrottle` | `number` | | `150` | infiniteScroll throttle | | | ||
| | `overlay` | `boolean` | | `false` | active an overlay mode for dropdown list (with angular cdk). (See [Overlay](#overlay)) | | | ||
| | `styleMode` | `'default'`<br>`'material'`<br>`'noStyle'`<br>`'borderless'` | | `'default'` | change style for material style or remove border and background color | | | ||
| | `templates` | `TemplateRef`<br>`{option?: TemplateRef, group?: TemplateRef}`<br>`{templateId1: TemplateRef, ...}` | | | use templates for formatting content (see [Templating](#templating)) | | | ||
| | `noLabelTemplate` | `boolean` | | `false` | do not use the template in the selection, stay in text mode | | | ||
| | `editPattern` | `(str: string) => string` | | | use it for change the pattern of the filter search | | | ||
| | `ngModel`<br>`id`<br>`required`<br>`disabled`<br>`readonly`<br>`tabIndex` | | | | just like a `select` control | | | ||
| | `(update)` | `(event: `[`Select2UpdateEvent`](#select2-data-structure)`) => void` | event | | triggered when user select an option | | | ||
| | `(open)` | `(event: Select2) => void` | event | | triggered when user open the options | | | ||
| | `(close)` | `(event: Select2) => void` | event | | triggered when user close the options | | | ||
| | `(focus)` | `(event: Select2) => void` | event | | triggered when user enters the component | | | ||
| | `(blur)` | `(event: Select2) => void` | event | | triggered when user leaves the component | | | ||
| | `(search)` | `(event: `[`Select2SearchEvent`](#select2-data-structure)`) => void` | event | | triggered when search text changed | with `customSearchEnabled` | | ||
| | `(scroll)` | `(event: `[`Select2ScrollEvent`](#select2-data-structure)`) => void` | event | | triggered when infiniteScroll is on `up` or `down` position | with `ngx-infinite-scroll` | | ||
| | `(removeOption)` | `(event: `[`Select2RemoveEvent`](#select2-data-structure)`) => void` | event | | triggered when an option is removed from the list of selected options options list | with `multiple` | | ||
| | `(autoCreateItem)` | `(event: `[`Select2AutoCreateEvent`](#select2-data-structure)`) => void` | event | | triggered when a new item has been added | with `autoCreate` | | ||
@@ -364,3 +365,3 @@ ### select2 data structure | ||
| --select2-option-padding: 6px; | ||
| /* hint */ | ||
@@ -367,0 +368,0 @@ --select2-hint-text-color: #888; |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by2.44%
577560
- Lines of code
- increased by1.85%
3588
- Number of lines in readme file
- increased by0.25%
401
No dependency changes