@webstudio-is/css-engine 0.48.0 → 0.49.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/lib/cjs/core/to-value.cjs +6 -7
  2. package/lib/core/to-value.js +6 -7
  3. package/package.json +3 -3
  4. package/src/core/to-value.ts +6 -13
package/lib/cjs/core/to-value.cjs CHANGED
@@ -28,7 +28,7 @@ const defaultOptions = {
28
28
  const assertUnreachable = (_arg, errorMessage) => {
29
29
  throw new Error(errorMessage);
30
30
  };
31
- const toValue = (value, options = defaultOptions, isEditMode) => {
31
+ const toValue = (value, options = defaultOptions) => {
32
32
  if (value === void 0) {
33
33
  return "";
34
34
  }
@@ -47,10 +47,9 @@ const toValue = (value, options = defaultOptions, isEditMode) => {
47
47
  return [...value.value, import_fonts.DEFAULT_FONT_FALLBACK].join(", ");
48
48
  }
49
49
  if (value.type === "var") {
50
- const isEditMode2 = true;
51
50
  const fallbacks = [];
52
51
  for (const fallback of value.fallbacks) {
53
- fallbacks.push(toValue(fallback, options, isEditMode2));
52
+ fallbacks.push(toValue(fallback, options));
54
53
  }
55
54
  const fallbacksString = fallbacks.length > 0 ? `, ${fallbacks.join(", ")}` : "";
56
55
  return `var(--${value.value}${fallbacksString})`;
@@ -68,22 +67,22 @@ const toValue = (value, options = defaultOptions, isEditMode) => {
68
67
  return `rgba(${value.r}, ${value.g}, ${value.b}, ${value.alpha})`;
69
68
  }
70
69
  if (value.type === "image") {
71
- if (isEditMode && value.hidden) {
70
+ if (value.hidden) {
72
71
  return "none";
73
72
  }
74
73
  return `url(${value.value.value.path}) /* id=${value.value.value.id} */`;
75
74
  }
76
75
  if (value.type === "unparsed") {
77
- if (isEditMode && value.hidden) {
76
+ if (value.hidden) {
78
77
  return "none";
79
78
  }
80
79
  return value.value;
81
80
  }
82
81
  if (value.type === "layers") {
83
- return value.value.map((value2) => toValue(value2, options, isEditMode)).join(",");
82
+ return value.value.map((value2) => toValue(value2, options)).join(",");
84
83
  }
85
84
  if (value.type === "tuple") {
86
- return value.value.map((value2) => toValue(value2, options, isEditMode)).join(" ");
85
+ return value.value.map((value2) => toValue(value2, options)).join(" ");
87
86
  }
88
87
  assertUnreachable(value, `Unknown value type`);
89
88
  throw new Error("Unknown value type");
package/lib/core/to-value.js CHANGED
@@ -5,7 +5,7 @@ const defaultOptions = {
5
5
  const assertUnreachable = (_arg, errorMessage) => {
6
6
  throw new Error(errorMessage);
7
7
  };
8
- const toValue = (value, options = defaultOptions, isEditMode) => {
8
+ const toValue = (value, options = defaultOptions) => {
9
9
  if (value === void 0) {
10
10
  return "";
11
11
  }
@@ -24,10 +24,9 @@ const toValue = (value, options = defaultOptions, isEditMode) => {
24
24
  return [...value.value, DEFAULT_FONT_FALLBACK].join(", ");
25
25
  }
26
26
  if (value.type === "var") {
27
- const isEditMode2 = true;
28
27
  const fallbacks = [];
29
28
  for (const fallback of value.fallbacks) {
30
- fallbacks.push(toValue(fallback, options, isEditMode2));
29
+ fallbacks.push(toValue(fallback, options));
31
30
  }
32
31
  const fallbacksString = fallbacks.length > 0 ? `, ${fallbacks.join(", ")}` : "";
33
32
  return `var(--${value.value}${fallbacksString})`;
@@ -45,22 +44,22 @@ const toValue = (value, options = defaultOptions, isEditMode) => {
45
44
  return `rgba(${value.r}, ${value.g}, ${value.b}, ${value.alpha})`;
46
45
  }
47
46
  if (value.type === "image") {
48
- if (isEditMode && value.hidden) {
47
+ if (value.hidden) {
49
48
  return "none";
50
49
  }
51
50
  return `url(${value.value.value.path}) /* id=${value.value.value.id} */`;
52
51
  }
53
52
  if (value.type === "unparsed") {
54
- if (isEditMode && value.hidden) {
53
+ if (value.hidden) {
55
54
  return "none";
56
55
  }
57
56
  return value.value;
58
57
  }
59
58
  if (value.type === "layers") {
60
- return value.value.map((value2) => toValue(value2, options, isEditMode)).join(",");
59
+ return value.value.map((value2) => toValue(value2, options)).join(",");
61
60
  }
62
61
  if (value.type === "tuple") {
63
- return value.value.map((value2) => toValue(value2, options, isEditMode)).join(" ");
62
+ return value.value.map((value2) => toValue(value2, options)).join(" ");
64
63
  }
65
64
  assertUnreachable(value, `Unknown value type`);
66
65
  throw new Error("Unknown value type");
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webstudio-is/css-engine",
3
- "version": "0.48.0",
3
+ "version": "0.49.0",
4
4
  "description": "CSS Renderer for Webstudio",
5
5
  "author": "Webstudio <github@webstudio.is>",
6
6
  "homepage": "https://webstudio.is",
@@ -9,7 +9,7 @@
9
9
  "hyphenate-style-name": "^1.0.4",
10
10
  "react": "^17.0.2",
11
11
  "react-dom": "^17.0.2",
12
- "@webstudio-is/fonts": "^0.48.0"
12
+ "@webstudio-is/fonts": "^0.49.0"
13
13
  },
14
14
  "devDependencies": {
15
15
  "@jest/globals": "^29.3.1",
@@ -19,7 +19,7 @@
19
19
  "@types/react-dom": "^17.0.9",
20
20
  "jest": "^29.3.1",
21
21
  "typescript": "4.9.5",
22
- "@webstudio-is/css-data": "^0.48.0",
22
+ "@webstudio-is/css-data": "^0.49.0",
23
23
  "@webstudio-is/jest-config": "^1.0.2",
24
24
  "@webstudio-is/scripts": "^0.0.0",
25
25
  "@webstudio-is/storybook-config": "^0.0.0",
package/src/core/to-value.ts CHANGED
@@ -16,8 +16,7 @@ const assertUnreachable = (_arg: never, errorMessage: string) => {
16
16
 
17
17
  export const toValue = (
18
18
  value?: StyleValue,
19
- options: ToCssOptions = defaultOptions,
20
- isEditMode?: boolean
19
+ options: ToCssOptions = defaultOptions
21
20
  ): string => {
22
21
  if (value === undefined) {
23
22
  return "";
@@ -37,11 +36,9 @@ export const toValue = (
37
36
  return [...value.value, DEFAULT_FONT_FALLBACK].join(", ");
38
37
  }
39
38
  if (value.type === "var") {
40
- // We use var() in edit mode only
41
- const isEditMode = true;
42
39
  const fallbacks = [];
43
40
  for (const fallback of value.fallbacks) {
44
- fallbacks.push(toValue(fallback, options, isEditMode));
41
+ fallbacks.push(toValue(fallback, options));
45
42
  }
46
43
  const fallbacksString =
47
44
  fallbacks.length > 0 ? `, ${fallbacks.join(", ")}` : "";
@@ -65,7 +62,7 @@ export const toValue = (
65
62
  }
66
63
 
67
64
  if (value.type === "image") {
68
- if (isEditMode && value.hidden) {
65
+ if (value.hidden) {
69
66
  // We assume that property is background-image and use this to hide background layers
70
67
  // In the future we might want to have a more generic way to hide values
71
68
  // i.e. have knowledge about property-name, as none is property specific
@@ -77,7 +74,7 @@ export const toValue = (
77
74
  }
78
75
 
79
76
  if (value.type === "unparsed") {
80
- if (isEditMode && value.hidden) {
77
+ if (value.hidden) {
81
78
  // We assume that property is background-image and use this to hide background layers
82
79
  // In the future we might want to have a more generic way to hide values
83
80
  // i.e. have knowledge about property-name, as none is property specific
@@ -88,15 +85,11 @@ export const toValue = (
88
85
  }
89
86
 
90
87
  if (value.type === "layers") {
91
- return value.value
92
- .map((value) => toValue(value, options, isEditMode))
93
- .join(",");
88
+ return value.value.map((value) => toValue(value, options)).join(",");
94
89
  }
95
90
 
96
91
  if (value.type === "tuple") {
97
- return value.value
98
- .map((value) => toValue(value, options, isEditMode))
99
- .join(" ");
92
+ return value.value.map((value) => toValue(value, options)).join(" ");
100
93
  }
101
94
 
102
95
  // Will give ts error in case of missing type