@acorex/components 18.16.0-next.0 → 18.16.0-next.1
Sign up to get free protection for your applications and to get access to all the features.
- package/audio-wave/lib/audio-wave.component.d.ts +1 -0
- package/comment/lib/comment-container/comment-container.component.d.ts +1 -0
- package/common/lib/components/value-component.class.d.ts +1 -0
- package/common/lib/directives/auto-focus.directive.d.ts +1 -0
- package/common/lib/directives/inverted-color.directive.d.ts +1 -0
- package/common/lib/directives/ripple.directive.d.ts +1 -0
- package/conversation/lib/conversation-messages/conversation-message-voice/conversation-message-voice.component.d.ts +1 -0
- package/data-table/lib/columns/data-table-column-resizable.directive.d.ts +1 -0
- package/data-table/lib/data-table/data-table.component.d.ts +1 -0
- package/data-table/lib/infinite-scroll-data-table/infinite-scroll-data-table.component.d.ts +1 -0
- package/drawer/lib/drawer/drawer-item/drawer.component.d.ts +1 -0
- package/esm2022/audio-wave/lib/audio-wave.component.mjs +18 -14
- package/esm2022/button/lib/button-item-list.component.mjs +2 -2
- package/esm2022/calendar/lib/calendar.component.mjs +17 -14
- package/esm2022/comment/lib/comment-container/comment-container.component.mjs +18 -15
- package/esm2022/common/lib/components/value-component.class.mjs +5 -4
- package/esm2022/common/lib/directives/auto-focus.directive.mjs +8 -5
- package/esm2022/common/lib/directives/inverted-color.directive.mjs +23 -19
- package/esm2022/common/lib/directives/ripple.directive.mjs +18 -15
- package/esm2022/conversation/lib/conversation-messages/conversation-message-voice/conversation-message-voice.component.mjs +13 -9
- package/esm2022/data-pager/lib/data-pager-pagesize-dropdown.component.mjs +19 -5
- package/esm2022/data-pager/lib/data-pager.component.mjs +3 -3
- package/esm2022/data-table/lib/columns/data-table-column-resizable.directive.mjs +13 -13
- package/esm2022/data-table/lib/data-table/data-table.component.mjs +14 -9
- package/esm2022/data-table/lib/infinite-scroll-data-table/infinite-scroll-data-table.component.mjs +13 -10
- package/esm2022/drawer/lib/drawer/drawer-item/drawer.component.mjs +5 -4
- package/esm2022/list/lib/list.component.mjs +14 -9
- package/esm2022/menu/lib/context-menu.component.mjs +40 -32
- package/esm2022/password-box/lib/password-box.component.mjs +3 -11
- package/esm2022/password-box/lib/password-strength-validation/password-strength-validation.component.mjs +12 -4
- package/esm2022/picker/lib/picker.component.mjs +11 -4
- package/esm2022/popover/lib/popover.component.mjs +7 -6
- package/esm2022/range-slider/lib/range-slider.component.mjs +15 -9
- package/esm2022/rate-picker/lib/rate-picker.component.mjs +8 -2
- package/esm2022/select-box/lib/select-box.component.mjs +2 -5
- package/esm2022/tree-view/acorex-components-tree-view.mjs +5 -0
- package/esm2022/tree-view/index.mjs +4 -0
- package/esm2022/tree-view/lib/tree-view-item.component.mjs +86 -0
- package/esm2022/tree-view/lib/tree-view.class.mjs +4 -0
- package/esm2022/tree-view/lib/tree-view.component.mjs +299 -0
- package/esm2022/tree-view/lib/tree-view.component.module.mjs +50 -0
- package/esm2022/uploader/lib/uploader-zone.directive.mjs +21 -16
- package/fesm2022/acorex-components-audio-wave.mjs +18 -15
- package/fesm2022/acorex-components-audio-wave.mjs.map +1 -1
- package/fesm2022/acorex-components-button.mjs +2 -2
- package/fesm2022/acorex-components-button.mjs.map +1 -1
- package/fesm2022/acorex-components-calendar.mjs +16 -14
- package/fesm2022/acorex-components-calendar.mjs.map +1 -1
- package/fesm2022/acorex-components-comment.mjs +17 -14
- package/fesm2022/acorex-components-comment.mjs.map +1 -1
- package/fesm2022/acorex-components-common.mjs +44 -34
- package/fesm2022/acorex-components-common.mjs.map +1 -1
- package/fesm2022/acorex-components-conversation.mjs +12 -9
- package/fesm2022/acorex-components-conversation.mjs.map +1 -1
- package/fesm2022/acorex-components-data-pager.mjs +20 -6
- package/fesm2022/acorex-components-data-pager.mjs.map +1 -1
- package/fesm2022/acorex-components-data-table.mjs +33 -25
- package/fesm2022/acorex-components-data-table.mjs.map +1 -1
- package/fesm2022/acorex-components-drawer.mjs +4 -3
- package/fesm2022/acorex-components-drawer.mjs.map +1 -1
- package/fesm2022/acorex-components-list.mjs +14 -10
- package/fesm2022/acorex-components-list.mjs.map +1 -1
- package/fesm2022/acorex-components-menu.mjs +39 -31
- package/fesm2022/acorex-components-menu.mjs.map +1 -1
- package/fesm2022/acorex-components-password-box.mjs +12 -12
- package/fesm2022/acorex-components-password-box.mjs.map +1 -1
- package/fesm2022/acorex-components-picker.mjs +10 -4
- package/fesm2022/acorex-components-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-popover.mjs +6 -5
- package/fesm2022/acorex-components-popover.mjs.map +1 -1
- package/fesm2022/acorex-components-range-slider.mjs +14 -8
- package/fesm2022/acorex-components-range-slider.mjs.map +1 -1
- package/fesm2022/acorex-components-rate-picker.mjs +7 -1
- package/fesm2022/acorex-components-rate-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-select-box.mjs +1 -4
- package/fesm2022/acorex-components-select-box.mjs.map +1 -1
- package/fesm2022/acorex-components-tree-view.mjs +433 -0
- package/fesm2022/acorex-components-tree-view.mjs.map +1 -0
- package/fesm2022/acorex-components-uploader.mjs +20 -15
- package/fesm2022/acorex-components-uploader.mjs.map +1 -1
- package/menu/lib/context-menu.component.d.ts +1 -0
- package/package.json +7 -1
- package/password-box/lib/password-box.component.d.ts +1 -9
- package/password-box/lib/password-strength-validation/password-strength-validation.component.d.ts +9 -1
- package/picker/lib/picker.component.d.ts +1 -0
- package/popover/lib/popover.component.d.ts +1 -0
- package/rate-picker/lib/rate-picker.component.d.ts +1 -0
- package/tree-view/README.md +3 -0
- package/tree-view/index.d.ts +3 -0
- package/tree-view/lib/tree-view-item.component.d.ts +23 -0
- package/tree-view/lib/tree-view.class.d.ts +20 -0
- package/tree-view/lib/tree-view.component.d.ts +80 -0
- package/tree-view/lib/tree-view.component.module.d.ts +16 -0
- package/uploader/lib/uploader-zone.directive.d.ts +1 -0
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"acorex-components-select-box.mjs","sources":["../../../../libs/components/select-box/src/lib/select-box.component.ts","../../../../libs/components/select-box/src/lib/select-box.component.html","../../../../libs/components/select-box/src/lib/select-box.module.ts","../../../../libs/components/select-box/src/acorex-components-select-box.ts"],"sourcesContent":["import {\r\n AXClearableComponent,\r\n AXClosbaleComponent,\r\n AXComponent,\r\n AXDataSource,\r\n AXEvent,\r\n AXFocusableComponent,\r\n AXHotkeysService,\r\n AXItemClickEvent,\r\n AXSearchableComponent,\r\n AXValuableComponent,\r\n AXValueChangedEvent,\r\n AX_SELECTION_DATA_TOKEN,\r\n MXLookComponent,\r\n MXSelectionBridgeService,\r\n MXSelectionValueComponent,\r\n convertArrayToDataSource,\r\n} from '@acorex/components/common';\r\nimport { AXDropdownBoxComponent, MXDropdownBoxBaseComponent } from '@acorex/components/dropdown';\r\nimport { AXListComponent } from '@acorex/components/list';\r\nimport { AXSearchBoxComponent } from '@acorex/components/search-box';\r\nimport { AXUnsubscriber } from '@acorex/core/utils';\r\nimport {\r\n AfterViewInit,\r\n ChangeDetectionStrategy,\r\n Component,\r\n ContentChild,\r\n ElementRef,\r\n HostListener,\r\n Input,\r\n OnDestroy,\r\n TemplateRef,\r\n ViewChild,\r\n ViewEncapsulation,\r\n WritableSignal,\r\n forwardRef,\r\n inject,\r\n signal,\r\n} from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\r\nimport { findLastIndex, last, nth } from 'lodash-es';\r\nimport { classes } from 'polytype';\r\nimport { Observable } from 'rxjs';\r\n\r\n/**\r\n * The Button is a component which detects user interaction and triggers a corresponding event\r\n * @category\r\n */\r\n@Component({\r\n selector: 'ax-select-box',\r\n templateUrl: './select-box.component.html',\r\n styleUrls: ['./select-box.component.scss'],\r\n inputs: [\r\n 'disabled',\r\n 'readonly',\r\n 'tabIndex',\r\n 'placeholder',\r\n 'minValue',\r\n 'maxValue',\r\n 'value',\r\n 'state',\r\n 'name',\r\n 'id',\r\n 'type',\r\n 'look',\r\n 'multiple',\r\n 'valueField',\r\n 'textField',\r\n 'textTemplate',\r\n ],\r\n outputs: [\r\n 'valueChange',\r\n 'stateChange',\r\n 'onValueChanged',\r\n 'onBlur',\r\n 'onFocus',\r\n 'readonlyChange',\r\n 'disabledChange',\r\n 'onOpened',\r\n 'onClosed',\r\n ],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n providers: [\r\n { provide: AXComponent, useExisting: AXSelectBoxComponent },\r\n { provide: AXFocusableComponent, useExisting: AXSelectBoxComponent },\r\n { provide: AXValuableComponent, useExisting: AXSelectBoxComponent },\r\n { provide: AXClearableComponent, useExisting: AXSelectBoxComponent },\r\n { provide: AXClosbaleComponent, useExisting: AXSelectBoxComponent },\r\n { provide: AXSearchableComponent, useExisting: AXSelectBoxComponent },\r\n {\r\n provide: NG_VALUE_ACCESSOR,\r\n useExisting: forwardRef(() => AXSelectBoxComponent),\r\n multi: true,\r\n },\r\n {\r\n provide: AX_SELECTION_DATA_TOKEN,\r\n useClass: MXSelectionBridgeService,\r\n },\r\n AXUnsubscriber,\r\n ],\r\n host: { ngSkipHydration: 'true' },\r\n})\r\nexport class AXSelectBoxComponent\r\n extends classes(MXDropdownBoxBaseComponent, MXSelectionValueComponent, MXLookComponent)\r\n implements AfterViewInit, OnDestroy\r\n{\r\n /** @ignore */\r\n private hotKeyService: AXHotkeysService = inject(AXHotkeysService);\r\n\r\n /** @ignore */\r\n protected isLoading: WritableSignal<boolean> = signal(false);\r\n\r\n /** @ignore */\r\n protected renderList = false;\r\n\r\n /** @ignore */\r\n protected dropdownSizes: { width: string; height: string } = {\r\n width: '100%',\r\n height: 'auto',\r\n };\r\n\r\n /** @ignore */\r\n protected _listDataSource: AXDataSource<any> = convertArrayToDataSource([], {\r\n key: this.valueField,\r\n pageSize: 10,\r\n });\r\n\r\n /** @ignore */\r\n private _dataSource: AXDataSource<any> | any[];\r\n\r\n /**\r\n * Gets the data source for the component, which can be either an `AXDataSource` or an array of items.\r\n * @returns {AXDataSource<any> | any[]}\r\n */\r\n public get dataSource(): AXDataSource<any> | any[] {\r\n return this._dataSource;\r\n }\r\n\r\n /**\r\n * Sets the data source, either as an `AXDataSource` or an array.\r\n * @param {AXDataSource<any> | any[]} v\r\n */\r\n @Input()\r\n\r\n /**\r\n * Sets the data source, either as `AXDataSource` or an array. Converts arrays to `AXDataSource` and subscribes to data and loading changes.\r\n * @param {AXDataSource<any> | any[]} v\r\n */\r\n public set dataSource(v: AXDataSource<any> | any[]) {\r\n this._dataSource = v;\r\n if (Array.isArray(v)) {\r\n this._listDataSource = convertArrayToDataSource(v, {\r\n key: this.valueField,\r\n pageSize: 10,\r\n });\r\n } else {\r\n this._listDataSource = this.dataSource as AXDataSource<any>;\r\n }\r\n //\r\n //\r\n this._listDataSource.onChanged.pipe(this._unsubscriber.takeUntilDestroy).subscribe((data) => {\r\n this.setDropdownSize(data.totalCount);\r\n });\r\n this._listDataSource.onLoadingChanged.pipe(this._unsubscriber.takeUntilDestroy).subscribe((loading) => {\r\n this.isLoading.set(loading);\r\n });\r\n }\r\n\r\n /**\r\n * The placeholder text displayed when the component is empty.\r\n * @param {string} placeholder\r\n */\r\n @Input()\r\n placeholder: string;\r\n\r\n /**\r\n * The caption text to be displayed in the component.\r\n * @param {string} caption\r\n */\r\n @Input()\r\n caption: string;\r\n\r\n /**\r\n * The template used to customize the rendering of items.\r\n * @param {TemplateRef<any>} itemTemplate\r\n */\r\n @Input()\r\n itemTemplate: TemplateRef<any>;\r\n\r\n /**\r\n * The template used to customize the rendering of selected items.\r\n * @param {TemplateRef<any>} selectedTemplate\r\n */\r\n @Input()\r\n selectedTemplate: TemplateRef<any>;\r\n\r\n /**\r\n * The template used to display when there are no items.\r\n * @param {TemplateRef<any>} emptyTemplate\r\n */\r\n @Input()\r\n emptyTemplate: TemplateRef<any>;\r\n\r\n /**\r\n * The template used to display while loading.\r\n * @param {TemplateRef<any>} loadingTemplate\r\n */\r\n @Input()\r\n loadingTemplate: TemplateRef<any>;\r\n\r\n /**\r\n * The width of the dropdown in pixels.\r\n * @defaultValue 260\r\n */\r\n @Input()\r\n dropdownWidth = 260;\r\n\r\n /** @ignore */\r\n @ViewChild('panel') panel!: ElementRef<HTMLDivElement>;\r\n\r\n /** @ignore */\r\n @ViewChild(AXListComponent)\r\n list: AXListComponent;\r\n\r\n /** @ignore */\r\n @ContentChild(AXSearchBoxComponent, { static: true })\r\n searchBox: AXSearchBoxComponent;\r\n\r\n /** @ignore */\r\n @ViewChild(AXDropdownBoxComponent, { static: true })\r\n protected dropdown: AXDropdownBoxComponent;\r\n\r\n /**\r\n * Service for managing selection data, injected via `AX_SELECTION_DATA_TOKEN`.\r\n */\r\n public selectionService = inject(AX_SELECTION_DATA_TOKEN);\r\n\r\n searchEvent: Observable<any>;\r\n\r\n /** @ignore */\r\n private _unsubscriber = inject(AXUnsubscriber);\r\n\r\n /** @ignore */\r\n protected override ngOnInit(): void {\r\n super.ngOnInit();\r\n //\r\n this.registerValidation();\r\n }\r\n\r\n /** @ignore */\r\n ngAfterViewInit() {\r\n this.setDropdownSize();\r\n }\r\n\r\n /** @ignore */\r\n override ngOnDestroy(): void {\r\n this.searchBox?.onKeyDown.unsubscribe();\r\n }\r\n\r\n /**\r\n * Retrieves an item by its key.\r\n * @param {any} key\r\n */\r\n getItemByKey(key: any): Promise<any> | any {\r\n const startTime = Date.now();\r\n\r\n const check = async () => {\r\n while (Date.now() - startTime < 2000) {\r\n if (typeof this._listDataSource.find === 'function') {\r\n return this._listDataSource.find(key);\r\n } else {\r\n await new Promise((resolve) => setTimeout(resolve, 50));\r\n }\r\n }\r\n console.warn('Timeout reached without finding the \"getItemByKey\" method');\r\n };\r\n return check();\r\n }\r\n\r\n /** @ignore */\r\n protected _handleOnOpenedEvent(e: AXEvent) {\r\n this.renderList = true;\r\n this.list?.render();\r\n this._handleFocus();\r\n this.setDropdownSize();\r\n //\r\n this.onOpened.emit({\r\n component: this,\r\n isUserInteraction: e.isUserInteraction,\r\n });\r\n }\r\n\r\n /** @ignore */\r\n protected _handleOnClosedEvent(e: AXEvent) {\r\n //this.input.focus();\r\n this.onClosed.emit({\r\n component: this,\r\n isUserInteraction: e.isUserInteraction,\r\n });\r\n this._unsubscriber.unsubscribe();\r\n }\r\n\r\n /** @ignore */\r\n protected _handleFocus() {\r\n setTimeout(() => {\r\n if (this.searchBox) {\r\n this.searchBox.focus();\r\n //TODO: unsubscribe\r\n this.hotKeyService\r\n .addShortcut({ keys: 'Control.f', element: this.panel.nativeElement })\r\n .pipe(this._unsubscriber.takeUntilDestroy)\r\n .subscribe(() => {\r\n this.searchBox.focus();\r\n });\r\n this.searchBox.onKeyDown.pipe(this._unsubscriber.takeUntilDestroy).subscribe((e) => {\r\n if (e.nativeEvent.code === 'ArrowDown' || e.nativeEvent.key === 'ArrowDown') {\r\n this.list?.focus();\r\n e.nativeEvent.preventDefault();\r\n }\r\n });\r\n } else {\r\n this.list?.focus();\r\n }\r\n });\r\n }\r\n\r\n /** @ignore */\r\n protected _handleBadgeRemove(e: MouseEvent, item) {\r\n this.unselectItems(item);\r\n e.stopPropagation();\r\n }\r\n\r\n /** @ignore */\r\n protected _handleValueChanged(e: AXValueChangedEvent) {\r\n if (e.isUserInteraction) {\r\n this.commitValue(e.component.selectedItems, true);\r\n }\r\n }\r\n\r\n /** @ignore */\r\n protected _handleOnItemClick(e: AXItemClickEvent) {\r\n if (!this.multiple) {\r\n this.close();\r\n }\r\n }\r\n\r\n /** @ignore */\r\n private setDropdownSize(count = 0) {\r\n if (this.dropdown.isActionsheetStyle) {\r\n this.dropdownSizes = {\r\n width: '100%',\r\n height: ['auto', '0px'].includes(this.dropdownSizes.height)\r\n ? `${Math.min(15, count) * 40}px`\r\n : this.dropdownSizes.height,\r\n };\r\n } else {\r\n //TODO: calc min-with from formula or config\r\n const hostWidth = Math.max(this.getHostElement().offsetWidth, this.dropdownWidth);\r\n this.dropdownSizes = {\r\n width: `${hostWidth}px`,\r\n height:\r\n this._listDataSource.totalCount == 0\r\n ? 'auto'\r\n : `${Math.min(5, this._listDataSource.totalCount) * 40}px`,\r\n };\r\n }\r\n setTimeout(() => {\r\n this.dropdown.updatePosition();\r\n });\r\n }\r\n\r\n /** @ignore */\r\n @HostListener('keydown', ['$event'])\r\n _handleKeydown(e: KeyboardEvent) {\r\n if (e.code === 'ArrowDown' || e.code === 'ArrowUp') {\r\n this.selectItemByNav(e.code === 'ArrowDown' ? 1 : -1);\r\n e.preventDefault();\r\n } else if (e.code === 'Backspace') {\r\n this.unselectItems(this.selectedItems.pop());\r\n e.preventDefault();\r\n }\r\n // if ((e.code === 'Space' || e.code === 'Enter') && this.hasItems) {\r\n // if (this.readonly || this.disabled) {\r\n // e.preventDefault();\r\n // e.stopPropagation();\r\n // return;\r\n // }\r\n // const id = document.activeElement?.closest('li')?.dataset?.id;\r\n // this.toggleSelect(id);\r\n // e.preventDefault();\r\n // e.stopPropagation()\r\n // }\r\n }\r\n\r\n /** @ignore */\r\n private selectItemByNav(sign: 1 | -1) {\r\n if (Array.isArray(this.dataSource) && !this.multiple) {\r\n const items = this.normalizeItemsList(this.dataSource);\r\n const _last: any = last(this.selectedItems);\r\n let i = -1;\r\n if (_last) {\r\n i = findLastIndex(items, [this.valueField, _last[this.valueField]]);\r\n }\r\n i += sign;\r\n if (i < 0 || i >= items.length) return;\r\n const next = nth<any>(items, i);\r\n if (next) {\r\n this.selectItems(next);\r\n }\r\n } else {\r\n this.open();\r\n }\r\n }\r\n\r\n /**\r\n * Filters the data source based on the provided search term.\r\n * @param {string} term\r\n */\r\n search(term: string) {\r\n if (term) {\r\n this._listDataSource.filter({\r\n field: this.textField,\r\n value: term,\r\n operator: { type: 'contains' },\r\n });\r\n } else {\r\n this._listDataSource.clearFilter();\r\n }\r\n this._listDataSource.refresh();\r\n }\r\n\r\n /**\r\n * Refreshes the component by resetting state, clearing selection cache, refreshing the list, and closing the component.\r\n */\r\n refresh() {\r\n this.reset(false);\r\n this.clearSelectionCache();\r\n this.list?.refresh();\r\n this.close();\r\n }\r\n}\r\n","<ax-dropdown-box\r\n (onOpened)=\"_handleOnOpenedEvent($event)\"\r\n (onClosed)=\"_handleOnClosedEvent($event)\"\r\n (focus)=\"emitOnFocusEvent($event)\"\r\n (blur)=\"emitOnBlurEvent($event)\"\r\n [disabled]=\"disabled\"\r\n [look]=\"look\"\r\n class=\"ax-auto-height\"\r\n>\r\n <ng-container input>\r\n <ng-content select=\"ax-prefix\"> </ng-content>\r\n <div\r\n class=\"ax-select-box-selection ax-content\"\r\n [class.ax-multiple]=\"multiple\"\r\n [tabindex]=\"tabIndex\"\r\n (click)=\"toggle()\"\r\n >\r\n @if (selectedItems.length === 0) {\r\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\r\n {{ placeholder }}\r\n </div>\r\n }\r\n @for (item of selectedItems; track $index) {\r\n @if (selectedTemplate) {\r\n <ng-template\r\n *ngTemplateOutlet=\"selectedTemplate; context: { $implicit: { data: item } }\"\r\n ></ng-template>\r\n } @else {\r\n <div class=\"ax-selected-token\">\r\n {{ getDisplayText(item) }}\r\n @if (!disabled && !readonly && multiple) {\r\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n @if (selectedItems?.length && !disabled && !readonly) {\r\n <ng-content select=\"ax-clear-button\"></ng-content>\r\n }\r\n <button\r\n type=\"button\"\r\n [disabled]=\"disabled\"\r\n [tabIndex]=\"-1\"\r\n class=\"ax-general-button ax-button-icon\"\r\n (click)=\"toggle()\"\r\n >\r\n <!-- @if (isLoading() && !isOpen) {\r\n <ax-loading type=\"spinner\"></ax-loading>\r\n } @else { -->\r\n <span\r\n class=\"ax-icon ax-icon-chevron-left ax-arrow-button\"\r\n [ngClass]=\"{\r\n '-rotation-90': !isOpen,\r\n 'rotation-90': isOpen,\r\n }\"\r\n ></span>\r\n <!-- } -->\r\n </button>\r\n <ng-content select=\"ax-suffix\"> </ng-content>\r\n <ng-template #search>\r\n <ng-content select=\"ax-search-box\"> </ng-content>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container panel>\r\n <div #panel class=\"ax-select-box-panel\" [style.min-width]=\"dropdownSizes.width\">\r\n @if (dropdown.isActionsheetStyle) {\r\n <ax-header class=\"ax-solid\">\r\n <ax-title>{{ caption || placeholder || 'selectbox.popover.title' | translate | async }}</ax-title>\r\n <ax-close-button\r\n [icon]=\"multiple ? 'ax-icon ax-icon-check !ax-text-primary-500' : 'ax-icon ax-icon-close'\"\r\n ></ax-close-button>\r\n </ax-header>\r\n }\r\n @if (searchBox) {\r\n <div class=\"ax-search-container\">\r\n <ng-template [ngTemplateOutlet]=\"search\"></ng-template>\r\n </div>\r\n }\r\n @if (renderList) {\r\n <ax-list\r\n [readonly]=\"readonly\"\r\n [dataSource]=\"_listDataSource\"\r\n [multiple]=\"multiple\"\r\n [style.height]=\"dropdownSizes.height\"\r\n [valueField]=\"valueField\"\r\n [textField]=\"textField\"\r\n [textTemplate]=\"textTemplate\"\r\n [emptyTemplate]=\"emptyTemplate ?? empty\"\r\n [itemTemplate]=\"itemTemplate\"\r\n [loadingTemplate]=\"loadingTemplate\"\r\n [ngModel]=\"value\"\r\n (onValueChanged)=\"_handleValueChanged($event)\"\r\n [selectionMode]=\"'item'\"\r\n (onItemClick)=\"_handleOnItemClick($event)\"\r\n >\r\n <ng-template #empty> {{ 'no-result-found' | translate | async }} </ng-template>\r\n </ax-list>\r\n }\r\n\r\n @if (isLoading()) {\r\n @if (loadingTemplate) {\r\n <ng-template *ngTemplateOutlet=\"loadingTemplate\"></ng-template>\r\n } @else {\r\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\r\n <ax-loading></ax-loading>\r\n </div>\r\n }\r\n }\r\n\r\n <ng-content select=\"ax-footer\"> </ng-content>\r\n </div>\r\n </ng-container>\r\n</ax-dropdown-box>\r\n<ng-content select=\"ax-validation-rule\"> </ng-content>\r\n","import { AXBadgeModule } from '@acorex/components/badge';\nimport { AXCheckBoxModule } from '@acorex/components/check-box';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXLoadingModule } from '@acorex/components/loading';\nimport { AXPopoverModule } from '@acorex/components/popover';\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\n\nimport { AXCommonModule } from '@acorex/components/common';\nimport { AXDropdownModule } from '@acorex/components/dropdown';\nimport { AXListModule } from '@acorex/components/list';\nimport { AXTextBoxModule } from '@acorex/components/text-box';\nimport { AXSelectBoxComponent } from './select-box.component';\n\n@NgModule({\n imports: [\n CommonModule,\n AXCommonModule,\n FormsModule,\n AXCheckBoxModule,\n AXBadgeModule,\n AXDecoratorModule,\n AXTranslationModule,\n AXPopoverModule,\n AXLoadingModule,\n A11yModule,\n AXTextBoxModule,\n AXDropdownModule,\n AXListModule,\n ],\n exports: [AXSelectBoxComponent],\n declarations: [AXSelectBoxComponent],\n providers: [],\n})\nexport class AXSelectBoxModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
1
|
+
{"version":3,"file":"acorex-components-select-box.mjs","sources":["../../../../libs/components/select-box/src/lib/select-box.component.ts","../../../../libs/components/select-box/src/lib/select-box.component.html","../../../../libs/components/select-box/src/lib/select-box.module.ts","../../../../libs/components/select-box/src/acorex-components-select-box.ts"],"sourcesContent":["import {\r\n AXClearableComponent,\r\n AXClosbaleComponent,\r\n AXComponent,\r\n AXDataSource,\r\n AXEvent,\r\n AXFocusableComponent,\r\n AXHotkeysService,\r\n AXItemClickEvent,\r\n AXSearchableComponent,\r\n AXValuableComponent,\r\n AXValueChangedEvent,\r\n AX_SELECTION_DATA_TOKEN,\r\n MXLookComponent,\r\n MXSelectionBridgeService,\r\n MXSelectionValueComponent,\r\n convertArrayToDataSource,\r\n} from '@acorex/components/common';\r\nimport { AXDropdownBoxComponent, MXDropdownBoxBaseComponent } from '@acorex/components/dropdown';\r\nimport { AXListComponent } from '@acorex/components/list';\r\nimport { AXSearchBoxComponent } from '@acorex/components/search-box';\r\nimport { AXUnsubscriber } from '@acorex/core/utils';\r\nimport {\r\n AfterViewInit,\r\n ChangeDetectionStrategy,\r\n Component,\r\n ContentChild,\r\n ElementRef,\r\n HostListener,\r\n Input,\r\n OnDestroy,\r\n TemplateRef,\r\n ViewChild,\r\n ViewEncapsulation,\r\n WritableSignal,\r\n forwardRef,\r\n inject,\r\n signal,\r\n} from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\r\nimport { findLastIndex, last, nth } from 'lodash-es';\r\nimport { classes } from 'polytype';\r\nimport { Observable } from 'rxjs';\r\n\r\n/**\r\n * The Button is a component which detects user interaction and triggers a corresponding event\r\n * @category\r\n */\r\n@Component({\r\n selector: 'ax-select-box',\r\n templateUrl: './select-box.component.html',\r\n styleUrls: ['./select-box.component.scss'],\r\n inputs: [\r\n 'disabled',\r\n 'readonly',\r\n 'tabIndex',\r\n 'placeholder',\r\n 'minValue',\r\n 'maxValue',\r\n 'value',\r\n 'state',\r\n 'name',\r\n 'id',\r\n 'type',\r\n 'look',\r\n 'multiple',\r\n 'valueField',\r\n 'textField',\r\n 'textTemplate',\r\n ],\r\n outputs: [\r\n 'valueChange',\r\n 'stateChange',\r\n 'onValueChanged',\r\n 'onBlur',\r\n 'onFocus',\r\n 'readonlyChange',\r\n 'disabledChange',\r\n 'onOpened',\r\n 'onClosed',\r\n ],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n providers: [\r\n { provide: AXComponent, useExisting: AXSelectBoxComponent },\r\n { provide: AXFocusableComponent, useExisting: AXSelectBoxComponent },\r\n { provide: AXValuableComponent, useExisting: AXSelectBoxComponent },\r\n { provide: AXClearableComponent, useExisting: AXSelectBoxComponent },\r\n { provide: AXClosbaleComponent, useExisting: AXSelectBoxComponent },\r\n { provide: AXSearchableComponent, useExisting: AXSelectBoxComponent },\r\n {\r\n provide: NG_VALUE_ACCESSOR,\r\n useExisting: forwardRef(() => AXSelectBoxComponent),\r\n multi: true,\r\n },\r\n {\r\n provide: AX_SELECTION_DATA_TOKEN,\r\n useClass: MXSelectionBridgeService,\r\n },\r\n AXUnsubscriber,\r\n ],\r\n host: { ngSkipHydration: 'true' },\r\n})\r\nexport class AXSelectBoxComponent\r\n extends classes(MXDropdownBoxBaseComponent, MXSelectionValueComponent, MXLookComponent)\r\n implements AfterViewInit, OnDestroy\r\n{\r\n /** @ignore */\r\n private hotKeyService: AXHotkeysService = inject(AXHotkeysService);\r\n\r\n /** @ignore */\r\n protected isLoading: WritableSignal<boolean> = signal(false);\r\n\r\n /** @ignore */\r\n protected renderList = false;\r\n\r\n /** @ignore */\r\n protected dropdownSizes: { width: string; height: string } = {\r\n width: '100%',\r\n height: 'auto',\r\n };\r\n\r\n /** @ignore */\r\n protected _listDataSource: AXDataSource<any> = convertArrayToDataSource([], {\r\n key: this.valueField,\r\n pageSize: 10,\r\n });\r\n\r\n /** @ignore */\r\n private _dataSource: AXDataSource<any> | any[];\r\n\r\n /**\r\n * Gets the data source for the component, which can be either an `AXDataSource` or an array of items.\r\n * @returns {AXDataSource<any> | any[]}\r\n */\r\n public get dataSource(): AXDataSource<any> | any[] {\r\n return this._dataSource;\r\n }\r\n\r\n /**\r\n * Sets the data source, either as an `AXDataSource` or an array.\r\n * @param {AXDataSource<any> | any[]} v\r\n */\r\n @Input()\r\n\r\n /**\r\n * Sets the data source, either as `AXDataSource` or an array. Converts arrays to `AXDataSource` and subscribes to data and loading changes.\r\n * @param {AXDataSource<any> | any[]} v\r\n */\r\n public set dataSource(v: AXDataSource<any> | any[]) {\r\n this._dataSource = v;\r\n if (Array.isArray(v)) {\r\n this._listDataSource = convertArrayToDataSource(v, {\r\n key: this.valueField,\r\n pageSize: 10,\r\n });\r\n } else {\r\n this._listDataSource = this.dataSource as AXDataSource<any>;\r\n }\r\n //\r\n //\r\n this._listDataSource.onChanged.pipe(this._unsubscriber.takeUntilDestroy).subscribe((data) => {\r\n this.setDropdownSize(data.totalCount);\r\n });\r\n this._listDataSource.onLoadingChanged.pipe(this._unsubscriber.takeUntilDestroy).subscribe((loading) => {\r\n this.isLoading.set(loading);\r\n });\r\n }\r\n\r\n /**\r\n * The placeholder text displayed when the component is empty.\r\n * @param {string} placeholder\r\n */\r\n @Input()\r\n placeholder: string;\r\n\r\n /**\r\n * The caption text to be displayed in the component.\r\n * @param {string} caption\r\n */\r\n @Input()\r\n caption: string;\r\n\r\n /**\r\n * The template used to customize the rendering of items.\r\n * @param {TemplateRef<any>} itemTemplate\r\n */\r\n @Input()\r\n itemTemplate: TemplateRef<any>;\r\n\r\n /**\r\n * The template used to customize the rendering of selected items.\r\n * @param {TemplateRef<any>} selectedTemplate\r\n */\r\n @Input()\r\n selectedTemplate: TemplateRef<any>;\r\n\r\n /**\r\n * The template used to display when there are no items.\r\n * @param {TemplateRef<any>} emptyTemplate\r\n */\r\n @Input()\r\n emptyTemplate: TemplateRef<any>;\r\n\r\n /**\r\n * The template used to display while loading.\r\n * @param {TemplateRef<any>} loadingTemplate\r\n */\r\n @Input()\r\n loadingTemplate: TemplateRef<any>;\r\n\r\n /**\r\n * The width of the dropdown in pixels.\r\n * @defaultValue 260\r\n */\r\n @Input()\r\n dropdownWidth = 260;\r\n\r\n /** @ignore */\r\n @ViewChild('panel') panel!: ElementRef<HTMLDivElement>;\r\n\r\n /** @ignore */\r\n @ViewChild(AXListComponent)\r\n list: AXListComponent;\r\n\r\n /** @ignore */\r\n @ContentChild(AXSearchBoxComponent, { static: true })\r\n searchBox: AXSearchBoxComponent;\r\n\r\n /** @ignore */\r\n @ViewChild(AXDropdownBoxComponent, { static: true })\r\n protected dropdown: AXDropdownBoxComponent;\r\n\r\n /**\r\n * Service for managing selection data, injected via `AX_SELECTION_DATA_TOKEN`.\r\n */\r\n public selectionService = inject(AX_SELECTION_DATA_TOKEN);\r\n\r\n searchEvent: Observable<any>;\r\n\r\n /** @ignore */\r\n private _unsubscriber = inject(AXUnsubscriber);\r\n\r\n /** @ignore */\r\n protected override ngOnInit(): void {\r\n super.ngOnInit();\r\n //\r\n this.registerValidation();\r\n }\r\n\r\n /** @ignore */\r\n ngAfterViewInit() {\r\n this.setDropdownSize();\r\n }\r\n\r\n /** @ignore */\r\n override ngOnDestroy(): void {\r\n this.searchBox?.onKeyDown.unsubscribe();\r\n }\r\n\r\n /**\r\n * Retrieves an item by its key.\r\n * @param {any} key\r\n */\r\n getItemByKey(key: any): Promise<any> | any {\r\n const startTime = Date.now();\r\n\r\n const check = async () => {\r\n while (Date.now() - startTime < 2000) {\r\n if (typeof this._listDataSource.find === 'function') {\r\n return this._listDataSource.find(key);\r\n } else {\r\n await new Promise((resolve) => setTimeout(resolve, 50));\r\n }\r\n }\r\n console.warn('Timeout reached without finding the \"getItemByKey\" method');\r\n };\r\n return check();\r\n }\r\n\r\n /** @ignore */\r\n protected _handleOnOpenedEvent(e: AXEvent) {\r\n this.renderList = true;\r\n this.list?.render();\r\n this._handleFocus();\r\n //\r\n this.onOpened.emit({\r\n component: this,\r\n isUserInteraction: e.isUserInteraction,\r\n });\r\n }\r\n\r\n /** @ignore */\r\n protected _handleOnClosedEvent(e: AXEvent) {\r\n //this.input.focus();\r\n this.onClosed.emit({\r\n component: this,\r\n isUserInteraction: e.isUserInteraction,\r\n });\r\n this._unsubscriber.unsubscribe();\r\n }\r\n\r\n /** @ignore */\r\n protected _handleFocus() {\r\n setTimeout(() => {\r\n if (this.searchBox) {\r\n this.searchBox.focus();\r\n //TODO: unsubscribe\r\n this.hotKeyService\r\n .addShortcut({ keys: 'Control.f', element: this.panel.nativeElement })\r\n .pipe(this._unsubscriber.takeUntilDestroy)\r\n .subscribe(() => {\r\n this.searchBox.focus();\r\n });\r\n this.searchBox.onKeyDown.pipe(this._unsubscriber.takeUntilDestroy).subscribe((e) => {\r\n if (e.nativeEvent.code === 'ArrowDown' || e.nativeEvent.key === 'ArrowDown') {\r\n this.list?.focus();\r\n e.nativeEvent.preventDefault();\r\n }\r\n });\r\n } else {\r\n this.list?.focus();\r\n }\r\n });\r\n }\r\n\r\n /** @ignore */\r\n protected _handleBadgeRemove(e: MouseEvent, item) {\r\n this.unselectItems(item);\r\n e.stopPropagation();\r\n }\r\n\r\n /** @ignore */\r\n protected _handleValueChanged(e: AXValueChangedEvent) {\r\n if (e.isUserInteraction) {\r\n this.commitValue(e.component.selectedItems, true);\r\n }\r\n }\r\n\r\n /** @ignore */\r\n protected _handleOnItemClick(e: AXItemClickEvent) {\r\n if (!this.multiple) {\r\n this.close();\r\n }\r\n }\r\n\r\n /** @ignore */\r\n private setDropdownSize(count = 0) {\r\n if (this.dropdown.isActionsheetStyle) {\r\n this.dropdownSizes = {\r\n width: '100%',\r\n height: ['auto', '0px'].includes(this.dropdownSizes.height)\r\n ? `${Math.min(15, count) * 40}px`\r\n : this.dropdownSizes.height,\r\n };\r\n } else {\r\n //TODO: calc min-with from formula or config\r\n const hostWidth = Math.max(this.getHostElement().offsetWidth, this.dropdownWidth);\r\n this.dropdownSizes = {\r\n width: `${hostWidth}px`,\r\n height: count == 0 ? 'auto' : `${Math.min(5, count) * 40}px`,\r\n };\r\n }\r\n setTimeout(() => {\r\n this.dropdown.updatePosition();\r\n });\r\n }\r\n\r\n /** @ignore */\r\n @HostListener('keydown', ['$event'])\r\n _handleKeydown(e: KeyboardEvent) {\r\n if (e.code === 'ArrowDown' || e.code === 'ArrowUp') {\r\n this.selectItemByNav(e.code === 'ArrowDown' ? 1 : -1);\r\n e.preventDefault();\r\n } else if (e.code === 'Backspace') {\r\n this.unselectItems(this.selectedItems.pop());\r\n e.preventDefault();\r\n }\r\n // if ((e.code === 'Space' || e.code === 'Enter') && this.hasItems) {\r\n // if (this.readonly || this.disabled) {\r\n // e.preventDefault();\r\n // e.stopPropagation();\r\n // return;\r\n // }\r\n // const id = document.activeElement?.closest('li')?.dataset?.id;\r\n // this.toggleSelect(id);\r\n // e.preventDefault();\r\n // e.stopPropagation()\r\n // }\r\n }\r\n\r\n /** @ignore */\r\n private selectItemByNav(sign: 1 | -1) {\r\n if (Array.isArray(this.dataSource) && !this.multiple) {\r\n const items = this.normalizeItemsList(this.dataSource);\r\n const _last: any = last(this.selectedItems);\r\n let i = -1;\r\n if (_last) {\r\n i = findLastIndex(items, [this.valueField, _last[this.valueField]]);\r\n }\r\n i += sign;\r\n if (i < 0 || i >= items.length) return;\r\n const next = nth<any>(items, i);\r\n if (next) {\r\n this.selectItems(next);\r\n }\r\n } else {\r\n this.open();\r\n }\r\n }\r\n\r\n /**\r\n * Filters the data source based on the provided search term.\r\n * @param {string} term\r\n */\r\n search(term: string) {\r\n if (term) {\r\n this._listDataSource.filter({\r\n field: this.textField,\r\n value: term,\r\n operator: { type: 'contains' },\r\n });\r\n } else {\r\n this._listDataSource.clearFilter();\r\n }\r\n this._listDataSource.refresh();\r\n }\r\n\r\n /**\r\n * Refreshes the component by resetting state, clearing selection cache, refreshing the list, and closing the component.\r\n */\r\n refresh() {\r\n this.reset(false);\r\n this.clearSelectionCache();\r\n this.list?.refresh();\r\n this.close();\r\n }\r\n}\r\n","<ax-dropdown-box\r\n (onOpened)=\"_handleOnOpenedEvent($event)\"\r\n (onClosed)=\"_handleOnClosedEvent($event)\"\r\n (focus)=\"emitOnFocusEvent($event)\"\r\n (blur)=\"emitOnBlurEvent($event)\"\r\n [disabled]=\"disabled\"\r\n [look]=\"look\"\r\n class=\"ax-auto-height\"\r\n>\r\n <ng-container input>\r\n <ng-content select=\"ax-prefix\"> </ng-content>\r\n <div\r\n class=\"ax-select-box-selection ax-content\"\r\n [class.ax-multiple]=\"multiple\"\r\n [tabindex]=\"tabIndex\"\r\n (click)=\"toggle()\"\r\n >\r\n @if (selectedItems.length === 0) {\r\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\r\n {{ placeholder }}\r\n </div>\r\n }\r\n @for (item of selectedItems; track $index) {\r\n @if (selectedTemplate) {\r\n <ng-template\r\n *ngTemplateOutlet=\"selectedTemplate; context: { $implicit: { data: item } }\"\r\n ></ng-template>\r\n } @else {\r\n <div class=\"ax-selected-token\">\r\n {{ getDisplayText(item) }}\r\n @if (!disabled && !readonly && multiple) {\r\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n @if (selectedItems?.length && !disabled && !readonly) {\r\n <ng-content select=\"ax-clear-button\"></ng-content>\r\n }\r\n <button\r\n type=\"button\"\r\n [disabled]=\"disabled\"\r\n [tabIndex]=\"-1\"\r\n class=\"ax-general-button ax-button-icon\"\r\n (click)=\"toggle()\"\r\n >\r\n <!-- @if (isLoading() && !isOpen) {\r\n <ax-loading type=\"spinner\"></ax-loading>\r\n } @else { -->\r\n <span\r\n class=\"ax-icon ax-icon-chevron-left ax-arrow-button\"\r\n [ngClass]=\"{\r\n '-rotation-90': !isOpen,\r\n 'rotation-90': isOpen,\r\n }\"\r\n ></span>\r\n <!-- } -->\r\n </button>\r\n <ng-content select=\"ax-suffix\"> </ng-content>\r\n <ng-template #search>\r\n <ng-content select=\"ax-search-box\"> </ng-content>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container panel>\r\n <div #panel class=\"ax-select-box-panel\" [style.min-width]=\"dropdownSizes.width\">\r\n @if (dropdown.isActionsheetStyle) {\r\n <ax-header class=\"ax-solid\">\r\n <ax-title>{{ caption || placeholder || 'selectbox.popover.title' | translate | async }}</ax-title>\r\n <ax-close-button\r\n [icon]=\"multiple ? 'ax-icon ax-icon-check !ax-text-primary-500' : 'ax-icon ax-icon-close'\"\r\n ></ax-close-button>\r\n </ax-header>\r\n }\r\n @if (searchBox) {\r\n <div class=\"ax-search-container\">\r\n <ng-template [ngTemplateOutlet]=\"search\"></ng-template>\r\n </div>\r\n }\r\n @if (renderList) {\r\n <ax-list\r\n [readonly]=\"readonly\"\r\n [dataSource]=\"_listDataSource\"\r\n [multiple]=\"multiple\"\r\n [style.height]=\"dropdownSizes.height\"\r\n [valueField]=\"valueField\"\r\n [textField]=\"textField\"\r\n [textTemplate]=\"textTemplate\"\r\n [emptyTemplate]=\"emptyTemplate ?? empty\"\r\n [itemTemplate]=\"itemTemplate\"\r\n [loadingTemplate]=\"loadingTemplate\"\r\n [ngModel]=\"value\"\r\n (onValueChanged)=\"_handleValueChanged($event)\"\r\n [selectionMode]=\"'item'\"\r\n (onItemClick)=\"_handleOnItemClick($event)\"\r\n >\r\n <ng-template #empty> {{ 'no-result-found' | translate | async }} </ng-template>\r\n </ax-list>\r\n }\r\n\r\n @if (isLoading()) {\r\n @if (loadingTemplate) {\r\n <ng-template *ngTemplateOutlet=\"loadingTemplate\"></ng-template>\r\n } @else {\r\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\r\n <ax-loading></ax-loading>\r\n </div>\r\n }\r\n }\r\n\r\n <ng-content select=\"ax-footer\"> </ng-content>\r\n </div>\r\n </ng-container>\r\n</ax-dropdown-box>\r\n<ng-content select=\"ax-validation-rule\"> </ng-content>\r\n","import { AXBadgeModule } from '@acorex/components/badge';\nimport { AXCheckBoxModule } from '@acorex/components/check-box';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXLoadingModule } from '@acorex/components/loading';\nimport { AXPopoverModule } from '@acorex/components/popover';\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\n\nimport { AXCommonModule } from '@acorex/components/common';\nimport { AXDropdownModule } from '@acorex/components/dropdown';\nimport { AXListModule } from '@acorex/components/list';\nimport { AXTextBoxModule } from '@acorex/components/text-box';\nimport { AXSelectBoxComponent } from './select-box.component';\n\n@NgModule({\n imports: [\n CommonModule,\n AXCommonModule,\n FormsModule,\n AXCheckBoxModule,\n AXBadgeModule,\n AXDecoratorModule,\n AXTranslationModule,\n AXPopoverModule,\n AXLoadingModule,\n A11yModule,\n AXTextBoxModule,\n AXDropdownModule,\n AXListModule,\n ],\n exports: [AXSelectBoxComponent],\n declarations: [AXSelectBoxComponent],\n providers: [],\n})\nexport class AXSelectBoxModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
@@ -0,0 +1,433 @@
|
|
1
|
+
import { NXComponent, AXCommonModule } from '@acorex/components/common';
|
2
|
+
import { AXPlatform } from '@acorex/core/platform';
|
3
|
+
import { trigger, state, style, transition, animate } from '@angular/animations';
|
4
|
+
import * as i0 from '@angular/core';
|
5
|
+
import { input, output, model, inject, computed, Component, ViewEncapsulation, ChangeDetectionStrategy, signal, effect, NgModule } from '@angular/core';
|
6
|
+
import * as i1 from '@acorex/components/tooltip';
|
7
|
+
import { AXTooltipModule } from '@acorex/components/tooltip';
|
8
|
+
import * as i2 from '@acorex/components/loading';
|
9
|
+
import { AXLoadingModule } from '@acorex/components/loading';
|
10
|
+
import * as i1$1 from '@angular/common';
|
11
|
+
import { CommonModule } from '@angular/common';
|
12
|
+
import * as i2$1 from '@acorex/components/decorators';
|
13
|
+
import { AXDecoratorModule } from '@acorex/components/decorators';
|
14
|
+
import * as i3 from '@acorex/components/check-box';
|
15
|
+
import { AXCheckBoxModule } from '@acorex/components/check-box';
|
16
|
+
import * as i4 from '@angular/forms';
|
17
|
+
import { FormsModule } from '@angular/forms';
|
18
|
+
import { AXFormModule } from '@acorex/components/form';
|
19
|
+
|
20
|
+
class AXTreeViewItemComponent extends NXComponent {
|
21
|
+
constructor() {
|
22
|
+
super();
|
23
|
+
this.item = input();
|
24
|
+
this.onNodeExpand = output();
|
25
|
+
this.onNodeClick = output();
|
26
|
+
this.isExpanded = model(false);
|
27
|
+
this.hasChildField = input();
|
28
|
+
this.isActive = model(false);
|
29
|
+
this.onNodeDbClick = output();
|
30
|
+
this.isLoading = input(false);
|
31
|
+
this.disableField = input();
|
32
|
+
this.platformService = inject(AXPlatform);
|
33
|
+
this.arrowIcon = computed(() => {
|
34
|
+
if (this.isExpanded()) {
|
35
|
+
return 'ax-tree-view-arrow ax-icon ax-icon-solid ax-icon-chevron-down';
|
36
|
+
}
|
37
|
+
else {
|
38
|
+
return this.platformService.isRtl()
|
39
|
+
? 'ax-tree-view-arrow ax-icon ax-icon-solid ax-icon-chevron-left'
|
40
|
+
: 'ax-tree-view-arrow ax-icon ax-icon-solid ax-icon-chevron-right';
|
41
|
+
}
|
42
|
+
});
|
43
|
+
}
|
44
|
+
handleArrowNodeClick() {
|
45
|
+
if (this.item()[this.disableField()] || this.isLoading()) {
|
46
|
+
return;
|
47
|
+
}
|
48
|
+
this.isExpanded.set(!this.isExpanded());
|
49
|
+
this.onNodeExpand.emit({ component: this, data: this.item(), nativeElement: this.nativeElement });
|
50
|
+
}
|
51
|
+
handleTextClick(item) {
|
52
|
+
this.onNodeClick.emit({ component: this, data: item, nativeElement: this.nativeElement });
|
53
|
+
}
|
54
|
+
handleTextDbClick(item) {
|
55
|
+
if (item[this.disableField()]) {
|
56
|
+
return;
|
57
|
+
}
|
58
|
+
if (item?.childrens?.length || item[this.hasChildField()]) {
|
59
|
+
this.isExpanded.set(!this.isExpanded());
|
60
|
+
this.onNodeDbClick.emit({ component: this, data: item, nativeElement: this.nativeElement });
|
61
|
+
}
|
62
|
+
}
|
63
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXTreeViewItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
64
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: AXTreeViewItemComponent, selector: "ax-tree-view-item", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, isExpanded: { classPropertyName: "isExpanded", publicName: "isExpanded", isSignal: true, isRequired: false, transformFunction: null }, hasChildField: { classPropertyName: "hasChildField", publicName: "hasChildField", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, disableField: { classPropertyName: "disableField", publicName: "disableField", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onNodeExpand: "onNodeExpand", onNodeClick: "onNodeClick", isExpanded: "isExpandedChange", isActive: "isActiveChange", onNodeDbClick: "onNodeDbClick" }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-tree-view-container\">\n @if ((item().childrens && !isLoading()) || (item()[hasChildField()] && !isLoading())) {\n <i\n [class.ax-state-disabled]=\"item()[disableField()]\"\n (click)=\"handleArrowNodeClick()\"\n class=\"{{ arrowIcon() }}\"\n ></i>\n } @else if (isLoading()) {\n <ax-loading></ax-loading>\n } @else {\n <i class=\"ax-icon\"></i>\n }\n\n <div class=\"ax-tree-view-items\">\n <ng-content select=\"ax-check-box\"></ng-content>\n <div\n [class.ax-state-disabled]=\"item()[disableField()]\"\n [axTooltip]=\"item().tooltip\"\n axTooltipPlacement=\"end-bottom\"\n (click)=\"handleTextClick(item())\"\n (dblclick)=\"handleTextDbClick(item())\"\n class=\"ax-tree-view-items-prefix noselect-tree-view\"\n [class.ax-state-tree-view-active]=\"item().active\"\n >\n <ng-content select=\"ax-prefix\"></ng-content>\n <ng-content select=\"ax-text\"></ng-content>\n <ng-content select=\"ax-suffix\"></ng-content>\n </div>\n </div>\n</div>\n\n<div\n class=\"{{ platformService.isRtl() ? 'ax-state-tree-view-rtl' : 'ax-state-tree-view-ltr' }}\"\n [@collapseExpand]=\"isExpanded() ? 'expanded' : 'collapsed'\"\n>\n <ng-content></ng-content>\n</div>\n", dependencies: [{ kind: "directive", type: i1.AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltip", "axTooltipPlacement", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "component", type: i2.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], animations: [
|
65
|
+
trigger('collapseExpand', [
|
66
|
+
state('collapsed', style({
|
67
|
+
height: '0',
|
68
|
+
overflow: 'hidden',
|
69
|
+
opacity: 0,
|
70
|
+
})),
|
71
|
+
state('expanded', style({
|
72
|
+
height: '*',
|
73
|
+
overflow: 'hidden',
|
74
|
+
opacity: 1,
|
75
|
+
})),
|
76
|
+
transition('collapsed <=> expanded', [animate('300ms ease-in-out')]),
|
77
|
+
]),
|
78
|
+
], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
79
|
+
}
|
80
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXTreeViewItemComponent, decorators: [{
|
81
|
+
type: Component,
|
82
|
+
args: [{ selector: 'ax-tree-view-item', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [
|
83
|
+
trigger('collapseExpand', [
|
84
|
+
state('collapsed', style({
|
85
|
+
height: '0',
|
86
|
+
overflow: 'hidden',
|
87
|
+
opacity: 0,
|
88
|
+
})),
|
89
|
+
state('expanded', style({
|
90
|
+
height: '*',
|
91
|
+
overflow: 'hidden',
|
92
|
+
opacity: 1,
|
93
|
+
})),
|
94
|
+
transition('collapsed <=> expanded', [animate('300ms ease-in-out')]),
|
95
|
+
]),
|
96
|
+
], template: "<div class=\"ax-tree-view-container\">\n @if ((item().childrens && !isLoading()) || (item()[hasChildField()] && !isLoading())) {\n <i\n [class.ax-state-disabled]=\"item()[disableField()]\"\n (click)=\"handleArrowNodeClick()\"\n class=\"{{ arrowIcon() }}\"\n ></i>\n } @else if (isLoading()) {\n <ax-loading></ax-loading>\n } @else {\n <i class=\"ax-icon\"></i>\n }\n\n <div class=\"ax-tree-view-items\">\n <ng-content select=\"ax-check-box\"></ng-content>\n <div\n [class.ax-state-disabled]=\"item()[disableField()]\"\n [axTooltip]=\"item().tooltip\"\n axTooltipPlacement=\"end-bottom\"\n (click)=\"handleTextClick(item())\"\n (dblclick)=\"handleTextDbClick(item())\"\n class=\"ax-tree-view-items-prefix noselect-tree-view\"\n [class.ax-state-tree-view-active]=\"item().active\"\n >\n <ng-content select=\"ax-prefix\"></ng-content>\n <ng-content select=\"ax-text\"></ng-content>\n <ng-content select=\"ax-suffix\"></ng-content>\n </div>\n </div>\n</div>\n\n<div\n class=\"{{ platformService.isRtl() ? 'ax-state-tree-view-rtl' : 'ax-state-tree-view-ltr' }}\"\n [@collapseExpand]=\"isExpanded() ? 'expanded' : 'collapsed'\"\n>\n <ng-content></ng-content>\n</div>\n" }]
|
97
|
+
}], ctorParameters: () => [] });
|
98
|
+
|
99
|
+
class AXTreeViewComponent extends NXComponent {
|
100
|
+
constructor() {
|
101
|
+
super();
|
102
|
+
this.itemsSignal = signal([]);
|
103
|
+
this.#effect = effect(() => {
|
104
|
+
const itemsInput = this.items();
|
105
|
+
if (typeof itemsInput === 'function') {
|
106
|
+
const result = itemsInput();
|
107
|
+
if (result instanceof Promise) {
|
108
|
+
this.itemsPromise = (options) => itemsInput(options);
|
109
|
+
this.fetchData();
|
110
|
+
}
|
111
|
+
else {
|
112
|
+
this.itemsSignal.set(result);
|
113
|
+
this.itemsPromise = null;
|
114
|
+
}
|
115
|
+
}
|
116
|
+
else {
|
117
|
+
this.itemsSignal.set(itemsInput);
|
118
|
+
this.itemsPromise = null;
|
119
|
+
}
|
120
|
+
}, { allowSignalWrites: true });
|
121
|
+
this.items = input();
|
122
|
+
this.selectable = input(true);
|
123
|
+
this.selectionMode = input('single');
|
124
|
+
this.selectionBehavior = input(null);
|
125
|
+
this.showActiveNode = signal(true);
|
126
|
+
this.valueField = input('id');
|
127
|
+
this.textField = input('text');
|
128
|
+
this.visibleField = input('visible');
|
129
|
+
this.disableField = input('disabled');
|
130
|
+
this.hasChildField = input();
|
131
|
+
this.iconField = input('icon');
|
132
|
+
this.onSelectionChange = output();
|
133
|
+
this.onItemClick = output();
|
134
|
+
this.onNodeClick = output();
|
135
|
+
this.loadingState = signal({});
|
136
|
+
}
|
137
|
+
#effect;
|
138
|
+
get resolvedItems() {
|
139
|
+
return this.itemsSignal();
|
140
|
+
}
|
141
|
+
handleNodeSelectionClick(event, item) {
|
142
|
+
if (item[this.disableField()] || this.isNodeLoading(item.id)) {
|
143
|
+
return;
|
144
|
+
}
|
145
|
+
if (this.selectionMode() === 'single' && event.isUserInteraction) {
|
146
|
+
this.handleUnSelectNode(this.itemsSignal());
|
147
|
+
}
|
148
|
+
item.selected = event.value;
|
149
|
+
if (event.value != null) {
|
150
|
+
switch (this.selectionBehavior()) {
|
151
|
+
case 'autoExpand':
|
152
|
+
if (event.value) {
|
153
|
+
if (this.itemsPromise && item[this.hasChildField()] && !item?.childrens?.length) {
|
154
|
+
this.fetchData(item.id);
|
155
|
+
this.setNodeLoading(item.id, true);
|
156
|
+
}
|
157
|
+
this.toggleExpand(item);
|
158
|
+
}
|
159
|
+
break;
|
160
|
+
case 'expandAndSelectAllOrUnSelect':
|
161
|
+
if (this.itemsPromise) {
|
162
|
+
console.error('This mode only available client Side');
|
163
|
+
return;
|
164
|
+
}
|
165
|
+
this.expandAndToggleSelection(item, event.value);
|
166
|
+
break;
|
167
|
+
case 'indeterminate':
|
168
|
+
if (item?.childrens?.length) {
|
169
|
+
this.applySelectionToChildren(item, event.value, item[this.valueField()]);
|
170
|
+
}
|
171
|
+
this.updateParentSelection(item, event.value);
|
172
|
+
break;
|
173
|
+
default:
|
174
|
+
break;
|
175
|
+
}
|
176
|
+
}
|
177
|
+
if (event.isUserInteraction) {
|
178
|
+
const result = this.findSelectedNodes(this.itemsSignal());
|
179
|
+
this.onSelectionChange.emit({
|
180
|
+
component: this,
|
181
|
+
data: result,
|
182
|
+
nativeElement: this.nativeElement,
|
183
|
+
});
|
184
|
+
this.onItemClick.emit({ component: this, data: item, nativeElement: this.nativeElement });
|
185
|
+
}
|
186
|
+
}
|
187
|
+
/**
|
188
|
+
*
|
189
|
+
* auto expand
|
190
|
+
*
|
191
|
+
*/
|
192
|
+
toggleExpand(item) {
|
193
|
+
if (!item.isExpanded) {
|
194
|
+
item.isExpanded = true;
|
195
|
+
}
|
196
|
+
}
|
197
|
+
/**
|
198
|
+
*
|
199
|
+
* expand and change value parent change
|
200
|
+
*
|
201
|
+
*/
|
202
|
+
expandAndToggleSelection(item, selected) {
|
203
|
+
this.toggleExpand(item);
|
204
|
+
if (item.childrens?.length) {
|
205
|
+
this.applySelectionToChildren(item, selected, item[this.valueField()]);
|
206
|
+
}
|
207
|
+
}
|
208
|
+
applySelectionToChildren(item, isSelected, parentId) {
|
209
|
+
item.childrens.forEach((child) => {
|
210
|
+
child.parentId = parentId;
|
211
|
+
child.selected = isSelected;
|
212
|
+
if (child.childrens?.length) {
|
213
|
+
this.applySelectionToChildren(child, isSelected, child.id);
|
214
|
+
}
|
215
|
+
});
|
216
|
+
}
|
217
|
+
/**
|
218
|
+
*
|
219
|
+
* indeterminate logic
|
220
|
+
*
|
221
|
+
*/
|
222
|
+
updateParentSelection(item, selected) {
|
223
|
+
item.selected = selected;
|
224
|
+
let parent = this.findParent(item, this.itemsSignal());
|
225
|
+
while ((parent && parent.selected != false) || (parent && item.selected)) {
|
226
|
+
const allSelected = parent?.childrens?.every((child) => child.selected);
|
227
|
+
const someSelected = parent?.childrens?.some((child) => child.selected || child.indeterminate);
|
228
|
+
if (!allSelected && !someSelected) {
|
229
|
+
parent.selected = false;
|
230
|
+
parent.indeterminate = null;
|
231
|
+
}
|
232
|
+
else if (!allSelected) {
|
233
|
+
parent.indeterminate = true;
|
234
|
+
parent.selected = null;
|
235
|
+
}
|
236
|
+
else if (allSelected) {
|
237
|
+
parent.selected = true;
|
238
|
+
parent.indeterminate = false;
|
239
|
+
}
|
240
|
+
else {
|
241
|
+
parent.indeterminate = false;
|
242
|
+
parent.selected = true;
|
243
|
+
}
|
244
|
+
parent = this.findParent(parent, this.itemsSignal());
|
245
|
+
}
|
246
|
+
}
|
247
|
+
findParent(item, nodes) {
|
248
|
+
for (let node of nodes) {
|
249
|
+
if (node.childrens?.includes(item)) {
|
250
|
+
return node;
|
251
|
+
}
|
252
|
+
else if (node.childrens) {
|
253
|
+
const parent = this.findParent(item, node.childrens);
|
254
|
+
if (parent)
|
255
|
+
return parent;
|
256
|
+
}
|
257
|
+
}
|
258
|
+
return null;
|
259
|
+
}
|
260
|
+
/**
|
261
|
+
*
|
262
|
+
* find node selected true for emit Selections
|
263
|
+
*
|
264
|
+
*/
|
265
|
+
findSelectedNodes(nodes) {
|
266
|
+
let selectedNodes = [];
|
267
|
+
nodes.forEach((node) => {
|
268
|
+
if (node.selected) {
|
269
|
+
selectedNodes.push(node);
|
270
|
+
}
|
271
|
+
if (node.childrens) {
|
272
|
+
selectedNodes = selectedNodes.concat(this.findSelectedNodes(node.childrens));
|
273
|
+
}
|
274
|
+
});
|
275
|
+
return selectedNodes;
|
276
|
+
}
|
277
|
+
/**
|
278
|
+
*
|
279
|
+
* find for emit Selections single mode
|
280
|
+
*
|
281
|
+
*/
|
282
|
+
handleUnSelectNode(items) {
|
283
|
+
items.forEach((child) => {
|
284
|
+
child.selected = false;
|
285
|
+
if (child?.childrens?.length) {
|
286
|
+
this.handleUnSelectNode(child.childrens);
|
287
|
+
}
|
288
|
+
});
|
289
|
+
}
|
290
|
+
/**
|
291
|
+
*
|
292
|
+
* lazy load logic
|
293
|
+
*
|
294
|
+
*/
|
295
|
+
fetchData(parentId) {
|
296
|
+
this.itemsPromise({ parentId })
|
297
|
+
.then((data) => {
|
298
|
+
if (Array.isArray(data)) {
|
299
|
+
if (parentId) {
|
300
|
+
this.findNode(parentId, data, this.itemsSignal());
|
301
|
+
}
|
302
|
+
else {
|
303
|
+
this.itemsSignal.set(data);
|
304
|
+
}
|
305
|
+
}
|
306
|
+
})
|
307
|
+
.finally(() => {
|
308
|
+
this.setNodeLoading(parentId, false);
|
309
|
+
});
|
310
|
+
}
|
311
|
+
findNode(parentId, _children, source) {
|
312
|
+
if (source.length) {
|
313
|
+
source.forEach((element) => {
|
314
|
+
if (element[this.valueField()] == parentId) {
|
315
|
+
element.childrens = _children;
|
316
|
+
}
|
317
|
+
else {
|
318
|
+
if (element?.childrens)
|
319
|
+
this.findNode(parentId, _children, element.childrens);
|
320
|
+
}
|
321
|
+
});
|
322
|
+
}
|
323
|
+
}
|
324
|
+
/**
|
325
|
+
*
|
326
|
+
* emit when arrow click
|
327
|
+
*
|
328
|
+
*/
|
329
|
+
handleNodeExpandClick(node) {
|
330
|
+
const parentId = node.data.id;
|
331
|
+
if (this.itemsPromise && node.data.isExpanded && !node?.data.childrens?.length) {
|
332
|
+
this.fetchData(parentId);
|
333
|
+
this.setNodeLoading(node.data.id, true);
|
334
|
+
}
|
335
|
+
this.onItemClick.emit({ component: this, data: node.data, nativeElement: this.nativeElement });
|
336
|
+
}
|
337
|
+
handleNodeClick(node) {
|
338
|
+
if (node.data[this.disableField()]) {
|
339
|
+
return;
|
340
|
+
}
|
341
|
+
if (this.showActiveNode()) {
|
342
|
+
this.handleUnActiveNode(this.itemsSignal());
|
343
|
+
node.data.active = true;
|
344
|
+
}
|
345
|
+
///to do
|
346
|
+
// switch (this.selectionBehavior()) {
|
347
|
+
// case 'activeAndSelect':
|
348
|
+
// if (this.selectionMode() === 'single') {
|
349
|
+
// this.handleUnselectNode(this.itemsSignal());
|
350
|
+
// }
|
351
|
+
// node.selected = true;
|
352
|
+
// break;
|
353
|
+
// default:
|
354
|
+
// break;
|
355
|
+
// }
|
356
|
+
this.onNodeClick.emit({ component: this, data: node.data, nativeElement: this.nativeElement });
|
357
|
+
}
|
358
|
+
handleUnActiveNode(unActiveSource) {
|
359
|
+
unActiveSource.forEach((child) => {
|
360
|
+
child.active = false;
|
361
|
+
if (child?.childrens?.length) {
|
362
|
+
this.handleUnActiveNode(child.childrens);
|
363
|
+
}
|
364
|
+
});
|
365
|
+
}
|
366
|
+
handleNodeDbClick(node) {
|
367
|
+
if (this.itemsPromise) {
|
368
|
+
const nodeParentId = node.data.id;
|
369
|
+
this.fetchData(nodeParentId);
|
370
|
+
this.setNodeLoading(node.data.id, true);
|
371
|
+
}
|
372
|
+
}
|
373
|
+
isNodeLoading(nodeId) {
|
374
|
+
return this.loadingState()[nodeId] || false;
|
375
|
+
}
|
376
|
+
setNodeLoading(nodeId, isLoading) {
|
377
|
+
this.loadingState.update((state) => ({
|
378
|
+
...state,
|
379
|
+
[nodeId]: isLoading,
|
380
|
+
}));
|
381
|
+
}
|
382
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXTreeViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
383
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: AXTreeViewComponent, selector: "ax-tree-view", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selectionBehavior: { classPropertyName: "selectionBehavior", publicName: "selectionBehavior", isSignal: true, isRequired: false, transformFunction: null }, valueField: { classPropertyName: "valueField", publicName: "valueField", isSignal: true, isRequired: false, transformFunction: null }, textField: { classPropertyName: "textField", publicName: "textField", isSignal: true, isRequired: false, transformFunction: null }, visibleField: { classPropertyName: "visibleField", publicName: "visibleField", isSignal: true, isRequired: false, transformFunction: null }, disableField: { classPropertyName: "disableField", publicName: "disableField", isSignal: true, isRequired: false, transformFunction: null }, hasChildField: { classPropertyName: "hasChildField", publicName: "hasChildField", isSignal: true, isRequired: false, transformFunction: null }, iconField: { classPropertyName: "iconField", publicName: "iconField", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSelectionChange: "onSelectionChange", onItemClick: "onItemClick", onNodeClick: "onNodeClick" }, usesInheritance: true, ngImport: i0, template: "@for (node of resolvedItems; track $index) {\n <ng-container [ngTemplateOutlet]=\"Recursion\" [ngTemplateOutletContext]=\"{ $implicit: node }\"></ng-container>\n}\n\n<ng-template #Recursion let-item>\n @if (item[visibleField()] !== false) {\n <ax-tree-view-item\n [item]=\"item\"\n [(isExpanded)]=\"item.isExpanded\"\n [(isActive)]=\"item.active\"\n [isLoading]=\"isNodeLoading(item.id)\"\n [disableField]=\"disableField()\"\n [hasChildField]=\"hasChildField()\"\n (onNodeExpand)=\"handleNodeExpandClick($event)\"\n (onNodeClick)=\"handleNodeClick($event)\"\n (onNodeDbClick)=\"handleNodeDbClick($event)\"\n >\n @if (this.selectable()) {\n <ax-check-box\n [disabled]=\"item[disableField()]\"\n [indeterminate]=\"item.indeterminate\"\n [(ngModel)]=\"item.selected\"\n (onValueChanged)=\"handleNodeSelectionClick($event, item)\"\n ></ax-check-box>\n }\n <ax-prefix>\n @if (item[iconField()]) {\n <ax-icon [icon]=\"item[iconField()]\"></ax-icon>\n } @else {\n <i></i>\n }\n </ax-prefix>\n @if (item[textField()]) {\n <ax-text>{{ item[textField()] }}</ax-text>\n }\n\n <ax-suffix></ax-suffix>\n @for (child of item?.childrens; track $index) {\n <ng-container\n [ngTemplateOutlet]=\"Recursion\"\n [ngTemplateOutletContext]=\"{ $implicit: child }\"\n ></ng-container>\n }\n </ax-tree-view-item>\n }\n</ng-template>\n", styles: ["ax-tree-view ax-tree-view-item .ax-tree-view-container{display:flex;align-items:center;margin-bottom:.125rem;cursor:pointer}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-checkbox-end-side{display:none!important}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-arrow{font-size:.875rem!important}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items{display:flex;align-items:center;gap:.5rem}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix{display:flex;align-items:center;gap:.5rem;padding:.375rem;padding-inline-end:.5rem!important;border-radius:.25rem}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.noselect-tree-view{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.ax-state-tree-view-active{background-color:rgba(var(--ax-color-primary-500));color:#fff}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.ax-state-tree-view-active:hover{background-color:rgba(var(--ax-color-primary-500))}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix:hover{background-color:rgba(var(--ax-color-on-surface))}ax-tree-view ax-tree-view-item .ax-state-tree-view-rtl{padding-inline-end:.5rem}ax-tree-view ax-tree-view-item .ax-state-tree-view-ltr{padding-inline-start:.5rem}ax-tree-view ax-tree-view-item .ax-state-disabled{cursor:not-allowed!important;opacity:.5!important}ax-tree-view ax-tree-view-item .arrow-container{position:relative;display:flex;align-items:center}ax-tree-view ax-tree-view-item .vertical-line{width:.125rem;height:100%;background-color:#ccc;position:absolute;bottom:-10px;left:50%;transform:translate(-50%)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i3.AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "checked", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXTreeViewItemComponent, selector: "ax-tree-view-item", inputs: ["item", "isExpanded", "hasChildField", "isActive", "isLoading", "disableField"], outputs: ["onNodeExpand", "onNodeClick", "isExpandedChange", "isActiveChange", "onNodeDbClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
384
|
+
}
|
385
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXTreeViewComponent, decorators: [{
|
386
|
+
type: Component,
|
387
|
+
args: [{ selector: 'ax-tree-view', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (node of resolvedItems; track $index) {\n <ng-container [ngTemplateOutlet]=\"Recursion\" [ngTemplateOutletContext]=\"{ $implicit: node }\"></ng-container>\n}\n\n<ng-template #Recursion let-item>\n @if (item[visibleField()] !== false) {\n <ax-tree-view-item\n [item]=\"item\"\n [(isExpanded)]=\"item.isExpanded\"\n [(isActive)]=\"item.active\"\n [isLoading]=\"isNodeLoading(item.id)\"\n [disableField]=\"disableField()\"\n [hasChildField]=\"hasChildField()\"\n (onNodeExpand)=\"handleNodeExpandClick($event)\"\n (onNodeClick)=\"handleNodeClick($event)\"\n (onNodeDbClick)=\"handleNodeDbClick($event)\"\n >\n @if (this.selectable()) {\n <ax-check-box\n [disabled]=\"item[disableField()]\"\n [indeterminate]=\"item.indeterminate\"\n [(ngModel)]=\"item.selected\"\n (onValueChanged)=\"handleNodeSelectionClick($event, item)\"\n ></ax-check-box>\n }\n <ax-prefix>\n @if (item[iconField()]) {\n <ax-icon [icon]=\"item[iconField()]\"></ax-icon>\n } @else {\n <i></i>\n }\n </ax-prefix>\n @if (item[textField()]) {\n <ax-text>{{ item[textField()] }}</ax-text>\n }\n\n <ax-suffix></ax-suffix>\n @for (child of item?.childrens; track $index) {\n <ng-container\n [ngTemplateOutlet]=\"Recursion\"\n [ngTemplateOutletContext]=\"{ $implicit: child }\"\n ></ng-container>\n }\n </ax-tree-view-item>\n }\n</ng-template>\n", styles: ["ax-tree-view ax-tree-view-item .ax-tree-view-container{display:flex;align-items:center;margin-bottom:.125rem;cursor:pointer}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-checkbox-end-side{display:none!important}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-arrow{font-size:.875rem!important}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items{display:flex;align-items:center;gap:.5rem}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix{display:flex;align-items:center;gap:.5rem;padding:.375rem;padding-inline-end:.5rem!important;border-radius:.25rem}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.noselect-tree-view{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.ax-state-tree-view-active{background-color:rgba(var(--ax-color-primary-500));color:#fff}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.ax-state-tree-view-active:hover{background-color:rgba(var(--ax-color-primary-500))}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix:hover{background-color:rgba(var(--ax-color-on-surface))}ax-tree-view ax-tree-view-item .ax-state-tree-view-rtl{padding-inline-end:.5rem}ax-tree-view ax-tree-view-item .ax-state-tree-view-ltr{padding-inline-start:.5rem}ax-tree-view ax-tree-view-item .ax-state-disabled{cursor:not-allowed!important;opacity:.5!important}ax-tree-view ax-tree-view-item .arrow-container{position:relative;display:flex;align-items:center}ax-tree-view ax-tree-view-item .vertical-line{width:.125rem;height:100%;background-color:#ccc;position:absolute;bottom:-10px;left:50%;transform:translate(-50%)}\n"] }]
|
388
|
+
}], ctorParameters: () => [] });
|
389
|
+
|
390
|
+
class AXTreeViewModule {
|
391
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXTreeViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
392
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.0", ngImport: i0, type: AXTreeViewModule, declarations: [AXTreeViewComponent, AXTreeViewItemComponent], imports: [CommonModule,
|
393
|
+
AXCommonModule,
|
394
|
+
AXDecoratorModule,
|
395
|
+
AXCheckBoxModule,
|
396
|
+
AXFormModule,
|
397
|
+
FormsModule,
|
398
|
+
AXTooltipModule,
|
399
|
+
AXLoadingModule], exports: [AXTreeViewComponent, AXTreeViewItemComponent] }); }
|
400
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXTreeViewModule, imports: [CommonModule,
|
401
|
+
AXCommonModule,
|
402
|
+
AXDecoratorModule,
|
403
|
+
AXCheckBoxModule,
|
404
|
+
AXFormModule,
|
405
|
+
FormsModule,
|
406
|
+
AXTooltipModule,
|
407
|
+
AXLoadingModule] }); }
|
408
|
+
}
|
409
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXTreeViewModule, decorators: [{
|
410
|
+
type: NgModule,
|
411
|
+
args: [{
|
412
|
+
imports: [
|
413
|
+
CommonModule,
|
414
|
+
AXCommonModule,
|
415
|
+
AXDecoratorModule,
|
416
|
+
AXCheckBoxModule,
|
417
|
+
AXFormModule,
|
418
|
+
FormsModule,
|
419
|
+
AXTooltipModule,
|
420
|
+
AXLoadingModule,
|
421
|
+
],
|
422
|
+
exports: [AXTreeViewComponent, AXTreeViewItemComponent],
|
423
|
+
declarations: [AXTreeViewComponent, AXTreeViewItemComponent],
|
424
|
+
providers: [],
|
425
|
+
}]
|
426
|
+
}] });
|
427
|
+
|
428
|
+
/**
|
429
|
+
* Generated bundle index. Do not edit.
|
430
|
+
*/
|
431
|
+
|
432
|
+
export { AXTreeViewComponent, AXTreeViewItemComponent, AXTreeViewModule };
|
433
|
+
//# sourceMappingURL=acorex-components-tree-view.mjs.map
|