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

Refactor #5071 - Improve the structure of some components to comply with standards

Browse source
This commit is contained in:
mertsincan 2024-01-12 07:07:55 +00:00
parent e7d3074af2
commit 99b1edd5ce
17 changed files with 355 additions and 355 deletions
Download patch file Download diff file Expand all files Collapse all files

55
components/lib/radiobutton/RadioButton.vue
View file

@ -1,10 +1,25 @@
<template>
<div :class="cx('root')" @click="onClick($event)" v-bind="ptm('root')" data-pc-name="radiobutton">
<div class="p-hidden-accessible" v-bind="ptm('hiddenInputWrapper')" :data-p-hidden-accessible="true">
<input ref="input" :id="inputId" type="radio" :name="name" :checked="checked" :disabled="disabled" :value="value" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" @focus="onFocus" @blur="onBlur" v-bind="ptm('hiddenInput')" />
</div>
<div ref="box" :class="[cx('input'), inputClass]" :style="inputStyle" v-bind="{ ...inputProps, ...ptm('input') }" :data-p-highlight="checked" :data-p-disabled="disabled" :data-p-focused="focused">
<div :class="cx('icon')" v-bind="ptm('icon')"></div>
<div :class="cx('root')" v-bind="getPTOptions('root')" data-pc-name="radiobutton" :data-p-highlight="checked" :data-p-disabled="disabled">
<input
:id="inputId"
type="radio"
:class="[cx('input'), inputClass]"
:style="inputStyle"
:value="value"
:name="name"
:checked="checked"
:tabindex="tabindex"
:disabled="disabled"
:readonly="readonly"
:aria-labelledby="ariaLabelledby"
:aria-label="ariaLabel"
@focus="onFocus"
@blur="onBlur"
@change="onChange"
v-bind="getPTOptions('input')"
/>
<div :class="cx('box')" v-bind="getPTOptions('box')">
<div :class="cx('icon')" v-bind="getPTOptions('icon')"></div>
</div>
</div>
</template>
@ -16,30 +31,26 @@ import BaseRadioButton from './BaseRadioButton.vue';
export default {
name: 'RadioButton',
extends: BaseRadioButton,
emits: ['click', 'update:modelValue', 'change', 'focus', 'blur'],
data() {
return {
focused: false
};
},
emits: ['update:modelValue', 'change', 'focus', 'blur'],
methods: {
onClick(event) {
if (!this.disabled) {
this.$emit('click', event);
this.$emit('update:modelValue', this.value);
this.$refs.input.focus();
if (!this.checked) {
this.$emit('change', event);
getPTOptions(key) {
return this.ptm(key, {
context: {
checked: this.checked,
disabled: this.disabled
}
});
},
onChange(event) {
if (!this.disabled && !this.readonly) {
this.$emit('update:modelValue', this.value);
this.$emit('change', event);
}
},
onFocus(event) {
this.focused = true;
this.$emit('focus', event);
},
onBlur(event) {
this.focused = false;
this.$emit('blur', event);
}
},