Skip to content

Commit 82bc5fb

Browse files
TrySoundTrySound
authored
refactor: drop stylable flag in component meta (webstudio-is#4779)
There is no need in additional flag if we add preset style to every stylable component already.
1 parent ac90f03 commit 82bc5fb

23 files changed

Lines changed: 171 additions & 208 deletions

File tree

‎apps/builder/app/builder/features/inspector/inspector.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,13 @@ export const Inspector = ({ navigatorLayout }: InspectorProps) => {
102102
type PanelName = "style" | "settings";
103103

104104
const availablePanels = new Set<PanelName>();
105-
if (documentType === "html" && (meta?.stylable ?? true) && isDesignMode) {
105+
if (
106+
// forbid styling body in xml document
107+
documentType === "html" &&
108+
// forbid styling components without preset
109+
meta?.presetStyle !== undefined &&
110+
isDesignMode
111+
) {
106112
availablePanels.add("style");
107113
}
108114
// @todo hide root component settings until

‎apps/builder/app/builder/features/style-panel/sections/advanced/advanced.tsx‎

Lines changed: 7 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,6 @@ import {
3838
properties as propertiesData,
3939
propertyDescriptions,
4040
} from "@webstudio-is/css-data";
41-
import { ROOT_INSTANCE_ID } from "@webstudio-is/sdk";
4241
import {
4342
hyphenateProperty,
4443
toValue,
@@ -67,13 +66,12 @@ import { PropertyInfo } from "../../property-label";
6766
import { sections } from "../sections";
6867
import { ColorPopover } from "../../shared/color-picker";
6968
import {
70-
$instances,
7169
$registeredComponentMetas,
72-
$selectedInstanceSelector,
7370
$styles,
7471
$styleSourceSelections,
7572
} from "~/shared/nano-states";
7673
import { useClientSupports } from "~/shared/client-supports";
74+
import { $selectedInstancePath } from "~/shared/awareness";
7775

7876
// Only here to keep the same section module interface
7977
export const properties = [];
@@ -376,33 +374,20 @@ const initialProperties = new Set<StyleProperty>([
376374

377375
const $advancedProperties = computed(
378376
[
379-
$selectedInstanceSelector,
380-
$instances,
377+
// prevent showing properties inherited from root
378+
// to not bloat advanced panel
379+
$selectedInstancePath,
381380
$registeredComponentMetas,
382381
$styleSourceSelections,
383382
$matchingBreakpoints,
384383
$styles,
385384
],
386-
(
387-
instanceSelector,
388-
instances,
389-
metas,
390-
styleSourceSelections,
391-
matchingBreakpoints,
392-
styles
393-
) => {
394-
if (instanceSelector === undefined) {
385+
(instancePath, metas, styleSourceSelections, matchingBreakpoints, styles) => {
386+
if (instancePath === undefined) {
395387
return [];
396388
}
397-
const instanceAndRootSelector =
398-
instanceSelector[0] === ROOT_INSTANCE_ID
399-
? instanceSelector
400-
: // prevent showing properties inherited from root
401-
// to not bloat advanced panel
402-
instanceSelector;
403389
const definedStyles = getDefinedStyles({
404-
instanceSelector: instanceAndRootSelector,
405-
instances,
390+
instancePath,
406391
metas,
407392
matchingBreakpoints,
408393
styleSourceSelections,

‎apps/builder/app/builder/features/style-panel/sections/backgrounds/background-content.stories.tsx‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,10 @@ import {
44
FloatingPanel,
55
FloatingPanelProvider,
66
} from "@webstudio-is/design-system";
7+
import { createDefaultPages } from "@webstudio-is/project-build";
78
import {
89
$breakpoints,
10+
$pages,
911
$selectedBreakpointId,
1012
$styles,
1113
$styleSourceSelections,
@@ -31,8 +33,15 @@ $styles.set(new Map([[getStyleDeclKey(backgroundImage), backgroundImage]]));
3133
$styleSourceSelections.set(
3234
new Map([["box", { instanceId: "box", values: ["local"] }]])
3335
);
36+
$pages.set(
37+
createDefaultPages({
38+
homePageId: "homePageId",
39+
rootInstanceId: "box",
40+
systemDataSourceId: "systemId",
41+
})
42+
);
3443
$awareness.set({
35-
pageId: "",
44+
pageId: "homePageId",
3645
instanceSelector: ["box"],
3746
});
3847

‎apps/builder/app/builder/features/style-panel/sections/position/inset-control.stories.tsx‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
import type { Meta } from "@storybook/react";
22
import { Box } from "@webstudio-is/design-system";
33
import { getStyleDeclKey, StyleDecl } from "@webstudio-is/sdk";
4+
import { createDefaultPages } from "@webstudio-is/project-build";
45
import { InsetControl } from "./inset-control";
56
import { registerContainers } from "~/shared/sync";
67
import {
78
$breakpoints,
9+
$pages,
810
$selectedBreakpointId,
911
$styles,
1012
$styleSources,
@@ -41,8 +43,15 @@ $styles.set(new Map([[getStyleDeclKey(right), right]]));
4143
$styleSourceSelections.set(
4244
new Map([["box", { instanceId: "box", values: ["local"] }]])
4345
);
46+
$pages.set(
47+
createDefaultPages({
48+
homePageId: "homePageId",
49+
rootInstanceId: "box",
50+
systemDataSourceId: "systemId",
51+
})
52+
);
4453
$awareness.set({
45-
pageId: "",
54+
pageId: "homePageId",
4655
instanceSelector: ["box"],
4756
});
4857

‎apps/builder/app/builder/features/style-panel/sections/transitions/transitions.stories.tsx‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { styled, theme } from "@webstudio-is/design-system";
22
import { getStyleDeclKey, StyleDecl } from "@webstudio-is/sdk";
33
import {
44
$breakpoints,
5+
$pages,
56
$selectedBreakpointId,
67
$styles,
78
$styleSources,
@@ -10,6 +11,7 @@ import {
1011
import { registerContainers } from "~/shared/sync";
1112
import { Section } from "./transitions";
1213
import { $awareness } from "~/shared/awareness";
14+
import { createDefaultPages } from "@webstudio-is/project-build";
1315

1416
const Panel = styled("div", {
1517
width: theme.spacing[30],
@@ -50,8 +52,15 @@ $styles.set(
5052
$styleSourceSelections.set(
5153
new Map([["box", { instanceId: "box", values: ["local"] }]])
5254
);
55+
$pages.set(
56+
createDefaultPages({
57+
homePageId: "homePageId",
58+
rootInstanceId: "box",
59+
systemDataSourceId: "systemId",
60+
})
61+
);
5362
$awareness.set({
54-
pageId: "",
63+
pageId: "homePageId",
5564
instanceSelector: ["box"],
5665
});
5766

0 commit comments

Comments
 (0)