sanity-plugin-iframe-pane 2.3.1-beta.0 → 2.3.1-beta.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.
@@ -1,8 +1,10 @@
1
- import { jsx, jsxs } from 'react/jsx-runtime';
2
- import { useState, useRef, useEffect } from 'react';
3
- import { ThemeProvider, Flex, Spinner, Card, Button, Box, Text } from '@sanity/ui';
4
- import { MobileDeviceIcon, UndoIcon, CopyIcon, LeaveIcon } from '@sanity/icons';
5
- import { useCopyToClipboard } from 'usehooks-ts';
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var icons = require('@sanity/icons');
5
+ var ui = require('@sanity/ui');
6
+ var react = require('react');
7
+ var usehooksTs = require('usehooks-ts');
6
8
  const sizes = {
7
9
  desktop: {
8
10
  width: "100%",
@@ -29,15 +31,15 @@ function Iframe(props) {
29
31
  attributes = {},
30
32
  showDisplayUrl = true
31
33
  } = options;
32
- const [displayUrl, setDisplayUrl] = useState(url && typeof url === "string" ? url : "");
33
- const [iframeSize, setIframeSize] = useState((sizes == null ? void 0 : sizes[defaultSize]) ? defaultSize : DEFAULT_SIZE);
34
- const [loading, setLoading] = useState(false);
35
- const input = useRef(null);
36
- const iframe = useRef(null);
34
+ const [displayUrl, setDisplayUrl] = react.useState(url && typeof url === "string" ? url : "");
35
+ const [iframeSize, setIframeSize] = react.useState((sizes == null ? void 0 : sizes[defaultSize]) ? defaultSize : DEFAULT_SIZE);
36
+ const [loading, setLoading] = react.useState(false);
37
+ const input = react.useRef(null);
38
+ const iframe = react.useRef(null);
37
39
  const {
38
40
  displayed
39
41
  } = sanityDocument;
40
- const [, copy] = useCopyToClipboard();
42
+ const [, copy] = usehooksTs.useCopyToClipboard();
41
43
  function handleCopy() {
42
44
  var _a;
43
45
  if (!((_a = input == null ? void 0 : input.current) == null ? void 0 : _a.value)) return;
@@ -56,14 +58,14 @@ function Iframe(props) {
56
58
  attributes.onLoad();
57
59
  }
58
60
  }
59
- useEffect(() => {
61
+ react.useEffect(() => {
60
62
  if ((reload == null ? void 0 : reload.revision) || (reload == null ? void 0 : reload.revision) == 0) {
61
63
  setTimeout(() => {
62
64
  handleReload();
63
65
  }, Number(reload == null ? void 0 : reload.revision));
64
66
  }
65
67
  }, [displayed._rev, reload == null ? void 0 : reload.revision]);
66
- useEffect(() => {
68
+ react.useEffect(() => {
67
69
  const getUrl = async () => {
68
70
  setLoading(true);
69
71
  const resolveUrl = typeof url === "function" ? await url(displayed) : "";
@@ -76,17 +78,17 @@ function Iframe(props) {
76
78
  }
77
79
  }, [displayed._rev]);
78
80
  if (!displayUrl || typeof displayUrl !== "string") {
79
- return /* @__PURE__ */jsx(ThemeProvider, {
80
- children: /* @__PURE__ */jsx(Flex, {
81
+ return /* @__PURE__ */jsxRuntime.jsx(ui.ThemeProvider, {
82
+ children: /* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
81
83
  padding: 5,
82
84
  align: "center",
83
85
  justify: "center",
84
- children: /* @__PURE__ */jsx(Spinner, {})
86
+ children: /* @__PURE__ */jsxRuntime.jsx(ui.Spinner, {})
85
87
  })
86
88
  });
87
89
  }
88
- return /* @__PURE__ */jsxs(ThemeProvider, {
89
- children: [/* @__PURE__ */jsx("textarea", {
90
+ return /* @__PURE__ */jsxRuntime.jsxs(ui.ThemeProvider, {
91
+ children: [/* @__PURE__ */jsxRuntime.jsx("textarea", {
90
92
  style: {
91
93
  position: "absolute",
92
94
  pointerEvents: "none",
@@ -96,55 +98,55 @@ function Iframe(props) {
96
98
  value: displayUrl,
97
99
  readOnly: true,
98
100
  tabIndex: -1
99
- }), /* @__PURE__ */jsxs(Flex, {
101
+ }), /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
100
102
  direction: "column",
101
103
  style: {
102
104
  height: "100%"
103
105
  },
104
- children: [/* @__PURE__ */jsx(Card, {
106
+ children: [/* @__PURE__ */jsxRuntime.jsx(ui.Card, {
105
107
  padding: 2,
106
108
  borderBottom: true,
107
- children: /* @__PURE__ */jsxs(Flex, {
109
+ children: /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
108
110
  align: "center",
109
111
  gap: 2,
110
- children: [/* @__PURE__ */jsx(Flex, {
112
+ children: [/* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
111
113
  align: "center",
112
114
  gap: 1,
113
- children: /* @__PURE__ */jsx(Button, {
115
+ children: /* @__PURE__ */jsxRuntime.jsx(ui.Button, {
114
116
  fontSize: [1],
115
117
  padding: 2,
116
118
  tone: "primary",
117
119
  mode: iframeSize === "mobile" ? "default" : "ghost",
118
- icon: MobileDeviceIcon,
120
+ icon: icons.MobileDeviceIcon,
119
121
  onClick: () => setIframeSize(iframeSize === "mobile" ? "desktop" : "mobile")
120
122
  })
121
- }), /* @__PURE__ */jsx(Box, {
123
+ }), /* @__PURE__ */jsxRuntime.jsx(ui.Box, {
122
124
  flex: 1,
123
- children: showDisplayUrl && /* @__PURE__ */jsx(Text, {
125
+ children: showDisplayUrl && /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
124
126
  size: 0,
125
127
  textOverflow: "ellipsis",
126
128
  children: displayUrl
127
129
  })
128
- }), /* @__PURE__ */jsxs(Flex, {
130
+ }), /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
129
131
  align: "center",
130
132
  gap: 1,
131
- children: [(reload == null ? void 0 : reload.button) ? /* @__PURE__ */jsx(Button, {
133
+ children: [(reload == null ? void 0 : reload.button) ? /* @__PURE__ */jsxRuntime.jsx(ui.Button, {
132
134
  fontSize: [1],
133
135
  padding: 2,
134
- icon: UndoIcon,
136
+ icon: icons.UndoIcon,
135
137
  title: "Reload",
136
138
  "aria-label": "Reload",
137
139
  onClick: () => handleReload()
138
- }) : null, /* @__PURE__ */jsx(Button, {
140
+ }) : null, /* @__PURE__ */jsxRuntime.jsx(ui.Button, {
139
141
  fontSize: [1],
140
- icon: CopyIcon,
142
+ icon: icons.CopyIcon,
141
143
  padding: [2],
142
144
  title: "Copy",
143
145
  "aria-label": "Copy",
144
146
  onClick: () => handleCopy()
145
- }), /* @__PURE__ */jsx(Button, {
147
+ }), /* @__PURE__ */jsxRuntime.jsx(ui.Button, {
146
148
  fontSize: [1],
147
- icon: LeaveIcon,
149
+ icon: icons.LeaveIcon,
148
150
  padding: [2],
149
151
  text: "Open",
150
152
  tone: "primary",
@@ -152,51 +154,51 @@ function Iframe(props) {
152
154
  })]
153
155
  })]
154
156
  })
155
- }), /* @__PURE__ */jsx(Card, {
157
+ }), /* @__PURE__ */jsxRuntime.jsx(ui.Card, {
156
158
  tone: "transparent",
157
159
  padding: iframeSize === "mobile" ? 2 : 0,
158
160
  style: {
159
161
  height: "100%"
160
162
  },
161
- children: /* @__PURE__ */jsxs(Flex, {
163
+ children: /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
162
164
  align: "center",
163
165
  justify: "center",
164
166
  style: {
165
167
  height: "100%",
166
168
  position: "relative"
167
169
  },
168
- children: [loader && loading && /* @__PURE__ */jsx(Flex, {
170
+ children: [loader && loading && /* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
169
171
  justify: "center",
170
172
  align: "center",
171
173
  style: {
172
174
  inset: "0",
173
175
  position: "absolute"
174
176
  },
175
- children: /* @__PURE__ */jsx(Flex, {
177
+ children: /* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
176
178
  style: {
177
179
  ...sizes[iframeSize],
178
180
  backgroundColor: "rgba(0,0,0,0.2)"
179
181
  },
180
182
  justify: "center",
181
183
  align: "center",
182
- children: /* @__PURE__ */jsx(Card, {
184
+ children: /* @__PURE__ */jsxRuntime.jsx(ui.Card, {
183
185
  padding: 4,
184
186
  radius: 2,
185
187
  shadow: 1,
186
- children: /* @__PURE__ */jsxs(Flex, {
188
+ children: /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
187
189
  align: "center",
188
190
  direction: "column",
189
191
  gap: 3,
190
192
  height: "fill",
191
193
  justify: "center",
192
- children: [/* @__PURE__ */jsx(Spinner, {}), loader && typeof loader === "string" && /* @__PURE__ */jsx(Text, {
194
+ children: [/* @__PURE__ */jsxRuntime.jsx(ui.Spinner, {}), loader && typeof loader === "string" && /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
193
195
  size: 1,
194
196
  children: loader
195
197
  })]
196
198
  })
197
199
  })
198
200
  })
199
- }), /* @__PURE__ */jsx("iframe", {
201
+ }), /* @__PURE__ */jsxRuntime.jsx("iframe", {
200
202
  ref: iframe,
201
203
  title: "preview",
202
204
  style: sizes[iframeSize],
@@ -210,5 +212,5 @@ function Iframe(props) {
210
212
  })]
211
213
  });
212
214
  }
213
- export { Iframe as default };
214
- //# sourceMappingURL=index.esm.js.map
215
+ module.exports = Iframe;
216
+ //# sourceMappingURL=index.cjs.map
@@ -0,0 +1,3 @@
1
+ import cjs from './index.cjs';
2
+
3
+ export default cjs;
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.cjs","sources":["../src/Iframe.tsx"],"sourcesContent":["/* eslint-disable react/jsx-no-bind */\nimport {CopyIcon, LeaveIcon, MobileDeviceIcon, UndoIcon} from '@sanity/icons'\nimport {Box, Button, Card, Flex, Spinner, Text, ThemeProvider} from '@sanity/ui'\nimport React, {useEffect, useRef, useState} from 'react'\nimport {HTMLAttributeReferrerPolicy} from 'react'\nimport {SanityDocumentLike} from 'sanity'\nimport {useCopyToClipboard} from 'usehooks-ts'\n\ntype Size = 'desktop' | 'mobile'\n\ntype SizeProps = {\n // eslint-disable-next-line no-unused-vars\n [key in Size]: {\n width: string | number\n height: string | number\n maxHeight: string | number\n }\n}\n\nconst sizes: SizeProps = {\n desktop: {\n width: `100%`,\n height: `100%`,\n maxHeight: `100%`,\n },\n mobile: {\n width: 414,\n height: `100%`,\n maxHeight: 736,\n },\n}\n\nexport type IframeOptions = {\n url: string | ((document: SanityDocumentLike) => unknown)\n defaultSize?: 'desktop' | 'mobile'\n loader?: boolean | string\n showDisplayUrl?: boolean\n reload: {\n revision: boolean | number\n button: boolean\n }\n attributes?: Partial<{\n allow: string\n referrerPolicy: HTMLAttributeReferrerPolicy | undefined\n sandbox: string\n onLoad: () => void\n }>\n}\n\nexport type IframeProps = {\n document: {\n displayed: SanityDocumentLike\n }\n options: IframeOptions\n}\n\nconst DEFAULT_SIZE = `desktop`\n\nfunction Iframe(props: IframeProps) {\n const {document: sanityDocument, options} = props\n const {\n url,\n defaultSize = DEFAULT_SIZE,\n reload,\n loader,\n attributes = {},\n showDisplayUrl = true,\n } = options\n const [displayUrl, setDisplayUrl] = useState(url && typeof url === 'string' ? url : ``)\n const [iframeSize, setIframeSize] = useState(sizes?.[defaultSize] ? defaultSize : DEFAULT_SIZE)\n const [loading, setLoading] = useState(false)\n const input = useRef<HTMLTextAreaElement>(null)\n const iframe = useRef<HTMLIFrameElement>(null)\n const {displayed} = sanityDocument\n const [, copy] = useCopyToClipboard()\n\n function handleCopy() {\n if (!input?.current?.value) return\n\n copy(input.current.value)\n }\n\n function handleReload() {\n if (!iframe?.current) {\n return\n }\n\n // Funky way to reload an iframe without CORS issuies\n // eslint-disable-next-line no-self-assign\n iframe.current.src = iframe.current.src\n\n setLoading(true)\n }\n\n function handleIframeLoad() {\n setLoading(false)\n // Run onLoad from attributes\n if (attributes.onLoad && typeof attributes.onLoad === 'function') {\n attributes.onLoad()\n }\n }\n\n // Reload on new revisions\n useEffect(() => {\n if (reload?.revision || reload?.revision == 0) {\n setTimeout(() => {\n handleReload()\n }, Number(reload?.revision))\n }\n }, [displayed._rev, reload?.revision])\n\n // Set initial URL and refresh on new revisions\n useEffect(() => {\n const getUrl = async () => {\n setLoading(true)\n const resolveUrl = typeof url === 'function' ? await url(displayed) : ``\n\n // Only update state if URL has changed\n if (resolveUrl !== displayUrl && resolveUrl && typeof resolveUrl === 'string') {\n setDisplayUrl(resolveUrl)\n }\n }\n\n if (typeof url === 'function') {\n getUrl()\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [displayed._rev])\n\n if (!displayUrl || typeof displayUrl !== 'string') {\n return (\n <ThemeProvider>\n <Flex padding={5} align=\"center\" justify=\"center\">\n <Spinner />\n </Flex>\n </ThemeProvider>\n )\n }\n\n return (\n <ThemeProvider>\n <textarea\n style={{position: `absolute`, pointerEvents: `none`, opacity: 0}}\n ref={input}\n value={displayUrl}\n readOnly\n tabIndex={-1}\n />\n <Flex direction=\"column\" style={{height: `100%`}}>\n <Card padding={2} borderBottom>\n <Flex align=\"center\" gap={2}>\n <Flex align=\"center\" gap={1}>\n <Button\n fontSize={[1]}\n padding={2}\n tone=\"primary\"\n mode={iframeSize === 'mobile' ? 'default' : 'ghost'}\n icon={MobileDeviceIcon}\n onClick={() => setIframeSize(iframeSize === 'mobile' ? 'desktop' : 'mobile')}\n />\n </Flex>\n <Box flex={1}>\n {showDisplayUrl && (\n <Text size={0} textOverflow=\"ellipsis\">\n {displayUrl}\n </Text>\n )}\n </Box>\n <Flex align=\"center\" gap={1}>\n {reload?.button ? (\n <Button\n fontSize={[1]}\n padding={2}\n icon={UndoIcon}\n title=\"Reload\"\n aria-label=\"Reload\"\n onClick={() => handleReload()}\n />\n ) : null}\n <Button\n fontSize={[1]}\n icon={CopyIcon}\n padding={[2]}\n title=\"Copy\"\n aria-label=\"Copy\"\n onClick={() => handleCopy()}\n />\n <Button\n fontSize={[1]}\n icon={LeaveIcon}\n padding={[2]}\n text=\"Open\"\n tone=\"primary\"\n onClick={() => window.open(displayUrl)}\n />\n </Flex>\n </Flex>\n </Card>\n <Card tone=\"transparent\" padding={iframeSize === 'mobile' ? 2 : 0} style={{height: `100%`}}>\n <Flex align=\"center\" justify=\"center\" style={{height: `100%`, position: `relative`}}>\n {loader && loading && (\n <Flex justify=\"center\" align=\"center\" style={{inset: `0`, position: `absolute`}}>\n <Flex\n style={{...sizes[iframeSize], backgroundColor: `rgba(0,0,0,0.2)`}}\n justify=\"center\"\n align=\"center\"\n >\n <Card padding={4} radius={2} shadow={1}>\n <Flex align=\"center\" direction=\"column\" gap={3} height=\"fill\" justify=\"center\">\n <Spinner />\n {loader && typeof loader === 'string' && <Text size={1}>{loader}</Text>}\n </Flex>\n </Card>\n </Flex>\n </Flex>\n )}\n <iframe\n ref={iframe}\n title=\"preview\"\n style={sizes[iframeSize]}\n frameBorder=\"0\"\n src={displayUrl}\n {...attributes}\n onLoad={handleIframeLoad}\n />\n </Flex>\n </Card>\n </Flex>\n </ThemeProvider>\n )\n}\n\nexport default Iframe\n"],"names":["sizes","desktop","width","height","maxHeight","mobile","DEFAULT_SIZE","Iframe","props","document","sanityDocument","options","url","defaultSize","reload","loader","attributes","showDisplayUrl","displayUrl","setDisplayUrl","useState","iframeSize","setIframeSize","loading","setLoading","input","useRef","iframe","displayed","copy","useCopyToClipboard","handleCopy","_a","current","value","handleReload","src","handleIframeLoad","onLoad","useEffect","revision","setTimeout","Number","_rev","getUrl","resolveUrl","jsx","ThemeProvider","children","Flex","padding","align","justify","Spinner","style","position","pointerEvents","opacity","ref","readOnly","tabIndex","jsxs","direction","Card","borderBottom","gap","Button","fontSize","tone","mode","icon","MobileDeviceIcon","onClick","Box","flex","Text","size","textOverflow","button","UndoIcon","title","CopyIcon","LeaveIcon","text","window","open","inset","backgroundColor","radius","shadow","frameBorder"],"mappings":"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"}
package/lib/index.js CHANGED
@@ -1,10 +1,8 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var react = require('react');
5
- var ui = require('@sanity/ui');
6
- var icons = require('@sanity/icons');
7
- var usehooksTs = require('usehooks-ts');
1
+ import { jsx, jsxs } from 'react/jsx-runtime';
2
+ import { MobileDeviceIcon, UndoIcon, CopyIcon, LeaveIcon } from '@sanity/icons';
3
+ import { ThemeProvider, Flex, Spinner, Card, Button, Box, Text } from '@sanity/ui';
4
+ import { useState, useRef, useEffect } from 'react';
5
+ import { useCopyToClipboard } from 'usehooks-ts';
8
6
  const sizes = {
9
7
  desktop: {
10
8
  width: "100%",
@@ -31,15 +29,15 @@ function Iframe(props) {
31
29
  attributes = {},
32
30
  showDisplayUrl = true
33
31
  } = options;
34
- const [displayUrl, setDisplayUrl] = react.useState(url && typeof url === "string" ? url : "");
35
- const [iframeSize, setIframeSize] = react.useState((sizes == null ? void 0 : sizes[defaultSize]) ? defaultSize : DEFAULT_SIZE);
36
- const [loading, setLoading] = react.useState(false);
37
- const input = react.useRef(null);
38
- const iframe = react.useRef(null);
32
+ const [displayUrl, setDisplayUrl] = useState(url && typeof url === "string" ? url : "");
33
+ const [iframeSize, setIframeSize] = useState((sizes == null ? void 0 : sizes[defaultSize]) ? defaultSize : DEFAULT_SIZE);
34
+ const [loading, setLoading] = useState(false);
35
+ const input = useRef(null);
36
+ const iframe = useRef(null);
39
37
  const {
40
38
  displayed
41
39
  } = sanityDocument;
42
- const [, copy] = usehooksTs.useCopyToClipboard();
40
+ const [, copy] = useCopyToClipboard();
43
41
  function handleCopy() {
44
42
  var _a;
45
43
  if (!((_a = input == null ? void 0 : input.current) == null ? void 0 : _a.value)) return;
@@ -58,14 +56,14 @@ function Iframe(props) {
58
56
  attributes.onLoad();
59
57
  }
60
58
  }
61
- react.useEffect(() => {
59
+ useEffect(() => {
62
60
  if ((reload == null ? void 0 : reload.revision) || (reload == null ? void 0 : reload.revision) == 0) {
63
61
  setTimeout(() => {
64
62
  handleReload();
65
63
  }, Number(reload == null ? void 0 : reload.revision));
66
64
  }
67
65
  }, [displayed._rev, reload == null ? void 0 : reload.revision]);
68
- react.useEffect(() => {
66
+ useEffect(() => {
69
67
  const getUrl = async () => {
70
68
  setLoading(true);
71
69
  const resolveUrl = typeof url === "function" ? await url(displayed) : "";
@@ -78,17 +76,17 @@ function Iframe(props) {
78
76
  }
79
77
  }, [displayed._rev]);
80
78
  if (!displayUrl || typeof displayUrl !== "string") {
81
- return /* @__PURE__ */jsxRuntime.jsx(ui.ThemeProvider, {
82
- children: /* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
79
+ return /* @__PURE__ */jsx(ThemeProvider, {
80
+ children: /* @__PURE__ */jsx(Flex, {
83
81
  padding: 5,
84
82
  align: "center",
85
83
  justify: "center",
86
- children: /* @__PURE__ */jsxRuntime.jsx(ui.Spinner, {})
84
+ children: /* @__PURE__ */jsx(Spinner, {})
87
85
  })
88
86
  });
89
87
  }
90
- return /* @__PURE__ */jsxRuntime.jsxs(ui.ThemeProvider, {
91
- children: [/* @__PURE__ */jsxRuntime.jsx("textarea", {
88
+ return /* @__PURE__ */jsxs(ThemeProvider, {
89
+ children: [/* @__PURE__ */jsx("textarea", {
92
90
  style: {
93
91
  position: "absolute",
94
92
  pointerEvents: "none",
@@ -98,55 +96,55 @@ function Iframe(props) {
98
96
  value: displayUrl,
99
97
  readOnly: true,
100
98
  tabIndex: -1
101
- }), /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
99
+ }), /* @__PURE__ */jsxs(Flex, {
102
100
  direction: "column",
103
101
  style: {
104
102
  height: "100%"
105
103
  },
106
- children: [/* @__PURE__ */jsxRuntime.jsx(ui.Card, {
104
+ children: [/* @__PURE__ */jsx(Card, {
107
105
  padding: 2,
108
106
  borderBottom: true,
109
- children: /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
107
+ children: /* @__PURE__ */jsxs(Flex, {
110
108
  align: "center",
111
109
  gap: 2,
112
- children: [/* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
110
+ children: [/* @__PURE__ */jsx(Flex, {
113
111
  align: "center",
114
112
  gap: 1,
115
- children: /* @__PURE__ */jsxRuntime.jsx(ui.Button, {
113
+ children: /* @__PURE__ */jsx(Button, {
116
114
  fontSize: [1],
117
115
  padding: 2,
118
116
  tone: "primary",
119
117
  mode: iframeSize === "mobile" ? "default" : "ghost",
120
- icon: icons.MobileDeviceIcon,
118
+ icon: MobileDeviceIcon,
121
119
  onClick: () => setIframeSize(iframeSize === "mobile" ? "desktop" : "mobile")
122
120
  })
123
- }), /* @__PURE__ */jsxRuntime.jsx(ui.Box, {
121
+ }), /* @__PURE__ */jsx(Box, {
124
122
  flex: 1,
125
- children: showDisplayUrl && /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
123
+ children: showDisplayUrl && /* @__PURE__ */jsx(Text, {
126
124
  size: 0,
127
125
  textOverflow: "ellipsis",
128
126
  children: displayUrl
129
127
  })
130
- }), /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
128
+ }), /* @__PURE__ */jsxs(Flex, {
131
129
  align: "center",
132
130
  gap: 1,
133
- children: [(reload == null ? void 0 : reload.button) ? /* @__PURE__ */jsxRuntime.jsx(ui.Button, {
131
+ children: [(reload == null ? void 0 : reload.button) ? /* @__PURE__ */jsx(Button, {
134
132
  fontSize: [1],
135
133
  padding: 2,
136
- icon: icons.UndoIcon,
134
+ icon: UndoIcon,
137
135
  title: "Reload",
138
136
  "aria-label": "Reload",
139
137
  onClick: () => handleReload()
140
- }) : null, /* @__PURE__ */jsxRuntime.jsx(ui.Button, {
138
+ }) : null, /* @__PURE__ */jsx(Button, {
141
139
  fontSize: [1],
142
- icon: icons.CopyIcon,
140
+ icon: CopyIcon,
143
141
  padding: [2],
144
142
  title: "Copy",
145
143
  "aria-label": "Copy",
146
144
  onClick: () => handleCopy()
147
- }), /* @__PURE__ */jsxRuntime.jsx(ui.Button, {
145
+ }), /* @__PURE__ */jsx(Button, {
148
146
  fontSize: [1],
149
- icon: icons.LeaveIcon,
147
+ icon: LeaveIcon,
150
148
  padding: [2],
151
149
  text: "Open",
152
150
  tone: "primary",
@@ -154,51 +152,51 @@ function Iframe(props) {
154
152
  })]
155
153
  })]
156
154
  })
157
- }), /* @__PURE__ */jsxRuntime.jsx(ui.Card, {
155
+ }), /* @__PURE__ */jsx(Card, {
158
156
  tone: "transparent",
159
157
  padding: iframeSize === "mobile" ? 2 : 0,
160
158
  style: {
161
159
  height: "100%"
162
160
  },
163
- children: /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
161
+ children: /* @__PURE__ */jsxs(Flex, {
164
162
  align: "center",
165
163
  justify: "center",
166
164
  style: {
167
165
  height: "100%",
168
166
  position: "relative"
169
167
  },
170
- children: [loader && loading && /* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
168
+ children: [loader && loading && /* @__PURE__ */jsx(Flex, {
171
169
  justify: "center",
172
170
  align: "center",
173
171
  style: {
174
172
  inset: "0",
175
173
  position: "absolute"
176
174
  },
177
- children: /* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
175
+ children: /* @__PURE__ */jsx(Flex, {
178
176
  style: {
179
177
  ...sizes[iframeSize],
180
178
  backgroundColor: "rgba(0,0,0,0.2)"
181
179
  },
182
180
  justify: "center",
183
181
  align: "center",
184
- children: /* @__PURE__ */jsxRuntime.jsx(ui.Card, {
182
+ children: /* @__PURE__ */jsx(Card, {
185
183
  padding: 4,
186
184
  radius: 2,
187
185
  shadow: 1,
188
- children: /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
186
+ children: /* @__PURE__ */jsxs(Flex, {
189
187
  align: "center",
190
188
  direction: "column",
191
189
  gap: 3,
192
190
  height: "fill",
193
191
  justify: "center",
194
- children: [/* @__PURE__ */jsxRuntime.jsx(ui.Spinner, {}), loader && typeof loader === "string" && /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
192
+ children: [/* @__PURE__ */jsx(Spinner, {}), loader && typeof loader === "string" && /* @__PURE__ */jsx(Text, {
195
193
  size: 1,
196
194
  children: loader
197
195
  })]
198
196
  })
199
197
  })
200
198
  })
201
- }), /* @__PURE__ */jsxRuntime.jsx("iframe", {
199
+ }), /* @__PURE__ */jsx("iframe", {
202
200
  ref: iframe,
203
201
  title: "preview",
204
202
  style: sizes[iframeSize],
@@ -212,5 +210,5 @@ function Iframe(props) {
212
210
  })]
213
211
  });
214
212
  }
215
- module.exports = Iframe;
213
+ export { Iframe as default };
216
214
  //# sourceMappingURL=index.js.map
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../src/Iframe.tsx"],"sourcesContent":["/* eslint-disable react/jsx-no-bind */\nimport React, {useEffect, useState, useRef} from 'react'\nimport {SanityDocumentLike} from 'sanity'\nimport {Box, Flex, Text, Button, ThemeProvider, Card, Spinner} from '@sanity/ui'\nimport {UndoIcon, CopyIcon, LeaveIcon, MobileDeviceIcon} from '@sanity/icons'\nimport {HTMLAttributeReferrerPolicy} from 'react'\n\nimport {useCopyToClipboard} from 'usehooks-ts'\n\ntype Size = 'desktop' | 'mobile'\n\ntype SizeProps = {\n // eslint-disable-next-line no-unused-vars\n [key in Size]: {\n width: string | number\n height: string | number\n maxHeight: string | number\n }\n}\n\nconst sizes: SizeProps = {\n desktop: {\n width: `100%`,\n height: `100%`,\n maxHeight: `100%`,\n },\n mobile: {\n width: 414,\n height: `100%`,\n maxHeight: 736,\n },\n}\n\nexport type IframeOptions = {\n url: string | ((document: SanityDocumentLike) => unknown)\n defaultSize?: 'desktop' | 'mobile'\n loader?: boolean | string\n showDisplayUrl?: boolean\n reload: {\n revision: boolean | number\n button: boolean\n }\n attributes?: Partial<{\n allow: string\n referrerPolicy: HTMLAttributeReferrerPolicy | undefined\n sandbox: string\n onLoad: () => void\n }>\n}\n\nexport type IframeProps = {\n document: {\n displayed: SanityDocumentLike\n }\n options: IframeOptions\n}\n\nconst DEFAULT_SIZE = `desktop`\n\nfunction Iframe(props: IframeProps) {\n const {document: sanityDocument, options} = props\n const {\n url,\n defaultSize = DEFAULT_SIZE,\n reload,\n loader,\n attributes = {},\n showDisplayUrl = true,\n } = options\n const [displayUrl, setDisplayUrl] = useState(url && typeof url === 'string' ? url : ``)\n const [iframeSize, setIframeSize] = useState(sizes?.[defaultSize] ? defaultSize : DEFAULT_SIZE)\n const [loading, setLoading] = useState(false)\n const input = useRef<HTMLTextAreaElement>(null)\n const iframe = useRef<HTMLIFrameElement>(null)\n const {displayed} = sanityDocument\n const [, copy] = useCopyToClipboard()\n\n function handleCopy() {\n if (!input?.current?.value) return\n\n copy(input.current.value)\n }\n\n function handleReload() {\n if (!iframe?.current) {\n return\n }\n\n // Funky way to reload an iframe without CORS issuies\n // eslint-disable-next-line no-self-assign\n iframe.current.src = iframe.current.src\n\n setLoading(true)\n }\n\n function handleIframeLoad() {\n setLoading(false)\n // Run onLoad from attributes\n if (attributes.onLoad && typeof attributes.onLoad === 'function') {\n attributes.onLoad()\n }\n }\n\n // Reload on new revisions\n useEffect(() => {\n if (reload?.revision || reload?.revision == 0) {\n setTimeout(() => {\n handleReload()\n }, Number(reload?.revision))\n }\n }, [displayed._rev, reload?.revision])\n\n // Set initial URL and refresh on new revisions\n useEffect(() => {\n const getUrl = async () => {\n setLoading(true)\n const resolveUrl = typeof url === 'function' ? await url(displayed) : ``\n\n // Only update state if URL has changed\n if (resolveUrl !== displayUrl && resolveUrl && typeof resolveUrl === 'string') {\n setDisplayUrl(resolveUrl)\n }\n }\n\n if (typeof url === 'function') {\n getUrl()\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [displayed._rev])\n\n if (!displayUrl || typeof displayUrl !== 'string') {\n return (\n <ThemeProvider>\n <Flex padding={5} align=\"center\" justify=\"center\">\n <Spinner />\n </Flex>\n </ThemeProvider>\n )\n }\n\n return (\n <ThemeProvider>\n <textarea\n style={{position: `absolute`, pointerEvents: `none`, opacity: 0}}\n ref={input}\n value={displayUrl}\n readOnly\n tabIndex={-1}\n />\n <Flex direction=\"column\" style={{height: `100%`}}>\n <Card padding={2} borderBottom>\n <Flex align=\"center\" gap={2}>\n <Flex align=\"center\" gap={1}>\n <Button\n fontSize={[1]}\n padding={2}\n tone=\"primary\"\n mode={iframeSize === 'mobile' ? 'default' : 'ghost'}\n icon={MobileDeviceIcon}\n onClick={() => setIframeSize(iframeSize === 'mobile' ? 'desktop' : 'mobile')}\n />\n </Flex>\n <Box flex={1}>\n {showDisplayUrl && (\n <Text size={0} textOverflow=\"ellipsis\">\n {displayUrl}\n </Text>\n )}\n </Box>\n <Flex align=\"center\" gap={1}>\n {reload?.button ? (\n <Button\n fontSize={[1]}\n padding={2}\n icon={UndoIcon}\n title=\"Reload\"\n aria-label=\"Reload\"\n onClick={() => handleReload()}\n />\n ) : null}\n <Button\n fontSize={[1]}\n icon={CopyIcon}\n padding={[2]}\n title=\"Copy\"\n aria-label=\"Copy\"\n onClick={() => handleCopy()}\n />\n <Button\n fontSize={[1]}\n icon={LeaveIcon}\n padding={[2]}\n text=\"Open\"\n tone=\"primary\"\n onClick={() => window.open(displayUrl)}\n />\n </Flex>\n </Flex>\n </Card>\n <Card tone=\"transparent\" padding={iframeSize === 'mobile' ? 2 : 0} style={{height: `100%`}}>\n <Flex align=\"center\" justify=\"center\" style={{height: `100%`, position: `relative`}}>\n {loader && loading && (\n <Flex justify=\"center\" align=\"center\" style={{inset: `0`, position: `absolute`}}>\n <Flex\n style={{...sizes[iframeSize], backgroundColor: `rgba(0,0,0,0.2)`}}\n justify=\"center\"\n align=\"center\"\n >\n <Card padding={4} radius={2} shadow={1}>\n <Flex align=\"center\" direction=\"column\" gap={3} height=\"fill\" justify=\"center\">\n <Spinner />\n {loader && typeof loader === 'string' && <Text size={1}>{loader}</Text>}\n </Flex>\n </Card>\n </Flex>\n </Flex>\n )}\n <iframe\n ref={iframe}\n title=\"preview\"\n style={sizes[iframeSize]}\n frameBorder=\"0\"\n src={displayUrl}\n {...attributes}\n onLoad={handleIframeLoad}\n />\n </Flex>\n </Card>\n </Flex>\n </ThemeProvider>\n )\n}\n\nexport default Iframe\n"],"names":["sizes","desktop","width","height","maxHeight","mobile","DEFAULT_SIZE","Iframe","props","document","sanityDocument","options","url","defaultSize","reload","loader","attributes","showDisplayUrl","displayUrl","setDisplayUrl","useState","iframeSize","setIframeSize","loading","setLoading","input","useRef","iframe","displayed","copy","useCopyToClipboard","handleCopy","_a","current","value","handleReload","src","handleIframeLoad","onLoad","useEffect","revision","setTimeout","Number","_rev","getUrl","resolveUrl","jsx","ThemeProvider","children","Flex","padding","align","justify","Spinner","style","position","pointerEvents","opacity","ref","readOnly","tabIndex","jsxs","direction","Card","borderBottom","gap","Button","fontSize","tone","mode","icon","MobileDeviceIcon","onClick","Box","flex","Text","size","textOverflow","button","UndoIcon","title","CopyIcon","LeaveIcon","text","window","open","inset","backgroundColor","radius","shadow","frameBorder"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../src/Iframe.tsx"],"sourcesContent":["/* eslint-disable react/jsx-no-bind */\nimport {CopyIcon, LeaveIcon, MobileDeviceIcon, UndoIcon} from '@sanity/icons'\nimport {Box, Button, Card, Flex, Spinner, Text, ThemeProvider} from '@sanity/ui'\nimport React, {useEffect, useRef, useState} from 'react'\nimport {HTMLAttributeReferrerPolicy} from 'react'\nimport {SanityDocumentLike} from 'sanity'\nimport {useCopyToClipboard} from 'usehooks-ts'\n\ntype Size = 'desktop' | 'mobile'\n\ntype SizeProps = {\n // eslint-disable-next-line no-unused-vars\n [key in Size]: {\n width: string | number\n height: string | number\n maxHeight: string | number\n }\n}\n\nconst sizes: SizeProps = {\n desktop: {\n width: `100%`,\n height: `100%`,\n maxHeight: `100%`,\n },\n mobile: {\n width: 414,\n height: `100%`,\n maxHeight: 736,\n },\n}\n\nexport type IframeOptions = {\n url: string | ((document: SanityDocumentLike) => unknown)\n defaultSize?: 'desktop' | 'mobile'\n loader?: boolean | string\n showDisplayUrl?: boolean\n reload: {\n revision: boolean | number\n button: boolean\n }\n attributes?: Partial<{\n allow: string\n referrerPolicy: HTMLAttributeReferrerPolicy | undefined\n sandbox: string\n onLoad: () => void\n }>\n}\n\nexport type IframeProps = {\n document: {\n displayed: SanityDocumentLike\n }\n options: IframeOptions\n}\n\nconst DEFAULT_SIZE = `desktop`\n\nfunction Iframe(props: IframeProps) {\n const {document: sanityDocument, options} = props\n const {\n url,\n defaultSize = DEFAULT_SIZE,\n reload,\n loader,\n attributes = {},\n showDisplayUrl = true,\n } = options\n const [displayUrl, setDisplayUrl] = useState(url && typeof url === 'string' ? url : ``)\n const [iframeSize, setIframeSize] = useState(sizes?.[defaultSize] ? defaultSize : DEFAULT_SIZE)\n const [loading, setLoading] = useState(false)\n const input = useRef<HTMLTextAreaElement>(null)\n const iframe = useRef<HTMLIFrameElement>(null)\n const {displayed} = sanityDocument\n const [, copy] = useCopyToClipboard()\n\n function handleCopy() {\n if (!input?.current?.value) return\n\n copy(input.current.value)\n }\n\n function handleReload() {\n if (!iframe?.current) {\n return\n }\n\n // Funky way to reload an iframe without CORS issuies\n // eslint-disable-next-line no-self-assign\n iframe.current.src = iframe.current.src\n\n setLoading(true)\n }\n\n function handleIframeLoad() {\n setLoading(false)\n // Run onLoad from attributes\n if (attributes.onLoad && typeof attributes.onLoad === 'function') {\n attributes.onLoad()\n }\n }\n\n // Reload on new revisions\n useEffect(() => {\n if (reload?.revision || reload?.revision == 0) {\n setTimeout(() => {\n handleReload()\n }, Number(reload?.revision))\n }\n }, [displayed._rev, reload?.revision])\n\n // Set initial URL and refresh on new revisions\n useEffect(() => {\n const getUrl = async () => {\n setLoading(true)\n const resolveUrl = typeof url === 'function' ? await url(displayed) : ``\n\n // Only update state if URL has changed\n if (resolveUrl !== displayUrl && resolveUrl && typeof resolveUrl === 'string') {\n setDisplayUrl(resolveUrl)\n }\n }\n\n if (typeof url === 'function') {\n getUrl()\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [displayed._rev])\n\n if (!displayUrl || typeof displayUrl !== 'string') {\n return (\n <ThemeProvider>\n <Flex padding={5} align=\"center\" justify=\"center\">\n <Spinner />\n </Flex>\n </ThemeProvider>\n )\n }\n\n return (\n <ThemeProvider>\n <textarea\n style={{position: `absolute`, pointerEvents: `none`, opacity: 0}}\n ref={input}\n value={displayUrl}\n readOnly\n tabIndex={-1}\n />\n <Flex direction=\"column\" style={{height: `100%`}}>\n <Card padding={2} borderBottom>\n <Flex align=\"center\" gap={2}>\n <Flex align=\"center\" gap={1}>\n <Button\n fontSize={[1]}\n padding={2}\n tone=\"primary\"\n mode={iframeSize === 'mobile' ? 'default' : 'ghost'}\n icon={MobileDeviceIcon}\n onClick={() => setIframeSize(iframeSize === 'mobile' ? 'desktop' : 'mobile')}\n />\n </Flex>\n <Box flex={1}>\n {showDisplayUrl && (\n <Text size={0} textOverflow=\"ellipsis\">\n {displayUrl}\n </Text>\n )}\n </Box>\n <Flex align=\"center\" gap={1}>\n {reload?.button ? (\n <Button\n fontSize={[1]}\n padding={2}\n icon={UndoIcon}\n title=\"Reload\"\n aria-label=\"Reload\"\n onClick={() => handleReload()}\n />\n ) : null}\n <Button\n fontSize={[1]}\n icon={CopyIcon}\n padding={[2]}\n title=\"Copy\"\n aria-label=\"Copy\"\n onClick={() => handleCopy()}\n />\n <Button\n fontSize={[1]}\n icon={LeaveIcon}\n padding={[2]}\n text=\"Open\"\n tone=\"primary\"\n onClick={() => window.open(displayUrl)}\n />\n </Flex>\n </Flex>\n </Card>\n <Card tone=\"transparent\" padding={iframeSize === 'mobile' ? 2 : 0} style={{height: `100%`}}>\n <Flex align=\"center\" justify=\"center\" style={{height: `100%`, position: `relative`}}>\n {loader && loading && (\n <Flex justify=\"center\" align=\"center\" style={{inset: `0`, position: `absolute`}}>\n <Flex\n style={{...sizes[iframeSize], backgroundColor: `rgba(0,0,0,0.2)`}}\n justify=\"center\"\n align=\"center\"\n >\n <Card padding={4} radius={2} shadow={1}>\n <Flex align=\"center\" direction=\"column\" gap={3} height=\"fill\" justify=\"center\">\n <Spinner />\n {loader && typeof loader === 'string' && <Text size={1}>{loader}</Text>}\n </Flex>\n </Card>\n </Flex>\n </Flex>\n )}\n <iframe\n ref={iframe}\n title=\"preview\"\n style={sizes[iframeSize]}\n frameBorder=\"0\"\n src={displayUrl}\n {...attributes}\n onLoad={handleIframeLoad}\n />\n </Flex>\n </Card>\n </Flex>\n </ThemeProvider>\n )\n}\n\nexport default Iframe\n"],"names":["sizes","desktop","width","height","maxHeight","mobile","DEFAULT_SIZE","Iframe","props","document","sanityDocument","options","url","defaultSize","reload","loader","attributes","showDisplayUrl","displayUrl","setDisplayUrl","useState","iframeSize","setIframeSize","loading","setLoading","input","useRef","iframe","displayed","copy","useCopyToClipboard","handleCopy","_a","current","value","handleReload","src","handleIframeLoad","onLoad","useEffect","revision","setTimeout","Number","_rev","getUrl","resolveUrl","jsx","ThemeProvider","children","Flex","padding","align","justify","Spinner","style","position","pointerEvents","opacity","ref","readOnly","tabIndex","jsxs","direction","Card","borderBottom","gap","Button","fontSize","tone","mode","icon","MobileDeviceIcon","onClick","Box","flex","Text","size","textOverflow","button","UndoIcon","title","CopyIcon","LeaveIcon","text","window","open","inset","backgroundColor","radius","shadow","frameBorder"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sanity-plugin-iframe-pane",
3
- "version": "2.3.1-beta.0",
3
+ "version": "2.3.1-beta.1",
4
4
  "description": "Display any URL in a View Pane, along with helpful buttons to Copy the URL or open in a new tab",
5
5
  "homepage": "https://github.com/sanity-io/sanity-plugin-iframe-pane#readme",
6
6
  "bugs": {
@@ -13,20 +13,25 @@
13
13
  "license": "MIT",
14
14
  "author": "Sanity.io <hello@sanity.io>",
15
15
  "sideEffects": false,
16
+ "type": "module",
16
17
  "exports": {
17
18
  ".": {
18
- "types": "./lib/src/index.d.ts",
19
+ "types": "./lib/index.d.ts",
19
20
  "source": "./src/index.ts",
20
- "require": "./lib/index.js",
21
- "import": "./lib/index.esm.js",
22
- "default": "./lib/index.esm.js"
21
+ "require": "./lib/index.cjs",
22
+ "node": {
23
+ "import": "./lib/index.cjs.js",
24
+ "require": "./lib/index.cjs"
25
+ },
26
+ "import": "./lib/index.js",
27
+ "default": "./lib/index.js"
23
28
  },
24
29
  "./package.json": "./package.json"
25
30
  },
26
- "main": "./lib/index.js",
27
- "module": "./lib/index.esm.js",
31
+ "main": "./lib/index.cjs",
32
+ "module": "./lib/index.js",
28
33
  "source": "./src/index.ts",
29
- "types": "./lib/src/index.d.ts",
34
+ "types": "./lib/index.d.ts",
30
35
  "files": [
31
36
  "src",
32
37
  "lib",
@@ -34,14 +39,15 @@
34
39
  "v2-incompatible.js"
35
40
  ],
36
41
  "scripts": {
37
- "prebuild": "npm run clean && plugin-kit verify-package --silent && pkg-utils",
38
42
  "build": "run-s clean && plugin-kit verify-package --silent && pkg-utils build --strict && pkg-utils --strict",
39
43
  "clean": "rimraf lib",
40
44
  "format": "prettier --write --cache --ignore-unknown .",
41
45
  "link-watch": "plugin-kit link-watch",
42
46
  "lint": "eslint .",
43
- "prepare": "husky install",
47
+ "prepare": "husky install || true",
44
48
  "prepublishOnly": "run-s build",
49
+ "test": "npm run lint && npm run type-check && npm run build",
50
+ "type-check": "tsc --noEmit",
45
51
  "watch": "pkg-utils watch --strict"
46
52
  },
47
53
  "dependencies": {
@@ -58,12 +64,15 @@
58
64
  "@sanity/semantic-release-preset": "^4.1.1",
59
65
  "@typescript-eslint/eslint-plugin": "^5.59.7",
60
66
  "@typescript-eslint/parser": "^5.59.7",
61
- "eslint": "^8.41.0",
62
- "eslint-config-prettier": "^8.8.0",
67
+ "eslint": "^8.36.0",
68
+ "eslint-config-prettier": "^8.7.0",
69
+ "eslint-config-react-app": "^7.0.1",
63
70
  "eslint-config-sanity": "^6.0.0",
71
+ "eslint-plugin-import": "^2.27.5",
64
72
  "eslint-plugin-prettier": "^4.2.1",
65
73
  "eslint-plugin-react": "^7.32.2",
66
74
  "eslint-plugin-react-hooks": "^4.6.0",
75
+ "eslint-plugin-simple-import-sort": "^10.0.0",
67
76
  "husky": "^8.0.3",
68
77
  "lint-staged": "^13.2.2",
69
78
  "npm-run-all": "^4.1.5",
@@ -79,7 +88,6 @@
79
88
  },
80
89
  "peerDependencies": {
81
90
  "react": "^18",
82
- "react-dom": "^18",
83
91
  "sanity": "^3",
84
92
  "styled-components": "^5.2"
85
93
  },
package/src/Iframe.tsx CHANGED
@@ -1,10 +1,9 @@
1
1
  /* eslint-disable react/jsx-no-bind */
2
- import React, {useEffect, useState, useRef} from 'react'
3
- import {SanityDocumentLike} from 'sanity'
4
- import {Box, Flex, Text, Button, ThemeProvider, Card, Spinner} from '@sanity/ui'
5
- import {UndoIcon, CopyIcon, LeaveIcon, MobileDeviceIcon} from '@sanity/icons'
2
+ import {CopyIcon, LeaveIcon, MobileDeviceIcon, UndoIcon} from '@sanity/icons'
3
+ import {Box, Button, Card, Flex, Spinner, Text, ThemeProvider} from '@sanity/ui'
4
+ import React, {useEffect, useRef, useState} from 'react'
6
5
  import {HTMLAttributeReferrerPolicy} from 'react'
7
-
6
+ import {SanityDocumentLike} from 'sanity'
8
7
  import {useCopyToClipboard} from 'usehooks-ts'
9
8
 
10
9
  type Size = 'desktop' | 'mobile'
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.esm.js","sources":["../src/Iframe.tsx"],"sourcesContent":["/* eslint-disable react/jsx-no-bind */\nimport React, {useEffect, useState, useRef} from 'react'\nimport {SanityDocumentLike} from 'sanity'\nimport {Box, Flex, Text, Button, ThemeProvider, Card, Spinner} from '@sanity/ui'\nimport {UndoIcon, CopyIcon, LeaveIcon, MobileDeviceIcon} from '@sanity/icons'\nimport {HTMLAttributeReferrerPolicy} from 'react'\n\nimport {useCopyToClipboard} from 'usehooks-ts'\n\ntype Size = 'desktop' | 'mobile'\n\ntype SizeProps = {\n // eslint-disable-next-line no-unused-vars\n [key in Size]: {\n width: string | number\n height: string | number\n maxHeight: string | number\n }\n}\n\nconst sizes: SizeProps = {\n desktop: {\n width: `100%`,\n height: `100%`,\n maxHeight: `100%`,\n },\n mobile: {\n width: 414,\n height: `100%`,\n maxHeight: 736,\n },\n}\n\nexport type IframeOptions = {\n url: string | ((document: SanityDocumentLike) => unknown)\n defaultSize?: 'desktop' | 'mobile'\n loader?: boolean | string\n showDisplayUrl?: boolean\n reload: {\n revision: boolean | number\n button: boolean\n }\n attributes?: Partial<{\n allow: string\n referrerPolicy: HTMLAttributeReferrerPolicy | undefined\n sandbox: string\n onLoad: () => void\n }>\n}\n\nexport type IframeProps = {\n document: {\n displayed: SanityDocumentLike\n }\n options: IframeOptions\n}\n\nconst DEFAULT_SIZE = `desktop`\n\nfunction Iframe(props: IframeProps) {\n const {document: sanityDocument, options} = props\n const {\n url,\n defaultSize = DEFAULT_SIZE,\n reload,\n loader,\n attributes = {},\n showDisplayUrl = true,\n } = options\n const [displayUrl, setDisplayUrl] = useState(url && typeof url === 'string' ? url : ``)\n const [iframeSize, setIframeSize] = useState(sizes?.[defaultSize] ? defaultSize : DEFAULT_SIZE)\n const [loading, setLoading] = useState(false)\n const input = useRef<HTMLTextAreaElement>(null)\n const iframe = useRef<HTMLIFrameElement>(null)\n const {displayed} = sanityDocument\n const [, copy] = useCopyToClipboard()\n\n function handleCopy() {\n if (!input?.current?.value) return\n\n copy(input.current.value)\n }\n\n function handleReload() {\n if (!iframe?.current) {\n return\n }\n\n // Funky way to reload an iframe without CORS issuies\n // eslint-disable-next-line no-self-assign\n iframe.current.src = iframe.current.src\n\n setLoading(true)\n }\n\n function handleIframeLoad() {\n setLoading(false)\n // Run onLoad from attributes\n if (attributes.onLoad && typeof attributes.onLoad === 'function') {\n attributes.onLoad()\n }\n }\n\n // Reload on new revisions\n useEffect(() => {\n if (reload?.revision || reload?.revision == 0) {\n setTimeout(() => {\n handleReload()\n }, Number(reload?.revision))\n }\n }, [displayed._rev, reload?.revision])\n\n // Set initial URL and refresh on new revisions\n useEffect(() => {\n const getUrl = async () => {\n setLoading(true)\n const resolveUrl = typeof url === 'function' ? await url(displayed) : ``\n\n // Only update state if URL has changed\n if (resolveUrl !== displayUrl && resolveUrl && typeof resolveUrl === 'string') {\n setDisplayUrl(resolveUrl)\n }\n }\n\n if (typeof url === 'function') {\n getUrl()\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [displayed._rev])\n\n if (!displayUrl || typeof displayUrl !== 'string') {\n return (\n <ThemeProvider>\n <Flex padding={5} align=\"center\" justify=\"center\">\n <Spinner />\n </Flex>\n </ThemeProvider>\n )\n }\n\n return (\n <ThemeProvider>\n <textarea\n style={{position: `absolute`, pointerEvents: `none`, opacity: 0}}\n ref={input}\n value={displayUrl}\n readOnly\n tabIndex={-1}\n />\n <Flex direction=\"column\" style={{height: `100%`}}>\n <Card padding={2} borderBottom>\n <Flex align=\"center\" gap={2}>\n <Flex align=\"center\" gap={1}>\n <Button\n fontSize={[1]}\n padding={2}\n tone=\"primary\"\n mode={iframeSize === 'mobile' ? 'default' : 'ghost'}\n icon={MobileDeviceIcon}\n onClick={() => setIframeSize(iframeSize === 'mobile' ? 'desktop' : 'mobile')}\n />\n </Flex>\n <Box flex={1}>\n {showDisplayUrl && (\n <Text size={0} textOverflow=\"ellipsis\">\n {displayUrl}\n </Text>\n )}\n </Box>\n <Flex align=\"center\" gap={1}>\n {reload?.button ? (\n <Button\n fontSize={[1]}\n padding={2}\n icon={UndoIcon}\n title=\"Reload\"\n aria-label=\"Reload\"\n onClick={() => handleReload()}\n />\n ) : null}\n <Button\n fontSize={[1]}\n icon={CopyIcon}\n padding={[2]}\n title=\"Copy\"\n aria-label=\"Copy\"\n onClick={() => handleCopy()}\n />\n <Button\n fontSize={[1]}\n icon={LeaveIcon}\n padding={[2]}\n text=\"Open\"\n tone=\"primary\"\n onClick={() => window.open(displayUrl)}\n />\n </Flex>\n </Flex>\n </Card>\n <Card tone=\"transparent\" padding={iframeSize === 'mobile' ? 2 : 0} style={{height: `100%`}}>\n <Flex align=\"center\" justify=\"center\" style={{height: `100%`, position: `relative`}}>\n {loader && loading && (\n <Flex justify=\"center\" align=\"center\" style={{inset: `0`, position: `absolute`}}>\n <Flex\n style={{...sizes[iframeSize], backgroundColor: `rgba(0,0,0,0.2)`}}\n justify=\"center\"\n align=\"center\"\n >\n <Card padding={4} radius={2} shadow={1}>\n <Flex align=\"center\" direction=\"column\" gap={3} height=\"fill\" justify=\"center\">\n <Spinner />\n {loader && typeof loader === 'string' && <Text size={1}>{loader}</Text>}\n </Flex>\n </Card>\n </Flex>\n </Flex>\n )}\n <iframe\n ref={iframe}\n title=\"preview\"\n style={sizes[iframeSize]}\n frameBorder=\"0\"\n src={displayUrl}\n {...attributes}\n onLoad={handleIframeLoad}\n />\n </Flex>\n </Card>\n </Flex>\n </ThemeProvider>\n )\n}\n\nexport default Iframe\n"],"names":["sizes","desktop","width","height","maxHeight","mobile","DEFAULT_SIZE","Iframe","props","document","sanityDocument","options","url","defaultSize","reload","loader","attributes","showDisplayUrl","displayUrl","setDisplayUrl","useState","iframeSize","setIframeSize","loading","setLoading","input","useRef","iframe","displayed","copy","useCopyToClipboard","handleCopy","_a","current","value","handleReload","src","handleIframeLoad","onLoad","useEffect","revision","setTimeout","Number","_rev","getUrl","resolveUrl","jsx","ThemeProvider","children","Flex","padding","align","justify","Spinner","style","position","pointerEvents","opacity","ref","readOnly","tabIndex","jsxs","direction","Card","borderBottom","gap","Button","fontSize","tone","mode","icon","MobileDeviceIcon","onClick","Box","flex","Text","size","textOverflow","button","UndoIcon","title","CopyIcon","LeaveIcon","text","window","open","inset","backgroundColor","radius","shadow","frameBorder"],"mappings":"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"}
File without changes