mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-24 19:19:57 +08:00
Merge pull request #46965 from ant-design/master
chore: merge master into feature
This commit is contained in:
commit
5f7323a3d1
2
.github/ISSUE_TEMPLATE/config.yml
vendored
2
.github/ISSUE_TEMPLATE/config.yml
vendored
@ -5,4 +5,4 @@ contact_links:
|
||||
about: The issue which is not created via https://new-issue.ant.design will be closed immediately.
|
||||
- name: 🆕 创建一个新 Issue
|
||||
url: https://new-issue.ant.design
|
||||
about: 不是用 https://new-issue.ant.design 创建的 issue 会被机器人自动关闭。另外『如何使用...』类问题建议使用讨论区 https://github.com/ant-design/ant-design/discussions
|
||||
about: ⚠️ 注意请不要使用上面的 Report a vulnerability(报告安全漏洞)来报告组件库的 bug 和特性请求,请点击右侧 Open 按钮。不是用 https://new-issue.ant.design 创建的 issue 会被机器人自动关闭。
|
||||
|
6
.github/workflows/test.yml
vendored
6
.github/workflows/test.yml
vendored
@ -73,6 +73,12 @@ jobs:
|
||||
|
||||
- name: lint
|
||||
run: npm run lint
|
||||
|
||||
- name: lint:react-16
|
||||
run: npm run compile && npm run install-react-16 && npm run tsc:old
|
||||
|
||||
- name: lint:react-17
|
||||
run: npm run compile && npm run install-react-17 && npm run tsc:old
|
||||
needs: setup
|
||||
|
||||
check_metadata:
|
||||
|
@ -16,6 +16,47 @@ tag: vVERSION
|
||||
|
||||
---
|
||||
|
||||
## 5.13.0
|
||||
|
||||
`2024-01-13`
|
||||
|
||||
- 🔥 Form support `variant` to control components variant inside. [#46573](https://github.com/ant-design/ant-design/pull/46573)
|
||||
- 🆕 Cascader、DatePicker、Select、TreeSelect、Input、InputNumber、Mentions support `variant` props. [#46568](https://github.com/ant-design/ant-design/pull/46568) [#46549](https://github.com/ant-design/ant-design/pull/46549) [#46435](https://github.com/ant-design/ant-design/pull/46435) [#46381](https://github.com/ant-design/ant-design/pull/46381) [#46379](https://github.com/ant-design/ant-design/pull/46379) [#46337](https://github.com/ant-design/ant-design/pull/46337)
|
||||
- 🆕 QRCode support `status` adds a new scanned option. [#46704](https://github.com/ant-design/ant-design/pull/46704)
|
||||
- 🆕 Table support `hidden` to set hidden columns. [#46957](https://github.com/ant-design/ant-design/pull/46957) [@madocto](https://github.com/madocto)
|
||||
- 🆕 Select support the `maxCount`, which is used to set the maximum selectable value. [#46667](https://github.com/ant-design/ant-design/pull/46667)
|
||||
- 🆕 Mentions support `allowClear` for setting the clearing function. [#46396](https://github.com/ant-design/ant-design/pull/46396) [@yociduo](https://github.com/yociduo)
|
||||
- 🆕 ColorPicker support displaying cleared status. [#45993](https://github.com/ant-design/ant-design/pull/45993)
|
||||
- 🆕 Drawer adds `styles.wrapper` and discards the `contentWrapperStyle` `drawerStyle` `maskStyle` attributes, and simplifies the dom structure. [#46858](https://github.com/ant-design/ant-design/pull/46858)
|
||||
- Tour
|
||||
- 🆕 Tour support `disabledInteraction`, which is used to disable the interactive behavior of the highlighted area. [#46304](https://github.com/ant-design/ant-design/pull/46304)
|
||||
- 🐞 Fixed the issue where modifying `pointAtCenter` under the `arrow` attribute of the Tour component does not take effect. [#46301](https://github.com/ant-design/ant-design/pull/46301)
|
||||
- Tabs
|
||||
- 🆕 Tabs support the `indicator: { align: xxx }` attribute, which is used to set the alignment of the Tabs indicator bar. [#46786](https://github.com/ant-design/ant-design/pull/46786)
|
||||
- 🛠 Tabs deprecated the `indicatorSize` attribute and replaced it with `indicator: { size: xxx }`. [#46786](https://github.com/ant-design/ant-design/pull/46786)
|
||||
- ConfigProvider
|
||||
- 🆕 ConfigProvider adds `ConfigProvider.config` to support `holderRender` for `message` `modal` `notification` static method setting `Provider`. [#46596](https://github.com/ant-design/ant-design/pull/46596)
|
||||
- 🆕 ConfigProvider support the `indicator: { align: xxx }` attribute, which is used to set the alignment of the Tabs indicator bar. [#46786](https://github.com/ant-design/ant-design/pull/46786)
|
||||
- 🛠 ConfigProvider deprecated the Tabs `indicatorSize` attribute and replaced it with `indicator: { size: xxx }`. [#46786](https://github.com/ant-design/ant-design/pull/46786)
|
||||
- 🐞 Fix the problem of Segmented content being obscured in `hover` and `active`. [#46925](https://github.com/ant-design/ant-design/pull/46925) [@madocto](https://github.com/madocto)
|
||||
- 🐞 Fixed the problem that the customized font size of Checkbox does not take effect under Form. [#46904](https://github.com/ant-design/ant-design/pull/46904)
|
||||
- 🐞 Fixed the issue where the Radio component configuration `title` did not take effect. [#46809](https://github.com/ant-design/ant-design/pull/46809)
|
||||
- 🐞 Fixed Input hover style in css var mode. [#46946](https://github.com/ant-design/ant-design/pull/46946)
|
||||
- 💄 Fixed the problem of abnormal display of Dropdown style under multi-level menu. [#46888](https://github.com/ant-design/ant-design/pull/46888)
|
||||
- 🛠 Refactor the popup panel logic of the ColorPicker component to avoid style conflicts when customizing using `panelRender`. [#46327](https://github.com/ant-design/ant-design/pull/46327)
|
||||
- TypeScript
|
||||
- 🆕 MISC: Export `GetProp` `GetProps` `GetRef` tool methods to facilitate developers to obtain unexported type definitions. [#46923](https://github.com/ant-design/ant-design/pull/46923)
|
||||
- 🆕 Checkbox.Group now supports generic configurable `options.value`. [#46423](https://github.com/ant-design/ant-design/pull/46423) [@daledelv](https://github.com/daledelv)
|
||||
- 🌈 Token
|
||||
- 🆕 Button support the `contentLineHeight` series of tokens. [#46936](https://github.com/ant-design/ant-design/pull/46936)
|
||||
- 🆕 Input support `inputFontSize` token. [#46875](https://github.com/ant-design/ant-design/pull/46875)
|
||||
- 🆕 Menu support `darkPopupBg` token. [#46618](https://github.com/ant-design/ant-design/pull/46618)
|
||||
- 🆕 Segmented support `trackPadding` and `trackBg` token. [#46674](https://github.com/ant-design/ant-design/pull/46674)
|
||||
- 🐞 Fix the problem that `paddingBlock` does not take effect after customizing `contentFontSize` token in Button component. [#46901](https://github.com/ant-design/ant-design/pull/46901)
|
||||
- 🐞 Fixed the issue where the InputNumber component cannot customize the `padding` token. [#46878](https://github.com/ant-design/ant-design/pull/46878)
|
||||
- 🌐 Localization
|
||||
- 🇩🇰 Improve da_DK Form local. [#46493](https://github.com/ant-design/ant-design/pull/46493) [@Eloi0424](https://github.com/Eloi0424)
|
||||
|
||||
## 5.12.8
|
||||
|
||||
`2024-01-05`
|
||||
|
@ -16,6 +16,47 @@ tag: vVERSION
|
||||
|
||||
---
|
||||
|
||||
## 5.13.0
|
||||
|
||||
`2024-01-13`
|
||||
|
||||
- 🔥 Form 组件新增 `variant` 属性用于设置内部组件形态变体。[#46573](https://github.com/ant-design/ant-design/pull/46573)
|
||||
- 🆕 Cascader、DatePicker、Select、TreeSelect、Input、InputNumber、Mentions 组件新增形态变体 `variant` 属性。[#46568](https://github.com/ant-design/ant-design/pull/46568) [#46549](https://github.com/ant-design/ant-design/pull/46549) [#46435](https://github.com/ant-design/ant-design/pull/46435) [#46381](https://github.com/ant-design/ant-design/pull/46381) [#46379](https://github.com/ant-design/ant-design/pull/46379) [#46337](https://github.com/ant-design/ant-design/pull/46337)
|
||||
- 🆕 QRCode 组件 `status` 新增已扫描选项。[#46704](https://github.com/ant-design/ant-design/pull/46704)
|
||||
- 🆕 Table 组件新增 `hidden` 属性可设置隐藏列。[#46957](https://github.com/ant-design/ant-design/pull/46957) [@madocto](https://github.com/madocto)
|
||||
- 🆕 Select 组件新增支持 `maxCount` 属性,用于设置最大可选。[#46667](https://github.com/ant-design/ant-design/pull/46667)
|
||||
- 🆕 Mentions 组件新增 `allowClear` 属性,用于设置清除功能。[#46396](https://github.com/ant-design/ant-design/pull/46396) [@yociduo](https://github.com/yociduo)
|
||||
- 🆕 ColorPicker 新增支持显示清空状态。[#45993](https://github.com/ant-design/ant-design/pull/45993)
|
||||
- 🆕 Drawer 组件新增 `styles.wrapper` 并废弃 `contentWrapperStyle` `drawerStyle` `maskStyle` 属性,并简化 dom 结构。[#46858](https://github.com/ant-design/ant-design/pull/46858)
|
||||
- Tour
|
||||
- 🆕 Tour 新增 `disabledInteraction` 属性,用于禁用高亮区域的交互行为。[#46304](https://github.com/ant-design/ant-design/pull/46304)
|
||||
- 🐞 修复 Tour 组件在 `arrow` 属性下修改 `pointAtCenter` 不生效的问题。[#46301](https://github.com/ant-design/ant-design/pull/46301)
|
||||
- Tabs
|
||||
- 🆕 Tabs 组件支持 `indicator: { align: xxx }` 属性,用于设置 Tabs 指示条对齐方式。[#46786](https://github.com/ant-design/ant-design/pull/46786)
|
||||
- 🛠 Tabs 组件废弃 `indicatorSize` 属性,改为 `indicator: { size: xxx }` 代替。[#46786](https://github.com/ant-design/ant-design/pull/46786)
|
||||
- ConfigProvider
|
||||
- 🆕 ConfigProvider 组件新增 `ConfigProvider.config` 支持 `holderRender`,用于 `message` `modal` `notification` 静态方法设置 `Provider`。[#46596](https://github.com/ant-design/ant-design/pull/46596)
|
||||
- 🆕 ConfigProvider 组件支持 `indicator: { align: xxx }` 属性,用于设置 Tabs 指示条对齐方式。[#46786](https://github.com/ant-design/ant-design/pull/46786)
|
||||
- 🛠 ConfigProvider 组件废弃 Tabs 组件的 `indicatorSize` 属性,改为 `indicator: { size: xxx }` 代替。[#46786](https://github.com/ant-design/ant-design/pull/46786)
|
||||
- 🐞 修复 Segmented 在 `hover` 和 `active` 内容被遮挡的问题。[#46925](https://github.com/ant-design/ant-design/pull/46925) [@madocto](https://github.com/madocto)
|
||||
- 🐞 修复 Checkbox 定制字体大小在 Form 下不生效的问题。[#46904](https://github.com/ant-design/ant-design/pull/46904)
|
||||
- 🐞 修复 Radio 组件配置 `title` 未生效的问题。[#46809](https://github.com/ant-design/ant-design/pull/46809)
|
||||
- 🐞 修复 Input 组件在 css 变量模式下的悬浮态样式问题。[#46946](https://github.com/ant-design/ant-design/pull/46946)
|
||||
- 💄 修复 Dropdown 在多级菜单下样式显示异常的问题。[#46888](https://github.com/ant-design/ant-design/pull/46888)
|
||||
- 🛠 重构 ColorPicker 组件弹出面板逻辑,避免使用 `panelRender` 自定义时样式冲突的问题。[#46327](https://github.com/ant-design/ant-design/pull/46327)
|
||||
- TypeScript
|
||||
- 🆕 MISC: 导出 `GetProp` `GetProps` `GetRef` 工具方法,便于开发者获取未导出的类型定义。[#46923](https://github.com/ant-design/ant-design/pull/46923)
|
||||
- 🆕 Checkbox.Group 新增支持范型可配置 `options.value`。[#46423](https://github.com/ant-design/ant-design/pull/46423) [@daledelv](https://github.com/daledelv)
|
||||
- 🌈 Token
|
||||
- 🆕 Button 组件新增支持 `contentLineHeight` 系列 token。[#46936](https://github.com/ant-design/ant-design/pull/46936)
|
||||
- 🆕 Input 组件新增支持 `inputFontSize` token。[#46875](https://github.com/ant-design/ant-design/pull/46875)
|
||||
- 🆕 Menu 组件新增支持 `darkPopupBg` token。[#46618](https://github.com/ant-design/ant-design/pull/46618)
|
||||
- 🆕 Segmented 组件新增 `trackPadding` 和 `trackBg` token。[#46674](https://github.com/ant-design/ant-design/pull/46674)
|
||||
- 🐞 修复 Button 组件定制 `contentFontSize` token 后 `paddingBlock` 不生效的问题。[#46901](https://github.com/ant-design/ant-design/pull/46901)
|
||||
- 🐞 修复 InputNumber 组件无法定制 `padding` token 的问题。[#46878](https://github.com/ant-design/ant-design/pull/46878)
|
||||
- 🌐 国际化
|
||||
- 🇩🇰 完善 da_DK Form 文案。[#46493](https://github.com/ant-design/ant-design/pull/46493) [@Eloi0424](https://github.com/Eloi0424)
|
||||
|
||||
## 5.12.8
|
||||
|
||||
`2024-01-05`
|
||||
|
@ -17,7 +17,7 @@ group:
|
||||
|
||||
当内容区域比较长,需要滚动页面时,这部分内容对应的操作或者导航需要在滚动范围内始终展现。常用于侧边菜单和按钮组合。
|
||||
|
||||
页面可视范围过小时,慎用此功能以免遮挡页面内容。
|
||||
页面可视范围过小时,慎用此功能以免出现遮挡页面内容的情况。
|
||||
|
||||
> 开发者注意事项:
|
||||
>
|
||||
|
@ -2,9 +2,9 @@ import React from 'react';
|
||||
import { PoweroffOutlined } from '@ant-design/icons';
|
||||
import { Button, Flex } from 'antd';
|
||||
|
||||
const Text1 = () => '部署';
|
||||
const Text1 = () => <>部署</>;
|
||||
const Text2 = () => <span>部署</span>;
|
||||
const Text3 = () => 'Submit';
|
||||
const Text3 = () => <>Submit</>;
|
||||
|
||||
const App: React.FC = () => (
|
||||
<Flex wrap="wrap" gap="small">
|
||||
|
@ -170,4 +170,4 @@ export { GroupContext };
|
||||
|
||||
export default CheckboxGroup as <T extends CheckboxValueType = CheckboxValueType>(
|
||||
props: CheckboxGroupProps<T> & React.RefAttributes<HTMLDivElement>,
|
||||
) => React.ReactNode;
|
||||
) => React.ReactElement;
|
||||
|
@ -958,7 +958,10 @@ describe('ConfigProvider support style and className props', () => {
|
||||
it('Should Table className & style works', () => {
|
||||
const { container } = render(
|
||||
<ConfigProvider table={{ className: 'cp-table', style: { backgroundColor: 'blue' } }}>
|
||||
<Table dataSource={[]} />
|
||||
<Table
|
||||
columns={[{ title: 'Address', dataIndex: 'address', key: 'address 1', ellipsis: true }]}
|
||||
dataSource={[{ key: '1', name: 'Jim Green', age: 40, address: 'test', tags: ['loser'] }]}
|
||||
/>
|
||||
</ConfigProvider>,
|
||||
);
|
||||
const element = container.querySelector<HTMLDivElement>('.ant-table-wrapper');
|
||||
|
@ -1,7 +1,7 @@
|
||||
import React, { useState } from 'react';
|
||||
import { Button, ConfigProvider, Drawer, Space } from 'antd';
|
||||
import { createStyles, useTheme } from 'antd-style';
|
||||
import type { DrawerClassNames, DrawerStyles } from '../DrawerPanel';
|
||||
import type { DrawerClassNames, DrawerStyles } from 'antd/es/drawer/DrawerPanel';
|
||||
|
||||
const useStyle = createStyles(({ token }) => ({
|
||||
'my-drawer-body': {
|
||||
|
@ -1,7 +1,7 @@
|
||||
import { AudioOutlined } from '@ant-design/icons';
|
||||
import React from 'react';
|
||||
import { AudioOutlined } from '@ant-design/icons';
|
||||
import { Input, Space } from 'antd';
|
||||
import type { SearchProps } from '../Search';
|
||||
import type { SearchProps } from 'antd/es/input/Search';
|
||||
|
||||
const { Search } = Input;
|
||||
|
||||
|
@ -123,6 +123,7 @@ export const initComponentToken = (token: AliasToken): SharedComponentToken => {
|
||||
controlOutline,
|
||||
colorErrorOutline,
|
||||
colorWarningOutline,
|
||||
colorBgContainer,
|
||||
} = token;
|
||||
|
||||
return {
|
||||
@ -145,8 +146,8 @@ export const initComponentToken = (token: AliasToken): SharedComponentToken => {
|
||||
activeShadow: `0 0 0 ${controlOutlineWidth}px ${controlOutline}`,
|
||||
errorActiveShadow: `0 0 0 ${controlOutlineWidth}px ${colorErrorOutline}`,
|
||||
warningActiveShadow: `0 0 0 ${controlOutlineWidth}px ${colorWarningOutline}`,
|
||||
hoverBg: '',
|
||||
activeBg: '',
|
||||
hoverBg: colorBgContainer,
|
||||
activeBg: colorBgContainer,
|
||||
inputFontSize: fontSize,
|
||||
inputFontSizeLG: fontSizeLG,
|
||||
inputFontSizeSM: fontSize,
|
||||
|
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,6 +1,6 @@
|
||||
import React from 'react';
|
||||
import { FrownOutlined, MehOutlined, SmileOutlined } from '@ant-design/icons';
|
||||
import { Rate } from 'antd';
|
||||
import { Flex, Rate } from 'antd';
|
||||
|
||||
const customIcons: Record<number, React.ReactNode> = {
|
||||
1: <FrownOutlined />,
|
||||
@ -11,11 +11,10 @@ const customIcons: Record<number, React.ReactNode> = {
|
||||
};
|
||||
|
||||
const App: React.FC = () => (
|
||||
<>
|
||||
<Flex gap="middle" vertical>
|
||||
<Rate defaultValue={2} character={({ index = 0 }) => index + 1} />
|
||||
<br />
|
||||
<Rate defaultValue={3} character={({ index = 0 }) => customIcons[index + 1]} />
|
||||
</>
|
||||
</Flex>
|
||||
);
|
||||
|
||||
export default App;
|
||||
|
@ -1,15 +1,13 @@
|
||||
import React from 'react';
|
||||
import { HeartOutlined } from '@ant-design/icons';
|
||||
import { Rate } from 'antd';
|
||||
import { Flex, Rate } from 'antd';
|
||||
|
||||
const App: React.FC = () => (
|
||||
<>
|
||||
<Flex vertical gap="middle">
|
||||
<Rate character={<HeartOutlined />} allowHalf />
|
||||
<br />
|
||||
<Rate character="A" allowHalf style={{ fontSize: 36 }} />
|
||||
<br />
|
||||
<Rate character="好" allowHalf />
|
||||
</>
|
||||
</Flex>
|
||||
);
|
||||
|
||||
export default App;
|
||||
|
@ -1,18 +1,17 @@
|
||||
import React from 'react';
|
||||
import { Space, Rate } from 'antd';
|
||||
import { Flex, Rate } from 'antd';
|
||||
|
||||
const App: React.FC = () => (
|
||||
<>
|
||||
<Space>
|
||||
<Flex gap="middle" vertical>
|
||||
<Flex gap="middle">
|
||||
<Rate defaultValue={3} />
|
||||
<span>allowClear: true</span>
|
||||
</Space>
|
||||
<br />
|
||||
<Space>
|
||||
<Rate allowClear={false} defaultValue={3} />
|
||||
</Flex>
|
||||
<Flex gap="middle">
|
||||
<Rate defaultValue={3} allowClear={false} />
|
||||
<span>allowClear: false</span>
|
||||
</Space>
|
||||
</>
|
||||
</Flex>
|
||||
</Flex>
|
||||
);
|
||||
|
||||
export default App;
|
||||
|
@ -1,6 +1,6 @@
|
||||
## zh-CN
|
||||
|
||||
Component Token Debug.
|
||||
调试使用。
|
||||
|
||||
## en-US
|
||||
|
||||
|
@ -1,16 +1,15 @@
|
||||
import React, { useState } from 'react';
|
||||
import { Space, Rate } from 'antd';
|
||||
import { Flex, Rate } from 'antd';
|
||||
|
||||
const desc = ['terrible', 'bad', 'normal', 'good', 'wonderful'];
|
||||
|
||||
const App: React.FC = () => {
|
||||
const [value, setValue] = useState(3);
|
||||
|
||||
return (
|
||||
<Space>
|
||||
<Flex gap="middle" vertical>
|
||||
<Rate tooltips={desc} onChange={setValue} value={value} />
|
||||
{value ? <span>{desc[value - 1]}</span> : ''}
|
||||
</Space>
|
||||
{value ? <span>{desc[value - 1]}</span> : null}
|
||||
</Flex>
|
||||
);
|
||||
};
|
||||
|
||||
|
@ -2,11 +2,9 @@ import React, { useRef, useState } from 'react';
|
||||
import { SearchOutlined } from '@ant-design/icons';
|
||||
import type { GetRef, TableColumnsType, TableColumnType } from 'antd';
|
||||
import { Button, Input, Space, Table } from 'antd';
|
||||
import type { FilterDropdownProps } from 'antd/es/table/interface';
|
||||
import Highlighter from 'react-highlight-words';
|
||||
|
||||
type FilterDropdownType = Exclude<TableColumnType<DataType>['filterDropdown'], React.ReactNode>;
|
||||
type FilterConfirmProps = Parameters<FilterDropdownType>[0]['confirm'];
|
||||
|
||||
type InputRef = GetRef<typeof Input>;
|
||||
|
||||
interface DataType {
|
||||
@ -52,7 +50,7 @@ const App: React.FC = () => {
|
||||
|
||||
const handleSearch = (
|
||||
selectedKeys: string[],
|
||||
confirm: FilterConfirmProps,
|
||||
confirm: FilterDropdownProps['confirm'],
|
||||
dataIndex: DataIndex,
|
||||
) => {
|
||||
confirm();
|
||||
|
@ -18,7 +18,7 @@ exports[`renders components/watermark/demo/basic.tsx extend context correctly 2`
|
||||
|
||||
exports[`renders components/watermark/demo/custom.tsx extend context correctly 1`] = `
|
||||
<div
|
||||
style="display: flex;"
|
||||
class="ant-flex ant-flex-gap-middle"
|
||||
>
|
||||
<div
|
||||
class=""
|
||||
@ -44,7 +44,7 @@ exports[`renders components/watermark/demo/custom.tsx extend context correctly 1
|
||||
</div>
|
||||
</article>
|
||||
<img
|
||||
alt="示例图片"
|
||||
alt="img"
|
||||
src="https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*zx7LTI_ECSAAAAAAAAAAAABkARQnAQ"
|
||||
style="z-index: 10; width: 100%; max-width: 800px; position: relative;"
|
||||
/>
|
||||
@ -54,7 +54,7 @@ exports[`renders components/watermark/demo/custom.tsx extend context correctly 1
|
||||
</div>
|
||||
<form
|
||||
class="ant-form ant-form-vertical"
|
||||
style="width: 280px; flex-shrink: 0; border-left: 1px solid #eee; padding-left: 20px; margin-left: 20px;"
|
||||
style="width: 280px; flex-shrink: 0; border-left: 1px solid #eee; padding-inline-start: 16px;"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item"
|
||||
@ -758,103 +758,98 @@ exports[`renders components/watermark/demo/custom.tsx extend context correctly 1
|
||||
class="ant-form-item-control-input-content"
|
||||
>
|
||||
<div
|
||||
class="ant-space ant-space-horizontal ant-space-align-baseline ant-space-gap-row-small ant-space-gap-col-small"
|
||||
style="display: flex;"
|
||||
class="ant-flex ant-flex-gap-small"
|
||||
>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
class="ant-form-item"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item"
|
||||
class="ant-row ant-form-item-row"
|
||||
>
|
||||
<div
|
||||
class="ant-row ant-form-item-row"
|
||||
class="ant-col ant-form-item-control"
|
||||
>
|
||||
<div
|
||||
class="ant-col ant-form-item-control"
|
||||
class="ant-form-item-control-input"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input"
|
||||
class="ant-form-item-control-input-content"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input-content"
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width: 100%;"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width: 100%;"
|
||||
class="ant-input-number-handler-wrap"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number-handler-wrap"
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
>
|
||||
<span
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<input
|
||||
aria-valuenow="100"
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="gap_0"
|
||||
placeholder="gapX"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value="100"
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
>
|
||||
<input
|
||||
aria-valuenow="100"
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="gap_0"
|
||||
placeholder="gapX"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value="100"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -863,99 +858,95 @@ exports[`renders components/watermark/demo/custom.tsx extend context correctly 1
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
class="ant-form-item"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item"
|
||||
class="ant-row ant-form-item-row"
|
||||
>
|
||||
<div
|
||||
class="ant-row ant-form-item-row"
|
||||
class="ant-col ant-form-item-control"
|
||||
>
|
||||
<div
|
||||
class="ant-col ant-form-item-control"
|
||||
class="ant-form-item-control-input"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input"
|
||||
class="ant-form-item-control-input-content"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input-content"
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width: 100%;"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width: 100%;"
|
||||
class="ant-input-number-handler-wrap"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number-handler-wrap"
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
>
|
||||
<span
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<input
|
||||
aria-valuenow="100"
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="gap_1"
|
||||
placeholder="gapY"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value="100"
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
>
|
||||
<input
|
||||
aria-valuenow="100"
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="gap_1"
|
||||
placeholder="gapY"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value="100"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -996,102 +987,97 @@ exports[`renders components/watermark/demo/custom.tsx extend context correctly 1
|
||||
class="ant-form-item-control-input-content"
|
||||
>
|
||||
<div
|
||||
class="ant-space ant-space-horizontal ant-space-align-baseline ant-space-gap-row-small ant-space-gap-col-small"
|
||||
style="display: flex;"
|
||||
class="ant-flex ant-flex-gap-small"
|
||||
>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
class="ant-form-item"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item"
|
||||
class="ant-row ant-form-item-row"
|
||||
>
|
||||
<div
|
||||
class="ant-row ant-form-item-row"
|
||||
class="ant-col ant-form-item-control"
|
||||
>
|
||||
<div
|
||||
class="ant-col ant-form-item-control"
|
||||
class="ant-form-item-control-input"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input"
|
||||
class="ant-form-item-control-input-content"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input-content"
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width: 100%;"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width: 100%;"
|
||||
class="ant-input-number-handler-wrap"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number-handler-wrap"
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
>
|
||||
<span
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="offset_0"
|
||||
placeholder="offsetLeft"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value=""
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="offset_0"
|
||||
placeholder="offsetLeft"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1100,98 +1086,94 @@ exports[`renders components/watermark/demo/custom.tsx extend context correctly 1
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
class="ant-form-item"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item"
|
||||
class="ant-row ant-form-item-row"
|
||||
>
|
||||
<div
|
||||
class="ant-row ant-form-item-row"
|
||||
class="ant-col ant-form-item-control"
|
||||
>
|
||||
<div
|
||||
class="ant-col ant-form-item-control"
|
||||
class="ant-form-item-control-input"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input"
|
||||
class="ant-form-item-control-input-content"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input-content"
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width: 100%;"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width: 100%;"
|
||||
class="ant-input-number-handler-wrap"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number-handler-wrap"
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
>
|
||||
<span
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="offset_1"
|
||||
placeholder="offsetTop"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value=""
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="offset_1"
|
||||
placeholder="offsetTop"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1243,44 +1225,32 @@ exports[`renders components/watermark/demo/multi-line.tsx extend context correct
|
||||
exports[`renders components/watermark/demo/portal.tsx extend context correctly 1`] = `
|
||||
Array [
|
||||
<div
|
||||
class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
|
||||
class="ant-flex ant-flex-gap-middle"
|
||||
>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
<button
|
||||
class="ant-btn ant-btn-primary"
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
class="ant-btn ant-btn-default"
|
||||
type="button"
|
||||
>
|
||||
<span>
|
||||
Show in Modal
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
<span>
|
||||
Show in Modal
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
class="ant-btn ant-btn-primary"
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
class="ant-btn ant-btn-default"
|
||||
type="button"
|
||||
>
|
||||
<span>
|
||||
Show in Drawer
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
<span>
|
||||
Show in Drawer
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
class="ant-btn ant-btn-primary"
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
class="ant-btn ant-btn-default"
|
||||
type="button"
|
||||
>
|
||||
<span>
|
||||
Not Show in Drawer
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<span>
|
||||
Not Show in Drawer
|
||||
</span>
|
||||
</button>
|
||||
</div>,
|
||||
<div
|
||||
class=""
|
||||
|
@ -13,7 +13,7 @@ exports[`renders components/watermark/demo/basic.tsx correctly 1`] = `
|
||||
|
||||
exports[`renders components/watermark/demo/custom.tsx correctly 1`] = `
|
||||
<div
|
||||
style="display:flex"
|
||||
class="ant-flex ant-flex-gap-middle"
|
||||
>
|
||||
<div
|
||||
class=""
|
||||
@ -39,14 +39,14 @@ exports[`renders components/watermark/demo/custom.tsx correctly 1`] = `
|
||||
</div>
|
||||
</article>
|
||||
<img
|
||||
alt="示例图片"
|
||||
alt="img"
|
||||
src="https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*zx7LTI_ECSAAAAAAAAAAAABkARQnAQ"
|
||||
style="z-index:10;width:100%;max-width:800px;position:relative"
|
||||
/>
|
||||
</div>
|
||||
<form
|
||||
class="ant-form ant-form-vertical"
|
||||
style="width:280px;flex-shrink:0;border-left:1px solid #eee;padding-left:20px;margin-left:20px"
|
||||
style="width:280px;flex-shrink:0;border-left:1px solid #eee;padding-inline-start:16px"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item"
|
||||
@ -325,103 +325,98 @@ exports[`renders components/watermark/demo/custom.tsx correctly 1`] = `
|
||||
class="ant-form-item-control-input-content"
|
||||
>
|
||||
<div
|
||||
class="ant-space ant-space-horizontal ant-space-align-baseline ant-space-gap-row-small ant-space-gap-col-small"
|
||||
style="display:flex"
|
||||
class="ant-flex ant-flex-gap-small"
|
||||
>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
class="ant-form-item"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item"
|
||||
class="ant-row ant-form-item-row"
|
||||
>
|
||||
<div
|
||||
class="ant-row ant-form-item-row"
|
||||
class="ant-col ant-form-item-control"
|
||||
>
|
||||
<div
|
||||
class="ant-col ant-form-item-control"
|
||||
class="ant-form-item-control-input"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input"
|
||||
class="ant-form-item-control-input-content"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input-content"
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width:100%"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width:100%"
|
||||
class="ant-input-number-handler-wrap"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number-handler-wrap"
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
>
|
||||
<span
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<input
|
||||
aria-valuenow="100"
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="gap_0"
|
||||
placeholder="gapX"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value="100"
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
>
|
||||
<input
|
||||
aria-valuenow="100"
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="gap_0"
|
||||
placeholder="gapX"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value="100"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -430,99 +425,95 @@ exports[`renders components/watermark/demo/custom.tsx correctly 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
class="ant-form-item"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item"
|
||||
class="ant-row ant-form-item-row"
|
||||
>
|
||||
<div
|
||||
class="ant-row ant-form-item-row"
|
||||
class="ant-col ant-form-item-control"
|
||||
>
|
||||
<div
|
||||
class="ant-col ant-form-item-control"
|
||||
class="ant-form-item-control-input"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input"
|
||||
class="ant-form-item-control-input-content"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input-content"
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width:100%"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width:100%"
|
||||
class="ant-input-number-handler-wrap"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number-handler-wrap"
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
>
|
||||
<span
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<input
|
||||
aria-valuenow="100"
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="gap_1"
|
||||
placeholder="gapY"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value="100"
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
>
|
||||
<input
|
||||
aria-valuenow="100"
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="gap_1"
|
||||
placeholder="gapY"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value="100"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -563,102 +554,97 @@ exports[`renders components/watermark/demo/custom.tsx correctly 1`] = `
|
||||
class="ant-form-item-control-input-content"
|
||||
>
|
||||
<div
|
||||
class="ant-space ant-space-horizontal ant-space-align-baseline ant-space-gap-row-small ant-space-gap-col-small"
|
||||
style="display:flex"
|
||||
class="ant-flex ant-flex-gap-small"
|
||||
>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
class="ant-form-item"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item"
|
||||
class="ant-row ant-form-item-row"
|
||||
>
|
||||
<div
|
||||
class="ant-row ant-form-item-row"
|
||||
class="ant-col ant-form-item-control"
|
||||
>
|
||||
<div
|
||||
class="ant-col ant-form-item-control"
|
||||
class="ant-form-item-control-input"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input"
|
||||
class="ant-form-item-control-input-content"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input-content"
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width:100%"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width:100%"
|
||||
class="ant-input-number-handler-wrap"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number-handler-wrap"
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
>
|
||||
<span
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="offset_0"
|
||||
placeholder="offsetLeft"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value=""
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="offset_0"
|
||||
placeholder="offsetLeft"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -667,98 +653,94 @@ exports[`renders components/watermark/demo/custom.tsx correctly 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
class="ant-form-item"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item"
|
||||
class="ant-row ant-form-item-row"
|
||||
>
|
||||
<div
|
||||
class="ant-row ant-form-item-row"
|
||||
class="ant-col ant-form-item-control"
|
||||
>
|
||||
<div
|
||||
class="ant-col ant-form-item-control"
|
||||
class="ant-form-item-control-input"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input"
|
||||
class="ant-form-item-control-input-content"
|
||||
>
|
||||
<div
|
||||
class="ant-form-item-control-input-content"
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width:100%"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number ant-input-number-in-form-item ant-input-number-outlined"
|
||||
style="width:100%"
|
||||
class="ant-input-number-handler-wrap"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number-handler-wrap"
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
>
|
||||
<span
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
</span>
|
||||
<span
|
||||
aria-disabled="false"
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="offset_1"
|
||||
placeholder="offsetTop"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value=""
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
id="offset_1"
|
||||
placeholder="offsetTop"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -801,44 +783,32 @@ exports[`renders components/watermark/demo/multi-line.tsx correctly 1`] = `
|
||||
exports[`renders components/watermark/demo/portal.tsx correctly 1`] = `
|
||||
Array [
|
||||
<div
|
||||
class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
|
||||
class="ant-flex ant-flex-gap-middle"
|
||||
>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
<button
|
||||
class="ant-btn ant-btn-primary"
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
class="ant-btn ant-btn-default"
|
||||
type="button"
|
||||
>
|
||||
<span>
|
||||
Show in Modal
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
<span>
|
||||
Show in Modal
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
class="ant-btn ant-btn-primary"
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
class="ant-btn ant-btn-default"
|
||||
type="button"
|
||||
>
|
||||
<span>
|
||||
Show in Drawer
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="ant-space-item"
|
||||
<span>
|
||||
Show in Drawer
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
class="ant-btn ant-btn-primary"
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
class="ant-btn ant-btn-default"
|
||||
type="button"
|
||||
>
|
||||
<span>
|
||||
Not Show in Drawer
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<span>
|
||||
Not Show in Drawer
|
||||
</span>
|
||||
</button>
|
||||
</div>,
|
||||
<div
|
||||
class=""
|
||||
|
@ -1,6 +1,6 @@
|
||||
import React, { useMemo, useState } from 'react';
|
||||
import { ColorPicker, Form, Input, InputNumber, Slider, Space, Typography, Watermark } from 'antd';
|
||||
import type { ColorPickerProps, GetProp } from 'antd';
|
||||
import React, { useState } from 'react';
|
||||
import { ColorPicker, Flex, Form, Input, InputNumber, Slider, Typography, Watermark } from 'antd';
|
||||
import type { ColorPickerProps, GetProp, WatermarkProps } from 'antd';
|
||||
|
||||
type Color = GetProp<ColorPickerProps, 'color'>;
|
||||
|
||||
@ -29,23 +29,17 @@ const App: React.FC = () => {
|
||||
});
|
||||
const { content, color, fontSize, zIndex, rotate, gap, offset } = config;
|
||||
|
||||
const watermarkProps = useMemo(
|
||||
() => ({
|
||||
content,
|
||||
font: {
|
||||
color: typeof color === 'string' ? color : color.toRgbString(),
|
||||
fontSize,
|
||||
},
|
||||
zIndex,
|
||||
rotate,
|
||||
gap,
|
||||
offset,
|
||||
}),
|
||||
[config],
|
||||
);
|
||||
const watermarkProps: WatermarkProps = {
|
||||
content,
|
||||
zIndex,
|
||||
rotate,
|
||||
gap,
|
||||
offset,
|
||||
font: { color: typeof color === 'string' ? color : color.toRgbString(), fontSize },
|
||||
};
|
||||
|
||||
return (
|
||||
<div style={{ display: 'flex' }}>
|
||||
<Flex gap="middle">
|
||||
<Watermark {...watermarkProps}>
|
||||
<Typography>
|
||||
<Paragraph>
|
||||
@ -73,24 +67,13 @@ const App: React.FC = () => {
|
||||
</Paragraph>
|
||||
</Typography>
|
||||
<img
|
||||
style={{
|
||||
zIndex: 10,
|
||||
width: '100%',
|
||||
maxWidth: 800,
|
||||
position: 'relative',
|
||||
}}
|
||||
style={{ zIndex: 10, width: '100%', maxWidth: 800, position: 'relative' }}
|
||||
src="https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*zx7LTI_ECSAAAAAAAAAAAABkARQnAQ"
|
||||
alt="示例图片"
|
||||
alt="img"
|
||||
/>
|
||||
</Watermark>
|
||||
<Form
|
||||
style={{
|
||||
width: 280,
|
||||
flexShrink: 0,
|
||||
borderLeft: '1px solid #eee',
|
||||
paddingLeft: 20,
|
||||
marginLeft: 20,
|
||||
}}
|
||||
style={{ width: 280, flexShrink: 0, borderLeft: '1px solid #eee', paddingInlineStart: 16 }}
|
||||
form={form}
|
||||
layout="vertical"
|
||||
initialValues={config}
|
||||
@ -114,27 +97,27 @@ const App: React.FC = () => {
|
||||
<Slider step={1} min={-180} max={180} />
|
||||
</Form.Item>
|
||||
<Form.Item label="Gap" style={{ marginBottom: 0 }}>
|
||||
<Space style={{ display: 'flex' }} align="baseline">
|
||||
<Flex gap="small">
|
||||
<Form.Item name={['gap', 0]}>
|
||||
<InputNumber placeholder="gapX" style={{ width: '100%' }} />
|
||||
</Form.Item>
|
||||
<Form.Item name={['gap', 1]}>
|
||||
<InputNumber placeholder="gapY" style={{ width: '100%' }} />
|
||||
</Form.Item>
|
||||
</Space>
|
||||
</Flex>
|
||||
</Form.Item>
|
||||
<Form.Item label="Offset" style={{ marginBottom: 0 }}>
|
||||
<Space style={{ display: 'flex' }} align="baseline">
|
||||
<Flex gap="small">
|
||||
<Form.Item name={['offset', 0]}>
|
||||
<InputNumber placeholder="offsetLeft" style={{ width: '100%' }} />
|
||||
</Form.Item>
|
||||
<Form.Item name={['offset', 1]}>
|
||||
<InputNumber placeholder="offsetTop" style={{ width: '100%' }} />
|
||||
</Form.Item>
|
||||
</Space>
|
||||
</Flex>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</div>
|
||||
</Flex>
|
||||
);
|
||||
};
|
||||
|
||||
|
@ -4,4 +4,4 @@
|
||||
|
||||
## en-US
|
||||
|
||||
Specify the image address via 'image'. To ensure that the image is high definition and not stretched, set the width and height, and upload at least twice the width and height of the logo image address.
|
||||
Specify the image address via `image`. To ensure that the image is high definition and not stretched, set the width and height, and upload at least twice the width and height of the logo image address.
|
||||
|
@ -4,4 +4,4 @@
|
||||
|
||||
## en-US
|
||||
|
||||
Use 'content' to set a string array to specify multi-line text watermark content.
|
||||
Use `content` to set a string array to specify multi-line text watermark content.
|
||||
|
@ -1,19 +1,15 @@
|
||||
import React from 'react';
|
||||
import { Button, Drawer, Modal, Space, Watermark } from 'antd';
|
||||
import { Button, Drawer, Flex, Modal, Watermark } from 'antd';
|
||||
|
||||
const placeholder = (
|
||||
<div
|
||||
style={{
|
||||
height: 300,
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
background: 'rgba(150, 150, 150, 0.2)',
|
||||
}}
|
||||
>
|
||||
A mock height
|
||||
</div>
|
||||
);
|
||||
const style: React.CSSProperties = {
|
||||
height: 300,
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor: 'rgba(150, 150, 150, 0.2)',
|
||||
};
|
||||
|
||||
const placeholder = <div style={style}>A mock height</div>;
|
||||
|
||||
const App: React.FC = () => {
|
||||
const [showModal, setShowModal] = React.useState(false);
|
||||
@ -26,12 +22,17 @@ const App: React.FC = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Space>
|
||||
<Button onClick={() => setShowModal(true)}>Show in Modal</Button>
|
||||
<Button onClick={() => setShowDrawer(true)}>Show in Drawer</Button>
|
||||
<Button onClick={() => setShowDrawer2(true)}>Not Show in Drawer</Button>
|
||||
</Space>
|
||||
|
||||
<Flex gap="middle">
|
||||
<Button type="primary" onClick={() => setShowModal(true)}>
|
||||
Show in Modal
|
||||
</Button>
|
||||
<Button type="primary" onClick={() => setShowDrawer(true)}>
|
||||
Show in Drawer
|
||||
</Button>
|
||||
<Button type="primary" onClick={() => setShowDrawer2(true)}>
|
||||
Not Show in Drawer
|
||||
</Button>
|
||||
</Flex>
|
||||
<Watermark content="Ant Design">
|
||||
<Modal
|
||||
destroyOnClose
|
||||
|
@ -8,7 +8,7 @@ demo:
|
||||
cols: 1
|
||||
---
|
||||
|
||||
Add specific text or patterns to the page.
|
||||
Add specific text or patterns to the page. Available since `5.0.0`.
|
||||
|
||||
## When To Use
|
||||
|
||||
@ -28,6 +28,8 @@ Add specific text or patterns to the page.
|
||||
|
||||
Common props ref:[Common props](/docs/react/common-props)
|
||||
|
||||
> This component is available since `antd@5.0.0`.
|
||||
|
||||
### Watermark
|
||||
|
||||
| Property | Description | Type | Default | Version |
|
||||
|
@ -10,7 +10,7 @@ demo:
|
||||
tag: New
|
||||
---
|
||||
|
||||
给页面的某个区域加上水印。
|
||||
给页面的某个区域加上水印。自 `5.0.0` 版本开始提供该组件。
|
||||
|
||||
## 何时使用
|
||||
|
||||
@ -30,6 +30,8 @@ tag: New
|
||||
|
||||
通用属性参考:[通用属性](/docs/react/common-props)
|
||||
|
||||
> 自 `antd@5.0.0` 版本开始提供该组件。
|
||||
|
||||
### Watermark
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "antd",
|
||||
"version": "5.12.8",
|
||||
"version": "5.13.0",
|
||||
"description": "An enterprise-class UI design language and React components implementation",
|
||||
"keywords": [
|
||||
"ant",
|
||||
@ -100,6 +100,7 @@
|
||||
"test:update": "jest --config .jest.js --no-cache -u",
|
||||
"token-meta": "tsx scripts/generate-token-meta.ts",
|
||||
"tsc": "tsc --noEmit",
|
||||
"tsc:old": "tsc --noEmit -p tsconfig-old-react.json",
|
||||
"version": "tsx scripts/generate-version.ts",
|
||||
"visual-regression": "tsx scripts/visual-regression/build.ts",
|
||||
"npm-install": "npm install"
|
||||
@ -122,7 +123,7 @@
|
||||
"@ctrl/tinycolor": "^3.6.1",
|
||||
"@rc-component/color-picker": "~1.5.1",
|
||||
"@rc-component/mutate-observer": "^1.1.0",
|
||||
"@rc-component/tour": "~1.12.0",
|
||||
"@rc-component/tour": "~1.12.1",
|
||||
"@rc-component/trigger": "^1.18.2",
|
||||
"classnames": "^2.5.1",
|
||||
"copy-to-clipboard": "^3.3.3",
|
||||
@ -345,7 +346,7 @@
|
||||
"dumi": "^2.3.0-beta.3"
|
||||
}
|
||||
},
|
||||
"packageManager": "npm@10.2.5",
|
||||
"packageManager": "npm@10.3.0",
|
||||
"size-limit": [
|
||||
{
|
||||
"path": "./dist/antd.min.js",
|
||||
|
12
tsconfig-old-react.json
Normal file
12
tsconfig-old-react.json
Normal file
@ -0,0 +1,12 @@
|
||||
{
|
||||
"extends": "./tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"paths": {
|
||||
"antd": ["es"],
|
||||
"antd/es/*": ["es/*"],
|
||||
"antd/lib/*": ["lib/*"],
|
||||
"antd/locale/*": ["locale/*"]
|
||||
}
|
||||
},
|
||||
"include": ["components/*/demo/*.tsx"]
|
||||
}
|
Loading…
Reference in New Issue
Block a user