Skip to content

Commit df7630d

Browse files
HackGenesisHackGenesis
committed
fix shadows
1 parent 8b691c9 commit df7630d

File tree

5 files changed

+33
-122
lines changed

5 files changed

+33
-122
lines changed

‎shesha-reactjs/src/designer-components/_common-migrations/migrateStyles.ts‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -94,13 +94,6 @@ export const migrateStyles = <T extends ExtendedType>(prev: T, defaults?: Omit<I
9494
blurRadius: prevStyles?.shadow?.blurRadius ?? prev?.shadow?.blurRadius ?? defaults?.shadow?.blurRadius ?? 0,
9595
spreadRadius: prevStyles?.shadow?.spreadRadius ?? prev?.shadow?.spreadRadius ?? defaults?.shadow?.spreadRadius ?? 0,
9696
},
97-
menuItemShadow: {
98-
offsetX: prevStyles?.menuItemShadow?.offsetX ?? prev?.menuItemShadow?.offsetX ?? defaults?.menuItemShadow?.offsetX ?? 0,
99-
offsetY: prevStyles?.menuItemShadow?.offsetY ?? prev?.menuItemShadow?.offsetY ?? defaults?.menuItemShadow?.offsetY ?? 0,
100-
color: prevStyles?.menuItemShadow?.color ?? prev?.menuItemShadow?.color ?? defaults?.menuItemShadow?.color ?? '#000',
101-
blurRadius: prevStyles?.menuItemShadow?.blurRadius ?? prev?.menuItemShadow?.blurRadius ?? defaults?.menuItemShadow?.blurRadius ?? 0,
102-
spreadRadius: prevStyles?.menuItemShadow?.spreadRadius ?? prev?.menuItemShadow?.spreadRadius ?? defaults?.menuItemShadow?.spreadRadius ?? 0,
103-
},
10497
overflow: prevStyles?.overflow ?? prev?.overflow ?? defaults?.overflow,
10598
...(defaults?.display && { display: defaults?.display || 'block' }),
10699
stylingBox: prevStyles?.stylingBox ?? prev?.stylingBox ?? defaults?.stylingBox ?? '{}',

‎shesha-reactjs/src/designer-components/horizontalMenu/index.tsx‎

Lines changed: 10 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ import { filterObjFromKeys } from "@/utils";
44
import { EditOutlined, MenuUnfoldOutlined } from "@ant-design/icons";
55
import {
66
ConfigurableComponentRenderer,
7-
getShadowStyle,
87
getStyle,
98
IConfigurableFormComponent,
109
ISidebarMenuItem,
@@ -33,13 +32,6 @@ interface IMenuListProps extends IConfigurableFormComponent, ILayoutColor {
3332
styleOnSelected?: string;
3433
styleOnSubMenu?: string;
3534
width?: string;
36-
menuItemShadow?: {
37-
color: string;
38-
offsetX?: number;
39-
offsetY?: number;
40-
blurRadius?: number;
41-
spreadRadius?: number;
42-
};
4335
}
4436

4537
type MenuOverflowValue = "dropdown" | "menu" | "scroll";
@@ -63,6 +55,7 @@ export const MenuListComponent: IToolboxComponent<IMenuListProps> = {
6355
name: "Menu List",
6456
isInput: false,
6557
isOutput: false,
58+
preserveDimensionsInDesigner: true,
6659
icon: <MenuUnfoldOutlined />,
6760
Factory: ({ model }) => {
6861
const { data } = useFormData();
@@ -151,10 +144,6 @@ export const MenuListComponent: IToolboxComponent<IMenuListProps> = {
151144
};
152145
}, [model.font, fontSize]);
153146

154-
const menuItemShadowStyle = useMemo(() => {
155-
return getShadowStyle(model?.menuItemShadow);
156-
}, [model?.menuItemShadow]);
157-
158147
if (model.hidden) return null;
159148

160149
return (
@@ -183,7 +172,6 @@ export const MenuListComponent: IToolboxComponent<IMenuListProps> = {
183172
styleOnHover={getStyle(model?.styleOnHover, data)}
184173
styleOnSelected={getStyle(model?.styleOnSelected, data)}
185174
styleOnSubMenu={getStyle(model?.styleOnSubMenu, data)}
186-
menuItemStyle={menuItemShadowStyle}
187175
overflow={resolveMenuOverflow(model.menuOverflow)}
188176
width={width}
189177
fontStyles={finalFontStyles as React.CSSProperties}
@@ -201,10 +189,15 @@ export const MenuListComponent: IToolboxComponent<IMenuListProps> = {
201189
.add<IMenuListProps>(0, (prev) => ({
202190
...migratePrevStyles(prev, defaultStyles()),
203191
}))
204-
.add<IMenuListProps>(1, (prev) => ({
205-
...prev,
206-
menuOverflow: prev.menuOverflow ?? resolveMenuOverflow(prev.overflow as MenuOverflowValue | string | undefined),
207-
})),
192+
.add<IMenuListProps>(1, (prev) => {
193+
const overflow = prev.menuOverflow ?? prev.overflow;
194+
return {
195+
...prev,
196+
menuOverflow: typeof overflow === 'string' && (overflow === 'dropdown' || overflow === 'menu' || overflow === 'scroll')
197+
? overflow
198+
: 'dropdown',
199+
};
200+
}),
208201
};
209202

210203
export default MenuListComponent;

‎shesha-reactjs/src/designer-components/horizontalMenu/settings.ts‎

Lines changed: 20 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,26 @@ export const getSettings: SettingsFormMarkupFactory = ({ fbf }) => {
8484
title: 'Appearance',
8585
id: appearanceTabId,
8686
components: [...fbf()
87+
.addSettingsInputRow({
88+
id: nanoid(),
89+
parentId: appearanceTabId,
90+
inputs: [
91+
{
92+
type: 'dropdown',
93+
id: nanoid(),
94+
propertyName: 'menuOverflow',
95+
label: 'Overflow',
96+
size: 'small',
97+
jsSetting: true,
98+
defaultValue: 'dropdown',
99+
dropdownOptions: [
100+
{ label: 'Dropdown', value: 'dropdown' },
101+
{ label: 'Menu', value: 'menu' },
102+
{ label: 'Scroll', value: 'scroll' },
103+
],
104+
},
105+
],
106+
})
87107
.addPropertyRouter({
88108
id: styleRouterId,
89109
propertyName: 'propertyRouter1',
@@ -110,25 +130,6 @@ export const getSettings: SettingsFormMarkupFactory = ({ fbf }) => {
110130
content: {
111131
id: pnlMenuStylesId,
112132
components: [...fbf()
113-
.addSettingsInputRow({
114-
id: nanoid(),
115-
parentId: pnlMenuStylesId,
116-
inputs: [
117-
{
118-
type: 'dropdown',
119-
id: nanoid(),
120-
propertyName: 'menuOverflow',
121-
label: 'Overflow',
122-
size: 'small',
123-
jsSetting: true,
124-
dropdownOptions: [
125-
{ label: 'Dropdown', value: 'dropdown' },
126-
{ label: 'Menu', value: 'menu' },
127-
{ label: 'Scroll', value: 'scroll' },
128-
],
129-
},
130-
],
131-
})
132133
.addCollapsiblePanel({
133134
id: nanoid(),
134135
propertyName: 'pnlColors',
@@ -312,75 +313,6 @@ export const getSettings: SettingsFormMarkupFactory = ({ fbf }) => {
312313
},
313314
],
314315
})
315-
.addCollapsiblePanel({
316-
id: nanoid(),
317-
propertyName: 'pnlMenuItemShadowStyle',
318-
label: 'Shadow',
319-
labelAlign: 'right',
320-
ghost: true,
321-
parentId: pnlMenuStylesId,
322-
collapsible: 'header',
323-
content: {
324-
id: nanoid(),
325-
components: [...fbf()
326-
.addSettingsInputRow({
327-
id: nanoid(),
328-
parentId: pnlMenuStylesId,
329-
inline: true,
330-
inputs: [
331-
{
332-
type: 'numberField',
333-
id: nanoid(),
334-
label: 'Offset X',
335-
hideLabel: true,
336-
tooltip: 'Offset X',
337-
width: 80,
338-
icon: "offsetHorizontalIcon",
339-
propertyName: 'menuItemShadow.offsetX',
340-
},
341-
{
342-
type: 'numberField',
343-
id: nanoid(),
344-
label: 'Offset Y',
345-
hideLabel: true,
346-
tooltip: 'Offset Y',
347-
width: 80,
348-
icon: 'offsetVerticalIcon',
349-
propertyName: 'menuItemShadow.offsetY',
350-
},
351-
{
352-
type: 'numberField',
353-
id: nanoid(),
354-
label: 'Blur',
355-
hideLabel: true,
356-
tooltip: 'Blur Radius',
357-
width: 80,
358-
icon: 'blurIcon',
359-
propertyName: 'menuItemShadow.blurRadius',
360-
},
361-
{
362-
type: 'numberField',
363-
id: nanoid(),
364-
label: 'Spread',
365-
hideLabel: true,
366-
tooltip: 'Spread Radius',
367-
width: 80,
368-
icon: 'spreadIcon',
369-
propertyName: 'menuItemShadow.spreadRadius',
370-
},
371-
{
372-
type: 'colorPicker',
373-
id: nanoid(),
374-
label: 'Color',
375-
hideLabel: true,
376-
propertyName: 'menuItemShadow.color',
377-
},
378-
],
379-
})
380-
.toJson(),
381-
],
382-
},
383-
})
384316
.addCollapsiblePanel({
385317
id: nanoid(),
386318
propertyName: 'pnlCustomStyle',

‎shesha-reactjs/src/designer-components/horizontalMenu/utils.ts‎

Lines changed: 3 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { IStyleType } from "@/index";
22

3-
export const defaultStyles = (): IStyleType => {
3+
export const defaultStyles = () => {
44
return {
55
background: { type: 'color' },
66
font: { weight: '400', size: 14, color: '#000', type: 'Segoe UI' },
@@ -23,14 +23,8 @@ export const defaultStyles = (): IStyleType => {
2323
blurRadius: 0,
2424
spreadRadius: 0,
2525
},
26-
menuItemShadow: {
27-
color: '#000000',
28-
offsetX: 0,
29-
offsetY: 0,
30-
blurRadius: 0,
31-
spreadRadius: 0,
32-
},
3326
overflow: 'dropdown',
3427
dimensions: { width: '500px', height: '55px', minHeight: '0px', maxHeight: 'auto', minWidth: '0px', maxWidth: 'auto' },
35-
};
28+
menuOverflow: 'dropdown',
29+
} as any;
3630
};

‎shesha-reactjs/src/providers/form/models.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,6 @@ export interface IStyleType {
6363
background?: IBackgroundValue;
6464
font?: IFontValue;
6565
shadow?: IShadowValue;
66-
menuItemShadow?: IShadowValue;
6766
dimensions?: IDimensionsValue;
6867
size?: SizeType;
6968
style?: string;

0 commit comments

Comments
 (0)