vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Refactor #3832 Refactor #3833 - For InputNumber

pull/3841/head
Tuğçe Küçükoğlu 2023-04-04 15:40:30 +03:00
parent ad64a8aeab
commit 06124bd86e
3 changed files with 51 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
api-generator/components/inputnumber.js
View File

@ -231,11 +231,23 @@ const InputNumberEvents = [
}
];
const InputNumberSlots = [
{
name: 'incrementbuttonicon',
description: 'Custom increment button icon template.'
},
{
name: 'decrementbuttonicon',
description: 'Custom decrement button icon template.'
}
];
module.exports = {
inputnumber: {
name: 'InputNumber',
description: 'InputNumber is an input component to provide numerical input.',
props: InputNumberProps,
events: InputNumberEvents
events: InputNumberEvents,
slots: InputNumberSlots
}
};

15
components/lib/inputnumber/InputNumber.d.ts vendored
View File

@ -7,7 +7,7 @@
* @module inputnumber
*
*/
import { ButtonHTMLAttributes, InputHTMLAttributes } from 'vue';
import { ButtonHTMLAttributes, InputHTMLAttributes, VNode } from 'vue';
import { ClassComponent, GlobalComponentConstructor, Nullable } from '../ts-helpers';
/**
@ -73,12 +73,10 @@ export interface InputNumberProps {
decrementButtonClass?: string | undefined;
/**
* Style class of the increment button.
* @defaultValue pi pi-angle-up
*/
incrementButtonIcon?: string | undefined;
/**
* Style class of the decrement button.
* @defaultValue pi pi-angle-down
*/
decrementButtonIcon?: string | undefined;
/**
@ -203,7 +201,16 @@ export interface InputNumberProps {
/**
* Defines valid slots in InputNumber component.
*/
export interface InputNumberSlots {}
export interface InputNumberSlots {
/**
* Custom increment button icon template.
*/
incrementbuttonicon(): VNode[];
/**
* Custom decrement button icon template.
*/
decrementbuttonicon(): VNode[];
}
/**
* Defines valid emits in InputNumber component.

34
components/lib/inputnumber/InputNumber.vue
View File

@ -26,16 +26,34 @@
v-bind="inputProps"
/>
<span v-if="showButtons && buttonLayout === 'stacked'" class="p-inputnumber-button-group">
<INButton :class="upButtonClass" :icon="incrementButtonIcon" v-on="upButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="incrementButtonProps" />
<INButton :class="downButtonClass" :icon="decrementButtonIcon" v-on="downButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="decrementButtonProps" />
<INButton :class="upButtonClass" v-on="upButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="incrementButtonProps">
<slot name="incrementbuttonicon">
<component :is="incrementButtonIcon ? 'span' : 'AngleUpIcon'" :class="incrementButtonIcon" />
</slot>
</INButton>
<INButton :class="downButtonClass" :icon="decrementButtonIcon" v-on="downButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="decrementButtonProps">
<slot name="decrementbuttonicon">
<component :is="decrementButtonIcon ? 'span' : 'AngleDownIcon'" :class="decrementButtonIcon" />
</slot>
</INButton>
</span>
<INButton v-if="showButtons && buttonLayout !== 'stacked'" :class="upButtonClass" :icon="incrementButtonIcon" v-on="upButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="incrementButtonProps" />
<INButton v-if="showButtons && buttonLayout !== 'stacked'" :class="downButtonClass" :icon="decrementButtonIcon" v-on="downButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="decrementButtonProps" />
<INButton v-if="showButtons && buttonLayout !== 'stacked'" :class="upButtonClass" :icon="incrementButtonIcon" v-on="upButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="incrementButtonProps">
<slot name="incrementbuttonicon">
<component :is="incrementButtonIcon ? 'span' : 'AngleUpIcon'" :class="incrementButtonIcon" />
</slot>
</INButton>
<INButton v-if="showButtons && buttonLayout !== 'stacked'" :class="downButtonClass" :icon="decrementButtonIcon" v-on="downButtonListeners" :disabled="disabled" :tabindex="-1" aria-hidden="true" v-bind="decrementButtonProps">
<slot name="decrementbuttonicon">
<component :is="decrementButtonIcon ? 'span' : 'AngleDownIcon'" :class="decrementButtonIcon" />
</slot>
</INButton>
</span>
</template>
<script>
import Button from 'primevue/button';
import AngleDownIcon from 'primevue/icon/angledown';
import AngleUpIcon from 'primevue/icon/angleup';
import InputText from 'primevue/inputtext';
import { DomHandler } from 'primevue/utils';
@ -69,11 +87,11 @@ export default {
},
incrementButtonIcon: {
type: String,
default: 'pi pi-angle-up'
default: undefined
},
decrementButtonIcon: {
type: String,
default: 'pi pi-angle-down'
default: undefined
},
locale: {
type: String,
@ -1097,7 +1115,9 @@ export default {
},
components: {
INInputText: InputText,
INButton: Button
INButton: Button,
AngleUpIcon: AngleUpIcon,
AngleDownIcon: AngleDownIcon
}
};
</script>