@makeswift/runtime 0.21.3 → 0.22.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 (230) hide show
  1. package/dist/cjs/api/react.js +45 -0
  2. package/dist/cjs/api/react.js.map +1 -1
  3. package/dist/cjs/components/shared/Link/index.js +14 -69
  4. package/dist/cjs/components/shared/Link/index.js.map +1 -1
  5. package/dist/cjs/components/utils/responsive-style.js +2 -1
  6. package/dist/cjs/components/utils/responsive-style.js.map +1 -1
  7. package/dist/cjs/controls/link.js +46 -2
  8. package/dist/cjs/controls/link.js.map +1 -1
  9. package/dist/cjs/controls/rich-text/rich-text.js +12 -0
  10. package/dist/cjs/controls/rich-text/rich-text.js.map +1 -1
  11. package/dist/cjs/controls/rich-text-v2/rich-text-v2.js +12 -0
  12. package/dist/cjs/controls/rich-text-v2/rich-text-v2.js.map +1 -1
  13. package/dist/cjs/controls/slot.js +12 -0
  14. package/dist/cjs/controls/slot.js.map +1 -1
  15. package/dist/cjs/next/api-handler/handlers/manifest.js +1 -1
  16. package/dist/cjs/next/components/tests/controls/fixtures/rich-text-v2.js +203 -0
  17. package/dist/cjs/next/components/tests/controls/fixtures/rich-text-v2.js.map +1 -0
  18. package/dist/cjs/runtimes/react/components/ElementData.js +1 -1
  19. package/dist/cjs/runtimes/react/components/ElementData.js.map +1 -1
  20. package/dist/cjs/runtimes/react/controls/control.js +11 -156
  21. package/dist/cjs/runtimes/react/controls/control.js.map +1 -1
  22. package/dist/cjs/runtimes/react/controls/rich-text/EditableText/editable-text.js +1 -0
  23. package/dist/cjs/runtimes/react/controls/rich-text/EditableText/editable-text.js.map +1 -1
  24. package/dist/cjs/runtimes/react/controls/rich-text/rich-text.js +9 -3
  25. package/dist/cjs/runtimes/react/controls/rich-text/rich-text.js.map +1 -1
  26. package/dist/cjs/runtimes/react/controls/rich-text-v2/EditableTextV2/editable-text-v2.js +1 -0
  27. package/dist/cjs/runtimes/react/controls/rich-text-v2/EditableTextV2/editable-text-v2.js.map +1 -1
  28. package/dist/cjs/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.js +2 -2
  29. package/dist/cjs/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.js.map +1 -1
  30. package/dist/cjs/runtimes/react/controls/rich-text-v2/rich-text-v2.js +12 -9
  31. package/dist/cjs/runtimes/react/controls/rich-text-v2/rich-text-v2.js.map +1 -1
  32. package/dist/cjs/runtimes/react/controls/slot.js +5 -4
  33. package/dist/cjs/runtimes/react/controls/slot.js.map +1 -1
  34. package/dist/cjs/runtimes/react/controls/style.js +6 -47
  35. package/dist/cjs/runtimes/react/controls/style.js.map +1 -1
  36. package/dist/cjs/runtimes/react/controls/typography.js +49 -51
  37. package/dist/cjs/runtimes/react/controls/typography.js.map +1 -1
  38. package/dist/cjs/runtimes/react/controls.js +15 -111
  39. package/dist/cjs/runtimes/react/controls.js.map +1 -1
  40. package/dist/cjs/{utils/coalesce.js → runtimes/react/hooks/use-css-id.js} +13 -14
  41. package/dist/cjs/runtimes/react/hooks/use-css-id.js.map +1 -0
  42. package/dist/cjs/runtimes/react/hooks/use-resolved-props.js +85 -0
  43. package/dist/cjs/runtimes/react/hooks/use-resolved-props.js.map +1 -0
  44. package/dist/cjs/runtimes/react/hooks/use-resolved-value.js +9 -2
  45. package/dist/cjs/runtimes/react/hooks/use-resolved-value.js.map +1 -1
  46. package/dist/cjs/runtimes/react/hooks/use-resource-resolver.js +68 -0
  47. package/dist/cjs/runtimes/react/hooks/use-resource-resolver.js.map +1 -0
  48. package/dist/cjs/runtimes/react/hooks/use-stylesheet-factory.js +115 -0
  49. package/dist/cjs/runtimes/react/hooks/use-stylesheet-factory.js.map +1 -0
  50. package/dist/cjs/runtimes/react/resolvable-record.js +67 -0
  51. package/dist/cjs/runtimes/react/resolvable-record.js.map +1 -0
  52. package/dist/cjs/runtimes/react/use-style.js +20 -4
  53. package/dist/cjs/runtimes/react/use-style.js.map +1 -1
  54. package/dist/cjs/slate/TypographyPlugin/index.js +2 -1
  55. package/dist/cjs/slate/TypographyPlugin/index.js.map +1 -1
  56. package/dist/cjs/slate/TypographyPlugin/normalizeTypographyDown.js +2 -12
  57. package/dist/cjs/slate/TypographyPlugin/normalizeTypographyDown.js.map +1 -1
  58. package/dist/cjs/slate/index.js.map +1 -1
  59. package/dist/cjs/state/modules/breakpoints.js +7 -87
  60. package/dist/cjs/state/modules/breakpoints.js.map +1 -1
  61. package/dist/esm/api/react.js +45 -0
  62. package/dist/esm/api/react.js.map +1 -1
  63. package/dist/esm/components/shared/Link/index.js +14 -69
  64. package/dist/esm/components/shared/Link/index.js.map +1 -1
  65. package/dist/esm/components/utils/responsive-style.js +2 -3
  66. package/dist/esm/components/utils/responsive-style.js.map +1 -1
  67. package/dist/esm/controls/link.js +37 -2
  68. package/dist/esm/controls/link.js.map +1 -1
  69. package/dist/esm/controls/rich-text/rich-text.js +16 -1
  70. package/dist/esm/controls/rich-text/rich-text.js.map +1 -1
  71. package/dist/esm/controls/rich-text-v2/rich-text-v2.js +14 -1
  72. package/dist/esm/controls/rich-text-v2/rich-text-v2.js.map +1 -1
  73. package/dist/esm/controls/slot.js +14 -1
  74. package/dist/esm/controls/slot.js.map +1 -1
  75. package/dist/esm/next/api-handler/handlers/manifest.js +1 -1
  76. package/dist/esm/next/components/tests/controls/fixtures/rich-text-v2.js +179 -0
  77. package/dist/esm/next/components/tests/controls/fixtures/rich-text-v2.js.map +1 -0
  78. package/dist/esm/runtimes/react/components/ElementData.js +2 -2
  79. package/dist/esm/runtimes/react/components/ElementData.js.map +1 -1
  80. package/dist/esm/runtimes/react/controls/control.js +11 -175
  81. package/dist/esm/runtimes/react/controls/control.js.map +1 -1
  82. package/dist/esm/runtimes/react/controls/rich-text/EditableText/editable-text.js +1 -0
  83. package/dist/esm/runtimes/react/controls/rich-text/EditableText/editable-text.js.map +1 -1
  84. package/dist/esm/runtimes/react/controls/rich-text/rich-text.js +8 -2
  85. package/dist/esm/runtimes/react/controls/rich-text/rich-text.js.map +1 -1
  86. package/dist/esm/runtimes/react/controls/rich-text-v2/EditableTextV2/editable-text-v2.js +1 -0
  87. package/dist/esm/runtimes/react/controls/rich-text-v2/EditableTextV2/editable-text-v2.js.map +1 -1
  88. package/dist/esm/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.js +1 -1
  89. package/dist/esm/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.js.map +1 -1
  90. package/dist/esm/runtimes/react/controls/rich-text-v2/rich-text-v2.js +14 -9
  91. package/dist/esm/runtimes/react/controls/rich-text-v2/rich-text-v2.js.map +1 -1
  92. package/dist/esm/runtimes/react/controls/slot.js +4 -3
  93. package/dist/esm/runtimes/react/controls/slot.js.map +1 -1
  94. package/dist/esm/runtimes/react/controls/style.js +6 -37
  95. package/dist/esm/runtimes/react/controls/style.js.map +1 -1
  96. package/dist/esm/runtimes/react/controls/typography.js +49 -48
  97. package/dist/esm/runtimes/react/controls/typography.js.map +1 -1
  98. package/dist/esm/runtimes/react/controls.js +14 -129
  99. package/dist/esm/runtimes/react/controls.js.map +1 -1
  100. package/dist/esm/runtimes/react/hooks/use-css-id.js +8 -0
  101. package/dist/esm/runtimes/react/hooks/use-css-id.js.map +1 -0
  102. package/dist/esm/runtimes/react/hooks/use-resolved-props.js +53 -0
  103. package/dist/esm/runtimes/react/hooks/use-resolved-props.js.map +1 -0
  104. package/dist/esm/runtimes/react/hooks/use-resolved-value.js +9 -2
  105. package/dist/esm/runtimes/react/hooks/use-resolved-value.js.map +1 -1
  106. package/dist/esm/runtimes/react/hooks/use-resource-resolver.js +34 -0
  107. package/dist/esm/runtimes/react/hooks/use-resource-resolver.js.map +1 -0
  108. package/dist/esm/runtimes/react/hooks/use-stylesheet-factory.js +94 -0
  109. package/dist/esm/runtimes/react/hooks/use-stylesheet-factory.js.map +1 -0
  110. package/dist/esm/runtimes/react/resolvable-record.js +43 -0
  111. package/dist/esm/runtimes/react/resolvable-record.js.map +1 -0
  112. package/dist/esm/runtimes/react/use-style.js +17 -3
  113. package/dist/esm/runtimes/react/use-style.js.map +1 -1
  114. package/dist/esm/slate/TypographyPlugin/index.js +2 -1
  115. package/dist/esm/slate/TypographyPlugin/index.js.map +1 -1
  116. package/dist/esm/slate/TypographyPlugin/normalizeTypographyDown.js +1 -1
  117. package/dist/esm/slate/TypographyPlugin/normalizeTypographyDown.js.map +1 -1
  118. package/dist/esm/slate/index.js.map +1 -1
  119. package/dist/esm/state/modules/breakpoints.js +9 -70
  120. package/dist/esm/state/modules/breakpoints.js.map +1 -1
  121. package/dist/types/api/react.d.ts +11 -1
  122. package/dist/types/api/react.d.ts.map +1 -1
  123. package/dist/types/components/builtin/Button/Button.d.ts +2 -2
  124. package/dist/types/components/shared/Link/index.d.ts.map +1 -1
  125. package/dist/types/components/utils/responsive-style.d.ts +1 -1
  126. package/dist/types/components/utils/responsive-style.d.ts.map +1 -1
  127. package/dist/types/controls/link.d.ts +16 -2
  128. package/dist/types/controls/link.d.ts.map +1 -1
  129. package/dist/types/controls/rich-text/rich-text.d.ts +2 -1
  130. package/dist/types/controls/rich-text/rich-text.d.ts.map +1 -1
  131. package/dist/types/controls/rich-text-v2/rich-text-v2.d.ts +2 -1
  132. package/dist/types/controls/rich-text-v2/rich-text-v2.d.ts.map +1 -1
  133. package/dist/types/controls/slot.d.ts +2 -1
  134. package/dist/types/controls/slot.d.ts.map +1 -1
  135. package/dist/types/locale.d.ts +1 -1
  136. package/dist/types/next/components/tests/controls/fixtures/rich-text-v2.d.ts +40 -0
  137. package/dist/types/next/components/tests/controls/fixtures/rich-text-v2.d.ts.map +1 -0
  138. package/dist/types/next/components/tests/controls/rich-text-v2-control.test.d.ts +2 -0
  139. package/dist/types/next/components/tests/controls/rich-text-v2-control.test.d.ts.map +1 -0
  140. package/dist/types/runtimes/react/controls/control.d.ts +1 -1
  141. package/dist/types/runtimes/react/controls/control.d.ts.map +1 -1
  142. package/dist/types/runtimes/react/controls/rich-text/EditableText/editable-text.d.ts.map +1 -1
  143. package/dist/types/runtimes/react/controls/rich-text/rich-text.d.ts +1 -1
  144. package/dist/types/runtimes/react/controls/rich-text/rich-text.d.ts.map +1 -1
  145. package/dist/types/runtimes/react/controls/rich-text-v2/EditableTextV2/editable-text-v2.d.ts.map +1 -1
  146. package/dist/types/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.d.ts +3 -3
  147. package/dist/types/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.d.ts.map +1 -1
  148. package/dist/types/runtimes/react/controls/rich-text-v2/rich-text-v2.d.ts +1 -1
  149. package/dist/types/runtimes/react/controls/rich-text-v2/rich-text-v2.d.ts.map +1 -1
  150. package/dist/types/runtimes/react/controls/slot.d.ts +4 -1
  151. package/dist/types/runtimes/react/controls/slot.d.ts.map +1 -1
  152. package/dist/types/runtimes/react/controls/style.d.ts +4 -3
  153. package/dist/types/runtimes/react/controls/style.d.ts.map +1 -1
  154. package/dist/types/runtimes/react/controls/typography.d.ts +5 -6
  155. package/dist/types/runtimes/react/controls/typography.d.ts.map +1 -1
  156. package/dist/types/runtimes/react/controls.d.ts +1 -1
  157. package/dist/types/runtimes/react/controls.d.ts.map +1 -1
  158. package/dist/types/runtimes/react/hooks/use-css-id.d.ts +2 -0
  159. package/dist/types/runtimes/react/hooks/use-css-id.d.ts.map +1 -0
  160. package/dist/types/runtimes/react/hooks/use-resolved-props.d.ts +3 -0
  161. package/dist/types/runtimes/react/hooks/use-resolved-props.d.ts.map +1 -0
  162. package/dist/types/runtimes/react/hooks/use-resolved-value.d.ts +2 -2
  163. package/dist/types/runtimes/react/hooks/use-resolved-value.d.ts.map +1 -1
  164. package/dist/types/runtimes/react/hooks/use-resource-resolver.d.ts +3 -0
  165. package/dist/types/runtimes/react/hooks/use-resource-resolver.d.ts.map +1 -0
  166. package/dist/types/runtimes/react/hooks/use-stylesheet-factory.d.ts +7 -0
  167. package/dist/types/runtimes/react/hooks/use-stylesheet-factory.d.ts.map +1 -0
  168. package/dist/types/runtimes/react/resolvable-record.d.ts +3 -0
  169. package/dist/types/runtimes/react/resolvable-record.d.ts.map +1 -0
  170. package/dist/types/runtimes/react/use-style.d.ts +4 -0
  171. package/dist/types/runtimes/react/use-style.d.ts.map +1 -1
  172. package/dist/types/slate/BlockPlugin/index.d.ts +5 -5
  173. package/dist/types/slate/LinkPlugin/getValue.d.ts +1 -1
  174. package/dist/types/slate/LinkPlugin/index.d.ts +1 -1
  175. package/dist/types/slate/TypographyPlugin/index.d.ts.map +1 -1
  176. package/dist/types/slate/TypographyPlugin/normalizeTypographyDown.d.ts.map +1 -1
  177. package/dist/types/slate/index.d.ts +1 -0
  178. package/dist/types/slate/index.d.ts.map +1 -1
  179. package/dist/types/slate/test-helpers/slate-test-helper.d.ts +4 -4
  180. package/dist/types/slate/test-helpers/test-elements.d.ts +1 -1
  181. package/dist/types/state/modules/breakpoints.d.ts +2 -21
  182. package/dist/types/state/modules/breakpoints.d.ts.map +1 -1
  183. package/package.json +4 -4
  184. package/dist/cjs/runtimes/react/controls/color.js +0 -58
  185. package/dist/cjs/runtimes/react/controls/color.js.map +0 -1
  186. package/dist/cjs/runtimes/react/controls/image.js +0 -53
  187. package/dist/cjs/runtimes/react/controls/image.js.map +0 -1
  188. package/dist/cjs/runtimes/react/controls/link.js +0 -110
  189. package/dist/cjs/runtimes/react/controls/link.js.map +0 -1
  190. package/dist/cjs/runtimes/react/controls/list.js +0 -58
  191. package/dist/cjs/runtimes/react/controls/list.js.map +0 -1
  192. package/dist/cjs/runtimes/react/controls/shape.js +0 -44
  193. package/dist/cjs/runtimes/react/controls/shape.js.map +0 -1
  194. package/dist/cjs/runtimes/react/controls/style-v2.js +0 -92
  195. package/dist/cjs/runtimes/react/controls/style-v2.js.map +0 -1
  196. package/dist/cjs/utils/coalesce.js.map +0 -1
  197. package/dist/cjs/utils/shallowMerge.js +0 -44
  198. package/dist/cjs/utils/shallowMerge.js.map +0 -1
  199. package/dist/esm/runtimes/react/controls/color.js +0 -24
  200. package/dist/esm/runtimes/react/controls/color.js.map +0 -1
  201. package/dist/esm/runtimes/react/controls/image.js +0 -29
  202. package/dist/esm/runtimes/react/controls/image.js.map +0 -1
  203. package/dist/esm/runtimes/react/controls/link.js +0 -76
  204. package/dist/esm/runtimes/react/controls/link.js.map +0 -1
  205. package/dist/esm/runtimes/react/controls/list.js +0 -34
  206. package/dist/esm/runtimes/react/controls/list.js.map +0 -1
  207. package/dist/esm/runtimes/react/controls/shape.js +0 -20
  208. package/dist/esm/runtimes/react/controls/shape.js.map +0 -1
  209. package/dist/esm/runtimes/react/controls/style-v2.js +0 -72
  210. package/dist/esm/runtimes/react/controls/style-v2.js.map +0 -1
  211. package/dist/esm/utils/coalesce.js +0 -13
  212. package/dist/esm/utils/coalesce.js.map +0 -1
  213. package/dist/esm/utils/shallowMerge.js +0 -14
  214. package/dist/esm/utils/shallowMerge.js.map +0 -1
  215. package/dist/types/runtimes/react/controls/color.d.ts +0 -4
  216. package/dist/types/runtimes/react/controls/color.d.ts.map +0 -1
  217. package/dist/types/runtimes/react/controls/image.d.ts +0 -4
  218. package/dist/types/runtimes/react/controls/image.d.ts.map +0 -1
  219. package/dist/types/runtimes/react/controls/link.d.ts +0 -4
  220. package/dist/types/runtimes/react/controls/link.d.ts.map +0 -1
  221. package/dist/types/runtimes/react/controls/list.d.ts +0 -12
  222. package/dist/types/runtimes/react/controls/list.d.ts.map +0 -1
  223. package/dist/types/runtimes/react/controls/shape.d.ts +0 -12
  224. package/dist/types/runtimes/react/controls/shape.d.ts.map +0 -1
  225. package/dist/types/runtimes/react/controls/style-v2.d.ts +0 -13
  226. package/dist/types/runtimes/react/controls/style-v2.d.ts.map +0 -1
  227. package/dist/types/utils/coalesce.d.ts +0 -3
  228. package/dist/types/utils/coalesce.d.ts.map +0 -1
  229. package/dist/types/utils/shallowMerge.d.ts +0 -2
  230. package/dist/types/utils/shallowMerge.d.ts.map +0 -1
@@ -60,6 +60,13 @@ class MakeswiftHostApiClient {
60
60
  MakeswiftApiClient.fetchAPIResource(import_types.APIResourceType.Swatch, swatchId)
61
61
  );
62
62
  }
63
+ resolveSwatch(swatchId) {
64
+ return this.resolveResource(import_types.APIResourceType.Swatch, {
65
+ id: swatchId,
66
+ read: (id) => this.readSwatch(id),
67
+ fetch: (id) => this.fetchSwatch(id)
68
+ });
69
+ }
63
70
  readFile(fileId) {
64
71
  return MakeswiftApiClient.getAPIResource(
65
72
  this.makeswiftApiClient.getState(),
@@ -72,6 +79,13 @@ class MakeswiftHostApiClient {
72
79
  MakeswiftApiClient.fetchAPIResource(import_types.APIResourceType.File, fileId)
73
80
  );
74
81
  }
82
+ resolveFile(fileId) {
83
+ return this.resolveResource(import_types.APIResourceType.File, {
84
+ id: fileId,
85
+ read: (id) => this.readFile(id),
86
+ fetch: (id) => this.fetchFile(id)
87
+ });
88
+ }
75
89
  readTypography(typographyId) {
76
90
  return MakeswiftApiClient.getAPIResource(
77
91
  this.makeswiftApiClient.getState(),
@@ -84,6 +98,13 @@ class MakeswiftHostApiClient {
84
98
  MakeswiftApiClient.fetchAPIResource(import_types.APIResourceType.Typography, typographyId)
85
99
  );
86
100
  }
101
+ resolveTypography(typographyId) {
102
+ return this.resolveResource(import_types.APIResourceType.Typography, {
103
+ id: typographyId,
104
+ read: (id) => this.readTypography(id),
105
+ fetch: (id) => this.fetchTypography(id)
106
+ });
107
+ }
87
108
  readGlobalElement(globalElementId) {
88
109
  return MakeswiftApiClient.getAPIResource(
89
110
  this.makeswiftApiClient.getState(),
@@ -141,6 +162,30 @@ class MakeswiftHostApiClient {
141
162
  MakeswiftApiClient.fetchAPIResource(import_types.APIResourceType.PagePathnameSlice, pageId, this.locale)
142
163
  );
143
164
  }
165
+ resolvePagePathnameSlice(pageId) {
166
+ return this.resolveResource(import_types.APIResourceType.PagePathnameSlice, {
167
+ id: pageId,
168
+ read: (id) => this.readPagePathnameSlice(id),
169
+ fetch: (id) => this.fetchPagePathnameSlice(id)
170
+ });
171
+ }
172
+ resolveResource(type, {
173
+ id,
174
+ read,
175
+ fetch
176
+ }) {
177
+ const _read = () => id != null ? read(id) : null;
178
+ let lastValue = null;
179
+ return {
180
+ name: `${type}:${id}`,
181
+ readStable: () => lastValue = _read(),
182
+ subscribe: (onUpdate) => this.subscribe(() => {
183
+ if (_read() !== lastValue)
184
+ onUpdate();
185
+ }),
186
+ fetch: async () => id != null ? fetch(id) : null
187
+ };
188
+ }
144
189
  readTable(tableId) {
145
190
  return MakeswiftApiClient.getAPIResource(
146
191
  this.makeswiftApiClient.getState(),
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/api/react.ts"],"sourcesContent":["import * as MakeswiftApiClient from '../state/makeswift-api-client'\nimport {\n APIResourceType,\n File,\n GlobalElement,\n LocalizedGlobalElement,\n Page,\n PagePathnameSlice,\n Site,\n Snippet,\n Swatch,\n Table,\n Typography,\n} from './graphql/types'\nimport { GraphQLClient } from './graphql/client'\nimport { CreateTableRecordMutation } from './graphql/documents'\nimport {\n CreateTableRecordMutationResult,\n CreateTableRecordMutationVariables,\n} from './graphql/generated/types'\n\nexport type SerializedLocalizedResourcesMap = {\n [resourceId: string]: string | null\n}\n\ntype LocalizedResourcesMap = Map<string, string | null>\n\nexport type CacheData = MakeswiftApiClient.SerializedState\n\nexport type MakeswiftClientOptions = {\n uri: string\n cacheData?: CacheData\n localizedResourcesMap?: SerializedLocalizedResourcesMap\n locale?: Intl.Locale\n}\n\n/**\n * NOTE(miguel): This \"client\" is used to fetch Makeswift API resources needed for the host. For\n * example, swatches, files, typographies, etc. Ideally it's internal to the runtime and is only\n * used by controls to transform API references to API resources.\n *\n * Moreover, its use should be reserved for the builder only, since for live pages all Makeswift\n * API resources should be embedded in the \"page snapshot\". In the builder, this client serves the\n * purpose of sending requests for API resources and keeping a cache so that changes that happen in\n * the builder, like modifying a swatch, can be sent via `postMessage` to the host and the cache can\n * immediately update the value and re-render.\n *\n * Furthermore, the API resources requested shouldn't be requested directly from the Makeswift API\n * as that would require those resources to not be authenticated since the requests come from the\n * browser when running the host. Instead, the requests should go to the host directly, at the\n * Makeswift API endpoint (i.g., `/api/makeswift/[...makeswift]` dynamic route) where the host's\n * API key can be used, securely, in the server. For this reason, this client should really be a\n * client of the host's API, not Makeswift's, intended to build and continuously maintain a realtime\n * snapshot for use in the builder, not the lives pages.\n */\nexport class MakeswiftHostApiClient {\n graphqlClient: GraphQLClient\n makeswiftApiClient: MakeswiftApiClient.Store\n subscribe: MakeswiftApiClient.Store['subscribe']\n private localizedResourcesMap: LocalizedResourcesMap\n private locale: Intl.Locale | undefined\n\n constructor({ uri, cacheData, localizedResourcesMap = {}, locale }: MakeswiftClientOptions) {\n this.graphqlClient = new GraphQLClient(uri)\n this.makeswiftApiClient = MakeswiftApiClient.configureStore({ serializedState: cacheData })\n this.subscribe = this.makeswiftApiClient.subscribe\n this.localizedResourcesMap = new Map(Object.entries(localizedResourcesMap))\n this.locale = locale\n }\n\n readSwatch(swatchId: string): Swatch | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Swatch,\n swatchId,\n )\n }\n\n async fetchSwatch(swatchId: string): Promise<Swatch | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.Swatch, swatchId),\n )\n }\n\n readFile(fileId: string): File | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.File,\n fileId,\n )\n }\n\n async fetchFile(fileId: string): Promise<File | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.File, fileId),\n )\n }\n\n readTypography(typographyId: string): Typography | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Typography,\n typographyId,\n )\n }\n\n async fetchTypography(typographyId: string): Promise<Typography | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.Typography, typographyId),\n )\n }\n\n readGlobalElement(globalElementId: string): GlobalElement | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.GlobalElement,\n globalElementId,\n )\n }\n\n async fetchGlobalElement(globalElementId: string): Promise<GlobalElement | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.GlobalElement, globalElementId),\n )\n }\n\n readLocalizedGlobalElement(globalElementId: string): LocalizedGlobalElement | null {\n const localizedGlobalElementId = this.getLocalizedResourceId(globalElementId)\n\n if (localizedGlobalElementId == null) return null\n\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.LocalizedGlobalElement,\n localizedGlobalElementId,\n )\n }\n\n async fetchLocalizedGlobalElement(\n globalElementId: string,\n ): Promise<LocalizedGlobalElement | null> {\n const locale = this.locale\n\n if (locale == null) return null\n\n // If getLocalizedResourceId returns null, it means we have tried to fetch the resource,\n // but the resource is not available. If we haven't fetched it yet, it'll return undefined.\n const noLocalizedResource = this.getLocalizedResourceId(globalElementId) === null\n\n if (noLocalizedResource) return null\n\n // TODO(fikri): We're checking the cache here because the cache hit will fail on fetchAPIResource.\n // This is because in the cache we're saving the ID of the localizedGlobalElementId,\n // but we're reading the cache using the globalElementId.\n // This is very confusing and it can lead to more bugs. We need to refactor how we handle\n // localized global element.\n const cacheResult = this.readLocalizedGlobalElement(globalElementId)\n\n if (cacheResult) return cacheResult\n\n const result = await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(\n APIResourceType.LocalizedGlobalElement,\n globalElementId,\n locale,\n ),\n )\n\n this.setLocalizedResourceId({\n resourceId: globalElementId,\n localizedResourceId: result?.id ?? null,\n })\n\n return result\n }\n\n readPagePathnameSlice(pageId: string): PagePathnameSlice | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.PagePathnameSlice,\n pageId,\n )\n }\n\n async fetchPagePathnameSlice(pageId: string): Promise<PagePathnameSlice | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.PagePathnameSlice, pageId, this.locale),\n )\n }\n\n readTable(tableId: string): Table | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Table,\n tableId,\n )\n }\n\n async fetchTable(tableId: string): Promise<Table | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.Table, tableId),\n )\n }\n\n async createTableRecord(tableId: string, columns: any): Promise<void> {\n await this.graphqlClient.request<\n CreateTableRecordMutationResult,\n CreateTableRecordMutationVariables\n >(CreateTableRecordMutation, { input: { data: { tableId, columns } } })\n }\n\n readSite(siteId: string): Site | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Site,\n siteId,\n )\n }\n\n readPage(pageId: string): Page | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Page,\n pageId,\n )\n }\n\n readSnippet(snippetId: string): Snippet | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Snippet,\n snippetId,\n )\n }\n\n private getLocalizedResourceId(resourceId: string): string | undefined | null {\n return this.localizedResourcesMap?.get(resourceId)\n }\n\n setLocalizedResourceId({\n resourceId,\n localizedResourceId,\n }: {\n resourceId: string\n localizedResourceId: string | null\n }): void {\n this.localizedResourcesMap.set(resourceId, localizedResourceId)\n }\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../../../src/api/react.ts"],"sourcesContent":["import { type FetchableValue } from '@makeswift/controls'\nimport * as MakeswiftApiClient from '../state/makeswift-api-client'\nimport {\n APIResourceType,\n File,\n GlobalElement,\n LocalizedGlobalElement,\n Page,\n PagePathnameSlice,\n Site,\n Snippet,\n Swatch,\n Table,\n Typography,\n} from './graphql/types'\nimport { GraphQLClient } from './graphql/client'\nimport { CreateTableRecordMutation } from './graphql/documents'\nimport {\n CreateTableRecordMutationResult,\n CreateTableRecordMutationVariables,\n} from './graphql/generated/types'\n\nexport type SerializedLocalizedResourcesMap = {\n [resourceId: string]: string | null\n}\n\ntype LocalizedResourcesMap = Map<string, string | null>\n\nexport type CacheData = MakeswiftApiClient.SerializedState\n\nexport type MakeswiftClientOptions = {\n uri: string\n cacheData?: CacheData\n localizedResourcesMap?: SerializedLocalizedResourcesMap\n locale?: Intl.Locale\n}\n\n/**\n * NOTE(miguel): This \"client\" is used to fetch Makeswift API resources needed for the host. For\n * example, swatches, files, typographies, etc. Ideally it's internal to the runtime and is only\n * used by controls to transform API references to API resources.\n *\n * Moreover, its use should be reserved for the builder only, since for live pages all Makeswift\n * API resources should be embedded in the \"page snapshot\". In the builder, this client serves the\n * purpose of sending requests for API resources and keeping a cache so that changes that happen in\n * the builder, like modifying a swatch, can be sent via `postMessage` to the host and the cache can\n * immediately update the value and re-render.\n *\n * Furthermore, the API resources requested shouldn't be requested directly from the Makeswift API\n * as that would require those resources to not be authenticated since the requests come from the\n * browser when running the host. Instead, the requests should go to the host directly, at the\n * Makeswift API endpoint (i.g., `/api/makeswift/[...makeswift]` dynamic route) where the host's\n * API key can be used, securely, in the server. For this reason, this client should really be a\n * client of the host's API, not Makeswift's, intended to build and continuously maintain a realtime\n * snapshot for use in the builder, not the lives pages.\n */\nexport class MakeswiftHostApiClient {\n graphqlClient: GraphQLClient\n makeswiftApiClient: MakeswiftApiClient.Store\n subscribe: MakeswiftApiClient.Store['subscribe']\n private localizedResourcesMap: LocalizedResourcesMap\n private locale: Intl.Locale | undefined\n\n constructor({ uri, cacheData, localizedResourcesMap = {}, locale }: MakeswiftClientOptions) {\n this.graphqlClient = new GraphQLClient(uri)\n this.makeswiftApiClient = MakeswiftApiClient.configureStore({ serializedState: cacheData })\n this.subscribe = this.makeswiftApiClient.subscribe\n this.localizedResourcesMap = new Map(Object.entries(localizedResourcesMap))\n this.locale = locale\n }\n\n readSwatch(swatchId: string): Swatch | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Swatch,\n swatchId,\n )\n }\n\n async fetchSwatch(swatchId: string): Promise<Swatch | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.Swatch, swatchId),\n )\n }\n\n resolveSwatch(swatchId: string | undefined): FetchableValue<Swatch | null> {\n return this.resolveResource(APIResourceType.Swatch, {\n id: swatchId,\n read: id => this.readSwatch(id),\n fetch: id => this.fetchSwatch(id),\n })\n }\n\n readFile(fileId: string): File | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.File,\n fileId,\n )\n }\n\n async fetchFile(fileId: string): Promise<File | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.File, fileId),\n )\n }\n\n resolveFile(fileId: string | undefined): FetchableValue<File | null> {\n return this.resolveResource(APIResourceType.File, {\n id: fileId,\n read: id => this.readFile(id),\n fetch: id => this.fetchFile(id),\n })\n }\n\n readTypography(typographyId: string): Typography | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Typography,\n typographyId,\n )\n }\n\n async fetchTypography(typographyId: string): Promise<Typography | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.Typography, typographyId),\n )\n }\n\n resolveTypography(typographyId: string | undefined): FetchableValue<Typography | null> {\n return this.resolveResource(APIResourceType.Typography, {\n id: typographyId,\n read: id => this.readTypography(id),\n fetch: id => this.fetchTypography(id),\n })\n }\n\n readGlobalElement(globalElementId: string): GlobalElement | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.GlobalElement,\n globalElementId,\n )\n }\n\n async fetchGlobalElement(globalElementId: string): Promise<GlobalElement | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.GlobalElement, globalElementId),\n )\n }\n\n readLocalizedGlobalElement(globalElementId: string): LocalizedGlobalElement | null {\n const localizedGlobalElementId = this.getLocalizedResourceId(globalElementId)\n\n if (localizedGlobalElementId == null) return null\n\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.LocalizedGlobalElement,\n localizedGlobalElementId,\n )\n }\n\n async fetchLocalizedGlobalElement(\n globalElementId: string,\n ): Promise<LocalizedGlobalElement | null> {\n const locale = this.locale\n\n if (locale == null) return null\n\n // If getLocalizedResourceId returns null, it means we have tried to fetch the resource,\n // but the resource is not available. If we haven't fetched it yet, it'll return undefined.\n const noLocalizedResource = this.getLocalizedResourceId(globalElementId) === null\n\n if (noLocalizedResource) return null\n\n // TODO(fikri): We're checking the cache here because the cache hit will fail on fetchAPIResource.\n // This is because in the cache we're saving the ID of the localizedGlobalElementId,\n // but we're reading the cache using the globalElementId.\n // This is very confusing and it can lead to more bugs. We need to refactor how we handle\n // localized global element.\n const cacheResult = this.readLocalizedGlobalElement(globalElementId)\n\n if (cacheResult) return cacheResult\n\n const result = await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(\n APIResourceType.LocalizedGlobalElement,\n globalElementId,\n locale,\n ),\n )\n\n this.setLocalizedResourceId({\n resourceId: globalElementId,\n localizedResourceId: result?.id ?? null,\n })\n\n return result\n }\n\n readPagePathnameSlice(pageId: string): PagePathnameSlice | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.PagePathnameSlice,\n pageId,\n )\n }\n\n async fetchPagePathnameSlice(pageId: string): Promise<PagePathnameSlice | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.PagePathnameSlice, pageId, this.locale),\n )\n }\n\n resolvePagePathnameSlice(pageId: string | undefined): FetchableValue<PagePathnameSlice | null> {\n return this.resolveResource(APIResourceType.PagePathnameSlice, {\n id: pageId,\n read: id => this.readPagePathnameSlice(id),\n fetch: id => this.fetchPagePathnameSlice(id),\n })\n }\n\n resolveResource<R>(\n type: APIResourceType,\n {\n id,\n read,\n fetch,\n }: {\n id: string | undefined\n read: (id: string) => R | null\n fetch: (id: string) => Promise<R | null>\n },\n ): FetchableValue<R | null> {\n const _read = () => (id != null ? read(id) : null)\n let lastValue: R | null = null\n return {\n name: `${type}:${id}`,\n readStable: () => (lastValue = _read()),\n subscribe: (onUpdate: () => void) =>\n this.subscribe(() => {\n if (_read() !== lastValue) onUpdate()\n }),\n fetch: async () => (id != null ? fetch(id) : null),\n }\n }\n\n readTable(tableId: string): Table | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Table,\n tableId,\n )\n }\n\n async fetchTable(tableId: string): Promise<Table | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.Table, tableId),\n )\n }\n\n async createTableRecord(tableId: string, columns: any): Promise<void> {\n await this.graphqlClient.request<\n CreateTableRecordMutationResult,\n CreateTableRecordMutationVariables\n >(CreateTableRecordMutation, { input: { data: { tableId, columns } } })\n }\n\n readSite(siteId: string): Site | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Site,\n siteId,\n )\n }\n\n readPage(pageId: string): Page | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Page,\n pageId,\n )\n }\n\n readSnippet(snippetId: string): Snippet | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Snippet,\n snippetId,\n )\n }\n\n private getLocalizedResourceId(resourceId: string): string | undefined | null {\n return this.localizedResourcesMap?.get(resourceId)\n }\n\n setLocalizedResourceId({\n resourceId,\n localizedResourceId,\n }: {\n resourceId: string\n localizedResourceId: string | null\n }): void {\n this.localizedResourcesMap.set(resourceId, localizedResourceId)\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,yBAAoC;AACpC,mBAYO;AACP,oBAA8B;AAC9B,uBAA0C;AAwCnC,MAAM,uBAAuB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACQ;AAAA,EACA;AAAA,EAER,YAAY,EAAE,KAAK,WAAW,wBAAwB,CAAC,GAAG,OAAO,GAA2B;AAC1F,SAAK,gBAAgB,IAAI,4BAAc,GAAG;AAC1C,SAAK,qBAAqB,mBAAmB,eAAe,EAAE,iBAAiB,UAAU,CAAC;AAC1F,SAAK,YAAY,KAAK,mBAAmB;AACzC,SAAK,wBAAwB,IAAI,IAAI,OAAO,QAAQ,qBAAqB,CAAC;AAC1E,SAAK,SAAS;AAAA,EAChB;AAAA,EAEA,WAAW,UAAiC;AAC1C,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,YAAY,UAA0C;AAC1D,WAAO,MAAM,KAAK,mBAAmB;AAAA,MACnC,mBAAmB,iBAAiB,6BAAgB,QAAQ,QAAQ;AAAA,IACtE;AAAA,EACF;AAAA,EAEA,cAAc,UAA6D;AACzE,WAAO,KAAK,gBAAgB,6BAAgB,QAAQ;AAAA,MAClD,IAAI;AAAA,MACJ,MAAM,QAAM,KAAK,WAAW,EAAE;AAAA,MAC9B,OAAO,QAAM,KAAK,YAAY,EAAE;AAAA,IAClC,CAAC;AAAA,EACH;AAAA,EAEA,SAAS,QAA6B;AACpC,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,UAAU,QAAsC;AACpD,WAAO,MAAM,KAAK,mBAAmB;AAAA,MACnC,mBAAmB,iBAAiB,6BAAgB,MAAM,MAAM;AAAA,IAClE;AAAA,EACF;AAAA,EAEA,YAAY,QAAyD;AACnE,WAAO,KAAK,gBAAgB,6BAAgB,MAAM;AAAA,MAChD,IAAI;AAAA,MACJ,MAAM,QAAM,KAAK,SAAS,EAAE;AAAA,MAC5B,OAAO,QAAM,KAAK,UAAU,EAAE;AAAA,IAChC,CAAC;AAAA,EACH;AAAA,EAEA,eAAe,cAAyC;AACtD,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,gBAAgB,cAAkD;AACtE,WAAO,MAAM,KAAK,mBAAmB;AAAA,MACnC,mBAAmB,iBAAiB,6BAAgB,YAAY,YAAY;AAAA,IAC9E;AAAA,EACF;AAAA,EAEA,kBAAkB,cAAqE;AACrF,WAAO,KAAK,gBAAgB,6BAAgB,YAAY;AAAA,MACtD,IAAI;AAAA,MACJ,MAAM,QAAM,KAAK,eAAe,EAAE;AAAA,MAClC,OAAO,QAAM,KAAK,gBAAgB,EAAE;AAAA,IACtC,CAAC;AAAA,EACH;AAAA,EAEA,kBAAkB,iBAA+C;AAC/D,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,mBAAmB,iBAAwD;AAC/E,WAAO,MAAM,KAAK,mBAAmB;AAAA,MACnC,mBAAmB,iBAAiB,6BAAgB,eAAe,eAAe;AAAA,IACpF;AAAA,EACF;AAAA,EAEA,2BAA2B,iBAAwD;AACjF,UAAM,2BAA2B,KAAK,uBAAuB,eAAe;AAE5E,QAAI,4BAA4B;AAAM,aAAO;AAE7C,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,4BACJ,iBACwC;AACxC,UAAM,SAAS,KAAK;AAEpB,QAAI,UAAU;AAAM,aAAO;AAI3B,UAAM,sBAAsB,KAAK,uBAAuB,eAAe,MAAM;AAE7E,QAAI;AAAqB,aAAO;AAOhC,UAAM,cAAc,KAAK,2BAA2B,eAAe;AAEnE,QAAI;AAAa,aAAO;AAExB,UAAM,SAAS,MAAM,KAAK,mBAAmB;AAAA,MAC3C,mBAAmB;AAAA,QACjB,6BAAgB;AAAA,QAChB;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAEA,SAAK,uBAAuB;AAAA,MAC1B,YAAY;AAAA,MACZ,qBAAqB,QAAQ,MAAM;AAAA,IACrC,CAAC;AAED,WAAO;AAAA,EACT;AAAA,EAEA,sBAAsB,QAA0C;AAC9D,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,uBAAuB,QAAmD;AAC9E,WAAO,MAAM,KAAK,mBAAmB;AAAA,MACnC,mBAAmB,iBAAiB,6BAAgB,mBAAmB,QAAQ,KAAK,MAAM;AAAA,IAC5F;AAAA,EACF;AAAA,EAEA,yBAAyB,QAAsE;AAC7F,WAAO,KAAK,gBAAgB,6BAAgB,mBAAmB;AAAA,MAC7D,IAAI;AAAA,MACJ,MAAM,QAAM,KAAK,sBAAsB,EAAE;AAAA,MACzC,OAAO,QAAM,KAAK,uBAAuB,EAAE;AAAA,IAC7C,CAAC;AAAA,EACH;AAAA,EAEA,gBACE,MACA;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,EACF,GAK0B;AAC1B,UAAM,QAAQ,MAAO,MAAM,OAAO,KAAK,EAAE,IAAI;AAC7C,QAAI,YAAsB;AAC1B,WAAO;AAAA,MACL,MAAM,GAAG,IAAI,IAAI,EAAE;AAAA,MACnB,YAAY,MAAO,YAAY,MAAM;AAAA,MACrC,WAAW,CAAC,aACV,KAAK,UAAU,MAAM;AACnB,YAAI,MAAM,MAAM;AAAW,mBAAS;AAAA,MACtC,CAAC;AAAA,MACH,OAAO,YAAa,MAAM,OAAO,MAAM,EAAE,IAAI;AAAA,IAC/C;AAAA,EACF;AAAA,EAEA,UAAU,SAA+B;AACvC,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,WAAW,SAAwC;AACvD,WAAO,MAAM,KAAK,mBAAmB;AAAA,MACnC,mBAAmB,iBAAiB,6BAAgB,OAAO,OAAO;AAAA,IACpE;AAAA,EACF;AAAA,EAEA,MAAM,kBAAkB,SAAiB,SAA6B;AACpE,UAAM,KAAK,cAAc,QAGvB,4CAA2B,EAAE,OAAO,EAAE,MAAM,EAAE,SAAS,QAAQ,EAAE,EAAE,CAAC;AAAA,EACxE;AAAA,EAEA,SAAS,QAA6B;AACpC,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,SAAS,QAA6B;AACpC,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,YAAY,WAAmC;AAC7C,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEQ,uBAAuB,YAA+C;AAC5E,WAAO,KAAK,uBAAuB,IAAI,UAAU;AAAA,EACnD;AAAA,EAEA,uBAAuB;AAAA,IACrB;AAAA,IACA;AAAA,EACF,GAGS;AACP,SAAK,sBAAsB,IAAI,YAAY,mBAAmB;AAAA,EAChE;AACF;","names":[]}
@@ -1,4 +1,5 @@
1
1
  "use strict";
2
+ "use client";
2
3
  var __create = Object.create;
3
4
  var __defProp = Object.defineProperty;
4
5
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -33,10 +34,9 @@ __export(Link_exports, {
33
34
  module.exports = __toCommonJS(Link_exports);
34
35
  var import_jsx_runtime = require("react/jsx-runtime");
35
36
  var import_react = require("react");
36
- var import_scroll_into_view_if_needed = __toESM(require("scroll-into-view-if-needed"));
37
37
  var import_link = __toESM(require("next/link"));
38
- var import_use_element_id = require("../../../runtimes/react/hooks/use-element-id");
39
- var import_makeswift_api = require("../../../runtimes/react/hooks/makeswift-api");
38
+ var import_link2 = require("../../../controls/link");
39
+ var import_use_resolved_value = require("../../../runtimes/react/hooks/use-resolved-value");
40
40
  const isValidHref = (href) => {
41
41
  try {
42
42
  const bases = ["http://n", "https://n"];
@@ -48,79 +48,24 @@ const isValidHref = (href) => {
48
48
  };
49
49
  const Link = (0, import_react.forwardRef)(function Link2({ link, onClick = () => {
50
50
  }, ...restOfProps }, ref) {
51
- const pageId = link && link.type === "OPEN_PAGE" ? link.payload.pageId : null;
52
- const page = (0, import_makeswift_api.usePagePathnameSlice)(pageId ?? null);
53
- const elementKey = link?.type === "SCROLL_TO_ELEMENT" ? link.payload.elementIdConfig?.elementKey : null;
54
- const elementId = (0, import_use_element_id.useElementId)(elementKey);
55
- let useNextLink;
56
- let href;
57
- let target;
58
- let block;
59
- if (link) {
60
- switch (link.type) {
61
- case "OPEN_PAGE": {
62
- if (page) {
63
- useNextLink = true;
64
- href = `/${page.localizedPathname ?? page.pathname}`;
65
- }
66
- target = link.payload.openInNewTab ? "_blank" : "_self";
67
- break;
68
- }
69
- case "OPEN_URL": {
70
- useNextLink = isValidHref(link.payload.url);
71
- href = link.payload.url;
72
- target = link.payload.openInNewTab ? "_blank" : "_self";
73
- break;
74
- }
75
- case "SEND_EMAIL": {
76
- useNextLink = false;
77
- const { to, subject = "", body = "" } = link.payload;
78
- if (to != null)
79
- href = `mailto:${to}?subject=${subject}&body=${body}`;
80
- break;
81
- }
82
- case "CALL_PHONE": {
83
- useNextLink = false;
84
- href = `tel:${link.payload.phoneNumber}`;
85
- break;
86
- }
87
- case "SCROLL_TO_ELEMENT": {
88
- useNextLink = false;
89
- href = `#${elementId ?? ""}`;
90
- block = link.payload.block;
91
- break;
92
- }
93
- default:
94
- throw new RangeError(`Invalid link type "${link.type}."`);
95
- }
96
- }
51
+ const {
52
+ href,
53
+ target,
54
+ onClick: resolvedOnClick
55
+ } = (0, import_use_resolved_value.useResolvedValue)(
56
+ link,
57
+ (link2, resourceResolver) => (0, import_link2.Link)().resolveValue(link2, resourceResolver)
58
+ ) ?? {};
97
59
  function handleClick(event) {
98
60
  onClick(event);
99
61
  if (event.defaultPrevented)
100
62
  return;
101
63
  if (event.currentTarget.isContentEditable)
102
64
  return event.preventDefault();
103
- if (link && link.type === "SCROLL_TO_ELEMENT") {
104
- let hash;
105
- try {
106
- if (href != null)
107
- hash = new URL(`http://www.example.com/${href}`).hash;
108
- } catch (error) {
109
- console.error(`Link received invalid href: ${href}`, error);
110
- }
111
- if (href != null && hash != null && href === hash) {
112
- event.preventDefault();
113
- const view = event.view;
114
- (0, import_scroll_into_view_if_needed.default)(view.document.querySelector(hash), {
115
- behavior: "smooth",
116
- block
117
- });
118
- if (view.location.hash !== hash)
119
- view.history.pushState({}, "", hash);
120
- }
121
- }
65
+ return resolvedOnClick?.(event);
122
66
  }
123
- if (useNextLink && href != null) {
67
+ const useNextLink = href != null && link && (link.type === "OPEN_PAGE" || link.type === "OPEN_URL" && isValidHref(link.payload.url));
68
+ if (useNextLink) {
124
69
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
125
70
  import_link.default,
126
71
  {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/shared/Link/index.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, MouseEvent } from 'react'\nimport scrollIntoView from 'scroll-into-view-if-needed'\nimport NextLink from 'next/link'\n\nimport { LinkData } from '@makeswift/prop-controllers'\nimport { useElementId } from '../../../runtimes/react/hooks/use-element-id'\nimport { usePagePathnameSlice } from '../../../runtimes/react/hooks/makeswift-api'\n\ntype BaseProps = {\n link?: LinkData\n onClick?: (event: MouseEvent<HTMLAnchorElement>) => unknown\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'a'>, keyof BaseProps>\n\n// workaround for https://github.com/vercel/next.js/issues/66650\nconst isValidHref = (href: string) => {\n try {\n const bases = ['http://n', 'https://n']\n // - if `href` is a relative path, it will be resolved relative to the base URL\n // - if `href` is a full URL, the base URL will be ignored, even if there is a mismatch of protocols\n // - if `href` is an incomplete, protocol-only URL with a protocol that\n // conflicts with one of the base URL, this will throw\n bases.forEach(base => new URL(href, base))\n } catch (_) {\n return false\n }\n return true\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, Props>(function Link(\n { link, onClick = () => {}, ...restOfProps }: Props,\n ref,\n) {\n const pageId = link && link.type === 'OPEN_PAGE' ? link.payload.pageId : null\n const page = usePagePathnameSlice(pageId ?? null)\n\n const elementKey =\n link?.type === 'SCROLL_TO_ELEMENT' ? link.payload.elementIdConfig?.elementKey : null\n const elementId = useElementId(elementKey)\n\n // We don't want to use `next/link` with relative paths because Next.js will attempt to normalize\n // it and mess up the path.\n let useNextLink: boolean | undefined\n let href: string | undefined\n let target: '_blank' | '_self' | undefined\n let block: 'start' | 'center' | 'end' | undefined\n\n if (link) {\n switch (link.type) {\n case 'OPEN_PAGE': {\n if (page) {\n useNextLink = true\n\n href = `/${page.localizedPathname ?? page.pathname}`\n }\n\n target = link.payload.openInNewTab ? '_blank' : '_self'\n\n break\n }\n\n case 'OPEN_URL': {\n useNextLink = isValidHref(link.payload.url)\n\n href = link.payload.url\n\n target = link.payload.openInNewTab ? '_blank' : '_self'\n\n break\n }\n\n case 'SEND_EMAIL': {\n useNextLink = false\n\n const { to, subject = '', body = '' } = link.payload\n\n if (to != null) href = `mailto:${to}?subject=${subject}&body=${body}`\n\n break\n }\n\n case 'CALL_PHONE': {\n useNextLink = false\n\n href = `tel:${link.payload.phoneNumber}`\n\n break\n }\n\n case 'SCROLL_TO_ELEMENT': {\n useNextLink = false\n\n href = `#${elementId ?? ''}`\n\n block = link.payload.block\n\n break\n }\n\n default:\n throw new RangeError(`Invalid link type \"${(link as any).type}.\"`)\n }\n }\n\n function handleClick(event: MouseEvent<HTMLAnchorElement>) {\n onClick(event)\n\n if (event.defaultPrevented) return\n\n /**\n * When we introduced `next/link` instead of just `a` element slate no longer prevented link from navigating within\n * content mode. This is a hack to compensate for what would be expected as slate's default behavior.\n * On upgrade of slate this can be reevaluated.\n */\n if (event.currentTarget.isContentEditable) return event.preventDefault()\n\n if (link && link.type === 'SCROLL_TO_ELEMENT') {\n let hash: string | undefined\n\n try {\n if (href != null) hash = new URL(`http://www.example.com/${href}`).hash\n } catch (error) {\n console.error(`Link received invalid href: ${href}`, error)\n }\n\n if (href != null && hash != null && href === hash) {\n event.preventDefault()\n const view = event.view as unknown as Window\n\n scrollIntoView(view.document.querySelector(hash)!, {\n behavior: 'smooth',\n block,\n })\n\n if (view.location.hash !== hash) view.history.pushState({}, '', hash)\n }\n }\n }\n\n if (useNextLink && href != null) {\n return (\n <NextLink\n {...restOfProps}\n ref={ref}\n target={target}\n onClick={handleClick}\n href={href}\n locale={false}\n // Next.js v12 has legacyBehavior set to true by default\n legacyBehavior={false}\n />\n )\n }\n\n // eslint-disable-next-line\n return <a {...restOfProps} ref={ref} href={href} target={target} onClick={handleClick} />\n})\n"],"mappings":"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","names":["Link","scrollIntoView","NextLink"]}
1
+ {"version":3,"sources":["../../../../../src/components/shared/Link/index.tsx"],"sourcesContent":["'use client'\n\nimport { ComponentPropsWithoutRef, forwardRef, MouseEvent } from 'react'\nimport NextLink from 'next/link'\n\nimport { LinkData } from '@makeswift/prop-controllers'\n\nimport { Link as LinkDef } from '../../../controls/link'\nimport { useResolvedValue } from '../../../runtimes/react/hooks/use-resolved-value'\n\ntype BaseProps = {\n link?: LinkData\n onClick?: (event: MouseEvent<HTMLAnchorElement>) => unknown\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'a'>, keyof BaseProps>\n\n// workaround for https://github.com/vercel/next.js/issues/66650\nconst isValidHref = (href: string) => {\n try {\n const bases = ['http://n', 'https://n']\n // - if `href` is a relative path, it will be resolved relative to the base URL\n // - if `href` is a full URL, the base URL will be ignored, even if there is a mismatch of protocols\n // - if `href` is an incomplete, protocol-only URL with a protocol that\n // conflicts with one of the base URL, this will throw\n bases.forEach(base => new URL(href, base))\n } catch (_) {\n return false\n }\n return true\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, Props>(function Link(\n { link, onClick = () => {}, ...restOfProps }: Props,\n ref,\n) {\n const {\n href,\n target,\n onClick: resolvedOnClick,\n } = useResolvedValue(link, (link, resourceResolver) =>\n LinkDef().resolveValue(link, resourceResolver),\n ) ?? {}\n\n function handleClick(event: MouseEvent<HTMLAnchorElement>) {\n onClick(event)\n\n if (event.defaultPrevented) return\n\n /**\n * When we introduced `next/link` instead of just `a` element slate no longer prevented link from navigating within\n * content mode. This is a hack to compensate for what would be expected as slate's default behavior.\n * On upgrade of slate this can be reevaluated.\n */\n if (event.currentTarget.isContentEditable) return event.preventDefault()\n\n return resolvedOnClick?.(event)\n }\n\n const useNextLink =\n href != null &&\n link &&\n (link.type === 'OPEN_PAGE' || (link.type === 'OPEN_URL' && isValidHref(link.payload.url)))\n\n if (useNextLink) {\n return (\n <NextLink\n {...restOfProps}\n ref={ref}\n target={target}\n onClick={handleClick}\n href={href}\n locale={false}\n // Next.js v12 has legacyBehavior set to true by default\n legacyBehavior={false}\n />\n )\n }\n\n // eslint-disable-next-line\n return <a {...restOfProps} ref={ref} href={href} target={target} onClick={handleClick} />\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkEM;AAhEN,mBAAiE;AACjE,kBAAqB;AAIrB,IAAAA,eAAgC;AAChC,gCAAiC;AAUjC,MAAM,cAAc,CAAC,SAAiB;AACpC,MAAI;AACF,UAAM,QAAQ,CAAC,YAAY,WAAW;AAKtC,UAAM,QAAQ,UAAQ,IAAI,IAAI,MAAM,IAAI,CAAC;AAAA,EAC3C,SAAS,GAAG;AACV,WAAO;AAAA,EACT;AACA,SAAO;AACT;AAEO,MAAM,WAAO,yBAAqC,SAASC,MAChE,EAAE,MAAM,UAAU,MAAM;AAAC,GAAG,GAAG,YAAY,GAC3C,KACA;AACA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EACX,QAAI;AAAA,IAAiB;AAAA,IAAM,CAACC,OAAM,yBAChC,aAAAC,MAAQ,EAAE,aAAaD,OAAM,gBAAgB;AAAA,EAC/C,KAAK,CAAC;AAEN,WAAS,YAAY,OAAsC;AACzD,YAAQ,KAAK;AAEb,QAAI,MAAM;AAAkB;AAO5B,QAAI,MAAM,cAAc;AAAmB,aAAO,MAAM,eAAe;AAEvE,WAAO,kBAAkB,KAAK;AAAA,EAChC;AAEA,QAAM,cACJ,QAAQ,QACR,SACC,KAAK,SAAS,eAAgB,KAAK,SAAS,cAAc,YAAY,KAAK,QAAQ,GAAG;AAEzF,MAAI,aAAa;AACf,WACE;AAAA,MAAC,YAAAE;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA,SAAS;AAAA,QACT;AAAA,QACA,QAAQ;AAAA,QAER,gBAAgB;AAAA;AAAA,IAClB;AAAA,EAEJ;AAGA,SAAO,4CAAC,OAAG,GAAG,aAAa,KAAU,MAAY,QAAgB,SAAS,aAAa;AACzF,CAAC;","names":["import_link","Link","link","LinkDef","NextLink"]}
@@ -37,6 +37,7 @@ __export(responsive_style_exports, {
37
37
  useResponsiveWidth: () => useResponsiveWidth
38
38
  });
39
39
  module.exports = __toCommonJS(responsive_style_exports);
40
+ var import_controls = require("@makeswift/controls");
40
41
  var import_breakpoints = require("../../state/modules/breakpoints");
41
42
  var import_use_breakpoints = require("../../runtimes/react/hooks/use-breakpoints");
42
43
  var import_columns = require("./columns");
@@ -46,7 +47,7 @@ var import_border_radius = require("../../css/border-radius");
46
47
  var import_border = require("../../css/border");
47
48
  var import_colorToString = require("./colorToString");
48
49
  function responsiveStyle(breakpoints, responsiveValues, join, strategy) {
49
- return (0, import_breakpoints.join)(breakpoints, responsiveValues, join, strategy).reduce(
50
+ return (0, import_controls.join)(breakpoints, responsiveValues, join, strategy).reduce(
50
51
  (acc, { deviceId, value }) => {
51
52
  const breakpoint = (0, import_breakpoints.getBreakpoint)(breakpoints, deviceId);
52
53
  const mediaQuery = (0, import_breakpoints.getBreakpointMediaQuery)(breakpoint);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/utils/responsive-style.ts"],"sourcesContent":["import { WidthProperty } from 'csstype'\nimport { CSSObject } from '@emotion/css'\n\nimport type { ResponsiveValueType as ExtractResponsiveValue } from '@makeswift/controls'\n\nimport type {\n LengthData,\n ResponsiveBorderRadiusData,\n ResponsiveMarginData,\n ResponsivePaddingData,\n ResponsiveValue,\n ResponsiveLengthData,\n ResponsiveTextStyleData,\n} from '@makeswift/prop-controllers'\n\nimport {\n FallbackStrategy,\n getBreakpoint,\n getBreakpointMediaQuery,\n join as joinResponsiveValues,\n Breakpoints,\n} from '../../state/modules/breakpoints'\n\nimport { useBreakpoints } from '../../runtimes/react/hooks/use-breakpoints'\n\nimport { getIndexes } from './columns'\nimport { PaddingPropertyData, paddingPropertyDataToStyle } from '../../css/padding'\nimport { MarginPropertyData, marginPropertyDataToStyle } from '../../css/margin'\nimport { BorderRadiusPropertyData, borderRadiusPropertyDataToStyle } from '../../css/border-radius'\nimport { BorderPropertyData, borderPropertyDataToStyle } from '../../css/border'\nimport { BorderPropControllerData } from '../hooks/useBorder'\nimport { colorToString } from './colorToString'\nimport { BoxShadow, ResponsiveBoxShadow } from '../hooks'\nimport { DropFirst } from './drop-first'\n\nexport function responsiveStyle<V, A extends ReadonlyArray<ResponsiveValue<V> | null | undefined>>(\n breakpoints: Breakpoints,\n responsiveValues: A,\n join: (values: { [K in keyof A]: ExtractResponsiveValue<A[K]> | undefined }) => CSSObject,\n strategy?: FallbackStrategy<V>,\n): CSSObject {\n return joinResponsiveValues(breakpoints, responsiveValues, join, strategy).reduce(\n (acc, { deviceId, value }) => {\n const breakpoint = getBreakpoint(breakpoints, deviceId)\n const mediaQuery = getBreakpointMediaQuery(breakpoint)\n\n return {\n ...acc,\n [mediaQuery]: {\n ...(acc[mediaQuery] as CSSObject),\n ...value,\n },\n }\n },\n {} as CSSObject,\n )\n}\n\nexport function useResponsiveStyle<\n V,\n A extends ReadonlyArray<ResponsiveValue<V> | null | undefined>,\n>(\n responsiveValues: A,\n join: (values: { [K in keyof A]: ExtractResponsiveValue<A[K]> | undefined }) => CSSObject,\n strategy?: FallbackStrategy<V>,\n): CSSObject {\n return responsiveStyle(useBreakpoints(), responsiveValues, join, strategy)\n}\n\nexport function responsiveWidth(\n breakpoints: Breakpoints,\n widthData: ResponsiveLengthData | undefined,\n defaultValue: LengthData | WidthProperty<string | number> = '100%',\n): CSSObject {\n return {\n maxWidth: '100%',\n ...responsiveStyle(breakpoints, [widthData], ([width = defaultValue]) => ({\n width: typeof width === 'object' ? `${width.value}${width.unit}` : width,\n })),\n }\n}\n\nexport function useResponsiveWidth(\n ...args: DropFirst<Parameters<typeof responsiveWidth>>\n): CSSObject {\n return responsiveWidth(useBreakpoints(), ...args)\n}\n\nexport function responsivePadding(\n breakpoints: Breakpoints,\n paddingData: ResponsivePaddingData | undefined,\n defaultValue: PaddingPropertyData = {} as PaddingPropertyData,\n): CSSObject {\n return responsiveStyle(breakpoints, [paddingData], ([padding = {} as PaddingPropertyData]) =>\n paddingPropertyDataToStyle(\n padding,\n Object.assign(\n { paddingTop: 0, paddingRight: 0, paddingBottom: 0, paddingLeft: 0 },\n defaultValue,\n ),\n ),\n )\n}\n\nexport function useResponsivePadding(\n ...args: DropFirst<Parameters<typeof responsivePadding>>\n): CSSObject {\n return responsivePadding(useBreakpoints(), ...args)\n}\n\nexport function responsiveMargin(\n breakpoints: Breakpoints,\n marginData: ResponsiveMarginData | undefined,\n defaultValue: MarginPropertyData = {} as MarginPropertyData,\n): CSSObject {\n return responsiveStyle(breakpoints, [marginData], ([margin = {} as MarginPropertyData]) =>\n marginPropertyDataToStyle(\n margin,\n Object.assign(\n { marginTop: 0, marginRight: 'auto', marginBottom: 0, marginLeft: 'auto' },\n defaultValue,\n ),\n ),\n )\n}\n\nexport function useResponsiveMargin(\n ...args: DropFirst<Parameters<typeof responsiveMargin>>\n): CSSObject {\n return responsiveMargin(useBreakpoints(), ...args)\n}\n\nexport function responsiveBorderRadius(\n breakpoints: Breakpoints,\n borderRadiusData: ResponsiveBorderRadiusData | undefined,\n defaultValue: BorderRadiusPropertyData = {} as BorderRadiusPropertyData,\n): CSSObject {\n return responsiveStyle(breakpoints, [borderRadiusData], ([borderRadius = {}]) =>\n borderRadiusPropertyDataToStyle(\n borderRadius,\n Object.assign(\n {\n borderTopLeftRadius: 0,\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n borderBottomLeftRadius: 0,\n },\n defaultValue,\n ),\n ),\n )\n}\n\nexport function useResponsiveBorderRadius(\n ...args: DropFirst<Parameters<typeof responsiveBorderRadius>>\n): CSSObject {\n return responsiveBorderRadius(useBreakpoints(), ...args)\n}\n\nexport function useResponsiveBorder(\n borderData: BorderPropControllerData | undefined,\n defaultValue: BorderPropertyData = {},\n): CSSObject {\n return useResponsiveStyle([borderData], ([border = {}]) =>\n borderPropertyDataToStyle(\n border,\n Object.assign(\n {\n borderTop: '0px solid black',\n borderRight: '0px solid black',\n borderBottom: '0px solid black',\n borderLeft: '0px solid black',\n },\n defaultValue,\n ),\n ),\n )\n}\n\nconst floor =\n (d: number) =>\n (v: number): number =>\n Math.floor(10 ** d * v) / 10 ** d\n\nexport function responsiveGridItem(\n breakpoints: Breakpoints,\n props: {\n grid: ResponsiveValue<{ spans: number[][]; count: number }>\n index: number\n columnGap?: ResponsiveValue<LengthData>\n rowGap?: ResponsiveValue<LengthData>\n },\n): CSSObject {\n return {\n display: 'flex',\n ...responsiveStyle(\n breakpoints,\n [props.grid, props.columnGap, props.rowGap] as const,\n ([\n { spans, count } = { spans: [[12]], count: 12 },\n columnGap = { value: 0, unit: 'px' },\n rowGap = { value: 0, unit: 'px' },\n ]) => {\n const [rowIndex, columnIndex] = getIndexes(spans, props.index)\n const firstCol = columnIndex === 0\n const lastCol = columnIndex === spans[rowIndex].length - 1\n const span = spans[rowIndex][columnIndex]\n const fraction = floor(5)(span / count)\n const width = `${fraction} * (100% + ${columnGap.value}${columnGap.unit})`\n const excessWidth = `${Number(firstCol) + Number(lastCol)} * ${columnGap.value}${\n columnGap.unit\n } / 2`\n const iePrecisionError = '0.01px'\n const flexBasis = `calc(${width} - ${excessWidth} - ${iePrecisionError})`\n const firstRow = rowIndex === 0\n const lastRow = rowIndex === spans.length - 1\n\n return span === 0\n ? { display: 'none' }\n : {\n flexBasis,\n minWidth: flexBasis,\n // NOTE: IE11 width breaks without max width\n // https://github.com/philipwalton/flexbugs/issues/3\n maxWidth: flexBasis,\n paddingLeft: firstCol ? 0 : `${columnGap.value / 2}${columnGap.unit}`,\n paddingRight: lastCol ? 0 : `${columnGap.value / 2}${columnGap.unit}`,\n paddingTop: firstRow ? 0 : `${rowGap.value / 2}${rowGap.unit}`,\n paddingBottom: lastRow ? 0 : `${rowGap.value / 2}${rowGap.unit}`,\n }\n },\n ),\n }\n}\n\nexport function useResponsiveGridItem(\n ...args: DropFirst<Parameters<typeof responsiveGridItem>>\n): CSSObject {\n return responsiveGridItem(useBreakpoints(), ...args)\n}\n\nconst getBoxShadow = (shadows: BoxShadow) =>\n shadows\n .map(\n ({ payload: { inset, offsetX, offsetY, blurRadius, spreadRadius, color } }) =>\n `${inset ? 'inset ' : ''}${offsetX.toFixed(1)}px ${offsetY.toFixed(\n 1,\n )}px ${blurRadius}px ${spreadRadius}px ${\n color != null ? colorToString(color) : 'rgba(0,0,0,0.2)'\n }`,\n )\n .filter(Boolean)\n .join()\n\nexport function responsiveShadow(\n breakpoints: Breakpoints,\n value: ResponsiveBoxShadow | undefined,\n): CSSObject {\n return responsiveStyle(breakpoints, [value], ([shadow = []]) => ({\n boxShadow: getBoxShadow(shadow),\n }))\n}\n\nexport function useResponsiveShadow(\n ...args: DropFirst<Parameters<typeof responsiveShadow>>\n): CSSObject {\n return responsiveShadow(useBreakpoints(), ...args)\n}\n\nexport function responsiveTextStyle(\n breakpoints: Breakpoints,\n value: ResponsiveTextStyleData | undefined,\n): CSSObject {\n return responsiveStyle(\n breakpoints,\n [value],\n ([\n textStyle = {\n fontFamily: null,\n letterSpacing: null,\n fontSize: null,\n fontWeight: null,\n textTransform: [],\n fontStyle: [],\n },\n ]) => {\n const {\n fontSize,\n fontWeight,\n fontStyle = [],\n textTransform = [],\n letterSpacing,\n fontFamily,\n } = textStyle\n\n return {\n ...(fontFamily == null ? {} : { fontFamily: `\"${fontFamily}\"` }),\n ...(fontWeight == null ? {} : { fontWeight }),\n ...(letterSpacing == null ? {} : { letterSpacing }),\n ...(fontSize == null ? {} : { fontSize: `${fontSize.value}${fontSize.unit}` }),\n ...(textTransform.includes('uppercase') ? { textTransform: 'uppercase' } : {}),\n ...(fontStyle.includes('italic') ? { fontStyle: 'italic' } : {}),\n }\n },\n )\n}\n\nexport function useResponsiveTextStyle(\n ...args: DropFirst<Parameters<typeof responsiveTextStyle>>\n): CSSObject {\n return responsiveTextStyle(useBreakpoints(), ...args)\n}\n"],"mappings":"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","names":["joinResponsiveValues"]}
1
+ {"version":3,"sources":["../../../../src/components/utils/responsive-style.ts"],"sourcesContent":["import { WidthProperty } from 'csstype'\nimport { CSSObject } from '@emotion/css'\n\nimport type { ResponsiveValueType as ExtractResponsiveValue } from '@makeswift/controls'\n\nimport type {\n LengthData,\n ResponsiveBorderRadiusData,\n ResponsiveMarginData,\n ResponsivePaddingData,\n ResponsiveValue,\n ResponsiveLengthData,\n ResponsiveTextStyleData,\n} from '@makeswift/prop-controllers'\n\nimport {\n FallbackStrategy,\n join as joinResponsiveValues,\n type Breakpoints,\n} from '@makeswift/controls'\n\nimport { getBreakpoint, getBreakpointMediaQuery } from '../../state/modules/breakpoints'\n\nimport { useBreakpoints } from '../../runtimes/react/hooks/use-breakpoints'\n\nimport { getIndexes } from './columns'\nimport { PaddingPropertyData, paddingPropertyDataToStyle } from '../../css/padding'\nimport { MarginPropertyData, marginPropertyDataToStyle } from '../../css/margin'\nimport { BorderRadiusPropertyData, borderRadiusPropertyDataToStyle } from '../../css/border-radius'\nimport { BorderPropertyData, borderPropertyDataToStyle } from '../../css/border'\nimport { BorderPropControllerData } from '../hooks/useBorder'\nimport { colorToString } from './colorToString'\nimport { BoxShadow, ResponsiveBoxShadow } from '../hooks'\nimport { DropFirst } from './drop-first'\n\nexport function responsiveStyle<V, A extends ReadonlyArray<ResponsiveValue<V> | null | undefined>>(\n breakpoints: Breakpoints,\n responsiveValues: A,\n join: (values: { [K in keyof A]: ExtractResponsiveValue<A[K]> | undefined }) => CSSObject,\n strategy?: FallbackStrategy<V>,\n): CSSObject {\n return joinResponsiveValues(breakpoints, responsiveValues, join, strategy).reduce(\n (acc, { deviceId, value }) => {\n const breakpoint = getBreakpoint(breakpoints, deviceId)\n const mediaQuery = getBreakpointMediaQuery(breakpoint)\n\n return {\n ...acc,\n [mediaQuery]: {\n ...(acc[mediaQuery] as CSSObject),\n ...value,\n },\n }\n },\n {} as CSSObject,\n )\n}\n\nexport function useResponsiveStyle<\n V,\n A extends ReadonlyArray<ResponsiveValue<V> | null | undefined>,\n>(\n responsiveValues: A,\n join: (values: { [K in keyof A]: ExtractResponsiveValue<A[K]> | undefined }) => CSSObject,\n strategy?: FallbackStrategy<V>,\n): CSSObject {\n return responsiveStyle(useBreakpoints(), responsiveValues, join, strategy)\n}\n\nexport function responsiveWidth(\n breakpoints: Breakpoints,\n widthData: ResponsiveLengthData | undefined,\n defaultValue: LengthData | WidthProperty<string | number> = '100%',\n): CSSObject {\n return {\n maxWidth: '100%',\n ...responsiveStyle(breakpoints, [widthData], ([width = defaultValue]) => ({\n width: typeof width === 'object' ? `${width.value}${width.unit}` : width,\n })),\n }\n}\n\nexport function useResponsiveWidth(\n ...args: DropFirst<Parameters<typeof responsiveWidth>>\n): CSSObject {\n return responsiveWidth(useBreakpoints(), ...args)\n}\n\nexport function responsivePadding(\n breakpoints: Breakpoints,\n paddingData: ResponsivePaddingData | undefined,\n defaultValue: PaddingPropertyData = {} as PaddingPropertyData,\n): CSSObject {\n return responsiveStyle(breakpoints, [paddingData], ([padding = {} as PaddingPropertyData]) =>\n paddingPropertyDataToStyle(\n padding,\n Object.assign(\n { paddingTop: 0, paddingRight: 0, paddingBottom: 0, paddingLeft: 0 },\n defaultValue,\n ),\n ),\n )\n}\n\nexport function useResponsivePadding(\n ...args: DropFirst<Parameters<typeof responsivePadding>>\n): CSSObject {\n return responsivePadding(useBreakpoints(), ...args)\n}\n\nexport function responsiveMargin(\n breakpoints: Breakpoints,\n marginData: ResponsiveMarginData | undefined,\n defaultValue: MarginPropertyData = {} as MarginPropertyData,\n): CSSObject {\n return responsiveStyle(breakpoints, [marginData], ([margin = {} as MarginPropertyData]) =>\n marginPropertyDataToStyle(\n margin,\n Object.assign(\n { marginTop: 0, marginRight: 'auto', marginBottom: 0, marginLeft: 'auto' },\n defaultValue,\n ),\n ),\n )\n}\n\nexport function useResponsiveMargin(\n ...args: DropFirst<Parameters<typeof responsiveMargin>>\n): CSSObject {\n return responsiveMargin(useBreakpoints(), ...args)\n}\n\nexport function responsiveBorderRadius(\n breakpoints: Breakpoints,\n borderRadiusData: ResponsiveBorderRadiusData | undefined,\n defaultValue: BorderRadiusPropertyData = {} as BorderRadiusPropertyData,\n): CSSObject {\n return responsiveStyle(breakpoints, [borderRadiusData], ([borderRadius = {}]) =>\n borderRadiusPropertyDataToStyle(\n borderRadius,\n Object.assign(\n {\n borderTopLeftRadius: 0,\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n borderBottomLeftRadius: 0,\n },\n defaultValue,\n ),\n ),\n )\n}\n\nexport function useResponsiveBorderRadius(\n ...args: DropFirst<Parameters<typeof responsiveBorderRadius>>\n): CSSObject {\n return responsiveBorderRadius(useBreakpoints(), ...args)\n}\n\nexport function useResponsiveBorder(\n borderData: BorderPropControllerData | undefined,\n defaultValue: BorderPropertyData = {},\n): CSSObject {\n return useResponsiveStyle([borderData], ([border = {}]) =>\n borderPropertyDataToStyle(\n border,\n Object.assign(\n {\n borderTop: '0px solid black',\n borderRight: '0px solid black',\n borderBottom: '0px solid black',\n borderLeft: '0px solid black',\n },\n defaultValue,\n ),\n ),\n )\n}\n\nconst floor =\n (d: number) =>\n (v: number): number =>\n Math.floor(10 ** d * v) / 10 ** d\n\nexport function responsiveGridItem(\n breakpoints: Breakpoints,\n props: {\n grid: ResponsiveValue<{ spans: number[][]; count: number }>\n index: number\n columnGap?: ResponsiveValue<LengthData>\n rowGap?: ResponsiveValue<LengthData>\n },\n): CSSObject {\n return {\n display: 'flex',\n ...responsiveStyle(\n breakpoints,\n [props.grid, props.columnGap, props.rowGap] as const,\n ([\n { spans, count } = { spans: [[12]], count: 12 },\n columnGap = { value: 0, unit: 'px' },\n rowGap = { value: 0, unit: 'px' },\n ]) => {\n const [rowIndex, columnIndex] = getIndexes(spans, props.index)\n const firstCol = columnIndex === 0\n const lastCol = columnIndex === spans[rowIndex].length - 1\n const span = spans[rowIndex][columnIndex]\n const fraction = floor(5)(span / count)\n const width = `${fraction} * (100% + ${columnGap.value}${columnGap.unit})`\n const excessWidth = `${Number(firstCol) + Number(lastCol)} * ${columnGap.value}${\n columnGap.unit\n } / 2`\n const iePrecisionError = '0.01px'\n const flexBasis = `calc(${width} - ${excessWidth} - ${iePrecisionError})`\n const firstRow = rowIndex === 0\n const lastRow = rowIndex === spans.length - 1\n\n return span === 0\n ? { display: 'none' }\n : {\n flexBasis,\n minWidth: flexBasis,\n // NOTE: IE11 width breaks without max width\n // https://github.com/philipwalton/flexbugs/issues/3\n maxWidth: flexBasis,\n paddingLeft: firstCol ? 0 : `${columnGap.value / 2}${columnGap.unit}`,\n paddingRight: lastCol ? 0 : `${columnGap.value / 2}${columnGap.unit}`,\n paddingTop: firstRow ? 0 : `${rowGap.value / 2}${rowGap.unit}`,\n paddingBottom: lastRow ? 0 : `${rowGap.value / 2}${rowGap.unit}`,\n }\n },\n ),\n }\n}\n\nexport function useResponsiveGridItem(\n ...args: DropFirst<Parameters<typeof responsiveGridItem>>\n): CSSObject {\n return responsiveGridItem(useBreakpoints(), ...args)\n}\n\nconst getBoxShadow = (shadows: BoxShadow) =>\n shadows\n .map(\n ({ payload: { inset, offsetX, offsetY, blurRadius, spreadRadius, color } }) =>\n `${inset ? 'inset ' : ''}${offsetX.toFixed(1)}px ${offsetY.toFixed(\n 1,\n )}px ${blurRadius}px ${spreadRadius}px ${\n color != null ? colorToString(color) : 'rgba(0,0,0,0.2)'\n }`,\n )\n .filter(Boolean)\n .join()\n\nexport function responsiveShadow(\n breakpoints: Breakpoints,\n value: ResponsiveBoxShadow | undefined,\n): CSSObject {\n return responsiveStyle(breakpoints, [value], ([shadow = []]) => ({\n boxShadow: getBoxShadow(shadow),\n }))\n}\n\nexport function useResponsiveShadow(\n ...args: DropFirst<Parameters<typeof responsiveShadow>>\n): CSSObject {\n return responsiveShadow(useBreakpoints(), ...args)\n}\n\nexport function responsiveTextStyle(\n breakpoints: Breakpoints,\n value: ResponsiveTextStyleData | undefined,\n): CSSObject {\n return responsiveStyle(\n breakpoints,\n [value],\n ([\n textStyle = {\n fontFamily: null,\n letterSpacing: null,\n fontSize: null,\n fontWeight: null,\n textTransform: [],\n fontStyle: [],\n },\n ]) => {\n const {\n fontSize,\n fontWeight,\n fontStyle = [],\n textTransform = [],\n letterSpacing,\n fontFamily,\n } = textStyle\n\n return {\n ...(fontFamily == null ? {} : { fontFamily: `\"${fontFamily}\"` }),\n ...(fontWeight == null ? {} : { fontWeight }),\n ...(letterSpacing == null ? {} : { letterSpacing }),\n ...(fontSize == null ? {} : { fontSize: `${fontSize.value}${fontSize.unit}` }),\n ...(textTransform.includes('uppercase') ? { textTransform: 'uppercase' } : {}),\n ...(fontStyle.includes('italic') ? { fontStyle: 'italic' } : {}),\n }\n },\n )\n}\n\nexport function useResponsiveTextStyle(\n ...args: DropFirst<Parameters<typeof responsiveTextStyle>>\n): CSSObject {\n return responsiveTextStyle(useBreakpoints(), ...args)\n}\n"],"mappings":"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","names":["joinResponsiveValues"]}
@@ -1,7 +1,9 @@
1
1
  "use strict";
2
+ var __create = Object.create;
2
3
  var __defProp = Object.defineProperty;
3
4
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
5
  var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
5
7
  var __hasOwnProp = Object.prototype.hasOwnProperty;
6
8
  var __export = (target, all) => {
7
9
  for (var name in all)
@@ -15,14 +17,32 @@ var __copyProps = (to, from, except, desc) => {
15
17
  }
16
18
  return to;
17
19
  };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
18
28
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
29
  var link_exports = {};
20
30
  __export(link_exports, {
21
31
  Link: () => Link,
22
- LinkDefinition: () => LinkDefinition
32
+ LinkDefinition: () => LinkDefinition,
33
+ validateElementRef: () => validateElementRef
23
34
  });
24
35
  module.exports = __toCommonJS(link_exports);
36
+ var import_scroll_into_view_if_needed = __toESM(require("scroll-into-view-if-needed"));
25
37
  var import_controls = require("@makeswift/controls");
38
+ function validateElementRef(href) {
39
+ try {
40
+ const hash = new URL(`http://www.example.com/${href}`).hash;
41
+ return href === hash ? hash : void 0;
42
+ } catch (error) {
43
+ return void 0;
44
+ }
45
+ }
26
46
  class LinkDefinition extends import_controls.LinkDefinition {
27
47
  static deserialize(data) {
28
48
  if (data.type !== LinkDefinition.type) {
@@ -31,6 +51,29 @@ class LinkDefinition extends import_controls.LinkDefinition {
31
51
  const { config } = LinkDefinition.schema.definition.parse(data);
32
52
  return Link(config);
33
53
  }
54
+ resolveOnClick(data, href, scrollOptions) {
55
+ const onClick = (event) => {
56
+ if (event.defaultPrevented)
57
+ return;
58
+ if (data && data.type === "SCROLL_TO_ELEMENT") {
59
+ const hash = validateElementRef(href);
60
+ if (hash == null) {
61
+ console.error(`Scroll-to-element link received invalid href: ${href}`);
62
+ return;
63
+ }
64
+ event.preventDefault();
65
+ const view = event.view;
66
+ (0, import_scroll_into_view_if_needed.default)(view.document.querySelector(hash), {
67
+ behavior: "smooth",
68
+ block: scrollOptions?.block
69
+ });
70
+ if (view.location.hash !== hash)
71
+ view.history.pushState({}, "", hash);
72
+ }
73
+ };
74
+ onClick.$scrollOptions = scrollOptions;
75
+ return onClick;
76
+ }
34
77
  }
35
78
  function Link(config) {
36
79
  return new LinkDefinition(config ?? {});
@@ -38,6 +81,7 @@ function Link(config) {
38
81
  // Annotate the CommonJS export names for ESM import in node:
39
82
  0 && (module.exports = {
40
83
  Link,
41
- LinkDefinition
84
+ LinkDefinition,
85
+ validateElementRef
42
86
  });
43
87
  //# sourceMappingURL=link.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/controls/link.ts"],"sourcesContent":["import { type MouseEvent } from 'react'\nimport { type DeserializedRecord, LinkDefinition as BaseLinkDefinition } from '@makeswift/controls'\n\nexport class LinkDefinition extends BaseLinkDefinition<MouseEvent<Element>> {\n static deserialize(data: DeserializedRecord): LinkDefinition {\n if (data.type !== LinkDefinition.type) {\n throw new Error(`Link: expected type ${LinkDefinition.type}, got ${data.type}`)\n }\n\n const { config } = LinkDefinition.schema.definition.parse(data)\n return Link(config)\n }\n}\n\nexport function Link(config?: { label?: string }): LinkDefinition {\n return new LinkDefinition(config ?? {})\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,sBAA8E;AAEvE,MAAM,uBAAuB,gBAAAA,eAAwC;AAAA,EAC1E,OAAO,YAAY,MAA0C;AAC3D,QAAI,KAAK,SAAS,eAAe,MAAM;AACrC,YAAM,IAAI,MAAM,uBAAuB,eAAe,IAAI,SAAS,KAAK,IAAI,EAAE;AAAA,IAChF;AAEA,UAAM,EAAE,OAAO,IAAI,eAAe,OAAO,WAAW,MAAM,IAAI;AAC9D,WAAO,KAAK,MAAM;AAAA,EACpB;AACF;AAEO,SAAS,KAAK,QAA6C;AAChE,SAAO,IAAI,eAAe,UAAU,CAAC,CAAC;AACxC;","names":["BaseLinkDefinition"]}
1
+ {"version":3,"sources":["../../../src/controls/link.ts"],"sourcesContent":["import { z } from 'zod'\nimport { type MouseEvent } from 'react'\nimport scrollIntoView from 'scroll-into-view-if-needed'\n\nimport {\n type DeserializedRecord,\n LinkDefinition as BaseLinkDefinition,\n LinkSchema,\n} from '@makeswift/controls'\n\ntype DataType = z.infer<typeof LinkDefinition.schema.data>\ntype ScrollOptions = z.infer<typeof LinkSchema.scrollOptions>\ntype MouseEventType = MouseEvent<Element>\n\nexport function validateElementRef(href: string) {\n try {\n const hash = new URL(`http://www.example.com/${href}`).hash\n return href === hash ? hash : undefined\n } catch (error) {\n return undefined\n }\n}\n\nexport class LinkDefinition extends BaseLinkDefinition<MouseEventType> {\n static deserialize(data: DeserializedRecord): LinkDefinition {\n if (data.type !== LinkDefinition.type) {\n throw new Error(`Link: expected type ${LinkDefinition.type}, got ${data.type}`)\n }\n\n const { config } = LinkDefinition.schema.definition.parse(data)\n return Link(config)\n }\n\n resolveOnClick(\n data: DataType | undefined,\n href: string,\n scrollOptions: ScrollOptions | undefined,\n ) {\n const onClick = (event: MouseEvent<Element>) => {\n if (event.defaultPrevented) return\n\n if (data && data.type === 'SCROLL_TO_ELEMENT') {\n const hash = validateElementRef(href)\n if (hash == null) {\n console.error(`Scroll-to-element link received invalid href: ${href}`)\n return\n }\n\n event.preventDefault()\n const view = event.view as unknown as Window\n\n scrollIntoView(view.document.querySelector(hash)!, {\n behavior: 'smooth',\n block: scrollOptions?.block,\n })\n\n if (view.location.hash !== hash) view.history.pushState({}, '', hash)\n }\n }\n\n onClick.$scrollOptions = scrollOptions\n return onClick\n }\n}\n\nexport function Link(config?: { label?: string }): LinkDefinition {\n return new LinkDefinition(config ?? {})\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,wCAA2B;AAE3B,sBAIO;AAMA,SAAS,mBAAmB,MAAc;AAC/C,MAAI;AACF,UAAM,OAAO,IAAI,IAAI,0BAA0B,IAAI,EAAE,EAAE;AACvD,WAAO,SAAS,OAAO,OAAO;AAAA,EAChC,SAAS,OAAO;AACd,WAAO;AAAA,EACT;AACF;AAEO,MAAM,uBAAuB,gBAAAA,eAAmC;AAAA,EACrE,OAAO,YAAY,MAA0C;AAC3D,QAAI,KAAK,SAAS,eAAe,MAAM;AACrC,YAAM,IAAI,MAAM,uBAAuB,eAAe,IAAI,SAAS,KAAK,IAAI,EAAE;AAAA,IAChF;AAEA,UAAM,EAAE,OAAO,IAAI,eAAe,OAAO,WAAW,MAAM,IAAI;AAC9D,WAAO,KAAK,MAAM;AAAA,EACpB;AAAA,EAEA,eACE,MACA,MACA,eACA;AACA,UAAM,UAAU,CAAC,UAA+B;AAC9C,UAAI,MAAM;AAAkB;AAE5B,UAAI,QAAQ,KAAK,SAAS,qBAAqB;AAC7C,cAAM,OAAO,mBAAmB,IAAI;AACpC,YAAI,QAAQ,MAAM;AAChB,kBAAQ,MAAM,iDAAiD,IAAI,EAAE;AACrE;AAAA,QACF;AAEA,cAAM,eAAe;AACrB,cAAM,OAAO,MAAM;AAEnB,8CAAAC,SAAe,KAAK,SAAS,cAAc,IAAI,GAAI;AAAA,UACjD,UAAU;AAAA,UACV,OAAO,eAAe;AAAA,QACxB,CAAC;AAED,YAAI,KAAK,SAAS,SAAS;AAAM,eAAK,QAAQ,UAAU,CAAC,GAAG,IAAI,IAAI;AAAA,MACtE;AAAA,IACF;AAEA,YAAQ,iBAAiB;AACzB,WAAO;AAAA,EACT;AACF;AAEO,SAAS,KAAK,QAA6C;AAChE,SAAO,IAAI,eAAe,UAAU,CAAC,CAAC;AACxC;","names":["BaseLinkDefinition","scrollIntoView"]}
@@ -23,6 +23,7 @@ __export(rich_text_exports, {
23
23
  });
24
24
  module.exports = __toCommonJS(rich_text_exports);
25
25
  var import_controls = require("@makeswift/controls");
26
+ var import_rich_text = require("../../runtimes/react/controls/rich-text");
26
27
  var import_control = require("./control");
27
28
  class BaseDefinition extends import_controls.RichTextV1Definition {
28
29
  }
@@ -34,6 +35,17 @@ class Definition extends BaseDefinition {
34
35
  return new class RichTextV1 extends Definition {
35
36
  }();
36
37
  }
38
+ resolveValue(data, _resolver, _stylesheet, control) {
39
+ const stableValue = (0, import_controls.StableValue)({
40
+ name: Definition.type,
41
+ read: () => (0, import_rich_text.renderRichText)(data, control ?? null)
42
+ });
43
+ return {
44
+ ...stableValue,
45
+ triggerResolve: async () => {
46
+ }
47
+ };
48
+ }
37
49
  createInstance(sendMessage) {
38
50
  return new import_control.RichTextControl(sendMessage);
39
51
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/controls/rich-text/rich-text.ts"],"sourcesContent":["import { ReactNode } from 'react'\nimport { RichTextV1Definition, type DeserializedRecord, SendMessage } from '@makeswift/controls'\n\nimport { RichTextControl } from './control'\n\nabstract class BaseDefinition extends RichTextV1Definition<ReactNode, RichTextControl> {}\n\nclass Definition extends BaseDefinition {\n static deserialize(data: DeserializedRecord): Definition {\n if (data.type !== Definition.type) {\n throw new Error(`RichTextV1: expected type ${Definition.type}, got ${data.type}`)\n }\n\n return new (class RichTextV1 extends Definition {})()\n }\n\n createInstance(sendMessage: SendMessage<any>) {\n return new RichTextControl(sendMessage)\n }\n}\n\nexport { Definition as RichTextV1Definition, RichTextControl as RichTextV1Control }\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,sBAA2E;AAE3E,qBAAgC;AAEhC,MAAe,uBAAuB,qCAAiD;AAAC;AAExF,MAAM,mBAAmB,eAAe;AAAA,EACtC,OAAO,YAAY,MAAsC;AACvD,QAAI,KAAK,SAAS,WAAW,MAAM;AACjC,YAAM,IAAI,MAAM,6BAA6B,WAAW,IAAI,SAAS,KAAK,IAAI,EAAE;AAAA,IAClF;AAEA,WAAO,IAAK,MAAM,mBAAmB,WAAW;AAAA,IAAC,EAAG;AAAA,EACtD;AAAA,EAEA,eAAe,aAA+B;AAC5C,WAAO,IAAI,+BAAgB,WAAW;AAAA,EACxC;AACF;","names":[]}
1
+ {"version":3,"sources":["../../../../src/controls/rich-text/rich-text.ts"],"sourcesContent":["import { ReactNode } from 'react'\nimport {\n RichTextV1Definition,\n SendMessage,\n StableValue,\n type DeserializedRecord,\n type ResourceResolver,\n type Stylesheet,\n type Resolvable,\n type DataType,\n} from '@makeswift/controls'\n\nimport { renderRichText } from '../../runtimes/react/controls/rich-text'\n\nimport { RichTextControl } from './control'\n\nabstract class BaseDefinition extends RichTextV1Definition<ReactNode, RichTextControl> {}\n\nclass Definition extends BaseDefinition {\n static deserialize(data: DeserializedRecord): Definition {\n if (data.type !== Definition.type) {\n throw new Error(`RichTextV1: expected type ${Definition.type}, got ${data.type}`)\n }\n\n return new (class RichTextV1 extends Definition {})()\n }\n\n resolveValue(\n data: DataType<BaseDefinition> | undefined,\n _resolver: ResourceResolver,\n _stylesheet: Stylesheet,\n control?: RichTextControl,\n ): Resolvable<ReactNode | undefined> {\n const stableValue = StableValue({\n name: Definition.type,\n read: () => renderRichText(data, control ?? null),\n })\n\n return {\n ...stableValue,\n triggerResolve: async () => {},\n }\n }\n\n createInstance(sendMessage: SendMessage<any>) {\n return new RichTextControl(sendMessage)\n }\n}\n\nexport { Definition as RichTextV1Definition, RichTextControl as RichTextV1Control }\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,sBASO;AAEP,uBAA+B;AAE/B,qBAAgC;AAEhC,MAAe,uBAAuB,qCAAiD;AAAC;AAExF,MAAM,mBAAmB,eAAe;AAAA,EACtC,OAAO,YAAY,MAAsC;AACvD,QAAI,KAAK,SAAS,WAAW,MAAM;AACjC,YAAM,IAAI,MAAM,6BAA6B,WAAW,IAAI,SAAS,KAAK,IAAI,EAAE;AAAA,IAClF;AAEA,WAAO,IAAK,MAAM,mBAAmB,WAAW;AAAA,IAAC,EAAG;AAAA,EACtD;AAAA,EAEA,aACE,MACA,WACA,aACA,SACmC;AACnC,UAAM,kBAAc,6BAAY;AAAA,MAC9B,MAAM,WAAW;AAAA,MACjB,MAAM,UAAM,iCAAe,MAAM,WAAW,IAAI;AAAA,IAClD,CAAC;AAED,WAAO;AAAA,MACL,GAAG;AAAA,MACH,gBAAgB,YAAY;AAAA,MAAC;AAAA,IAC/B;AAAA,EACF;AAAA,EAEA,eAAe,aAA+B;AAC5C,WAAO,IAAI,+BAAgB,WAAW;AAAA,EACxC;AACF;","names":[]}
@@ -43,6 +43,7 @@ var import_BlockPlugin = require("../../slate/BlockPlugin");
43
43
  var import_TypographyPlugin = require("../../slate/TypographyPlugin");
44
44
  var import_InlineModePlugin = require("../../slate/InlineModePlugin");
45
45
  var import_utils = require("../../slate/utils");
46
+ var import_rich_text_v2 = require("../../runtimes/react/controls/rich-text-v2");
46
47
  var import_plugin = require("./plugin");
47
48
  var import_control = require("./control");
48
49
  var import_translation = require("./translation");
@@ -98,6 +99,17 @@ class Definition extends import_controls.RichTextDefinition {
98
99
  createInstance(sendMessage) {
99
100
  return new import_control.RichTextV2Control(sendMessage, this);
100
101
  }
102
+ resolveValue(data, _resolver, _stylesheet, control) {
103
+ const stableValue = (0, import_controls.StableValue)({
104
+ name: Definition.type,
105
+ read: () => (0, import_rich_text_v2.renderRichTextV2)(data, this, control ?? null)
106
+ });
107
+ return {
108
+ ...stableValue,
109
+ triggerResolve: async () => {
110
+ }
111
+ };
112
+ }
101
113
  getTranslatableData(data) {
102
114
  return (0, import_translation.getTranslatableData)(Definition.dataToNodes(data), this.config.plugins);
103
115
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/controls/rich-text-v2/rich-text-v2.ts"],"sourcesContent":["import { ReactNode } from 'react'\nimport { z } from 'zod'\n// @ts-expect-error: there are no types for 'corporate-ipsum'\nimport ipsum from 'corporate-ipsum'\n\nimport {\n RichTextDefinition as BaseRichTextDefinition,\n type Data,\n type SendMessage,\n type SerializedRecord,\n type DeserializedRecord,\n type SchemaType,\n type SchemaTypeAny,\n type MergeTranslatableDataContext,\n type RichTextPluginControl,\n type RichTextMode,\n isNotNil,\n ControlDefinition,\n SerializationSchema,\n serialize,\n} from '@makeswift/controls'\n\nimport { LinkPlugin } from '../../slate/LinkPlugin'\nimport { InlinePlugin } from '../../slate/InlinePlugin'\nimport { TextAlignPlugin } from '../../slate/TextAlignPlugin'\nimport { BlockPlugin } from '../../slate/BlockPlugin'\nimport { TypographyPlugin } from '../../slate/TypographyPlugin'\nimport { InlineModePlugin } from '../../slate/InlineModePlugin'\nimport { toText } from '../../slate/utils'\n\nimport { RichTextV2Plugin, Plugin } from './plugin'\nimport { RichTextV2Control } from './control'\nimport {\n getTranslatableData,\n mergeTranslatedNodes,\n type RichTextTranslationDto,\n} from './translation'\n\ntype DataType = z.infer<typeof Definition.schema.data>\ntype DataV2Type = z.infer<typeof Definition.schema.dataV2>\ntype InstanceType = RichTextV2Control\ntype UserConfig = z.infer<typeof Definition.schema.userConfig>\ntype Config = UserConfig & {\n defaultValue: string\n plugins: RichTextV2Plugin[]\n}\n\nclass Definition extends BaseRichTextDefinition<ReactNode, Config, InstanceType> {\n constructor({ mode, defaultValue }: UserConfig, plugins?: RichTextV2Plugin[]) {\n super({\n mode,\n defaultValue:\n defaultValue ??\n (mode === Definition.Mode.Inline ? 'Edit this text' : Definition.generateParagraph()),\n plugins:\n plugins ??\n (mode === Definition.Mode.Inline\n ? [InlineModePlugin()]\n : [BlockPlugin(), TypographyPlugin(), TextAlignPlugin(), InlinePlugin(), LinkPlugin()]),\n })\n }\n\n static generateParagraph(): string {\n return ipsum(3)\n }\n\n static deserialize(\n data: DeserializedRecord,\n deserializeCallback: (r: DeserializedRecord) => ControlDefinition,\n ): RichTextV2Definition {\n if (data.type !== Definition.type) {\n throw new Error(`RichText: expected type ${Definition.type}, got ${data.type}`)\n }\n\n const { config } = Definition.fullSchema({\n pluginDef: SerializationSchema.deserializedRecord,\n }).definition.parse(data)\n\n const { plugins, ...userConfig } = config\n\n return new RichTextV2Definition(\n userConfig,\n plugins.map(({ control }) =>\n control ? { control: { definition: deserializeCallback(control?.definition) } } : {},\n ),\n )\n }\n\n static fullSchema<S extends SchemaTypeAny>({ pluginDef }: { pluginDef: S }) {\n const baseSchema = super.schema\n const plugin = z.object({\n control: z\n .object({\n definition: pluginDef,\n })\n .optional(),\n })\n\n const config = baseSchema.userConfig.extend({\n defaultValue: z.string(),\n plugins: z.array(plugin),\n })\n\n return {\n ...baseSchema,\n config,\n definition: z.object({\n type: baseSchema.type,\n config,\n }),\n }\n }\n\n get configSchema(): SchemaType<Config> {\n return Definition.fullSchema({ pluginDef: z.any() as SchemaType<ControlDefinition> }).config\n }\n\n createInstance(sendMessage: SendMessage): InstanceType {\n return new RichTextV2Control(sendMessage, this)\n }\n\n getTranslatableData(data: DataType): Data {\n return getTranslatableData(Definition.dataToNodes(data), this.config.plugins)\n }\n\n mergeTranslatedData(\n data: DataType,\n translatedData: Data,\n _context: MergeTranslatableDataContext,\n ): Data {\n if (translatedData == null) return data as Data\n\n const { descendants, ...rest } = Definition.normalizeData(data)\n return {\n ...rest,\n descendants: mergeTranslatedNodes(\n descendants,\n translatedData as RichTextTranslationDto,\n this.config.plugins,\n ),\n }\n }\n\n serialize(): [SerializedRecord, Transferable[]] {\n const { plugins, ...config } = this.config\n\n // serialize only the plugin control definition, if any\n const pluginDefs = plugins.map(({ control }) =>\n control\n ? {\n control: {\n definition: control.definition,\n // FIXME: remove getValue/onChange stubs once we released a version of the builder\n // built against the runtime where these can be optional\n getValue: () => undefined,\n onChange: () => {},\n },\n }\n : {},\n )\n\n return serialize(\n { ...config, plugins: pluginDefs },\n {\n type: Definition.type,\n },\n )\n }\n\n get pluginControls(): RichTextPluginControl[] {\n return this.config.plugins.map(plugin => plugin.control).filter(isNotNil)\n }\n\n pluginControlAt(index: number): RichTextPluginControl | undefined {\n return this.pluginControls[index]\n }\n\n toText(data: DataType | undefined): string {\n if (data == null) return ''\n return toText(Definition.dataToNodes(data), this.config.mode ?? Definition.Mode.Block)\n }\n}\n\nexport class RichTextV2Definition extends Definition {}\n\nexport function RichText(config?: UserConfig): RichTextV2Definition {\n return new RichTextV2Definition(config ?? {})\n}\n\nRichText.Mode = Definition.Mode\nRichText.isV1Data = Definition.isV1Data\nRichText.dataToNodes = Definition.dataToNodes\nRichText.Plugin = Plugin\n\nexport { RichTextMode as RichTextV2Mode, type DataV2Type as RichTextDataV2, RichTextV2Control }\n"],"mappings":"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","names":["BaseRichTextDefinition","ipsum"]}
1
+ {"version":3,"sources":["../../../../src/controls/rich-text-v2/rich-text-v2.ts"],"sourcesContent":["import { ReactNode } from 'react'\nimport { z } from 'zod'\n// @ts-expect-error: there are no types for 'corporate-ipsum'\nimport ipsum from 'corporate-ipsum'\n\nimport {\n RichTextDefinition as BaseRichTextDefinition,\n isNotNil,\n ControlDefinition,\n SerializationSchema,\n serialize,\n StableValue,\n type Data,\n type Resolvable,\n type SendMessage,\n type SerializedRecord,\n type DeserializedRecord,\n type SchemaType,\n type SchemaTypeAny,\n type MergeTranslatableDataContext,\n type RichTextPluginControl,\n type ResourceResolver,\n type Stylesheet,\n type RichTextMode,\n} from '@makeswift/controls'\n\nimport { LinkPlugin } from '../../slate/LinkPlugin'\nimport { InlinePlugin } from '../../slate/InlinePlugin'\nimport { TextAlignPlugin } from '../../slate/TextAlignPlugin'\nimport { BlockPlugin } from '../../slate/BlockPlugin'\nimport { TypographyPlugin } from '../../slate/TypographyPlugin'\nimport { InlineModePlugin } from '../../slate/InlineModePlugin'\nimport { toText } from '../../slate/utils'\n\nimport { renderRichTextV2 } from '../../runtimes/react/controls/rich-text-v2'\n\nimport { RichTextV2Plugin, Plugin } from './plugin'\nimport { RichTextV2Control } from './control'\nimport {\n getTranslatableData,\n mergeTranslatedNodes,\n type RichTextTranslationDto,\n} from './translation'\n\ntype DataType = z.infer<typeof Definition.schema.data>\ntype DataV2Type = z.infer<typeof Definition.schema.dataV2>\ntype InstanceType = RichTextV2Control\ntype UserConfig = z.infer<typeof Definition.schema.userConfig>\ntype Config = UserConfig & {\n defaultValue: string\n plugins: RichTextV2Plugin[]\n}\n\nclass Definition extends BaseRichTextDefinition<ReactNode, Config, InstanceType> {\n constructor({ mode, defaultValue }: UserConfig, plugins?: RichTextV2Plugin[]) {\n super({\n mode,\n defaultValue:\n defaultValue ??\n (mode === Definition.Mode.Inline ? 'Edit this text' : Definition.generateParagraph()),\n plugins:\n plugins ??\n (mode === Definition.Mode.Inline\n ? [InlineModePlugin()]\n : [BlockPlugin(), TypographyPlugin(), TextAlignPlugin(), InlinePlugin(), LinkPlugin()]),\n })\n }\n\n static generateParagraph(): string {\n return ipsum(3)\n }\n\n static deserialize(\n data: DeserializedRecord,\n deserializeCallback: (r: DeserializedRecord) => ControlDefinition,\n ): RichTextV2Definition {\n if (data.type !== Definition.type) {\n throw new Error(`RichText: expected type ${Definition.type}, got ${data.type}`)\n }\n\n const { config } = Definition.fullSchema({\n pluginDef: SerializationSchema.deserializedRecord,\n }).definition.parse(data)\n\n const { plugins, ...userConfig } = config\n\n return new RichTextV2Definition(\n userConfig,\n plugins.map(({ control }) =>\n control ? { control: { definition: deserializeCallback(control?.definition) } } : {},\n ),\n )\n }\n\n static fullSchema<S extends SchemaTypeAny>({ pluginDef }: { pluginDef: S }) {\n const baseSchema = super.schema\n const plugin = z.object({\n control: z\n .object({\n definition: pluginDef,\n })\n .optional(),\n })\n\n const config = baseSchema.userConfig.extend({\n defaultValue: z.string(),\n plugins: z.array(plugin),\n })\n\n return {\n ...baseSchema,\n config,\n definition: z.object({\n type: baseSchema.type,\n config,\n }),\n }\n }\n\n get configSchema(): SchemaType<Config> {\n return Definition.fullSchema({ pluginDef: z.any() as SchemaType<ControlDefinition> }).config\n }\n\n createInstance(sendMessage: SendMessage): InstanceType {\n return new RichTextV2Control(sendMessage, this)\n }\n\n resolveValue(\n data: DataType | undefined,\n _resolver: ResourceResolver,\n _stylesheet: Stylesheet,\n control?: InstanceType,\n ): Resolvable<ReactNode | undefined> {\n const stableValue = StableValue({\n name: Definition.type,\n read: () => renderRichTextV2(data, this, control ?? null),\n })\n\n return {\n ...stableValue,\n triggerResolve: async () => {},\n }\n }\n\n getTranslatableData(data: DataType): Data {\n return getTranslatableData(Definition.dataToNodes(data), this.config.plugins)\n }\n\n mergeTranslatedData(\n data: DataType,\n translatedData: Data,\n _context: MergeTranslatableDataContext,\n ): Data {\n if (translatedData == null) return data as Data\n\n const { descendants, ...rest } = Definition.normalizeData(data)\n return {\n ...rest,\n descendants: mergeTranslatedNodes(\n descendants,\n translatedData as RichTextTranslationDto,\n this.config.plugins,\n ),\n }\n }\n\n serialize(): [SerializedRecord, Transferable[]] {\n const { plugins, ...config } = this.config\n\n // serialize only the plugin control definition, if any\n const pluginDefs = plugins.map(({ control }) =>\n control\n ? {\n control: {\n definition: control.definition,\n // FIXME: remove getValue/onChange stubs once we released a version of the builder\n // built against the runtime where these can be optional\n getValue: () => undefined,\n onChange: () => {},\n },\n }\n : {},\n )\n\n return serialize(\n { ...config, plugins: pluginDefs },\n {\n type: Definition.type,\n },\n )\n }\n\n get pluginControls(): RichTextPluginControl[] {\n return this.config.plugins.map(plugin => plugin.control).filter(isNotNil)\n }\n\n pluginControlAt(index: number): RichTextPluginControl | undefined {\n return this.pluginControls[index]\n }\n\n toText(data: DataType | undefined): string {\n if (data == null) return ''\n return toText(Definition.dataToNodes(data), this.config.mode ?? Definition.Mode.Block)\n }\n}\n\nexport class RichTextV2Definition extends Definition {}\n\nexport function RichText(config?: UserConfig): RichTextV2Definition {\n return new RichTextV2Definition(config ?? {})\n}\n\nRichText.Mode = Definition.Mode\nRichText.isV1Data = Definition.isV1Data\nRichText.dataToNodes = Definition.dataToNodes\nRichText.Plugin = Plugin\n\nexport { RichTextMode as RichTextV2Mode, type DataV2Type as RichTextDataV2, RichTextV2Control }\n"],"mappings":"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","names":["BaseRichTextDefinition","ipsum"]}
@@ -24,6 +24,7 @@ __export(slot_exports, {
24
24
  });
25
25
  module.exports = __toCommonJS(slot_exports);
26
26
  var import_controls = require("@makeswift/controls");
27
+ var import_slot = require("../runtimes/react/controls/slot");
27
28
  class BaseDefinition extends import_controls.SlotDefinition {
28
29
  }
29
30
  class SlotDefinition extends BaseDefinition {
@@ -33,6 +34,17 @@ class SlotDefinition extends BaseDefinition {
33
34
  }
34
35
  return Slot();
35
36
  }
37
+ resolveValue(data, _resolver, _stylesheet, control) {
38
+ const stableValue = (0, import_controls.StableValue)({
39
+ name: SlotDefinition.type,
40
+ read: () => (0, import_slot.renderSlot)({ data, control: control ?? null })
41
+ });
42
+ return {
43
+ ...stableValue,
44
+ triggerResolve: async () => {
45
+ }
46
+ };
47
+ }
36
48
  }
37
49
  function Slot() {
38
50
  return new SlotDefinition();
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/controls/slot.ts"],"sourcesContent":["import { ReactNode } from 'react'\nimport {\n SlotDefinition as BaseSlotDefinition,\n SlotControl,\n type DeserializedRecord,\n} from '@makeswift/controls'\n\nabstract class BaseDefinition extends BaseSlotDefinition<ReactNode> {}\n\nexport class SlotDefinition extends BaseDefinition {\n static deserialize(data: DeserializedRecord): SlotDefinition {\n if (data.type !== SlotDefinition.type) {\n throw new Error(`Slot: expected type ${SlotDefinition.type}, got ${data.type}`)\n }\n\n return Slot()\n }\n}\n\nexport function Slot(): SlotDefinition {\n return new SlotDefinition()\n}\n\nexport { SlotControl }\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,sBAIO;AAEP,MAAe,uBAAuB,gBAAAA,eAA8B;AAAC;AAE9D,MAAM,uBAAuB,eAAe;AAAA,EACjD,OAAO,YAAY,MAA0C;AAC3D,QAAI,KAAK,SAAS,eAAe,MAAM;AACrC,YAAM,IAAI,MAAM,uBAAuB,eAAe,IAAI,SAAS,KAAK,IAAI,EAAE;AAAA,IAChF;AAEA,WAAO,KAAK;AAAA,EACd;AACF;AAEO,SAAS,OAAuB;AACrC,SAAO,IAAI,eAAe;AAC5B;","names":["BaseSlotDefinition"]}
1
+ {"version":3,"sources":["../../../src/controls/slot.ts"],"sourcesContent":["import { ReactNode } from 'react'\nimport {\n SlotDefinition as BaseSlotDefinition,\n SlotControl,\n StableValue,\n type DeserializedRecord,\n type ResourceResolver,\n type Stylesheet,\n type Resolvable,\n type DataType,\n} from '@makeswift/controls'\n\nimport { renderSlot } from '../runtimes/react/controls/slot'\n\nabstract class BaseDefinition extends BaseSlotDefinition<ReactNode> {}\n\nexport class SlotDefinition extends BaseDefinition {\n static deserialize(data: DeserializedRecord): SlotDefinition {\n if (data.type !== SlotDefinition.type) {\n throw new Error(`Slot: expected type ${SlotDefinition.type}, got ${data.type}`)\n }\n\n return Slot()\n }\n\n resolveValue(\n data: DataType<BaseDefinition> | undefined,\n _resolver: ResourceResolver,\n _stylesheet: Stylesheet,\n control?: SlotControl,\n ): Resolvable<ReactNode | undefined> {\n const stableValue = StableValue({\n name: SlotDefinition.type,\n read: () => renderSlot({ data, control: control ?? null }),\n })\n\n return {\n ...stableValue,\n triggerResolve: async () => {},\n }\n }\n}\n\nexport function Slot(): SlotDefinition {\n return new SlotDefinition()\n}\n\nexport { SlotControl }\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,sBASO;AAEP,kBAA2B;AAE3B,MAAe,uBAAuB,gBAAAA,eAA8B;AAAC;AAE9D,MAAM,uBAAuB,eAAe;AAAA,EACjD,OAAO,YAAY,MAA0C;AAC3D,QAAI,KAAK,SAAS,eAAe,MAAM;AACrC,YAAM,IAAI,MAAM,uBAAuB,eAAe,IAAI,SAAS,KAAK,IAAI,EAAE;AAAA,IAChF;AAEA,WAAO,KAAK;AAAA,EACd;AAAA,EAEA,aACE,MACA,WACA,aACA,SACmC;AACnC,UAAM,kBAAc,6BAAY;AAAA,MAC9B,MAAM,eAAe;AAAA,MACrB,MAAM,UAAM,wBAAW,EAAE,MAAM,SAAS,WAAW,KAAK,CAAC;AAAA,IAC3D,CAAC;AAED,WAAO;AAAA,MACL,GAAG;AAAA,MACH,gBAAgB,YAAY;AAAA,MAAC;AAAA,IAC/B;AAAA,EACF;AACF;AAEO,SAAS,OAAuB;AACrC,SAAO,IAAI,eAAe;AAC5B;","names":["BaseSlotDefinition"]}
@@ -36,7 +36,7 @@ async function handler(...args) {
36
36
  const supportsPreviewMode = (0, import_ts_pattern.match)(args).with(routeHandlerPattern, () => false).with(apiRoutePattern, () => true).exhaustive();
37
37
  const supportsDraftMode = (0, import_ts_pattern.match)(args).with(routeHandlerPattern, () => true).with(apiRoutePattern, () => false).exhaustive();
38
38
  const body = {
39
- version: "0.21.3",
39
+ version: "0.22.0",
40
40
  previewMode: supportsPreviewMode,
41
41
  draftMode: supportsDraftMode,
42
42
  interactionMode: true,