From 0ba1bca5d8696e2da2dacf6f57e5d07ed0a122a3 Mon Sep 17 00:00:00 2001 From: Junyi Date: Fri, 5 Jul 2024 13:28:59 +0800 Subject: [PATCH] feat(client): add `disabled` option to props of SchemaSettingsItem (#4817) * feat(client): add disabled option to props of SchemaSettingsItem * docs(client): add doc and demo * feat(client): add disabled option to SchemaInitializerItem --- .../demos/schema-settings-components-item.tsx | 6 ++++++ .../demos/schema-settings-components-item.tsx | 6 ++++++ .../components/SchemaInitializerItem.tsx | 7 ++++++- .../components/SchemaInitializerSwitch.tsx | 3 ++- .../schema-initializer/components/style.ts | 15 +++++++++++---- .../antd/action/Action.Designer.tsx | 2 ++ .../client/src/schema-settings/SchemaSettings.tsx | 4 +++- .../src/schema-settings/demos/built-type.tsx | 13 +++++++++++-- 8 files changed, 47 insertions(+), 9 deletions(-) diff --git a/packages/core/client/docs/en-US/core/ui-schema/demos/schema-settings-components-item.tsx b/packages/core/client/docs/en-US/core/ui-schema/demos/schema-settings-components-item.tsx index 376ff77018..9236d15431 100644 --- a/packages/core/client/docs/en-US/core/ui-schema/demos/schema-settings-components-item.tsx +++ b/packages/core/client/docs/en-US/core/ui-schema/demos/schema-settings-components-item.tsx @@ -26,6 +26,12 @@ const mySettings = new SchemaSettings({ name: 'markdown', Component: MarkdownEdit, }, + { + name: 'disabled', + Component() { + return ; + }, + }, ], }); diff --git a/packages/core/client/docs/zh-CN/core/ui-schema/demos/schema-settings-components-item.tsx b/packages/core/client/docs/zh-CN/core/ui-schema/demos/schema-settings-components-item.tsx index 376ff77018..9236d15431 100644 --- a/packages/core/client/docs/zh-CN/core/ui-schema/demos/schema-settings-components-item.tsx +++ b/packages/core/client/docs/zh-CN/core/ui-schema/demos/schema-settings-components-item.tsx @@ -26,6 +26,12 @@ const mySettings = new SchemaSettings({ name: 'markdown', Component: MarkdownEdit, }, + { + name: 'disabled', + Component() { + return ; + }, + }, ], }); diff --git a/packages/core/client/src/application/schema-initializer/components/SchemaInitializerItem.tsx b/packages/core/client/src/application/schema-initializer/components/SchemaInitializerItem.tsx index c399abd085..436fc54f37 100644 --- a/packages/core/client/src/application/schema-initializer/components/SchemaInitializerItem.tsx +++ b/packages/core/client/src/application/schema-initializer/components/SchemaInitializerItem.tsx @@ -24,6 +24,7 @@ export interface SchemaInitializerItemProps { icon?: React.ReactNode; title?: React.ReactNode; items?: any[]; + disabled?: boolean; onClick?: (args?: any) => any; applyMenuStyle?: boolean; children?: ReactNode; @@ -41,6 +42,7 @@ export const SchemaInitializerItem = memo( name = uid(), applyMenuStyle = true, className, + disabled, items, icon, title, @@ -89,7 +91,10 @@ export const SchemaInitializerItem = memo( >
{children || ( diff --git a/packages/core/client/src/application/schema-initializer/components/SchemaInitializerSwitch.tsx b/packages/core/client/src/application/schema-initializer/components/SchemaInitializerSwitch.tsx index 3a5b519714..5c0fe17057 100644 --- a/packages/core/client/src/application/schema-initializer/components/SchemaInitializerSwitch.tsx +++ b/packages/core/client/src/application/schema-initializer/components/SchemaInitializerSwitch.tsx @@ -24,7 +24,8 @@ export const SchemaInitializerSwitch: FC = (pr return (
- {compile(title)} + {compile(title)} +
); diff --git a/packages/core/client/src/application/schema-initializer/components/style.ts b/packages/core/client/src/application/schema-initializer/components/style.ts index 65a2a4245a..9d8e20811f 100644 --- a/packages/core/client/src/application/schema-initializer/components/style.ts +++ b/packages/core/client/src/application/schema-initializer/components/style.ts @@ -35,11 +35,18 @@ export const useSchemaInitializerStyles = genStyleHook('nb-schema-initializer', // height: token.controlHeight, lineHeight: `${token.controlHeight}px`, color: token.colorText, - cursor: 'pointer', - '&:hover': { - borderRadius: token.borderRadiusSM, - backgroundColor: token.colorBgTextHover, + [`&:not(${componentCls}-menu-item-disabled)`]: { + cursor: 'pointer', + [`&:hover`]: { + borderRadius: token.borderRadiusSM, + backgroundColor: token.colorBgTextHover, + }, + }, + + [`&${componentCls}-menu-item-disabled`]: { + cursor: 'not-allowed', + color: token.colorTextDisabled, }, }, }, diff --git a/packages/core/client/src/schema-component/antd/action/Action.Designer.tsx b/packages/core/client/src/schema-component/antd/action/Action.Designer.tsx index 31e3ea9b9f..6d67f42939 100644 --- a/packages/core/client/src/schema-component/antd/action/Action.Designer.tsx +++ b/packages/core/client/src/schema-component/antd/action/Action.Designer.tsx @@ -321,6 +321,7 @@ export function AfterSuccess() { export function RemoveButton( props: { onConfirmOk?: ModalProps['onOk']; + disabled?: boolean; } = {}, ) { const { t } = useTranslation(); @@ -335,6 +336,7 @@ export function RemoveButton( breakRemoveOn={(s) => { return s['x-component'] === 'Space' || s['x-component'].endsWith('ActionBar'); }} + disabled={props.disabled} confirm={{ title: t('Delete action'), onOk: props.onConfirmOk, diff --git a/packages/core/client/src/schema-settings/SchemaSettings.tsx b/packages/core/client/src/schema-settings/SchemaSettings.tsx index 9a3790a4f9..52cb14e579 100644 --- a/packages/core/client/src/schema-settings/SchemaSettings.tsx +++ b/packages/core/client/src/schema-settings/SchemaSettings.tsx @@ -446,12 +446,13 @@ export const SchemaSettingsDivider = function Divider() { }; export interface SchemaSettingsRemoveProps { + disabled?: boolean; confirm?: ModalFuncProps; removeParentsIfNoChildren?: boolean; breakRemoveOn?: ISchema | ((s: ISchema) => boolean); } export const SchemaSettingsRemove: FC = (props) => { - const { confirm, removeParentsIfNoChildren, breakRemoveOn } = props; + const { disabled, confirm, removeParentsIfNoChildren, breakRemoveOn } = props; const { dn, template } = useSchemaSettings(); const { t } = useTranslation(); const field = useField(); @@ -464,6 +465,7 @@ export const SchemaSettingsRemove: FC = (props) => { return ( { diff --git a/packages/core/client/src/schema-settings/demos/built-type.tsx b/packages/core/client/src/schema-settings/demos/built-type.tsx index ff7a0beaf5..cf6204bbf0 100644 --- a/packages/core/client/src/schema-settings/demos/built-type.tsx +++ b/packages/core/client/src/schema-settings/demos/built-type.tsx @@ -1,5 +1,3 @@ - - import React from 'react'; import { Input } from 'antd'; import { @@ -119,6 +117,17 @@ const mySchemaSetting = new SchemaSettings({ }, }, }, + { + name: 'demo10', // 唯一标识 + type: 'item', // 文本类型 + componentProps: { + title: 'Disabled title', + onClick() { + alert('Disabled'); + }, + disabled: true, + }, + }, ], });