@cnx-dev/angular-devextreme 1.0.2 → 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.
|
|
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
|
@@ -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
|
-
|
|
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":";;;;;;;;;;;
|
|
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;;;;"}
|