@cnx-dev/angular-devextreme 1.0.1 → 1.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,79 +1,79 @@
1
- # @cnx-dev/angular-devextreme
2
-
3
- Angular UI Component Library powered by DevExtreme for CNX Dev internal applications.
4
- Provides enhanced, easy-to-use wrappers around DevExtreme components with built-in support for Dependency Injection and dynamic data loading.
5
-
6
- ## Features
7
-
8
- - **SelectBox (`<cnx-select-box>`)**: A smart dropdown component that supports dynamic data loading, pagination, search, cascading options (`cascadeBy`), and hidden options (`ignoreValue`) via the `SELECTBOX_DATA_PROVIDER` injection token.
9
- - Seamless integration with Angular 17+ and DevExtreme 23.2+.
10
- - Built with Angular Package Format (APF) for optimal consumption in both Module-based and Standalone Angular applications.
11
-
12
- ## Installation
13
-
14
- ```bash
15
- npm install @cnx-dev/angular-devextreme devextreme devextreme-angular
16
- ```
17
-
18
- ## Setup
19
-
20
- 1. Add the DevExtreme Light Compact Theme to your `angular.json`:
21
-
22
- ```json
23
- "styles": [
24
- "node_modules/devextreme/dist/css/dx.light.compact.css",
25
- "src/styles.css"
26
- ]
27
- ```
28
-
29
- 2. Add the `dx-viewport` class to your `<body>` in `src/index.html`:
30
-
31
- ```html
32
- <body class="dx-viewport">
33
- <app-root></app-root>
34
- </body>
35
- ```
36
-
37
- 3. Import the module in your application (e.g., `app.module.ts`):
38
-
39
- ```typescript
40
- import { DxSelectBoxModule, DxTemplateModule } from 'devextreme-angular';
41
- import { CnxSelectBoxModule } from '@cnx-dev/angular-devextreme';
42
- import { AppSelectBoxService } from './services/app-select-box.service';
43
-
44
- @NgModule({
45
- imports: [DxSelectBoxModule, DxTemplateModule, CnxSelectBoxModule.forRoot(AppSelectBoxService)],
46
- })
47
- export class AppModule {}
48
- ```
49
-
50
- ## SelectBox Usage
51
-
52
- Implement the `SelectBoxDataProvider` interface in your service:
53
-
54
- ```typescript
55
- import { Injectable } from '@angular/core';
56
- import { Observable, of } from 'rxjs';
57
- import { SelectBoxDataProvider, SelectBoxKey, SelectBoxParam, SelectBoxLoadResult } from '@cnx-dev/angular-devextreme';
58
-
59
- @Injectable()
60
- export class AppSelectBoxService implements SelectBoxDataProvider {
61
- getService(key: SelectBoxKey, param: SelectBoxParam): Observable<SelectBoxLoadResult> {
62
- if (key === 'bank') {
63
- const data = [{ text: 'Bangkok Bank', value: 'BBL', dropdownText: 'BBL - Bangkok Bank' }];
64
- return of({ data, totalCount: data.length });
65
- }
66
- return of(new SelectBoxLoadResult());
67
- }
68
- }
69
- ```
70
-
71
- Use in your template:
72
-
73
- ```html
74
- <cnx-select-box [selectBoxKey]="'bank'" [placeholder]="'Select Bank...'" (onValueChanged)="onBankChanged($event)"> </cnx-select-box>
75
- ```
76
-
77
- ## License
78
-
79
- UNLICENSED
1
+ # @cnx-dev/angular-devextreme
2
+
3
+ Angular UI Component Library powered by DevExtreme for CNX Dev internal applications.
4
+ Provides enhanced, easy-to-use wrappers around DevExtreme components with built-in support for Dependency Injection and dynamic data loading.
5
+
6
+ ## Features
7
+
8
+ - **SelectBox (`<cnx-select-box>`)**: A smart dropdown component that supports dynamic data loading, pagination, search, cascading options (`cascadeBy`), and hidden options (`ignoreValue`) via the `SELECTBOX_DATA_PROVIDER` injection token.
9
+ - Seamless integration with Angular 17+ and DevExtreme 23.2+.
10
+ - Built with Angular Package Format (APF) for optimal consumption in both Module-based and Standalone Angular applications.
11
+
12
+ ## Installation
13
+
14
+ ```bash
15
+ npm install @cnx-dev/angular-devextreme devextreme devextreme-angular
16
+ ```
17
+
18
+ ## Setup
19
+
20
+ 1. Add the DevExtreme Light Compact Theme to your `angular.json`:
21
+
22
+ ```json
23
+ "styles": [
24
+ "node_modules/devextreme/dist/css/dx.light.compact.css",
25
+ "src/styles.css"
26
+ ]
27
+ ```
28
+
29
+ 2. Add the `dx-viewport` class to your `<body>` in `src/index.html`:
30
+
31
+ ```html
32
+ <body class="dx-viewport">
33
+ <app-root></app-root>
34
+ </body>
35
+ ```
36
+
37
+ 3. Import the module in your application (e.g., `app.module.ts`):
38
+
39
+ ```typescript
40
+ import { DxSelectBoxModule, DxTemplateModule } from 'devextreme-angular';
41
+ import { CnxSelectBoxModule } from '@cnx-dev/angular-devextreme';
42
+ import { AppSelectBoxService } from './services/app-select-box.service';
43
+
44
+ @NgModule({
45
+ imports: [DxSelectBoxModule, DxTemplateModule, CnxSelectBoxModule.forRoot(AppSelectBoxService)],
46
+ })
47
+ export class AppModule {}
48
+ ```
49
+
50
+ ## SelectBox Usage
51
+
52
+ Implement the `SelectBoxDataProvider` interface in your service:
53
+
54
+ ```typescript
55
+ import { Injectable } from '@angular/core';
56
+ import { Observable, of } from 'rxjs';
57
+ import { SelectBoxDataProvider, SelectBoxKey, SelectBoxParam, SelectBoxLoadResult } from '@cnx-dev/angular-devextreme';
58
+
59
+ @Injectable()
60
+ export class AppSelectBoxService implements SelectBoxDataProvider {
61
+ getService(key: SelectBoxKey, param: SelectBoxParam): Observable<SelectBoxLoadResult> {
62
+ if (key === 'bank') {
63
+ const data = [{ text: 'Bangkok Bank', value: 'BBL', dropdownText: 'BBL - Bangkok Bank' }];
64
+ return of({ data, totalCount: data.length });
65
+ }
66
+ return of(new SelectBoxLoadResult());
67
+ }
68
+ }
69
+ ```
70
+
71
+ Use in your template:
72
+
73
+ ```html
74
+ <cnx-select-box [selectBoxKey]="'bank'" [placeholder]="'Select Bank...'" (onValueChanged)="onBankChanged($event)"> </cnx-select-box>
75
+ ```
76
+
77
+ ## License
78
+
79
+ UNLICENSED
@@ -24,11 +24,13 @@ class SelectBoxComponent {
24
24
  this.service = service;
25
25
  }
26
26
  ngOnInit() {
27
- this.setupDataSource();
27
+ if (!this.customDataSource) {
28
+ this.setupDataSource();
29
+ }
28
30
  }
29
31
  ngOnChanges(changes) {
30
32
  const change = changes['cascadeBy'];
31
- if (!!change && !change.firstChange) {
33
+ if (!!change && !change.firstChange && !this.customDataSource) {
32
34
  const { currentValue, previousValue } = change;
33
35
  const isChange = JSON.stringify(currentValue) !== JSON.stringify(previousValue);
34
36
  if (isChange)
@@ -81,6 +83,7 @@ class SelectBoxComponent {
81
83
  get value() { return this._value; }
82
84
  _value = '';
83
85
  dataSource;
86
+ customDataSource;
84
87
  dropdownWidth;
85
88
  maxLength = 0;
86
89
  disabled = false;
@@ -150,11 +153,11 @@ class SelectBoxComponent {
150
153
  });
151
154
  }
152
155
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: SelectBoxComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: SELECTBOX_DATA_PROVIDER }], target: i0.ɵɵFactoryTarget.Component });
153
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.5", type: SelectBoxComponent, isStandalone: false, selector: "cnx-select-box", inputs: { id: "id", name: "name", width: "width", placeholder: "placeholder", displayExpr: "displayExpr", valueExpr: "valueExpr", searchExpr: "searchExpr", dropdownExpr: "dropdownExpr", searchEnabled: "searchEnabled", searchTimeout: "searchTimeout", showClearButton: "showClearButton", value: "value", dropdownWidth: "dropdownWidth", maxLength: "maxLength", disabled: "disabled", cascadeBy: "cascadeBy", selectBoxKey: "selectBoxKey", ignoreValue: "ignoreValue" }, outputs: { eventValueChanged: "onValueChanged", eventEnterKey: "onEnterKey" }, viewQueries: [{ propertyName: "selectBox", first: true, predicate: ["selectBox"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<dx-select-box\r\n #selectBox\r\n [id]=\"'cnx_select_box_' + id\"\r\n [name]=\"'cnx_select_box_' + name\"\r\n [width]=\"width\"\r\n [placeholder]=\"placeholder\"\r\n [displayExpr]=\"displayExpr\"\r\n [valueExpr]=\"valueExpr\"\r\n [deferRendering]=\"true\"\r\n [searchExpr]=\"searchExpr\"\r\n [searchEnabled]=\"searchEnabled\"\r\n [searchTimeout]=\"searchTimeout\"\r\n [showClearButton]=\"showClearButton\"\r\n [value]=\"value\"\r\n [dataSource]=\"dataSource\"\r\n itemTemplate=\"itemTemplate\"\r\n [dropDownOptions]=\"{ minWidth: '100%', width: dropdownWidth }\"\r\n [maxLength]=\"maxLength\"\r\n [disabled]=\"disabled\"\r\n (onValueChanged)=\"onValueChanged($event)\"\r\n (onEnterKey)=\"onEnterKey()\"\r\n>\r\n <div *dxTemplate=\"let data of 'itemTemplate'\">\r\n <div>\r\n <span\r\n [title]=\"data[dropdownExpr]\"\r\n [innerText]=\"data[dropdownExpr]\"\r\n ></span>\r\n </div>\r\n </div>\r\n</dx-select-box>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: i1.DxSelectBoxComponent, selector: "dx-select-box", inputs: ["acceptCustomValue", "accessKey", "activeStateEnabled", "buttons", "customItemCreateEvent", "dataSource", "deferRendering", "disabled", "displayExpr", "displayValue", "dropDownButtonTemplate", "dropDownOptions", "elementAttr", "fieldTemplate", "focusStateEnabled", "grouped", "groupTemplate", "height", "hint", "hoverStateEnabled", "inputAttr", "isDirty", "isValid", "items", "itemTemplate", "label", "labelMode", "maxLength", "minSearchLength", "name", "noDataText", "opened", "openOnFieldClick", "placeholder", "readOnly", "rtlEnabled", "searchEnabled", "searchExpr", "searchMode", "searchTimeout", "selectedItem", "showClearButton", "showDataBeforeSearch", "showDropDownButton", "showSelectionControls", "spellcheck", "stylingMode", "tabIndex", "text", "useItemTextAsTitle", "validationError", "validationErrors", "validationMessageMode", "validationMessagePosition", "validationStatus", "value", "valueChangeEvent", "valueExpr", "visible", "width", "wrapItemText"], outputs: ["onChange", "onClosed", "onContentReady", "onCopy", "onCustomItemCreating", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onItemClick", "onKeyDown", "onKeyUp", "onOpened", "onOptionChanged", "onPaste", "onSelectionChanged", "onValueChanged", "acceptCustomValueChange", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "customItemCreateEventChange", "dataSourceChange", "deferRenderingChange", "disabledChange", "displayExprChange", "displayValueChange", "dropDownButtonTemplateChange", "dropDownOptionsChange", "elementAttrChange", "fieldTemplateChange", "focusStateEnabledChange", "groupedChange", "groupTemplateChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isDirtyChange", "isValidChange", "itemsChange", "itemTemplateChange", "labelChange", "labelModeChange", "maxLengthChange", "minSearchLengthChange", "nameChange", "noDataTextChange", "openedChange", "openOnFieldClickChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "searchEnabledChange", "searchExprChange", "searchModeChange", "searchTimeoutChange", "selectedItemChange", "showClearButtonChange", "showDataBeforeSearchChange", "showDropDownButtonChange", "showSelectionControlsChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useItemTextAsTitleChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationMessagePositionChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "valueExprChange", "visibleChange", "widthChange", "wrapItemTextChange", "onBlur"] }, { kind: "directive", type: i2.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }] });
156
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.5", type: SelectBoxComponent, isStandalone: false, selector: "cnx-select-box", inputs: { id: "id", name: "name", width: "width", placeholder: "placeholder", displayExpr: "displayExpr", valueExpr: "valueExpr", searchExpr: "searchExpr", dropdownExpr: "dropdownExpr", searchEnabled: "searchEnabled", searchTimeout: "searchTimeout", showClearButton: "showClearButton", value: "value", customDataSource: "customDataSource", dropdownWidth: "dropdownWidth", maxLength: "maxLength", disabled: "disabled", cascadeBy: "cascadeBy", selectBoxKey: "selectBoxKey", ignoreValue: "ignoreValue" }, outputs: { eventValueChanged: "onValueChanged", eventEnterKey: "onEnterKey" }, viewQueries: [{ propertyName: "selectBox", first: true, predicate: ["selectBox"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<dx-select-box\r\n #selectBox\r\n [id]=\"'cnx_select_box_' + id\"\r\n [name]=\"'cnx_select_box_' + name\"\r\n [width]=\"width\"\r\n [placeholder]=\"placeholder\"\r\n [displayExpr]=\"displayExpr\"\r\n [valueExpr]=\"valueExpr\"\r\n [deferRendering]=\"true\"\r\n [searchExpr]=\"searchExpr\"\r\n [searchEnabled]=\"searchEnabled\"\r\n [searchTimeout]=\"searchTimeout\"\r\n [showClearButton]=\"showClearButton\"\r\n [value]=\"value\"\r\n [dataSource]=\"customDataSource || dataSource\"\r\n itemTemplate=\"itemTemplate\"\r\n [dropDownOptions]=\"{ minWidth: '100%', width: dropdownWidth }\"\r\n [maxLength]=\"maxLength\"\r\n [disabled]=\"disabled\"\r\n (onValueChanged)=\"onValueChanged($event)\"\r\n (onEnterKey)=\"onEnterKey()\"\r\n>\r\n <div *dxTemplate=\"let data of 'itemTemplate'\">\r\n <div>\r\n <span\r\n [title]=\"data[dropdownExpr]\"\r\n [innerText]=\"data[dropdownExpr]\"\r\n ></span>\r\n </div>\r\n </div>\r\n</dx-select-box>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: i1.DxSelectBoxComponent, selector: "dx-select-box", inputs: ["acceptCustomValue", "accessKey", "activeStateEnabled", "buttons", "customItemCreateEvent", "dataSource", "deferRendering", "disabled", "displayExpr", "displayValue", "dropDownButtonTemplate", "dropDownOptions", "elementAttr", "fieldTemplate", "focusStateEnabled", "grouped", "groupTemplate", "height", "hint", "hoverStateEnabled", "inputAttr", "isDirty", "isValid", "items", "itemTemplate", "label", "labelMode", "maxLength", "minSearchLength", "name", "noDataText", "opened", "openOnFieldClick", "placeholder", "readOnly", "rtlEnabled", "searchEnabled", "searchExpr", "searchMode", "searchTimeout", "selectedItem", "showClearButton", "showDataBeforeSearch", "showDropDownButton", "showSelectionControls", "spellcheck", "stylingMode", "tabIndex", "text", "useItemTextAsTitle", "validationError", "validationErrors", "validationMessageMode", "validationMessagePosition", "validationStatus", "value", "valueChangeEvent", "valueExpr", "visible", "width", "wrapItemText"], outputs: ["onChange", "onClosed", "onContentReady", "onCopy", "onCustomItemCreating", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onItemClick", "onKeyDown", "onKeyUp", "onOpened", "onOptionChanged", "onPaste", "onSelectionChanged", "onValueChanged", "acceptCustomValueChange", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "customItemCreateEventChange", "dataSourceChange", "deferRenderingChange", "disabledChange", "displayExprChange", "displayValueChange", "dropDownButtonTemplateChange", "dropDownOptionsChange", "elementAttrChange", "fieldTemplateChange", "focusStateEnabledChange", "groupedChange", "groupTemplateChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isDirtyChange", "isValidChange", "itemsChange", "itemTemplateChange", "labelChange", "labelModeChange", "maxLengthChange", "minSearchLengthChange", "nameChange", "noDataTextChange", "openedChange", "openOnFieldClickChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "searchEnabledChange", "searchExprChange", "searchModeChange", "searchTimeoutChange", "selectedItemChange", "showClearButtonChange", "showDataBeforeSearchChange", "showDropDownButtonChange", "showSelectionControlsChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useItemTextAsTitleChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationMessagePositionChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "valueExprChange", "visibleChange", "widthChange", "wrapItemTextChange", "onBlur"] }, { kind: "directive", type: i2.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }] });
154
157
  }
155
158
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: SelectBoxComponent, decorators: [{
156
159
  type: Component,
157
- args: [{ selector: 'cnx-select-box', standalone: false, template: "<dx-select-box\r\n #selectBox\r\n [id]=\"'cnx_select_box_' + id\"\r\n [name]=\"'cnx_select_box_' + name\"\r\n [width]=\"width\"\r\n [placeholder]=\"placeholder\"\r\n [displayExpr]=\"displayExpr\"\r\n [valueExpr]=\"valueExpr\"\r\n [deferRendering]=\"true\"\r\n [searchExpr]=\"searchExpr\"\r\n [searchEnabled]=\"searchEnabled\"\r\n [searchTimeout]=\"searchTimeout\"\r\n [showClearButton]=\"showClearButton\"\r\n [value]=\"value\"\r\n [dataSource]=\"dataSource\"\r\n itemTemplate=\"itemTemplate\"\r\n [dropDownOptions]=\"{ minWidth: '100%', width: dropdownWidth }\"\r\n [maxLength]=\"maxLength\"\r\n [disabled]=\"disabled\"\r\n (onValueChanged)=\"onValueChanged($event)\"\r\n (onEnterKey)=\"onEnterKey()\"\r\n>\r\n <div *dxTemplate=\"let data of 'itemTemplate'\">\r\n <div>\r\n <span\r\n [title]=\"data[dropdownExpr]\"\r\n [innerText]=\"data[dropdownExpr]\"\r\n ></span>\r\n </div>\r\n </div>\r\n</dx-select-box>\r\n", styles: [":host{display:block}\n"] }]
160
+ args: [{ selector: 'cnx-select-box', standalone: false, template: "<dx-select-box\r\n #selectBox\r\n [id]=\"'cnx_select_box_' + id\"\r\n [name]=\"'cnx_select_box_' + name\"\r\n [width]=\"width\"\r\n [placeholder]=\"placeholder\"\r\n [displayExpr]=\"displayExpr\"\r\n [valueExpr]=\"valueExpr\"\r\n [deferRendering]=\"true\"\r\n [searchExpr]=\"searchExpr\"\r\n [searchEnabled]=\"searchEnabled\"\r\n [searchTimeout]=\"searchTimeout\"\r\n [showClearButton]=\"showClearButton\"\r\n [value]=\"value\"\r\n [dataSource]=\"customDataSource || dataSource\"\r\n itemTemplate=\"itemTemplate\"\r\n [dropDownOptions]=\"{ minWidth: '100%', width: dropdownWidth }\"\r\n [maxLength]=\"maxLength\"\r\n [disabled]=\"disabled\"\r\n (onValueChanged)=\"onValueChanged($event)\"\r\n (onEnterKey)=\"onEnterKey()\"\r\n>\r\n <div *dxTemplate=\"let data of 'itemTemplate'\">\r\n <div>\r\n <span\r\n [title]=\"data[dropdownExpr]\"\r\n [innerText]=\"data[dropdownExpr]\"\r\n ></span>\r\n </div>\r\n </div>\r\n</dx-select-box>\r\n", styles: [":host{display:block}\n"] }]
158
161
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
159
162
  type: Inject,
160
163
  args: [SELECTBOX_DATA_PROVIDER]
@@ -197,6 +200,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
197
200
  }], value: [{
198
201
  type: Input,
199
202
  args: ['value']
203
+ }], customDataSource: [{
204
+ type: Input,
205
+ args: ['customDataSource']
200
206
  }], dropdownWidth: [{
201
207
  type: Input,
202
208
  args: ['dropdownWidth']
@@ -1 +1 @@
1
- {"version":3,"file":"cnx-dev-angular-devextreme.mjs","sources":["../../../../packages/angular-devextreme/src/lib/tokens/select-box.token.ts","../../../../packages/angular-devextreme/src/lib/components/select-box/select-box.component.ts","../../../../packages/angular-devextreme/src/lib/components/select-box/select-box.component.html","../../../../packages/angular-devextreme/src/lib/cnx-select-box.module.ts","../../../../packages/angular-devextreme/src/lib/models/select-box.model.ts","../../../../packages/angular-devextreme/src/index.ts","../../../../packages/angular-devextreme/src/cnx-dev-angular-devextreme.ts"],"sourcesContent":["import { InjectionToken } from '@angular/core';\r\nimport { SelectBoxDataProvider } from '../interfaces/select-box.interface';\r\n\r\n/**\r\n * Injection Token สำหรับ SelectBoxDataProvider\r\n * Consumer App จะต้อง provide token นี้ผ่าน CnxSelectBoxModule.forRoot()\r\n *\r\n * @example\r\n * // ใน AppModule\r\n * CnxSelectBoxModule.forRoot(AppSelectBoxService)\r\n */\r\nexport const SELECTBOX_DATA_PROVIDER = new InjectionToken<SelectBoxDataProvider>(\r\n 'SELECTBOX_DATA_PROVIDER'\r\n);\r\n","import {\r\n ChangeDetectorRef,\r\n Component,\r\n EventEmitter,\r\n Inject,\r\n Input,\r\n OnChanges,\r\n OnInit,\r\n Output,\r\n SimpleChanges,\r\n ViewChild,\r\n} from '@angular/core';\r\nimport { ValueChangedEvent } from 'devextreme/ui/select_box';\r\nimport DataSource from 'devextreme/data/data_source';\r\nimport { LoadOptions } from 'devextreme/data';\r\nimport { DxSelectBoxComponent, DxSelectBoxModule, DxTemplateModule } from 'devextreme-angular';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SelectBoxDataProvider } from '../../interfaces/select-box.interface';\r\nimport { SELECTBOX_DATA_PROVIDER } from '../../tokens/select-box.token';\r\nimport { SelectBoxKey, SelectBoxLoadResult, SelectBoxParam } from '../../models/select-box.model';\r\n\r\n@Component({\r\n selector: 'cnx-select-box',\r\n templateUrl: './select-box.component.html',\r\n styleUrl: './select-box.component.css',\r\n standalone: false,\r\n})\r\nexport class SelectBoxComponent implements OnInit, OnChanges {\r\n constructor(\r\n private cdr: ChangeDetectorRef,\r\n @Inject(SELECTBOX_DATA_PROVIDER) private service: SelectBoxDataProvider\r\n ) {}\r\n\r\n public ngOnInit(): void {\r\n this.setupDataSource();\r\n }\r\n\r\n public ngOnChanges(changes: SimpleChanges): void {\r\n const change = changes['cascadeBy'];\r\n if (!!change && !change.firstChange) {\r\n const { currentValue, previousValue } = change;\r\n const isChange = JSON.stringify(currentValue) !== JSON.stringify(previousValue);\r\n if (isChange) this.setupDataSource();\r\n }\r\n }\r\n\r\n @ViewChild('selectBox')\r\n public selectBox!: DxSelectBoxComponent;\r\n\r\n @Input('id') public id: string = '';\r\n @Input('name') public name: string = '';\r\n @Input('width') public width: string | number = '100%';\r\n @Input('placeholder') public placeholder: string = 'Please select...';\r\n\r\n @Input('displayExpr')\r\n set displayExpr(val: string | null) {\r\n const _val = val?.toString() || '';\r\n if (_val && _val !== this._displayExpr) this._displayExpr = _val;\r\n }\r\n get displayExpr(): string { return this._displayExpr; }\r\n private _displayExpr: string = 'text';\r\n\r\n @Input('valueExpr')\r\n set valueExpr(val: string | null) {\r\n const _val = val?.toString() || '';\r\n if (_val && _val !== this._valueExpr) this._valueExpr = _val;\r\n }\r\n get valueExpr(): string { return this._valueExpr; }\r\n private _valueExpr: string = 'value';\r\n\r\n @Input('searchExpr')\r\n set searchExpr(val: string | null) {\r\n const _val = val?.toString() || '';\r\n if (_val && _val !== this._searchExpr) this._searchExpr = _val;\r\n }\r\n get searchExpr(): string { return this._searchExpr; }\r\n private _searchExpr: string = 'dropdownText';\r\n\r\n @Input('dropdownExpr')\r\n set dropdownExpr(val: string | null) {\r\n const _val = val?.toString() || '';\r\n if (_val && _val !== this._dropdownExpr) {\r\n this._dropdownExpr = _val;\r\n this._searchExpr = _val;\r\n }\r\n }\r\n get dropdownExpr(): string { return this._dropdownExpr; }\r\n private _dropdownExpr: string = 'dropdownText';\r\n\r\n @Input('searchEnabled') public searchEnabled: boolean = true;\r\n @Input('searchTimeout') public searchTimeout: number = 500;\r\n @Input('showClearButton') public showClearButton: boolean = true;\r\n\r\n @Input('value')\r\n set value(val: string | number | null) {\r\n const _val = val?.toString() ?? '';\r\n if (_val !== this._value) this._value = _val;\r\n }\r\n get value(): string { return this._value; }\r\n private _value: string = '';\r\n\r\n public dataSource!: DataSource;\r\n\r\n @Input('dropdownWidth') public dropdownWidth!: string | number;\r\n @Input('maxLength') public maxLength: number = 0;\r\n @Input('disabled') public disabled: boolean = false;\r\n @Input('cascadeBy') public cascadeBy: any;\r\n @Input('selectBoxKey') public selectBoxKey: SelectBoxKey = null;\r\n @Input('ignoreValue') public ignoreValue!: string[];\r\n\r\n @Output('onValueChanged') public eventValueChanged = new EventEmitter<any>();\r\n @Output('onEnterKey') public eventEnterKey = new EventEmitter<void>();\r\n\r\n private paginate: boolean = true;\r\n private pageSize: number = 50;\r\n private clearValueOnCascade: boolean = false;\r\n public hasInitialValue: boolean = false;\r\n\r\n public onValueChanged($event: ValueChangedEvent): void {\r\n setTimeout(() => this.eventValueChanged.emit($event));\r\n this.cdr.detectChanges();\r\n }\r\n\r\n public onEnterKey(): void {\r\n this.eventEnterKey.emit();\r\n }\r\n\r\n private setupDataSource(): void {\r\n this.dataSource = new DataSource({\r\n load: (loadOptions) => this.setupDataSourceOnLoad(loadOptions),\r\n byKey: (key) => this.setupDataSourceByKey(key),\r\n paginate: this.paginate,\r\n pageSize: this.pageSize,\r\n requireTotalCount: true,\r\n });\r\n\r\n if (this.clearValueOnCascade && !!this.value && this.selectBox) {\r\n this.selectBox.value = '';\r\n }\r\n\r\n this.cdr.detectChanges();\r\n }\r\n\r\n private setupDataSourceOnLoad(loadOptions: LoadOptions): Promise<SelectBoxLoadResult> {\r\n return new Promise((resolve) => {\r\n if ((loadOptions?.take ?? 0) === 0) {\r\n resolve({ data: [], totalCount: 0 });\r\n return;\r\n }\r\n\r\n this.service\r\n .getService(this.selectBoxKey, {\r\n key: this.value,\r\n cascadeBy: this.cascadeBy,\r\n loadOptions: { ...loadOptions } as LoadOptions,\r\n } as SelectBoxParam)\r\n .subscribe((result) => {\r\n if (this.ignoreValue?.length) {\r\n result.data = result.data.filter((f) => !this.ignoreValue.includes(f.value));\r\n }\r\n this.hasInitialValue = result.hasInitialValue ?? false;\r\n resolve(result);\r\n });\r\n });\r\n }\r\n\r\n private setupDataSourceByKey(key: any): Promise<any> {\r\n return new Promise((resolve) => {\r\n if (!key) {\r\n resolve([]);\r\n return;\r\n }\r\n\r\n this.service\r\n .getService(this.selectBoxKey, {\r\n isByKey: true,\r\n key,\r\n cascadeBy: this.cascadeBy,\r\n } as SelectBoxParam)\r\n .subscribe((result) => resolve(result.data));\r\n });\r\n }\r\n}\r\n","<dx-select-box\r\n #selectBox\r\n [id]=\"'cnx_select_box_' + id\"\r\n [name]=\"'cnx_select_box_' + name\"\r\n [width]=\"width\"\r\n [placeholder]=\"placeholder\"\r\n [displayExpr]=\"displayExpr\"\r\n [valueExpr]=\"valueExpr\"\r\n [deferRendering]=\"true\"\r\n [searchExpr]=\"searchExpr\"\r\n [searchEnabled]=\"searchEnabled\"\r\n [searchTimeout]=\"searchTimeout\"\r\n [showClearButton]=\"showClearButton\"\r\n [value]=\"value\"\r\n [dataSource]=\"dataSource\"\r\n itemTemplate=\"itemTemplate\"\r\n [dropDownOptions]=\"{ minWidth: '100%', width: dropdownWidth }\"\r\n [maxLength]=\"maxLength\"\r\n [disabled]=\"disabled\"\r\n (onValueChanged)=\"onValueChanged($event)\"\r\n (onEnterKey)=\"onEnterKey()\"\r\n>\r\n <div *dxTemplate=\"let data of 'itemTemplate'\">\r\n <div>\r\n <span\r\n [title]=\"data[dropdownExpr]\"\r\n [innerText]=\"data[dropdownExpr]\"\r\n ></span>\r\n </div>\r\n </div>\r\n</dx-select-box>\r\n","import { CommonModule } from '@angular/common';\r\nimport { ModuleWithProviders, NgModule, Type } from '@angular/core';\r\nimport { DxSelectBoxModule, DxTemplateModule } from 'devextreme-angular';\r\nimport { SelectBoxComponent } from './components/select-box/select-box.component';\r\nimport { SelectBoxDataProvider } from './interfaces/select-box.interface';\r\nimport { SELECTBOX_DATA_PROVIDER } from './tokens/select-box.token';\r\n\r\n/**\r\n * Module สำหรับ SelectBox Component\r\n *\r\n * Consumer App ต้อง import module นี้เพื่อใช้งาน:\r\n * @example\r\n * imports: [\r\n * CnxSelectBoxModule.forRoot(AppSelectBoxService),\r\n * ]\r\n */\r\n@NgModule({\r\n declarations: [SelectBoxComponent],\r\n imports: [CommonModule, DxSelectBoxModule, DxTemplateModule],\r\n exports: [SelectBoxComponent, DxSelectBoxModule, DxTemplateModule],\r\n})\r\nexport class CnxSelectBoxModule {\r\n static forRoot(\r\n providerClass: Type<SelectBoxDataProvider>\r\n ): ModuleWithProviders<CnxSelectBoxModule> {\r\n return {\r\n ngModule: CnxSelectBoxModule,\r\n providers: [\r\n {\r\n provide: SELECTBOX_DATA_PROVIDER,\r\n useClass: providerClass,\r\n },\r\n ],\r\n };\r\n }\r\n}\r\n","import { LoadOptions } from 'devextreme/data';\r\n\r\nexport type SelectBoxKey =\r\n | 'cardType'\r\n | 'pages'\r\n | 'bank'\r\n | 'encoding'\r\n | 'department'\r\n | 'division'\r\n | 'fileType'\r\n | 'valueType'\r\n | 'applicationFormField'\r\n | 'currency'\r\n | 'paymentMethod'\r\n | 'paymentTerm'\r\n | 'transferMode'\r\n | 'bankAccount'\r\n | 'approveType'\r\n | 'user'\r\n | 'jobGrade'\r\n | 'roles'\r\n | 'creditType'\r\n | 'month'\r\n | 'year'\r\n | 'biborType'\r\n | 'interestPeriod'\r\n | 'accountNo'\r\n | 'statementType'\r\n | 'reconcileType'\r\n | 'fxRequestReason'\r\n | 'chequeType'\r\n | 'paymentType'\r\n | 'vendor'\r\n | 'unit'\r\n | 'period'\r\n | 'quarter'\r\n | 'loanName'\r\n | 'interestType'\r\n | 'paymentTypeGroup'\r\n | 'vendorAccount'\r\n | 'interestTypeOption'\r\n | string\r\n | null;\r\n\r\nexport class SelectBoxParam {\r\n key?: any;\r\n cascadeBy?: any;\r\n isByKey?: boolean;\r\n loadOptions?: LoadOptions;\r\n}\r\n\r\nexport class SelectBoxViewModel {\r\n text: string;\r\n value: any;\r\n dropdownText: string;\r\n}\r\n\r\nexport class SelectBoxLoadResult {\r\n data: SelectBoxViewModel[] = [];\r\n totalCount: number = 0;\r\n hasInitialValue?: boolean;\r\n}\r\n","// Module\nexport * from './lib/cnx-select-box.module';\n\n// Components\nexport * from './lib/components/select-box/select-box.component';\n\n// Interfaces\nexport * from './lib/interfaces/select-box.interface';\n\n// Models\nexport * from './lib/models/select-box.model';\n\n// Tokens\nexport * from './lib/tokens/select-box.token';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"cnx-dev-angular-devextreme.mjs","sources":["../../../../packages/angular-devextreme/src/lib/tokens/select-box.token.ts","../../../../packages/angular-devextreme/src/lib/components/select-box/select-box.component.ts","../../../../packages/angular-devextreme/src/lib/components/select-box/select-box.component.html","../../../../packages/angular-devextreme/src/lib/cnx-select-box.module.ts","../../../../packages/angular-devextreme/src/lib/models/select-box.model.ts","../../../../packages/angular-devextreme/src/index.ts","../../../../packages/angular-devextreme/src/cnx-dev-angular-devextreme.ts"],"sourcesContent":["import { InjectionToken } from '@angular/core';\r\nimport { SelectBoxDataProvider } from '../interfaces/select-box.interface';\r\n\r\n/**\r\n * Injection Token สำหรับ SelectBoxDataProvider\r\n * Consumer App จะต้อง provide token นี้ผ่าน CnxSelectBoxModule.forRoot()\r\n *\r\n * @example\r\n * // ใน AppModule\r\n * CnxSelectBoxModule.forRoot(AppSelectBoxService)\r\n */\r\nexport const SELECTBOX_DATA_PROVIDER = new InjectionToken<SelectBoxDataProvider>(\r\n 'SELECTBOX_DATA_PROVIDER'\r\n);\r\n","import {\r\n ChangeDetectorRef,\r\n Component,\r\n EventEmitter,\r\n Inject,\r\n Input,\r\n OnChanges,\r\n OnInit,\r\n Output,\r\n SimpleChanges,\r\n ViewChild,\r\n} from '@angular/core';\r\nimport { ValueChangedEvent } from 'devextreme/ui/select_box';\r\nimport DataSource from 'devextreme/data/data_source';\r\nimport { LoadOptions } from 'devextreme/data';\r\nimport { DxSelectBoxComponent, DxSelectBoxModule, DxTemplateModule } from 'devextreme-angular';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SelectBoxDataProvider } from '../../interfaces/select-box.interface';\r\nimport { SELECTBOX_DATA_PROVIDER } from '../../tokens/select-box.token';\r\nimport { SelectBoxKey, SelectBoxLoadResult, SelectBoxParam } from '../../models/select-box.model';\r\n\r\n@Component({\r\n selector: 'cnx-select-box',\r\n templateUrl: './select-box.component.html',\r\n styleUrl: './select-box.component.css',\r\n standalone: false,\r\n})\r\nexport class SelectBoxComponent implements OnInit, OnChanges {\r\n constructor(\r\n private cdr: ChangeDetectorRef,\r\n @Inject(SELECTBOX_DATA_PROVIDER) private service: SelectBoxDataProvider\r\n ) {}\r\n\r\n public ngOnInit(): void {\r\n if (!this.customDataSource) {\r\n this.setupDataSource();\r\n }\r\n }\r\n\r\n public ngOnChanges(changes: SimpleChanges): void {\r\n const change = changes['cascadeBy'];\r\n if (!!change && !change.firstChange && !this.customDataSource) {\r\n const { currentValue, previousValue } = change;\r\n const isChange = JSON.stringify(currentValue) !== JSON.stringify(previousValue);\r\n if (isChange) this.setupDataSource();\r\n }\r\n }\r\n\r\n @ViewChild('selectBox')\r\n public selectBox!: DxSelectBoxComponent;\r\n\r\n @Input('id') public id: string = '';\r\n @Input('name') public name: string = '';\r\n @Input('width') public width: string | number = '100%';\r\n @Input('placeholder') public placeholder: string = 'Please select...';\r\n\r\n @Input('displayExpr')\r\n set displayExpr(val: string | null) {\r\n const _val = val?.toString() || '';\r\n if (_val && _val !== this._displayExpr) this._displayExpr = _val;\r\n }\r\n get displayExpr(): string { return this._displayExpr; }\r\n private _displayExpr: string = 'text';\r\n\r\n @Input('valueExpr')\r\n set valueExpr(val: string | null) {\r\n const _val = val?.toString() || '';\r\n if (_val && _val !== this._valueExpr) this._valueExpr = _val;\r\n }\r\n get valueExpr(): string { return this._valueExpr; }\r\n private _valueExpr: string = 'value';\r\n\r\n @Input('searchExpr')\r\n set searchExpr(val: string | null) {\r\n const _val = val?.toString() || '';\r\n if (_val && _val !== this._searchExpr) this._searchExpr = _val;\r\n }\r\n get searchExpr(): string { return this._searchExpr; }\r\n private _searchExpr: string = 'dropdownText';\r\n\r\n @Input('dropdownExpr')\r\n set dropdownExpr(val: string | null) {\r\n const _val = val?.toString() || '';\r\n if (_val && _val !== this._dropdownExpr) {\r\n this._dropdownExpr = _val;\r\n this._searchExpr = _val;\r\n }\r\n }\r\n get dropdownExpr(): string { return this._dropdownExpr; }\r\n private _dropdownExpr: string = 'dropdownText';\r\n\r\n @Input('searchEnabled') public searchEnabled: boolean = true;\r\n @Input('searchTimeout') public searchTimeout: number = 500;\r\n @Input('showClearButton') public showClearButton: boolean = true;\r\n\r\n @Input('value')\r\n set value(val: string | number | null) {\r\n const _val = val?.toString() ?? '';\r\n if (_val !== this._value) this._value = _val;\r\n }\r\n get value(): string { return this._value; }\r\n private _value: string = '';\r\n\r\n public dataSource!: DataSource;\r\n @Input('customDataSource') public customDataSource?: any;\r\n\r\n @Input('dropdownWidth') public dropdownWidth!: string | number;\r\n @Input('maxLength') public maxLength: number = 0;\r\n @Input('disabled') public disabled: boolean = false;\r\n @Input('cascadeBy') public cascadeBy: any;\r\n @Input('selectBoxKey') public selectBoxKey: SelectBoxKey = null;\r\n @Input('ignoreValue') public ignoreValue!: string[];\r\n\r\n @Output('onValueChanged') public eventValueChanged = new EventEmitter<any>();\r\n @Output('onEnterKey') public eventEnterKey = new EventEmitter<void>();\r\n\r\n private paginate: boolean = true;\r\n private pageSize: number = 50;\r\n private clearValueOnCascade: boolean = false;\r\n public hasInitialValue: boolean = false;\r\n\r\n public onValueChanged($event: ValueChangedEvent): void {\r\n setTimeout(() => this.eventValueChanged.emit($event));\r\n this.cdr.detectChanges();\r\n }\r\n\r\n public onEnterKey(): void {\r\n this.eventEnterKey.emit();\r\n }\r\n\r\n private setupDataSource(): void {\r\n this.dataSource = new DataSource({\r\n load: (loadOptions) => this.setupDataSourceOnLoad(loadOptions),\r\n byKey: (key) => this.setupDataSourceByKey(key),\r\n paginate: this.paginate,\r\n pageSize: this.pageSize,\r\n requireTotalCount: true,\r\n });\r\n\r\n if (this.clearValueOnCascade && !!this.value && this.selectBox) {\r\n this.selectBox.value = '';\r\n }\r\n\r\n this.cdr.detectChanges();\r\n }\r\n\r\n private setupDataSourceOnLoad(loadOptions: LoadOptions): Promise<SelectBoxLoadResult> {\r\n return new Promise((resolve) => {\r\n if ((loadOptions?.take ?? 0) === 0) {\r\n resolve({ data: [], totalCount: 0 });\r\n return;\r\n }\r\n\r\n this.service\r\n .getService(this.selectBoxKey, {\r\n key: this.value,\r\n cascadeBy: this.cascadeBy,\r\n loadOptions: { ...loadOptions } as LoadOptions,\r\n } as SelectBoxParam)\r\n .subscribe((result) => {\r\n if (this.ignoreValue?.length) {\r\n result.data = result.data.filter((f) => !this.ignoreValue.includes(f.value));\r\n }\r\n this.hasInitialValue = result.hasInitialValue ?? false;\r\n resolve(result);\r\n });\r\n });\r\n }\r\n\r\n private setupDataSourceByKey(key: any): Promise<any> {\r\n return new Promise((resolve) => {\r\n if (!key) {\r\n resolve([]);\r\n return;\r\n }\r\n\r\n this.service\r\n .getService(this.selectBoxKey, {\r\n isByKey: true,\r\n key,\r\n cascadeBy: this.cascadeBy,\r\n } as SelectBoxParam)\r\n .subscribe((result) => resolve(result.data));\r\n });\r\n }\r\n}\r\n","<dx-select-box\r\n #selectBox\r\n [id]=\"'cnx_select_box_' + id\"\r\n [name]=\"'cnx_select_box_' + name\"\r\n [width]=\"width\"\r\n [placeholder]=\"placeholder\"\r\n [displayExpr]=\"displayExpr\"\r\n [valueExpr]=\"valueExpr\"\r\n [deferRendering]=\"true\"\r\n [searchExpr]=\"searchExpr\"\r\n [searchEnabled]=\"searchEnabled\"\r\n [searchTimeout]=\"searchTimeout\"\r\n [showClearButton]=\"showClearButton\"\r\n [value]=\"value\"\r\n [dataSource]=\"customDataSource || dataSource\"\r\n itemTemplate=\"itemTemplate\"\r\n [dropDownOptions]=\"{ minWidth: '100%', width: dropdownWidth }\"\r\n [maxLength]=\"maxLength\"\r\n [disabled]=\"disabled\"\r\n (onValueChanged)=\"onValueChanged($event)\"\r\n (onEnterKey)=\"onEnterKey()\"\r\n>\r\n <div *dxTemplate=\"let data of 'itemTemplate'\">\r\n <div>\r\n <span\r\n [title]=\"data[dropdownExpr]\"\r\n [innerText]=\"data[dropdownExpr]\"\r\n ></span>\r\n </div>\r\n </div>\r\n</dx-select-box>\r\n","import { CommonModule } from '@angular/common';\r\nimport { ModuleWithProviders, NgModule, Type } from '@angular/core';\r\nimport { DxSelectBoxModule, DxTemplateModule } from 'devextreme-angular';\r\nimport { SelectBoxComponent } from './components/select-box/select-box.component';\r\nimport { SelectBoxDataProvider } from './interfaces/select-box.interface';\r\nimport { SELECTBOX_DATA_PROVIDER } from './tokens/select-box.token';\r\n\r\n/**\r\n * Module สำหรับ SelectBox Component\r\n *\r\n * Consumer App ต้อง import module นี้เพื่อใช้งาน:\r\n * @example\r\n * imports: [\r\n * CnxSelectBoxModule.forRoot(AppSelectBoxService),\r\n * ]\r\n */\r\n@NgModule({\r\n declarations: [SelectBoxComponent],\r\n imports: [CommonModule, DxSelectBoxModule, DxTemplateModule],\r\n exports: [SelectBoxComponent, DxSelectBoxModule, DxTemplateModule],\r\n})\r\nexport class CnxSelectBoxModule {\r\n static forRoot(\r\n providerClass: Type<SelectBoxDataProvider>\r\n ): ModuleWithProviders<CnxSelectBoxModule> {\r\n return {\r\n ngModule: CnxSelectBoxModule,\r\n providers: [\r\n {\r\n provide: SELECTBOX_DATA_PROVIDER,\r\n useClass: providerClass,\r\n },\r\n ],\r\n };\r\n }\r\n}\r\n","import { LoadOptions } from 'devextreme/data';\r\n\r\nexport interface ModuleSelectBoxKeys {}\r\n\r\nexport type SelectBoxKey = keyof ModuleSelectBoxKeys extends never\r\n ? string | null | undefined\r\n : keyof ModuleSelectBoxKeys | null | undefined;\r\n\r\nexport class SelectBoxParam {\r\n key?: any;\r\n cascadeBy?: any;\r\n isByKey?: boolean;\r\n loadOptions?: LoadOptions;\r\n}\r\n\r\nexport class SelectBoxViewModel {\r\n text: string;\r\n value: any;\r\n dropdownText: string;\r\n}\r\n\r\nexport class SelectBoxLoadResult {\r\n data: SelectBoxViewModel[] = [];\r\n totalCount: number = 0;\r\n hasInitialValue?: boolean;\r\n}\r\n","// Module\r\nexport * from './lib/cnx-select-box.module';\r\n\r\n// Components\r\nexport * from './lib/components/select-box/select-box.component';\r\n\r\n// Interfaces\r\nexport * from './lib/interfaces/select-box.interface';\r\n\r\n// Models\r\nexport * from './lib/models/select-box.model';\r\n\r\n// Tokens\r\nexport * from './lib/tokens/select-box.token';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,9 +1,15 @@
1
1
  {
2
2
  "name": "@cnx-dev/angular-devextreme",
3
- "version": "1.0.1",
3
+ "version": "1.0.3",
4
4
  "description": "CNX Dev - Angular DevExtreme UI Component Library",
5
5
  "author": "cnx-dev",
6
6
  "license": "UNLICENSED",
7
+ "repository": {
8
+ "type": "git",
9
+ "url": "https://github.com/cnx-dev/angular-devextreme"
10
+ },
11
+ "homepage": "https://github.com/cnx-dev/angular-devextreme#readme",
12
+ "readme": "README.md",
7
13
  "peerDependencies": {
8
14
  "@angular/common": "^17.3.0",
9
15
  "@angular/core": "^17.3.0",
@@ -8,7 +8,9 @@ import * as i3 from 'devextreme-angular';
8
8
  import { DxSelectBoxComponent } from 'devextreme-angular';
9
9
  import * as i2 from '@angular/common';
10
10
 
11
- type SelectBoxKey = 'cardType' | 'pages' | 'bank' | 'encoding' | 'department' | 'division' | 'fileType' | 'valueType' | 'applicationFormField' | 'currency' | 'paymentMethod' | 'paymentTerm' | 'transferMode' | 'bankAccount' | 'approveType' | 'user' | 'jobGrade' | 'roles' | 'creditType' | 'month' | 'year' | 'biborType' | 'interestPeriod' | 'accountNo' | 'statementType' | 'reconcileType' | 'fxRequestReason' | 'chequeType' | 'paymentType' | 'vendor' | 'unit' | 'period' | 'quarter' | 'loanName' | 'interestType' | 'paymentTypeGroup' | 'vendorAccount' | 'interestTypeOption' | string | null;
11
+ interface ModuleSelectBoxKeys {
12
+ }
13
+ type SelectBoxKey = keyof ModuleSelectBoxKeys extends never ? string | null | undefined : keyof ModuleSelectBoxKeys | null | undefined;
12
14
  declare class SelectBoxParam {
13
15
  key?: any;
14
16
  cascadeBy?: any;
@@ -64,6 +66,7 @@ declare class SelectBoxComponent implements OnInit, OnChanges {
64
66
  get value(): string;
65
67
  private _value;
66
68
  dataSource: DataSource;
69
+ customDataSource?: any;
67
70
  dropdownWidth: string | number;
68
71
  maxLength: number;
69
72
  disabled: boolean;
@@ -82,7 +85,7 @@ declare class SelectBoxComponent implements OnInit, OnChanges {
82
85
  private setupDataSourceOnLoad;
83
86
  private setupDataSourceByKey;
84
87
  static ɵfac: i0.ɵɵFactoryDeclaration<SelectBoxComponent, never>;
85
- static ɵcmp: i0.ɵɵComponentDeclaration<SelectBoxComponent, "cnx-select-box", never, { "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "width": { "alias": "width"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "displayExpr": { "alias": "displayExpr"; "required": false; }; "valueExpr": { "alias": "valueExpr"; "required": false; }; "searchExpr": { "alias": "searchExpr"; "required": false; }; "dropdownExpr": { "alias": "dropdownExpr"; "required": false; }; "searchEnabled": { "alias": "searchEnabled"; "required": false; }; "searchTimeout": { "alias": "searchTimeout"; "required": false; }; "showClearButton": { "alias": "showClearButton"; "required": false; }; "value": { "alias": "value"; "required": false; }; "dropdownWidth": { "alias": "dropdownWidth"; "required": false; }; "maxLength": { "alias": "maxLength"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "cascadeBy": { "alias": "cascadeBy"; "required": false; }; "selectBoxKey": { "alias": "selectBoxKey"; "required": false; }; "ignoreValue": { "alias": "ignoreValue"; "required": false; }; }, { "eventValueChanged": "onValueChanged"; "eventEnterKey": "onEnterKey"; }, never, never, false, never>;
88
+ static ɵcmp: i0.ɵɵComponentDeclaration<SelectBoxComponent, "cnx-select-box", never, { "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "width": { "alias": "width"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "displayExpr": { "alias": "displayExpr"; "required": false; }; "valueExpr": { "alias": "valueExpr"; "required": false; }; "searchExpr": { "alias": "searchExpr"; "required": false; }; "dropdownExpr": { "alias": "dropdownExpr"; "required": false; }; "searchEnabled": { "alias": "searchEnabled"; "required": false; }; "searchTimeout": { "alias": "searchTimeout"; "required": false; }; "showClearButton": { "alias": "showClearButton"; "required": false; }; "value": { "alias": "value"; "required": false; }; "customDataSource": { "alias": "customDataSource"; "required": false; }; "dropdownWidth": { "alias": "dropdownWidth"; "required": false; }; "maxLength": { "alias": "maxLength"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "cascadeBy": { "alias": "cascadeBy"; "required": false; }; "selectBoxKey": { "alias": "selectBoxKey"; "required": false; }; "ignoreValue": { "alias": "ignoreValue"; "required": false; }; }, { "eventValueChanged": "onValueChanged"; "eventEnterKey": "onEnterKey"; }, never, never, false, never>;
86
89
  }
87
90
 
88
91
  /**
@@ -112,5 +115,5 @@ declare class CnxSelectBoxModule {
112
115
  declare const SELECTBOX_DATA_PROVIDER: InjectionToken<SelectBoxDataProvider>;
113
116
 
114
117
  export { CnxSelectBoxModule, SELECTBOX_DATA_PROVIDER, SelectBoxComponent, SelectBoxLoadResult, SelectBoxParam, SelectBoxViewModel };
115
- export type { SelectBoxDataProvider, SelectBoxKey };
118
+ export type { ModuleSelectBoxKeys, SelectBoxDataProvider, SelectBoxKey };
116
119
  //# sourceMappingURL=cnx-dev-angular-devextreme.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"cnx-dev-angular-devextreme.d.ts","sources":["../../../../packages/angular-devextreme/src/lib/models/select-box.model.ts","../../../../packages/angular-devextreme/src/lib/interfaces/select-box.interface.ts","../../../../packages/angular-devextreme/src/lib/components/select-box/select-box.component.ts","../../../../packages/angular-devextreme/src/lib/cnx-select-box.module.ts","../../../../packages/angular-devextreme/src/lib/tokens/select-box.token.ts"],"sourcesContent":[null,null,null,null,null],"names":[],"mappings":";;;;;;;;;;;AA4CA,cAAA,cAAA;;;;;AAKC;AAED,cAAA,kBAAA;;;;AAIC;AAED,cAAA,mBAAA;;;;AAIC;;AC1DD;;;AAGG;;AAED,oBAAA,YAAA,SAAA,cAAA,GAAA,UAAA,CAAA,mBAAA;AACD;;ACYD,cAAA,kBAAA,YAAA,MAAA,EAAA,SAAA;AAQI;AACiC;AADzB,qBAAA,iBAAA,WAAA,qBAAA;AAIH;AAIA,yBAAA,aAAA;;;;AAcgB;;AAGvB;;;AAQA;;;AAQA;;;AAQA;;;;;;;;;;AAyB+B;;;;;;AAOE,uBAAA,YAAA;AACJ,mBAAA,YAAA;;;;;AAOtB,2BAAA,iBAAA;AAKA;AAIP;AAgBA;AAuBA;;;AAgBD;;AC/KD;;;;;;;;AAQG;AACH,cAAA,kBAAA;AAME,kCAAA,IAAA,CAAA,qBAAA,IAAA,mBAAA,CAAA,kBAAA;;;;AAaD;;AChCD;;;;;;;AAOG;AACH,cAAA,uBAAA,EAAA,cAAA,CAAA,qBAAA;;;;"}
1
+ {"version":3,"file":"cnx-dev-angular-devextreme.d.ts","sources":["../../../../packages/angular-devextreme/src/lib/models/select-box.model.ts","../../../../packages/angular-devextreme/src/lib/interfaces/select-box.interface.ts","../../../../packages/angular-devextreme/src/lib/components/select-box/select-box.component.ts","../../../../packages/angular-devextreme/src/lib/cnx-select-box.module.ts","../../../../packages/angular-devextreme/src/lib/tokens/select-box.token.ts"],"sourcesContent":[null,null,null,null,null],"names":[],"mappings":";;;;;;;;;;;AAEuC;AAEjC,KAAA,YAAA,SAAA,mBAAA,mDAAA,mBAAA;AAIN,cAAA,cAAA;;;;;AAKC;AAED,cAAA,kBAAA;;;;AAIC;AAED,cAAA,mBAAA;;;;AAIC;;ACtBD;;;AAGG;;AAED,oBAAA,YAAA,SAAA,cAAA,GAAA,UAAA,CAAA,mBAAA;AACD;;ACYD,cAAA,kBAAA,YAAA,MAAA,EAAA,SAAA;AAQI;AACiC;AADzB,qBAAA,iBAAA,WAAA,qBAAA;AAIH;AAMA,yBAAA,aAAA;;;;AAcgB;;AAGvB;;;AAQA;;;AAQA;;;AAQA;;;;;;;;;;;AA0B+B;;;;;;AAOE,uBAAA,YAAA;AACJ,mBAAA,YAAA;;;;;AAOtB,2BAAA,iBAAA;AAKA;AAIP;AAgBA;AAuBA;;;AAgBD;;AClLD;;;;;;;;AAQG;AACH,cAAA,kBAAA;AAME,kCAAA,IAAA,CAAA,qBAAA,IAAA,mBAAA,CAAA,kBAAA;;;;AAaD;;AChCD;;;;;;;AAOG;AACH,cAAA,uBAAA,EAAA,cAAA,CAAA,qBAAA;;;;"}