@makeswift/runtime 0.7.19 → 0.8.1

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 (222) hide show
  1. package/dist/Box.cjs.js +13 -10
  2. package/dist/Box.cjs.js.map +1 -1
  3. package/dist/Box.es.js +8 -5
  4. package/dist/Box.es.js.map +1 -1
  5. package/dist/Button.cjs.js +39 -36
  6. package/dist/Button.cjs.js.map +1 -1
  7. package/dist/Button.es.js +14 -11
  8. package/dist/Button.es.js.map +1 -1
  9. package/dist/Carousel.cjs.js +36 -33
  10. package/dist/Carousel.cjs.js.map +1 -1
  11. package/dist/Carousel.es.js +11 -8
  12. package/dist/Carousel.es.js.map +1 -1
  13. package/dist/Countdown.cjs.js +29 -53
  14. package/dist/Countdown.cjs.js.map +1 -1
  15. package/dist/Countdown.es.js +4 -28
  16. package/dist/Countdown.es.js.map +1 -1
  17. package/dist/Divider.cjs.js +10 -34
  18. package/dist/Divider.cjs.js.map +1 -1
  19. package/dist/Divider.es.js +4 -28
  20. package/dist/Divider.es.js.map +1 -1
  21. package/dist/Embed.cjs.js +5 -29
  22. package/dist/Embed.cjs.js.map +1 -1
  23. package/dist/Embed.es.js +4 -28
  24. package/dist/Embed.es.js.map +1 -1
  25. package/dist/Form.cjs.js +75 -72
  26. package/dist/Form.cjs.js.map +1 -1
  27. package/dist/Form.es.js +13 -10
  28. package/dist/Form.es.js.map +1 -1
  29. package/dist/Image.cjs.js +21 -18
  30. package/dist/Image.cjs.js.map +1 -1
  31. package/dist/Image.es.js +14 -11
  32. package/dist/Image.es.js.map +1 -1
  33. package/dist/LiveProvider.cjs.js +11 -8
  34. package/dist/LiveProvider.cjs.js.map +1 -1
  35. package/dist/LiveProvider.es.js +11 -8
  36. package/dist/LiveProvider.es.js.map +1 -1
  37. package/dist/Navigation.cjs.js +39 -36
  38. package/dist/Navigation.cjs.js.map +1 -1
  39. package/dist/Navigation.es.js +13 -10
  40. package/dist/Navigation.es.js.map +1 -1
  41. package/dist/PreviewProvider.cjs.js +11 -8
  42. package/dist/PreviewProvider.cjs.js.map +1 -1
  43. package/dist/PreviewProvider.es.js +11 -8
  44. package/dist/PreviewProvider.es.js.map +1 -1
  45. package/dist/ReadOnlyText.cjs.js +18 -15
  46. package/dist/ReadOnlyText.cjs.js.map +1 -1
  47. package/dist/ReadOnlyText.es.js +14 -11
  48. package/dist/ReadOnlyText.es.js.map +1 -1
  49. package/dist/Root.cjs.js +12 -9
  50. package/dist/Root.cjs.js.map +1 -1
  51. package/dist/Root.es.js +10 -7
  52. package/dist/Root.es.js.map +1 -1
  53. package/dist/SocialLinks.cjs.js +15 -12
  54. package/dist/SocialLinks.cjs.js.map +1 -1
  55. package/dist/SocialLinks.es.js +8 -5
  56. package/dist/SocialLinks.es.js.map +1 -1
  57. package/dist/Text.cjs.js +6 -3
  58. package/dist/Text.cjs.js.map +1 -1
  59. package/dist/Text.es.js +7 -4
  60. package/dist/Text.es.js.map +1 -1
  61. package/dist/Video.cjs.js +5 -29
  62. package/dist/Video.cjs.js.map +1 -1
  63. package/dist/Video.es.js +4 -28
  64. package/dist/Video.es.js.map +1 -1
  65. package/dist/actions.cjs.js +0 -13
  66. package/dist/actions.cjs.js.map +1 -1
  67. package/dist/actions.es.js +1 -12
  68. package/dist/actions.es.js.map +1 -1
  69. package/dist/components.cjs.js +11 -8
  70. package/dist/components.cjs.js.map +1 -1
  71. package/dist/components.es.js +11 -8
  72. package/dist/components.es.js.map +1 -1
  73. package/dist/controls.cjs.js +1 -0
  74. package/dist/controls.cjs.js.map +1 -1
  75. package/dist/controls.es.js +1 -1
  76. package/dist/descriptors.cjs.js +13 -0
  77. package/dist/descriptors.cjs.js.map +1 -1
  78. package/dist/descriptors.es.js +13 -1
  79. package/dist/descriptors.es.js.map +1 -1
  80. package/dist/index.cjs.js +368 -1508
  81. package/dist/index.cjs.js.map +1 -1
  82. package/dist/index.cjs2.js +22 -20
  83. package/dist/index.cjs2.js.map +1 -1
  84. package/dist/index.cjs3.js +2 -1
  85. package/dist/index.cjs3.js.map +1 -1
  86. package/dist/index.cjs4.js +2 -2
  87. package/dist/index.cjs4.js.map +1 -1
  88. package/dist/index.cjs5.js +4 -4
  89. package/dist/index.cjs5.js.map +1 -1
  90. package/dist/index.cjs6.js +6 -3
  91. package/dist/index.cjs6.js.map +1 -1
  92. package/dist/index.cjs7.js +19 -16
  93. package/dist/index.cjs7.js.map +1 -1
  94. package/dist/index.es.js +334 -1454
  95. package/dist/index.es.js.map +1 -1
  96. package/dist/index.es2.js +4 -2
  97. package/dist/index.es2.js.map +1 -1
  98. package/dist/index.es3.js +2 -1
  99. package/dist/index.es3.js.map +1 -1
  100. package/dist/index.es4.js +1 -1
  101. package/dist/index.es5.js +3 -3
  102. package/dist/index.es5.js.map +1 -1
  103. package/dist/index.es6.js +6 -3
  104. package/dist/index.es6.js.map +1 -1
  105. package/dist/index.es7.js +15 -12
  106. package/dist/index.es7.js.map +1 -1
  107. package/dist/introspection.cjs.js +2 -5
  108. package/dist/introspection.cjs.js.map +1 -1
  109. package/dist/introspection.es.js +2 -4
  110. package/dist/introspection.es.js.map +1 -1
  111. package/dist/isNonNullable.cjs.js +6 -0
  112. package/dist/isNonNullable.cjs.js.map +1 -0
  113. package/dist/isNonNullable.es.js +5 -0
  114. package/dist/isNonNullable.es.js.map +1 -0
  115. package/dist/leaf.cjs.js +11 -11
  116. package/dist/leaf.cjs.js.map +1 -1
  117. package/dist/leaf.es.js +2 -2
  118. package/dist/main.cjs.js +1 -0
  119. package/dist/main.cjs.js.map +1 -1
  120. package/dist/main.es.js +1 -0
  121. package/dist/main.es.js.map +1 -1
  122. package/dist/next.cjs.js +8 -6
  123. package/dist/next.cjs.js.map +1 -1
  124. package/dist/next.es.js +9 -6
  125. package/dist/next.es.js.map +1 -1
  126. package/dist/prop-controllers.cjs.js +1 -0
  127. package/dist/prop-controllers.cjs.js.map +1 -1
  128. package/dist/prop-controllers.es.js +1 -0
  129. package/dist/prop-controllers.es.js.map +1 -1
  130. package/dist/react.cjs.js +6 -3
  131. package/dist/react.cjs.js.map +1 -1
  132. package/dist/react.es.js +6 -3
  133. package/dist/react.es.js.map +1 -1
  134. package/dist/responsive-style.cjs.js +917 -0
  135. package/dist/responsive-style.cjs.js.map +1 -0
  136. package/dist/responsive-style.es.js +853 -0
  137. package/dist/responsive-style.es.js.map +1 -0
  138. package/dist/slate.cjs.js +5 -25
  139. package/dist/slate.cjs.js.map +1 -1
  140. package/dist/slate.es.js +5 -25
  141. package/dist/slate.es.js.map +1 -1
  142. package/dist/types/src/api/graphql/documents/queries.d.ts +0 -2
  143. package/dist/types/src/api/graphql/documents/queries.d.ts.map +1 -1
  144. package/dist/types/src/api/graphql/generated/types.d.ts +0 -70
  145. package/dist/types/src/api/graphql/generated/types.d.ts.map +1 -1
  146. package/dist/types/src/api/react.d.ts +0 -3
  147. package/dist/types/src/api/react.d.ts.map +1 -1
  148. package/dist/types/src/components/builtin/Button/Button.d.ts +1 -1
  149. package/dist/types/src/components/builtin/Form/components/Field/components/Checkbox/index.d.ts +1 -1
  150. package/dist/types/src/components/builtin/Form/components/Field/components/PlaceholderTableField/index.d.ts +1 -0
  151. package/dist/types/src/components/builtin/Form/components/Field/components/PlaceholderTableField/index.d.ts.map +1 -1
  152. package/dist/types/src/components/builtin/Form/components/Field/index.d.ts +1 -0
  153. package/dist/types/src/components/builtin/Form/components/Field/index.d.ts.map +1 -1
  154. package/dist/types/src/components/builtin/Form/components/Spinner/index.d.ts +1 -0
  155. package/dist/types/src/components/builtin/Form/components/Spinner/index.d.ts.map +1 -1
  156. package/dist/types/src/components/builtin/Navigation/components/LinksPlaceholder/index.d.ts +1 -0
  157. package/dist/types/src/components/builtin/Navigation/components/LinksPlaceholder/index.d.ts.map +1 -1
  158. package/dist/types/src/components/builtin/Navigation/components/MobileMenu/index.d.ts +1 -0
  159. package/dist/types/src/components/builtin/Navigation/components/MobileMenu/index.d.ts.map +1 -1
  160. package/dist/types/src/components/builtin/SocialLinks/components/SocialLinksPlaceholder/index.d.ts +1 -0
  161. package/dist/types/src/components/builtin/SocialLinks/components/SocialLinksPlaceholder/index.d.ts.map +1 -1
  162. package/dist/types/src/components/builtin/SocialLinks/options.d.ts +1 -0
  163. package/dist/types/src/components/builtin/SocialLinks/options.d.ts.map +1 -1
  164. package/dist/types/src/components/builtin/Text/components/Element/block.d.ts +1 -0
  165. package/dist/types/src/components/builtin/Text/components/Element/block.d.ts.map +1 -1
  166. package/dist/types/src/components/builtin/Text/components/Element/element.d.ts +1 -0
  167. package/dist/types/src/components/builtin/Text/components/Element/element.d.ts.map +1 -1
  168. package/dist/types/src/components/builtin/Text/components/Element/inline.d.ts +1 -0
  169. package/dist/types/src/components/builtin/Text/components/Element/inline.d.ts.map +1 -1
  170. package/dist/types/src/components/builtin/Text/components/Leaf/leaf.d.ts +1 -0
  171. package/dist/types/src/components/builtin/Text/components/Leaf/leaf.d.ts.map +1 -1
  172. package/dist/types/src/components/page/Page.d.ts +1 -0
  173. package/dist/types/src/components/page/Page.d.ts.map +1 -1
  174. package/dist/types/src/components/shared/BackgroundsContainer/components/BackgroundVideo/index.d.ts +1 -0
  175. package/dist/types/src/components/shared/BackgroundsContainer/components/BackgroundVideo/index.d.ts.map +1 -1
  176. package/dist/types/src/components/shared/BackgroundsContainer/components/Backgrounds/index.d.ts +1 -0
  177. package/dist/types/src/components/shared/BackgroundsContainer/components/Backgrounds/index.d.ts.map +1 -1
  178. package/dist/types/src/controls/rich-text/types.d.ts +20 -6
  179. package/dist/types/src/controls/rich-text/types.d.ts.map +1 -1
  180. package/dist/types/src/next/api-handler/handlers/element-tree.d.ts +12 -0
  181. package/dist/types/src/next/api-handler/handlers/element-tree.d.ts.map +1 -0
  182. package/dist/types/src/next/api-handler/handlers/fonts.d.ts +18 -0
  183. package/dist/types/src/next/api-handler/handlers/fonts.d.ts.map +1 -0
  184. package/dist/types/src/next/api-handler/handlers/manifest.d.ts +17 -0
  185. package/dist/types/src/next/api-handler/handlers/manifest.d.ts.map +1 -0
  186. package/dist/types/src/next/api-handler/handlers/proxy-preview-mode.d.ts +8 -0
  187. package/dist/types/src/next/api-handler/handlers/proxy-preview-mode.d.ts.map +1 -0
  188. package/dist/types/src/next/api-handler/handlers/revalidate.d.ts +13 -0
  189. package/dist/types/src/next/api-handler/handlers/revalidate.d.ts.map +1 -0
  190. package/dist/types/src/next/api-handler/index.d.ts +19 -0
  191. package/dist/types/src/next/api-handler/index.d.ts.map +1 -0
  192. package/dist/types/src/next/client.d.ts +11 -35
  193. package/dist/types/src/next/client.d.ts.map +1 -1
  194. package/dist/types/src/next/document.d.ts +1 -0
  195. package/dist/types/src/next/document.d.ts.map +1 -1
  196. package/dist/types/src/next/index.d.ts +1 -6
  197. package/dist/types/src/next/index.d.ts.map +1 -1
  198. package/dist/types/src/next/preview-mode.d.ts +1 -0
  199. package/dist/types/src/next/preview-mode.d.ts.map +1 -1
  200. package/dist/types/src/runtimes/react/components/render-hook.d.ts +1 -0
  201. package/dist/types/src/runtimes/react/components/render-hook.d.ts.map +1 -1
  202. package/dist/types/src/runtimes/react/controls/control.d.ts +1 -0
  203. package/dist/types/src/runtimes/react/controls/control.d.ts.map +1 -1
  204. package/dist/types/src/runtimes/react/controls/list.d.ts +1 -0
  205. package/dist/types/src/runtimes/react/controls/list.d.ts.map +1 -1
  206. package/dist/types/src/runtimes/react/controls/shape.d.ts +1 -0
  207. package/dist/types/src/runtimes/react/controls/shape.d.ts.map +1 -1
  208. package/dist/types/src/runtimes/react/controls.d.ts +1 -0
  209. package/dist/types/src/runtimes/react/controls.d.ts.map +1 -1
  210. package/dist/types/src/state/actions.d.ts +2 -22
  211. package/dist/types/src/state/actions.d.ts.map +1 -1
  212. package/dist/types/src/state/makeswift-api-client.d.ts +4 -9
  213. package/dist/types/src/state/makeswift-api-client.d.ts.map +1 -1
  214. package/dist/types/src/state/modules/api-resources.d.ts +4 -4
  215. package/dist/types/src/state/modules/api-resources.d.ts.map +1 -1
  216. package/package.json +3 -2
  217. package/dist/types/src/api/introspection.d.ts +0 -11
  218. package/dist/types/src/api/introspection.d.ts.map +0 -1
  219. package/dist/types/src/next/api-handler.d.ts +0 -48
  220. package/dist/types/src/next/api-handler.d.ts.map +0 -1
  221. package/dist/types/src/next/snapshots.d.ts +0 -152
  222. package/dist/types/src/next/snapshots.d.ts.map +0 -1
package/dist/Embed.cjs.js CHANGED
@@ -2,40 +2,16 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  var React = require("react");
4
4
  var useIsomorphicLayoutEffect = require("./useIsomorphicLayoutEffect.cjs.js");
5
- var next = require("./index.cjs.js");
5
+ var responsiveStyle = require("./responsive-style.cjs.js");
6
6
  var css = require("@emotion/css");
7
7
  var jsxRuntime = require("react/jsx-runtime");
8
- require("use-sync-external-store/shim/with-selector");
9
- require("next/dynamic");
10
- require("./constants.cjs.js");
11
- require("redux");
12
- require("redux-thunk");
13
- require("./actions.cjs.js");
14
- require("./descriptors.cjs.js");
15
- require("slate");
16
- require("slate-react");
17
- require("./introspection.cjs.js");
18
8
  require("@emotion/serialize");
19
9
  require("@emotion/utils");
20
- require("./text-input.cjs.js");
21
- require("./combobox.cjs.js");
22
10
  require("use-sync-external-store/shim");
11
+ require("redux");
12
+ require("redux-thunk");
23
13
  require("./types.cjs.js");
24
- require("./box-models.cjs.js");
25
- require("css-box-model");
26
- require("color");
27
- require("scroll-into-view-if-needed");
28
- require("react-dom");
29
- require("html-react-parser");
30
- require("next/head");
31
- require("@emotion/server/create-instance");
32
- require("next/document");
33
- require("cookie");
34
- require("cors");
35
- require("http-proxy");
36
- require("set-cookie-parser");
37
- require("uuid");
38
- require("corporate-ipsum");
14
+ require("./actions.cjs.js");
39
15
  const defaultHtml = `<div style="padding: 24px; background-color: rgba(161, 168, 194, 0.18); overflow: hidden;">
40
16
  <svg width="316" height="168" viewBox="0 0 316 168" fill="none" xmlns="http://www.w3.org/2000/svg">
41
17
  <rect width="70" height="8" rx="2" fill="#A1A8C2" fill-opacity="0.5"/>
@@ -109,7 +85,7 @@ const Embed = React.forwardRef(function Embed2({
109
85
  console.error(error);
110
86
  });
111
87
  }, [container, html]);
112
- const className = next.useStyle({
88
+ const className = responsiveStyle.useStyle({
113
89
  minHeight: 15
114
90
  });
115
91
  if (shouldRender === false)
@@ -1 +1 @@
1
- {"version":3,"file":"Embed.cjs.js","sources":["../src/components/builtin/Embed/Embed.tsx"],"sourcesContent":["/* eslint-env browser */\n\nimport { useState, useEffect, forwardRef, Ref, useImperativeHandle } from 'react'\n\nimport { ElementIDValue, TextAreaValue } from '../../../prop-controllers/descriptors'\nimport { useIsomorphicLayoutEffect } from '../../hooks/useIsomorphicLayoutEffect'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { cx } from '@emotion/css'\n\ntype Props = {\n id?: ElementIDValue\n html?: TextAreaValue\n width?: string\n margin?: string\n}\n\nconst defaultHtml = `<div style=\"padding: 24px; background-color: rgba(161, 168, 194, 0.18); overflow: hidden;\">\n<svg width=\"316\" height=\"168\" viewBox=\"0 0 316 168\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<rect width=\"70\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"78\" width=\"30\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"116\" width=\"78\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect y=\"20\" width=\"120\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"128\" y=\"20\" width=\"30\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"166\" y=\"20\" width=\"78\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect y=\"60\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"20\" y=\"80\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"40\" y=\"100\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"88\" y=\"100\" width=\"110\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"206\" y=\"100\" width=\"24\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"238\" y=\"100\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"40\" y=\"120\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"88\" y=\"120\" width=\"50\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"146\" y=\"120\" width=\"24\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"178\" y=\"120\" width=\"90\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"276\" y=\"120\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"20\" y=\"140\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect y=\"160\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n</svg>\n</div>`\nconst SCRIPT_TAG = 'script'\n\nconst Embed = forwardRef(function Embed(\n { id, width, margin, html = defaultHtml }: Props,\n ref: Ref<HTMLDivElement | null>,\n) {\n const [container, setContainer] = useState<HTMLDivElement | null>(null)\n const [shouldRender, setShouldRender] = useState(false)\n\n useIsomorphicLayoutEffect(() => {\n setShouldRender(true)\n }, [])\n\n useImperativeHandle(ref, () => container, [container])\n\n useEffect(() => {\n // TODO: When we SSR the editor, we can remove the editor check\n // and not run this effect on the first render.\n if (!container) return\n\n const walker = container.ownerDocument.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {\n acceptNode(node: Element) {\n return node.tagName.toLowerCase() === SCRIPT_TAG\n ? NodeFilter.FILTER_ACCEPT\n : NodeFilter.FILTER_REJECT\n },\n })\n\n const nodes: Element[] = []\n\n while (walker.nextNode()) nodes.push(walker.currentNode as Element)\n\n // By default scripts appended dynamically will execute asyncrhonously. Here we ensure that\n // scripts are loaded synchronously since that's what a user usually expects with scripts in\n // embedded in HTML which usually comes from the server.\n //\n // See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#notes\n async function executeScriptsInOrder() {\n for (let i = 0; i < nodes.length; i++) {\n await new Promise<void>(resolve => {\n const node = nodes[i]\n const script = node.ownerDocument.createElement(SCRIPT_TAG)\n\n script.textContent = node.textContent\n Array.from(node.attributes).forEach(({ name, value }) => {\n script.setAttribute(name, value)\n })\n\n script.onload = () => resolve()\n script.onerror = () => resolve()\n\n node.parentNode?.insertBefore(script, node)\n node.parentNode?.removeChild(node)\n\n if (!script.hasAttribute('src')) resolve()\n })\n }\n }\n\n executeScriptsInOrder().catch(error => {\n // Ignore errors from user-provided code\n console.error(error)\n })\n }, [container, html])\n\n const className = useStyle({ minHeight: 15 })\n\n if (shouldRender === false) return null\n\n return (\n <div\n ref={setContainer}\n id={id}\n className={cx(className, width, margin)}\n dangerouslySetInnerHTML={{ __html: html }}\n />\n )\n})\n\nexport default Embed\n"],"names":["defaultHtml","SCRIPT_TAG","Embed","forwardRef","id","width","margin","html","ref","container","setContainer","useState","shouldRender","setShouldRender","useIsomorphicLayoutEffect","useImperativeHandle","useEffect","walker","ownerDocument","createTreeWalker","NodeFilter","SHOW_ELEMENT","acceptNode","node","tagName","toLowerCase","FILTER_ACCEPT","FILTER_REJECT","nodes","nextNode","push","currentNode","i","length","Promise","resolve","script","createElement","textContent","Array","from","attributes","forEach","name","value","setAttribute","onload","onerror","parentNode","insertBefore","removeChild","hasAttribute","catch","error","console","className","useStyle","minHeight","cx","__html"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBA,MAAMA,cAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBrB,MAAMC,aAAa;AAEbC,MAAAA,QAAQC,MAAAA,WAAW,gBACvB;AAAA,EAAEC;AAAAA,EAAIC;AAAAA,EAAOC;AAAAA,EAAQC,OAAOP;AAAAA,GAC5BQ,KACA;AACA,QAAM,CAACC,WAAWC,gBAAgBC,MAAAA,SAAgC,IAAxB;AACpC,QAAA,CAACC,cAAcC,mBAAmBF,MAAAA,SAAS,KAAD;AAEhDG,4BAAAA,0BAA0B,MAAM;AAC9BD,oBAAgB,IAAD;AAAA,EADQ,GAEtB,CAFsB,CAAA;AAIzBE,QAAAA,oBAAoBP,KAAK,MAAMC,WAAW,CAACA,SAAD,CAAvB;AAEnBO,QAAAA,UAAU,MAAM;AAGV,QAAA,CAACP;AAAW;AAEhB,UAAMQ,SAASR,UAAUS,cAAcC,iBAAiBV,WAAWW,WAAWC,cAAc;AAAA,MAC1FC,WAAWC,MAAe;AACxB,eAAOA,KAAKC,QAAQC,kBAAkBxB,aAClCmB,WAAWM,gBACXN,WAAWO;AAAAA,MAChB;AAAA,IAAA,CALY;AAQf,UAAMC,QAAmB,CAAA;AAEzB,WAAOX,OAAOY,SAAP;AAAyBC,YAAAA,KAAKb,OAAOc;AAOL,2CAAA;AACrC,eAASC,IAAI,GAAGA,IAAIJ,MAAMK,QAAQD,KAAK;AAC/B,cAAA,IAAIE,QAAcC,CAAW,YAAA;;AACjC,gBAAMZ,OAAOK,MAAMI;AACbI,gBAAAA,SAASb,KAAKL,cAAcmB,cAAcpC,UAAjC;AAEfmC,iBAAOE,cAAcf,KAAKe;AAC1BC,gBAAMC,KAAKjB,KAAKkB,UAAhB,EAA4BC,QAAQ,CAAC;AAAA,YAAEC;AAAAA,YAAMC;AAAAA,gBAAY;AAChDC,mBAAAA,aAAaF,MAAMC,KAA1B;AAAA,UAAA,CADF;AAIOE,iBAAAA,SAAS,MAAMX;AACfY,iBAAAA,UAAU,MAAMZ;AAElBa,qBAAAA,eAAAA,mBAAYC,aAAab,QAAQb;AACjCyB,qBAAAA,eAAAA,mBAAYE,YAAY3B;AAEzB,cAAA,CAACa,OAAOe,aAAa,KAApB;AAAmC;QAAA,CAfpC;AAAA,MAiBP;AAAA,IACF;AAEoB,0BAAA,EAAGC,MAAMC,CAAS,UAAA;AAErCC,cAAQD,MAAMA,KAAd;AAAA,IAAA,CAFF;AAAA,EAAA,GAIC,CAAC5C,WAAWF,IAAZ,CAhDM;AAkDHgD,QAAAA,YAAYC,KAAAA,SAAS;AAAA,IAAEC,WAAW;AAAA,EAAA,CAAd;AAE1B,MAAI7C,iBAAiB;AAAc,WAAA;AAGjC,wCAAA,OAAA;AAAA,IACE,KAAKF;AAAAA,IACL;AAAA,IACA,WAAWgD,IAAAA,GAAGH,WAAWlD,OAAOC,MAAnB;AAAA,IACb,yBAAyB;AAAA,MAAEqD,QAAQpD;AAAAA,IAAV;AAAA,EAAA,CAL7B;AAQD,CA3EuB;;"}
1
+ {"version":3,"file":"Embed.cjs.js","sources":["../src/components/builtin/Embed/Embed.tsx"],"sourcesContent":["/* eslint-env browser */\n\nimport { useState, useEffect, forwardRef, Ref, useImperativeHandle } from 'react'\n\nimport { ElementIDValue, TextAreaValue } from '../../../prop-controllers/descriptors'\nimport { useIsomorphicLayoutEffect } from '../../hooks/useIsomorphicLayoutEffect'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { cx } from '@emotion/css'\n\ntype Props = {\n id?: ElementIDValue\n html?: TextAreaValue\n width?: string\n margin?: string\n}\n\nconst defaultHtml = `<div style=\"padding: 24px; background-color: rgba(161, 168, 194, 0.18); overflow: hidden;\">\n<svg width=\"316\" height=\"168\" viewBox=\"0 0 316 168\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<rect width=\"70\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"78\" width=\"30\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"116\" width=\"78\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect y=\"20\" width=\"120\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"128\" y=\"20\" width=\"30\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"166\" y=\"20\" width=\"78\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect y=\"60\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"20\" y=\"80\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"40\" y=\"100\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"88\" y=\"100\" width=\"110\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"206\" y=\"100\" width=\"24\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"238\" y=\"100\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"40\" y=\"120\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"88\" y=\"120\" width=\"50\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"146\" y=\"120\" width=\"24\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"178\" y=\"120\" width=\"90\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"276\" y=\"120\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"20\" y=\"140\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect y=\"160\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n</svg>\n</div>`\nconst SCRIPT_TAG = 'script'\n\nconst Embed = forwardRef(function Embed(\n { id, width, margin, html = defaultHtml }: Props,\n ref: Ref<HTMLDivElement | null>,\n) {\n const [container, setContainer] = useState<HTMLDivElement | null>(null)\n const [shouldRender, setShouldRender] = useState(false)\n\n useIsomorphicLayoutEffect(() => {\n setShouldRender(true)\n }, [])\n\n useImperativeHandle(ref, () => container, [container])\n\n useEffect(() => {\n // TODO: When we SSR the editor, we can remove the editor check\n // and not run this effect on the first render.\n if (!container) return\n\n const walker = container.ownerDocument.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {\n acceptNode(node: Element) {\n return node.tagName.toLowerCase() === SCRIPT_TAG\n ? NodeFilter.FILTER_ACCEPT\n : NodeFilter.FILTER_REJECT\n },\n })\n\n const nodes: Element[] = []\n\n while (walker.nextNode()) nodes.push(walker.currentNode as Element)\n\n // By default scripts appended dynamically will execute asyncrhonously. Here we ensure that\n // scripts are loaded synchronously since that's what a user usually expects with scripts in\n // embedded in HTML which usually comes from the server.\n //\n // See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#notes\n async function executeScriptsInOrder() {\n for (let i = 0; i < nodes.length; i++) {\n await new Promise<void>(resolve => {\n const node = nodes[i]\n const script = node.ownerDocument.createElement(SCRIPT_TAG)\n\n script.textContent = node.textContent\n Array.from(node.attributes).forEach(({ name, value }) => {\n script.setAttribute(name, value)\n })\n\n script.onload = () => resolve()\n script.onerror = () => resolve()\n\n node.parentNode?.insertBefore(script, node)\n node.parentNode?.removeChild(node)\n\n if (!script.hasAttribute('src')) resolve()\n })\n }\n }\n\n executeScriptsInOrder().catch(error => {\n // Ignore errors from user-provided code\n console.error(error)\n })\n }, [container, html])\n\n const className = useStyle({ minHeight: 15 })\n\n if (shouldRender === false) return null\n\n return (\n <div\n ref={setContainer}\n id={id}\n className={cx(className, width, margin)}\n dangerouslySetInnerHTML={{ __html: html }}\n />\n )\n})\n\nexport default Embed\n"],"names":["defaultHtml","SCRIPT_TAG","Embed","forwardRef","id","width","margin","html","ref","container","setContainer","useState","shouldRender","setShouldRender","useIsomorphicLayoutEffect","useImperativeHandle","useEffect","walker","ownerDocument","createTreeWalker","NodeFilter","SHOW_ELEMENT","acceptNode","node","tagName","toLowerCase","FILTER_ACCEPT","FILTER_REJECT","nodes","nextNode","push","currentNode","i","length","Promise","resolve","script","createElement","textContent","Array","from","attributes","forEach","name","value","setAttribute","onload","onerror","parentNode","insertBefore","removeChild","hasAttribute","catch","error","console","className","useStyle","minHeight","cx","__html"],"mappings":";;;;;;;;;;;;;;AAgBA,MAAMA,cAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBrB,MAAMC,aAAa;AAEbC,MAAAA,QAAQC,MAAAA,WAAW,gBACvB;AAAA,EAAEC;AAAAA,EAAIC;AAAAA,EAAOC;AAAAA,EAAQC,OAAOP;AAAAA,GAC5BQ,KACA;AACA,QAAM,CAACC,WAAWC,gBAAgBC,MAAAA,SAAgC,IAAxB;AACpC,QAAA,CAACC,cAAcC,mBAAmBF,MAAAA,SAAS,KAAD;AAEhDG,4BAAAA,0BAA0B,MAAM;AAC9BD,oBAAgB,IAAD;AAAA,EADQ,GAEtB,CAFsB,CAAA;AAIzBE,QAAAA,oBAAoBP,KAAK,MAAMC,WAAW,CAACA,SAAD,CAAvB;AAEnBO,QAAAA,UAAU,MAAM;AAGV,QAAA,CAACP;AAAW;AAEhB,UAAMQ,SAASR,UAAUS,cAAcC,iBAAiBV,WAAWW,WAAWC,cAAc;AAAA,MAC1FC,WAAWC,MAAe;AACxB,eAAOA,KAAKC,QAAQC,kBAAkBxB,aAClCmB,WAAWM,gBACXN,WAAWO;AAAAA,MAChB;AAAA,IAAA,CALY;AAQf,UAAMC,QAAmB,CAAA;AAEzB,WAAOX,OAAOY,SAAP;AAAyBC,YAAAA,KAAKb,OAAOc;AAOL,2CAAA;AACrC,eAASC,IAAI,GAAGA,IAAIJ,MAAMK,QAAQD,KAAK;AAC/B,cAAA,IAAIE,QAAcC,CAAW,YAAA;;AACjC,gBAAMZ,OAAOK,MAAMI;AACbI,gBAAAA,SAASb,KAAKL,cAAcmB,cAAcpC,UAAjC;AAEfmC,iBAAOE,cAAcf,KAAKe;AAC1BC,gBAAMC,KAAKjB,KAAKkB,UAAhB,EAA4BC,QAAQ,CAAC;AAAA,YAAEC;AAAAA,YAAMC;AAAAA,gBAAY;AAChDC,mBAAAA,aAAaF,MAAMC,KAA1B;AAAA,UAAA,CADF;AAIOE,iBAAAA,SAAS,MAAMX;AACfY,iBAAAA,UAAU,MAAMZ;AAElBa,qBAAAA,eAAAA,mBAAYC,aAAab,QAAQb;AACjCyB,qBAAAA,eAAAA,mBAAYE,YAAY3B;AAEzB,cAAA,CAACa,OAAOe,aAAa,KAApB;AAAmC;QAAA,CAfpC;AAAA,MAiBP;AAAA,IACF;AAEoB,0BAAA,EAAGC,MAAMC,CAAS,UAAA;AAErCC,cAAQD,MAAMA,KAAd;AAAA,IAAA,CAFF;AAAA,EAAA,GAIC,CAAC5C,WAAWF,IAAZ,CAhDM;AAkDHgD,QAAAA,YAAYC,gBAAAA,SAAS;AAAA,IAAEC,WAAW;AAAA,EAAA,CAAd;AAE1B,MAAI7C,iBAAiB;AAAc,WAAA;AAGjC,wCAAA,OAAA;AAAA,IACE,KAAKF;AAAAA,IACL;AAAA,IACA,WAAWgD,IAAAA,GAAGH,WAAWlD,OAAOC,MAAnB;AAAA,IACb,yBAAyB;AAAA,MAAEqD,QAAQpD;AAAAA,IAAV;AAAA,EAAA,CAL7B;AAQD,CA3EuB;;"}
package/dist/Embed.es.js CHANGED
@@ -1,39 +1,15 @@
1
1
  import { forwardRef, useState, useImperativeHandle, useEffect } from "react";
2
2
  import { u as useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect.es.js";
3
- import { o as useStyle } from "./index.es.js";
3
+ import { e as useStyle } from "./responsive-style.es.js";
4
4
  import { cx } from "@emotion/css";
5
5
  import { jsx } from "react/jsx-runtime";
6
- import "use-sync-external-store/shim/with-selector";
7
- import "next/dynamic";
8
- import "./constants.es.js";
9
- import "redux";
10
- import "redux-thunk";
11
- import "./actions.es.js";
12
- import "./descriptors.es.js";
13
- import "slate";
14
- import "slate-react";
15
- import "./introspection.es.js";
16
6
  import "@emotion/serialize";
17
7
  import "@emotion/utils";
18
- import "./text-input.es.js";
19
- import "./combobox.es.js";
20
8
  import "use-sync-external-store/shim";
9
+ import "redux";
10
+ import "redux-thunk";
21
11
  import "./types.es.js";
22
- import "./box-models.es.js";
23
- import "css-box-model";
24
- import "color";
25
- import "scroll-into-view-if-needed";
26
- import "react-dom";
27
- import "html-react-parser";
28
- import "next/head";
29
- import "@emotion/server/create-instance";
30
- import "next/document";
31
- import "cookie";
32
- import "cors";
33
- import "http-proxy";
34
- import "set-cookie-parser";
35
- import "uuid";
36
- import "corporate-ipsum";
12
+ import "./actions.es.js";
37
13
  const defaultHtml = `<div style="padding: 24px; background-color: rgba(161, 168, 194, 0.18); overflow: hidden;">
38
14
  <svg width="316" height="168" viewBox="0 0 316 168" fill="none" xmlns="http://www.w3.org/2000/svg">
39
15
  <rect width="70" height="8" rx="2" fill="#A1A8C2" fill-opacity="0.5"/>
@@ -1 +1 @@
1
- {"version":3,"file":"Embed.es.js","sources":["../src/components/builtin/Embed/Embed.tsx"],"sourcesContent":["/* eslint-env browser */\n\nimport { useState, useEffect, forwardRef, Ref, useImperativeHandle } from 'react'\n\nimport { ElementIDValue, TextAreaValue } from '../../../prop-controllers/descriptors'\nimport { useIsomorphicLayoutEffect } from '../../hooks/useIsomorphicLayoutEffect'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { cx } from '@emotion/css'\n\ntype Props = {\n id?: ElementIDValue\n html?: TextAreaValue\n width?: string\n margin?: string\n}\n\nconst defaultHtml = `<div style=\"padding: 24px; background-color: rgba(161, 168, 194, 0.18); overflow: hidden;\">\n<svg width=\"316\" height=\"168\" viewBox=\"0 0 316 168\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<rect width=\"70\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"78\" width=\"30\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"116\" width=\"78\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect y=\"20\" width=\"120\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"128\" y=\"20\" width=\"30\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"166\" y=\"20\" width=\"78\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect y=\"60\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"20\" y=\"80\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"40\" y=\"100\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"88\" y=\"100\" width=\"110\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"206\" y=\"100\" width=\"24\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"238\" y=\"100\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"40\" y=\"120\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"88\" y=\"120\" width=\"50\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"146\" y=\"120\" width=\"24\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"178\" y=\"120\" width=\"90\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"276\" y=\"120\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"20\" y=\"140\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect y=\"160\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n</svg>\n</div>`\nconst SCRIPT_TAG = 'script'\n\nconst Embed = forwardRef(function Embed(\n { id, width, margin, html = defaultHtml }: Props,\n ref: Ref<HTMLDivElement | null>,\n) {\n const [container, setContainer] = useState<HTMLDivElement | null>(null)\n const [shouldRender, setShouldRender] = useState(false)\n\n useIsomorphicLayoutEffect(() => {\n setShouldRender(true)\n }, [])\n\n useImperativeHandle(ref, () => container, [container])\n\n useEffect(() => {\n // TODO: When we SSR the editor, we can remove the editor check\n // and not run this effect on the first render.\n if (!container) return\n\n const walker = container.ownerDocument.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {\n acceptNode(node: Element) {\n return node.tagName.toLowerCase() === SCRIPT_TAG\n ? NodeFilter.FILTER_ACCEPT\n : NodeFilter.FILTER_REJECT\n },\n })\n\n const nodes: Element[] = []\n\n while (walker.nextNode()) nodes.push(walker.currentNode as Element)\n\n // By default scripts appended dynamically will execute asyncrhonously. Here we ensure that\n // scripts are loaded synchronously since that's what a user usually expects with scripts in\n // embedded in HTML which usually comes from the server.\n //\n // See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#notes\n async function executeScriptsInOrder() {\n for (let i = 0; i < nodes.length; i++) {\n await new Promise<void>(resolve => {\n const node = nodes[i]\n const script = node.ownerDocument.createElement(SCRIPT_TAG)\n\n script.textContent = node.textContent\n Array.from(node.attributes).forEach(({ name, value }) => {\n script.setAttribute(name, value)\n })\n\n script.onload = () => resolve()\n script.onerror = () => resolve()\n\n node.parentNode?.insertBefore(script, node)\n node.parentNode?.removeChild(node)\n\n if (!script.hasAttribute('src')) resolve()\n })\n }\n }\n\n executeScriptsInOrder().catch(error => {\n // Ignore errors from user-provided code\n console.error(error)\n })\n }, [container, html])\n\n const className = useStyle({ minHeight: 15 })\n\n if (shouldRender === false) return null\n\n return (\n <div\n ref={setContainer}\n id={id}\n className={cx(className, width, margin)}\n dangerouslySetInnerHTML={{ __html: html }}\n />\n )\n})\n\nexport default Embed\n"],"names":["defaultHtml","SCRIPT_TAG","Embed","forwardRef","id","width","margin","html","ref","container","setContainer","useState","shouldRender","setShouldRender","useIsomorphicLayoutEffect","useImperativeHandle","useEffect","walker","ownerDocument","createTreeWalker","NodeFilter","SHOW_ELEMENT","acceptNode","node","tagName","toLowerCase","FILTER_ACCEPT","FILTER_REJECT","nodes","nextNode","push","currentNode","i","length","Promise","resolve","script","createElement","textContent","Array","from","attributes","forEach","name","value","setAttribute","onload","onerror","parentNode","insertBefore","removeChild","hasAttribute","catch","error","console","className","useStyle","minHeight","cx","__html"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBA,MAAMA,cAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBrB,MAAMC,aAAa;AAEbC,MAAAA,QAAQC,WAAW,gBACvB;AAAA,EAAEC;AAAAA,EAAIC;AAAAA,EAAOC;AAAAA,EAAQC,OAAOP;AAAAA,GAC5BQ,KACA;AACA,QAAM,CAACC,WAAWC,gBAAgBC,SAAgC,IAAxB;AACpC,QAAA,CAACC,cAAcC,mBAAmBF,SAAS,KAAD;AAEhDG,4BAA0B,MAAM;AAC9BD,oBAAgB,IAAD;AAAA,EADQ,GAEtB,CAFsB,CAAA;AAIzBE,sBAAoBP,KAAK,MAAMC,WAAW,CAACA,SAAD,CAAvB;AAEnBO,YAAU,MAAM;AAGV,QAAA,CAACP;AAAW;AAEhB,UAAMQ,SAASR,UAAUS,cAAcC,iBAAiBV,WAAWW,WAAWC,cAAc;AAAA,MAC1FC,WAAWC,MAAe;AACxB,eAAOA,KAAKC,QAAQC,kBAAkBxB,aAClCmB,WAAWM,gBACXN,WAAWO;AAAAA,MAChB;AAAA,IAAA,CALY;AAQf,UAAMC,QAAmB,CAAA;AAEzB,WAAOX,OAAOY,SAAP;AAAyBC,YAAAA,KAAKb,OAAOc;AAOL,2CAAA;AACrC,eAASC,IAAI,GAAGA,IAAIJ,MAAMK,QAAQD,KAAK;AAC/B,cAAA,IAAIE,QAAcC,CAAW,YAAA;;AACjC,gBAAMZ,OAAOK,MAAMI;AACbI,gBAAAA,SAASb,KAAKL,cAAcmB,cAAcpC,UAAjC;AAEfmC,iBAAOE,cAAcf,KAAKe;AAC1BC,gBAAMC,KAAKjB,KAAKkB,UAAhB,EAA4BC,QAAQ,CAAC;AAAA,YAAEC;AAAAA,YAAMC;AAAAA,gBAAY;AAChDC,mBAAAA,aAAaF,MAAMC,KAA1B;AAAA,UAAA,CADF;AAIOE,iBAAAA,SAAS,MAAMX;AACfY,iBAAAA,UAAU,MAAMZ;AAElBa,qBAAAA,eAAAA,mBAAYC,aAAab,QAAQb;AACjCyB,qBAAAA,eAAAA,mBAAYE,YAAY3B;AAEzB,cAAA,CAACa,OAAOe,aAAa,KAApB;AAAmC;QAAA,CAfpC;AAAA,MAiBP;AAAA,IACF;AAEoB,0BAAA,EAAGC,MAAMC,CAAS,UAAA;AAErCC,cAAQD,MAAMA,KAAd;AAAA,IAAA,CAFF;AAAA,EAAA,GAIC,CAAC5C,WAAWF,IAAZ,CAhDM;AAkDHgD,QAAAA,YAAYC,SAAS;AAAA,IAAEC,WAAW;AAAA,EAAA,CAAd;AAE1B,MAAI7C,iBAAiB;AAAc,WAAA;AAGjC,6BAAA,OAAA;AAAA,IACE,KAAKF;AAAAA,IACL;AAAA,IACA,WAAWgD,GAAGH,WAAWlD,OAAOC,MAAnB;AAAA,IACb,yBAAyB;AAAA,MAAEqD,QAAQpD;AAAAA,IAAV;AAAA,EAAA,CAL7B;AAQD,CA3EuB;;"}
1
+ {"version":3,"file":"Embed.es.js","sources":["../src/components/builtin/Embed/Embed.tsx"],"sourcesContent":["/* eslint-env browser */\n\nimport { useState, useEffect, forwardRef, Ref, useImperativeHandle } from 'react'\n\nimport { ElementIDValue, TextAreaValue } from '../../../prop-controllers/descriptors'\nimport { useIsomorphicLayoutEffect } from '../../hooks/useIsomorphicLayoutEffect'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { cx } from '@emotion/css'\n\ntype Props = {\n id?: ElementIDValue\n html?: TextAreaValue\n width?: string\n margin?: string\n}\n\nconst defaultHtml = `<div style=\"padding: 24px; background-color: rgba(161, 168, 194, 0.18); overflow: hidden;\">\n<svg width=\"316\" height=\"168\" viewBox=\"0 0 316 168\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<rect width=\"70\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"78\" width=\"30\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"116\" width=\"78\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect y=\"20\" width=\"120\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"128\" y=\"20\" width=\"30\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"166\" y=\"20\" width=\"78\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect y=\"60\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"20\" y=\"80\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"40\" y=\"100\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"88\" y=\"100\" width=\"110\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"206\" y=\"100\" width=\"24\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"238\" y=\"100\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"40\" y=\"120\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"88\" y=\"120\" width=\"50\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"146\" y=\"120\" width=\"24\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"178\" y=\"120\" width=\"90\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.25\"/>\n<rect x=\"276\" y=\"120\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect x=\"20\" y=\"140\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n<rect y=\"160\" width=\"40\" height=\"8\" rx=\"2\" fill=\"#A1A8C2\" fill-opacity=\"0.5\"/>\n</svg>\n</div>`\nconst SCRIPT_TAG = 'script'\n\nconst Embed = forwardRef(function Embed(\n { id, width, margin, html = defaultHtml }: Props,\n ref: Ref<HTMLDivElement | null>,\n) {\n const [container, setContainer] = useState<HTMLDivElement | null>(null)\n const [shouldRender, setShouldRender] = useState(false)\n\n useIsomorphicLayoutEffect(() => {\n setShouldRender(true)\n }, [])\n\n useImperativeHandle(ref, () => container, [container])\n\n useEffect(() => {\n // TODO: When we SSR the editor, we can remove the editor check\n // and not run this effect on the first render.\n if (!container) return\n\n const walker = container.ownerDocument.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {\n acceptNode(node: Element) {\n return node.tagName.toLowerCase() === SCRIPT_TAG\n ? NodeFilter.FILTER_ACCEPT\n : NodeFilter.FILTER_REJECT\n },\n })\n\n const nodes: Element[] = []\n\n while (walker.nextNode()) nodes.push(walker.currentNode as Element)\n\n // By default scripts appended dynamically will execute asyncrhonously. Here we ensure that\n // scripts are loaded synchronously since that's what a user usually expects with scripts in\n // embedded in HTML which usually comes from the server.\n //\n // See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#notes\n async function executeScriptsInOrder() {\n for (let i = 0; i < nodes.length; i++) {\n await new Promise<void>(resolve => {\n const node = nodes[i]\n const script = node.ownerDocument.createElement(SCRIPT_TAG)\n\n script.textContent = node.textContent\n Array.from(node.attributes).forEach(({ name, value }) => {\n script.setAttribute(name, value)\n })\n\n script.onload = () => resolve()\n script.onerror = () => resolve()\n\n node.parentNode?.insertBefore(script, node)\n node.parentNode?.removeChild(node)\n\n if (!script.hasAttribute('src')) resolve()\n })\n }\n }\n\n executeScriptsInOrder().catch(error => {\n // Ignore errors from user-provided code\n console.error(error)\n })\n }, [container, html])\n\n const className = useStyle({ minHeight: 15 })\n\n if (shouldRender === false) return null\n\n return (\n <div\n ref={setContainer}\n id={id}\n className={cx(className, width, margin)}\n dangerouslySetInnerHTML={{ __html: html }}\n />\n )\n})\n\nexport default Embed\n"],"names":["defaultHtml","SCRIPT_TAG","Embed","forwardRef","id","width","margin","html","ref","container","setContainer","useState","shouldRender","setShouldRender","useIsomorphicLayoutEffect","useImperativeHandle","useEffect","walker","ownerDocument","createTreeWalker","NodeFilter","SHOW_ELEMENT","acceptNode","node","tagName","toLowerCase","FILTER_ACCEPT","FILTER_REJECT","nodes","nextNode","push","currentNode","i","length","Promise","resolve","script","createElement","textContent","Array","from","attributes","forEach","name","value","setAttribute","onload","onerror","parentNode","insertBefore","removeChild","hasAttribute","catch","error","console","className","useStyle","minHeight","cx","__html"],"mappings":";;;;;;;;;;;;AAgBA,MAAMA,cAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBrB,MAAMC,aAAa;AAEbC,MAAAA,QAAQC,WAAW,gBACvB;AAAA,EAAEC;AAAAA,EAAIC;AAAAA,EAAOC;AAAAA,EAAQC,OAAOP;AAAAA,GAC5BQ,KACA;AACA,QAAM,CAACC,WAAWC,gBAAgBC,SAAgC,IAAxB;AACpC,QAAA,CAACC,cAAcC,mBAAmBF,SAAS,KAAD;AAEhDG,4BAA0B,MAAM;AAC9BD,oBAAgB,IAAD;AAAA,EADQ,GAEtB,CAFsB,CAAA;AAIzBE,sBAAoBP,KAAK,MAAMC,WAAW,CAACA,SAAD,CAAvB;AAEnBO,YAAU,MAAM;AAGV,QAAA,CAACP;AAAW;AAEhB,UAAMQ,SAASR,UAAUS,cAAcC,iBAAiBV,WAAWW,WAAWC,cAAc;AAAA,MAC1FC,WAAWC,MAAe;AACxB,eAAOA,KAAKC,QAAQC,kBAAkBxB,aAClCmB,WAAWM,gBACXN,WAAWO;AAAAA,MAChB;AAAA,IAAA,CALY;AAQf,UAAMC,QAAmB,CAAA;AAEzB,WAAOX,OAAOY,SAAP;AAAyBC,YAAAA,KAAKb,OAAOc;AAOL,2CAAA;AACrC,eAASC,IAAI,GAAGA,IAAIJ,MAAMK,QAAQD,KAAK;AAC/B,cAAA,IAAIE,QAAcC,CAAW,YAAA;;AACjC,gBAAMZ,OAAOK,MAAMI;AACbI,gBAAAA,SAASb,KAAKL,cAAcmB,cAAcpC,UAAjC;AAEfmC,iBAAOE,cAAcf,KAAKe;AAC1BC,gBAAMC,KAAKjB,KAAKkB,UAAhB,EAA4BC,QAAQ,CAAC;AAAA,YAAEC;AAAAA,YAAMC;AAAAA,gBAAY;AAChDC,mBAAAA,aAAaF,MAAMC,KAA1B;AAAA,UAAA,CADF;AAIOE,iBAAAA,SAAS,MAAMX;AACfY,iBAAAA,UAAU,MAAMZ;AAElBa,qBAAAA,eAAAA,mBAAYC,aAAab,QAAQb;AACjCyB,qBAAAA,eAAAA,mBAAYE,YAAY3B;AAEzB,cAAA,CAACa,OAAOe,aAAa,KAApB;AAAmC;QAAA,CAfpC;AAAA,MAiBP;AAAA,IACF;AAEoB,0BAAA,EAAGC,MAAMC,CAAS,UAAA;AAErCC,cAAQD,MAAMA,KAAd;AAAA,IAAA,CAFF;AAAA,EAAA,GAIC,CAAC5C,WAAWF,IAAZ,CAhDM;AAkDHgD,QAAAA,YAAYC,SAAS;AAAA,IAAEC,WAAW;AAAA,EAAA,CAAd;AAE1B,MAAI7C,iBAAiB;AAAc,WAAA;AAGjC,6BAAA,OAAA;AAAA,IACE,KAAKF;AAAAA,IACL;AAAA,IACA,WAAWgD,GAAGH,WAAWlD,OAAOC,MAAnB;AAAA,IACb,yBAAyB;AAAA,MAAEqD,QAAQpD;AAAAA,IAAV;AAAA,EAAA,CAL7B;AAQD,CA3EuB;;"}