Fixed #1836 - For Knob

pull/1846/head
mertsincan 2021-12-01 16:47:05 +03:00
parent 496d8b2197
commit e3ae1aca65
1 changed files with 92 additions and 18 deletions

View File

@ -1,23 +1,97 @@
interface KnobProps {
modelValue?: number;
size?: number;
disabled?: boolean;
readonly?: boolean;
step?: number;
min?: number;
max?: number;
valueColor?: string;
rangeColor?: string;
textColor?: string;
strokeWidth?: number;
showValue?: boolean;
valueTemplate?: string;
import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
export interface KnobProps {
/**
* Value of the component.
*/
modelValue?: number | undefined;
/**
* Size of the component in pixels.
* Default value is 100.
*/
size?: number | undefined;
/**
* When present, it specifies that the component should be disabled.
*/
disabled?: boolean | undefined;
/**
* When present, it specifies that the component value cannot be edited.
*/
readonly?: boolean | undefined;
/**
* Step factor to increment/decrement the value.
*/
step?: number | undefined;
/**
* Mininum boundary value.
* Default value is 0.
*/
min?: number | undefined;
/**
* Maximum boundary value.
* Default value is 100.
*/
max?: number | undefined;
/**
* Background of the value.
*/
valueColor?: string | undefined;
/**
* Background color of the range.
*/
rangeColor?: string | undefined;
/**
* Color of the value text.
*/
textColor?: string | undefined;
/**
* Width of the knob stroke.
* Default value is 14.
*/
strokeWidth?: number | undefined;
/**
* Whether the show the value inside the knob.
* Default value is true.
*/
showValue?: boolean | undefined;
/**
* Template string of the value.
* Default value is '{value}'.
*/
valueTemplate?: string | undefined;
}
declare class Knob {
$props: KnobProps;
$emit(eventName: 'update:modelValue', value: number): this;
$emit(eventName: 'change', value: any): this;
export interface KnobSlots {
}
export declare type KnobEmits = {
/**
* Emitted when the value changes.
* @param {number} value - New value.
*/
'update:modelValue': (value: number) => void;
/**
* Callback to invoke when the value changes.
* @param {number} value - New value
*/
'change': (value: number) => void;
}
declare class Knob extends ClassComponent<KnobProps, KnobSlots, KnobEmits> { }
declare module '@vue/runtime-core' {
interface GlobalComponents {
Knob: GlobalComponentConstructor<Knob>
}
}
/**
*
* Knob is a form component to define number inputs with a dial.
*
* Demos:
*
* - [Knob](https://www.primefaces.org/primevue/showcase/#/knob)
*
*/
export default Knob;