Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

refactor: color-picker panel dom logic #46327

Merged
merged 12 commits into from
Dec 18, 2023
Merged

refactor: color-picker panel dom logic #46327

Show file tree
Hide file tree
Changes from 10 commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
78b313b
refactor: refactoring custom panel logic
Wxh16144 Dec 7, 2023
a862605
chore: update test case & update snapshot
Wxh16144 Dec 7, 2023
d8ab9c7
chore: update un-stable snap???
Wxh16144 Dec 7, 2023
b150229
docs: update demo
Wxh16144 Dec 7, 2023
6927f60
chore: update snapshots
Wxh16144 Dec 7, 2023
94f9ab0
fix: table filterDropdown should accept cssvar (#46314)
MadCcc Dec 7, 2023
5ff9b78
Merge branch 'feature' into wuxh/refactor-color-panel
Wxh16144 Dec 15, 2023
6a27918
chore: revert files
Wxh16144 Dec 15, 2023
b314247
chore: update demo
Wxh16144 Dec 15, 2023
be73d8f
chore: update snap
Wxh16144 Dec 15, 2023
b967fcb
Merge branch 'feature' into wuxh/refactor-color-panel
Wxh16144 Dec 16, 2023
097d170
Merge branch 'feature' into wuxh/refactor-color-panel
Wxh16144 Dec 18, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
8 changes: 4 additions & 4 deletions components/color-picker/ColorPickerPanel.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ interface ColorPickerPanelProps extends ColorPickerBaseProps {

const ColorPickerPanel: FC<ColorPickerPanelProps> = (props) => {
const { prefixCls, presets, panelRender, color, onChange, onClear, ...injectProps } = props;
const colorPickerPanelPrefixCls = `${prefixCls}-inner-content`;
const colorPickerPanelPrefixCls = `${prefixCls}-inner`;

// ==== Inject props ===
const panelPickerProps = {
Expand All @@ -38,11 +38,11 @@ const ColorPickerPanel: FC<ColorPickerPanelProps> = (props) => {

// ====================== Render ======================
const innerPanel = (
<>
<div className={`${colorPickerPanelPrefixCls}-content`}>
<PanelPicker />
{Array.isArray(presets) && <Divider className={`${colorPickerPanelPrefixCls}-divider`} />}
{Array.isArray(presets) && <Divider />}
<PanelPresets />
</>
</div>
);

return (
Expand Down
14,492 changes: 7,357 additions & 7,135 deletions components/color-picker/__tests__/__snapshots__/demo-extend.test.ts.snap
View file
Open in desktop

Large diffs are not rendered by default.

72 changes: 28 additions & 44 deletions components/color-picker/__tests__/__snapshots__/demo.test.ts.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -247,36 +247,28 @@ exports[`renders components/color-picker/demo/panel-render.tsx correctly 1`] = `
class="ant-space-item"
>
<div
class="ant-row ant-row-middle"
class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
>
<div
class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
class="ant-space-item"
>
<span>
Add title:
</span>
</div>
<div
class="ant-space-item"
>
<div
class="ant-space-item"
>
<span>
Add title:
</span>
</div>
<div
class="ant-space-item"
class="ant-color-picker-trigger"
>
<div
class="ant-col"
class="ant-color-picker-color-block"
>
<div
class="ant-color-picker-trigger"
>
<div
class="ant-color-picker-color-block"
>
<div
class="ant-color-picker-color-block-inner"
style="background:rgb(22, 119, 255)"
/>
</div>
</div>
class="ant-color-picker-color-block-inner"
style="background:rgb(22, 119, 255)"
/>
</div>
</div>
</div>
Expand All @@ -286,36 +278,28 @@ exports[`renders components/color-picker/demo/panel-render.tsx correctly 1`] = `
class="ant-space-item"
>
<div
class="ant-row ant-row-middle"
class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
>
<div
class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
class="ant-space-item"
>
<span>
Horizontal layout:
</span>
</div>
<div
class="ant-space-item"
>
<div
class="ant-space-item"
>
<span>
Horizontal layout:
</span>
</div>
<div
class="ant-space-item"
class="ant-color-picker-trigger"
>
<div
class="ant-col"
class="ant-color-picker-color-block"
>
<div
class="ant-color-picker-trigger"
>
<div
class="ant-color-picker-color-block"
>
<div
class="ant-color-picker-color-block-inner"
style="background:rgb(22, 119, 255)"
/>
</div>
</div>
class="ant-color-picker-color-block-inner"
style="background:rgb(22, 119, 255)"
/>
</div>
</div>
</div>
Expand Down