@progress/kendo-angular-grid
Version:
Kendo UI Grid for Angular - high performance data grid with paging, filtering, virtualization, CRUD, and more.
130 lines (129 loc) • 5.29 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { Injectable, SecurityContext } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
import { isDocumentAvailable } from '@progress/kendo-angular-common';
import { append } from './common';
import { IconsService } from '@progress/kendo-angular-icons';
import { lockIcon, unlockIcon, plusIcon, cancelIcon } from '@progress/kendo-svg-icons';
import * as i0 from "@angular/core";
import * as i1 from "@angular/platform-browser";
import * as i2 from "@progress/kendo-angular-icons";
const updateClass = (element, valid, svg) => {
const icon = element.querySelector('.k-icon');
if (svg) {
const svg = icon.firstElementChild;
svg.removeChild(svg.firstElementChild);
const path = valid ? plusIcon.content : cancelIcon.content;
icon.firstElementChild.innerHTML = path + icon.firstElementChild.innerHTML;
}
icon.setAttribute('class', icon.getAttribute('class').replace(/(plus|cancel)/, valid ? 'plus' : 'cancel'));
};
const updateLock = (element, locked = null, svg) => {
const icon = element.querySelectorAll('.k-icon')[1];
const value = locked === null ? '' : (locked ? `k${svg ? '-svg' : ''}-i-lock` : `k${svg ? '-svg' : ''}-i-unlock`);
if (svg) {
icon.setAttribute('class', icon.getAttribute('class').replace(/(k-svg-i-unlock|k-svg-i-lock)/, '').trim() + ` ${value}`);
icon.firstElementChild.innerHTML = locked ? lockIcon.content : unlockIcon.content;
}
else {
icon.setAttribute('class', icon.getAttribute('class').replace(/(k-i-unlock|k-i-lock)/, '').trim() + ` ${value}`);
}
};
const decorate = (element) => {
element.className = 'k-header k-drag-clue';
element.style.position = 'absolute';
element.style.zIndex = '20000';
};
const svgIconsMarkup = (viewBox, content, safeTitle) => `
<span class="k-icon k-svg-icon k-drag-status k-svg-i-cancel">
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="${viewBox}"
aria-hidden="true">
${content}
</svg>
<span class="k-icon k-svg-icon k-icon-modifier">
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="${viewBox}"
aria-hidden="true">
</svg>
</span>
</span>
${safeTitle}`;
const fontIconsMarkup = (safeTitle) => `
<span class="k-icon k-font-icon k-drag-status k-i-cancel">
<span class="k-icon k-font-icon k-icon-modifier"></span>
</span>
${safeTitle}`;
/**
* @hidden
*/
export class DragHintService {
santizer;
iconsService;
dom;
cancelIcon = cancelIcon;
constructor(santizer, iconsService) {
this.santizer = santizer;
this.iconsService = iconsService;
}
create(title) {
if (!isDocumentAvailable()) {
return;
}
this.dom = document.createElement("div");
decorate(this.dom);
const safeTitle = this.santizer.sanitize(SecurityContext.HTML, title);
const innerHtml = this.isSVG ?
svgIconsMarkup(this.cancelIcon.viewBox, this.cancelIcon.content, safeTitle) :
fontIconsMarkup(safeTitle);
this.dom.innerHTML = innerHtml;
}
attach() {
return append(this.dom);
}
remove() {
if (this.dom && this.dom.parentNode) {
(function (el) {
setTimeout(() => document.body.removeChild(el));
})(this.dom); // hack for IE + pointer events!
this.dom = null;
}
}
show() {
this.dom.style.display = "";
}
hide() {
this.dom.style.display = "none";
}
enable() {
updateClass(this.dom, true, this.isSVG);
}
disable() {
updateClass(this.dom, false, this.isSVG);
}
removeLock() {
updateLock(this.dom, false, this.isSVG);
}
toggleLock(locked) {
updateLock(this.dom, locked, this.isSVG);
}
move(move) {
this.dom.style.top = move.pageY + 'px';
this.dom.style.left = move.pageX + 'px';
}
get isSVG() {
return (this.iconsService.iconSettings?.type || this.iconsService.changes.value.type) === 'svg';
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DragHintService, deps: [{ token: i1.DomSanitizer }, { token: i2.IconsService }], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DragHintService });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DragHintService, decorators: [{
type: Injectable
}], ctorParameters: function () { return [{ type: i1.DomSanitizer }, { type: i2.IconsService }]; } });