[Link] add download attribute to Link

src/link/Link.tsx

@@ -20,6 +20,7 @@ const Link = React.forwardRef<HTMLAnchorElement, LinkProps>((props, ref) => {
     theme,
     disabled,
     hover,
+    download,
     onClick,
     href,
     size,
@@ -49,6 +50,7 @@ const Link = React.forwardRef<HTMLAnchorElement, LinkProps>((props, ref) => {
         [`${classPrefix}-is-underline`]: !!underline,
         [`${classPrefix}-link--hover-${hover}`]: !disabled,
       })}
+      download={download}
       onClick={handleClick}
     >
       {prefixIcon && <span className={classNames([`${classPrefix}-link__prefix-icon`])}>{parseTNode(prefixIcon)}</span>}

src/link/_example/download.jsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import { Space, Link } from 'tdesign-react';
+
+export default function LinkExample() {
+  return (
+    <Space>
+      <Link theme="primary" download href="/starter/assets/vue.ee956b80.svg">
+        跳转链接
+      </Link>
+      <Link theme="primary" download="test/download-file.png" href="/starter/assets/vue.ee956b80.svg">
+        跳转链接
+      </Link>
+    </Space>
+  );
+}

src/link/link.en-US.md

@@ -10,12 +10,13 @@ style | Object | - | 样式，Typescript：`React.CSSProperties` | N
 children | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 content | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 disabled | Boolean | - | make link to be disabled | N
-hover | String | underline | hover link style。options：color/underline | N
+download | String / Boolean | - | Causes the browser to treat the linked URL as a download | N
+hover | String | underline | hover link style。options: color/underline | N
 href | String | - | \- | N
 prefixIcon | TElement | - | Typescript：`TNode`。[see more ts definition](https://github.com/Tencent/tdesign-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-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-react/blob/develop/src/common.ts) | N
 suffixIcon | TElement | - | Typescript：`TNode`。[see more ts definition](https://github.com/Tencent/tdesign-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
+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

src/link/link.md

@@ -10,6 +10,7 @@ style | Object | - | 样式，TS 类型：`React.CSSProperties` | N
 children | TNode | - | 链接内容，同 content。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 content | TNode | - | 链接内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 disabled | Boolean | - | 禁用链接 | N
+download | String / Boolean | - | 使得浏览器将链接的 URL 视为可下载资源 | N
 hover | String | underline | 链接悬浮态样式，有 文本颜色变化、添加下划线等 2 种方法。可选项：color/underline | N
 href | String | - | 跳转链接 | N
 prefixIcon | TElement | - | 前置图标。TS 类型：`TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N

src/link/type.ts

@@ -20,6 +20,10 @@ export interface TdLinkProps {
    * 禁用链接
    */
   disabled?: boolean;
+  /**
+   * 使得浏览器将链接的 URL 视为可下载资源
+   */
+  download?: string | boolean;
   /**
    * 链接悬浮态样式，有 文本颜色变化、添加下划线等 2 种方法
    * @default underline

test/snap/__snapshots__/csr.test.jsx.snap

@@ -126396,6 +126396,131 @@ exports[`csr snapshot test > csr test src/link/_example/disabled.jsx 1`] = `
 }
 `;
 
+exports[`csr snapshot test > csr test src/link/_example/download.jsx 1`] = `
+{
+  "asFragment": [Function],
+  "baseElement": <body>
+    <script
+      class="t-svg-js-stylesheet--unique-class"
+      src="https://tdesign.gtimg.com/icon/0.1.4/fonts/index.js"
+    />
+    <script
+      class="t-svg-js-stylesheet--unique-class"
+      src="https://tdesign.gtimg.com/icon/default-demo/index.js"
+    />
+    <div>
+      <div
+        class="t-space t-space-horizontal"
+        style="gap: 16px;"
+      >
+        <div
+          class="t-space-item"
+        >
+          <a
+            class="t-link t-link--theme-primary t-link--hover-underline"
+            download=""
+            href="/starter/assets/vue.ee956b80.svg"
+          >
+            跳转链接
+          </a>
+        </div>
+        <div
+          class="t-space-item"
+        >
+          <a
+            class="t-link t-link--theme-primary t-link--hover-underline"
+            download="test/download-file.png"
+            href="/starter/assets/vue.ee956b80.svg"
+          >
+            跳转链接
+          </a>
+        </div>
+      </div>
+    </div>
+  </body>,
+  "container": <div>
+    <div
+      class="t-space t-space-horizontal"
+      style="gap: 16px;"
+    >
+      <div
+        class="t-space-item"
+      >
+        <a
+          class="t-link t-link--theme-primary t-link--hover-underline"
+          download=""
+          href="/starter/assets/vue.ee956b80.svg"
+        >
+          跳转链接
+        </a>
+      </div>
+      <div
+        class="t-space-item"
+      >
+        <a
+          class="t-link t-link--theme-primary t-link--hover-underline"
+          download="test/download-file.png"
+          href="/starter/assets/vue.ee956b80.svg"
+        >
+          跳转链接
+        </a>
+      </div>
+    </div>
+  </div>,
+  "debug": [Function],
+  "findAllByAltText": [Function],
+  "findAllByDisplayValue": [Function],
+  "findAllByLabelText": [Function],
+  "findAllByPlaceholderText": [Function],
+  "findAllByRole": [Function],
+  "findAllByTestId": [Function],
+  "findAllByText": [Function],
+  "findAllByTitle": [Function],
+  "findByAltText": [Function],
+  "findByDisplayValue": [Function],
+  "findByLabelText": [Function],
+  "findByPlaceholderText": [Function],
+  "findByRole": [Function],
+  "findByTestId": [Function],
+  "findByText": [Function],
+  "findByTitle": [Function],
+  "getAllByAltText": [Function],
+  "getAllByDisplayValue": [Function],
+  "getAllByLabelText": [Function],
+  "getAllByPlaceholderText": [Function],
+  "getAllByRole": [Function],
+  "getAllByTestId": [Function],
+  "getAllByText": [Function],
+  "getAllByTitle": [Function],
+  "getByAltText": [Function],
+  "getByDisplayValue": [Function],
+  "getByLabelText": [Function],
+  "getByPlaceholderText": [Function],
+  "getByRole": [Function],
+  "getByTestId": [Function],
+  "getByText": [Function],
+  "getByTitle": [Function],
+  "queryAllByAltText": [Function],
+  "queryAllByDisplayValue": [Function],
+  "queryAllByLabelText": [Function],
+  "queryAllByPlaceholderText": [Function],
+  "queryAllByRole": [Function],
+  "queryAllByTestId": [Function],
+  "queryAllByText": [Function],
+  "queryAllByTitle": [Function],
+  "queryByAltText": [Function],
+  "queryByDisplayValue": [Function],
+  "queryByLabelText": [Function],
+  "queryByPlaceholderText": [Function],
+  "queryByRole": [Function],
+  "queryByTestId": [Function],
+  "queryByText": [Function],
+  "queryByTitle": [Function],
+  "rerender": [Function],
+  "unmount": [Function],
+}
+`;
+
 exports[`csr snapshot test > csr test src/link/_example/hover.jsx 1`] = `
 {
   "asFragment": [Function],

test/snap/__snapshots__/ssr.test.jsx.snap

@@ -530,6 +530,8 @@ exports[`ssr snapshot test > ssr test src/link/_example/base.jsx 1`] = `"<a clas
 
 exports[`ssr snapshot test > ssr test src/link/_example/disabled.jsx 1`] = `"<div style=\\"gap:16px\\" class=\\"t-space t-space-horizontal\\"><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-default t-is-disabled\\">查看链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-primary t-is-disabled t-is-underline\\">查看链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-danger t-is-disabled\\">查看链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-warning t-is-disabled\\">查看链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-success t-is-disabled\\">查看链接<span class=\\"t-link__suffix-icon\\"><svg fill=\\"none\\" viewBox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-jump\\"><path fill=\\"currentColor\\" d=\\"M2.3 13.7a1 1 0 00.7.3h10a1 1 0 001-1V8.5h-1V13H3V3h4.5V2H3a1 1 0 00-1 1v10c0 .27.1.52.3.7z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M9 3V2h4.5c.28 0 .5.22.5.5V7h-1V3.7L8.7 8 8 7.3 12.3 3H9z\\" fill-opacity=\\"0.9\\"></path></svg></span></a></div></div>"`;
 
+exports[`ssr snapshot test > ssr test src/link/_example/download.jsx 1`] = `"<div style=\\"gap:16px\\" class=\\"t-space t-space-horizontal\\"><div class=\\"t-space-item\\"><a href=\\"/starter/assets/vue.ee956b80.svg\\" class=\\"t-link t-link--theme-primary t-link--hover-underline\\" download=\\"\\">跳转链接</a></div><div class=\\"t-space-item\\"><a href=\\"/starter/assets/vue.ee956b80.svg\\" class=\\"t-link t-link--theme-primary t-link--hover-underline\\" download=\\"test/download-file.png\\">跳转链接</a></div></div>"`;
+
 exports[`ssr snapshot test > ssr test src/link/_example/hover.jsx 1`] = `"<div style=\\"gap:16px\\" class=\\"t-space t-space-vertical\\"><div class=\\"t-space-item\\"><div style=\\"gap:16px\\" class=\\"t-space t-space-horizontal\\"><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-default t-link--hover-underline\\">跳转链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-primary t-link--hover-underline\\">跳转链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-danger t-link--hover-underline\\">跳转链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-warning t-link--hover-underline\\">跳转链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-success t-link--hover-underline\\">跳转链接</a></div></div></div><div class=\\"t-space-item\\"><div style=\\"gap:16px\\" class=\\"t-space t-space-horizontal\\"><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-default t-link--hover-color\\">跳转链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-primary t-link--hover-color\\">跳转链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-danger t-link--hover-color\\">跳转链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-warning t-link--hover-color\\">跳转链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-success t-link--hover-color\\">跳转链接</a></div></div></div><div class=\\"t-space-item\\"><div style=\\"gap:16px\\" class=\\"t-space t-space-horizontal\\"><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-default t-is-underline t-link--hover-color\\">跳转链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-primary t-is-underline t-link--hover-color\\">跳转链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-danger t-is-underline t-link--hover-color\\">跳转链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-warning t-is-underline t-link--hover-color\\">跳转链接</a></div><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-success t-is-underline t-link--hover-color\\">跳转链接</a></div></div></div></div>"`;
 
 exports[`ssr snapshot test > ssr test src/link/_example/icon.jsx 1`] = `"<div style=\\"gap:16px\\" class=\\"t-space t-space-horizontal\\"><div class=\\"t-space-item\\"><a class=\\"t-link t-link--theme-default t-link--hover-underline\\"><span class=\\"t-link__prefix-icon\\"><svg fill=\\"none\\" viewBox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-link\\"><path fill=\\"currentColor\\" d=\\"M6.23 11.89l2.12-2.12.71.7-2.12 2.13A2.5 2.5 0 013.4 9.06l2.13-2.12.7.7-2.12 2.13a1.5 1.5 0 002.12 2.12zM10.47 9.06l-.7-.7 2.12-2.13a1.5 1.5 0 10-2.12-2.12L7.65 6.23l-.71-.7L9.06 3.4a2.5 2.5 0 013.54 3.54l-2.13 2.12z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M9.06 6.23L6.23 9.06l.71.7 2.83-2.82-.7-.7z\\" fill-opacity=\\"0.9\\"></path></svg></span>跳转链接</a></div><div class=\\"t-space-item\\"><a target=\\"_self\\" href=\\"https://tdesign.tencent.com/\\" class=\\"t-link t-link--theme-primary t-is-underline t-link--hover-underline\\"><span class=\\"t-link__prefix-icon\\"><svg fill=\\"none\\" viewBox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-link\\"><path fill=\\"currentColor\\" d=\\"M6.23 11.89l2.12-2.12.71.7-2.12 2.13A2.5 2.5 0 013.4 9.06l2.13-2.12.7.7-2.12 2.13a1.5 1.5 0 002.12 2.12zM10.47 9.06l-.7-.7 2.12-2.13a1.5 1.5 0 10-2.12-2.12L7.65 6.23l-.71-.7L9.06 3.4a2.5 2.5 0 013.54 3.54l-2.13 2.12z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M9.06 6.23L6.23 9.06l.71.7 2.83-2.82-.7-.7z\\" fill-opacity=\\"0.9\\"></path></svg></span>跳转链接</a></div><div class=\\"t-space-item\\"><a target=\\"_self\\" href=\\"https://tdesign.tencent.com/\\" class=\\"t-link t-link--theme-danger t-is-underline t-link--hover-underline\\"><span class=\\"t-link__prefix-icon\\"><svg fill=\\"none\\" viewBox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-jump\\"><path fill=\\"currentColor\\" d=\\"M2.3 13.7a1 1 0 00.7.3h10a1 1 0 001-1V8.5h-1V13H3V3h4.5V2H3a1 1 0 00-1 1v10c0 .27.1.52.3.7z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M9 3V2h4.5c.28 0 .5.22.5.5V7h-1V3.7L8.7 8 8 7.3 12.3 3H9z\\" fill-opacity=\\"0.9\\"></path></svg></span>跳转链接</a></div><div class=\\"t-space-item\\"><a target=\\"_self\\" class=\\"t-link t-link--theme-warning t-is-disabled t-is-underline\\"><span class=\\"t-link__prefix-icon\\"><svg fill=\\"none\\" viewBox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-jump\\"><path fill=\\"currentColor\\" d=\\"M2.3 13.7a1 1 0 00.7.3h10a1 1 0 001-1V8.5h-1V13H3V3h4.5V2H3a1 1 0 00-1 1v10c0 .27.1.52.3.7z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M9 3V2h4.5c.28 0 .5.22.5.5V7h-1V3.7L8.7 8 8 7.3 12.3 3H9z\\" fill-opacity=\\"0.9\\"></path></svg></span>跳转链接</a></div></div>"`;