From 9faca489c75af1f6d9f219b068f7b53cf65cab36 Mon Sep 17 00:00:00 2001 From: anlyyao Date: Wed, 11 Sep 2024 21:15:52 +0800 Subject: [PATCH 1/2] fix(Button): solve the problem that hover style still exists in disabled state --- src/button/button.en-US.md | 14 ++++---------- src/button/button.md | 14 ++++---------- src/button/button.tsx | 11 +++++------ 3 files changed, 13 insertions(+), 26 deletions(-) diff --git a/src/button/button.en-US.md b/src/button/button.en-US.md index a3d74ed33..c520693e4 100644 --- a/src/button/button.en-US.md +++ b/src/button/button.en-US.md @@ -39,9 +39,6 @@ Name | Default Value | Description --td-button-danger-bg-color | @error-color | - --td-button-danger-border-color | @error-color | - --td-button-danger-color | @font-white-1 | - ---td-button-danger-dashed-border-color | @button-danger-dashed-color | - ---td-button-danger-dashed-color | @error-color | - ---td-button-danger-dashed-disabled-color | @button-danger-disabled-color | - --td-button-danger-disabled-bg | @error-color-3 | - --td-button-danger-disabled-border-color | @error-color-3 | - --td-button-danger-disabled-color | @font-white-1 | - @@ -57,14 +54,14 @@ Name | Default Value | Description --td-button-default-active-border-color | @bg-color-component-active | - --td-button-default-bg-color | @bg-color-component | - --td-button-default-border-color | @bg-color-component | - ---td-button-default-color | @font-gray-1 | - +--td-button-default-color | @text-color-primary | - --td-button-default-disabled-bg | @bg-color-component-disabled | - --td-button-default-disabled-border-color | @bg-color-component-disabled | - ---td-button-default-disabled-color | @font-gray-4 | - +--td-button-default-disabled-color | @text-color-disabled | - --td-button-default-outline-active-bg-color | @bg-color-container-active | - --td-button-default-outline-active-border-color | @component-border | - --td-button-default-outline-border-color | @component-border | - ---td-button-default-outline-color | @font-gray-1 | - +--td-button-default-outline-color | @text-color-primary | - --td-button-default-outline-disabled-color | @component-border | - --td-button-default-text-active-bg-color | @bg-color-container-active | - --td-button-extra-small-font-size | @font-size-base | - @@ -113,9 +110,6 @@ Name | Default Value | Description --td-button-primary-bg-color | @brand-color | - --td-button-primary-border-color | @brand-color | - --td-button-primary-color | @font-white-1 | - ---td-button-primary-dashed-border-color | @button-primary-dashed-color | - ---td-button-primary-dashed-color | @brand-color | - ---td-button-primary-dashed-disabled-color | @brand-color-disabled | - --td-button-primary-disabled-bg | @brand-color-disabled | - --td-button-primary-disabled-border-color | @brand-color-disabled | - --td-button-primary-disabled-color | @font-white-1 | - @@ -130,4 +124,4 @@ Name | Default Value | Description --td-button-small-font-size | @font-size-base | - --td-button-small-height | 32px | - --td-button-small-icon-font-size | 18px | - ---td-button-small-padding-horizontal | 12px | - \ No newline at end of file +--td-button-small-padding-horizontal | 12px | - diff --git a/src/button/button.md b/src/button/button.md index e404be031..dfb52736d 100644 --- a/src/button/button.md +++ b/src/button/button.md @@ -39,9 +39,6 @@ click | `(e: MouseEvent)` | 点击时触发 --td-button-danger-bg-color | @error-color | - --td-button-danger-border-color | @error-color | - --td-button-danger-color | @font-white-1 | - ---td-button-danger-dashed-border-color | @button-danger-dashed-color | - ---td-button-danger-dashed-color | @error-color | - ---td-button-danger-dashed-disabled-color | @button-danger-disabled-color | - --td-button-danger-disabled-bg | @error-color-3 | - --td-button-danger-disabled-border-color | @error-color-3 | - --td-button-danger-disabled-color | @font-white-1 | - @@ -57,14 +54,14 @@ click | `(e: MouseEvent)` | 点击时触发 --td-button-default-active-border-color | @bg-color-component-active | - --td-button-default-bg-color | @bg-color-component | - --td-button-default-border-color | @bg-color-component | - ---td-button-default-color | @font-gray-1 | - +--td-button-default-color | @text-color-primary | - --td-button-default-disabled-bg | @bg-color-component-disabled | - --td-button-default-disabled-border-color | @bg-color-component-disabled | - ---td-button-default-disabled-color | @font-gray-4 | - +--td-button-default-disabled-color | @text-color-disabled | - --td-button-default-outline-active-bg-color | @bg-color-container-active | - --td-button-default-outline-active-border-color | @component-border | - --td-button-default-outline-border-color | @component-border | - ---td-button-default-outline-color | @font-gray-1 | - +--td-button-default-outline-color | @text-color-primary | - --td-button-default-outline-disabled-color | @component-border | - --td-button-default-text-active-bg-color | @bg-color-container-active | - --td-button-extra-small-font-size | @font-size-base | - @@ -113,9 +110,6 @@ click | `(e: MouseEvent)` | 点击时触发 --td-button-primary-bg-color | @brand-color | - --td-button-primary-border-color | @brand-color | - --td-button-primary-color | @font-white-1 | - ---td-button-primary-dashed-border-color | @button-primary-dashed-color | - ---td-button-primary-dashed-color | @brand-color | - ---td-button-primary-dashed-disabled-color | @brand-color-disabled | - --td-button-primary-disabled-bg | @brand-color-disabled | - --td-button-primary-disabled-border-color | @brand-color-disabled | - --td-button-primary-disabled-color | @font-white-1 | - @@ -130,4 +124,4 @@ click | `(e: MouseEvent)` | 点击时触发 --td-button-small-font-size | @font-size-base | - --td-button-small-height | 32px | - --td-button-small-icon-font-size | 18px | - ---td-button-small-padding-horizontal | 12px | - \ No newline at end of file +--td-button-small-padding-horizontal | 12px | - diff --git a/src/button/button.tsx b/src/button/button.tsx index 3aa7ae659..2f8f65f9f 100644 --- a/src/button/button.tsx +++ b/src/button/button.tsx @@ -1,6 +1,4 @@ -import { computed, toRefs, defineComponent, getCurrentInstance } from 'vue'; - -import { space } from 'postcss/lib/list'; +import { computed, defineComponent } from 'vue'; import TLoading from '../loading'; import { Hover } from '../shared'; import ButtonProps from './props'; @@ -11,10 +9,9 @@ import { usePrefixClass } from '../hooks/useClass'; import { useContent, useTNodeJSX } from '../hooks/tnode'; const { prefix } = config; -const name = `${prefix}-button`; export default defineComponent({ - name, + name: `${prefix}-button`, directives: { Hover }, props: ButtonProps, setup(props) { @@ -23,6 +20,8 @@ export default defineComponent({ const renderTNodeContent = useContent(); const isDisabled = useFormDisabled(); + const hoverDisabled = computed(() => isDisabled.value || props.loading); + const buttonClasses = computed(() => [ `${buttonClass.value}`, `${buttonClass.value}--size-${props.size}`, @@ -68,7 +67,7 @@ export default defineComponent({ disabled={isDisabled.value} aria-disabled={isDisabled.value} onClick={handleClick} - v-hover={{ className: `${buttonClass.value}--hover` }} + v-hover={{ className: `${buttonClass.value}--hover`, disabledHover: hoverDisabled.value }} > {readerIcon()} {readerContent()} From a0ffc66378166a9568a610ee90fa5430e97e6d75 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 11 Sep 2024 13:20:41 +0000 Subject: [PATCH 2/2] chore: update common --- src/_common | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/_common b/src/_common index acb448730..40ecdc1e5 160000 --- a/src/_common +++ b/src/_common @@ -1 +1 @@ -Subproject commit acb4487304321a7bf3ac3e1b4d78e9e7510fbf6c +Subproject commit 40ecdc1e58612eb9b86cce76ab01ee3d16d3f98e