next-sanity 3.0.4 → 3.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -224,14 +224,12 @@ export {PreviewSuspense as default} from 'next-sanity/preview'
224
224
  `app/page.js`:
225
225
 
226
226
  ```jsx
227
- import {lazy} from 'react'
228
227
  import {previewData} from 'next/headers'
229
228
  import PreviewSuspense from 'components/PreviewSuspense'
230
229
  import {DocumentsCount, query} from 'components/DocumentsCount'
230
+ import PreviewDocumentsCount from 'components/PreviewDocumentsCount'
231
231
  import {client} from 'lib/sanity.client'
232
232
 
233
- const PreviewDocumentsCount = lazy(() => import('components/PreviewDocumentsCount'))
234
-
235
233
  export default async function IndexPage() {
236
234
  if (previewData()) {
237
235
  return (
@@ -400,10 +398,9 @@ import {lazy} from 'react'
400
398
  import {previewData} from 'next/headers'
401
399
  import PreviewSuspense from 'components/PreviewSuspense'
402
400
  import {DocumentsCount, query} from 'components/DocumentsCount'
401
+ import PreviewDocumentsCount from 'components/PreviewDocumentsCount'
403
402
  import {client} from 'lib/sanity.client'
404
403
 
405
- const PreviewDocumentsCount = lazy(() => import('components/PreviewDocumentsCount'))
406
-
407
404
  export default async function IndexPage() {
408
405
  if (previewData()?.token) {
409
406
  return (
@@ -525,6 +522,7 @@ export default function StudioPage() {
525
522
  }
526
523
  ```
527
524
 
525
+ Set the right `viewport` meta tag, favicons and mroe
528
526
  `app/studio/[[...index]]/head.tsx`:
529
527
 
530
528
  ```tsx
@@ -549,6 +547,20 @@ export default function CustomStudioHead() {
549
547
  }
550
548
  ```
551
549
 
550
+ Improve the Studio loading experience by setting a `loading.tsx` route.
551
+ `app/studio/[[...index]]/loading.tsx`:
552
+
553
+ ```tsx
554
+ 'use client'
555
+
556
+ import config from '../../../sanity.config'
557
+ import NextStudioLoading from 'next-sanity/studio/loading'
558
+
559
+ export default function Loading() {
560
+ return <NextStudioLoading config={config} />
561
+ }
562
+ ```
563
+
552
564
  #### Next 12 or `pages/studio`
553
565
 
554
566
  Using just `NextStudio` gives you a fully working Sanity Studio v3. However we recommend also using `NextStudioHead` as it ensures CSS Media Queries that target mobile devices with display cutouts (for example iPhone's "The Notch" and "Dynamic Island") and other details.
@@ -0,0 +1,112 @@
1
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
+ import { SpinnerIcon } from '@sanity/icons';
3
+ import { _responsive, rem } from '@sanity/ui';
4
+ import { useMemo } from 'react';
5
+ import { defaultTheme } from 'sanity';
6
+ function isWorkspaces(config) {
7
+ return Array.isArray(config);
8
+ }
9
+ function isWorkspaceWithTheme(workspace) {
10
+ return Boolean(workspace.theme);
11
+ }
12
+ function useTheme(config) {
13
+ const workspace = useMemo(() => isWorkspaces(config) ? config[0] : config, [config]);
14
+ return useMemo(() => isWorkspaceWithTheme(workspace) ? workspace.theme : defaultTheme, [workspace]);
15
+ }
16
+ const style = {
17
+ __html: "\n.sanity-app-no-js__root {\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n background: #fff;\n z-index: 1;\n}\n\n.sanity-app-no-js__content {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n text-align: center;\n font-family: helvetica, arial, sans-serif;\n}\n"
18
+ };
19
+ const NextStudioNoScript = () => /* @__PURE__ */jsx("noscript", {
20
+ children: /* @__PURE__ */jsx("div", {
21
+ className: "sanity-app-no-js__root",
22
+ children: /* @__PURE__ */jsxs("div", {
23
+ className: "sanity-app-no-js__content",
24
+ children: [/* @__PURE__ */jsx("style", {
25
+ type: "text/css",
26
+ dangerouslySetInnerHTML: style
27
+ }), /* @__PURE__ */jsx("h1", {
28
+ children: "JavaScript disabled"
29
+ }), /* @__PURE__ */jsxs("p", {
30
+ children: ["Please ", /* @__PURE__ */jsx("a", {
31
+ href: "https://www.enable-javascript.com/",
32
+ children: "enable JavaScript"
33
+ }), " in your browser and reload the page to proceed."]
34
+ })]
35
+ })
36
+ })
37
+ });
38
+ const keyframes = "\nfrom {\n transform: rotate(0deg);\n}\n\nto {\n transform: rotate(360deg);\n}\n";
39
+ function NextStudioLoading(props) {
40
+ const {
41
+ config,
42
+ scheme = "light",
43
+ unstable__noScript = true
44
+ } = props;
45
+ const id = "next-sanity-spinner";
46
+ const theme = useTheme(config);
47
+ const {
48
+ fonts,
49
+ media
50
+ } = theme;
51
+ const styles = _responsive(media, [2], size => {
52
+ const {
53
+ ascenderHeight,
54
+ descenderHeight,
55
+ lineHeight,
56
+ iconSize
57
+ } = fonts.text.sizes[size];
58
+ const capHeight = lineHeight - ascenderHeight - descenderHeight;
59
+ return {
60
+ wrapper: {
61
+ animation: "".concat(id, " 500ms linear infinite"),
62
+ color: theme.color[scheme].default.muted.default.enabled.muted.fg,
63
+ width: rem(capHeight),
64
+ height: rem(capHeight)
65
+ },
66
+ svg: {
67
+ display: "block",
68
+ width: rem(iconSize),
69
+ height: rem(iconSize),
70
+ margin: (capHeight - iconSize) / 2
71
+ }
72
+ };
73
+ })[0];
74
+ return /* @__PURE__ */jsxs(Fragment, {
75
+ children: [unstable__noScript && /* @__PURE__ */jsx(NextStudioNoScript, {}), /* @__PURE__ */jsx("div", {
76
+ style: {
77
+ fontFamily: fonts.text.family,
78
+ backgroundColor: theme.color[scheme].default.base.bg,
79
+ height: "100vh",
80
+ maxHeight: "100dvh",
81
+ overscrollBehavior: "none",
82
+ WebkitFontSmoothing: "antialiased",
83
+ overflow: "auto"
84
+ },
85
+ children: /* @__PURE__ */jsxs("div", {
86
+ "data-ui": "Flex",
87
+ style: {
88
+ display: "flex",
89
+ minWidth: 0,
90
+ minHeight: 0,
91
+ alignItems: "center",
92
+ justifyContent: "center",
93
+ flexDirection: "column",
94
+ height: "100%",
95
+ margin: 0,
96
+ padding: 0
97
+ },
98
+ children: [/* @__PURE__ */jsx("style", {
99
+ children: "@keyframes ".concat(id, " {").concat(keyframes, "}")
100
+ }, scheme), /* @__PURE__ */jsx("div", {
101
+ "data-ui": "Spinner",
102
+ style: styles.wrapper,
103
+ children: /* @__PURE__ */jsx(SpinnerIcon, {
104
+ style: styles.svg
105
+ })
106
+ })]
107
+ })
108
+ })]
109
+ });
110
+ }
111
+ export { NextStudioLoading as N, NextStudioNoScript as a, useTheme as u };
112
+ //# sourceMappingURL=NextStudioLoading-3a59a7d7.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"NextStudioLoading-3a59a7d7.js","sources":["../../src/studio/useTheme.ts","../../src/studio/NextStudioNoScript.tsx","../../src/studio/NextStudioLoading.tsx"],"sourcesContent":["import {useMemo} from 'react'\nimport {\n type Config,\n type SingleWorkspace,\n type StudioTheme,\n type WorkspaceOptions,\n defaultTheme,\n} from 'sanity'\n\ntype WithTheme = {\n theme: StudioTheme\n}\ntype SingleWorkspaceWithTheme = Omit<SingleWorkspace, 'theme'> & WithTheme\ntype WorkspaceOptionsWithTheme = Omit<WorkspaceOptions, 'theme'> & WithTheme\n\nfunction isWorkspaces(config: Config): config is WorkspaceOptions[] {\n return Array.isArray(config)\n}\n\nfunction isWorkspaceWithTheme(\n workspace: SingleWorkspace | WorkspaceOptions\n): workspace is SingleWorkspaceWithTheme | WorkspaceOptionsWithTheme {\n return Boolean(workspace.theme)\n}\n\n/** @alpha */\nexport function useTheme(config: Config): StudioTheme {\n const workspace = useMemo<SingleWorkspace | WorkspaceOptions>(\n () => (isWorkspaces(config) ? config[0] : config),\n [config]\n )\n return useMemo<StudioTheme>(\n () => (isWorkspaceWithTheme(workspace) ? workspace.theme : defaultTheme),\n [workspace]\n )\n}\n","/* eslint-disable react/no-danger */\n\nconst style = {\n __html: `\n.sanity-app-no-js__root {\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n background: #fff;\n z-index: 1;\n}\n\n.sanity-app-no-js__content {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n text-align: center;\n font-family: helvetica, arial, sans-serif;\n}\n`,\n} as const\n\n/** @alpha */\nexport const NextStudioNoScript = () => (\n <noscript>\n <div className=\"sanity-app-no-js__root\">\n <div className=\"sanity-app-no-js__content\">\n <style type=\"text/css\" dangerouslySetInnerHTML={style} />\n <h1>JavaScript disabled</h1>\n <p>\n Please <a href=\"https://www.enable-javascript.com/\">enable JavaScript</a> in your\n browser and reload the page to proceed.\n </p>\n </div>\n </div>\n </noscript>\n)\n","// Intentionally not using `styled-components` to ensure it works in any `next` setup.\n// Wether 'styled-components' SSR is setup or not.\n\nimport {SpinnerIcon} from '@sanity/icons'\nimport {_responsive, rem} from '@sanity/ui'\nimport type {StudioProps} from 'sanity'\n\nimport {NextStudioNoScript} from './NextStudioNoScript'\nimport {useTheme} from './useTheme'\n\n/** @alpha */\nexport interface NextStudioLoadingProps extends Pick<StudioProps, 'config' | 'scheme'> {\n /**\n * Render the <noscript> tag\n * @defaultValue true\n * @alpha\n */\n unstable__noScript?: boolean\n}\n\nconst keyframes = `\nfrom {\n transform: rotate(0deg);\n}\n\nto {\n transform: rotate(360deg);\n}\n`\n\nexport function NextStudioLoading(props: NextStudioLoadingProps) {\n const {config, scheme = 'light', unstable__noScript = true} = props\n const id = 'next-sanity-spinner'\n const theme = useTheme(config)\n const {fonts, media} = theme\n\n const styles: any = _responsive(media, [2], (size: number) => {\n const {ascenderHeight, descenderHeight, lineHeight, iconSize} = fonts.text.sizes[size]\n const capHeight = lineHeight - ascenderHeight - descenderHeight\n\n return {\n wrapper: {\n animation: `${id} 500ms linear infinite`,\n color: theme.color[scheme].default.muted.default.enabled.muted.fg,\n width: rem(capHeight),\n height: rem(capHeight),\n },\n svg: {\n display: 'block',\n width: rem(iconSize),\n height: rem(iconSize),\n margin: (capHeight - iconSize) / 2,\n },\n }\n })[0]\n\n return (\n <>\n {unstable__noScript && <NextStudioNoScript />}\n <div\n style={{\n fontFamily: fonts.text.family,\n backgroundColor: theme.color[scheme].default.base.bg,\n height: '100vh',\n maxHeight: '100dvh',\n overscrollBehavior: 'none',\n WebkitFontSmoothing: 'antialiased',\n overflow: 'auto',\n }}\n >\n <div\n data-ui=\"Flex\"\n style={{\n display: 'flex',\n minWidth: 0,\n minHeight: 0,\n alignItems: 'center',\n justifyContent: 'center',\n flexDirection: 'column',\n height: '100%',\n margin: 0,\n padding: 0,\n }}\n >\n <style key={scheme}>{`@keyframes ${id} {${keyframes}}`}</style>\n <div data-ui=\"Spinner\" style={styles.wrapper}>\n <SpinnerIcon style={styles.svg} />\n </div>\n </div>\n </div>\n </>\n )\n}\n"],"names":["isWorkspaces","config","Array","isArray","isWorkspaceWithTheme","workspace","Boolean","theme","useTheme","useMemo","defaultTheme","style","__html","NextStudioNoScript","jsx","children","className","jsxs","type","dangerouslySetInnerHTML","href","keyframes","NextStudioLoading","props","scheme","unstable__noScript","id","fonts","media","styles","_responsive","size","ascenderHeight","descenderHeight","lineHeight","iconSize","text","sizes","capHeight","wrapper","animation","color","default","muted","enabled","fg","width","rem","height","svg","display","margin","Fragment","fontFamily","family","backgroundColor","base","bg","maxHeight","overscrollBehavior","WebkitFontSmoothing","overflow","minWidth","minHeight","alignItems","justifyContent","flexDirection","padding","SpinnerIcon"],"mappings":"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"}
@@ -0,0 +1,116 @@
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 sanity = require('sanity');
8
+ function isWorkspaces(config) {
9
+ return Array.isArray(config);
10
+ }
11
+ function isWorkspaceWithTheme(workspace) {
12
+ return Boolean(workspace.theme);
13
+ }
14
+ function useTheme(config) {
15
+ const workspace = react.useMemo(() => isWorkspaces(config) ? config[0] : config, [config]);
16
+ return react.useMemo(() => isWorkspaceWithTheme(workspace) ? workspace.theme : sanity.defaultTheme, [workspace]);
17
+ }
18
+ const style = {
19
+ __html: "\n.sanity-app-no-js__root {\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n background: #fff;\n z-index: 1;\n}\n\n.sanity-app-no-js__content {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n text-align: center;\n font-family: helvetica, arial, sans-serif;\n}\n"
20
+ };
21
+ const NextStudioNoScript = () => /* @__PURE__ */jsxRuntime.jsx("noscript", {
22
+ children: /* @__PURE__ */jsxRuntime.jsx("div", {
23
+ className: "sanity-app-no-js__root",
24
+ children: /* @__PURE__ */jsxRuntime.jsxs("div", {
25
+ className: "sanity-app-no-js__content",
26
+ children: [/* @__PURE__ */jsxRuntime.jsx("style", {
27
+ type: "text/css",
28
+ dangerouslySetInnerHTML: style
29
+ }), /* @__PURE__ */jsxRuntime.jsx("h1", {
30
+ children: "JavaScript disabled"
31
+ }), /* @__PURE__ */jsxRuntime.jsxs("p", {
32
+ children: ["Please ", /* @__PURE__ */jsxRuntime.jsx("a", {
33
+ href: "https://www.enable-javascript.com/",
34
+ children: "enable JavaScript"
35
+ }), " in your browser and reload the page to proceed."]
36
+ })]
37
+ })
38
+ })
39
+ });
40
+ const keyframes = "\nfrom {\n transform: rotate(0deg);\n}\n\nto {\n transform: rotate(360deg);\n}\n";
41
+ function NextStudioLoading(props) {
42
+ const {
43
+ config,
44
+ scheme = "light",
45
+ unstable__noScript = true
46
+ } = props;
47
+ const id = "next-sanity-spinner";
48
+ const theme = useTheme(config);
49
+ const {
50
+ fonts,
51
+ media
52
+ } = theme;
53
+ const styles = ui._responsive(media, [2], size => {
54
+ const {
55
+ ascenderHeight,
56
+ descenderHeight,
57
+ lineHeight,
58
+ iconSize
59
+ } = fonts.text.sizes[size];
60
+ const capHeight = lineHeight - ascenderHeight - descenderHeight;
61
+ return {
62
+ wrapper: {
63
+ animation: "".concat(id, " 500ms linear infinite"),
64
+ color: theme.color[scheme].default.muted.default.enabled.muted.fg,
65
+ width: ui.rem(capHeight),
66
+ height: ui.rem(capHeight)
67
+ },
68
+ svg: {
69
+ display: "block",
70
+ width: ui.rem(iconSize),
71
+ height: ui.rem(iconSize),
72
+ margin: (capHeight - iconSize) / 2
73
+ }
74
+ };
75
+ })[0];
76
+ return /* @__PURE__ */jsxRuntime.jsxs(jsxRuntime.Fragment, {
77
+ children: [unstable__noScript && /* @__PURE__ */jsxRuntime.jsx(NextStudioNoScript, {}), /* @__PURE__ */jsxRuntime.jsx("div", {
78
+ style: {
79
+ fontFamily: fonts.text.family,
80
+ backgroundColor: theme.color[scheme].default.base.bg,
81
+ height: "100vh",
82
+ maxHeight: "100dvh",
83
+ overscrollBehavior: "none",
84
+ WebkitFontSmoothing: "antialiased",
85
+ overflow: "auto"
86
+ },
87
+ children: /* @__PURE__ */jsxRuntime.jsxs("div", {
88
+ "data-ui": "Flex",
89
+ style: {
90
+ display: "flex",
91
+ minWidth: 0,
92
+ minHeight: 0,
93
+ alignItems: "center",
94
+ justifyContent: "center",
95
+ flexDirection: "column",
96
+ height: "100%",
97
+ margin: 0,
98
+ padding: 0
99
+ },
100
+ children: [/* @__PURE__ */jsxRuntime.jsx("style", {
101
+ children: "@keyframes ".concat(id, " {").concat(keyframes, "}")
102
+ }, scheme), /* @__PURE__ */jsxRuntime.jsx("div", {
103
+ "data-ui": "Spinner",
104
+ style: styles.wrapper,
105
+ children: /* @__PURE__ */jsxRuntime.jsx(icons.SpinnerIcon, {
106
+ style: styles.svg
107
+ })
108
+ })]
109
+ })
110
+ })]
111
+ });
112
+ }
113
+ exports.NextStudioLoading = NextStudioLoading;
114
+ exports.NextStudioNoScript = NextStudioNoScript;
115
+ exports.useTheme = useTheme;
116
+ //# sourceMappingURL=NextStudioLoading-d668a359.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"NextStudioLoading-d668a359.cjs","sources":["../../src/studio/useTheme.ts","../../src/studio/NextStudioNoScript.tsx","../../src/studio/NextStudioLoading.tsx"],"sourcesContent":["import {useMemo} from 'react'\nimport {\n type Config,\n type SingleWorkspace,\n type StudioTheme,\n type WorkspaceOptions,\n defaultTheme,\n} from 'sanity'\n\ntype WithTheme = {\n theme: StudioTheme\n}\ntype SingleWorkspaceWithTheme = Omit<SingleWorkspace, 'theme'> & WithTheme\ntype WorkspaceOptionsWithTheme = Omit<WorkspaceOptions, 'theme'> & WithTheme\n\nfunction isWorkspaces(config: Config): config is WorkspaceOptions[] {\n return Array.isArray(config)\n}\n\nfunction isWorkspaceWithTheme(\n workspace: SingleWorkspace | WorkspaceOptions\n): workspace is SingleWorkspaceWithTheme | WorkspaceOptionsWithTheme {\n return Boolean(workspace.theme)\n}\n\n/** @alpha */\nexport function useTheme(config: Config): StudioTheme {\n const workspace = useMemo<SingleWorkspace | WorkspaceOptions>(\n () => (isWorkspaces(config) ? config[0] : config),\n [config]\n )\n return useMemo<StudioTheme>(\n () => (isWorkspaceWithTheme(workspace) ? workspace.theme : defaultTheme),\n [workspace]\n )\n}\n","/* eslint-disable react/no-danger */\n\nconst style = {\n __html: `\n.sanity-app-no-js__root {\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n background: #fff;\n z-index: 1;\n}\n\n.sanity-app-no-js__content {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n text-align: center;\n font-family: helvetica, arial, sans-serif;\n}\n`,\n} as const\n\n/** @alpha */\nexport const NextStudioNoScript = () => (\n <noscript>\n <div className=\"sanity-app-no-js__root\">\n <div className=\"sanity-app-no-js__content\">\n <style type=\"text/css\" dangerouslySetInnerHTML={style} />\n <h1>JavaScript disabled</h1>\n <p>\n Please <a href=\"https://www.enable-javascript.com/\">enable JavaScript</a> in your\n browser and reload the page to proceed.\n </p>\n </div>\n </div>\n </noscript>\n)\n","// Intentionally not using `styled-components` to ensure it works in any `next` setup.\n// Wether 'styled-components' SSR is setup or not.\n\nimport {SpinnerIcon} from '@sanity/icons'\nimport {_responsive, rem} from '@sanity/ui'\nimport type {StudioProps} from 'sanity'\n\nimport {NextStudioNoScript} from './NextStudioNoScript'\nimport {useTheme} from './useTheme'\n\n/** @alpha */\nexport interface NextStudioLoadingProps extends Pick<StudioProps, 'config' | 'scheme'> {\n /**\n * Render the <noscript> tag\n * @defaultValue true\n * @alpha\n */\n unstable__noScript?: boolean\n}\n\nconst keyframes = `\nfrom {\n transform: rotate(0deg);\n}\n\nto {\n transform: rotate(360deg);\n}\n`\n\nexport function NextStudioLoading(props: NextStudioLoadingProps) {\n const {config, scheme = 'light', unstable__noScript = true} = props\n const id = 'next-sanity-spinner'\n const theme = useTheme(config)\n const {fonts, media} = theme\n\n const styles: any = _responsive(media, [2], (size: number) => {\n const {ascenderHeight, descenderHeight, lineHeight, iconSize} = fonts.text.sizes[size]\n const capHeight = lineHeight - ascenderHeight - descenderHeight\n\n return {\n wrapper: {\n animation: `${id} 500ms linear infinite`,\n color: theme.color[scheme].default.muted.default.enabled.muted.fg,\n width: rem(capHeight),\n height: rem(capHeight),\n },\n svg: {\n display: 'block',\n width: rem(iconSize),\n height: rem(iconSize),\n margin: (capHeight - iconSize) / 2,\n },\n }\n })[0]\n\n return (\n <>\n {unstable__noScript && <NextStudioNoScript />}\n <div\n style={{\n fontFamily: fonts.text.family,\n backgroundColor: theme.color[scheme].default.base.bg,\n height: '100vh',\n maxHeight: '100dvh',\n overscrollBehavior: 'none',\n WebkitFontSmoothing: 'antialiased',\n overflow: 'auto',\n }}\n >\n <div\n data-ui=\"Flex\"\n style={{\n display: 'flex',\n minWidth: 0,\n minHeight: 0,\n alignItems: 'center',\n justifyContent: 'center',\n flexDirection: 'column',\n height: '100%',\n margin: 0,\n padding: 0,\n }}\n >\n <style key={scheme}>{`@keyframes ${id} {${keyframes}}`}</style>\n <div data-ui=\"Spinner\" style={styles.wrapper}>\n <SpinnerIcon style={styles.svg} />\n </div>\n </div>\n </div>\n </>\n )\n}\n"],"names":["isWorkspaces","config","Array","isArray","isWorkspaceWithTheme","workspace","Boolean","theme","useTheme","useMemo","defaultTheme","style","__html","NextStudioNoScript","jsx","children","className","jsxs","type","dangerouslySetInnerHTML","href","keyframes","NextStudioLoading","props","scheme","unstable__noScript","id","fonts","media","styles","_responsive","size","ascenderHeight","descenderHeight","lineHeight","iconSize","text","sizes","capHeight","wrapper","animation","color","default","muted","enabled","fg","width","rem","height","svg","display","margin","Fragment","fontFamily","family","backgroundColor","base","bg","maxHeight","overscrollBehavior","WebkitFontSmoothing","overflow","minWidth","minHeight","alignItems","justifyContent","flexDirection","padding","SpinnerIcon"],"mappings":"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"}
@@ -13,121 +13,52 @@ Object.defineProperty(exports, '__esModule', {
13
13
  });
14
14
  var jsxRuntime = require('react/jsx-runtime');
15
15
  var react = require('react');
16
- var icons = require('@sanity/icons');
17
- var ui = require('@sanity/ui');
18
16
  var sanity = require('sanity');
19
17
  var styled = require('styled-components');
18
+ var NextStudioLoading = require('../_chunks/NextStudioLoading-d668a359.cjs');
19
+ require('@sanity/icons');
20
+ require('@sanity/ui');
20
21
  function _interopDefaultLegacy(e) {
21
22
  return e && typeof e === 'object' && 'default' in e ? e : {
22
23
  'default': e
23
24
  };
24
25
  }
25
26
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
26
- function isWorkspaces(config) {
27
- return Array.isArray(config);
28
- }
29
- function isWorkspaceWithTheme(workspace) {
30
- return Boolean(workspace.theme);
31
- }
32
- function useTheme(config) {
33
- const workspace = react.useMemo(() => isWorkspaces(config) ? config[0] : config, [config]);
34
- return react.useMemo(() => isWorkspaceWithTheme(workspace) ? workspace.theme : sanity.defaultTheme, [workspace]);
35
- }
36
- const keyframes = "\nfrom {\n transform: rotate(0deg);\n}\n\nto {\n transform: rotate(360deg);\n}\n";
37
- function NextStudioFallbackComponent(props) {
38
- const {
39
- config,
40
- scheme = "light"
41
- } = props;
42
- const id = "next-sanity-spinner";
43
- const theme = useTheme(config);
44
- const {
45
- fonts,
46
- media
47
- } = theme;
48
- const styles = ui._responsive(media, [2], size => {
49
- const {
50
- ascenderHeight,
51
- descenderHeight,
52
- lineHeight,
53
- iconSize
54
- } = fonts.text.sizes[size];
55
- const capHeight = lineHeight - ascenderHeight - descenderHeight;
56
- return {
57
- wrapper: {
58
- animation: "".concat(id, " 500ms linear infinite"),
59
- color: theme.color[scheme].default.muted.default.enabled.muted.fg,
60
- width: ui.rem(capHeight),
61
- height: ui.rem(capHeight)
62
- },
63
- svg: {
64
- display: "block",
65
- width: ui.rem(iconSize),
66
- height: ui.rem(iconSize),
67
- margin: (capHeight - iconSize) / 2
68
- }
69
- };
70
- })[0];
71
- return /* @__PURE__ */jsxRuntime.jsx("div", {
72
- style: {
73
- fontFamily: fonts.text.family,
74
- backgroundColor: theme.color[scheme].default.base.bg,
75
- height: "100vh",
76
- maxHeight: "100dvh",
77
- overscrollBehavior: "none",
78
- WebkitFontSmoothing: "antialiased",
79
- overflow: "auto"
80
- },
81
- children: /* @__PURE__ */jsxRuntime.jsxs("div", {
82
- "data-ui": "Flex",
83
- style: {
84
- display: "flex",
85
- minWidth: 0,
86
- minHeight: 0,
87
- alignItems: "center",
88
- justifyContent: "center",
89
- flexDirection: "column",
90
- height: "100%",
91
- margin: 0,
92
- padding: 0
93
- },
94
- children: [/* @__PURE__ */jsxRuntime.jsx("style", {
95
- children: "@keyframes ".concat(id, " {").concat(keyframes, "}")
96
- }, scheme), /* @__PURE__ */jsxRuntime.jsx("div", {
97
- "data-ui": "Spinner",
98
- style: styles.wrapper,
99
- children: /* @__PURE__ */jsxRuntime.jsx(icons.SpinnerIcon, {
100
- style: styles.svg
101
- })
102
- })]
103
- })
27
+ function NextStudioClientOnly(_ref) {
28
+ let {
29
+ children,
30
+ fallback
31
+ } = _ref;
32
+ const [mounted, setMounted] = react.useState(false);
33
+ react.useEffect(() => react.startTransition(() => setMounted(true)), []);
34
+ return /* @__PURE__ */jsxRuntime.jsx(jsxRuntime.Fragment, {
35
+ children: mounted ? children : fallback
104
36
  });
105
37
  }
106
- const NextStudioFallback = react.memo(NextStudioFallbackComponent);
107
- const Layout = styled__default["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-family: ", ";\n background-color: ", ";\n height: 100vh;\n max-height: 100dvh;\n overscroll-behavior: none;\n -webkit-font-smoothing: antialiased;\n overflow: auto;\n\n ", "\n"])), _ref => {
38
+ const Layout = styled__default["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-family: ", ";\n background-color: ", ";\n height: 100vh;\n max-height: 100dvh;\n overscroll-behavior: none;\n -webkit-font-smoothing: antialiased;\n overflow: auto;\n\n ", "\n"])), _ref2 => {
108
39
  let {
109
40
  $fontFamily
110
- } = _ref;
41
+ } = _ref2;
111
42
  return $fontFamily;
112
- }, _ref2 => {
43
+ }, _ref3 => {
113
44
  let {
114
45
  $bg
115
- } = _ref2;
46
+ } = _ref3;
116
47
  return $bg;
117
- }, _ref3 => {
48
+ }, _ref4 => {
118
49
  let {
119
50
  $unstable__tailwindSvgFix
120
- } = _ref3;
51
+ } = _ref4;
121
52
  return $unstable__tailwindSvgFix ? styled.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n /* override tailwind reset */\n *:not([data-ui='Popover__arrow']):not([data-ui='Tooltip__arrow']) > svg {\n display: inline;\n }\n "]))) : "";
122
53
  });
123
- const NextStudioLayoutComponent = _ref4 => {
54
+ const NextStudioLayoutComponent = _ref5 => {
124
55
  let {
125
56
  children,
126
57
  config,
127
58
  scheme = "light",
128
59
  unstable__tailwindSvgFix = true
129
- } = _ref4;
130
- const theme = useTheme(config);
60
+ } = _ref5;
61
+ const theme = NextStudioLoading.useTheme(config);
131
62
  return /* @__PURE__ */jsxRuntime.jsx(Layout, {
132
63
  "data-ui": "NextStudioLayout",
133
64
  $unstable__tailwindSvgFix: unstable__tailwindSvgFix,
@@ -137,69 +68,31 @@ const NextStudioLayoutComponent = _ref4 => {
137
68
  });
138
69
  };
139
70
  const NextStudioLayout = react.memo(NextStudioLayoutComponent);
140
- const style = {
141
- __html: "\n.sanity-app-no-js__root {\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n background: #fff;\n z-index: 1;\n}\n\n.sanity-app-no-js__content {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n text-align: center;\n font-family: helvetica, arial, sans-serif;\n}\n"
142
- };
143
- const NextStudioNoScript = () => /* @__PURE__ */jsxRuntime.jsx("noscript", {
144
- children: /* @__PURE__ */jsxRuntime.jsx("div", {
145
- className: "sanity-app-no-js__root",
146
- children: /* @__PURE__ */jsxRuntime.jsxs("div", {
147
- className: "sanity-app-no-js__content",
148
- children: [/* @__PURE__ */jsxRuntime.jsx("style", {
149
- type: "text/css",
150
- dangerouslySetInnerHTML: style
151
- }), /* @__PURE__ */jsxRuntime.jsx("h1", {
152
- children: "JavaScript disabled"
153
- }), /* @__PURE__ */jsxRuntime.jsxs("p", {
154
- children: ["Please ", /* @__PURE__ */jsxRuntime.jsx("a", {
155
- href: "https://www.enable-javascript.com/",
156
- children: "enable JavaScript"
157
- }), " in your browser and reload the page to proceed."]
158
- })]
159
- })
160
- })
161
- });
162
- function NextStudioSuspense(_ref5) {
163
- let {
164
- children,
165
- fallback
166
- } = _ref5;
167
- const [mounted, mount] = react.useReducer(() => true, false);
168
- react.useEffect(mount, [mount]);
169
- return /* @__PURE__ */jsxRuntime.jsx(react.Suspense, {
170
- fallback,
171
- children: mounted ? children : fallback
172
- });
173
- }
174
- const Studio = react.memo(react.lazy(() => Promise.resolve().then(function () {
175
- return require('../_chunks/LazyStudio-bf7e0fc9.cjs');
176
- })));
177
71
  const NextStudioComponent = _ref6 => {
178
72
  let {
179
73
  children,
180
74
  config,
181
75
  unstable__tailwindSvgFix = true,
182
- unstable__noScript = true,
76
+ unstable__noScript,
183
77
  scheme
184
78
  } = _ref6,
185
79
  props = _objectWithoutProperties(_ref6, _excluded);
186
- return /* @__PURE__ */jsxRuntime.jsxs(jsxRuntime.Fragment, {
187
- children: [!unstable__noScript && /* @__PURE__ */jsxRuntime.jsx(NextStudioNoScript, {}), /* @__PURE__ */jsxRuntime.jsx(NextStudioSuspense, {
188
- fallback: /* @__PURE__ */jsxRuntime.jsx(NextStudioFallback, {
189
- config,
190
- scheme
191
- }),
192
- children: /* @__PURE__ */jsxRuntime.jsx(NextStudioLayout, {
80
+ return /* @__PURE__ */jsxRuntime.jsx(NextStudioClientOnly, {
81
+ fallback: /* @__PURE__ */jsxRuntime.jsx(NextStudioLoading.NextStudioLoading, {
82
+ unstable__noScript,
83
+ config,
84
+ scheme
85
+ }),
86
+ children: /* @__PURE__ */jsxRuntime.jsx(NextStudioLayout, {
87
+ config,
88
+ scheme,
89
+ unstable__tailwindSvgFix,
90
+ children: children || /* @__PURE__ */jsxRuntime.jsx(sanity.Studio, _objectSpread({
193
91
  config,
194
92
  scheme,
195
- unstable__tailwindSvgFix,
196
- children: children || /* @__PURE__ */jsxRuntime.jsx(Studio, _objectSpread({
197
- config,
198
- scheme,
199
- unstable_globalStyles: true
200
- }, props))
201
- })
202
- })]
93
+ unstable_globalStyles: true
94
+ }, props))
95
+ })
203
96
  });
204
97
  };
205
98
  const NextStudio = react.memo(NextStudioComponent);
@@ -225,11 +118,10 @@ const store = createStore();
225
118
  function usePrefersColorScheme() {
226
119
  return react.useSyncExternalStore(store.subscribe, store.getSnapshot, store.getServerSnapshot);
227
120
  }
121
+ exports.NextStudioNoScript = NextStudioLoading.NextStudioNoScript;
122
+ exports.useTheme = NextStudioLoading.useTheme;
228
123
  exports.NextStudio = NextStudio;
229
- exports.NextStudioFallback = NextStudioFallback;
124
+ exports.NextStudioClientOnly = NextStudioClientOnly;
230
125
  exports.NextStudioLayout = NextStudioLayout;
231
- exports.NextStudioNoScript = NextStudioNoScript;
232
- exports.NextStudioSuspense = NextStudioSuspense;
233
126
  exports.usePrefersColorScheme = usePrefersColorScheme;
234
- exports.useTheme = useTheme;
235
127
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":["../../src/studio/useTheme.ts","../../src/studio/NextStudioFallback.tsx","../../src/studio/NextStudioLayout.tsx","../../src/studio/NextStudioNoScript.tsx","../../src/studio/NextStudioSuspense.tsx","../../src/studio/NextStudio.tsx","../../src/studio/usePrefersColorScheme.ts"],"sourcesContent":["import {useMemo} from 'react'\nimport {\n type Config,\n type SingleWorkspace,\n type StudioTheme,\n type WorkspaceOptions,\n defaultTheme,\n} from 'sanity'\n\ntype WithTheme = {\n theme: StudioTheme\n}\ntype SingleWorkspaceWithTheme = Omit<SingleWorkspace, 'theme'> & WithTheme\ntype WorkspaceOptionsWithTheme = Omit<WorkspaceOptions, 'theme'> & WithTheme\n\nfunction isWorkspaces(config: Config): config is WorkspaceOptions[] {\n return Array.isArray(config)\n}\n\nfunction isWorkspaceWithTheme(\n workspace: SingleWorkspace | WorkspaceOptions\n): workspace is SingleWorkspaceWithTheme | WorkspaceOptionsWithTheme {\n return Boolean(workspace.theme)\n}\n\n/** @alpha */\nexport function useTheme(config: Config): StudioTheme {\n const workspace = useMemo<SingleWorkspace | WorkspaceOptions>(\n () => (isWorkspaces(config) ? config[0] : config),\n [config]\n )\n return useMemo<StudioTheme>(\n () => (isWorkspaceWithTheme(workspace) ? workspace.theme : defaultTheme),\n [workspace]\n )\n}\n","// Intentionally not using `styled-components` to ensure it works in any `next` setup.\n// Wether 'styled-components' SSR is setup or not.\n\nimport {SpinnerIcon} from '@sanity/icons'\nimport {_responsive, rem} from '@sanity/ui'\nimport {memo} from 'react'\nimport type {StudioProps} from 'sanity'\n\nimport {useTheme} from './useTheme'\n\n/** @alpha */\nexport type NextStudioFallbackProps = Pick<StudioProps, 'config' | 'scheme'>\n\nconst keyframes = `\nfrom {\n transform: rotate(0deg);\n}\n\nto {\n transform: rotate(360deg);\n}\n`\n\nfunction NextStudioFallbackComponent(props: NextStudioFallbackProps) {\n const {config, scheme = 'light'} = props\n const id = 'next-sanity-spinner'\n const theme = useTheme(config)\n const {fonts, media} = theme\n\n const styles: any = _responsive(media, [2], (size: number) => {\n const {ascenderHeight, descenderHeight, lineHeight, iconSize} = fonts.text.sizes[size]\n const capHeight = lineHeight - ascenderHeight - descenderHeight\n\n return {\n wrapper: {\n animation: `${id} 500ms linear infinite`,\n color: theme.color[scheme].default.muted.default.enabled.muted.fg,\n width: rem(capHeight),\n height: rem(capHeight),\n },\n svg: {\n display: 'block',\n width: rem(iconSize),\n height: rem(iconSize),\n margin: (capHeight - iconSize) / 2,\n },\n }\n })[0]\n\n return (\n <div\n style={{\n fontFamily: fonts.text.family,\n backgroundColor: theme.color[scheme].default.base.bg,\n height: '100vh',\n maxHeight: '100dvh',\n overscrollBehavior: 'none',\n WebkitFontSmoothing: 'antialiased',\n overflow: 'auto',\n }}\n >\n <div\n data-ui=\"Flex\"\n style={{\n display: 'flex',\n minWidth: 0,\n minHeight: 0,\n alignItems: 'center',\n justifyContent: 'center',\n flexDirection: 'column',\n height: '100%',\n margin: 0,\n padding: 0,\n }}\n >\n <style key={scheme}>{`@keyframes ${id} {${keyframes}}`}</style>\n <div data-ui=\"Spinner\" style={styles.wrapper}>\n <SpinnerIcon style={styles.svg} />\n </div>\n </div>\n </div>\n )\n}\n\n/** @alpha */\nexport const NextStudioFallback = memo(NextStudioFallbackComponent)\n","/* eslint-disable camelcase */\nimport {memo} from 'react'\nimport type {StudioProps} from 'sanity'\nimport styled, {css} from 'styled-components'\n\nimport {useTheme} from './useTheme'\n\n/** @alpha */\nexport interface NextStudioLayoutProps extends Pick<StudioProps, 'config' | 'scheme'> {\n children: React.ReactNode\n /**\n * Apply fix with SVG icon centering that happens if TailwindCSS is loaded\n * @defaultValue true\n */\n unstable__tailwindSvgFix?: boolean\n}\n\ntype LayoutProps = {\n $unstable__tailwindSvgFix: NextStudioLayoutProps['unstable__tailwindSvgFix']\n $bg: string\n $fontFamily: string\n}\nconst Layout = styled.div<LayoutProps>`\n font-family: ${({$fontFamily}) => $fontFamily};\n background-color: ${({$bg}: any) => $bg};\n height: 100vh;\n max-height: 100dvh;\n overscroll-behavior: none;\n -webkit-font-smoothing: antialiased;\n overflow: auto;\n\n ${({$unstable__tailwindSvgFix}: any) =>\n $unstable__tailwindSvgFix\n ? css`\n /* override tailwind reset */\n *:not([data-ui='Popover__arrow']):not([data-ui='Tooltip__arrow']) > svg {\n display: inline;\n }\n `\n : ''}\n`\n\nconst NextStudioLayoutComponent = ({\n children,\n config,\n scheme = 'light',\n unstable__tailwindSvgFix = true,\n}: NextStudioLayoutProps) => {\n const theme = useTheme(config)\n\n return (\n <Layout\n data-ui=\"NextStudioLayout\"\n $unstable__tailwindSvgFix={unstable__tailwindSvgFix}\n $fontFamily={theme.fonts.text.family}\n $bg={theme.color[scheme].default.base.bg}\n >\n {children}\n </Layout>\n )\n}\n\n/** @alpha */\nexport const NextStudioLayout = memo(NextStudioLayoutComponent)\n","/* eslint-disable react/no-danger */\n\nconst style = {\n __html: `\n.sanity-app-no-js__root {\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n background: #fff;\n z-index: 1;\n}\n\n.sanity-app-no-js__content {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n text-align: center;\n font-family: helvetica, arial, sans-serif;\n}\n`,\n} as const\n\n/** @alpha */\nexport const NextStudioNoScript = () => (\n <noscript>\n <div className=\"sanity-app-no-js__root\">\n <div className=\"sanity-app-no-js__content\">\n <style type=\"text/css\" dangerouslySetInnerHTML={style} />\n <h1>JavaScript disabled</h1>\n <p>\n Please <a href=\"https://www.enable-javascript.com/\">enable JavaScript</a> in your\n browser and reload the page to proceed.\n </p>\n </div>\n </div>\n </noscript>\n)\n","import {type ReactNode, Suspense, useEffect, useReducer} from 'react'\n\n/** @alpha */\nexport type NextStudioSuspenseProps = {\n children: ReactNode\n fallback: ReactNode\n}\n\n/** @alpha */\nexport function NextStudioSuspense({children, fallback}: NextStudioSuspenseProps) {\n const [mounted, mount] = useReducer(() => true, false)\n useEffect(mount, [mount])\n\n return <Suspense fallback={fallback}>{mounted ? children : fallback}</Suspense>\n}\n","import {lazy, memo} from 'react'\nimport type {StudioProps} from 'sanity'\n\nimport {NextStudioFallback} from './NextStudioFallback'\nimport {type NextStudioLayoutProps, NextStudioLayout} from './NextStudioLayout'\nimport {NextStudioNoScript} from './NextStudioNoScript'\nimport {NextStudioSuspense} from './NextStudioSuspense'\n\nconst Studio = memo(lazy(() => import('./LazyStudio')))\n\n/** @beta */\nexport interface NextStudioProps extends StudioProps {\n children?: React.ReactNode\n /**\n * Apply fix with SVG icon centering that happens if TailwindCSS is loaded\n * @defaultValue true\n * @alpha\n */\n unstable__tailwindSvgFix?: NextStudioLayoutProps['unstable__tailwindSvgFix']\n /**\n * Render the <noscript> tag\n * @defaultValue true\n * @alpha\n */\n unstable__noScript?: boolean\n}\n/**\n * Intended to render at the root of a page, letting the Studio own that page and render much like it would if you used `npx sanity start` to render\n * It's a drop-in replacement for `import {Studio} from 'sanity'`\n */\nconst NextStudioComponent = ({\n children,\n config,\n unstable__tailwindSvgFix = true,\n unstable__noScript = true,\n scheme,\n ...props\n}: NextStudioProps) => {\n return (\n <>\n {!unstable__noScript && <NextStudioNoScript />}\n <NextStudioSuspense fallback={<NextStudioFallback config={config} scheme={scheme} />}>\n <NextStudioLayout\n config={config}\n scheme={scheme}\n unstable__tailwindSvgFix={unstable__tailwindSvgFix}\n >\n {children || (\n <Studio config={config} scheme={scheme} unstable_globalStyles {...props} />\n )}\n </NextStudioLayout>\n </NextStudioSuspense>\n </>\n )\n}\n\n/**\n * Override how the Studio renders by passing children.\n * This is useful for advanced use cases where you're using StudioProvider and StudioLayout instead of Studio:\n * ```\n * import {StudioProvider, StudioLayout} from 'sanity'\n * import {NextStudio} from 'next-sanity/studio'\n * <NextStudio config={config}>\n * <StudioProvider config={config}>\n * <CustomComponentThatUsesContextFromStudioProvider />\n * <StudioLayout />\n * </StudioProvider>\n * </NextStudio>\n * ```\n * @beta\n */\nexport const NextStudio = memo(NextStudioComponent)\n","/* eslint-disable @typescript-eslint/no-empty-function */\nimport type {ThemeColorSchemeKey} from '@sanity/ui'\nimport {useSyncExternalStore} from 'react'\n\nfunction createStore() {\n if (typeof document === 'undefined') {\n return {\n subscribe: () => () => {},\n getSnapshot: () => 'light' as const,\n getServerSnapshot: () => 'light' as const,\n }\n }\n\n const matchMedia = window.matchMedia('(prefers-color-scheme: dark)')\n\n return {\n subscribe: (onStoreChange: () => void) => {\n matchMedia.addEventListener('change', onStoreChange)\n return () => matchMedia.removeEventListener('change', onStoreChange)\n },\n getSnapshot: () => (matchMedia.matches ? 'dark' : 'light'),\n getServerSnapshot: () => 'light' as const,\n }\n}\nconst store = createStore()\n\n/** @alpha */\nexport function usePrefersColorScheme(): ThemeColorSchemeKey {\n return useSyncExternalStore(store.subscribe, store.getSnapshot, store.getServerSnapshot)\n}\n"],"names":["isWorkspaces","config","Array","isArray","isWorkspaceWithTheme","workspace","Boolean","theme","useTheme","useMemo","defaultTheme","keyframes","NextStudioFallbackComponent","props","scheme","id","fonts","media","styles","_responsive","size","ascenderHeight","descenderHeight","lineHeight","iconSize","text","sizes","capHeight","wrapper","animation","color","default","muted","enabled","fg","width","rem","height","svg","display","margin","jsx","style","fontFamily","family","backgroundColor","base","bg","maxHeight","overscrollBehavior","WebkitFontSmoothing","overflow","children","jsxs","minWidth","minHeight","alignItems","justifyContent","flexDirection","padding","SpinnerIcon","NextStudioFallback","memo","Layout","styled","div","$fontFamily","$bg","$unstable__tailwindSvgFix","css","NextStudioLayoutComponent","unstable__tailwindSvgFix","NextStudioLayout","__html","NextStudioNoScript","className","type","dangerouslySetInnerHTML","href","NextStudioSuspense","fallback","mounted","mount","useReducer","useEffect","Suspense","Studio","lazy","Promise","resolve","then","require","NextStudioComponent","unstable__noScript","Fragment","unstable_globalStyles","NextStudio","createStore","document","subscribe","getSnapshot","getServerSnapshot","matchMedia","window","onStoreChange","addEventListener","removeEventListener","matches","store","usePrefersColorScheme","useSyncExternalStore"],"mappings":"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"}
1
+ {"version":3,"file":"index.cjs","sources":["../../src/studio/NextStudioClientOnly.tsx","../../src/studio/NextStudioLayout.tsx","../../src/studio/NextStudio.tsx","../../src/studio/usePrefersColorScheme.ts"],"sourcesContent":["import {type ReactNode, startTransition, useEffect, useState} from 'react'\n\n/** @alpha */\nexport type NextStudioClientOnlyProps = {\n children: ReactNode\n fallback: ReactNode\n}\n\n/** @alpha */\nexport function NextStudioClientOnly({children, fallback}: NextStudioClientOnlyProps) {\n const [mounted, setMounted] = useState(false)\n useEffect(() => startTransition(() => setMounted(true)), [])\n\n return <>{mounted ? children : fallback}</>\n}\n","/* eslint-disable camelcase */\nimport {memo} from 'react'\nimport type {StudioProps} from 'sanity'\nimport styled, {css} from 'styled-components'\n\nimport {useTheme} from './useTheme'\n\n/** @alpha */\nexport interface NextStudioLayoutProps extends Pick<StudioProps, 'config' | 'scheme'> {\n children: React.ReactNode\n /**\n * Apply fix with SVG icon centering that happens if TailwindCSS is loaded\n * @defaultValue true\n */\n unstable__tailwindSvgFix?: boolean\n}\n\ntype LayoutProps = {\n $unstable__tailwindSvgFix: NextStudioLayoutProps['unstable__tailwindSvgFix']\n $bg: string\n $fontFamily: string\n}\nconst Layout = styled.div<LayoutProps>`\n font-family: ${({$fontFamily}) => $fontFamily};\n background-color: ${({$bg}: any) => $bg};\n height: 100vh;\n max-height: 100dvh;\n overscroll-behavior: none;\n -webkit-font-smoothing: antialiased;\n overflow: auto;\n\n ${({$unstable__tailwindSvgFix}: any) =>\n $unstable__tailwindSvgFix\n ? css`\n /* override tailwind reset */\n *:not([data-ui='Popover__arrow']):not([data-ui='Tooltip__arrow']) > svg {\n display: inline;\n }\n `\n : ''}\n`\n\nconst NextStudioLayoutComponent = ({\n children,\n config,\n scheme = 'light',\n unstable__tailwindSvgFix = true,\n}: NextStudioLayoutProps) => {\n const theme = useTheme(config)\n\n return (\n <Layout\n data-ui=\"NextStudioLayout\"\n $unstable__tailwindSvgFix={unstable__tailwindSvgFix}\n $fontFamily={theme.fonts.text.family}\n $bg={theme.color[scheme].default.base.bg}\n >\n {children}\n </Layout>\n )\n}\n\n/** @alpha */\nexport const NextStudioLayout = memo(NextStudioLayoutComponent)\n","import {memo} from 'react'\nimport {type StudioProps, Studio} from 'sanity'\n\nimport {NextStudioClientOnly} from './NextStudioClientOnly'\nimport {type NextStudioLayoutProps, NextStudioLayout} from './NextStudioLayout'\nimport {type NextStudioLoadingProps, NextStudioLoading} from './NextStudioLoading'\n\nexport type {NextStudioLoadingProps}\n\n// eslint-disable-next-line no-warning-comments\n// FIXME: https://github.com/vercel/next.js/issues/43147\n// const Studio = memo(lazy(() => import('./LazyStudio')))\n\n/** @beta */\nexport interface NextStudioProps extends StudioProps {\n children?: React.ReactNode\n /**\n * Apply fix with SVG icon centering that happens if TailwindCSS is loaded\n * @defaultValue true\n * @alpha\n */\n unstable__tailwindSvgFix?: NextStudioLayoutProps['unstable__tailwindSvgFix']\n /**\n * Render the <noscript> tag\n * @defaultValue true\n * @alpha\n */\n unstable__noScript?: NextStudioLoadingProps['unstable__noScript']\n}\n/**\n * Intended to render at the root of a page, letting the Studio own that page and render much like it would if you used `npx sanity start` to render\n * It's a drop-in replacement for `import {Studio} from 'sanity'`\n */\nconst NextStudioComponent = ({\n children,\n config,\n unstable__tailwindSvgFix = true,\n unstable__noScript,\n scheme,\n ...props\n}: NextStudioProps) => (\n <NextStudioClientOnly\n fallback={\n <NextStudioLoading\n unstable__noScript={unstable__noScript}\n config={config}\n scheme={scheme}\n />\n }\n >\n <NextStudioLayout\n config={config}\n scheme={scheme}\n unstable__tailwindSvgFix={unstable__tailwindSvgFix}\n >\n {children || <Studio config={config} scheme={scheme} unstable_globalStyles {...props} />}\n </NextStudioLayout>\n </NextStudioClientOnly>\n)\n\n/**\n * Override how the Studio renders by passing children.\n * This is useful for advanced use cases where you're using StudioProvider and StudioLayout instead of Studio:\n * ```\n * import {StudioProvider, StudioLayout} from 'sanity'\n * import {NextStudio} from 'next-sanity/studio'\n * <NextStudio config={config}>\n * <StudioProvider config={config}>\n * <CustomComponentThatUsesContextFromStudioProvider />\n * <StudioLayout />\n * </StudioProvider>\n * </NextStudio>\n * ```\n * @beta\n */\nexport const NextStudio = memo(NextStudioComponent)\n","/* eslint-disable @typescript-eslint/no-empty-function */\nimport type {ThemeColorSchemeKey} from '@sanity/ui'\nimport {useSyncExternalStore} from 'react'\n\nfunction createStore() {\n if (typeof document === 'undefined') {\n return {\n subscribe: () => () => {},\n getSnapshot: () => 'light' as const,\n getServerSnapshot: () => 'light' as const,\n }\n }\n\n const matchMedia = window.matchMedia('(prefers-color-scheme: dark)')\n\n return {\n subscribe: (onStoreChange: () => void) => {\n matchMedia.addEventListener('change', onStoreChange)\n return () => matchMedia.removeEventListener('change', onStoreChange)\n },\n getSnapshot: () => (matchMedia.matches ? 'dark' : 'light'),\n getServerSnapshot: () => 'light' as const,\n }\n}\nconst store = createStore()\n\n/** @alpha */\nexport function usePrefersColorScheme(): ThemeColorSchemeKey {\n return useSyncExternalStore(store.subscribe, store.getSnapshot, store.getServerSnapshot)\n}\n"],"names":["NextStudioClientOnly","children","fallback","mounted","setMounted","useState","useEffect","startTransition","jsx","Fragment","Layout","styled","div","$fontFamily","$bg","$unstable__tailwindSvgFix","css","NextStudioLayoutComponent","config","scheme","unstable__tailwindSvgFix","theme","useTheme","fonts","text","family","color","default","base","bg","NextStudioLayout","memo","NextStudioComponent","unstable__noScript","props","NextStudioLoading","Studio","unstable_globalStyles","NextStudio","createStore","document","subscribe","getSnapshot","getServerSnapshot","matchMedia","window","onStoreChange","addEventListener","removeEventListener","matches","store","usePrefersColorScheme","useSyncExternalStore"],"mappings":"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"}