vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-09 00:42:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

Refactor

Browse source
This commit is contained in:
tugcekucukoglu 2024-03-19 17:14:13 +03:00
parent 855be4bfa1
commit 5250943440
19 changed files with 86 additions and 247 deletions
Download patch file Download diff file Expand all files Collapse all files

12
components/lib/inputnumber/BaseInputNumber.vue
View file

@ -137,18 +137,6 @@ export default {
type: Object,
default: null
},
inputProps: {
type: null,
default: null
},
incrementButtonProps: {
type: null,
default: null
},
decrementButtonProps: {
type: null,
default: null
},
ariaLabelledby: {
type: String,
default: null

95
components/lib/inputnumber/InputNumber.d.ts vendored
View file

@ -7,7 +7,7 @@
* @module inputnumber
*
*/
import { ButtonHTMLAttributes, InputHTMLAttributes, VNode } from 'vue';
import { VNode } from 'vue';
import { ComponentHooks } from '../basecomponent';
import { InputTextPassThroughOptions } from '../inputtext';
import { PassThroughOptions } from '../passthrough';
@ -142,6 +142,37 @@ export interface InputNumberState {
focused: boolean;
}
/**
* Defines valid listeners in InputNumber component.
*/
export interface InputNumberButtonListeners {
/**
* Mouse down event of increment button.
* @param {Event} event - Browser event
*/
onMousedown: (event: Event) => void;
/**
* Mouse up event of increment button.
* @param {Event} event - Browser event
*/
onMouseup: (event: Event) => void;
/**
* Mouse leave event of increment button.
* @param {Event} event - Browser event
*/
onMouseleave: (event: Event) => void;
/**
* Key down event of increment button.
* @param {Event} event - Browser event
*/
onKeydown: (event: Event) => void;
/**
* Key up event of increment button.
* @param {Event} event - Browser event
*/
onKeyup: (event: Event) => void;
}
/**
* Defines valid properties in InputNumber component.
*/
@ -295,18 +326,6 @@ export interface InputNumberProps {
* Inline style of the input field.
*/
inputStyle?: object | undefined;
/**
* Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.
*/
inputProps?: InputHTMLAttributes | undefined;
/**
* Used to pass all properties of the HTMLButtonElement to increment button inside the component.
*/
incrementButtonProps?: ButtonHTMLAttributes | undefined;
/**
* Used to pass all properties of the HTMLButtonElement to decrement button inside the component.
*/
decrementButtonProps?: ButtonHTMLAttributes | undefined;
/**
* Establishes relationships between the component and label(s) where its value should be one or more element IDs.
*/
@ -341,60 +360,18 @@ export interface InputNumberSlots {
*/
incrementbutton(scope: {
/**
* Mouse down event of increment button.
* @param {Event} event - Browser event
* InputNumber listeners
*/
onMousedown: (event: Event) => void;
/**
* Mouse up event of increment button.
* @param {Event} event - Browser event
*/
onMouseup: (event: Event) => void;
/**
* Mouse leave event of increment button.
* @param {Event} event - Browser event
*/
onMouseleave: (event: Event) => void;
/**
* Key down event of increment button.
* @param {Event} event - Browser event
*/
onKeydown: (event: Event) => void;
/**
* Key up event of increment button.
* @param {Event} event - Browser event
*/
onKeyup: (event: Event) => void;
listeners: InputNumberButtonListeners;
}): VNode[];
/**
* Custom decrement button template.
*/
decrementbutton(scope: {
/**
* Mouse down event of decrement button.
* @param {Event} event - Browser event
* InputNumber listeners
*/
onMousedown: (event: Event) => void;
/**
* Mouse up event of decrement button.
* @param {Event} event - Browser event
*/
onMouseup: (event: Event) => void;
/**
* Mouse leave event of decrement button.
* @param {Event} event - Browser event
*/
onMouseleave: (event: Event) => void;
/**
* Key down event of decrement button.
* @param {Event} event - Browser event
*/
onKeydown: (event: Event) => void;
/**
* Key up event of decrement button.
* @param {Event} event - Browser event
*/
onKeyup: (event: Event) => void;
listeners: InputNumberButtonListeners;
}): VNode[];
/**
* Custom increment button icon template.

41
components/lib/inputnumber/InputNumber.vue
View file

@ -1,6 +1,6 @@
<template>
<span :class="cx('root')" v-bind="ptmi('root')">
<INInputText
<InputText
ref="input"
:id="inputId"
role="spinbutton"
@ -23,51 +23,34 @@
@click="onInputClick"
@focus="onInputFocus"
@blur="onInputBlur"
v-bind="inputProps"
:pt="ptm('input')"
:unstyled="unstyled"
/>
<span v-if="showButtons && buttonLayout === 'stacked'" :class="cx('buttonGroup')" v-bind="ptm('buttonGroup')">
<slot name="incrementbutton" v-on="upButtonListeners">
<button :class="[cx('incrementButton'), incrementButtonClass]" v-on="upButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="{ ...incrementButtonProps, ...ptm('incrementButton') }">
<slot name="incrementbutton" :listeners="upButtonListeners">
<button :class="[cx('incrementButton'), incrementButtonClass]" v-on="upButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="ptm('incrementButton')">
<slot name="incrementbuttonicon">
<component :is="incrementButtonIcon ? 'span' : 'AngleUpIcon'" :class="incrementButtonIcon" v-bind="ptm('incrementButtonIcon')" data-pc-section="incrementbuttonicon" />
</slot>
</button>
</slot>
<slot name="decrementbutton" v-on="downButtonListeners">
<button :class="[cx('decrementButton'), decrementButtonClass]" v-on="downButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="{ ...decrementButtonProps, ...ptm('decrementButton') }">
<slot name="decrementbutton" :listeners="downButtonListeners">
<button :class="[cx('decrementButton'), decrementButtonClass]" v-on="downButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="ptm('decrementButton')">
<slot name="decrementbuttonicon">
<component :is="decrementButtonIcon ? 'span' : 'AngleDownIcon'" :class="decrementButtonIcon" v-bind="ptm('decrementButtonIcon')" data-pc-section="decrementbuttonicon" />
</slot>
</button>
</slot>
</span>
<slot name="incrementbutton" v-on="upButtonListeners">
<button
v-if="showButtons && buttonLayout !== 'stacked'"
:class="[cx('incrementButton'), incrementButtonClass]"
v-on="upButtonListeners"
:disabled="disabled"
:tabindex="-1"
aria-hidden="true"
v-bind="{ ...incrementButtonProps, ...ptm('incrementButton') }"
>
<slot name="incrementbutton" :listeners="upButtonListeners">
<button v-if="showButtons && buttonLayout !== 'stacked'" :class="[cx('incrementButton'), incrementButtonClass]" v-on="upButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="ptm('incrementButton')">
<slot name="incrementbuttonicon">
<component :is="incrementButtonIcon ? 'span' : 'AngleUpIcon'" :class="incrementButtonIcon" v-bind="ptm('incrementButtonIcon')" data-pc-section="incrementbuttonicon" />
</slot>
</button>
</slot>
<slot name="decrementbutton" v-on="downButtonListeners">
<button
v-if="showButtons && buttonLayout !== 'stacked'"
:class="[cx('decrementButton'), decrementButtonClass]"
v-on="downButtonListeners"
:disabled="disabled"
:tabindex="-1"
aria-hidden="true"
v-bind="{ ...decrementButtonProps, ...ptm('decrementButton') }"
>
<slot name="decrementbutton" :listeners="downButtonListeners">
<button v-if="showButtons && buttonLayout !== 'stacked'" :class="[cx('decrementButton'), decrementButtonClass]" v-on="downButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="ptm('decrementButton')">
<slot name="decrementbuttonicon">
<component :is="decrementButtonIcon ? 'span' : 'AngleDownIcon'" :class="decrementButtonIcon" v-bind="ptm('decrementButtonIcon')" data-pc-section="decrementbuttonicon" />
</slot>
@ -983,9 +966,9 @@ export default {
}
},
components: {
INInputText: InputText,
AngleUpIcon: AngleUpIcon,
AngleDownIcon: AngleDownIcon
InputText,
AngleUpIcon,
AngleDownIcon
}
};
</script>