@bootkit/ng0 0.0.0-alpha.31 → 0.0.0-alpha.33
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/components/dropdown/index.d.ts +47 -31
- package/components/list/index.d.ts +1 -0
- package/components/select/index.d.ts +7 -6
- package/components/sidenav/index.d.ts +95 -34
- package/fesm2022/bootkit-ng0-common.mjs +4 -4
- package/fesm2022/bootkit-ng0-components-accordion.mjs +12 -12
- package/fesm2022/bootkit-ng0-components-accordion.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-backdrop.mjs +7 -7
- package/fesm2022/bootkit-ng0-components-backdrop.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-button.mjs +8 -8
- package/fesm2022/bootkit-ng0-components-card.mjs +11 -11
- package/fesm2022/bootkit-ng0-components-code.mjs +7 -7
- package/fesm2022/bootkit-ng0-components-collapse.mjs +12 -12
- package/fesm2022/bootkit-ng0-components-collapse.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-confirmation.mjs +13 -13
- package/fesm2022/bootkit-ng0-components-confirmation.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-dropdown.mjs +55 -49
- package/fesm2022/bootkit-ng0-components-dropdown.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-form-field.mjs +8 -8
- package/fesm2022/bootkit-ng0-components-form-field.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-list.mjs +19 -18
- package/fesm2022/bootkit-ng0-components-list.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-modal.mjs +8 -8
- package/fesm2022/bootkit-ng0-components-modal.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-nav.mjs +23 -23
- package/fesm2022/bootkit-ng0-components-nav.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-offcanvas.mjs +8 -8
- package/fesm2022/bootkit-ng0-components-offcanvas.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-pagination.mjs +8 -8
- package/fesm2022/bootkit-ng0-components-pagination.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-popover.mjs +7 -7
- package/fesm2022/bootkit-ng0-components-popover.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-select.mjs +12 -11
- package/fesm2022/bootkit-ng0-components-select.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-sidenav.mjs +192 -64
- package/fesm2022/bootkit-ng0-components-sidenav.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-stepper.mjs +12 -12
- package/fesm2022/bootkit-ng0-components-stepper.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-table.mjs +15 -15
- package/fesm2022/bootkit-ng0-components-table.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-toast.mjs +6 -6
- package/fesm2022/bootkit-ng0-components-toast.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-tooltip.mjs +7 -7
- package/fesm2022/bootkit-ng0-components-tooltip.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-components-vertical-menu.mjs +22 -22
- package/fesm2022/bootkit-ng0-components-vertical-menu.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-form.mjs +29 -29
- package/fesm2022/bootkit-ng0-form.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-http.mjs +3 -3
- package/fesm2022/bootkit-ng0-layouts-layout1.mjs +13 -38
- package/fesm2022/bootkit-ng0-layouts-layout1.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-localization.mjs +153 -73
- package/fesm2022/bootkit-ng0-localization.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-platform-browser.mjs +7 -7
- package/fesm2022/bootkit-ng0-platform-browser.mjs.map +1 -1
- package/fesm2022/bootkit-ng0-routing.mjs +3 -3
- package/fesm2022/bootkit-ng0-script.mjs +3 -3
- package/fesm2022/bootkit-ng0-security.mjs +14 -14
- package/layouts/layout1/index.d.ts +16 -27
- package/localization/index.d.ts +63 -8
- package/package.json +19 -19
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bootkit-ng0-components-sidenav.mjs","sources":["../../../projects/ng0/components/sidenav/sidenav.component.ts","../../../projects/ng0/components/sidenav/sidenav.component.html","../../../projects/ng0/components/sidenav/sidenav-container.component.ts","../../../projects/ng0/components/sidenav/sidenav-container.component.html","../../../projects/ng0/components/sidenav/sidenav.module.ts","../../../projects/ng0/components/sidenav/bootkit-ng0-components-sidenav.ts"],"sourcesContent":["import { booleanAttribute, Component, ComponentRef, effect, ElementRef, EventEmitter, input, OnDestroy, OnInit, Output, Renderer2, ViewContainerRef } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SidenavMode, SidenavPosition } from './types';\r\nimport { BackdropComponent } from '@bootkit/ng0/components/backdrop';\r\n\r\n/**\r\n * This component is used to display a sidenav panel.\r\n * It can be positioned on the left or right side of the screen.\r\n * It can be opened or closed and can have a backdrop.\r\n */\r\n@Component({\r\n selector: 'ng0-sidenav',\r\n templateUrl: './sidenav.component.html',\r\n styleUrls: ['./sidenav.component.scss'],\r\n providers: [],\r\n standalone: true,\r\n imports: [\r\n CommonModule,\r\n ],\r\n host: {\r\n \"[style.width]\": \"sidenavWidth() + 'px'\",\r\n \"[style.z-index]\": \"zIndex()\",\r\n \"[class.ng0-sidenav-start]\": \"position() == 'start'\",\r\n \"[class.ng0-sidenav-end]\": \"position() == 'end'\",\r\n \"[class.ng0-sidenav-open]\": \"open()\",\r\n \"[class.ng0-sidenav-show-backdrop]\": \"true\",\r\n \"[class.ng0-sidenav-fixed]\": \"fixedInViewport()\",\r\n }\r\n})\r\nexport class SidenavComponent implements OnInit, OnDestroy {\r\n public open = input(true, { transform: booleanAttribute });\r\n public mode = input<SidenavMode>('push');\r\n public hasBackdrop = input(true, { transform: booleanAttribute });\r\n public zIndex = input<number>();\r\n public position = input<SidenavPosition>('start');\r\n public sidenavWidth = input.required<number>();\r\n public fixedInViewport = input(false, { transform: booleanAttribute });\r\n @Output() public backdropClick = new EventEmitter<MouseEvent>();\r\n private _backdropRef?: ComponentRef<BackdropComponent>;\r\n private _backdropClickHandlerUnlisten?: () => void;\r\n\r\n\r\n constructor(private _vcr: ViewContainerRef, private _elmentRef: ElementRef, private _renderer: Renderer2) {\r\n effect(() => {\r\n var hasBackdrop = this.hasBackdrop();\r\n var mode = this.mode();\r\n var open = this.open();\r\n\r\n if (mode == 'over' && hasBackdrop && open) {\r\n this._createBackdrop();\r\n } else {\r\n this._destroyBackdrop();\r\n }\r\n });\r\n }\r\n\r\n ngOnInit(): void {\r\n }\r\n\r\n private _createBackdrop() {\r\n this._backdropRef = this._vcr.createComponent(BackdropComponent);\r\n const backdropElm = this._backdropRef.location.nativeElement;\r\n this._backdropRef.instance.fixed.set(this.fixedInViewport());\r\n if (this.zIndex() != undefined) {\r\n this._renderer.setStyle(backdropElm, 'z-index', this.zIndex());\r\n }\r\n this._backdropClickHandlerUnlisten = this._renderer.listen(backdropElm, 'click', (e) => {\r\n this.backdropClick.emit(e);\r\n });\r\n\r\n // Move backdrop element before Host element\r\n const hostElm = this._elmentRef.nativeElement;\r\n const parentElm = hostElm.parentNode;\r\n this._renderer.insertBefore(parentElm, backdropElm, hostElm);\r\n }\r\n\r\n private _destroyBackdrop() {\r\n this._backdropClickHandlerUnlisten?.();\r\n this._backdropRef?.destroy();\r\n\r\n this._backdropClickHandlerUnlisten = undefined;\r\n this._backdropRef = undefined;\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this._destroyBackdrop();\r\n }\r\n}\r\n","<ng-content></ng-content>\r\n\r\n<!-- @if(open() && mode() == 'over' && hasBackdrop()) {\r\n<div class=\"ng0-sidenav-backdrop\"></div>\r\n} -->","import { Component, computed, ContentChildren, EventEmitter, HostBinding, OnInit, Output, QueryList } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SidenavComponent } from './sidenav.component';\r\n\r\n/**\r\n * This component is used to contain multiple sidenav components and manage their layout.\r\n */\r\n@Component({\r\n selector: 'ng0-sidenav-container',\r\n templateUrl: './sidenav-container.component.html',\r\n styleUrls: ['./sidenav-container.component.scss'],\r\n providers: [],\r\n standalone: true,\r\n imports: [\r\n CommonModule,\r\n ],\r\n host: {\r\n \"[style.padding-inline-start]\": \"_contentPaddingStart()\",\r\n \"[style.padding-inline-end]\": \"_contentPaddingEnd()\",\r\n }\r\n})\r\nexport class SidenavContainerComponent implements OnInit {\r\n\r\n @Output() backdropClick = new EventEmitter();\r\n @ContentChildren(SidenavComponent) protected _sidenavs!: QueryList<SidenavComponent>;\r\n\r\n protected _contentPaddingStart = computed(() => {\r\n let widths = this._sidenavs.filter(x => x.open() && x.position() == 'start' && x.mode() == 'push').map(x => x.sidenavWidth());\r\n return widths.length == 0 ? '0' : `${Math.max(...widths)}px`;\r\n });\r\n\r\n protected _contentPaddingEnd = computed(() => {\r\n let widths = this._sidenavs.filter(x => x.open() && x.position() == 'end' && x.mode() == 'push').map(x => x.sidenavWidth());\r\n return widths.length == 0 ? '0' : `${Math.max(...widths)}px`;\r\n });\r\n\r\n constructor() {\r\n }\r\n\r\n ngOnInit(): void {\r\n\r\n }\r\n}\r\n","<ng-content></ng-content>\r\n","import { NgModule } from '@angular/core';\r\nimport { SidenavContainerComponent } from './sidenav-container.component';\r\nimport { SidenavComponent } from './sidenav.component';\r\n\r\n/**\r\n * This module is used to contain the sidenav components and provide their functionality.\r\n */\r\n@NgModule({\r\n imports: [\r\n SidenavContainerComponent,\r\n SidenavComponent\r\n ],\r\n exports: [\r\n SidenavContainerComponent,\r\n SidenavComponent\r\n ]\r\n})\r\nexport class SidenavModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"bootkit-ng0-components-sidenav.mjs","sources":["../../../projects/ng0/components/sidenav/sidenav.component.ts","../../../projects/ng0/components/sidenav/sidenav-container.component.ts","../../../projects/ng0/components/sidenav/sidenav-container.component.html","../../../projects/ng0/components/sidenav/sidenav-content.component.ts","../../../projects/ng0/components/sidenav/sidenav.module.ts","../../../projects/ng0/components/sidenav/bootkit-ng0-components-sidenav.ts"],"sourcesContent":["import { booleanAttribute, numberAttribute, Component, ComponentRef, effect, ElementRef, EventEmitter, input, OnDestroy, Output, Renderer2, ViewContainerRef, inject, ChangeDetectionStrategy, ViewEncapsulation, PLATFORM_ID } from '@angular/core';\r\nimport { SidenavMode, SidenavPosition } from './types';\r\nimport { BackdropComponent } from '@bootkit/ng0/components/backdrop';\r\nimport { isPlatformServer } from '@angular/common';\r\nimport { SidenavContainerComponent } from './sidenav-container.component';\r\nimport { Observable, Subscription, throttleTime } from 'rxjs';\r\n\r\n/**\r\n * A sidenav component that displays a sliding navigation panel.\r\n */\r\n@Component({\r\n selector: 'ng0-sidenav',\r\n template: `<ng-content></ng-content>`,\r\n styleUrls: ['./sidenav.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n host: {\r\n \"[style.width]\": \"position() == 'start' || position() == 'end' ? _getFixedSize() : undefined\",\r\n \"[style.height]\": \"undefined\",\r\n \"[style.z-index]\": \"zIndex()\",\r\n \"[class.ng0-sidenav-start]\": \"position() == 'start'\",\r\n \"[class.ng0-sidenav-end]\": \"position() == 'end'\",\r\n \"[class.ng0-sidenav-top]\": \"position() == 'top'\",\r\n \"[class.ng0-sidenav-bottom]\": \"position() == 'bottom'\",\r\n \"[class.ng0-sidenav-open]\": \"open()\",\r\n \"[class.ng0-sidenav-small]\": \"size() == 'small'\",\r\n \"[class.ng0-sidenav-medium]\": \"size() == 'medium'\",\r\n \"[class.ng0-sidenav-large]\": \"size() == 'large'\",\r\n \"[class.ng0-sidenav-full]\": \"size() == 'full'\",\r\n \"[class.ng0-sidenav-fixed]\": \"fixedInViewport()\",\r\n }\r\n})\r\nexport class SidenavComponent implements OnDestroy {\r\n private _sidenavContainer = inject(SidenavContainerComponent);\r\n private _vcr = inject(ViewContainerRef);\r\n private _renderer = inject(Renderer2);\r\n private _backdropRef?: ComponentRef<BackdropComponent>;\r\n private _backdropClickHandlerUnlisten?: () => void;\r\n private _platformId = inject(PLATFORM_ID);\r\n protected _isPlatformServer = isPlatformServer(this._platformId)\r\n private _resizeSubscription?: Subscription;\r\n private readonly _elementRef = inject(ElementRef<HTMLElement>);\r\n\r\n /**\r\n * Whether the sidenav is open.\r\n */\r\n public open = input(false, { transform: booleanAttribute });\r\n\r\n /**\r\n * Sidenav mode.\r\n * Determines how the sidenav is displayed.\r\n * Can be either 'push' or 'over'.\r\n * - 'push': The content is pushed aside to make room for the sidenav.\r\n * - 'over': The sidenav is displayed on top of the content.\r\n */\r\n public mode = input<SidenavMode>('push');\r\n\r\n /**\r\n * Whether the sidenav has a backdrop.\r\n * The backdrop is shown only when the sidenav is open and mode is 'over'.\r\n */\r\n public hasBackdrop = input(true, { transform: booleanAttribute });\r\n\r\n /**\r\n * Sidenav z-index.\r\n * Determines the stack order of the sidenav.\r\n */\r\n public zIndex = input(undefined, { transform: numberAttribute });\r\n\r\n /**\r\n * Sidenav position.\r\n * Determines the position of the sidenav.\r\n * Can be either 'start', 'end', 'top', or 'bottom'.\r\n */\r\n public position = input<SidenavPosition>('start');\r\n\r\n /**\r\n * Sidenav size.\r\n * Determines the size of the sidenav. \r\n * Can be either 'small', 'medium', 'large', 'full', or a specific value. \r\n * If a specific value is provided, it will be used as the width/height of the sidenav.\r\n * @example\r\n * - 100, '300px', '50%', '50vh', 'small', 'full', ...\r\n */\r\n public size = input<number | string | 'small' | 'medium' | 'large' | 'full' | undefined>();\r\n\r\n /**\r\n * Whether the sidenav is fixed in the viewport.\r\n */\r\n public fixedInViewport = input(false, { transform: booleanAttribute });\r\n\r\n public elmentRef = inject(ElementRef);\r\n\r\n /**\r\n * Emits when the backdrop is clicked.\r\n */\r\n @Output() public backdropClick = new EventEmitter<MouseEvent>();\r\n\r\n constructor() {\r\n effect(() => {\r\n var hasBackdrop = this.hasBackdrop();\r\n var mode = this.mode();\r\n var open = this.open();\r\n\r\n if (mode == 'over' && hasBackdrop && open) {\r\n this._createBackdrop();\r\n } else {\r\n this._destroyBackdrop();\r\n }\r\n });\r\n\r\n if (!this._isPlatformServer) {\r\n this._observeResize()\r\n .pipe(throttleTime(100, undefined, { leading: true, trailing: true }))\r\n .subscribe(entries => {\r\n this._sidenavContainer.changeDetectorRef.markForCheck();\r\n // console.log('Resized to:', entries[0].contentRect.width, entries[0].contentRect.height);\r\n });\r\n }\r\n }\r\n\r\n _getFixedSize(): string | undefined {\r\n let size = this.size();\r\n let t = typeof size;\r\n if (t == 'string') {\r\n return ['small', 'medium', 'large', 'full'].includes(size as string) ? undefined : size as string;\r\n } else if (t == 'number') {\r\n return `${size}px`;\r\n } else {\r\n return undefined;\r\n }\r\n };\r\n\r\n private _observeResize(): Observable<ResizeObserverEntry[]> {\r\n return new Observable(observer => {\r\n const resizeObserver = new ResizeObserver(entries => observer.next(entries));\r\n resizeObserver.observe(this._elementRef.nativeElement);\r\n return () => resizeObserver.disconnect();\r\n });\r\n }\r\n\r\n private _createBackdrop() {\r\n this._backdropRef = this._vcr.createComponent(BackdropComponent);\r\n const backdropElm = this._backdropRef.location.nativeElement;\r\n this._backdropRef.instance.fixed.set(this.fixedInViewport());\r\n if (this.zIndex() != undefined) {\r\n this._renderer.setStyle(backdropElm, 'z-index', this.zIndex());\r\n }\r\n this._backdropClickHandlerUnlisten = this._renderer.listen(backdropElm, 'click', (e) => {\r\n this.backdropClick.emit(e);\r\n });\r\n\r\n // Move backdrop element before Host element\r\n const hostElm = this.elmentRef.nativeElement;\r\n const parentElm = hostElm.parentNode;\r\n this._renderer.insertBefore(parentElm, backdropElm, hostElm);\r\n }\r\n\r\n private _destroyBackdrop() {\r\n this._backdropClickHandlerUnlisten?.();\r\n this._backdropRef?.destroy();\r\n\r\n this._backdropClickHandlerUnlisten = undefined;\r\n this._backdropRef = undefined;\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this._destroyBackdrop();\r\n this._resizeSubscription?.unsubscribe();\r\n }\r\n}\r\n","import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, EventEmitter, inject, Output, PLATFORM_ID, QueryList, ViewEncapsulation } from '@angular/core';\r\nimport { isPlatformServer } from '@angular/common';\r\nimport { SidenavComponent } from './sidenav.component';\r\nimport { SidenavPosition } from './types';\r\n\r\n/**\r\n * Sidenav container component\r\n */\r\n@Component({\r\n selector: 'ng0-sidenav-container',\r\n templateUrl: './sidenav-container.component.html',\r\n styleUrls: ['./sidenav-container.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n host: {\r\n \"[style.padding-inline-start]\": \"_getPadding('start')\",\r\n \"[style.padding-inline-end]\": \"_getPadding('end')\",\r\n \"[style.padding-top]\": \"_getPadding('top')\",\r\n \"[style.padding-bottom]\": \"_getPadding('bottom')\",\r\n \"[class.ng0-sidenav-transition]\": \"_isTransitionEnabled\",\r\n \"[class.ng0-sidenav-content-hidden]\": \"!_canComputePadding()\",\r\n }\r\n})\r\nexport class SidenavContainerComponent implements AfterViewInit {\r\n private _platformId = inject(PLATFORM_ID);\r\n protected _isPlatformServer = isPlatformServer(this._platformId)\r\n protected _isTransitionEnabled = false;\r\n @ContentChildren(SidenavComponent) protected _sidenavs!: QueryList<SidenavComponent>;\r\n\r\n /**\r\n * Emitted when the backdrop is clicked.\r\n */\r\n @Output() public backdropClick = new EventEmitter();\r\n\r\n public changeDetectorRef = inject(ChangeDetectorRef);\r\n\r\n protected _getPadding(position: SidenavPosition) {\r\n let openSidenavs = this._sidenavs.filter(x => x.open() && x.mode() == 'push');\r\n let filteredSidenavs = openSidenavs.filter(x => x.position() == position);\r\n if(filteredSidenavs.length == 0) return undefined;\r\n\r\n if (this._isPlatformServer) {\r\n let hasDynamicSidenavs = openSidenavs.some(x => x._getFixedSize() == undefined);\r\n if (hasDynamicSidenavs) {\r\n // we cannot compute padding on the server\r\n return undefined;\r\n } else {\r\n let fixedSizes = filteredSidenavs.map(x => x._getFixedSize());\r\n return fixedSizes.length > 1 ? `max(${fixedSizes.join(', ')})` : fixedSizes[0];\r\n }\r\n } else {\r\n let horizontal = position == 'start' || position == 'end';\r\n let sizes = filteredSidenavs.map(x => horizontal ? x.elmentRef.nativeElement.clientWidth : x.elmentRef.nativeElement.clientHeight);\r\n return `${Math.max(...sizes)}px`;\r\n }\r\n };\r\n\r\n ngAfterViewInit() {\r\n if (!this._isPlatformServer) {\r\n setTimeout(() => this._isTransitionEnabled = true);\r\n }\r\n }\r\n\r\n // In some modes the content is pushed based on the width of the opened sidenavs, however on\r\n // the server we can't measure the sidenav-container padding, so the padding is always zero. This can cause the\r\n // content to jump around when it's rendered on the server and hydrated on the client.\r\n // We avoid it by hiding the content on the initial render and then showing it once the sidenav\r\n // has been measured on the client.\r\n protected _canComputePadding() {\r\n if (this._isPlatformServer) {\r\n let hasDynamicSizenavs = this._sidenavs.some(x => x.open() && x.mode() == 'push' && x._getFixedSize() == undefined);\r\n return !hasDynamicSizenavs;\r\n }\r\n\r\n return true;\r\n }\r\n}\r\n","<ng-content select=\"ng0-sidenav-content\"></ng-content>\r\n<ng-content></ng-content>","import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';\r\n\r\n/**\r\n * Sidenav content component\r\n */\r\n@Component({\r\n selector: 'ng0-sidenav-content',\r\n template: `<ng-content></ng-content>`,\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n})\r\nexport class SidenavContentComponent {\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { SidenavContainerComponent } from './sidenav-container.component';\r\nimport { SidenavComponent } from './sidenav.component';\r\nimport { SidenavContentComponent } from './sidenav-content.component';\r\n\r\n/**\r\n * Sidenav module\r\n */\r\n@NgModule({\r\n imports: [\r\n SidenavContainerComponent,\r\n SidenavComponent,\r\n SidenavContentComponent\r\n ],\r\n exports: [\r\n SidenavContainerComponent,\r\n SidenavComponent,\r\n SidenavContentComponent\r\n ]\r\n})\r\nexport class SidenavModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -10,25 +10,25 @@ class StepDirective {
|
|
|
10
10
|
constructor(templateRef) {
|
|
11
11
|
this.templateRef = templateRef;
|
|
12
12
|
}
|
|
13
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
14
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.
|
|
13
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: StepDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
14
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.9", type: StepDirective, isStandalone: true, selector: "[ng0Step]", inputs: { id: { classPropertyName: "id", publicName: "iscStep", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["ng0Step"], ngImport: i0 });
|
|
15
15
|
}
|
|
16
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
16
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: StepDirective, decorators: [{
|
|
17
17
|
type: Directive,
|
|
18
18
|
args: [{
|
|
19
19
|
selector: '[ng0Step]',
|
|
20
20
|
exportAs: 'ng0Step',
|
|
21
21
|
standalone: true
|
|
22
22
|
}]
|
|
23
|
-
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
23
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "iscStep", required: true }] }] } });
|
|
24
24
|
|
|
25
25
|
class StepperComponent {
|
|
26
26
|
step = model.required(...(ngDevMode ? [{ debugName: "step" }] : []));
|
|
27
27
|
_steps;
|
|
28
28
|
constructor() {
|
|
29
29
|
}
|
|
30
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
31
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
30
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: StepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
31
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: StepperComponent, isStandalone: true, selector: "ng0-stepper", inputs: { step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { step: "stepChange" }, queries: [{ propertyName: "_steps", predicate: StepDirective }], exportAs: ["ng0Stepper"], ngImport: i0, template: "@for(s of _steps; track s.id(); let index = $index) {\r\n@let show=s.id() === step();\r\n\r\n<div [@stepAnimation]=\"show ? 'show' : 'hide'\" [class.d-none]=\"!show\">\r\n @if(show) {\r\n <ng-container [ngTemplateOutlet]=\"s.templateRef\"></ng-container>\r\n }\r\n</div>\r\n}", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
|
|
32
32
|
trigger('stepAnimation', [
|
|
33
33
|
state('hide', style({
|
|
34
34
|
opacity: 0,
|
|
@@ -42,7 +42,7 @@ class StepperComponent {
|
|
|
42
42
|
])
|
|
43
43
|
] });
|
|
44
44
|
}
|
|
45
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
45
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: StepperComponent, decorators: [{
|
|
46
46
|
type: Component,
|
|
47
47
|
args: [{ selector: 'ng0-stepper', exportAs: 'ng0Stepper', standalone: true, imports: [
|
|
48
48
|
CommonModule
|
|
@@ -59,7 +59,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImpor
|
|
|
59
59
|
])
|
|
60
60
|
])
|
|
61
61
|
], template: "@for(s of _steps; track s.id(); let index = $index) {\r\n@let show=s.id() === step();\r\n\r\n<div [@stepAnimation]=\"show ? 'show' : 'hide'\" [class.d-none]=\"!show\">\r\n @if(show) {\r\n <ng-container [ngTemplateOutlet]=\"s.templateRef\"></ng-container>\r\n }\r\n</div>\r\n}", styles: [":host{display:block}\n"] }]
|
|
62
|
-
}], ctorParameters: () => [], propDecorators: { _steps: [{
|
|
62
|
+
}], ctorParameters: () => [], propDecorators: { step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: true }] }, { type: i0.Output, args: ["stepChange"] }], _steps: [{
|
|
63
63
|
type: ContentChildren,
|
|
64
64
|
args: [StepDirective]
|
|
65
65
|
}] } });
|
|
@@ -69,13 +69,13 @@ const items = [
|
|
|
69
69
|
StepDirective
|
|
70
70
|
];
|
|
71
71
|
class StepperModule {
|
|
72
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
73
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.
|
|
72
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: StepperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
73
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.9", ngImport: i0, type: StepperModule, imports: [StepperComponent,
|
|
74
74
|
StepDirective], exports: [StepperComponent,
|
|
75
75
|
StepDirective] });
|
|
76
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.
|
|
76
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: StepperModule, imports: [StepperComponent] });
|
|
77
77
|
}
|
|
78
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
78
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: StepperModule, decorators: [{
|
|
79
79
|
type: NgModule,
|
|
80
80
|
args: [{
|
|
81
81
|
imports: items,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bootkit-ng0-components-stepper.mjs","sources":["../../../projects/ng0/components/stepper/step.directive.ts","../../../projects/ng0/components/stepper/stepper.component.ts","../../../projects/ng0/components/stepper/stepper.component.html","../../../projects/ng0/components/stepper/stepper.module.ts","../../../projects/ng0/components/stepper/bootkit-ng0-components-stepper.ts"],"sourcesContent":["import { Directive, input, TemplateRef } from '@angular/core';\r\n\r\n@Directive({\r\n selector: '[ng0Step]',\r\n exportAs: 'ng0Step',\r\n standalone: true\r\n})\r\nexport class StepDirective {\r\n public id = input.required<any>({alias: 'iscStep'});\r\n\r\n constructor(public readonly templateRef: TemplateRef<any>) {\r\n }\r\n}\r\n","import { Component, ContentChildren, QueryList, model } from '@angular/core';\r\nimport { StepDirective } from './step.directive';\r\nimport { CommonModule } from '@angular/common';\r\nimport { animate, state, style, transition, trigger } from '@angular/animations';\r\n\r\n@Component({\r\n selector: 'ng0-stepper',\r\n exportAs: 'ng0Stepper',\r\n templateUrl: './stepper.component.html',\r\n styles: `:host{display: block}`,\r\n standalone: true,\r\n imports: [\r\n CommonModule\r\n ],\r\n animations: [\r\n trigger('stepAnimation', [\r\n state('hide', style({\r\n opacity: 0,\r\n })),\r\n state('show', style({\r\n opacity: 1,\r\n })),\r\n transition('show <=> hide', [\r\n animate('.3s ease-out')\r\n ])\r\n ])\r\n ]\r\n})\r\nexport class StepperComponent {\r\n public step = model.required<any>();\r\n @ContentChildren(StepDirective) protected _steps!: QueryList<StepDirective>;\r\n\r\n constructor() {\r\n }\r\n}\r\n","@for(s of _steps; track s.id(); let index = $index) {\r\n@let show=s.id() === step();\r\n\r\n<div [@stepAnimation]=\"show ? 'show' : 'hide'\" [class.d-none]=\"!show\">\r\n @if(show) {\r\n <ng-container [ngTemplateOutlet]=\"s.templateRef\"></ng-container>\r\n }\r\n</div>\r\n}","import { NgModule } from '@angular/core';\r\nimport { StepDirective } from './step.directive';\r\nimport { StepperComponent } from './stepper.component';\r\n\r\nconst items = [\r\n StepperComponent,\r\n StepDirective\r\n];\r\n\r\n@NgModule({\r\n imports: items,\r\n exports: items\r\n})\r\nexport class StepperModule {\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"bootkit-ng0-components-stepper.mjs","sources":["../../../projects/ng0/components/stepper/step.directive.ts","../../../projects/ng0/components/stepper/stepper.component.ts","../../../projects/ng0/components/stepper/stepper.component.html","../../../projects/ng0/components/stepper/stepper.module.ts","../../../projects/ng0/components/stepper/bootkit-ng0-components-stepper.ts"],"sourcesContent":["import { Directive, input, TemplateRef } from '@angular/core';\r\n\r\n@Directive({\r\n selector: '[ng0Step]',\r\n exportAs: 'ng0Step',\r\n standalone: true\r\n})\r\nexport class StepDirective {\r\n public id = input.required<any>({alias: 'iscStep'});\r\n\r\n constructor(public readonly templateRef: TemplateRef<any>) {\r\n }\r\n}\r\n","import { Component, ContentChildren, QueryList, model } from '@angular/core';\r\nimport { StepDirective } from './step.directive';\r\nimport { CommonModule } from '@angular/common';\r\nimport { animate, state, style, transition, trigger } from '@angular/animations';\r\n\r\n@Component({\r\n selector: 'ng0-stepper',\r\n exportAs: 'ng0Stepper',\r\n templateUrl: './stepper.component.html',\r\n styles: `:host{display: block}`,\r\n standalone: true,\r\n imports: [\r\n CommonModule\r\n ],\r\n animations: [\r\n trigger('stepAnimation', [\r\n state('hide', style({\r\n opacity: 0,\r\n })),\r\n state('show', style({\r\n opacity: 1,\r\n })),\r\n transition('show <=> hide', [\r\n animate('.3s ease-out')\r\n ])\r\n ])\r\n ]\r\n})\r\nexport class StepperComponent {\r\n public step = model.required<any>();\r\n @ContentChildren(StepDirective) protected _steps!: QueryList<StepDirective>;\r\n\r\n constructor() {\r\n }\r\n}\r\n","@for(s of _steps; track s.id(); let index = $index) {\r\n@let show=s.id() === step();\r\n\r\n<div [@stepAnimation]=\"show ? 'show' : 'hide'\" [class.d-none]=\"!show\">\r\n @if(show) {\r\n <ng-container [ngTemplateOutlet]=\"s.templateRef\"></ng-container>\r\n }\r\n</div>\r\n}","import { NgModule } from '@angular/core';\r\nimport { StepDirective } from './step.directive';\r\nimport { StepperComponent } from './stepper.component';\r\n\r\nconst items = [\r\n StepperComponent,\r\n StepDirective\r\n];\r\n\r\n@NgModule({\r\n imports: items,\r\n exports: items\r\n})\r\nexport class StepperModule {\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;MAOa,aAAa,CAAA;AAGQ,IAAA,WAAA;AAFrB,IAAA,EAAE,GAAG,KAAK,CAAC,QAAQ,qCAAO,KAAK,EAAE,SAAS,EAAA,CAAA,GAAA,CAAjB,EAAC,KAAK,EAAE,SAAS,EAAC,GAAC;AAEnD,IAAA,WAAA,CAA4B,WAA6B,EAAA;QAA7B,IAAA,CAAA,WAAW,GAAX,WAAW;IACvC;uGAJO,aAAa,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,WAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAb,aAAa,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,EAAA,EAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAb,aAAa,EAAA,UAAA,EAAA,CAAA;kBALzB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACL,oBAAA,QAAQ,EAAE,WAAW;AACrB,oBAAA,QAAQ,EAAE,SAAS;AACnB,oBAAA,UAAU,EAAE;AACjB,iBAAA;;;MCsBY,gBAAgB,CAAA;AAClB,IAAA,IAAI,GAAG,KAAK,CAAC,QAAQ,+CAAO;AACO,IAAA,MAAM;AAEhD,IAAA,WAAA,GAAA;IACA;uGALS,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,+PAER,aAAa,EAAA,CAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC9BlC,8RAQC,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDIO,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,UAAA,EAEJ;YACR,OAAO,CAAC,eAAe,EAAE;AACrB,gBAAA,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC;AAChB,oBAAA,OAAO,EAAE,CAAC;AACb,iBAAA,CAAC,CAAC;AACH,gBAAA,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC;AAChB,oBAAA,OAAO,EAAE,CAAC;AACb,iBAAA,CAAC,CAAC;gBACH,UAAU,CAAC,eAAe,EAAE;oBACxB,OAAO,CAAC,cAAc;iBACzB;aACJ;AACJ,SAAA,EAAA,CAAA;;2FAEQ,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAvB5B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,EAAA,QAAA,EACb,YAAY,EAAA,UAAA,EAGV,IAAI,EAAA,OAAA,EACP;wBACL;qBACH,EAAA,UAAA,EACW;wBACR,OAAO,CAAC,eAAe,EAAE;AACrB,4BAAA,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC;AAChB,gCAAA,OAAO,EAAE,CAAC;AACb,6BAAA,CAAC,CAAC;AACH,4BAAA,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC;AAChB,gCAAA,OAAO,EAAE,CAAC;AACb,6BAAA,CAAC,CAAC;4BACH,UAAU,CAAC,eAAe,EAAE;gCACxB,OAAO,CAAC,cAAc;6BACzB;yBACJ;AACJ,qBAAA,EAAA,QAAA,EAAA,8RAAA,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA;;sBAIA,eAAe;uBAAC,aAAa;;;AE1BlC,MAAM,KAAK,GAAG;IACZ,gBAAgB;IAChB;CACD;MAMY,aAAa,CAAA;uGAAb,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;AAAb,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,YARxB,gBAAgB;AAChB,YAAA,aAAa,aADb,gBAAgB;YAChB,aAAa,CAAA,EAAA,CAAA;AAOF,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,YARxB,gBAAgB,CAAA,EAAA,CAAA;;2FAQL,aAAa,EAAA,UAAA,EAAA,CAAA;kBAJzB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE,KAAK;AACd,oBAAA,OAAO,EAAE;AACV,iBAAA;;;ACZD;;AAEG;;;;"}
|
|
@@ -125,16 +125,16 @@ class TableColumnDirective {
|
|
|
125
125
|
this.sortDirection.set('none');
|
|
126
126
|
}
|
|
127
127
|
}
|
|
128
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
129
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.
|
|
128
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: TableColumnDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
129
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.9", type: TableColumnDirective, isStandalone: true, selector: "ng0-table-col", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, emptyCellText: { classPropertyName: "emptyCellText", publicName: "emptyCellText", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, cellClass: { classPropertyName: "cellClass", publicName: "cellClass", isSignal: true, isRequired: false, transformFunction: null }, bold: { classPropertyName: "bold", publicName: "bold", isSignal: true, isRequired: false, transformFunction: null }, shrink: { classPropertyName: "shrink", publicName: "shrink", isSignal: true, isRequired: false, transformFunction: null }, filterable: { classPropertyName: "filterable", publicName: "filterable", isSignal: true, isRequired: false, transformFunction: null }, filterValue: { classPropertyName: "filterValue", publicName: "filterValue", isSignal: true, isRequired: false, transformFunction: null }, filterField: { classPropertyName: "filterField", publicName: "filterField", isSignal: true, isRequired: false, transformFunction: null }, filterOperator: { classPropertyName: "filterOperator", publicName: "filterOperator", isSignal: true, isRequired: false, transformFunction: null }, filterOperators: { classPropertyName: "filterOperators", publicName: "filterOperators", isSignal: true, isRequired: false, transformFunction: null }, fieldName: { classPropertyName: "fieldName", publicName: "fieldName", isSignal: true, isRequired: false, transformFunction: null }, sortable: { classPropertyName: "sortable", publicName: "sortable", isSignal: true, isRequired: false, transformFunction: null }, sortDirection: { classPropertyName: "sortDirection", publicName: "sortDirection", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filterValue: "filterValueChange", filterOperator: "filterOperatorChange", sortDirection: "sortDirectionChange" }, queries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0 });
|
|
130
130
|
}
|
|
131
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
131
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: TableColumnDirective, decorators: [{
|
|
132
132
|
type: Directive,
|
|
133
133
|
args: [{
|
|
134
134
|
selector: 'ng0-table-col',
|
|
135
135
|
standalone: true,
|
|
136
136
|
}]
|
|
137
|
-
}], ctorParameters: () => [], propDecorators: { template: [{
|
|
137
|
+
}], ctorParameters: () => [], propDecorators: { field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], emptyCellText: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyCellText", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], cellClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellClass", required: false }] }], bold: [{ type: i0.Input, args: [{ isSignal: true, alias: "bold", required: false }] }], shrink: [{ type: i0.Input, args: [{ isSignal: true, alias: "shrink", required: false }] }], filterable: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterable", required: false }] }], filterValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterValue", required: false }] }, { type: i0.Output, args: ["filterValueChange"] }], filterField: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterField", required: false }] }], filterOperator: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterOperator", required: false }] }, { type: i0.Output, args: ["filterOperatorChange"] }], filterOperators: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterOperators", required: false }] }], fieldName: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldName", required: false }] }], sortable: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortable", required: false }] }], sortDirection: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortDirection", required: false }] }, { type: i0.Output, args: ["sortDirectionChange"] }], template: [{
|
|
138
138
|
type: ContentChild,
|
|
139
139
|
args: [TemplateRef]
|
|
140
140
|
}] } });
|
|
@@ -145,10 +145,10 @@ class TableDetailRowDirective {
|
|
|
145
145
|
constructor(templateRef) {
|
|
146
146
|
this.templateRef = templateRef;
|
|
147
147
|
}
|
|
148
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
149
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.
|
|
148
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: TableDetailRowDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
149
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.9", type: TableDetailRowDirective, isStandalone: true, selector: "[ng0-table-detail-row]", inputs: { showCallback: "showCallback" }, ngImport: i0 });
|
|
150
150
|
}
|
|
151
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
151
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: TableDetailRowDirective, decorators: [{
|
|
152
152
|
type: Directive,
|
|
153
153
|
args: [{
|
|
154
154
|
selector: '[ng0-table-detail-row]',
|
|
@@ -404,10 +404,10 @@ class TableComponent {
|
|
|
404
404
|
ngOnDestroy() {
|
|
405
405
|
this._changeSubscription?.unsubscribe();
|
|
406
406
|
}
|
|
407
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
408
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.1", type: TableComponent, isStandalone: true, selector: "ng0-table", inputs: { source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, autoLoad: { classPropertyName: "autoLoad", publicName: "autoLoad", isSignal: true, isRequired: false, transformFunction: null }, showRowNumbers: { classPropertyName: "showRowNumbers", publicName: "showRowNumbers", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, pageable: { classPropertyName: "pageable", publicName: "pageable", isSignal: true, isRequired: false, transformFunction: null }, sortable: { classPropertyName: "sortable", publicName: "sortable", isSignal: true, isRequired: false, transformFunction: null }, tableClass: { classPropertyName: "tableClass", publicName: "tableClass", isSignal: true, isRequired: false, transformFunction: null }, headerClass: { classPropertyName: "headerClass", publicName: "headerClass", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, filterable: { classPropertyName: "filterable", publicName: "filterable", isSignal: true, isRequired: false, transformFunction: null }, loadingIndicator: { classPropertyName: "loadingIndicator", publicName: "loadingIndicator", isSignal: true, isRequired: false, transformFunction: null }, loadingCover: { classPropertyName: "loadingCover", publicName: "loadingCover", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ng0-loading": "this.isLoading" } }, queries: [{ propertyName: "_detailRow", first: true, predicate: TableDetailRowDirective, descendants: true }, { propertyName: "_columns", predicate: TableColumnDirective }], exportAs: ["ng0Table"], ngImport: i0, template: "@let $dataResult = _dataResult();\r\n@let $pageable = pageable();\r\n@let $pageIndex = _lastRequest?.page?.index ?? 1;\r\n@let $data = $dataResult?.data;\r\n@let $anyRecords = $data && $data.length > 0;\r\n@let $totalRecordsCount = $dataResult?.total;\r\n@let $firstRecord = $pageable ? ($pageable.pageSize! * ($pageIndex - 1) + 1) : 1;\r\n@let $lastRecord = $data ? $firstRecord + $data.length - 1 : 1;\r\n@let $isLoading = _dataSource.isLoading();\r\n@let $isFirstLoad = $dataResult == undefined;\r\n@let $columnsCount = _columns.length + (showRowNumbers() ? 1 : 0);\r\n@let $tableLocale = _ls.get()?.definition?.components?.table;\r\n\r\n<div class=\"table-responsive\" [style.height]=\"height()\" [class.table-scrollable]=\"height()! > 0\">\r\n <table class=\"table\" [ngClass]=\"tableClass()\">\r\n @if (caption()) {\r\n <caption>{{caption()}}</caption>\r\n }\r\n\r\n @if (showHeader()) {\r\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n }\r\n\r\n @if (filterable()) {\r\n <ng-container *ngTemplateOutlet=\"filtersTemplate\"></ng-container>\r\n }\r\n\r\n <tbody>\r\n @if ($isLoading && $isFirstLoad && loadingIndicator()) {\r\n <tr class=\"ng0-table-loading-row\">\r\n <td [attr.colspan]=\"$columnsCount\">\r\n @switch (loadingIndicator()) {\r\n @case ('spinner') {\r\n <div class=\"text-center\">\r\n <div class=\"spinner-border\" role=\"status\"></div>\r\n </div>\r\n }\r\n }\r\n </td>\r\n </tr>\r\n } @else {\r\n @if ($data) {\r\n @if ($data.length > 0) {\r\n <ng-container *ngTemplateOutlet=\"dataRowsTemplate\"></ng-container>\r\n } @else {\r\n <tr class=\"ng0-table-no-records-row\">\r\n <td [attr.colSpan]=\"$columnsCount\" class=\"text-center p-2\">\r\n {{ $tableLocale?.noRecords ?? 'No Records.' }}\r\n </td>\r\n </tr>\r\n }\r\n } @else if (_lastError) {\r\n <ng-container *ngTemplateOutlet=\"nowDataTemplate\"></ng-container>\r\n }\r\n }\r\n </tbody>\r\n </table>\r\n</div>\r\n\r\n<div class=\"ng0-table-footer d-flex align-items-baseline\">\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n</div>\r\n\r\n@if ($isLoading && !$isFirstLoad && loadingCover()) {\r\n<div class=\"ng0-table-loading-cover text-center\">\r\n @if (loadingCover() == 'spinner') {\r\n <div class=\"spinner-border\" role=\"status\"></div>\r\n }\r\n</div>\r\n}\r\n\r\n<ng-template #filtersTemplate>\r\n <thead>\r\n <tr>\r\n @if (_detailRow) {\r\n <th></th>\r\n }\r\n\r\n @if (showRowNumbers()) {\r\n <th></th>\r\n }\r\n\r\n @for (col of _columns; track $index) {\r\n <th>\r\n @if(col.filterable() && (col.field() || col.filterValue())) {\r\n\r\n <div class=\"input-group\">\r\n @switch (col.type()) {\r\n @case ('text') {\r\n <input [name]=\"'filter-' + col.field\"\r\n type=\"search\"\r\n [maxlength]=\"50\"\r\n class=\"form-control form-control-sm\"\r\n [(ngModel)]=\"col.filterValue\"\r\n (keydown.enter)=\"load(0)\">\r\n }\r\n @case ('number') {\r\n <input [name]=\"'datatablecol-' + col.field\"\r\n type=\"search\"\r\n ng0Number\r\n class=\"form-control form-control-sm\"\r\n [(ngModel)]=\"col.filterValue\"\r\n (keydown.enter)=\"load(0)\">\r\n }\r\n }\r\n\r\n <button class=\"btn btn-outline-light\"\r\n style=\"border-color: var(--bs-border-color);\"\r\n cdkOverlayOrigin\r\n #trigger=\"cdkOverlayOrigin\"\r\n (click)=\"_onToggleFilterOperator(col)\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M19 3H5C3.58579 3 2.87868 3 2.43934 3.4122C2 3.8244 2 4.48782 2 5.81466V6.50448C2 7.54232 2 8.06124 2.2596 8.49142C2.5192 8.9216 2.99347 9.18858 3.94202 9.72255L6.85504 11.3624C7.49146 11.7206 7.80967 11.8998 8.03751 12.0976C8.51199 12.5095 8.80408 12.9935 8.93644 13.5872C9 13.8722 9 14.2058 9 14.8729L9 17.5424C9 18.452 9 18.9067 9.25192 19.2613C9.50385 19.6158 9.95128 19.7907 10.8462 20.1406C12.7248 20.875 13.6641 21.2422 14.3321 20.8244C15 20.4066 15 19.4519 15 17.5424V14.8729C15 14.2058 15 13.8722 15.0636 13.5872C15.1959 12.9935 15.488 12.5095 15.9625 12.0976C16.1903 11.8998 16.5085 11.7206 17.145 11.3624L20.058 9.72255C21.0065 9.18858 21.4808 8.9216 21.7404 8.49142C22 8.06124 22 7.54232 22 6.50448V5.81466C22 4.48782 22 3.8244 21.5607 3.4122C21.1213 3 20.4142 3 19 3Z\"\r\n stroke=\"#1C274C\" stroke-width=\"1.5\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n <ng-template\r\n cdkConnectedOverlay\r\n [cdkConnectedOverlayOrigin]=\"trigger\"\r\n [cdkConnectedOverlayOpen]=\"col.showFilterOperators()\"\r\n (overlayOutsideClick)=\"col.showFilterOperators.set(false)\"\r\n (detach)=\"col.showFilterOperators.set(false)\">\r\n <ul class=\"dropdown-menu show\" animate.enter=\"fade-in\">\r\n @for (item of col.getFilterOperators(); track $index) {\r\n <li>\r\n <button class=\"dropdown-item\" [class.active]=\"item == col.filterOperator()\"\r\n (click)=\"_onSelectFilterOperator(col, item)\">\r\n {{_ls.get()?.definition?.data?.logicalOperators?.[item] ?? item }}\r\n </button>\r\n </li>\r\n }\r\n </ul>\r\n </ng-template>\r\n }\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n</ng-template>\r\n\r\n<ng-template #headerTemplate>\r\n <thead [ngClass]=\"headerClass()\">\r\n <tr>\r\n @if (_detailRow) {\r\n <th></th>\r\n }\r\n\r\n @if (showRowNumbers()) {\r\n <th class=\"row-number text-muted\">#</th>\r\n }\r\n\r\n @for (col of _columns; track $index) {\r\n <th\r\n (click)=\"col.toggleSortDirection(); load()\"\r\n [class.sortable]=\"sortable() && col.sortable()\"\r\n [ngClass]=\"{ \r\n 'sort-asc': col.sortDirection() == 'asc', \r\n 'sort-desc': col.sortDirection() == 'desc',\r\n 'sort-none': col.sortDirection() == 'none'\r\n }\">\r\n {{ col.title() }}\r\n\r\n @if(sortable() && col.sortable()) {\r\n <svg class=\"ng0-table-sort-icon\"\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M12 7L12 16\" stroke=\"currentColor\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path d=\"M8 13L12 17L16 13\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n }\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n</ng-template>\r\n\r\n<ng-template #dataRowsTemplate>\r\n @for (row of $data; track $index) {\r\n <tr [class.table-active]=\"isRowExpanded(row)\">\r\n @if (_detailRow) {\r\n <td class=\"detail-row-expander\">\r\n @if (_detailRow.showCallback == null || _detailRow.showCallback(row)) {\r\n <button class=\"btn\" (click)=\"_onToggleRowDetailClick(row)\">\r\n @if (isRowExpanded(row)) {\r\n <i class=\"far fa-minus\"></i>\r\n } @else {\r\n <i class=\"far fa-plus\"></i>\r\n }\r\n </button>\r\n }\r\n </td>\r\n }\r\n\r\n @if (showRowNumbers()) {\r\n <td class=\"ng0-table-row-number\">\r\n {{ $firstRecord + $index }}\r\n </td>\r\n }\r\n\r\n @for (col of _columns; track $index) {\r\n <td\r\n [ngClass]=\"col.cellClass()\"\r\n [class.shrinked]=\"col.shrink()\"\r\n [class.fw-bold]=\"col.bold()\">\r\n @if (col.template) {\r\n <ng-container *ngTemplateOutlet=\"col.template; context: { $implicit: row }\">\r\n </ng-container>\r\n } @else if (col.field()) {\r\n @let cellValue = _getCellValue(row, col);\r\n\r\n @if ((cellValue === null || cellValue === undefined) && col.emptyCellText()) {\r\n {{ col.emptyCellText() }}\r\n } @else {\r\n @if (col.type()) {\r\n @let type = $any(col.type());\r\n\r\n @if (type == \"date\") {\r\n {{ cellValue | ng0Date }}\r\n } @else if (type == \"number\") {\r\n {{ cellValue | number }}\r\n } @else if (type == \"currency\") {\r\n {{ cellValue | currency }}\r\n } @else if (type.enum) {\r\n {{ cellValue | ng0TranslateEnum: type.enum.name : type.enum.fallback }}\r\n } @else if (type.boolean || type == \"boolean\") {\r\n {{ cellValue | ng0LocalizeBool: type.boolean.false ?? \"false\" : type.boolean.false ?? \"true\" }}\r\n }@else {\r\n {{ cellValue }}\r\n }\r\n }\r\n }\r\n }\r\n </td>\r\n }\r\n </tr>\r\n\r\n @if (_detailRow && isRowExpanded(row)) {\r\n <tr class=\"detail-row\">\r\n <td\r\n [attr.colspan]=\"_columns.length + (showRowNumbers() ? 1 : 0) + 1\"\r\n class=\"ps-2 pb-4\">\r\n <ng-container\r\n *ngTemplateOutlet=\"_detailRow.templateRef; context: { $implicit: row }\"></ng-container>\r\n </td>\r\n </tr>\r\n }\r\n }\r\n</ng-template>\r\n\r\n<ng-template #footerTemplate>\r\n @if ($pageable && $pageable.showPagingControls && $anyRecords && $totalRecordsCount! > 0) {\r\n <div class=\"ng0-table-pagination me-2\">\r\n <ng0-pagination\r\n class=\"mb-0 d-inline-block\"\r\n [showFirstLastButtons]=\"$pageable.showFirstLastButtons == true\"\r\n [showNextPreviousButtons]=\"$pageable.showNextPreviousButtons == true\"\r\n [totalRecords]=\"$totalRecordsCount!\"\r\n [pageSize]=\"$pageable.pageSize!\"\r\n [selectedPage]=\"$pageIndex\"\r\n (itemClick)=\"_onPageChange($event)\"\r\n [maxVisiblePages]=\"$pageable.maxVisiblePages!\">\r\n <ng-container ngProjectAs=\"first\">\r\n <ng-content select=\"paging-first\">\r\n {{ \"first\" | ng0Translate }}\r\n </ng-content>\r\n </ng-container>\r\n\r\n <ng-container ngProjectAs=\"last\">\r\n <ng-content select=\"paging-last\">\r\n {{ \"last\" | ng0Translate }}\r\n </ng-content>\r\n </ng-container>\r\n\r\n <ng-container ngProjectAs=\"next\">\r\n <ng-content select=\"paging-next\">\r\n {{ \"next\" | ng0Translate }}\r\n </ng-content>\r\n </ng-container>\r\n\r\n <ng-container ngProjectAs=\"previous\">\r\n <ng-content select=\"paging-previous\">\r\n {{ \"previous\" | ng0Translate }}\r\n </ng-content>\r\n </ng-container>\r\n </ng0-pagination>\r\n </div>\r\n\r\n @if ($pageable.showPageSizeOptions || $pageable.showPageSizeOptions == undefined) {\r\n <div class=\"ng0-table-paging-options\">\r\n <select name=\"pageSizeOptions\" class=\"form-select w-auto d-inline-block\">\r\n <option [ngValue]=\"10\" selected>10</option>\r\n </select>\r\n </div>\r\n }\r\n\r\n @if ($pageable.showPagingInfo == undefined || $pageable.showPagingInfo) {\r\n <div class=\"ng0-table-paging-info ms-auto\">\r\n <ng-content select=\"paging-info\">\r\n {{\r\n _pagingFormatter({firstRecord: $firstRecord, lastRecord: $lastRecord, totalRecords: $totalRecordsCount!,\r\n currentPage: $pageIndex!})\r\n }}\r\n </ng-content>\r\n </div>\r\n }\r\n }\r\n</ng-template>\r\n\r\n<ng-template #nowDataTemplate>\r\n <tr class=\"ng0-table-error-row\">\r\n <td [attr.colSpan]=\"$columnsCount\" class=\"p-2\">\r\n <div class=\"d-flex align-items-baseline\">\r\n <span>{{ $tableLocale?.loadError ?? 'Error loading data.' }} </span>\r\n <button (click)=\"load()\" class=\"btn btn-warning ms-auto\">\r\n {{ \"retry\" | ng0Translate }}\r\n </button>\r\n </div>\r\n </td>\r\n </tr>\r\n</ng-template>", styles: [":host{display:flex;flex-direction:column;position:relative}@starting-style{.ng0-table-loading-cover{background-color:#0000}}table{margin-bottom:0}th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none}th.sortable .ng0-table-sort-icon{transition:transform .2s;opacity:0}th.sortable.sort-none:hover .ng0-table-sort-icon{opacity:.4}th.sortable.sort-asc .ng0-table-sort-icon{transform:rotate(0);opacity:1;color:var(--bs-danger)}th.sortable.sort-desc .ng0-table-sort-icon{transform:rotate(180deg);opacity:1;color:var(--bs-primary)}tbody{position:relative}td.row-number{width:0}td.shrinked{width:0;white-space:nowrap}.ng0-table-loading-cover{position:absolute;inset:0;background-color:#0000000d;transition:background-color .2s;z-index:1000;display:flex;align-items:center;justify-content:center}.table-scrollable{overflow-y:auto;direction:ltr;scroll-padding:20px}.table-scrollable::-webkit-scrollbar{width:8px}.table-scrollable::-webkit-scrollbar-track{background-color:#00000008}.table-scrollable::-webkit-scrollbar-thumb{background-color:var(--bs-secondary)}.table-scrollable thead th{position:sticky;top:0}.ng0-table-footer{margin-top:.5rem}.fade-in{animation:fade-in .5s}@keyframes fade-in{0%{opacity:0}to{opacity:1}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: LocalizationModule }, { kind: "component", type: PaginationComponent, selector: "ng0-pagination", inputs: ["totalRecords", "pageSize", "selectedPage", "maxVisiblePages", "showNextPreviousButtons", "showFirstLastButtons"], outputs: ["itemClick"], exportAs: ["ng0Pagination"] }, { kind: "directive", type: NumberDirective, selector: "[ng0Number]", inputs: ["minFractionDigits", "maxFractionDigits", "useGrouping", "numberType"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i4.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i4.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "pipe", type: i2.DecimalPipe, name: "number" }, { kind: "pipe", type: i2.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i1.TranslatePipe, name: "ng0Translate" }, { kind: "pipe", type: i1.TranslateEnumPipe, name: "ng0TranslateEnum" }, { kind: "pipe", type: i1.DatePipe, name: "ng0Date" }, { kind: "pipe", type: i1.LocalizeBooleanPipe, name: "ng0LocalizeBool" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
407
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: TableComponent, deps: [{ token: i1.LocalizationService }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
408
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: TableComponent, isStandalone: true, selector: "ng0-table", inputs: { source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, autoLoad: { classPropertyName: "autoLoad", publicName: "autoLoad", isSignal: true, isRequired: false, transformFunction: null }, showRowNumbers: { classPropertyName: "showRowNumbers", publicName: "showRowNumbers", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, pageable: { classPropertyName: "pageable", publicName: "pageable", isSignal: true, isRequired: false, transformFunction: null }, sortable: { classPropertyName: "sortable", publicName: "sortable", isSignal: true, isRequired: false, transformFunction: null }, tableClass: { classPropertyName: "tableClass", publicName: "tableClass", isSignal: true, isRequired: false, transformFunction: null }, headerClass: { classPropertyName: "headerClass", publicName: "headerClass", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, filterable: { classPropertyName: "filterable", publicName: "filterable", isSignal: true, isRequired: false, transformFunction: null }, loadingIndicator: { classPropertyName: "loadingIndicator", publicName: "loadingIndicator", isSignal: true, isRequired: false, transformFunction: null }, loadingCover: { classPropertyName: "loadingCover", publicName: "loadingCover", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ng0-loading": "this.isLoading" } }, queries: [{ propertyName: "_detailRow", first: true, predicate: TableDetailRowDirective, descendants: true }, { propertyName: "_columns", predicate: TableColumnDirective }], exportAs: ["ng0Table"], ngImport: i0, template: "@let $dataResult = _dataResult();\r\n@let $pageable = pageable();\r\n@let $pageIndex = _lastRequest?.page?.index ?? 1;\r\n@let $data = $dataResult?.data;\r\n@let $anyRecords = $data && $data.length > 0;\r\n@let $totalRecordsCount = $dataResult?.total;\r\n@let $firstRecord = $pageable ? ($pageable.pageSize! * ($pageIndex - 1) + 1) : 1;\r\n@let $lastRecord = $data ? $firstRecord + $data.length - 1 : 1;\r\n@let $isLoading = _dataSource.isLoading();\r\n@let $isFirstLoad = $dataResult == undefined;\r\n@let $columnsCount = _columns.length + (showRowNumbers() ? 1 : 0);\r\n@let $tableLocale = _ls.get()?.definition?.components?.table;\r\n\r\n<div class=\"table-responsive\" [style.height]=\"height()\" [class.table-scrollable]=\"height()! > 0\">\r\n <table class=\"table\" [ngClass]=\"tableClass()\">\r\n @if (caption()) {\r\n <caption>{{caption()}}</caption>\r\n }\r\n\r\n @if (showHeader()) {\r\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n }\r\n\r\n @if (filterable()) {\r\n <ng-container *ngTemplateOutlet=\"filtersTemplate\"></ng-container>\r\n }\r\n\r\n <tbody>\r\n @if ($isLoading && $isFirstLoad && loadingIndicator()) {\r\n <tr class=\"ng0-table-loading-row\">\r\n <td [attr.colspan]=\"$columnsCount\">\r\n @switch (loadingIndicator()) {\r\n @case ('spinner') {\r\n <div class=\"text-center\">\r\n <div class=\"spinner-border\" role=\"status\"></div>\r\n </div>\r\n }\r\n }\r\n </td>\r\n </tr>\r\n } @else {\r\n @if ($data) {\r\n @if ($data.length > 0) {\r\n <ng-container *ngTemplateOutlet=\"dataRowsTemplate\"></ng-container>\r\n } @else {\r\n <tr class=\"ng0-table-no-records-row\">\r\n <td [attr.colSpan]=\"$columnsCount\" class=\"text-center p-2\">\r\n {{ $tableLocale?.noRecords ?? 'No Records.' }}\r\n </td>\r\n </tr>\r\n }\r\n } @else if (_lastError) {\r\n <ng-container *ngTemplateOutlet=\"nowDataTemplate\"></ng-container>\r\n }\r\n }\r\n </tbody>\r\n </table>\r\n</div>\r\n\r\n<div class=\"ng0-table-footer d-flex align-items-baseline\">\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n</div>\r\n\r\n@if ($isLoading && !$isFirstLoad && loadingCover()) {\r\n<div class=\"ng0-table-loading-cover text-center\">\r\n @if (loadingCover() == 'spinner') {\r\n <div class=\"spinner-border\" role=\"status\"></div>\r\n }\r\n</div>\r\n}\r\n\r\n<ng-template #filtersTemplate>\r\n <thead>\r\n <tr>\r\n @if (_detailRow) {\r\n <th></th>\r\n }\r\n\r\n @if (showRowNumbers()) {\r\n <th></th>\r\n }\r\n\r\n @for (col of _columns; track $index) {\r\n <th>\r\n @if(col.filterable() && (col.field() || col.filterValue())) {\r\n\r\n <div class=\"input-group\">\r\n @switch (col.type()) {\r\n @case ('text') {\r\n <input [name]=\"'filter-' + col.field\"\r\n type=\"search\"\r\n [maxlength]=\"50\"\r\n class=\"form-control form-control-sm\"\r\n [(ngModel)]=\"col.filterValue\"\r\n (keydown.enter)=\"load(0)\">\r\n }\r\n @case ('number') {\r\n <input [name]=\"'datatablecol-' + col.field\"\r\n type=\"search\"\r\n ng0Number\r\n class=\"form-control form-control-sm\"\r\n [(ngModel)]=\"col.filterValue\"\r\n (keydown.enter)=\"load(0)\">\r\n }\r\n }\r\n\r\n <button class=\"btn btn-outline-light\"\r\n style=\"border-color: var(--bs-border-color);\"\r\n cdkOverlayOrigin\r\n #trigger=\"cdkOverlayOrigin\"\r\n (click)=\"_onToggleFilterOperator(col)\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M19 3H5C3.58579 3 2.87868 3 2.43934 3.4122C2 3.8244 2 4.48782 2 5.81466V6.50448C2 7.54232 2 8.06124 2.2596 8.49142C2.5192 8.9216 2.99347 9.18858 3.94202 9.72255L6.85504 11.3624C7.49146 11.7206 7.80967 11.8998 8.03751 12.0976C8.51199 12.5095 8.80408 12.9935 8.93644 13.5872C9 13.8722 9 14.2058 9 14.8729L9 17.5424C9 18.452 9 18.9067 9.25192 19.2613C9.50385 19.6158 9.95128 19.7907 10.8462 20.1406C12.7248 20.875 13.6641 21.2422 14.3321 20.8244C15 20.4066 15 19.4519 15 17.5424V14.8729C15 14.2058 15 13.8722 15.0636 13.5872C15.1959 12.9935 15.488 12.5095 15.9625 12.0976C16.1903 11.8998 16.5085 11.7206 17.145 11.3624L20.058 9.72255C21.0065 9.18858 21.4808 8.9216 21.7404 8.49142C22 8.06124 22 7.54232 22 6.50448V5.81466C22 4.48782 22 3.8244 21.5607 3.4122C21.1213 3 20.4142 3 19 3Z\"\r\n stroke=\"#1C274C\" stroke-width=\"1.5\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n <ng-template\r\n cdkConnectedOverlay\r\n [cdkConnectedOverlayOrigin]=\"trigger\"\r\n [cdkConnectedOverlayOpen]=\"col.showFilterOperators()\"\r\n (overlayOutsideClick)=\"col.showFilterOperators.set(false)\"\r\n (detach)=\"col.showFilterOperators.set(false)\">\r\n <ul class=\"dropdown-menu show\" animate.enter=\"fade-in\">\r\n @for (item of col.getFilterOperators(); track $index) {\r\n <li>\r\n <button class=\"dropdown-item\" [class.active]=\"item == col.filterOperator()\"\r\n (click)=\"_onSelectFilterOperator(col, item)\">\r\n {{_ls.get()?.definition?.data?.logicalOperators?.[item] ?? item }}\r\n </button>\r\n </li>\r\n }\r\n </ul>\r\n </ng-template>\r\n }\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n</ng-template>\r\n\r\n<ng-template #headerTemplate>\r\n <thead [ngClass]=\"headerClass()\">\r\n <tr>\r\n @if (_detailRow) {\r\n <th></th>\r\n }\r\n\r\n @if (showRowNumbers()) {\r\n <th class=\"row-number text-muted\">#</th>\r\n }\r\n\r\n @for (col of _columns; track $index) {\r\n <th\r\n (click)=\"col.toggleSortDirection(); load()\"\r\n [class.sortable]=\"sortable() && col.sortable()\"\r\n [ngClass]=\"{ \r\n 'sort-asc': col.sortDirection() == 'asc', \r\n 'sort-desc': col.sortDirection() == 'desc',\r\n 'sort-none': col.sortDirection() == 'none'\r\n }\">\r\n {{ col.title() }}\r\n\r\n @if(sortable() && col.sortable()) {\r\n <svg class=\"ng0-table-sort-icon\"\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M12 7L12 16\" stroke=\"currentColor\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path d=\"M8 13L12 17L16 13\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n }\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n</ng-template>\r\n\r\n<ng-template #dataRowsTemplate>\r\n @for (row of $data; track $index) {\r\n <tr [class.table-active]=\"isRowExpanded(row)\">\r\n @if (_detailRow) {\r\n <td class=\"detail-row-expander\">\r\n @if (_detailRow.showCallback == null || _detailRow.showCallback(row)) {\r\n <button class=\"btn\" (click)=\"_onToggleRowDetailClick(row)\">\r\n @if (isRowExpanded(row)) {\r\n <i class=\"far fa-minus\"></i>\r\n } @else {\r\n <i class=\"far fa-plus\"></i>\r\n }\r\n </button>\r\n }\r\n </td>\r\n }\r\n\r\n @if (showRowNumbers()) {\r\n <td class=\"ng0-table-row-number\">\r\n {{ $firstRecord + $index }}\r\n </td>\r\n }\r\n\r\n @for (col of _columns; track $index) {\r\n <td\r\n [ngClass]=\"col.cellClass()\"\r\n [class.shrinked]=\"col.shrink()\"\r\n [class.fw-bold]=\"col.bold()\">\r\n @if (col.template) {\r\n <ng-container *ngTemplateOutlet=\"col.template; context: { $implicit: row }\">\r\n </ng-container>\r\n } @else if (col.field()) {\r\n @let cellValue = _getCellValue(row, col);\r\n\r\n @if ((cellValue === null || cellValue === undefined) && col.emptyCellText()) {\r\n {{ col.emptyCellText() }}\r\n } @else {\r\n @if (col.type()) {\r\n @let type = $any(col.type());\r\n\r\n @if (type == \"date\") {\r\n {{ cellValue | ng0Date }}\r\n } @else if (type == \"number\") {\r\n {{ cellValue | number }}\r\n } @else if (type == \"currency\") {\r\n {{ cellValue | currency }}\r\n } @else if (type.enum) {\r\n {{ cellValue | ng0TranslateEnum: type.enum.name : type.enum.fallback }}\r\n } @else if (type.boolean || type == \"boolean\") {\r\n {{ cellValue | ng0LocalizeBool: type.boolean.false ?? \"false\" : type.boolean.false ?? \"true\" }}\r\n }@else {\r\n {{ cellValue }}\r\n }\r\n }\r\n }\r\n }\r\n </td>\r\n }\r\n </tr>\r\n\r\n @if (_detailRow && isRowExpanded(row)) {\r\n <tr class=\"detail-row\">\r\n <td\r\n [attr.colspan]=\"_columns.length + (showRowNumbers() ? 1 : 0) + 1\"\r\n class=\"ps-2 pb-4\">\r\n <ng-container\r\n *ngTemplateOutlet=\"_detailRow.templateRef; context: { $implicit: row }\"></ng-container>\r\n </td>\r\n </tr>\r\n }\r\n }\r\n</ng-template>\r\n\r\n<ng-template #footerTemplate>\r\n @if ($pageable && $pageable.showPagingControls && $anyRecords && $totalRecordsCount! > 0) {\r\n <div class=\"ng0-table-pagination me-2\">\r\n <ng0-pagination\r\n class=\"mb-0 d-inline-block\"\r\n [showFirstLastButtons]=\"$pageable.showFirstLastButtons == true\"\r\n [showNextPreviousButtons]=\"$pageable.showNextPreviousButtons == true\"\r\n [totalRecords]=\"$totalRecordsCount!\"\r\n [pageSize]=\"$pageable.pageSize!\"\r\n [selectedPage]=\"$pageIndex\"\r\n (itemClick)=\"_onPageChange($event)\"\r\n [maxVisiblePages]=\"$pageable.maxVisiblePages!\">\r\n <ng-container ngProjectAs=\"first\">\r\n <ng-content select=\"paging-first\">\r\n {{ \"first\" | ng0Translate }}\r\n </ng-content>\r\n </ng-container>\r\n\r\n <ng-container ngProjectAs=\"last\">\r\n <ng-content select=\"paging-last\">\r\n {{ \"last\" | ng0Translate }}\r\n </ng-content>\r\n </ng-container>\r\n\r\n <ng-container ngProjectAs=\"next\">\r\n <ng-content select=\"paging-next\">\r\n {{ \"next\" | ng0Translate }}\r\n </ng-content>\r\n </ng-container>\r\n\r\n <ng-container ngProjectAs=\"previous\">\r\n <ng-content select=\"paging-previous\">\r\n {{ \"previous\" | ng0Translate }}\r\n </ng-content>\r\n </ng-container>\r\n </ng0-pagination>\r\n </div>\r\n\r\n @if ($pageable.showPageSizeOptions || $pageable.showPageSizeOptions == undefined) {\r\n <div class=\"ng0-table-paging-options\">\r\n <select name=\"pageSizeOptions\" class=\"form-select w-auto d-inline-block\">\r\n <option [ngValue]=\"10\" selected>10</option>\r\n </select>\r\n </div>\r\n }\r\n\r\n @if ($pageable.showPagingInfo == undefined || $pageable.showPagingInfo) {\r\n <div class=\"ng0-table-paging-info ms-auto\">\r\n <ng-content select=\"paging-info\">\r\n {{\r\n _pagingFormatter({firstRecord: $firstRecord, lastRecord: $lastRecord, totalRecords: $totalRecordsCount!,\r\n currentPage: $pageIndex!})\r\n }}\r\n </ng-content>\r\n </div>\r\n }\r\n }\r\n</ng-template>\r\n\r\n<ng-template #nowDataTemplate>\r\n <tr class=\"ng0-table-error-row\">\r\n <td [attr.colSpan]=\"$columnsCount\" class=\"p-2\">\r\n <div class=\"d-flex align-items-baseline\">\r\n <span>{{ $tableLocale?.loadError ?? 'Error loading data.' }} </span>\r\n <button (click)=\"load()\" class=\"btn btn-warning ms-auto\">\r\n {{ \"retry\" | ng0Translate }}\r\n </button>\r\n </div>\r\n </td>\r\n </tr>\r\n</ng-template>", styles: [":host{display:flex;flex-direction:column;position:relative}@starting-style{.ng0-table-loading-cover{background-color:#0000}}table{margin-bottom:0}th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none}th.sortable .ng0-table-sort-icon{transition:transform .2s;opacity:0}th.sortable.sort-none:hover .ng0-table-sort-icon{opacity:.4}th.sortable.sort-asc .ng0-table-sort-icon{transform:rotate(0);opacity:1;color:var(--bs-danger)}th.sortable.sort-desc .ng0-table-sort-icon{transform:rotate(180deg);opacity:1;color:var(--bs-primary)}tbody{position:relative}td.row-number{width:0}td.shrinked{width:0;white-space:nowrap}.ng0-table-loading-cover{position:absolute;inset:0;background-color:#0000000d;transition:background-color .2s;z-index:1000;display:flex;align-items:center;justify-content:center}.table-scrollable{overflow-y:auto;direction:ltr;scroll-padding:20px}.table-scrollable::-webkit-scrollbar{width:8px}.table-scrollable::-webkit-scrollbar-track{background-color:#00000008}.table-scrollable::-webkit-scrollbar-thumb{background-color:var(--bs-secondary)}.table-scrollable thead th{position:sticky;top:0}.ng0-table-footer{margin-top:.5rem}.fade-in{animation:fade-in .5s}@keyframes fade-in{0%{opacity:0}to{opacity:1}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: LocalizationModule }, { kind: "component", type: PaginationComponent, selector: "ng0-pagination", inputs: ["totalRecords", "pageSize", "selectedPage", "maxVisiblePages", "showNextPreviousButtons", "showFirstLastButtons"], outputs: ["itemClick"], exportAs: ["ng0Pagination"] }, { kind: "directive", type: NumberDirective, selector: "[ng0Number]", inputs: ["minFractionDigits", "maxFractionDigits", "useGrouping", "numberType"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i4.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i4.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "pipe", type: i2.DecimalPipe, name: "number" }, { kind: "pipe", type: i2.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i1.TranslatePipe, name: "ng0Translate" }, { kind: "pipe", type: i1.TranslateEnumPipe, name: "ng0TranslateEnum" }, { kind: "pipe", type: i1.DatePipe, name: "ng0Date" }, { kind: "pipe", type: i1.LocalizeBooleanPipe, name: "ng0LocalizeBool" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
409
409
|
}
|
|
410
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
410
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: TableComponent, decorators: [{
|
|
411
411
|
type: Component,
|
|
412
412
|
args: [{ selector: 'ng0-table', exportAs: 'ng0Table', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
|
|
413
413
|
CommonModule,
|
|
@@ -417,7 +417,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImpor
|
|
|
417
417
|
NumberDirective,
|
|
418
418
|
OverlayModule
|
|
419
419
|
], template: "@let $dataResult = _dataResult();\r\n@let $pageable = pageable();\r\n@let $pageIndex = _lastRequest?.page?.index ?? 1;\r\n@let $data = $dataResult?.data;\r\n@let $anyRecords = $data && $data.length > 0;\r\n@let $totalRecordsCount = $dataResult?.total;\r\n@let $firstRecord = $pageable ? ($pageable.pageSize! * ($pageIndex - 1) + 1) : 1;\r\n@let $lastRecord = $data ? $firstRecord + $data.length - 1 : 1;\r\n@let $isLoading = _dataSource.isLoading();\r\n@let $isFirstLoad = $dataResult == undefined;\r\n@let $columnsCount = _columns.length + (showRowNumbers() ? 1 : 0);\r\n@let $tableLocale = _ls.get()?.definition?.components?.table;\r\n\r\n<div class=\"table-responsive\" [style.height]=\"height()\" [class.table-scrollable]=\"height()! > 0\">\r\n <table class=\"table\" [ngClass]=\"tableClass()\">\r\n @if (caption()) {\r\n <caption>{{caption()}}</caption>\r\n }\r\n\r\n @if (showHeader()) {\r\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n }\r\n\r\n @if (filterable()) {\r\n <ng-container *ngTemplateOutlet=\"filtersTemplate\"></ng-container>\r\n }\r\n\r\n <tbody>\r\n @if ($isLoading && $isFirstLoad && loadingIndicator()) {\r\n <tr class=\"ng0-table-loading-row\">\r\n <td [attr.colspan]=\"$columnsCount\">\r\n @switch (loadingIndicator()) {\r\n @case ('spinner') {\r\n <div class=\"text-center\">\r\n <div class=\"spinner-border\" role=\"status\"></div>\r\n </div>\r\n }\r\n }\r\n </td>\r\n </tr>\r\n } @else {\r\n @if ($data) {\r\n @if ($data.length > 0) {\r\n <ng-container *ngTemplateOutlet=\"dataRowsTemplate\"></ng-container>\r\n } @else {\r\n <tr class=\"ng0-table-no-records-row\">\r\n <td [attr.colSpan]=\"$columnsCount\" class=\"text-center p-2\">\r\n {{ $tableLocale?.noRecords ?? 'No Records.' }}\r\n </td>\r\n </tr>\r\n }\r\n } @else if (_lastError) {\r\n <ng-container *ngTemplateOutlet=\"nowDataTemplate\"></ng-container>\r\n }\r\n }\r\n </tbody>\r\n </table>\r\n</div>\r\n\r\n<div class=\"ng0-table-footer d-flex align-items-baseline\">\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n</div>\r\n\r\n@if ($isLoading && !$isFirstLoad && loadingCover()) {\r\n<div class=\"ng0-table-loading-cover text-center\">\r\n @if (loadingCover() == 'spinner') {\r\n <div class=\"spinner-border\" role=\"status\"></div>\r\n }\r\n</div>\r\n}\r\n\r\n<ng-template #filtersTemplate>\r\n <thead>\r\n <tr>\r\n @if (_detailRow) {\r\n <th></th>\r\n }\r\n\r\n @if (showRowNumbers()) {\r\n <th></th>\r\n }\r\n\r\n @for (col of _columns; track $index) {\r\n <th>\r\n @if(col.filterable() && (col.field() || col.filterValue())) {\r\n\r\n <div class=\"input-group\">\r\n @switch (col.type()) {\r\n @case ('text') {\r\n <input [name]=\"'filter-' + col.field\"\r\n type=\"search\"\r\n [maxlength]=\"50\"\r\n class=\"form-control form-control-sm\"\r\n [(ngModel)]=\"col.filterValue\"\r\n (keydown.enter)=\"load(0)\">\r\n }\r\n @case ('number') {\r\n <input [name]=\"'datatablecol-' + col.field\"\r\n type=\"search\"\r\n ng0Number\r\n class=\"form-control form-control-sm\"\r\n [(ngModel)]=\"col.filterValue\"\r\n (keydown.enter)=\"load(0)\">\r\n }\r\n }\r\n\r\n <button class=\"btn btn-outline-light\"\r\n style=\"border-color: var(--bs-border-color);\"\r\n cdkOverlayOrigin\r\n #trigger=\"cdkOverlayOrigin\"\r\n (click)=\"_onToggleFilterOperator(col)\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M19 3H5C3.58579 3 2.87868 3 2.43934 3.4122C2 3.8244 2 4.48782 2 5.81466V6.50448C2 7.54232 2 8.06124 2.2596 8.49142C2.5192 8.9216 2.99347 9.18858 3.94202 9.72255L6.85504 11.3624C7.49146 11.7206 7.80967 11.8998 8.03751 12.0976C8.51199 12.5095 8.80408 12.9935 8.93644 13.5872C9 13.8722 9 14.2058 9 14.8729L9 17.5424C9 18.452 9 18.9067 9.25192 19.2613C9.50385 19.6158 9.95128 19.7907 10.8462 20.1406C12.7248 20.875 13.6641 21.2422 14.3321 20.8244C15 20.4066 15 19.4519 15 17.5424V14.8729C15 14.2058 15 13.8722 15.0636 13.5872C15.1959 12.9935 15.488 12.5095 15.9625 12.0976C16.1903 11.8998 16.5085 11.7206 17.145 11.3624L20.058 9.72255C21.0065 9.18858 21.4808 8.9216 21.7404 8.49142C22 8.06124 22 7.54232 22 6.50448V5.81466C22 4.48782 22 3.8244 21.5607 3.4122C21.1213 3 20.4142 3 19 3Z\"\r\n stroke=\"#1C274C\" stroke-width=\"1.5\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n <ng-template\r\n cdkConnectedOverlay\r\n [cdkConnectedOverlayOrigin]=\"trigger\"\r\n [cdkConnectedOverlayOpen]=\"col.showFilterOperators()\"\r\n (overlayOutsideClick)=\"col.showFilterOperators.set(false)\"\r\n (detach)=\"col.showFilterOperators.set(false)\">\r\n <ul class=\"dropdown-menu show\" animate.enter=\"fade-in\">\r\n @for (item of col.getFilterOperators(); track $index) {\r\n <li>\r\n <button class=\"dropdown-item\" [class.active]=\"item == col.filterOperator()\"\r\n (click)=\"_onSelectFilterOperator(col, item)\">\r\n {{_ls.get()?.definition?.data?.logicalOperators?.[item] ?? item }}\r\n </button>\r\n </li>\r\n }\r\n </ul>\r\n </ng-template>\r\n }\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n</ng-template>\r\n\r\n<ng-template #headerTemplate>\r\n <thead [ngClass]=\"headerClass()\">\r\n <tr>\r\n @if (_detailRow) {\r\n <th></th>\r\n }\r\n\r\n @if (showRowNumbers()) {\r\n <th class=\"row-number text-muted\">#</th>\r\n }\r\n\r\n @for (col of _columns; track $index) {\r\n <th\r\n (click)=\"col.toggleSortDirection(); load()\"\r\n [class.sortable]=\"sortable() && col.sortable()\"\r\n [ngClass]=\"{ \r\n 'sort-asc': col.sortDirection() == 'asc', \r\n 'sort-desc': col.sortDirection() == 'desc',\r\n 'sort-none': col.sortDirection() == 'none'\r\n }\">\r\n {{ col.title() }}\r\n\r\n @if(sortable() && col.sortable()) {\r\n <svg class=\"ng0-table-sort-icon\"\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M12 7L12 16\" stroke=\"currentColor\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path d=\"M8 13L12 17L16 13\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n }\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n</ng-template>\r\n\r\n<ng-template #dataRowsTemplate>\r\n @for (row of $data; track $index) {\r\n <tr [class.table-active]=\"isRowExpanded(row)\">\r\n @if (_detailRow) {\r\n <td class=\"detail-row-expander\">\r\n @if (_detailRow.showCallback == null || _detailRow.showCallback(row)) {\r\n <button class=\"btn\" (click)=\"_onToggleRowDetailClick(row)\">\r\n @if (isRowExpanded(row)) {\r\n <i class=\"far fa-minus\"></i>\r\n } @else {\r\n <i class=\"far fa-plus\"></i>\r\n }\r\n </button>\r\n }\r\n </td>\r\n }\r\n\r\n @if (showRowNumbers()) {\r\n <td class=\"ng0-table-row-number\">\r\n {{ $firstRecord + $index }}\r\n </td>\r\n }\r\n\r\n @for (col of _columns; track $index) {\r\n <td\r\n [ngClass]=\"col.cellClass()\"\r\n [class.shrinked]=\"col.shrink()\"\r\n [class.fw-bold]=\"col.bold()\">\r\n @if (col.template) {\r\n <ng-container *ngTemplateOutlet=\"col.template; context: { $implicit: row }\">\r\n </ng-container>\r\n } @else if (col.field()) {\r\n @let cellValue = _getCellValue(row, col);\r\n\r\n @if ((cellValue === null || cellValue === undefined) && col.emptyCellText()) {\r\n {{ col.emptyCellText() }}\r\n } @else {\r\n @if (col.type()) {\r\n @let type = $any(col.type());\r\n\r\n @if (type == \"date\") {\r\n {{ cellValue | ng0Date }}\r\n } @else if (type == \"number\") {\r\n {{ cellValue | number }}\r\n } @else if (type == \"currency\") {\r\n {{ cellValue | currency }}\r\n } @else if (type.enum) {\r\n {{ cellValue | ng0TranslateEnum: type.enum.name : type.enum.fallback }}\r\n } @else if (type.boolean || type == \"boolean\") {\r\n {{ cellValue | ng0LocalizeBool: type.boolean.false ?? \"false\" : type.boolean.false ?? \"true\" }}\r\n }@else {\r\n {{ cellValue }}\r\n }\r\n }\r\n }\r\n }\r\n </td>\r\n }\r\n </tr>\r\n\r\n @if (_detailRow && isRowExpanded(row)) {\r\n <tr class=\"detail-row\">\r\n <td\r\n [attr.colspan]=\"_columns.length + (showRowNumbers() ? 1 : 0) + 1\"\r\n class=\"ps-2 pb-4\">\r\n <ng-container\r\n *ngTemplateOutlet=\"_detailRow.templateRef; context: { $implicit: row }\"></ng-container>\r\n </td>\r\n </tr>\r\n }\r\n }\r\n</ng-template>\r\n\r\n<ng-template #footerTemplate>\r\n @if ($pageable && $pageable.showPagingControls && $anyRecords && $totalRecordsCount! > 0) {\r\n <div class=\"ng0-table-pagination me-2\">\r\n <ng0-pagination\r\n class=\"mb-0 d-inline-block\"\r\n [showFirstLastButtons]=\"$pageable.showFirstLastButtons == true\"\r\n [showNextPreviousButtons]=\"$pageable.showNextPreviousButtons == true\"\r\n [totalRecords]=\"$totalRecordsCount!\"\r\n [pageSize]=\"$pageable.pageSize!\"\r\n [selectedPage]=\"$pageIndex\"\r\n (itemClick)=\"_onPageChange($event)\"\r\n [maxVisiblePages]=\"$pageable.maxVisiblePages!\">\r\n <ng-container ngProjectAs=\"first\">\r\n <ng-content select=\"paging-first\">\r\n {{ \"first\" | ng0Translate }}\r\n </ng-content>\r\n </ng-container>\r\n\r\n <ng-container ngProjectAs=\"last\">\r\n <ng-content select=\"paging-last\">\r\n {{ \"last\" | ng0Translate }}\r\n </ng-content>\r\n </ng-container>\r\n\r\n <ng-container ngProjectAs=\"next\">\r\n <ng-content select=\"paging-next\">\r\n {{ \"next\" | ng0Translate }}\r\n </ng-content>\r\n </ng-container>\r\n\r\n <ng-container ngProjectAs=\"previous\">\r\n <ng-content select=\"paging-previous\">\r\n {{ \"previous\" | ng0Translate }}\r\n </ng-content>\r\n </ng-container>\r\n </ng0-pagination>\r\n </div>\r\n\r\n @if ($pageable.showPageSizeOptions || $pageable.showPageSizeOptions == undefined) {\r\n <div class=\"ng0-table-paging-options\">\r\n <select name=\"pageSizeOptions\" class=\"form-select w-auto d-inline-block\">\r\n <option [ngValue]=\"10\" selected>10</option>\r\n </select>\r\n </div>\r\n }\r\n\r\n @if ($pageable.showPagingInfo == undefined || $pageable.showPagingInfo) {\r\n <div class=\"ng0-table-paging-info ms-auto\">\r\n <ng-content select=\"paging-info\">\r\n {{\r\n _pagingFormatter({firstRecord: $firstRecord, lastRecord: $lastRecord, totalRecords: $totalRecordsCount!,\r\n currentPage: $pageIndex!})\r\n }}\r\n </ng-content>\r\n </div>\r\n }\r\n }\r\n</ng-template>\r\n\r\n<ng-template #nowDataTemplate>\r\n <tr class=\"ng0-table-error-row\">\r\n <td [attr.colSpan]=\"$columnsCount\" class=\"p-2\">\r\n <div class=\"d-flex align-items-baseline\">\r\n <span>{{ $tableLocale?.loadError ?? 'Error loading data.' }} </span>\r\n <button (click)=\"load()\" class=\"btn btn-warning ms-auto\">\r\n {{ \"retry\" | ng0Translate }}\r\n </button>\r\n </div>\r\n </td>\r\n </tr>\r\n</ng-template>", styles: [":host{display:flex;flex-direction:column;position:relative}@starting-style{.ng0-table-loading-cover{background-color:#0000}}table{margin-bottom:0}th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none}th.sortable .ng0-table-sort-icon{transition:transform .2s;opacity:0}th.sortable.sort-none:hover .ng0-table-sort-icon{opacity:.4}th.sortable.sort-asc .ng0-table-sort-icon{transform:rotate(0);opacity:1;color:var(--bs-danger)}th.sortable.sort-desc .ng0-table-sort-icon{transform:rotate(180deg);opacity:1;color:var(--bs-primary)}tbody{position:relative}td.row-number{width:0}td.shrinked{width:0;white-space:nowrap}.ng0-table-loading-cover{position:absolute;inset:0;background-color:#0000000d;transition:background-color .2s;z-index:1000;display:flex;align-items:center;justify-content:center}.table-scrollable{overflow-y:auto;direction:ltr;scroll-padding:20px}.table-scrollable::-webkit-scrollbar{width:8px}.table-scrollable::-webkit-scrollbar-track{background-color:#00000008}.table-scrollable::-webkit-scrollbar-thumb{background-color:var(--bs-secondary)}.table-scrollable thead th{position:sticky;top:0}.ng0-table-footer{margin-top:.5rem}.fade-in{animation:fade-in .5s}@keyframes fade-in{0%{opacity:0}to{opacity:1}}\n"] }]
|
|
420
|
-
}], ctorParameters: () => [{ type: i1.LocalizationService }, { type: i0.DestroyRef }], propDecorators: { _columns: [{
|
|
420
|
+
}], ctorParameters: () => [{ type: i1.LocalizationService }, { type: i0.DestroyRef }], propDecorators: { source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], autoLoad: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoLoad", required: false }] }], showRowNumbers: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRowNumbers", required: false }] }], showHeader: [{ type: i0.Input, args: [{ isSignal: true, alias: "showHeader", required: false }] }], pageable: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageable", required: false }] }], sortable: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortable", required: false }] }], tableClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableClass", required: false }] }], headerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerClass", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], filterable: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterable", required: false }] }], loadingIndicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingIndicator", required: false }] }], loadingCover: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingCover", required: false }] }], _columns: [{
|
|
421
421
|
type: ContentChildren,
|
|
422
422
|
args: [TableColumnDirective]
|
|
423
423
|
}], _detailRow: [{
|
|
@@ -429,15 +429,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImpor
|
|
|
429
429
|
}] } });
|
|
430
430
|
|
|
431
431
|
class TableModule {
|
|
432
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
433
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.
|
|
432
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: TableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
433
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.9", ngImport: i0, type: TableModule, imports: [TableComponent,
|
|
434
434
|
TableColumnDirective,
|
|
435
435
|
TableDetailRowDirective], exports: [TableComponent,
|
|
436
436
|
TableColumnDirective,
|
|
437
437
|
TableDetailRowDirective] });
|
|
438
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.
|
|
438
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: TableModule, imports: [TableComponent] });
|
|
439
439
|
}
|
|
440
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
440
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: TableModule, decorators: [{
|
|
441
441
|
type: NgModule,
|
|
442
442
|
args: [{
|
|
443
443
|
imports: [
|