feat(mobile-react): add link component (#353)

* feat(link): add link component * feat：补充api.json文件 --------- Co-authored-by: magicalyao <shichengyao@tencent.com>
TDesignOteam · Aug 8, 2024 · 8954d6f · 8954d6f
1 parent 00cbefb
commit 8954d6f
Show file tree

Hide file tree

Showing 6 changed files with 118 additions and 2 deletions.
diff --git a/db/TDesign.db b/db/TDesign.db
diff --git a/packages/products/tdesign-mobile-react/src/link/defaultProps.ts b/packages/products/tdesign-mobile-react/src/link/defaultProps.ts
@@ -0,0 +1,7 @@
+/**
+ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
+ * */
+
+import { TdLinkProps } from './type';
+
+export const linkDefaultProps: TdLinkProps = { disabled: undefined, size: 'medium', theme: 'default' };
diff --git a/packages/products/tdesign-mobile-react/src/link/link.en-US.md b/packages/products/tdesign-mobile-react/src/link/link.en-US.md
@@ -0,0 +1,22 @@
+:: BASE_DOC ::
+
+## API
+
+### Link Props
+
+name | type | default | description | required
+-- | -- | -- | -- | --
+className | String | - | className of component | N
+style | Object | - | CSS(Cascading Style Sheets)，Typescript：`React.CSSProperties` | N
+children | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N
+content | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N
+disabled | Boolean | undefined | make link to be disabled | N
+hover | Boolean | - | \- | N
+href | String | - | \- | N
+prefixIcon | TElement | - | Typescript：`TNode`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N
+size | String | medium | options: small/medium/large。Typescript：`SizeEnum`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N
+suffixIcon | TElement | - | Typescript：`TNode`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N
+target | String | - | target is an attribute of `<a>` | N
+theme | String | default | options: default/primary/danger/warning/success | N
+underline | Boolean | - | \- | N
+onClick | Function |  | Typescript：`(e: MouseEvent) => void`<br/>click event, it won't trigger when it's disabled | N
diff --git a/packages/products/tdesign-mobile-react/src/link/link.md b/packages/products/tdesign-mobile-react/src/link/link.md
@@ -0,0 +1,22 @@
+:: BASE_DOC ::
+
+## API
+
+### Link Props
+
+名称 | 类型 | 默认值 | 描述 | 必传
+-- | -- | -- | -- | --
+className | String | - | 类名 | N
+style | Object | - | 样式，TS 类型：`React.CSSProperties` | N
+children | TNode | - | 链接内容，同 content。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N
+content | TNode | - | 链接内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N
+disabled | Boolean | undefined | 禁用链接。优先级：Link.disabled > Form.disabled | N
+hover | Boolean | - | 是否开启点击反馈 | N
+href | String | - | 跳转链接 | N
+prefixIcon | TElement | - | 前置图标。TS 类型：`TNode`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N
+size | String | medium | 尺寸。可选项：small/medium/large。TS 类型：`SizeEnum`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N
+suffixIcon | TElement | - | 后置图标。TS 类型：`TNode`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N
+target | String | - | 跳转方式，如：当前页面打开、新页面打开等，同 HTML 属性 target 含义相同 | N
+theme | String | default | 组件风格，依次为默认色、品牌色、危险色、警告色、成功色。可选项：default/primary/danger/warning/success | N
+underline | Boolean | - | 是否显示链接下划线 | N
+onClick | Function |  | TS 类型：`(e: MouseEvent) => void`<br/>点击事件，禁用状态不会触发点击事件 | N
diff --git a/packages/products/tdesign-mobile-react/src/link/type.ts b/packages/products/tdesign-mobile-react/src/link/type.ts
@@ -0,0 +1,63 @@
+/* eslint-disable */
+
+/**
+ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
+ * */
+
+import { TNode, TElement, SizeEnum } from '../common';
+import { MouseEvent } from 'react';
+
+export interface TdLinkProps {
+  /**
+   * 链接内容，同 content
+   */
+  children?: TNode;
+  /**
+   * 链接内容
+   */
+  content?: TNode;
+  /**
+   * 禁用链接。优先级：Link.disabled > Form.disabled
+   */
+  disabled?: boolean;
+  /**
+   * 是否开启点击反馈
+   */
+  hover?: boolean;
+  /**
+   * 跳转链接
+   * @default ''
+   */
+  href?: string;
+  /**
+   * 前置图标
+   */
+  prefixIcon?: TElement;
+  /**
+   * 尺寸
+   * @default medium
+   */
+  size?: SizeEnum;
+  /**
+   * 后置图标
+   */
+  suffixIcon?: TElement;
+  /**
+   * 跳转方式，如：当前页面打开、新页面打开等，同 HTML 属性 target 含义相同
+   * @default ''
+   */
+  target?: string;
+  /**
+   * 组件风格，依次为默认色、品牌色、危险色、警告色、成功色
+   * @default default
+   */
+  theme?: 'default' | 'primary' | 'danger' | 'warning' | 'success';
+  /**
+   * 是否显示链接下划线
+   */
+  underline?: boolean;
+  /**
+   * 点击事件，禁用状态不会触发点击事件
+   */
+  onClick?: (e: MouseEvent<HTMLAnchorElement>) => void;
+}
diff --git a/packages/scripts/api.json b/packages/scripts/api.json
@@ -68489,7 +68489,8 @@
     {
       "id": 2892,
       "platform_framework": [
-        "2"
+        "2",
+        "16"
       ],
       "component": "Link",
       "field_category": 1,
@@ -68518,7 +68519,8 @@
       "support_default_value": 0,
       "field_category_text": "Props",
       "platform_framework_text": [
-        "React(PC)"
+        "React(PC)",
+        "React(Mobile)"
       ],
       "field_type_text": [
         "String",