chore(components): remove deprecated 2.8.0 (#17735)

* chore(components): remove deprecated 2.8.0

* chore(components): update
This commit is contained in:
kooriookami 2024-08-02 11:08:24 +08:00 committed by GitHub
parent 0456c790db
commit 0f8282520f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
23 changed files with 18 additions and 239 deletions

View File

@ -43,12 +43,6 @@ export const badgeProps = buildProps({
* @description customize dot background color
*/
color: String,
/**
* @deprecated
*/
dotStyle: {
type: definePropType<StyleValue>([String, Object, Array]),
},
/**
* @description CSS style of badge
*/
@ -62,12 +56,6 @@ export const badgeProps = buildProps({
type: definePropType<[number, number]>(Array),
default: [0, 0],
},
/**
* @deprecated
*/
dotClass: {
type: String,
},
/**
* @description custom class name of badge
*/

View File

@ -9,7 +9,6 @@
ns.em('content', type),
ns.is('fixed', !!$slots.default),
ns.is('dot', isDot),
dotClass,
badgeClass,
]"
:style="style"
@ -21,7 +20,7 @@
<script lang="ts" setup>
import { computed } from 'vue'
import { useDeprecated, useNamespace } from '@element-plus/hooks'
import { useNamespace } from '@element-plus/hooks'
import { addUnit, isNumber } from '@element-plus/utils'
import { badgeProps } from './badge'
import type { StyleValue } from 'vue'
@ -51,33 +50,10 @@ const style = computed<StyleValue>(() => {
marginRight: addUnit(-(props.offset?.[0] ?? 0)),
marginTop: addUnit(props.offset?.[1] ?? 0),
},
props.dotStyle ?? {},
props.badgeStyle ?? {},
]
})
useDeprecated(
{
from: 'dot-style',
replacement: 'badge-style',
version: '2.8.0',
scope: 'el-badge',
ref: 'https://element-plus.org/en-US/component/badge.html',
},
computed(() => !!props.dotStyle)
)
useDeprecated(
{
from: 'dot-class',
replacement: 'badge-class',
version: '2.8.0',
scope: 'el-badge',
ref: 'https://element-plus.org/en-US/component/badge.html',
},
computed(() => !!props.dotClass)
)
defineExpose({
/** @description badge content */
content,

View File

@ -32,10 +32,6 @@ export const checkboxGroupProps = buildProps({
* @description size of checkbox
*/
size: useSizeProp,
/**
* @deprecated label for screen reader
*/
label: String,
/**
* @description border and background color when button is active
*/

View File

@ -5,7 +5,7 @@
:class="ns.b('group')"
role="group"
:aria-label="
!isLabeledByFormItem ? label || ariaLabel || 'checkbox-group' : undefined
!isLabeledByFormItem ? ariaLabel || 'checkbox-group' : undefined
"
:aria-labelledby="isLabeledByFormItem ? formItem?.labelId : undefined"
>
@ -18,7 +18,7 @@ import { computed, nextTick, provide, toRefs, watch } from 'vue'
import { pick } from 'lodash-unified'
import { UPDATE_MODEL_EVENT } from '@element-plus/constants'
import { debugWarn } from '@element-plus/utils'
import { useDeprecated, useNamespace } from '@element-plus/hooks'
import { useNamespace } from '@element-plus/hooks'
import { useFormItem, useFormItemInputId } from '@element-plus/components/form'
import { checkboxGroupEmits, checkboxGroupProps } from './checkbox-group'
import { checkboxGroupContextKey } from './constants'
@ -67,17 +67,6 @@ provide(checkboxGroupContextKey, {
changeEvent,
})
useDeprecated(
{
from: 'label',
replacement: 'aria-label',
version: '2.8.0',
scope: 'el-checkbox-group',
ref: 'https://element-plus.org/en-US/component/checkbox.html',
},
computed(() => !!props.label)
)
watch(
() => props.modelValue,
() => {

View File

@ -85,13 +85,6 @@ export const checkboxProps = {
type: String,
default: undefined,
},
/**
* @deprecated same as [aria-controls](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls), takes effect when `indeterminate` is `true`
*/
controls: {
type: String,
default: undefined,
},
/**
* @description whether to add a border around Checkbox
*/

View File

@ -2,7 +2,7 @@
<component
:is="!hasOwnLabel && isLabeledByFormItem ? 'span' : 'label'"
:class="compKls"
:aria-controls="indeterminate ? controls || ariaControls : null"
:aria-controls="indeterminate ? ariaControls : null"
@click="onClickRoot"
>
<span :class="spanKls">

View File

@ -51,17 +51,6 @@ export const useCheckbox = (
setStoreValue()
useDeprecated(
{
from: 'controls',
replacement: 'aria-controls',
version: '2.8.0',
scope: 'el-checkbox',
ref: 'https://element-plus.org/en-US/component/checkbox.html',
},
computed(() => !!props.controls)
)
useDeprecated(
{
from: 'label act as value',

View File

@ -39,13 +39,6 @@ export const colorPickerProps = buildProps({
type: String,
default: '',
},
/**
* @deprecated ColorPicker aria-label
*/
label: {
type: String,
default: undefined,
},
/**
* @description ColorPicker tabindex
*/

View File

@ -129,7 +129,6 @@ import {
useFormSize,
} from '@element-plus/components/form'
import {
useDeprecated,
useFocusController,
useLocale,
useNamespace,
@ -219,21 +218,10 @@ const currentColor = computed(() => {
const buttonAriaLabel = computed<string | undefined>(() => {
return !isLabeledByFormItem.value
? props.label || props.ariaLabel || t('el.colorpicker.defaultLabel')
? props.ariaLabel || t('el.colorpicker.defaultLabel')
: undefined
})
useDeprecated(
{
from: 'label',
replacement: 'aria-label',
version: '2.8.0',
scope: 'el-color-picker',
ref: 'https://element-plus.org/en-US/component/color-picker.html',
},
computed(() => !!props.label)
)
const buttonAriaLabelledby = computed<string | undefined>(() => {
return isLabeledByFormItem.value ? formItem?.labelId : undefined
})

View File

@ -86,10 +86,6 @@ export const inputNumberProps = buildProps({
* @description same as `name` in native input
*/
name: String,
/**
* @deprecated same as `label` in native input
*/
label: String,
/**
* @description same as `placeholder` in native input
*/

View File

@ -52,7 +52,7 @@
:max="max"
:min="min"
:name="name"
:aria-label="label || ariaLabel"
:aria-label="ariaLabel"
:validate-event="false"
@keydown.up.prevent="increase"
@keydown.down.prevent="decrease"
@ -74,7 +74,7 @@ import {
useFormSize,
} from '@element-plus/components/form'
import { vRepeatClick } from '@element-plus/directives'
import { useDeprecated, useLocale, useNamespace } from '@element-plus/hooks'
import { useLocale, useNamespace } from '@element-plus/hooks'
import {
debugWarn,
isNumber,
@ -341,16 +341,6 @@ onUpdated(() => {
const innerInput = input.value?.input
innerInput?.setAttribute('aria-valuenow', `${data.currentValue ?? ''}`)
})
useDeprecated(
{
from: 'label',
replacement: 'aria-label',
version: '2.8.0',
scope: 'el-input-number',
ref: 'https://element-plus.org/en-US/component/input-number.html',
},
computed(() => !!props.label)
)
defineExpose({
/** @description get focus the input component */
focus,

View File

@ -138,13 +138,6 @@ export const inputProps = buildProps({
type: String,
default: undefined,
},
/**
* @deprecated native input aria-label
*/
label: {
type: String,
default: undefined,
},
/**
* @description input tabindex
*/

View File

@ -43,7 +43,7 @@
:readonly="readonly"
:autocomplete="autocomplete"
:tabindex="tabindex"
:aria-label="label || ariaLabel"
:aria-label="ariaLabel"
:placeholder="placeholder"
:style="inputStyle"
:form="form"
@ -123,7 +123,7 @@
:readonly="readonly"
:autocomplete="autocomplete"
:style="textareaStyle"
:aria-label="label || ariaLabel"
:aria-label="ariaLabel"
:placeholder="placeholder"
:form="form"
:autofocus="autofocus"
@ -185,7 +185,6 @@ import {
useAttrs,
useComposition,
useCursor,
useDeprecated,
useFocusController,
useNamespace,
} from '@element-plus/hooks'
@ -517,17 +516,6 @@ onMounted(() => {
nextTick(resizeTextarea)
})
useDeprecated(
{
from: 'label',
replacement: 'aria-label',
version: '2.8.0',
scope: 'el-input',
ref: 'https://element-plus.org/en-US/component/input.html',
},
computed(() => !!props.label)
)
defineExpose({
/** @description HTML input element */
input,

View File

@ -34,13 +34,6 @@ export const radioGroupProps = buildProps({
type: String,
default: '',
},
/**
* @deprecated same as `aria-label` in RadioGroup
*/
label: {
type: String,
default: undefined,
},
/**
* @description font color when button is active
*/

View File

@ -4,9 +4,7 @@
ref="radioGroupRef"
:class="ns.b('group')"
role="radiogroup"
:aria-label="
!isLabeledByFormItem ? label || ariaLabel || 'radio-group' : undefined
"
:aria-label="!isLabeledByFormItem ? ariaLabel || 'radio-group' : undefined"
:aria-labelledby="isLabeledByFormItem ? formItem!.labelId : undefined"
>
<slot />
@ -26,7 +24,7 @@ import {
} from 'vue'
import { useFormItem, useFormItemInputId } from '@element-plus/components/form'
import { UPDATE_MODEL_EVENT } from '@element-plus/constants'
import { useDeprecated, useId, useNamespace } from '@element-plus/hooks'
import { useId, useNamespace } from '@element-plus/hooks'
import { debugWarn } from '@element-plus/utils'
import { radioGroupEmits, radioGroupProps } from './radio-group'
import { radioGroupKey } from './constants'
@ -83,15 +81,4 @@ watch(
}
}
)
useDeprecated(
{
from: 'label',
replacement: 'aria-label',
version: '2.8.0',
scope: 'el-radio-group',
ref: 'https://element-plus.org/en-US/component/radio.html',
},
computed(() => !!props.label)
)
</script>

View File

@ -140,13 +140,6 @@ export const rateProps = buildProps({
* @description size of Rate
*/
size: useSizeProp,
/**
* @deprecated same as `aria-label` in Rate
*/
label: {
type: String,
default: undefined,
},
/**
* @description whether value can be reset to `0`
*/

View File

@ -3,9 +3,7 @@
:id="inputId"
:class="[rateClasses, ns.is('disabled', rateDisabled)]"
role="slider"
:aria-label="
!isLabeledByFormItem ? label || ariaLabel || 'rating' : undefined
"
:aria-label="!isLabeledByFormItem ? ariaLabel || 'rating' : undefined"
:aria-labelledby="
isLabeledByFormItem ? formItemContext?.labelId : undefined
"
@ -67,7 +65,7 @@ import {
useFormSize,
} from '@element-plus/components/form'
import { ElIcon } from '@element-plus/components/icon'
import { useDeprecated, useNamespace } from '@element-plus/hooks'
import { useNamespace } from '@element-plus/hooks'
import { rateEmits, rateProps } from './rate'
import type { CSSProperties, Component } from 'vue'
@ -304,17 +302,6 @@ if (!props.modelValue) {
emit(UPDATE_MODEL_EVENT, 0)
}
useDeprecated(
{
from: 'label',
replacement: 'aria-label',
version: '2.8.0',
scope: 'el-rate',
ref: 'https://element-plus.org/en-US/component/rate.html',
},
computed(() => !!props.label)
)
defineExpose({
/** @description set current value */
setCurrentValue,

View File

@ -119,13 +119,6 @@ export const sliderProps = buildProps({
type: Number,
default: 300,
},
/**
* @deprecated label for screen reader
*/
label: {
type: String,
default: undefined,
},
/**
* @description when `range` is true, screen reader label for the start of the range
*/

View File

@ -111,7 +111,7 @@ import { computed, provide, reactive, toRefs } from 'vue'
import { useEventListener } from '@vueuse/core'
import ElInputNumber from '@element-plus/components/input-number'
import { useFormItemInputId, useFormSize } from '@element-plus/components/form'
import { useDeprecated, useLocale, useNamespace } from '@element-plus/hooks'
import { useLocale, useNamespace } from '@element-plus/hooks'
import { sliderContextKey } from './constants'
import { sliderEmits, sliderProps } from './slider'
import SliderButton from './button.vue'
@ -175,7 +175,6 @@ const sliderInputSize = computed(
const groupLabel = computed<string>(() => {
return (
props.label ||
props.ariaLabel ||
t('el.slider.defaultLabel', {
min: props.min,
@ -252,17 +251,6 @@ provide(sliderContextKey, {
updateDragging,
})
useDeprecated(
{
from: 'label',
replacement: 'aria-label',
version: '2.8.0',
scope: 'el-slider',
ref: 'https://element-plus.org/en-US/component/slider.html',
},
computed(() => !!props.label)
)
defineExpose({
onSliderClick,
})

View File

@ -133,13 +133,6 @@ export const switchProps = buildProps({
tabindex: {
type: [String, Number],
},
/**
* @deprecated native input aria-label
*/
label: {
type: String,
default: undefined,
},
...useAriaProps(['ariaLabel']),
} as const)

View File

@ -8,7 +8,7 @@
role="switch"
:aria-checked="checked"
:aria-disabled="switchDisabled"
:aria-label="label || ariaLabel"
:aria-label="ariaLabel"
:name="name"
:true-value="activeValue"
:false-value="inactiveValue"
@ -88,7 +88,7 @@ import {
INPUT_EVENT,
UPDATE_MODEL_EVENT,
} from '@element-plus/constants'
import { useDeprecated, useNamespace } from '@element-plus/hooks'
import { useNamespace } from '@element-plus/hooks'
import { switchEmits, switchProps } from './switch'
import type { CSSProperties } from 'vue'
@ -218,17 +218,6 @@ onMounted(() => {
input.value!.checked = checked.value
})
useDeprecated(
{
from: 'label',
replacement: 'aria-label',
version: '2.8.0',
scope: 'el-switch',
ref: 'https://element-plus.org/en-US/component/switch.html',
},
computed(() => !!props.label)
)
defineExpose({
/**
* @description manual focus to the switch component

View File

@ -41,7 +41,7 @@
isYearsPicker ||
type === 'week'
"
:aria-label="label || ariaLabel"
:aria-label="ariaLabel"
:tabindex="tabindex"
:validate-event="false"
@input="onUserInput"
@ -174,12 +174,7 @@ import {
} from 'vue'
import { isEqual } from 'lodash-unified'
import { onClickOutside } from '@vueuse/core'
import {
useDeprecated,
useEmptyValues,
useLocale,
useNamespace,
} from '@element-plus/hooks'
import { useEmptyValues, useLocale, useNamespace } from '@element-plus/hooks'
import { useFormItem, useFormSize } from '@element-plus/components/form'
import ElInput from '@element-plus/components/input'
import ElIcon from '@element-plus/components/icon'
@ -762,17 +757,6 @@ provide('EP_PICKER_BASE', {
props,
})
useDeprecated(
{
from: 'label',
replacement: 'aria-label',
version: '2.8.0',
scope: 'el-time-picker',
ref: 'https://element-plus.org/en-US/component/time-picker.html',
},
computed(() => !!props.label)
)
defineExpose({
/**
* @description focus input box.

View File

@ -190,13 +190,6 @@ export const timePickerDefaultProps = buildProps({
* @description whether to pick time using arrow buttons
*/
arrowControl: Boolean,
/**
* @deprecated same as `aria-label` in native input
*/
label: {
type: String,
default: undefined,
},
/**
* @description input tabindex
*/