| 1 | {"version":3,"file":"sortable.component.js","sourceRoot":"","sources":["../../../../src/sortable/sortable.component.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Input,\n Output,\n EventEmitter,\n forwardRef,\n TemplateRef\n} from '@angular/core';\nimport { NG_VALUE_ACCESSOR, ControlValueAccessor } from '@angular/forms';\nimport { DraggableItem } from './draggable-item';\nimport { DraggableItemService } from './draggable-item.service';\n\n@Component({\n selector: 'bs-sortable',\n exportAs: 'bs-sortable',\n template: `\n<div\n [ngClass]=\"wrapperClass\"\n [ngStyle]=\"wrapperStyle\"\n (dragover)=\"cancelEvent($event)\"\n (dragenter)=\"cancelEvent($event)\"\n (drop)=\"resetActiveItem($event)\"\n (mouseleave)=\"resetActiveItem($event)\">\n <div\n *ngIf=\"showPlaceholder\"\n [ngClass]=\"placeholderClass\"\n [ngStyle]=\"placeholderStyle\"\n (dragover)=\"onItemDragover($event, 0)\"\n (dragenter)=\"cancelEvent($event)\"\n >{{placeholderItem}}</div>\n <div\n *ngFor=\"let item of items; let i=index;\"\n [ngClass]=\"[ itemClass, i === activeItem ? itemActiveClass : '' ]\"\n [ngStyle]=\"getItemStyle(i === activeItem)\"\n draggable=\"true\"\n (dragstart)=\"onItemDragstart($event, item, i)\"\n (dragend)=\"resetActiveItem($event)\"\n (dragover)=\"onItemDragover($event, i)\"\n (dragenter)=\"cancelEvent($event)\"\n aria-dropeffect=\"move\"\n [attr.aria-grabbed]=\"i === activeItem\"\n ><ng-template [ngTemplateOutlet]=\"itemTemplate || defItemTemplate\"\n [ngTemplateOutletContext]=\"{item:item, index: i}\"></ng-template></div>\n</div>\n\n<ng-template #defItemTemplate let-item=\"item\">{{item.value}}</ng-template>\n`,\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => SortableComponent),\n multi: true\n }\n ]\n})\nexport class SortableComponent implements ControlValueAccessor {\n private static globalZoneIndex = 0;\n /** field name if input array consists of objects */\n @Input() fieldName?: string;\n\n /** class name for items wrapper */\n @Input() wrapperClass = '';\n\n /** style object for items wrapper */\n @Input() wrapperStyle: Record<string, string> = {};\n\n /** class name for item */\n @Input() itemClass = '';\n\n /** style object for item */\n @Input() itemStyle: Record<string, string> = {};\n\n /** class name for active item */\n @Input() itemActiveClass = '';\n\n /** style object for active item */\n @Input() itemActiveStyle: Record<string, string> = {};\n\n /** class name for placeholder */\n @Input() placeholderClass = '';\n\n /** style object for placeholder */\n @Input() placeholderStyle: Record<string, string> = {};\n\n /** placeholder item which will be shown if collection is empty */\n @Input() placeholderItem = '';\n\n /** used to specify a custom item template. Template variables: item and index; */\n @Input() itemTemplate?: TemplateRef<unknown>;\n\n /** fired on array change (reordering, insert, remove), same as <code>ngModelChange</code>.\n * Returns new items collection as a payload.\n */\n @Output() onChange: EventEmitter<unknown[]> = new EventEmitter<unknown[]>();\n\n showPlaceholder = false;\n activeItem = -1;\n\n get items(): SortableItem[] {\n return this._items;\n }\n\n set items(value: SortableItem[]) {\n this._items = value;\n const out = this.items.map((x: SortableItem) => x.initData);\n this.onChanged(out);\n this.onChange.emit(out);\n }\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n onTouched: any = Function.prototype;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n onChanged: any = Function.prototype;\n\n private transfer: DraggableItemService;\n private currentZoneIndex: number;\n private _items: SortableItem[] = [];\n\n constructor(transfer: DraggableItemService) {\n this.transfer = transfer;\n this.currentZoneIndex = SortableComponent.globalZoneIndex++;\n this.transfer\n .onCaptureItem()\n .subscribe((item: DraggableItem) => this.onDrop(item));\n }\n\n onItemDragstart(\n event: DragEvent,\n item: SortableItem,\n i: number\n ): void {\n this.initDragstartEvent(event);\n this.onTouched();\n this.transfer.dragStart({\n event,\n item,\n i,\n initialIndex: i,\n lastZoneIndex: this.currentZoneIndex,\n overZoneIndex: this.currentZoneIndex\n });\n }\n\n onItemDragover(event: DragEvent, i: number): void {\n if (!this.transfer.getItem()) {\n return;\n }\n event.preventDefault();\n const dragItem = this.transfer.captureItem(\n this.currentZoneIndex,\n this.items.length\n );\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n let newArray: any[] = [];\n\n if (!dragItem) {\n return;\n }\n\n if (!this.items.length) {\n newArray = [dragItem.item];\n } else if (dragItem.i > i) {\n newArray = [\n ...this.items.slice(0, i),\n dragItem.item,\n ...this.items.slice(i, dragItem.i),\n ...this.items.slice(dragItem.i + 1)\n ];\n } else {\n // this.draggedItem.i < i\n newArray = [\n ...this.items.slice(0, dragItem.i),\n ...this.items.slice(dragItem.i + 1, i + 1),\n dragItem.item,\n ...this.items.slice(i + 1)\n ];\n }\n this.items = newArray;\n dragItem.i = i;\n this.activeItem = i;\n this.updatePlaceholderState();\n }\n\n cancelEvent(event?: DragEvent|MouseEvent): void {\n if (!this.transfer.getItem() || !event) {\n return;\n }\n event.preventDefault();\n }\n\n onDrop(item: DraggableItem): void {\n if (\n item &&\n item.overZoneIndex !== this.currentZoneIndex &&\n item.lastZoneIndex === this.currentZoneIndex\n ) {\n this.items = this.items.filter(\n (x: SortableItem, i: number) => i !== item.i\n );\n this.updatePlaceholderState();\n }\n this.resetActiveItem();\n }\n\n resetActiveItem(event?: DragEvent|MouseEvent): void {\n this.cancelEvent(event);\n this.activeItem = -1;\n }\n\n registerOnChange(callback: () => void): void {\n this.onChanged = callback;\n }\n\n registerOnTouched(callback: () => void): void {\n this.onTouched = callback;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n writeValue(value: any[]): void {\n if (value) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.items = value.map((x: any, i: number) => ({\n id: i,\n initData: x,\n value: this.fieldName ? x[this.fieldName] : x\n }));\n } else {\n this.items = [];\n }\n this.updatePlaceholderState();\n }\n\n updatePlaceholderState(): void {\n this.showPlaceholder = !this._items.length;\n }\n\n getItemStyle(isActive: boolean) {\n return isActive\n ? Object.assign({}, this.itemStyle, this.itemActiveStyle)\n : this.itemStyle;\n }\n\n private initDragstartEvent(event: DragEvent): void {\n // it is necessary for mozilla\n // data type should be 'Text' instead of 'text/plain' to keep compatibility\n // with IE\n event.dataTransfer?.setData('Text', 'placeholder');\n }\n}\n\nexport declare interface SortableItem {\n id: number;\n value: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n initData: any;\n}\n"]} |