@pepperi-addons/ngx-lib 0.3.9-beta.13 → 0.3.9-beta.14
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/bundles/pepperi-addons-ngx-lib-draggable-items.umd.js +2 -2
- package/bundles/pepperi-addons-ngx-lib-draggable-items.umd.js.map +1 -1
- package/draggable-items/pepperi-addons-ngx-lib-draggable-items.metadata.json +1 -1
- package/esm2015/draggable-items/draggable-items.component.js +3 -3
- package/fesm2015/pepperi-addons-ngx-lib-draggable-items.js +2 -2
- package/fesm2015/pepperi-addons-ngx-lib-draggable-items.js.map +1 -1
- package/package.json +1 -1
|
@@ -105,8 +105,8 @@
|
|
|
105
105
|
DraggableItemsComponent.decorators = [
|
|
106
106
|
{ type: core.Component, args: [{
|
|
107
107
|
selector: 'pep-draggable-items',
|
|
108
|
-
template: "<div [id]=\"containerId\" class=\"pep-draggable-items-container\" cdkDropList [cdkDropListData]=\"filteredItems$ | async\"\r\n cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"dropAreaIds\">\r\n\r\n <div *ngIf=\"titleType !== 'none'\" class=\"title-container\"\r\n [ngClass]=\"{ 'pep-border-bottom': titleType === 'with-bottom-border'}\">\r\n <label class=\"title body-{{ titleSizeType }} bold ellipsis \" >{{title}}</label>\r\n <pep-search *ngIf=\"showSearch && items?.length > numberItemsToShowSearch\" sizeType=\"sm\" shrink=\"always\"\r\n [searchControl]=\"searchControl\" triggerOn=\"keydown\"></pep-search>\r\n </div>\r\n\r\n <pep-draggable-item *ngFor=\"let item of filteredItems$ | async; let i=index;\" class=\"draggble-item\"\r\n
|
|
109
|
-
styles: [".
|
|
108
|
+
template: "<div [id]=\"containerId\" class=\"pep-draggable-items-container\" cdkDropList [cdkDropListData]=\"filteredItems$ | async\"\r\n cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"dropAreaIds\">\r\n\r\n <div *ngIf=\"titleType !== 'none'\" class=\"title-container\"\r\n [ngClass]=\"{ 'pep-border-bottom': titleType === 'with-bottom-border'}\">\r\n <label class=\"title body-{{ titleSizeType }} bold ellipsis \" >{{title}}</label>\r\n <pep-search *ngIf=\"showSearch && items?.length > numberItemsToShowSearch\" sizeType=\"sm\" shrink=\"always\"\r\n [searchControl]=\"searchControl\" triggerOn=\"keydown\"></pep-search>\r\n </div>\r\n\r\n <div class=\"dragable-items-container\">\r\n <pep-draggable-item *ngFor=\"let item of filteredItems$ | async; let i=index;\" class=\"draggble-item\"\r\n [title]=\"item.title\" [data]=\"item.data\" [disabled]=\"item.disabled\" cdkDrag [cdkDragData]=\"item.data\"\r\n [cdkDragDisabled]=\"item.disabled\" (cdkDragStarted)=\"onDragStart($event)\" (cdkDragEnded)=\"onDragEnd($event)\">\r\n \r\n <ng-container *ngIf=\"itemPlaceholderType !== 'regular'\">\r\n <div class=\"placeholder-item {{itemPlaceholderType}}\" *cdkDragPlaceholder></div>\r\n </ng-container>\r\n </pep-draggable-item>\r\n </div>\r\n</div>",
|
|
109
|
+
styles: [".dragable-items-container{display:flex;flex-direction:column;grid-gap:.5rem;gap:.5rem;grid-gap:var(--pep-spacing-sm,.5rem);gap:var(--pep-spacing-sm,.5rem)}.dragable-items-container .draggble-item{cursor:-webkit-grab;cursor:grab}.dragable-items-container .draggble-item.cdk-drag-disabled{cursor:not-allowed}.title-container{height:2.5rem;height:var(--pep-top-bar-field-height,2.5rem);display:flex;flex-flow:row;justify-content:space-between}.title-container .title{align-self:center}.title-container.pep-border-bottom{margin-bottom:1rem;margin-bottom:var(--pep-spacing-lg,1rem)}.placeholder-item{height:2.5rem;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem);width:100%}.placeholder-item.none{opacity:0}.placeholder-item.weak{background:rgba(26,26,26,.12);background:hsla(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%),.12)}", ".placeholder-item.none{opacity:0}.placeholder-item.weak{background:rgba(26,26,26,.12);background:hsla(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%),.12)}"]
|
|
110
110
|
},] }
|
|
111
111
|
];
|
|
112
112
|
DraggableItemsComponent.ctorParameters = function () { return []; };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pepperi-addons-ngx-lib-draggable-items.umd.js","sources":["../../../projects/ngx-lib/draggable-items/draggable-item/draggable-item.component.ts","../../../projects/ngx-lib/draggable-items/draggable-items.component.ts","../../../projects/ngx-lib/draggable-items/draggable-items.module.ts","../../../projects/ngx-lib/draggable-items/public-api.ts","../../../projects/ngx-lib/draggable-items/pepperi-addons-ngx-lib-draggable-items.ts"],"sourcesContent":["import { Component, EventEmitter, HostBinding, Input, OnInit, Output } from '@angular/core';\n\n@Component({\n selector: 'pep-draggable-item',\n templateUrl: './draggable-item.component.html',\n styleUrls: ['./draggable-item.component.scss']\n})\nexport class DraggableItemComponent implements OnInit {\n @Input() title = '';\n @Input() data: any;\n @Input() disabled = false;\n\n constructor() {\n //\n }\n\n ngOnInit(): void {\n //\n }\n}\n","import { CdkDragEnd, CdkDragStart } from '@angular/cdk/drag-drop';\nimport { Component, EventEmitter, HostBinding, Input, OnDestroy, OnInit, Output } from '@angular/core';\nimport { FormControl } from '@angular/forms';\nimport { Observable, Subject } from 'rxjs';\nimport { map, startWith, takeUntil } from 'rxjs/operators';\nimport { IPepDraggableItem, PepDraggableItemPlaceholderType, PepDraggableItemsTitleType } from './draggable-items.model';\nimport { PepSizeType } from '@pepperi-addons/ngx-lib';\n@Component({\n selector: 'pep-draggable-items',\n templateUrl: './draggable-items.component.html',\n styleUrls: ['./draggable-items.component.scss', './draggable-items.component.theme.scss']\n})\nexport class DraggableItemsComponent implements OnInit, OnDestroy {\n\n @Input() containerId = 'draggable-container';\n @Input() showSearch = false;\n @Input() title = '';\n @Input() titleType: PepDraggableItemsTitleType = 'regular';\n @Input() titleSizeType: PepSizeType = 'xl';\n\n @Input() itemPlaceholderType: PepDraggableItemPlaceholderType = 'none';\n\n @Input() dropAreaIds = [];\n\n private _items: Array<IPepDraggableItem> = [];\n @Input()\n set items(value: Array<IPepDraggableItem>) {\n this._items = value;\n\n if (this.items?.length > 0) {\n this.searchControl.enable();\n } else {\n this.searchControl.disable();\n }\n }\n get items(): Array<IPepDraggableItem> {\n return this._items;\n }\n\n @Output() itemDragStarted: EventEmitter<CdkDragStart<IPepDraggableItem>> = new EventEmitter<CdkDragStart<IPepDraggableItem>>();\n @Output() itemDragEnded: EventEmitter<CdkDragEnd<IPepDraggableItem>> = new EventEmitter<CdkDragEnd<IPepDraggableItem>>();\n\n filteredItems$: Observable<any>;\n searchControl = new FormControl();\n numberItemsToShowSearch = 5;\n private readonly _destroyed: Subject<void>;\n\n constructor() {\n //\n this._destroyed = new Subject();\n }\n\n private filterItems(value: string): any[] {\n const filterValue = value.toLowerCase();\n return this.items.filter(\n (opt) =>\n opt.title &&\n opt.title.toLowerCase().includes(filterValue.toLowerCase())\n );\n }\n\n private changeCursorOnDragStart() {\n document.body.classList.add('inheritCursors');\n document.body.style.cursor = 'grabbing';\n }\n\n private changeCursorOnDragEnd() {\n document.body.classList.remove('inheritCursors');\n document.body.style.cursor = 'unset';\n }\n\n protected getDestroyer() {\n return takeUntil(this._destroyed);\n }\n\n ngOnInit(): void {\n // If there is no item disable the search.\n if (this.items.length === 0) {\n this.searchControl.disable();\n }\n\n // Filter the draggableItems by the search control.\n this.filteredItems$ = this.searchControl.valueChanges.pipe(\n this.getDestroyer(),\n startWith<any>(''),\n map((option) =>\n typeof option === 'string' ? option : option && option.value\n ),\n map((value) => (value ? this.filterItems(value) : this.items))\n );\n }\n\n ngOnDestroy(): void {\n this._destroyed.next();\n this._destroyed.complete();\n }\n\n onDragStart(event: CdkDragStart) {\n this.changeCursorOnDragStart();\n this.itemDragStarted.emit(event);\n }\n\n onDragEnd(event: CdkDragEnd) {\n this.changeCursorOnDragEnd();\n this.itemDragEnded.emit(event);\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepButtonModule } from '@pepperi-addons/ngx-lib/button';\nimport { PepSearchModule } from '@pepperi-addons/ngx-lib/search';\n\nimport { DragDropModule } from '@angular/cdk/drag-drop';\n\nimport { DraggableItemsComponent } from './draggable-items.component';\nimport { DraggableItemComponent } from './draggable-item/draggable-item.component';\nimport {\n PepIconModule,\n PepIconRegistry,\n pepIconSystemMove,\n} from '@pepperi-addons/ngx-lib/icon';\n\n@NgModule({\n declarations: [\n DraggableItemsComponent,\n DraggableItemComponent\n ],\n imports: [\n CommonModule,\n ReactiveFormsModule,\n PepNgxLibModule,\n PepButtonModule,\n PepIconModule,\n PepSearchModule,\n DragDropModule\n ],\n exports: [\n DraggableItemsComponent,\n DraggableItemComponent\n ],\n})\nexport class PepDraggableItemsModule {\n constructor(private pepIconRegistry: PepIconRegistry) {\n this.pepIconRegistry.registerIcons([\n pepIconSystemMove,\n ]);\n }\n}\n","/*\n * Public API Surface of ngx-lib/draggable-items\n */\nexport * from './draggable-item/draggable-item.component';\n\nexport * from './draggable-items.module';\nexport * from './draggable-items.model';\nexport * from './draggable-items.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["Component","Input","EventEmitter","FormControl","Subject","takeUntil","startWith","map","Output","pepIconSystemMove","NgModule","CommonModule","ReactiveFormsModule","PepNgxLibModule","PepButtonModule","PepIconModule","PepSearchModule","DragDropModule","PepIconRegistry"],"mappings":";;;;;;;QAYI;YAJS,UAAK,GAAG,EAAE,CAAC;YAEX,aAAQ,GAAG,KAAK,CAAC;;SAIzB;QAED,yCAAQ,GAAR;;SAEC;;;;gBAhBJA,cAAS,SAAC;oBACP,QAAQ,EAAE,oBAAoB;oBAC9B,sfAA8C;;iBAEjD;;;;wBAEIC,UAAK;uBACLA,UAAK;2BACLA,UAAK;;;;QCqCN;YAjCS,gBAAW,GAAG,qBAAqB,CAAC;YACpC,eAAU,GAAG,KAAK,CAAC;YACnB,UAAK,GAAG,EAAE,CAAC;YACX,cAAS,GAA+B,SAAS,CAAC;YAClD,kBAAa,GAAgB,IAAI,CAAC;YAElC,wBAAmB,GAAoC,MAAM,CAAC;YAE9D,gBAAW,GAAG,EAAE,CAAC;YAElB,WAAM,GAA6B,EAAE,CAAC;YAepC,oBAAe,GAAkD,IAAIC,iBAAY,EAAmC,CAAC;YACrH,kBAAa,GAAgD,IAAIA,iBAAY,EAAiC,CAAC;YAGzH,kBAAa,GAAG,IAAIC,iBAAW,EAAE,CAAC;YAClC,4BAAuB,GAAG,CAAC,CAAC;;YAKxB,IAAI,CAAC,UAAU,GAAG,IAAIC,YAAO,EAAE,CAAC;SACnC;QAzBD,sBACI,0CAAK;iBAST;gBACI,OAAO,IAAI,CAAC,MAAM,CAAC;aACtB;iBAZD,UACU,KAA+B;;gBACrC,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;gBAEpB,IAAI,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,MAAM,IAAG,CAAC,EAAE;oBACxB,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC;iBAC/B;qBAAM;oBACH,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,CAAC;iBAChC;aACJ;;;WAAA;QAkBO,6CAAW,GAAX,UAAY,KAAa;YAC7B,IAAM,WAAW,GAAG,KAAK,CAAC,WAAW,EAAE,CAAC;YACxC,OAAO,IAAI,CAAC,KAAK,CAAC,MAAM,CACpB,UAAC,GAAG,IACA,OAAA,GAAG,CAAC,KAAK;gBACT,GAAG,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,GAAA,CAClE,CAAC;SACL;QAEO,yDAAuB,GAAvB;YACJ,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;YAC9C,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU,CAAC;SAC3C;QAEO,uDAAqB,GAArB;YACJ,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC;YACjD,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,OAAO,CAAC;SACxC;QAES,8CAAY,GAAZ;YACN,OAAOC,mBAAS,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;SACrC;QAED,0CAAQ,GAAR;YAAA,iBAeC;;YAbG,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;gBACzB,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,CAAC;aAChC;;YAGD,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,aAAa,CAAC,YAAY,CAAC,IAAI,CACtD,IAAI,CAAC,YAAY,EAAE,EACnBC,mBAAS,CAAM,EAAE,CAAC,EAClBC,aAAG,CAAC,UAAC,MAAM,IACP,OAAA,OAAO,MAAM,KAAK,QAAQ,GAAG,MAAM,GAAG,MAAM,IAAI,MAAM,CAAC,KAAK,GAAA,CAC/D,EACDA,aAAG,CAAC,UAAC,KAAK,IAAK,QAAC,KAAK,GAAG,KAAI,CAAC,WAAW,CAAC,KAAK,CAAC,GAAG,KAAI,CAAC,KAAK,IAAC,CAAC,CACjE,CAAC;SACL;QAED,6CAAW,GAAX;YACI,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;YACvB,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,CAAC;SAC9B;QAED,6CAAW,GAAX,UAAY,KAAmB;YAC3B,IAAI,CAAC,uBAAuB,EAAE,CAAC;YAC/B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SACpC;QAED,2CAAS,GAAT,UAAU,KAAiB;YACvB,IAAI,CAAC,qBAAqB,EAAE,CAAC;YAC7B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SAClC;;;;gBAlGJP,cAAS,SAAC;oBACP,QAAQ,EAAE,qBAAqB;oBAC/B,
|
|
1
|
+
{"version":3,"file":"pepperi-addons-ngx-lib-draggable-items.umd.js","sources":["../../../projects/ngx-lib/draggable-items/draggable-item/draggable-item.component.ts","../../../projects/ngx-lib/draggable-items/draggable-items.component.ts","../../../projects/ngx-lib/draggable-items/draggable-items.module.ts","../../../projects/ngx-lib/draggable-items/public-api.ts","../../../projects/ngx-lib/draggable-items/pepperi-addons-ngx-lib-draggable-items.ts"],"sourcesContent":["import { Component, EventEmitter, HostBinding, Input, OnInit, Output } from '@angular/core';\n\n@Component({\n selector: 'pep-draggable-item',\n templateUrl: './draggable-item.component.html',\n styleUrls: ['./draggable-item.component.scss']\n})\nexport class DraggableItemComponent implements OnInit {\n @Input() title = '';\n @Input() data: any;\n @Input() disabled = false;\n\n constructor() {\n //\n }\n\n ngOnInit(): void {\n //\n }\n}\n","import { CdkDragEnd, CdkDragStart } from '@angular/cdk/drag-drop';\nimport { Component, EventEmitter, HostBinding, Input, OnDestroy, OnInit, Output } from '@angular/core';\nimport { FormControl } from '@angular/forms';\nimport { Observable, Subject } from 'rxjs';\nimport { map, startWith, takeUntil } from 'rxjs/operators';\nimport { IPepDraggableItem, PepDraggableItemPlaceholderType, PepDraggableItemsTitleType } from './draggable-items.model';\nimport { PepSizeType } from '@pepperi-addons/ngx-lib';\n@Component({\n selector: 'pep-draggable-items',\n templateUrl: './draggable-items.component.html',\n styleUrls: ['./draggable-items.component.scss', './draggable-items.component.theme.scss']\n})\nexport class DraggableItemsComponent implements OnInit, OnDestroy {\n\n @Input() containerId = 'draggable-container';\n @Input() showSearch = false;\n @Input() title = '';\n @Input() titleType: PepDraggableItemsTitleType = 'regular';\n @Input() titleSizeType: PepSizeType = 'xl';\n\n @Input() itemPlaceholderType: PepDraggableItemPlaceholderType = 'none';\n\n @Input() dropAreaIds = [];\n\n private _items: Array<IPepDraggableItem> = [];\n @Input()\n set items(value: Array<IPepDraggableItem>) {\n this._items = value;\n\n if (this.items?.length > 0) {\n this.searchControl.enable();\n } else {\n this.searchControl.disable();\n }\n }\n get items(): Array<IPepDraggableItem> {\n return this._items;\n }\n\n @Output() itemDragStarted: EventEmitter<CdkDragStart<IPepDraggableItem>> = new EventEmitter<CdkDragStart<IPepDraggableItem>>();\n @Output() itemDragEnded: EventEmitter<CdkDragEnd<IPepDraggableItem>> = new EventEmitter<CdkDragEnd<IPepDraggableItem>>();\n\n filteredItems$: Observable<any>;\n searchControl = new FormControl();\n numberItemsToShowSearch = 5;\n private readonly _destroyed: Subject<void>;\n\n constructor() {\n //\n this._destroyed = new Subject();\n }\n\n private filterItems(value: string): any[] {\n const filterValue = value.toLowerCase();\n return this.items.filter(\n (opt) =>\n opt.title &&\n opt.title.toLowerCase().includes(filterValue.toLowerCase())\n );\n }\n\n private changeCursorOnDragStart() {\n document.body.classList.add('inheritCursors');\n document.body.style.cursor = 'grabbing';\n }\n\n private changeCursorOnDragEnd() {\n document.body.classList.remove('inheritCursors');\n document.body.style.cursor = 'unset';\n }\n\n protected getDestroyer() {\n return takeUntil(this._destroyed);\n }\n\n ngOnInit(): void {\n // If there is no item disable the search.\n if (this.items.length === 0) {\n this.searchControl.disable();\n }\n\n // Filter the draggableItems by the search control.\n this.filteredItems$ = this.searchControl.valueChanges.pipe(\n this.getDestroyer(),\n startWith<any>(''),\n map((option) =>\n typeof option === 'string' ? option : option && option.value\n ),\n map((value) => (value ? this.filterItems(value) : this.items))\n );\n }\n\n ngOnDestroy(): void {\n this._destroyed.next();\n this._destroyed.complete();\n }\n\n onDragStart(event: CdkDragStart) {\n this.changeCursorOnDragStart();\n this.itemDragStarted.emit(event);\n }\n\n onDragEnd(event: CdkDragEnd) {\n this.changeCursorOnDragEnd();\n this.itemDragEnded.emit(event);\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepButtonModule } from '@pepperi-addons/ngx-lib/button';\nimport { PepSearchModule } from '@pepperi-addons/ngx-lib/search';\n\nimport { DragDropModule } from '@angular/cdk/drag-drop';\n\nimport { DraggableItemsComponent } from './draggable-items.component';\nimport { DraggableItemComponent } from './draggable-item/draggable-item.component';\nimport {\n PepIconModule,\n PepIconRegistry,\n pepIconSystemMove,\n} from '@pepperi-addons/ngx-lib/icon';\n\n@NgModule({\n declarations: [\n DraggableItemsComponent,\n DraggableItemComponent\n ],\n imports: [\n CommonModule,\n ReactiveFormsModule,\n PepNgxLibModule,\n PepButtonModule,\n PepIconModule,\n PepSearchModule,\n DragDropModule\n ],\n exports: [\n DraggableItemsComponent,\n DraggableItemComponent\n ],\n})\nexport class PepDraggableItemsModule {\n constructor(private pepIconRegistry: PepIconRegistry) {\n this.pepIconRegistry.registerIcons([\n pepIconSystemMove,\n ]);\n }\n}\n","/*\n * Public API Surface of ngx-lib/draggable-items\n */\nexport * from './draggable-item/draggable-item.component';\n\nexport * from './draggable-items.module';\nexport * from './draggable-items.model';\nexport * from './draggable-items.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["Component","Input","EventEmitter","FormControl","Subject","takeUntil","startWith","map","Output","pepIconSystemMove","NgModule","CommonModule","ReactiveFormsModule","PepNgxLibModule","PepButtonModule","PepIconModule","PepSearchModule","DragDropModule","PepIconRegistry"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"__symbolic":"module","version":4,"metadata":{"DraggableItemComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"pep-draggable-item","template":"<div class=\"pep-draggable-item-container\" [ngClass]=\"{ 'disable': disabled }\">\n <div class=\"\">\n <pep-button classNames=\"lock-events\" sizeType=\"xs\" iconName=\"system_move\"></pep-button>\n </div>\n <div *ngIf=\"title !== ''\" class=\"title-container\">\n <span class=\"body-sm bold ellipsis title\" title=\"{{title}}\">{{title}}</span>\n </div>\n <div class=\"actions\">\n <ng-content select=\"[pep-actions]\"></ng-content>\n </div>\n</div>","styles":[":host{display:block}.pep-draggable-item-container{height:2.5rem;width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem);padding-inline:.5rem;padding-inline:var(--pep-spacing-sm,.5rem);background:#fafafa;background:hsl(var(--pep-color-regular-h,0),var(--pep-color-regular-s,0%),98%);box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.08);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.08);border:1px solid hsl(0,0%,calc(10% + 30%));border:1px solid hsl(var(--pep-color-regular-h,0),var(--pep-color-regular-s,0%),calc(var(--pep-color-regular-l, 10%) + 30%));box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.16);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.16)}.pep-draggable-item-container.disable{opacity:.35;pointer-events:none}.pep-draggable-item-container .title-container{overflow-x:hidden;margin-inline:.5rem;margin-inline:var(--pep-spacing-sm,.5rem)}.pep-draggable-item-container .title-container .title{display:block}.pep-draggable-item-container .actions{display:inline-flex;grid-gap:.25rem;gap:.25rem;grid-gap:var(--pep-spacing-xs,.25rem);gap:var(--pep-spacing-xs,.25rem)}"]}]}],"members":{"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":8,"character":5}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":9,"character":5}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"PepDraggableItemsModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":18,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"DraggableItemsComponent"},{"__symbolic":"reference","name":"DraggableItemComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":24,"character":8},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":25,"character":8},{"__symbolic":"reference","module":"@pepperi-addons/ngx-lib","name":"PepNgxLibModule","line":26,"character":8},{"__symbolic":"reference","module":"@pepperi-addons/ngx-lib/button","name":"PepButtonModule","line":27,"character":8},{"__symbolic":"reference","module":"@pepperi-addons/ngx-lib/icon","name":"PepIconModule","line":28,"character":8},{"__symbolic":"reference","module":"@pepperi-addons/ngx-lib/search","name":"PepSearchModule","line":29,"character":8},{"__symbolic":"reference","module":"@angular/cdk/drag-drop","name":"DragDropModule","line":30,"character":8}],"exports":[{"__symbolic":"reference","name":"DraggableItemsComponent"},{"__symbolic":"reference","name":"DraggableItemComponent"}]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@pepperi-addons/ngx-lib/icon","name":"PepIconRegistry","line":38,"character":41}]}]}},"PepDraggableItemsTitleType":{"__symbolic":"interface"},"PepDraggableItemPlaceholderType":{"__symbolic":"interface"},"IPepDraggableItem":{"__symbolic":"interface"},"DraggableItemsComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"pep-draggable-items","template":"<div [id]=\"containerId\" class=\"pep-draggable-items-container\" cdkDropList [cdkDropListData]=\"filteredItems$ | async\"\r\n cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"dropAreaIds\">\r\n\r\n <div *ngIf=\"titleType !== 'none'\" class=\"title-container\"\r\n [ngClass]=\"{ 'pep-border-bottom': titleType === 'with-bottom-border'}\">\r\n <label class=\"title body-{{ titleSizeType }} bold ellipsis \" >{{title}}</label>\r\n <pep-search *ngIf=\"showSearch && items?.length > numberItemsToShowSearch\" sizeType=\"sm\" shrink=\"always\"\r\n [searchControl]=\"searchControl\" triggerOn=\"keydown\"></pep-search>\r\n </div>\r\n\r\n <pep-draggable-item *ngFor=\"let item of filteredItems$ | async; let i=index;\" class=\"draggble-item\"\r\n
|
|
1
|
+
{"__symbolic":"module","version":4,"metadata":{"DraggableItemComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"pep-draggable-item","template":"<div class=\"pep-draggable-item-container\" [ngClass]=\"{ 'disable': disabled }\">\n <div class=\"\">\n <pep-button classNames=\"lock-events\" sizeType=\"xs\" iconName=\"system_move\"></pep-button>\n </div>\n <div *ngIf=\"title !== ''\" class=\"title-container\">\n <span class=\"body-sm bold ellipsis title\" title=\"{{title}}\">{{title}}</span>\n </div>\n <div class=\"actions\">\n <ng-content select=\"[pep-actions]\"></ng-content>\n </div>\n</div>","styles":[":host{display:block}.pep-draggable-item-container{height:2.5rem;width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem);padding-inline:.5rem;padding-inline:var(--pep-spacing-sm,.5rem);background:#fafafa;background:hsl(var(--pep-color-regular-h,0),var(--pep-color-regular-s,0%),98%);box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.08);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.08);border:1px solid hsl(0,0%,calc(10% + 30%));border:1px solid hsl(var(--pep-color-regular-h,0),var(--pep-color-regular-s,0%),calc(var(--pep-color-regular-l, 10%) + 30%));box-shadow:0 .125rem .25rem 0 rgba(26,26,26,.16);box-shadow:var(--pep-shadow-xs-offset,0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.16)}.pep-draggable-item-container.disable{opacity:.35;pointer-events:none}.pep-draggable-item-container .title-container{overflow-x:hidden;margin-inline:.5rem;margin-inline:var(--pep-spacing-sm,.5rem)}.pep-draggable-item-container .title-container .title{display:block}.pep-draggable-item-container .actions{display:inline-flex;grid-gap:.25rem;gap:.25rem;grid-gap:var(--pep-spacing-xs,.25rem);gap:var(--pep-spacing-xs,.25rem)}"]}]}],"members":{"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":8,"character":5}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":9,"character":5}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"PepDraggableItemsModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":18,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"DraggableItemsComponent"},{"__symbolic":"reference","name":"DraggableItemComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":24,"character":8},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":25,"character":8},{"__symbolic":"reference","module":"@pepperi-addons/ngx-lib","name":"PepNgxLibModule","line":26,"character":8},{"__symbolic":"reference","module":"@pepperi-addons/ngx-lib/button","name":"PepButtonModule","line":27,"character":8},{"__symbolic":"reference","module":"@pepperi-addons/ngx-lib/icon","name":"PepIconModule","line":28,"character":8},{"__symbolic":"reference","module":"@pepperi-addons/ngx-lib/search","name":"PepSearchModule","line":29,"character":8},{"__symbolic":"reference","module":"@angular/cdk/drag-drop","name":"DragDropModule","line":30,"character":8}],"exports":[{"__symbolic":"reference","name":"DraggableItemsComponent"},{"__symbolic":"reference","name":"DraggableItemComponent"}]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@pepperi-addons/ngx-lib/icon","name":"PepIconRegistry","line":38,"character":41}]}]}},"PepDraggableItemsTitleType":{"__symbolic":"interface"},"PepDraggableItemPlaceholderType":{"__symbolic":"interface"},"IPepDraggableItem":{"__symbolic":"interface"},"DraggableItemsComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"pep-draggable-items","template":"<div [id]=\"containerId\" class=\"pep-draggable-items-container\" cdkDropList [cdkDropListData]=\"filteredItems$ | async\"\r\n cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"dropAreaIds\">\r\n\r\n <div *ngIf=\"titleType !== 'none'\" class=\"title-container\"\r\n [ngClass]=\"{ 'pep-border-bottom': titleType === 'with-bottom-border'}\">\r\n <label class=\"title body-{{ titleSizeType }} bold ellipsis \" >{{title}}</label>\r\n <pep-search *ngIf=\"showSearch && items?.length > numberItemsToShowSearch\" sizeType=\"sm\" shrink=\"always\"\r\n [searchControl]=\"searchControl\" triggerOn=\"keydown\"></pep-search>\r\n </div>\r\n\r\n <div class=\"dragable-items-container\">\r\n <pep-draggable-item *ngFor=\"let item of filteredItems$ | async; let i=index;\" class=\"draggble-item\"\r\n [title]=\"item.title\" [data]=\"item.data\" [disabled]=\"item.disabled\" cdkDrag [cdkDragData]=\"item.data\"\r\n [cdkDragDisabled]=\"item.disabled\" (cdkDragStarted)=\"onDragStart($event)\" (cdkDragEnded)=\"onDragEnd($event)\">\r\n \r\n <ng-container *ngIf=\"itemPlaceholderType !== 'regular'\">\r\n <div class=\"placeholder-item {{itemPlaceholderType}}\" *cdkDragPlaceholder></div>\r\n </ng-container>\r\n </pep-draggable-item>\r\n </div>\r\n</div>","styles":[".dragable-items-container{display:flex;flex-direction:column;grid-gap:.5rem;gap:.5rem;grid-gap:var(--pep-spacing-sm,.5rem);gap:var(--pep-spacing-sm,.5rem)}.dragable-items-container .draggble-item{cursor:-webkit-grab;cursor:grab}.dragable-items-container .draggble-item.cdk-drag-disabled{cursor:not-allowed}.title-container{height:2.5rem;height:var(--pep-top-bar-field-height,2.5rem);display:flex;flex-flow:row;justify-content:space-between}.title-container .title{align-self:center}.title-container.pep-border-bottom{margin-bottom:1rem;margin-bottom:var(--pep-spacing-lg,1rem)}.placeholder-item{height:2.5rem;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem);width:100%}.placeholder-item.none{opacity:0}.placeholder-item.weak{background:rgba(26,26,26,.12);background:hsla(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%),.12)}",".placeholder-item.none{opacity:0}.placeholder-item.weak{background:rgba(26,26,26,.12);background:hsla(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%),.12)}"]}]}],"members":{"containerId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":5}}]}],"showSearch":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":5}}]}],"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":5}}]}],"titleType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":5}}]}],"titleSizeType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":5}}]}],"itemPlaceholderType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":5}}]}],"dropAreaIds":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":5}}]}],"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":5}}]}],"itemDragStarted":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":39,"character":5}}]}],"itemDragEnded":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":40,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor"}],"filterItems":[{"__symbolic":"method"}],"changeCursorOnDragStart":[{"__symbolic":"method"}],"changeCursorOnDragEnd":[{"__symbolic":"method"}],"getDestroyer":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onDragStart":[{"__symbolic":"method"}],"onDragEnd":[{"__symbolic":"method"}]}}},"origins":{"DraggableItemComponent":"./draggable-item/draggable-item.component","PepDraggableItemsModule":"./draggable-items.module","PepDraggableItemsTitleType":"./draggable-items.model","PepDraggableItemPlaceholderType":"./draggable-items.model","IPepDraggableItem":"./draggable-items.model","DraggableItemsComponent":"./draggable-items.component"},"importAs":"@pepperi-addons/ngx-lib/draggable-items"}
|
|
@@ -72,8 +72,8 @@ export class DraggableItemsComponent {
|
|
|
72
72
|
DraggableItemsComponent.decorators = [
|
|
73
73
|
{ type: Component, args: [{
|
|
74
74
|
selector: 'pep-draggable-items',
|
|
75
|
-
template: "<div [id]=\"containerId\" class=\"pep-draggable-items-container\" cdkDropList [cdkDropListData]=\"filteredItems$ | async\"\r\n cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"dropAreaIds\">\r\n\r\n <div *ngIf=\"titleType !== 'none'\" class=\"title-container\"\r\n [ngClass]=\"{ 'pep-border-bottom': titleType === 'with-bottom-border'}\">\r\n <label class=\"title body-{{ titleSizeType }} bold ellipsis \" >{{title}}</label>\r\n <pep-search *ngIf=\"showSearch && items?.length > numberItemsToShowSearch\" sizeType=\"sm\" shrink=\"always\"\r\n [searchControl]=\"searchControl\" triggerOn=\"keydown\"></pep-search>\r\n </div>\r\n\r\n <pep-draggable-item *ngFor=\"let item of filteredItems$ | async; let i=index;\" class=\"draggble-item\"\r\n
|
|
76
|
-
styles: [".
|
|
75
|
+
template: "<div [id]=\"containerId\" class=\"pep-draggable-items-container\" cdkDropList [cdkDropListData]=\"filteredItems$ | async\"\r\n cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"dropAreaIds\">\r\n\r\n <div *ngIf=\"titleType !== 'none'\" class=\"title-container\"\r\n [ngClass]=\"{ 'pep-border-bottom': titleType === 'with-bottom-border'}\">\r\n <label class=\"title body-{{ titleSizeType }} bold ellipsis \" >{{title}}</label>\r\n <pep-search *ngIf=\"showSearch && items?.length > numberItemsToShowSearch\" sizeType=\"sm\" shrink=\"always\"\r\n [searchControl]=\"searchControl\" triggerOn=\"keydown\"></pep-search>\r\n </div>\r\n\r\n <div class=\"dragable-items-container\">\r\n <pep-draggable-item *ngFor=\"let item of filteredItems$ | async; let i=index;\" class=\"draggble-item\"\r\n [title]=\"item.title\" [data]=\"item.data\" [disabled]=\"item.disabled\" cdkDrag [cdkDragData]=\"item.data\"\r\n [cdkDragDisabled]=\"item.disabled\" (cdkDragStarted)=\"onDragStart($event)\" (cdkDragEnded)=\"onDragEnd($event)\">\r\n \r\n <ng-container *ngIf=\"itemPlaceholderType !== 'regular'\">\r\n <div class=\"placeholder-item {{itemPlaceholderType}}\" *cdkDragPlaceholder></div>\r\n </ng-container>\r\n </pep-draggable-item>\r\n </div>\r\n</div>",
|
|
76
|
+
styles: [".dragable-items-container{display:flex;flex-direction:column;grid-gap:.5rem;gap:.5rem;grid-gap:var(--pep-spacing-sm,.5rem);gap:var(--pep-spacing-sm,.5rem)}.dragable-items-container .draggble-item{cursor:-webkit-grab;cursor:grab}.dragable-items-container .draggble-item.cdk-drag-disabled{cursor:not-allowed}.title-container{height:2.5rem;height:var(--pep-top-bar-field-height,2.5rem);display:flex;flex-flow:row;justify-content:space-between}.title-container .title{align-self:center}.title-container.pep-border-bottom{margin-bottom:1rem;margin-bottom:var(--pep-spacing-lg,1rem)}.placeholder-item{height:2.5rem;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem);width:100%}.placeholder-item.none{opacity:0}.placeholder-item.weak{background:rgba(26,26,26,.12);background:hsla(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%),.12)}", ".placeholder-item.none{opacity:0}.placeholder-item.weak{background:rgba(26,26,26,.12);background:hsla(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%),.12)}"]
|
|
77
77
|
},] }
|
|
78
78
|
];
|
|
79
79
|
DraggableItemsComponent.ctorParameters = () => [];
|
|
@@ -89,4 +89,4 @@ DraggableItemsComponent.propDecorators = {
|
|
|
89
89
|
itemDragStarted: [{ type: Output }],
|
|
90
90
|
itemDragEnded: [{ type: Output }]
|
|
91
91
|
};
|
|
92
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
92
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJhZ2dhYmxlLWl0ZW1zLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1saWIvZHJhZ2dhYmxlLWl0ZW1zL2RyYWdnYWJsZS1pdGVtcy5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQ0EsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQWUsS0FBSyxFQUFxQixNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdkcsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQzdDLE9BQU8sRUFBYyxPQUFPLEVBQUUsTUFBTSxNQUFNLENBQUM7QUFDM0MsT0FBTyxFQUFFLEdBQUcsRUFBRSxTQUFTLEVBQUUsU0FBUyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFRM0QsTUFBTSxPQUFPLHVCQUF1QjtJQW1DaEM7UUFqQ1MsZ0JBQVcsR0FBRyxxQkFBcUIsQ0FBQztRQUNwQyxlQUFVLEdBQUcsS0FBSyxDQUFDO1FBQ25CLFVBQUssR0FBRyxFQUFFLENBQUM7UUFDWCxjQUFTLEdBQStCLFNBQVMsQ0FBQztRQUNsRCxrQkFBYSxHQUFnQixJQUFJLENBQUM7UUFFbEMsd0JBQW1CLEdBQW9DLE1BQU0sQ0FBQztRQUU5RCxnQkFBVyxHQUFHLEVBQUUsQ0FBQztRQUVsQixXQUFNLEdBQTZCLEVBQUUsQ0FBQztRQWVwQyxvQkFBZSxHQUFrRCxJQUFJLFlBQVksRUFBbUMsQ0FBQztRQUNySCxrQkFBYSxHQUFnRCxJQUFJLFlBQVksRUFBaUMsQ0FBQztRQUd6SCxrQkFBYSxHQUFHLElBQUksV0FBVyxFQUFFLENBQUM7UUFDbEMsNEJBQXVCLEdBQUcsQ0FBQyxDQUFDO1FBSXhCLEVBQUU7UUFDRixJQUFJLENBQUMsVUFBVSxHQUFHLElBQUksT0FBTyxFQUFFLENBQUM7SUFDcEMsQ0FBQztJQXpCRCxJQUNJLEtBQUssQ0FBQyxLQUErQjs7UUFDckMsSUFBSSxDQUFDLE1B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d0JBQ0wsS0FBSzs0QkFDTCxLQUFLO2tDQUVMLEtBQUs7MEJBRUwsS0FBSztvQkFHTCxLQUFLOzhCQWNMLE1BQU07NEJBQ04sTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENka0RyYWdFbmQsIENka0RyYWdTdGFydCB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9kcmFnLWRyb3AnO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIEhvc3RCaW5kaW5nLCBJbnB1dCwgT25EZXN0cm95LCBPbkluaXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRm9ybUNvbnRyb2wgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBPYnNlcnZhYmxlLCBTdWJqZWN0IH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyBtYXAsIHN0YXJ0V2l0aCwgdGFrZVVudGlsIH0gZnJvbSAncnhqcy9vcGVyYXRvcnMnO1xuaW1wb3J0IHsgSVBlcERyYWdnYWJsZUl0ZW0sIFBlcERyYWdnYWJsZUl0ZW1QbGFjZWhvbGRlclR5cGUsIFBlcERyYWdnYWJsZUl0ZW1zVGl0bGVUeXBlIH0gZnJvbSAnLi9kcmFnZ2FibGUtaXRlbXMubW9kZWwnO1xuaW1wb3J0IHsgUGVwU2l6ZVR5cGUgfSBmcm9tICdAcGVwcGVyaS1hZGRvbnMvbmd4LWxpYic7XG5AQ29tcG9uZW50KHtcbiAgICBzZWxlY3RvcjogJ3BlcC1kcmFnZ2FibGUtaXRlbXMnLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9kcmFnZ2FibGUtaXRlbXMuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL2RyYWdnYWJsZS1pdGVtcy5jb21wb25lbnQuc2NzcycsICcuL2RyYWdnYWJsZS1pdGVtcy5jb21wb25lbnQudGhlbWUuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIERyYWdnYWJsZUl0ZW1zQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBPbkRlc3Ryb3kge1xuXG4gICAgQElucHV0KCkgY29udGFpbmVySWQgPSAnZHJhZ2dhYmxlLWNvbnRhaW5lcic7XG4gICAgQElucHV0KCkgc2hvd1NlYXJjaCA9IGZhbHNlO1xuICAgIEBJbnB1dCgpIHRpdGxlID0gJyc7XG4gICAgQElucHV0KCkgdGl0bGVUeXBlOiBQZXBEcmFnZ2FibGVJdGVtc1RpdGxlVHlwZSA9ICdyZWd1bGFyJztcbiAgICBASW5wdXQoKSB0aXRsZVNpemVUeXBlOiBQZXBTaXplVHlwZSA9ICd4bCc7XG5cbiAgICBASW5wdXQoKSBpdGVtUGxhY2Vob2xkZXJUeXBlOiBQZXBEcmFnZ2FibGVJdGVtUGxhY2Vob2xkZXJUeXBlID0gJ25vbmUnO1xuXG4gICAgQElucHV0KCkgZHJvcEFyZWFJZHMgPSBbXTtcblxuICAgIHByaXZhdGUgX2l0ZW1zOiBBcnJheTxJUGVwRHJhZ2dhYmxlSXRlbT4gPSBbXTtcbiAgICBASW5wdXQoKVxuICAgIHNldCBpdGVtcyh2YWx1ZTogQXJyYXk8SVBlcERyYWdnYWJsZUl0ZW0+KSB7XG4gICAgICAgIHRoaXMuX2l0ZW1zID0gdmFsdWU7XG5cbiAgICAgICAgaWYgKHRoaXMuaXRlbXM/Lmxlbmd0aCA+IDApIHtcbiAgICAgICAgICAgIHRoaXMuc2VhcmNoQ29udHJvbC5lbmFibGUoKTtcbiAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICAgIHRoaXMuc2VhcmNoQ29udHJvbC5kaXNhYmxlKCk7XG4gICAgICAgIH1cbiAgICB9XG4gICAgZ2V0IGl0ZW1zKCk6IEFycmF5PElQZXBEcmFnZ2FibGVJdGVtPiB7XG4gICAgICAgIHJldHVybiB0aGlzLl9pdGVtcztcbiAgICB9XG5cbiAgICBAT3V0cHV0KCkgaXRlbURyYWdTdGFydGVkOiBFdmVudEVtaXR0ZXI8Q2RrRHJhZ1N0YXJ0PElQZXBEcmFnZ2FibGVJdGVtPj4gPSBuZXcgRXZlbnRFbWl0dGVyPENka0RyYWdTdGFydDxJUGVwRHJhZ2dhYmxlSXRlbT4+KCk7XG4gICAgQE91dHB1dCgpIGl0ZW1EcmFnRW5kZWQ6IEV2ZW50RW1pdHRlcjxDZGtEcmFnRW5kPElQZXBEcmFnZ2FibGVJdGVtPj4gPSBuZXcgRXZlbnRFbWl0dGVyPENka0RyYWdFbmQ8SVBlcERyYWdnYWJsZUl0ZW0+PigpO1xuXG4gICAgZmlsdGVyZWRJdGVtcyQ6IE9ic2VydmFibGU8YW55PjtcbiAgICBzZWFyY2hDb250cm9sID0gbmV3IEZvcm1Db250cm9sKCk7XG4gICAgbnVtYmVySXRlbXNUb1Nob3dTZWFyY2ggPSA1O1xuICAgIHByaXZhdGUgcmVhZG9ubHkgX2Rlc3Ryb3llZDogU3ViamVjdDx2b2lkPjtcblxuICAgIGNvbnN0cnVjdG9yKCkge1xuICAgICAgICAvL1xuICAgICAgICB0aGlzLl9kZXN0cm95ZWQgPSBuZXcgU3ViamVjdCgpO1xuICAgIH1cblxuICAgIHByaXZhdGUgZmlsdGVySXRlbXModmFsdWU6IHN0cmluZyk6IGFueVtdIHtcbiAgICAgICAgY29uc3QgZmlsdGVyVmFsdWUgPSB2YWx1ZS50b0xvd2VyQ2FzZSgpO1xuICAgICAgICByZXR1cm4gdGhpcy5pdGVtcy5maWx0ZXIoXG4gICAgICAgICAgICAob3B0KSA9PlxuICAgICAgICAgICAgICAgIG9wdC50aXRsZSAmJlxuICAgICAgICAgICAgICAgIG9wdC50aXRsZS50b0xvd2VyQ2FzZSgpLmluY2x1ZGVzKGZpbHRlclZhbHVlLnRvTG93ZXJDYXNlKCkpXG4gICAgICAgICk7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBjaGFuZ2VDdXJzb3JPbkRyYWdTdGFydCgpIHtcbiAgICAgICAgZG9jdW1lbnQuYm9keS5jbGFzc0xpc3QuYWRkKCdpbmhlcml0Q3Vyc29ycycpO1xuICAgICAgICBkb2N1bWVudC5ib2R5LnN0eWxlLmN1cnNvciA9ICdncmFiYmluZyc7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBjaGFuZ2VDdXJzb3JPbkRyYWdFbmQoKSB7XG4gICAgICAgIGRvY3VtZW50LmJvZHkuY2xhc3NMaXN0LnJlbW92ZSgnaW5oZXJpdEN1cnNvcnMnKTtcbiAgICAgICAgZG9jdW1lbnQuYm9keS5zdHlsZS5jdXJzb3IgPSAndW5zZXQnO1xuICAgIH1cblxuICAgIHByb3RlY3RlZCBnZXREZXN0cm95ZXIoKSB7XG4gICAgICAgIHJldHVybiB0YWtlVW50aWwodGhpcy5fZGVzdHJveWVkKTtcbiAgICB9XG5cbiAgICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICAgICAgLy8gSWYgdGhlcmUgaXMgbm8gaXRlbSBkaXNhYmxlIHRoZSBzZWFyY2guXG4gICAgICAgIGlmICh0aGlzLml0ZW1zLmxlbmd0aCA9PT0gMCkge1xuICAgICAgICAgICAgdGhpcy5zZWFyY2hDb250cm9sLmRpc2FibGUoKTtcbiAgICAgICAgfVxuXG4gICAgICAgIC8vIEZpbHRlciB0aGUgZHJhZ2dhYmxlSXRlbXMgYnkgdGhlIHNlYXJjaCBjb250cm9sLlxuICAgICAgICB0aGlzLmZpbHRlcmVkSXRlbXMkID0gdGhpcy5zZWFyY2hDb250cm9sLnZhbHVlQ2hhbmdlcy5waXBlKFxuICAgICAgICAgICAgdGhpcy5nZXREZXN0cm95ZXIoKSxcbiAgICAgICAgICAgIHN0YXJ0V2l0aDxhbnk+KCcnKSxcbiAgICAgICAgICAgIG1hcCgob3B0aW9uKSA9PlxuICAgICAgICAgICAgICAgIHR5cGVvZiBvcHRpb24gPT09ICdzdHJpbmcnID8gb3B0aW9uIDogb3B0aW9uICYmIG9wdGlvbi52YWx1ZVxuICAgICAgICAgICAgKSxcbiAgICAgICAgICAgIG1hcCgodmFsdWUpID0+ICh2YWx1ZSA/IHRoaXMuZmlsdGVySXRlbXModmFsdWUpIDogdGhpcy5pdGVtcykpXG4gICAgICAgICk7XG4gICAgfVxuXG4gICAgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgICAgIHRoaXMuX2Rlc3Ryb3llZC5uZXh0KCk7XG4gICAgICAgIHRoaXMuX2Rlc3Ryb3llZC5jb21wbGV0ZSgpO1xuICAgIH1cblxuICAgIG9uRHJhZ1N0YXJ0KGV2ZW50OiBDZGtEcmFnU3RhcnQpIHtcbiAgICAgICAgdGhpcy5jaGFuZ2VDdXJzb3JPbkRyYWdTdGFydCgpO1xuICAgICAgICB0aGlzLml0ZW1EcmFnU3RhcnRlZC5lbWl0KGV2ZW50KTtcbiAgICB9XG5cbiAgICBvbkRyYWdFbmQoZXZlbnQ6IENka0RyYWdFbmQpIHtcbiAgICAgICAgdGhpcy5jaGFuZ2VDdXJzb3JPbkRyYWdFbmQoKTtcbiAgICAgICAgdGhpcy5pdGVtRHJhZ0VuZGVkLmVtaXQoZXZlbnQpO1xuICAgIH1cbn1cbiJdfQ==
|
|
@@ -103,8 +103,8 @@ class DraggableItemsComponent {
|
|
|
103
103
|
DraggableItemsComponent.decorators = [
|
|
104
104
|
{ type: Component, args: [{
|
|
105
105
|
selector: 'pep-draggable-items',
|
|
106
|
-
template: "<div [id]=\"containerId\" class=\"pep-draggable-items-container\" cdkDropList [cdkDropListData]=\"filteredItems$ | async\"\r\n cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"dropAreaIds\">\r\n\r\n <div *ngIf=\"titleType !== 'none'\" class=\"title-container\"\r\n [ngClass]=\"{ 'pep-border-bottom': titleType === 'with-bottom-border'}\">\r\n <label class=\"title body-{{ titleSizeType }} bold ellipsis \" >{{title}}</label>\r\n <pep-search *ngIf=\"showSearch && items?.length > numberItemsToShowSearch\" sizeType=\"sm\" shrink=\"always\"\r\n [searchControl]=\"searchControl\" triggerOn=\"keydown\"></pep-search>\r\n </div>\r\n\r\n <pep-draggable-item *ngFor=\"let item of filteredItems$ | async; let i=index;\" class=\"draggble-item\"\r\n
|
|
107
|
-
styles: [".
|
|
106
|
+
template: "<div [id]=\"containerId\" class=\"pep-draggable-items-container\" cdkDropList [cdkDropListData]=\"filteredItems$ | async\"\r\n cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"dropAreaIds\">\r\n\r\n <div *ngIf=\"titleType !== 'none'\" class=\"title-container\"\r\n [ngClass]=\"{ 'pep-border-bottom': titleType === 'with-bottom-border'}\">\r\n <label class=\"title body-{{ titleSizeType }} bold ellipsis \" >{{title}}</label>\r\n <pep-search *ngIf=\"showSearch && items?.length > numberItemsToShowSearch\" sizeType=\"sm\" shrink=\"always\"\r\n [searchControl]=\"searchControl\" triggerOn=\"keydown\"></pep-search>\r\n </div>\r\n\r\n <div class=\"dragable-items-container\">\r\n <pep-draggable-item *ngFor=\"let item of filteredItems$ | async; let i=index;\" class=\"draggble-item\"\r\n [title]=\"item.title\" [data]=\"item.data\" [disabled]=\"item.disabled\" cdkDrag [cdkDragData]=\"item.data\"\r\n [cdkDragDisabled]=\"item.disabled\" (cdkDragStarted)=\"onDragStart($event)\" (cdkDragEnded)=\"onDragEnd($event)\">\r\n \r\n <ng-container *ngIf=\"itemPlaceholderType !== 'regular'\">\r\n <div class=\"placeholder-item {{itemPlaceholderType}}\" *cdkDragPlaceholder></div>\r\n </ng-container>\r\n </pep-draggable-item>\r\n </div>\r\n</div>",
|
|
107
|
+
styles: [".dragable-items-container{display:flex;flex-direction:column;grid-gap:.5rem;gap:.5rem;grid-gap:var(--pep-spacing-sm,.5rem);gap:var(--pep-spacing-sm,.5rem)}.dragable-items-container .draggble-item{cursor:-webkit-grab;cursor:grab}.dragable-items-container .draggble-item.cdk-drag-disabled{cursor:not-allowed}.title-container{height:2.5rem;height:var(--pep-top-bar-field-height,2.5rem);display:flex;flex-flow:row;justify-content:space-between}.title-container .title{align-self:center}.title-container.pep-border-bottom{margin-bottom:1rem;margin-bottom:var(--pep-spacing-lg,1rem)}.placeholder-item{height:2.5rem;border-radius:.25rem;border-radius:var(--pep-border-radius-md,.25rem);width:100%}.placeholder-item.none{opacity:0}.placeholder-item.weak{background:rgba(26,26,26,.12);background:hsla(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%),.12)}", ".placeholder-item.none{opacity:0}.placeholder-item.weak{background:rgba(26,26,26,.12);background:hsla(var(--pep-color-weak-h,0),var(--pep-color-weak-s,0%),var(--pep-color-weak-l,10%),.12)}"]
|
|
108
108
|
},] }
|
|
109
109
|
];
|
|
110
110
|
DraggableItemsComponent.ctorParameters = () => [];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pepperi-addons-ngx-lib-draggable-items.js","sources":["../../../projects/ngx-lib/draggable-items/draggable-item/draggable-item.component.ts","../../../projects/ngx-lib/draggable-items/draggable-items.component.ts","../../../projects/ngx-lib/draggable-items/draggable-items.module.ts","../../../projects/ngx-lib/draggable-items/public-api.ts","../../../projects/ngx-lib/draggable-items/pepperi-addons-ngx-lib-draggable-items.ts"],"sourcesContent":["import { Component, EventEmitter, HostBinding, Input, OnInit, Output } from '@angular/core';\n\n@Component({\n selector: 'pep-draggable-item',\n templateUrl: './draggable-item.component.html',\n styleUrls: ['./draggable-item.component.scss']\n})\nexport class DraggableItemComponent implements OnInit {\n @Input() title = '';\n @Input() data: any;\n @Input() disabled = false;\n\n constructor() {\n //\n }\n\n ngOnInit(): void {\n //\n }\n}\n","import { CdkDragEnd, CdkDragStart } from '@angular/cdk/drag-drop';\nimport { Component, EventEmitter, HostBinding, Input, OnDestroy, OnInit, Output } from '@angular/core';\nimport { FormControl } from '@angular/forms';\nimport { Observable, Subject } from 'rxjs';\nimport { map, startWith, takeUntil } from 'rxjs/operators';\nimport { IPepDraggableItem, PepDraggableItemPlaceholderType, PepDraggableItemsTitleType } from './draggable-items.model';\nimport { PepSizeType } from '@pepperi-addons/ngx-lib';\n@Component({\n selector: 'pep-draggable-items',\n templateUrl: './draggable-items.component.html',\n styleUrls: ['./draggable-items.component.scss', './draggable-items.component.theme.scss']\n})\nexport class DraggableItemsComponent implements OnInit, OnDestroy {\n\n @Input() containerId = 'draggable-container';\n @Input() showSearch = false;\n @Input() title = '';\n @Input() titleType: PepDraggableItemsTitleType = 'regular';\n @Input() titleSizeType: PepSizeType = 'xl';\n\n @Input() itemPlaceholderType: PepDraggableItemPlaceholderType = 'none';\n\n @Input() dropAreaIds = [];\n\n private _items: Array<IPepDraggableItem> = [];\n @Input()\n set items(value: Array<IPepDraggableItem>) {\n this._items = value;\n\n if (this.items?.length > 0) {\n this.searchControl.enable();\n } else {\n this.searchControl.disable();\n }\n }\n get items(): Array<IPepDraggableItem> {\n return this._items;\n }\n\n @Output() itemDragStarted: EventEmitter<CdkDragStart<IPepDraggableItem>> = new EventEmitter<CdkDragStart<IPepDraggableItem>>();\n @Output() itemDragEnded: EventEmitter<CdkDragEnd<IPepDraggableItem>> = new EventEmitter<CdkDragEnd<IPepDraggableItem>>();\n\n filteredItems$: Observable<any>;\n searchControl = new FormControl();\n numberItemsToShowSearch = 5;\n private readonly _destroyed: Subject<void>;\n\n constructor() {\n //\n this._destroyed = new Subject();\n }\n\n private filterItems(value: string): any[] {\n const filterValue = value.toLowerCase();\n return this.items.filter(\n (opt) =>\n opt.title &&\n opt.title.toLowerCase().includes(filterValue.toLowerCase())\n );\n }\n\n private changeCursorOnDragStart() {\n document.body.classList.add('inheritCursors');\n document.body.style.cursor = 'grabbing';\n }\n\n private changeCursorOnDragEnd() {\n document.body.classList.remove('inheritCursors');\n document.body.style.cursor = 'unset';\n }\n\n protected getDestroyer() {\n return takeUntil(this._destroyed);\n }\n\n ngOnInit(): void {\n // If there is no item disable the search.\n if (this.items.length === 0) {\n this.searchControl.disable();\n }\n\n // Filter the draggableItems by the search control.\n this.filteredItems$ = this.searchControl.valueChanges.pipe(\n this.getDestroyer(),\n startWith<any>(''),\n map((option) =>\n typeof option === 'string' ? option : option && option.value\n ),\n map((value) => (value ? this.filterItems(value) : this.items))\n );\n }\n\n ngOnDestroy(): void {\n this._destroyed.next();\n this._destroyed.complete();\n }\n\n onDragStart(event: CdkDragStart) {\n this.changeCursorOnDragStart();\n this.itemDragStarted.emit(event);\n }\n\n onDragEnd(event: CdkDragEnd) {\n this.changeCursorOnDragEnd();\n this.itemDragEnded.emit(event);\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepButtonModule } from '@pepperi-addons/ngx-lib/button';\nimport { PepSearchModule } from '@pepperi-addons/ngx-lib/search';\n\nimport { DragDropModule } from '@angular/cdk/drag-drop';\n\nimport { DraggableItemsComponent } from './draggable-items.component';\nimport { DraggableItemComponent } from './draggable-item/draggable-item.component';\nimport {\n PepIconModule,\n PepIconRegistry,\n pepIconSystemMove,\n} from '@pepperi-addons/ngx-lib/icon';\n\n@NgModule({\n declarations: [\n DraggableItemsComponent,\n DraggableItemComponent\n ],\n imports: [\n CommonModule,\n ReactiveFormsModule,\n PepNgxLibModule,\n PepButtonModule,\n PepIconModule,\n PepSearchModule,\n DragDropModule\n ],\n exports: [\n DraggableItemsComponent,\n DraggableItemComponent\n ],\n})\nexport class PepDraggableItemsModule {\n constructor(private pepIconRegistry: PepIconRegistry) {\n this.pepIconRegistry.registerIcons([\n pepIconSystemMove,\n ]);\n }\n}\n","/*\n * Public API Surface of ngx-lib/draggable-items\n */\nexport * from './draggable-item/draggable-item.component';\n\nexport * from './draggable-items.module';\nexport * from './draggable-items.model';\nexport * from './draggable-items.component';\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":"pepperi-addons-ngx-lib-draggable-items.js","sources":["../../../projects/ngx-lib/draggable-items/draggable-item/draggable-item.component.ts","../../../projects/ngx-lib/draggable-items/draggable-items.component.ts","../../../projects/ngx-lib/draggable-items/draggable-items.module.ts","../../../projects/ngx-lib/draggable-items/public-api.ts","../../../projects/ngx-lib/draggable-items/pepperi-addons-ngx-lib-draggable-items.ts"],"sourcesContent":["import { Component, EventEmitter, HostBinding, Input, OnInit, Output } from '@angular/core';\n\n@Component({\n selector: 'pep-draggable-item',\n templateUrl: './draggable-item.component.html',\n styleUrls: ['./draggable-item.component.scss']\n})\nexport class DraggableItemComponent implements OnInit {\n @Input() title = '';\n @Input() data: any;\n @Input() disabled = false;\n\n constructor() {\n //\n }\n\n ngOnInit(): void {\n //\n }\n}\n","import { CdkDragEnd, CdkDragStart } from '@angular/cdk/drag-drop';\nimport { Component, EventEmitter, HostBinding, Input, OnDestroy, OnInit, Output } from '@angular/core';\nimport { FormControl } from '@angular/forms';\nimport { Observable, Subject } from 'rxjs';\nimport { map, startWith, takeUntil } from 'rxjs/operators';\nimport { IPepDraggableItem, PepDraggableItemPlaceholderType, PepDraggableItemsTitleType } from './draggable-items.model';\nimport { PepSizeType } from '@pepperi-addons/ngx-lib';\n@Component({\n selector: 'pep-draggable-items',\n templateUrl: './draggable-items.component.html',\n styleUrls: ['./draggable-items.component.scss', './draggable-items.component.theme.scss']\n})\nexport class DraggableItemsComponent implements OnInit, OnDestroy {\n\n @Input() containerId = 'draggable-container';\n @Input() showSearch = false;\n @Input() title = '';\n @Input() titleType: PepDraggableItemsTitleType = 'regular';\n @Input() titleSizeType: PepSizeType = 'xl';\n\n @Input() itemPlaceholderType: PepDraggableItemPlaceholderType = 'none';\n\n @Input() dropAreaIds = [];\n\n private _items: Array<IPepDraggableItem> = [];\n @Input()\n set items(value: Array<IPepDraggableItem>) {\n this._items = value;\n\n if (this.items?.length > 0) {\n this.searchControl.enable();\n } else {\n this.searchControl.disable();\n }\n }\n get items(): Array<IPepDraggableItem> {\n return this._items;\n }\n\n @Output() itemDragStarted: EventEmitter<CdkDragStart<IPepDraggableItem>> = new EventEmitter<CdkDragStart<IPepDraggableItem>>();\n @Output() itemDragEnded: EventEmitter<CdkDragEnd<IPepDraggableItem>> = new EventEmitter<CdkDragEnd<IPepDraggableItem>>();\n\n filteredItems$: Observable<any>;\n searchControl = new FormControl();\n numberItemsToShowSearch = 5;\n private readonly _destroyed: Subject<void>;\n\n constructor() {\n //\n this._destroyed = new Subject();\n }\n\n private filterItems(value: string): any[] {\n const filterValue = value.toLowerCase();\n return this.items.filter(\n (opt) =>\n opt.title &&\n opt.title.toLowerCase().includes(filterValue.toLowerCase())\n );\n }\n\n private changeCursorOnDragStart() {\n document.body.classList.add('inheritCursors');\n document.body.style.cursor = 'grabbing';\n }\n\n private changeCursorOnDragEnd() {\n document.body.classList.remove('inheritCursors');\n document.body.style.cursor = 'unset';\n }\n\n protected getDestroyer() {\n return takeUntil(this._destroyed);\n }\n\n ngOnInit(): void {\n // If there is no item disable the search.\n if (this.items.length === 0) {\n this.searchControl.disable();\n }\n\n // Filter the draggableItems by the search control.\n this.filteredItems$ = this.searchControl.valueChanges.pipe(\n this.getDestroyer(),\n startWith<any>(''),\n map((option) =>\n typeof option === 'string' ? option : option && option.value\n ),\n map((value) => (value ? this.filterItems(value) : this.items))\n );\n }\n\n ngOnDestroy(): void {\n this._destroyed.next();\n this._destroyed.complete();\n }\n\n onDragStart(event: CdkDragStart) {\n this.changeCursorOnDragStart();\n this.itemDragStarted.emit(event);\n }\n\n onDragEnd(event: CdkDragEnd) {\n this.changeCursorOnDragEnd();\n this.itemDragEnded.emit(event);\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepButtonModule } from '@pepperi-addons/ngx-lib/button';\nimport { PepSearchModule } from '@pepperi-addons/ngx-lib/search';\n\nimport { DragDropModule } from '@angular/cdk/drag-drop';\n\nimport { DraggableItemsComponent } from './draggable-items.component';\nimport { DraggableItemComponent } from './draggable-item/draggable-item.component';\nimport {\n PepIconModule,\n PepIconRegistry,\n pepIconSystemMove,\n} from '@pepperi-addons/ngx-lib/icon';\n\n@NgModule({\n declarations: [\n DraggableItemsComponent,\n DraggableItemComponent\n ],\n imports: [\n CommonModule,\n ReactiveFormsModule,\n PepNgxLibModule,\n PepButtonModule,\n PepIconModule,\n PepSearchModule,\n DragDropModule\n ],\n exports: [\n DraggableItemsComponent,\n DraggableItemComponent\n ],\n})\nexport class PepDraggableItemsModule {\n constructor(private pepIconRegistry: PepIconRegistry) {\n this.pepIconRegistry.registerIcons([\n pepIconSystemMove,\n ]);\n }\n}\n","/*\n * Public API Surface of ngx-lib/draggable-items\n */\nexport * from './draggable-item/draggable-item.component';\n\nexport * from './draggable-items.module';\nexport * from './draggable-items.model';\nexport * from './draggable-items.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|