1 line
27 KiB
Plaintext
1 line
27 KiB
Plaintext
|
{"version":3,"file":"primeng-knob.mjs","sources":["../../src/app/components/knob/knob.ts","../../src/app/components/knob/primeng-knob.ts"],"sourcesContent":["import { CommonModule, DOCUMENT } from '@angular/common';\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Inject, Input, NgModule, Output, Renderer2, ViewEncapsulation, booleanAttribute, forwardRef, numberAttribute } from '@angular/core';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { VoidListener } from 'primeng/ts-helpers';\n\nexport const KNOB_VALUE_ACCESSOR: any = {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => Knob),\n multi: true\n};\n/**\n * Knob is a form component to define number inputs with a dial.\n * @group Components\n */\n@Component({\n selector: 'p-knob',\n template: `\n <div [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\" [attr.data-pc-name]=\"'knob'\" [attr.data-pc-section]=\"'root'\">\n <svg\n viewBox=\"0 0 100 100\"\n role=\"slider\"\n [style.width]=\"size + 'px'\"\n [style.height]=\"size + 'px'\"\n (click)=\"onClick($event)\"\n (keydown)=\"onKeyDown($event)\"\n (mousedown)=\"onMouseDown($event)\"\n (mouseup)=\"onMouseUp($event)\"\n (touchstart)=\"onTouchStart($event)\"\n (touchend)=\"onTouchEnd($event)\"\n [attr.aria-valuemin]=\"min\"\n [attr.aria-valuemax]=\"max\"\n [attr.aria-valuenow]=\"_value\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.tabindex]=\"readonly || disabled ? -1 : tabindex\"\n [attr.data-pc-section]=\"'svg'\"\n >\n <path [attr.d]=\"rangePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"rangeColor\" class=\"p-knob-range\"></path>\n <path [attr.d]=\"valuePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"valueColor\" class=\"p-knob-value\"></path>\n <text *ngIf=\"showValue\" [attr.x]=\"50\" [attr.y]=\"57\" text-anchor=\"middle\" [attr.fill]=\"textColor\" class=\"p-knob-text\" [attr.name]=\"name\">{{ valueToDisplay() }}</text>\n </svg>\n </div>\n `,\n providers: [KNOB_VALUE_ACCESSOR],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n styleUrls: ['./knob.css'],\n host: {\n class: 'p-element'\n }\n})\nexport class Knob {\n /**\n * Style class of the component.\n * @group Props\n */\n @Input() styleClass: string | undefined;\n /**\n * Inline style of the component.\n * @group Props\n */\n @Input() style: { [klass: string]: any } | null | undefined;\n /**\n * Defines a string that labels the input for accessibility.\n * @group Props\n */\n @Input() ariaLabel: string | undefined;\n /**\n * Specifies one or more IDs in the DOM that labels the input field.\n * @group Props\n */\n @Input() ariaLabelledBy: string | undefined;\n /**\n * Index of the element in tabbing order.\n * @group Props\n */\n @Input({ transform: numberAttribute }) tabindex: number = 0;\n /**\n * Background of the value.\n * @group Props\n */\n @Input() valueColor: string = 'var(--primary-color, Black)';\n /**\n * Background color of the range.\n * @group Props\n */\n @Input() rangeColor: string = 'var(--surface-border, LightGray)';\n /**\n * Color of the value text.\n * @group Props\n */\n @Input() textColor: string = 'var(--text-color-secondary, Black)';\n /**\n * Template string of the value.\n * @group Props\n */\n @Input() valueTemplate: string = '{value}';\n /**\n * Name of the input element.\n * @group Props\n */\n @Input() name: string | undefined;\n /**\n * Size of the component in pixels.\
|