@webstudio-is/react-sdk 0.59.0 → 0.61.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 (163) hide show
  1. package/lib/app/custom-components/shared/remix-link.js +2 -2
  2. package/lib/app/index.js +0 -1
  3. package/lib/cjs/app/custom-components/shared/remix-link.js +2 -2
  4. package/lib/cjs/app/index.js +0 -1
  5. package/lib/cjs/components/__generated__/blockquote.props.js +5 -0
  6. package/lib/cjs/components/__generated__/body.props.js +5 -0
  7. package/lib/cjs/components/__generated__/bold.props.js +5 -0
  8. package/lib/cjs/components/__generated__/box.props.js +5 -0
  9. package/lib/cjs/components/__generated__/button.props.js +5 -1
  10. package/lib/cjs/components/__generated__/code.props.js +5 -0
  11. package/lib/cjs/components/__generated__/form.props.js +5 -0
  12. package/lib/cjs/components/__generated__/heading.props.js +5 -0
  13. package/lib/cjs/components/__generated__/image.props.js +5 -0
  14. package/lib/cjs/components/__generated__/input.props.js +11 -2
  15. package/lib/cjs/components/__generated__/italic.props.js +5 -0
  16. package/lib/cjs/components/__generated__/link-block.props.js +5 -1
  17. package/lib/cjs/components/__generated__/link.props.js +5 -1
  18. package/lib/cjs/components/__generated__/list-item.props.js +5 -0
  19. package/lib/cjs/components/__generated__/list.props.js +5 -0
  20. package/lib/cjs/components/__generated__/paragraph.props.js +5 -0
  21. package/lib/cjs/components/__generated__/rich-text-link.props.js +5 -1
  22. package/lib/cjs/components/__generated__/separator.props.js +5 -0
  23. package/lib/cjs/components/__generated__/span.props.js +5 -0
  24. package/lib/cjs/components/__generated__/subscript.props.js +5 -0
  25. package/lib/cjs/components/__generated__/superscript.props.js +5 -0
  26. package/lib/cjs/components/__generated__/text-block.props.js +5 -0
  27. package/lib/cjs/components/blockquote.ws.js +36 -48
  28. package/lib/cjs/components/body.ws.js +19 -24
  29. package/lib/cjs/components/button.ws.js +1 -1
  30. package/lib/cjs/components/code.ws.js +20 -28
  31. package/lib/cjs/components/component-meta.js +2 -1
  32. package/lib/cjs/components/form.ws.js +14 -7
  33. package/lib/cjs/components/heading.ws.js +1 -1
  34. package/lib/cjs/components/image.ws.js +8 -9
  35. package/lib/cjs/components/italic.ws.js +5 -5
  36. package/lib/cjs/components/link-block.ws.js +5 -5
  37. package/lib/cjs/components/link.js +1 -1
  38. package/lib/cjs/components/link.ws.js +9 -10
  39. package/lib/cjs/components/list-item.ws.js +1 -1
  40. package/lib/cjs/components/list.ws.js +22 -22
  41. package/lib/cjs/components/paragraph.ws.js +1 -1
  42. package/lib/cjs/components/separator.ws.js +20 -20
  43. package/lib/cjs/components/text-block.ws.js +6 -7
  44. package/lib/cjs/css/css.js +6 -9
  45. package/lib/cjs/css/normalize.js +166 -185
  46. package/lib/cjs/css/presets.js +14 -34
  47. package/lib/cjs/css/style-rules.js +17 -0
  48. package/lib/cjs/embed-template.js +160 -0
  49. package/lib/cjs/index.js +1 -0
  50. package/lib/components/__generated__/blockquote.props.js +5 -0
  51. package/lib/components/__generated__/body.props.js +5 -0
  52. package/lib/components/__generated__/bold.props.js +5 -0
  53. package/lib/components/__generated__/box.props.js +5 -0
  54. package/lib/components/__generated__/button.props.js +5 -1
  55. package/lib/components/__generated__/code.props.js +5 -0
  56. package/lib/components/__generated__/form.props.js +5 -0
  57. package/lib/components/__generated__/heading.props.js +5 -0
  58. package/lib/components/__generated__/image.props.js +5 -0
  59. package/lib/components/__generated__/input.props.js +11 -2
  60. package/lib/components/__generated__/italic.props.js +5 -0
  61. package/lib/components/__generated__/link-block.props.js +5 -1
  62. package/lib/components/__generated__/link.props.js +5 -1
  63. package/lib/components/__generated__/list-item.props.js +5 -0
  64. package/lib/components/__generated__/list.props.js +5 -0
  65. package/lib/components/__generated__/paragraph.props.js +5 -0
  66. package/lib/components/__generated__/rich-text-link.props.js +5 -1
  67. package/lib/components/__generated__/separator.props.js +5 -0
  68. package/lib/components/__generated__/span.props.js +5 -0
  69. package/lib/components/__generated__/subscript.props.js +5 -0
  70. package/lib/components/__generated__/superscript.props.js +5 -0
  71. package/lib/components/__generated__/text-block.props.js +5 -0
  72. package/lib/components/blockquote.ws.js +36 -48
  73. package/lib/components/body.ws.js +19 -24
  74. package/lib/components/button.ws.js +1 -1
  75. package/lib/components/code.ws.js +20 -28
  76. package/lib/components/component-meta.js +2 -1
  77. package/lib/components/form.ws.js +14 -7
  78. package/lib/components/heading.ws.js +1 -1
  79. package/lib/components/image.ws.js +8 -9
  80. package/lib/components/italic.ws.js +5 -5
  81. package/lib/components/link-block.ws.js +5 -5
  82. package/lib/components/link.js +1 -1
  83. package/lib/components/link.ws.js +9 -10
  84. package/lib/components/list-item.ws.js +1 -1
  85. package/lib/components/list.ws.js +22 -22
  86. package/lib/components/paragraph.ws.js +1 -1
  87. package/lib/components/separator.ws.js +20 -20
  88. package/lib/components/text-block.ws.js +6 -7
  89. package/lib/css/css.js +8 -11
  90. package/lib/css/normalize.js +166 -185
  91. package/lib/css/presets.js +14 -34
  92. package/lib/css/style-rules.js +17 -0
  93. package/lib/embed-template.js +140 -0
  94. package/lib/index.js +1 -0
  95. package/lib/types/app/index.d.ts +0 -1
  96. package/lib/types/components/box.stories.d.ts +2 -2
  97. package/lib/types/components/component-meta.d.ts +20 -5
  98. package/lib/types/components/components-utils.d.ts +1 -1
  99. package/lib/types/css/normalize.d.ts +8786 -2286
  100. package/lib/types/css/presets.d.ts +2 -38
  101. package/lib/types/css/style-rules.d.ts +11 -9
  102. package/lib/types/embed-template.d.ts +1725 -0
  103. package/lib/types/embed-template.test.d.ts +1 -0
  104. package/lib/types/index.d.ts +1 -0
  105. package/package.json +16 -19
  106. package/src/app/custom-components/shared/remix-link.tsx +2 -2
  107. package/src/app/index.ts +0 -1
  108. package/src/components/__generated__/blockquote.props.ts +5 -0
  109. package/src/components/__generated__/body.props.ts +5 -0
  110. package/src/components/__generated__/bold.props.ts +5 -0
  111. package/src/components/__generated__/box.props.ts +5 -0
  112. package/src/components/__generated__/button.props.ts +5 -1
  113. package/src/components/__generated__/code.props.ts +5 -0
  114. package/src/components/__generated__/form.props.ts +5 -0
  115. package/src/components/__generated__/heading.props.ts +5 -0
  116. package/src/components/__generated__/image.props.ts +5 -0
  117. package/src/components/__generated__/input.props.ts +11 -2
  118. package/src/components/__generated__/italic.props.ts +5 -0
  119. package/src/components/__generated__/link-block.props.ts +5 -1
  120. package/src/components/__generated__/link.props.ts +5 -1
  121. package/src/components/__generated__/list-item.props.ts +5 -0
  122. package/src/components/__generated__/list.props.ts +5 -0
  123. package/src/components/__generated__/paragraph.props.ts +5 -0
  124. package/src/components/__generated__/rich-text-link.props.ts +5 -1
  125. package/src/components/__generated__/separator.props.ts +5 -0
  126. package/src/components/__generated__/span.props.ts +5 -0
  127. package/src/components/__generated__/subscript.props.ts +5 -0
  128. package/src/components/__generated__/superscript.props.ts +5 -0
  129. package/src/components/__generated__/text-block.props.ts +5 -0
  130. package/src/components/blockquote.ws.tsx +42 -52
  131. package/src/components/body.ws.tsx +25 -32
  132. package/src/components/bold.ws.tsx +6 -3
  133. package/src/components/box.ws.ts +6 -3
  134. package/src/components/button.ws.tsx +7 -4
  135. package/src/components/code.ws.tsx +26 -32
  136. package/src/components/component-meta.ts +5 -3
  137. package/src/components/form.ws.tsx +19 -9
  138. package/src/components/heading.ws.tsx +7 -4
  139. package/src/components/image.ws.tsx +14 -12
  140. package/src/components/input.ws.tsx +6 -3
  141. package/src/components/italic.ws.tsx +11 -8
  142. package/src/components/link-block.ws.tsx +11 -8
  143. package/src/components/link.tsx +1 -1
  144. package/src/components/link.ws.tsx +15 -13
  145. package/src/components/list-item.ws.tsx +7 -4
  146. package/src/components/list.ws.tsx +28 -25
  147. package/src/components/paragraph.ws.tsx +7 -4
  148. package/src/components/separator.ws.tsx +26 -25
  149. package/src/components/span.ws.tsx +6 -3
  150. package/src/components/subscript.ws.tsx +6 -3
  151. package/src/components/superscript.ws.tsx +6 -3
  152. package/src/components/text-block.ws.tsx +12 -11
  153. package/src/css/css.ts +8 -11
  154. package/src/css/normalize.ts +165 -188
  155. package/src/css/presets.ts +15 -37
  156. package/src/css/style-rules.ts +24 -0
  157. package/src/embed-template.test.ts +210 -0
  158. package/src/embed-template.ts +187 -0
  159. package/src/index.ts +1 -0
  160. package/lib/app/handle-request.server.js +0 -16
  161. package/lib/cjs/app/handle-request.server.js +0 -36
  162. package/lib/types/app/handle-request.server.d.ts +0 -2
  163. package/src/app/handle-request.server.tsx +0 -21
package/lib/components/__generated__/list.props.js CHANGED
@@ -15,6 +15,7 @@ const props = {
15
15
  type: "boolean"
16
16
  },
17
17
  accessKey: { required: false, control: "text", type: "string" },
18
+ autoFocus: { required: false, control: "boolean", type: "boolean" },
18
19
  className: { required: false, control: "text", type: "string" },
19
20
  contentEditable: { required: false, control: "text", type: "string" },
20
21
  contextMenu: { required: false, control: "text", type: "string" },
@@ -23,6 +24,7 @@ const props = {
23
24
  hidden: { required: false, control: "boolean", type: "boolean" },
24
25
  id: { required: false, control: "text", type: "string" },
25
26
  lang: { required: false, control: "text", type: "string" },
27
+ nonce: { required: false, control: "text", type: "string" },
26
28
  placeholder: { required: false, control: "text", type: "string" },
27
29
  spellCheck: { required: false, control: "boolean", type: "boolean" },
28
30
  tabIndex: { required: false, control: "number", type: "number" },
@@ -35,11 +37,14 @@ const props = {
35
37
  radioGroup: { required: false, control: "text", type: "string" },
36
38
  role: { required: false, control: "text", type: "string" },
37
39
  about: { required: false, control: "text", type: "string" },
40
+ content: { required: false, control: "text", type: "string" },
38
41
  datatype: { required: false, control: "text", type: "string" },
39
42
  inlist: { required: false, control: "text", type: "string" },
40
43
  prefix: { required: false, control: "text", type: "string" },
41
44
  property: { required: false, control: "text", type: "string" },
45
+ rel: { required: false, control: "text", type: "string" },
42
46
  resource: { required: false, control: "text", type: "string" },
47
+ rev: { required: false, control: "text", type: "string" },
43
48
  typeof: { required: false, control: "text", type: "string" },
44
49
  vocab: { required: false, control: "text", type: "string" },
45
50
  autoCapitalize: { required: false, control: "text", type: "string" },
package/lib/components/__generated__/paragraph.props.js CHANGED
@@ -15,6 +15,7 @@ const props = {
15
15
  type: "boolean"
16
16
  },
17
17
  accessKey: { required: false, control: "text", type: "string" },
18
+ autoFocus: { required: false, control: "boolean", type: "boolean" },
18
19
  className: { required: false, control: "text", type: "string" },
19
20
  contentEditable: { required: false, control: "text", type: "string" },
20
21
  contextMenu: { required: false, control: "text", type: "string" },
@@ -23,6 +24,7 @@ const props = {
23
24
  hidden: { required: false, control: "boolean", type: "boolean" },
24
25
  id: { required: false, control: "text", type: "string" },
25
26
  lang: { required: false, control: "text", type: "string" },
27
+ nonce: { required: false, control: "text", type: "string" },
26
28
  placeholder: { required: false, control: "text", type: "string" },
27
29
  spellCheck: { required: false, control: "boolean", type: "boolean" },
28
30
  tabIndex: { required: false, control: "number", type: "number" },
@@ -35,11 +37,14 @@ const props = {
35
37
  radioGroup: { required: false, control: "text", type: "string" },
36
38
  role: { required: false, control: "text", type: "string" },
37
39
  about: { required: false, control: "text", type: "string" },
40
+ content: { required: false, control: "text", type: "string" },
38
41
  datatype: { required: false, control: "text", type: "string" },
39
42
  inlist: { required: false, control: "text", type: "string" },
40
43
  prefix: { required: false, control: "text", type: "string" },
41
44
  property: { required: false, control: "text", type: "string" },
45
+ rel: { required: false, control: "text", type: "string" },
42
46
  resource: { required: false, control: "text", type: "string" },
47
+ rev: { required: false, control: "text", type: "string" },
43
48
  typeof: { required: false, control: "text", type: "string" },
44
49
  vocab: { required: false, control: "text", type: "string" },
45
50
  autoCapitalize: { required: false, control: "text", type: "string" },
package/lib/components/__generated__/rich-text-link.props.js CHANGED
@@ -13,7 +13,6 @@ const props = {
13
13
  hrefLang: { required: false, control: "text", type: "string" },
14
14
  media: { required: false, control: "text", type: "string" },
15
15
  ping: { required: false, control: "text", type: "string" },
16
- rel: { required: false, control: "text", type: "string" },
17
16
  type: { required: false, control: "text", type: "string" },
18
17
  referrerPolicy: {
19
18
  required: false,
@@ -44,6 +43,7 @@ const props = {
44
43
  type: "boolean"
45
44
  },
46
45
  accessKey: { required: false, control: "text", type: "string" },
46
+ autoFocus: { required: false, control: "boolean", type: "boolean" },
47
47
  className: { required: false, control: "text", type: "string" },
48
48
  contentEditable: { required: false, control: "text", type: "string" },
49
49
  contextMenu: { required: false, control: "text", type: "string" },
@@ -52,6 +52,7 @@ const props = {
52
52
  hidden: { required: false, control: "boolean", type: "boolean" },
53
53
  id: { required: false, control: "text", type: "string" },
54
54
  lang: { required: false, control: "text", type: "string" },
55
+ nonce: { required: false, control: "text", type: "string" },
55
56
  placeholder: { required: false, control: "text", type: "string" },
56
57
  spellCheck: { required: false, control: "boolean", type: "boolean" },
57
58
  tabIndex: { required: false, control: "number", type: "number" },
@@ -64,11 +65,14 @@ const props = {
64
65
  radioGroup: { required: false, control: "text", type: "string" },
65
66
  role: { required: false, control: "text", type: "string" },
66
67
  about: { required: false, control: "text", type: "string" },
68
+ content: { required: false, control: "text", type: "string" },
67
69
  datatype: { required: false, control: "text", type: "string" },
68
70
  inlist: { required: false, control: "text", type: "string" },
69
71
  prefix: { required: false, control: "text", type: "string" },
70
72
  property: { required: false, control: "text", type: "string" },
73
+ rel: { required: false, control: "text", type: "string" },
71
74
  resource: { required: false, control: "text", type: "string" },
75
+ rev: { required: false, control: "text", type: "string" },
72
76
  typeof: { required: false, control: "text", type: "string" },
73
77
  vocab: { required: false, control: "text", type: "string" },
74
78
  autoCapitalize: { required: false, control: "text", type: "string" },
package/lib/components/__generated__/separator.props.js CHANGED
@@ -15,6 +15,7 @@ const props = {
15
15
  type: "boolean"
16
16
  },
17
17
  accessKey: { required: false, control: "text", type: "string" },
18
+ autoFocus: { required: false, control: "boolean", type: "boolean" },
18
19
  className: { required: false, control: "text", type: "string" },
19
20
  contentEditable: { required: false, control: "text", type: "string" },
20
21
  contextMenu: { required: false, control: "text", type: "string" },
@@ -23,6 +24,7 @@ const props = {
23
24
  hidden: { required: false, control: "boolean", type: "boolean" },
24
25
  id: { required: false, control: "text", type: "string" },
25
26
  lang: { required: false, control: "text", type: "string" },
27
+ nonce: { required: false, control: "text", type: "string" },
26
28
  placeholder: { required: false, control: "text", type: "string" },
27
29
  spellCheck: { required: false, control: "boolean", type: "boolean" },
28
30
  tabIndex: { required: false, control: "number", type: "number" },
@@ -35,11 +37,14 @@ const props = {
35
37
  radioGroup: { required: false, control: "text", type: "string" },
36
38
  role: { required: false, control: "text", type: "string" },
37
39
  about: { required: false, control: "text", type: "string" },
40
+ content: { required: false, control: "text", type: "string" },
38
41
  datatype: { required: false, control: "text", type: "string" },
39
42
  inlist: { required: false, control: "text", type: "string" },
40
43
  prefix: { required: false, control: "text", type: "string" },
41
44
  property: { required: false, control: "text", type: "string" },
45
+ rel: { required: false, control: "text", type: "string" },
42
46
  resource: { required: false, control: "text", type: "string" },
47
+ rev: { required: false, control: "text", type: "string" },
43
48
  typeof: { required: false, control: "text", type: "string" },
44
49
  vocab: { required: false, control: "text", type: "string" },
45
50
  autoCapitalize: { required: false, control: "text", type: "string" },
package/lib/components/__generated__/span.props.js CHANGED
@@ -15,6 +15,7 @@ const props = {
15
15
  type: "boolean"
16
16
  },
17
17
  accessKey: { required: false, control: "text", type: "string" },
18
+ autoFocus: { required: false, control: "boolean", type: "boolean" },
18
19
  className: { required: false, control: "text", type: "string" },
19
20
  contentEditable: { required: false, control: "text", type: "string" },
20
21
  contextMenu: { required: false, control: "text", type: "string" },
@@ -23,6 +24,7 @@ const props = {
23
24
  hidden: { required: false, control: "boolean", type: "boolean" },
24
25
  id: { required: false, control: "text", type: "string" },
25
26
  lang: { required: false, control: "text", type: "string" },
27
+ nonce: { required: false, control: "text", type: "string" },
26
28
  placeholder: { required: false, control: "text", type: "string" },
27
29
  spellCheck: { required: false, control: "boolean", type: "boolean" },
28
30
  tabIndex: { required: false, control: "number", type: "number" },
@@ -35,11 +37,14 @@ const props = {
35
37
  radioGroup: { required: false, control: "text", type: "string" },
36
38
  role: { required: false, control: "text", type: "string" },
37
39
  about: { required: false, control: "text", type: "string" },
40
+ content: { required: false, control: "text", type: "string" },
38
41
  datatype: { required: false, control: "text", type: "string" },
39
42
  inlist: { required: false, control: "text", type: "string" },
40
43
  prefix: { required: false, control: "text", type: "string" },
41
44
  property: { required: false, control: "text", type: "string" },
45
+ rel: { required: false, control: "text", type: "string" },
42
46
  resource: { required: false, control: "text", type: "string" },
47
+ rev: { required: false, control: "text", type: "string" },
43
48
  typeof: { required: false, control: "text", type: "string" },
44
49
  vocab: { required: false, control: "text", type: "string" },
45
50
  autoCapitalize: { required: false, control: "text", type: "string" },
package/lib/components/__generated__/subscript.props.js CHANGED
@@ -15,6 +15,7 @@ const props = {
15
15
  type: "boolean"
16
16
  },
17
17
  accessKey: { required: false, control: "text", type: "string" },
18
+ autoFocus: { required: false, control: "boolean", type: "boolean" },
18
19
  className: { required: false, control: "text", type: "string" },
19
20
  contentEditable: { required: false, control: "text", type: "string" },
20
21
  contextMenu: { required: false, control: "text", type: "string" },
@@ -23,6 +24,7 @@ const props = {
23
24
  hidden: { required: false, control: "boolean", type: "boolean" },
24
25
  id: { required: false, control: "text", type: "string" },
25
26
  lang: { required: false, control: "text", type: "string" },
27
+ nonce: { required: false, control: "text", type: "string" },
26
28
  placeholder: { required: false, control: "text", type: "string" },
27
29
  spellCheck: { required: false, control: "boolean", type: "boolean" },
28
30
  tabIndex: { required: false, control: "number", type: "number" },
@@ -35,11 +37,14 @@ const props = {
35
37
  radioGroup: { required: false, control: "text", type: "string" },
36
38
  role: { required: false, control: "text", type: "string" },
37
39
  about: { required: false, control: "text", type: "string" },
40
+ content: { required: false, control: "text", type: "string" },
38
41
  datatype: { required: false, control: "text", type: "string" },
39
42
  inlist: { required: false, control: "text", type: "string" },
40
43
  prefix: { required: false, control: "text", type: "string" },
41
44
  property: { required: false, control: "text", type: "string" },
45
+ rel: { required: false, control: "text", type: "string" },
42
46
  resource: { required: false, control: "text", type: "string" },
47
+ rev: { required: false, control: "text", type: "string" },
43
48
  typeof: { required: false, control: "text", type: "string" },
44
49
  vocab: { required: false, control: "text", type: "string" },
45
50
  autoCapitalize: { required: false, control: "text", type: "string" },
package/lib/components/__generated__/superscript.props.js CHANGED
@@ -15,6 +15,7 @@ const props = {
15
15
  type: "boolean"
16
16
  },
17
17
  accessKey: { required: false, control: "text", type: "string" },
18
+ autoFocus: { required: false, control: "boolean", type: "boolean" },
18
19
  className: { required: false, control: "text", type: "string" },
19
20
  contentEditable: { required: false, control: "text", type: "string" },
20
21
  contextMenu: { required: false, control: "text", type: "string" },
@@ -23,6 +24,7 @@ const props = {
23
24
  hidden: { required: false, control: "boolean", type: "boolean" },
24
25
  id: { required: false, control: "text", type: "string" },
25
26
  lang: { required: false, control: "text", type: "string" },
27
+ nonce: { required: false, control: "text", type: "string" },
26
28
  placeholder: { required: false, control: "text", type: "string" },
27
29
  spellCheck: { required: false, control: "boolean", type: "boolean" },
28
30
  tabIndex: { required: false, control: "number", type: "number" },
@@ -35,11 +37,14 @@ const props = {
35
37
  radioGroup: { required: false, control: "text", type: "string" },
36
38
  role: { required: false, control: "text", type: "string" },
37
39
  about: { required: false, control: "text", type: "string" },
40
+ content: { required: false, control: "text", type: "string" },
38
41
  datatype: { required: false, control: "text", type: "string" },
39
42
  inlist: { required: false, control: "text", type: "string" },
40
43
  prefix: { required: false, control: "text", type: "string" },
41
44
  property: { required: false, control: "text", type: "string" },
45
+ rel: { required: false, control: "text", type: "string" },
42
46
  resource: { required: false, control: "text", type: "string" },
47
+ rev: { required: false, control: "text", type: "string" },
43
48
  typeof: { required: false, control: "text", type: "string" },
44
49
  vocab: { required: false, control: "text", type: "string" },
45
50
  autoCapitalize: { required: false, control: "text", type: "string" },
package/lib/components/__generated__/text-block.props.js CHANGED
@@ -15,6 +15,7 @@ const props = {
15
15
  type: "boolean"
16
16
  },
17
17
  accessKey: { required: false, control: "text", type: "string" },
18
+ autoFocus: { required: false, control: "boolean", type: "boolean" },
18
19
  className: { required: false, control: "text", type: "string" },
19
20
  contentEditable: { required: false, control: "text", type: "string" },
20
21
  contextMenu: { required: false, control: "text", type: "string" },
@@ -23,6 +24,7 @@ const props = {
23
24
  hidden: { required: false, control: "boolean", type: "boolean" },
24
25
  id: { required: false, control: "text", type: "string" },
25
26
  lang: { required: false, control: "text", type: "string" },
27
+ nonce: { required: false, control: "text", type: "string" },
26
28
  placeholder: { required: false, control: "text", type: "string" },
27
29
  spellCheck: { required: false, control: "boolean", type: "boolean" },
28
30
  tabIndex: { required: false, control: "number", type: "number" },
@@ -35,11 +37,14 @@ const props = {
35
37
  radioGroup: { required: false, control: "text", type: "string" },
36
38
  role: { required: false, control: "text", type: "string" },
37
39
  about: { required: false, control: "text", type: "string" },
40
+ content: { required: false, control: "text", type: "string" },
38
41
  datatype: { required: false, control: "text", type: "string" },
39
42
  inlist: { required: false, control: "text", type: "string" },
40
43
  prefix: { required: false, control: "text", type: "string" },
41
44
  property: { required: false, control: "text", type: "string" },
45
+ rel: { required: false, control: "text", type: "string" },
42
46
  resource: { required: false, control: "text", type: "string" },
47
+ rev: { required: false, control: "text", type: "string" },
43
48
  typeof: { required: false, control: "text", type: "string" },
44
49
  vocab: { required: false, control: "text", type: "string" },
45
50
  autoCapitalize: { required: false, control: "text", type: "string" },
package/lib/components/blockquote.ws.js CHANGED
@@ -1,64 +1,52 @@
1
1
  import { BlockquoteIcon } from "@webstudio-is/icons";
2
2
  import { props } from "./__generated__/blockquote.props";
3
3
  const presetStyle = {
4
- blockquote: {
5
- marginTop: {
6
- type: "unit",
7
- value: 0,
8
- unit: "number"
4
+ blockquote: [
5
+ {
6
+ property: "marginTop",
7
+ value: { type: "unit", value: 0, unit: "number" }
9
8
  },
10
- marginRight: {
11
- type: "unit",
12
- value: 0,
13
- unit: "number"
9
+ {
10
+ property: "marginRight",
11
+ value: { type: "unit", value: 0, unit: "number" }
14
12
  },
15
- marginBottom: {
16
- type: "unit",
17
- value: 10,
18
- unit: "px"
13
+ {
14
+ property: "marginBottom",
15
+ value: { type: "unit", value: 10, unit: "px" }
19
16
  },
20
- marginLeft: {
21
- type: "unit",
22
- value: 0,
23
- unit: "number"
17
+ {
18
+ property: "marginLeft",
19
+ value: { type: "unit", value: 0, unit: "number" }
24
20
  },
25
- paddingTop: {
26
- type: "unit",
27
- value: 10,
28
- unit: "px"
21
+ {
22
+ property: "paddingTop",
23
+ value: { type: "unit", value: 10, unit: "px" }
29
24
  },
30
- paddingBottom: {
31
- type: "unit",
32
- value: 10,
33
- unit: "px"
25
+ {
26
+ property: "paddingBottom",
27
+ value: { type: "unit", value: 10, unit: "px" }
34
28
  },
35
- paddingLeft: {
36
- type: "unit",
37
- value: 20,
38
- unit: "px"
29
+ {
30
+ property: "paddingLeft",
31
+ value: { type: "unit", value: 20, unit: "px" }
39
32
  },
40
- paddingRight: {
41
- type: "unit",
42
- value: 20,
43
- unit: "px"
33
+ {
34
+ property: "paddingRight",
35
+ value: { type: "unit", value: 20, unit: "px" }
44
36
  },
45
- borderLeftWidth: {
46
- type: "unit",
47
- value: 5,
48
- unit: "px"
37
+ {
38
+ property: "borderLeftWidth",
39
+ value: { type: "unit", value: 5, unit: "px" }
49
40
  },
50
- borderLeftStyle: {
51
- type: "keyword",
52
- value: "solid"
41
+ {
42
+ property: "borderLeftStyle",
43
+ value: { type: "keyword", value: "solid" }
53
44
  },
54
- borderLeftColor: {
55
- type: "rgb",
56
- r: 226,
57
- g: 226,
58
- b: 226,
59
- alpha: 1
45
+ {
46
+ property: "borderLeftColor",
47
+ value: { type: "rgb", r: 226, g: 226, b: 226, alpha: 1 }
60
48
  }
61
- }
49
+ ]
62
50
  };
63
51
  const meta = {
64
52
  category: "typography",
@@ -66,7 +54,7 @@ const meta = {
66
54
  label: "Blockquote",
67
55
  Icon: BlockquoteIcon,
68
56
  presetStyle,
69
- children: ["Blockquote you can edit"]
57
+ children: [{ type: "text", value: "Blockquote you can edit" }]
70
58
  };
71
59
  const propsMeta = {
72
60
  props
package/lib/components/body.ws.js CHANGED
@@ -2,36 +2,31 @@ import { BodyIcon } from "@webstudio-is/icons";
2
2
  import { body } from "../css/normalize";
3
3
  import { props } from "./__generated__/body.props";
4
4
  const presetStyle = {
5
- body: {
5
+ body: [
6
6
  ...body,
7
- minHeight: {
8
- type: "unit",
9
- unit: "%",
10
- value: 100
7
+ {
8
+ property: "minHeight",
9
+ value: { type: "unit", unit: "%", value: 100 }
11
10
  },
12
- backgroundColor: {
13
- type: "keyword",
14
- value: "white"
11
+ {
12
+ property: "fontFamily",
13
+ value: { type: "keyword", value: "Arial" }
15
14
  },
16
- fontFamily: {
17
- type: "keyword",
18
- value: "Arial"
15
+ {
16
+ property: "fontSize",
17
+ value: { type: "unit", unit: "px", value: 14 }
19
18
  },
20
- fontSize: {
21
- type: "unit",
22
- unit: "px",
23
- value: 14
19
+ {
20
+ property: "lineHeight",
21
+ value: { type: "unit", unit: "number", value: 1.5 }
24
22
  },
25
- lineHeight: {
26
- type: "unit",
27
- unit: "number",
28
- value: 1.5
29
- },
30
- color: {
31
- type: "keyword",
32
- value: "#232323"
23
+ // temporary set root color
24
+ // until builder start to fallback "inherit" to black
25
+ {
26
+ property: "color",
27
+ value: { type: "keyword", value: "black" }
33
28
  }
34
- }
29
+ ]
35
30
  };
36
31
  const meta = {
37
32
  type: "container",
package/lib/components/button.ws.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { ButtonElementIcon } from "@webstudio-is/icons";
2
- import { props } from "./__generated__/button.props";
3
2
  import { button } from "../css/normalize";
3
+ import { props } from "./__generated__/button.props";
4
4
  const presetStyle = {
5
5
  button
6
6
  };
package/lib/components/code.ws.js CHANGED
@@ -2,38 +2,30 @@ import { CodeIcon } from "@webstudio-is/icons";
2
2
  import { displayVarNamespace } from "./code";
3
3
  import { props } from "./__generated__/code.props";
4
4
  import { code } from "../css/normalize";
5
- const display = {
6
- type: "var",
7
- value: displayVarNamespace,
8
- fallbacks: [
9
- {
10
- type: "keyword",
11
- value: "inline-block"
12
- }
13
- ]
14
- };
15
5
  const presetStyle = {
16
- code: {
6
+ code: [
17
7
  ...code,
18
- display,
19
- paddingLeft: {
20
- type: "unit",
21
- value: 0.2,
22
- unit: "em"
8
+ {
9
+ property: "display",
10
+ value: {
11
+ type: "var",
12
+ value: displayVarNamespace,
13
+ fallbacks: [{ type: "keyword", value: "inline-block" }]
14
+ }
23
15
  },
24
- paddingRight: {
25
- type: "unit",
26
- value: 0.2,
27
- unit: "em"
16
+ {
17
+ property: "paddingLeft",
18
+ value: { type: "unit", value: 0.2, unit: "em" }
19
+ },
20
+ {
21
+ property: "paddingRight",
22
+ value: { type: "unit", value: 0.2, unit: "em" }
28
23
  },
29
- backgroundColor: {
30
- type: "rgb",
31
- r: 238,
32
- g: 238,
33
- b: 238,
34
- alpha: 1
24
+ {
25
+ property: "backgroundColor",
26
+ value: { type: "rgb", r: 238, g: 238, b: 238, alpha: 1 }
35
27
  }
36
- }
28
+ ]
37
29
  };
38
30
  const meta = {
39
31
  category: "general",
@@ -41,7 +33,7 @@ const meta = {
41
33
  label: "Code",
42
34
  Icon: CodeIcon,
43
35
  presetStyle,
44
- children: ["Code you can edit"]
36
+ children: [{ type: "text", value: "Code you can edit" }]
45
37
  };
46
38
  const propsMeta = {
47
39
  props,
package/lib/components/component-meta.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import { z } from "zod";
2
2
  import { PropMeta } from "@webstudio-is/generate-arg-types";
3
+ import { WsEmbedTemplate } from "../embed-template";
3
4
  const WsComponentPropsMeta = z.object({
4
5
  props: z.record(PropMeta),
5
6
  initialProps: z.array(z.string()).optional()
@@ -32,7 +33,7 @@ const WsComponentMeta = z.object({
32
33
  Icon: z.function(),
33
34
  presetStyle: z.optional(z.any()),
34
35
  states: z.optional(z.array(ComponentState)),
35
- children: z.optional(z.array(z.string()))
36
+ children: z.optional(WsEmbedTemplate)
36
37
  });
37
38
  export {
38
39
  ComponentState,
package/lib/components/form.ws.js CHANGED
@@ -2,21 +2,28 @@ import { FormIcon } from "@webstudio-is/icons";
2
2
  import { form } from "../css/normalize";
3
3
  import { props } from "./__generated__/form.props";
4
4
  const presetStyle = {
5
- form: {
5
+ form: [
6
6
  ...form,
7
- minHeight: {
8
- type: "unit",
9
- unit: "px",
10
- value: 20
7
+ {
8
+ property: "minHeight",
9
+ value: { type: "unit", unit: "px", value: 20 }
11
10
  }
12
- }
11
+ ]
13
12
  };
14
13
  const meta = {
15
14
  category: "forms",
16
15
  type: "container",
17
16
  label: "Form",
18
17
  Icon: FormIcon,
19
- presetStyle
18
+ presetStyle,
19
+ children: [
20
+ { type: "instance", component: "Input", children: [] },
21
+ {
22
+ type: "instance",
23
+ component: "Button",
24
+ children: [{ type: "text", value: "Submit" }]
25
+ }
26
+ ]
20
27
  };
21
28
  const propsMeta = {
22
29
  props
package/lib/components/heading.ws.js CHANGED
@@ -14,7 +14,7 @@ const meta = {
14
14
  type: "rich-text",
15
15
  label: "Heading",
16
16
  Icon: HeadingIcon,
17
- children: ["Heading you can edit"],
17
+ children: [{ type: "text", value: "Heading you can edit" }],
18
18
  presetStyle
19
19
  };
20
20
  const propsMeta = {
package/lib/components/image.ws.js CHANGED
@@ -2,21 +2,20 @@ import { ImageIcon } from "@webstudio-is/icons";
2
2
  import { img } from "../css/normalize";
3
3
  import { props } from "./__generated__/image.props";
4
4
  const presetStyle = {
5
- img: {
5
+ img: [
6
6
  ...img,
7
7
  // Otherwise on new image insert onto canvas it can overfit screen size multiple times
8
- maxWidth: {
9
- type: "unit",
10
- unit: "%",
11
- value: 100
8
+ {
9
+ property: "maxWidth",
10
+ value: { type: "unit", unit: "%", value: 100 }
12
11
  },
13
12
  // inline | inline-block is not suitable because without line-height: 0 on the parent you get unsuitable spaces/margins
14
13
  // see https://stackoverflow.com/questions/24771194/is-the-margin-of-inline-block-4px-is-static-for-all-browsers
15
- display: {
16
- type: "keyword",
17
- value: "block"
14
+ {
15
+ property: "display",
16
+ value: { type: "keyword", value: "block" }
18
17
  }
19
- }
18
+ ]
20
19
  };
21
20
  const meta = {
22
21
  category: "media",
package/lib/components/italic.ws.js CHANGED
@@ -2,13 +2,13 @@ import { TextItalicIcon } from "@webstudio-is/icons";
2
2
  import { props } from "./__generated__/italic.props";
3
3
  import { i } from "../css/normalize";
4
4
  const presetStyle = {
5
- i: {
5
+ i: [
6
6
  ...i,
7
- fontStyle: {
8
- type: "keyword",
9
- value: "italic"
7
+ {
8
+ property: "fontStyle",
9
+ value: { type: "keyword", value: "italic" }
10
10
  }
11
- }
11
+ ]
12
12
  };
13
13
  const meta = {
14
14
  type: "rich-text-child",
package/lib/components/link-block.ws.js CHANGED
@@ -3,13 +3,13 @@ import { props } from "./__generated__/link-block.props";
3
3
  import { meta as linkMeta, propsMeta as linkPropsMeta } from "./link.ws";
4
4
  import { a } from "../css/normalize";
5
5
  const presetStyle = {
6
- a: {
6
+ a: [
7
7
  ...a,
8
- display: {
9
- type: "keyword",
10
- value: "inline-block"
8
+ {
9
+ property: "display",
10
+ value: { type: "keyword", value: "inline-block" }
11
11
  }
12
- }
12
+ ]
13
13
  };
14
14
  const meta = {
15
15
  category: "general",
package/lib/components/link.js CHANGED
@@ -9,7 +9,7 @@ const Link = forwardRef((props, ref) => {
9
9
  let url = "#";
10
10
  switch (href?.type) {
11
11
  case "page":
12
- url = href.page.path;
12
+ url = href.page.path === "" ? "/" : href.page.path;
13
13
  if (href.hash !== void 0) {
14
14
  url += `#${href.hash}`;
15
15
  }