Skip to content

Commit 3e2a185

Browse files
softmarshmallowsoftmarshmallow
committed
update style mapper class signature
1 parent f550331 commit 3e2a185

File tree

8 files changed

+80
-68
lines changed

8 files changed

+80
-68
lines changed

‎packages/builder-react-native/rn-build-inline-style-widget/rn-inline-style-module-builder.ts‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {
1111
} from "@web-builder/react-core";
1212
import {
1313
buildJsx,
14-
getWidgetStylesConfigMap,
14+
StylesConfigMapBuilder,
1515
JSXWithoutStyleElementConfig,
1616
JSXWithStyleElementConfig,
1717
WidgetStyleConfigMap,
@@ -48,7 +48,8 @@ export class ReactNativeInlineStyleBuilder {
4848
private readonly widgetName: string;
4949
readonly config: reactnative_config.ReactNativeInlineStyleConfig;
5050
private readonly namer: ScopedVariableNamer;
51-
private readonly stylesConfigWidgetMap: WidgetStyleConfigMap;
51+
private readonly stylesMapper: StylesConfigMapBuilder;
52+
// private readonly stylesConfigWidgetMap: WidgetStyleConfigMap;
5253

5354
constructor({
5455
entry,
@@ -64,7 +65,8 @@ export class ReactNativeInlineStyleBuilder {
6465
entry.key.id,
6566
ReservedKeywordPlatformPresets.react
6667
);
67-
this.stylesConfigWidgetMap = getWidgetStylesConfigMap(entry, {
68+
69+
this.stylesMapper = new StylesConfigMapBuilder(entry, {
6870
namer: this.namer,
6971
rename_tag: false,
7072
});
@@ -73,7 +75,7 @@ export class ReactNativeInlineStyleBuilder {
7375
private stylesConfig(
7476
id: string
7577
): JSXWithStyleElementConfig | JSXWithoutStyleElementConfig {
76-
return this.stylesConfigWidgetMap.get(id);
78+
return this.stylesMapper.map.get(id);
7779
}
7880

7981
private jsxBuilder(widget: JsxWidget) {

‎packages/builder-react-native/rn-build-styled-component-widget/rn-styled-components-module-builder.ts‎

Lines changed: 11 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,7 @@ import {
99
styled_components_imports,
1010
} from "@web-builder/react-core";
1111
import { JsxWidget } from "@web-builder/core";
12-
import {
13-
buildJsx,
14-
getWidgetStylesConfigMap,
15-
WidgetStyleConfigMap,
16-
} from "@web-builder/core/builders";
12+
import { buildJsx, StylesConfigMapBuilder } from "@web-builder/core/builders";
1713
import {
1814
react as react_config,
1915
reactnative as rn_config,
@@ -28,7 +24,7 @@ import {
2824
export class ReactNativeStyledComponentsModuleBuilder {
2925
private readonly entry: JsxWidget;
3026
private readonly widgetName: string;
31-
private readonly styledConfigWidgetMap: WidgetStyleConfigMap;
27+
private readonly stylesMapper: StylesConfigMapBuilder;
3228
private readonly namer: ScopedVariableNamer;
3329
readonly config: rn_config.ReactNativeStyledComponentsConfig;
3430

@@ -45,17 +41,21 @@ export class ReactNativeStyledComponentsModuleBuilder {
4541
entry.key.id,
4642
ReservedKeywordPlatformPresets.react
4743
);
48-
this.styledConfigWidgetMap = getWidgetStylesConfigMap(entry, {
44+
45+
StylesConfigMapBuilder;
46+
47+
this.stylesMapper = new StylesConfigMapBuilder(entry, {
4948
namer: this.namer,
5049
rename_tag: true /** styled component tag shoule be renamed */,
5150
});
51+
5252
this.config = config;
5353
}
5454

5555
private styledConfig(
5656
id: string
5757
): StyledComponentJSXElementConfig | NoStyleJSXElementConfig {
58-
return this.styledConfigWidgetMap.get(id);
58+
return this.stylesMapper.map.get(id);
5959
}
6060

6161
private jsxBuilder(widget: JsxWidget) {
@@ -101,11 +101,10 @@ export class ReactNativeStyledComponentsModuleBuilder {
101101
}
102102

103103
partDeclarations() {
104-
return Array.from(this.styledConfigWidgetMap.keys())
104+
return Array.from(this.stylesMapper.map.keys())
105105
.map((k) => {
106-
return (
107-
this.styledConfigWidgetMap.get(k) as StyledComponentJSXElementConfig
108-
).styledComponent;
106+
return (this.stylesMapper.map.get(k) as StyledComponentJSXElementConfig)
107+
.styledComponent;
109108
})
110109
.filter((s) => s);
111110
}

‎packages/builder-react-native/rn-build-stylesheet-widget/rn-style-sheet-module-builder.ts‎

Lines changed: 13 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -18,10 +18,9 @@ import {
1818
import { JsxWidget } from "@web-builder/core";
1919
import {
2020
buildJsx,
21-
getWidgetStylesConfigMap,
21+
StylesConfigMapBuilder,
2222
JSXWithoutStyleElementConfig,
2323
JSXWithStyleElementConfig,
24-
WidgetStyleConfigMap,
2524
} from "@web-builder/core/builders";
2625
import {
2726
react as react_config,
@@ -33,7 +32,7 @@ import { StyleSheetDeclaration } from "../rn-style-sheet";
3332
export class ReactNativeStyleSheetModuleBuilder {
3433
private readonly entry: JsxWidget;
3534
private readonly widgetName: string;
36-
private readonly stylesConfigWidgetMap: WidgetStyleConfigMap;
35+
private readonly stylesMapper: StylesConfigMapBuilder;
3736
private readonly namer: ScopedVariableNamer;
3837
readonly config: rn_config.ReactNativeStyleSheetConfig;
3938

@@ -50,17 +49,19 @@ export class ReactNativeStyleSheetModuleBuilder {
5049
entry.key.id,
5150
ReservedKeywordPlatformPresets.react
5251
);
53-
this.stylesConfigWidgetMap = getWidgetStylesConfigMap(entry, {
52+
53+
this.stylesMapper = new StylesConfigMapBuilder(entry, {
5454
namer: this.namer,
5555
rename_tag: false /** rn StyleSheet tag shoule not be renamed */,
5656
});
57+
5758
this.config = config;
5859
}
5960

6061
private stylesConfig(
6162
id: string
6263
): JSXWithStyleElementConfig | JSXWithoutStyleElementConfig {
63-
return this.stylesConfigWidgetMap.get(id);
64+
return this.stylesMapper.map.get(id);
6465
}
6566

6667
private jsxBuilder(widget: JsxWidget) {
@@ -136,16 +137,13 @@ export class ReactNativeStyleSheetModuleBuilder {
136137
}
137138

138139
partStyleSheetDeclaration(): StyleSheetDeclaration<any> {
139-
const styles = Array.from(this.stylesConfigWidgetMap.keys()).reduce(
140-
(p, c) => {
141-
const cfg = this.stylesConfig(c);
142-
return {
143-
...p,
144-
[cfg.id]: "style" in cfg && cfg.style,
145-
};
146-
},
147-
{}
148-
);
140+
const styles = Array.from(this.stylesMapper.map.keys()).reduce((p, c) => {
141+
const cfg = this.stylesConfig(c);
142+
return {
143+
...p,
144+
[cfg.id]: "style" in cfg && cfg.style,
145+
};
146+
}, {});
149147

150148
return new StyleSheetDeclaration("styles", {
151149
styles: styles,

‎packages/builder-web-core/builders/build-style-map.ts‎

Lines changed: 27 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { CSSProperties } from "@coli.codes/css";
22
import { WidgetKeyId, StylableJsxWidget, JsxWidget } from "@web-builder/core";
33
import { JSXAttributes, JSXIdentifier, ScopedVariableNamer } from "coli";
44
import { buildStyledComponentConfig } from "@web-builder/styled";
5+
import assert from "assert";
56

67
export interface JSXWithStyleElementConfig {
78
id: string;
@@ -21,43 +22,50 @@ export type WidgetStyleConfigMap = Map<
2122
JSXWithStyleElementConfig | JSXWithoutStyleElementConfig
2223
>;
2324

24-
export function getWidgetStylesConfigMap(
25-
rootWidget: JsxWidget,
26-
preferences: {
27-
namer: ScopedVariableNamer;
28-
rename_tag: boolean;
25+
interface StylesConfigMapBuilderPreference {
26+
namer: ScopedVariableNamer;
27+
rename_tag: boolean;
28+
}
29+
30+
export class StylesConfigMapBuilder {
31+
readonly root: JsxWidget;
32+
readonly preferences: StylesConfigMapBuilderPreference;
33+
private readonly _map: WidgetStyleConfigMap = new Map();
34+
//
35+
constructor(root: JsxWidget, preferences: StylesConfigMapBuilderPreference) {
36+
this.root = root;
37+
this.preferences = preferences;
38+
39+
this._mapper(this.root);
2940
}
30-
): WidgetStyleConfigMap {
31-
const styledConfigWidgetMap: WidgetStyleConfigMap = new Map();
3241

33-
function mapper(widget: JsxWidget) {
34-
if (!widget) {
35-
throw `cannot map trough ${widget}`;
36-
}
42+
private _mapper(widget: JsxWidget) {
43+
assert(widget, "widget is required for building style config map");
44+
3745
if (widget.jsxConfig().type === "static-tree") {
3846
return;
3947
}
4048

41-
const isRoot = widget.key.id == rootWidget.key.id;
49+
const isRoot = widget.key.id == this.root.key.id;
4250
const id = widget.key.id;
4351
if (widget instanceof StylableJsxWidget) {
4452
const styledConfig = buildStyledComponentConfig(widget, {
4553
transformRootName: true,
46-
namer: preferences.namer,
47-
rename_tag: preferences.rename_tag,
54+
namer: this.preferences.namer,
55+
rename_tag: this.preferences.rename_tag,
4856
context: {
4957
root: isRoot,
5058
},
5159
});
5260

53-
styledConfigWidgetMap.set(id, styledConfig);
61+
this._map.set(id, styledConfig);
5462
}
5563
widget.children?.map((childwidget) => {
56-
mapper(childwidget);
64+
this._mapper(childwidget);
5765
});
5866
}
5967

60-
mapper(rootWidget);
61-
62-
return styledConfigWidgetMap;
68+
public get map(): WidgetStyleConfigMap {
69+
return this._map;
70+
}
6371
}

‎packages/builder-web-react/react-css-module-widget/react-css-module-module-builder.ts‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ import {
1818
import { JsxWidget } from "@web-builder/core";
1919
import {
2020
buildJsx,
21-
getWidgetStylesConfigMap,
21+
StylesConfigMapBuilder,
2222
JSXWithoutStyleElementConfig,
2323
JSXWithStyleElementConfig,
2424
WidgetStyleConfigMap,
@@ -34,7 +34,7 @@ import { react as react_config } from "@designto/config";
3434
export class ReactCssModuleBuilder {
3535
private readonly entry: JsxWidget;
3636
private readonly widgetName: string;
37-
private readonly stylesConfigWidgetMap: WidgetStyleConfigMap;
37+
private readonly stylesMapper: StylesConfigMapBuilder;
3838
private readonly namer: ScopedVariableNamer;
3939
readonly config: react_config.ReactCssModuleConfig;
4040

@@ -51,17 +51,18 @@ export class ReactCssModuleBuilder {
5151
entry.key.id,
5252
ReservedKeywordPlatformPresets.react
5353
);
54-
this.stylesConfigWidgetMap = getWidgetStylesConfigMap(entry, {
54+
this.stylesMapper = new StylesConfigMapBuilder(entry, {
5555
namer: this.namer,
5656
rename_tag: false /** css-module tag shoule not be renamed */,
5757
});
58+
5859
this.config = config;
5960
}
6061

6162
private stylesConfig(
6263
id: string
6364
): JSXWithStyleElementConfig | JSXWithoutStyleElementConfig {
64-
return this.stylesConfigWidgetMap.get(id);
65+
return this.stylesMapper.map.get(id);
6566
}
6667

6768
private jsxBuilder(widget: JsxWidget) {

‎packages/builder-web-react/react-inline-css-widget/react-inline-css-module-builder.ts‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
} from "@web-builder/react-core";
99
import {
1010
buildJsx,
11-
getWidgetStylesConfigMap,
11+
StylesConfigMapBuilder,
1212
JSXWithoutStyleElementConfig,
1313
JSXWithStyleElementConfig,
1414
WidgetStyleConfigMap,
@@ -44,7 +44,7 @@ export class ReactInlineCssBuilder {
4444
private readonly widgetName: string;
4545
readonly config: react_config.ReactInlineCssConfig;
4646
private readonly namer: ScopedVariableNamer;
47-
private readonly stylesConfigWidgetMap: WidgetStyleConfigMap;
47+
private readonly stylesMapper: StylesConfigMapBuilder;
4848

4949
constructor({
5050
entry,
@@ -60,7 +60,8 @@ export class ReactInlineCssBuilder {
6060
entry.key.id,
6161
ReservedKeywordPlatformPresets.react
6262
);
63-
this.stylesConfigWidgetMap = getWidgetStylesConfigMap(entry, {
63+
64+
this.stylesMapper = new StylesConfigMapBuilder(entry, {
6465
namer: this.namer,
6566
rename_tag: false,
6667
});
@@ -69,7 +70,7 @@ export class ReactInlineCssBuilder {
6970
private stylesConfig(
7071
id: string
7172
): JSXWithStyleElementConfig | JSXWithoutStyleElementConfig {
72-
return this.stylesConfigWidgetMap.get(id);
73+
return this.stylesMapper.map.get(id);
7374
}
7475

7576
private jsxBuilder(widget: JsxWidget) {

‎packages/builder-web-react/react-styled-component-widget/react-styled-components-module-builder.ts‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ import { BlockStatement, Import, ImportDeclaration, Return } from "coli";
1515
import { JsxWidget } from "@web-builder/core";
1616
import {
1717
buildJsx,
18-
getWidgetStylesConfigMap,
18+
StylesConfigMapBuilder,
1919
WidgetStyleConfigMap,
2020
} from "@web-builder/core/builders";
2121
import { react as react_config } from "@designto/config";
@@ -24,7 +24,7 @@ import { StyledComponentDeclaration } from "@web-builder/styled/styled-component
2424
export class ReactStyledComponentsBuilder {
2525
private readonly entry: JsxWidget;
2626
private readonly widgetName: string;
27-
private readonly styledConfigWidgetMap: WidgetStyleConfigMap;
27+
private readonly stylesMapper: StylesConfigMapBuilder;
2828
private readonly namer: ScopedVariableNamer;
2929
readonly config: react_config.ReactStyledComponentsConfig;
3030

@@ -41,17 +41,19 @@ export class ReactStyledComponentsBuilder {
4141
entry.key.id,
4242
ReservedKeywordPlatformPresets.react
4343
);
44-
this.styledConfigWidgetMap = getWidgetStylesConfigMap(entry, {
44+
45+
this.stylesMapper = new StylesConfigMapBuilder(entry, {
4546
namer: this.namer,
4647
rename_tag: true /** styled component tag shoule be renamed */,
4748
});
49+
4850
this.config = config;
4951
}
5052

5153
private styledConfig(
5254
id: string
5355
): StyledComponentJSXElementConfig | NoStyleJSXElementConfig {
54-
return this.styledConfigWidgetMap.get(id);
56+
return this.stylesMapper.map.get(id);
5557
}
5658

5759
private jsxBuilder(widget: JsxWidget) {
@@ -89,11 +91,10 @@ export class ReactStyledComponentsBuilder {
8991
}
9092

9193
partDeclarations() {
92-
return Array.from(this.styledConfigWidgetMap.keys())
94+
return Array.from(this.stylesMapper.map.keys())
9395
.map((k) => {
94-
return (
95-
this.styledConfigWidgetMap.get(k) as StyledComponentJSXElementConfig
96-
).styledComponent;
96+
return (this.stylesMapper.map.get(k) as StyledComponentJSXElementConfig)
97+
.styledComponent;
9798
})
9899
.filter((s) => s);
99100
}

‎packages/builder-web-vanilla/export-inline-css-html-file/index.ts‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { ReservedKeywordPlatformPresets } from "@coli.codes/naming/reserved";
77
import { k, JsxWidget } from "@web-builder/core";
88
import {
99
buildJsx,
10-
getWidgetStylesConfigMap,
10+
StylesConfigMapBuilder,
1111
JSXWithoutStyleElementConfig,
1212
JSXWithStyleElementConfig,
1313
WidgetStyleConfigMap,
@@ -58,11 +58,13 @@ export function export_inlined_css_html_file(
5858
ReservedKeywordPlatformPresets.html
5959
);
6060

61-
const styles_map: WidgetStyleConfigMap = getWidgetStylesConfigMap(widget, {
61+
const mapper = new StylesConfigMapBuilder(widget, {
6262
namer: styledComponentNamer,
6363
rename_tag: false, // vanilla html tag will be preserved.
6464
});
6565

66+
const styles_map: WidgetStyleConfigMap = mapper.map;
67+
6668
function getStyleConfigById(
6769
id: string
6870
): JSXWithStyleElementConfig | JSXWithoutStyleElementConfig {

0 commit comments

Comments
 (0)