props fix

pull/2721/head
Tuğçe Küçükoğlu 2022-06-29 17:13:48 +03:00
parent 5b62a009cd
commit a7677ef31f
4 changed files with 9 additions and 21 deletions

View File

@ -48,13 +48,13 @@ const SliderProps = [
description: "Index of the element in tabbing order."
},
{
name: "ariaLabelledBy",
name: "aria-labelledby",
type: "string",
default: "null",
description: "Establishes relationships between the component and label(s) where its value should be one or more element IDs."
},
{
name: "ariaLabel",
name: "aria-label",
type: "string",
default: "null",
description: "Used to define a string that labels the element."

View File

@ -55,7 +55,7 @@ export interface SliderProps {
/**
* Establishes relationships between the component and label(s) where its value should be one or more element IDs.
*/
ariaLabelledBy?: string | undefined;
ariaLabelledby?: string | undefined;
/**
* Used to define a string that labels the element.
*/

View File

@ -2,11 +2,11 @@
<div :class="containerClass" @click="onBarClick">
<span class="p-slider-range" :style="rangeStyle"></span>
<span v-if="!range" class="p-slider-handle" :style="handleStyle" @touchstart="onDragStart($event)" @touchmove="onDrag($event)" @touchend="onDragEnd($event)" @mousedown="onMouseDown($event)" @keydown="onKeyDown($event)" :tabindex="tabindex"
role="slider" :aria-valuemin="min" :aria-valuenow="modelValue" :aria-valuemax="max" :aria-labelledby="ariaLabelledBy" :aria-label="ariaLabel" :aria-orientation="orientation"></span>
role="slider" :aria-valuemin="min" :aria-valuenow="modelValue" :aria-valuemax="max" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" :aria-orientation="orientation"></span>
<span v-if="range" class="p-slider-handle" :style="rangeStartHandleStyle" @touchstart="onDragStart($event, 0)" @touchmove="onDrag($event)" @touchend="onDragEnd($event)" @mousedown="onMouseDown($event, 0)" @keydown="onKeyDown($event)" :tabindex="tabindex"
role="slider" :aria-valuemin="min" :aria-valuenow="modelValue ? modelValue[0] : null" :aria-valuemax="max" :aria-labelledby="ariaLabelledBy" :aria-label="ariaLabel" :aria-orientation="orientation"></span>
role="slider" :aria-valuemin="min" :aria-valuenow="modelValue ? modelValue[0] : null" :aria-valuemax="max" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" :aria-orientation="orientation"></span>
<span v-if="range" class="p-slider-handle" :style="rangeEndHandleStyle" @touchstart="onDragStart($event, 1)" @touchmove="onDrag($event)" @touchend="onDragEnd($event)" @mousedown="onMouseDown($event, 1)" @keydown="onKeyDown($event, 1)" :tabindex="tabindex"
role="slider" :aria-valuemin="min" :aria-valuenow="modelValue ? modelValue[1] : null" :aria-valuemax="max" :aria-labelledby="ariaLabelledBy" :aria-label="ariaLabel" :aria-orientation="orientation"></span>
role="slider" :aria-valuemin="min" :aria-valuenow="modelValue ? modelValue[1] : null" :aria-valuemax="max" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" :aria-orientation="orientation"></span>
</div>
</template>
@ -44,13 +44,13 @@ export default {
},
tabindex: {
type: Number,
default: null
default: 0
},
ariaLabelledBy: {
'aria-labelledby': {
type: String,
default: null
},
ariaLabel: {
'aria-label': {
type: String,
default: null
}

View File

@ -120,18 +120,6 @@ export default {
<td>number</td>
<td>null</td>
<td>Index of the element in tabbing order.</td>
</tr>
<tr>
<td>ariaLabelledBy</td>
<td>string</td>
<td>null</td>
<td>Establishes relationships between the component and label(s) where its value should be one or more element IDs.</td>
</tr>
<tr>
<td>ariaLabel</td>
<td>string</td>
<td>null</td>
<td>Used to define a string that labels the element.</td>
</tr>
</tbody>
</table>