next-sanity 4.2.0 → 4.2.1-dev.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 +36 -31
- package/dist/_chunks/{NextStudioLoading-2003f32a.js → NextStudioLoading-8cf56cdf.js} +4 -4
- package/dist/_chunks/NextStudioLoading-8cf56cdf.js.map +1 -0
- package/dist/_chunks/{NextStudioLoading-225bb240.cjs → NextStudioLoading-bf57e61a.cjs} +4 -4
- package/dist/_chunks/NextStudioLoading-bf57e61a.cjs.map +1 -0
- package/dist/index.cjs +16 -6
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +24 -2
- package/dist/index.js +17 -1
- package/dist/index.js.map +1 -1
- package/dist/studio/head.cjs.map +1 -1
- package/dist/studio/head.d.ts +2 -1
- package/dist/studio/head.js.map +1 -1
- package/dist/studio/index.cjs +16 -33
- package/dist/studio/index.cjs.map +1 -1
- package/dist/studio/index.d.ts +3 -19
- package/dist/studio/index.js +19 -35
- package/dist/studio/index.js.map +1 -1
- package/dist/studio/loading.cjs +1 -1
- package/dist/studio/loading.d.ts +3 -4
- package/dist/studio/loading.js +1 -1
- package/package.json +14 -29
- package/src/client.ts +36 -1
- package/src/studio/NextStudio.tsx +19 -47
- package/src/studio/NextStudioLayout.tsx +1 -1
- package/src/studio/NextStudioLoading.tsx +4 -11
- package/src/studio/head/NextStudioHead.tsx +0 -1
- package/dist/_chunks/NextStudioLoading-2003f32a.js.map +0 -1
- package/dist/_chunks/NextStudioLoading-225bb240.cjs.map +0 -1
- package/dist/studio/metadata.cjs +0 -13
- package/dist/studio/metadata.cjs.js +0 -5
- package/dist/studio/metadata.cjs.map +0 -1
- package/dist/studio/metadata.d.ts +0 -43
- package/dist/studio/metadata.js +0 -8
- package/dist/studio/metadata.js.map +0 -1
- package/src/studio/metadata.ts +0 -44
package/dist/studio/index.cjs
CHANGED
|
@@ -9,7 +9,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
9
9
|
var react = require('react');
|
|
10
10
|
var sanity = require('sanity');
|
|
11
11
|
var styled = require('styled-components');
|
|
12
|
-
var NextStudioLoading = require('../_chunks/NextStudioLoading-
|
|
12
|
+
var NextStudioLoading = require('../_chunks/NextStudioLoading-bf57e61a.cjs');
|
|
13
13
|
function _interopDefaultCompat(e) {
|
|
14
14
|
return e && typeof e === 'object' && 'default' in e ? e : {
|
|
15
15
|
default: e
|
|
@@ -48,7 +48,7 @@ const NextStudioLayoutComponent = _ref4 => {
|
|
|
48
48
|
return /* @__PURE__ */jsxRuntime.jsx(Layout, {
|
|
49
49
|
"data-ui": "NextStudioLayout",
|
|
50
50
|
$fontFamily: theme.fonts.text.family,
|
|
51
|
-
$bg: theme.color[scheme
|
|
51
|
+
$bg: theme.color[scheme].default.base.bg,
|
|
52
52
|
children
|
|
53
53
|
});
|
|
54
54
|
};
|
|
@@ -57,43 +57,26 @@ const NextStudioComponent = _ref5 => {
|
|
|
57
57
|
let {
|
|
58
58
|
children,
|
|
59
59
|
config,
|
|
60
|
-
unstable__noScript
|
|
61
|
-
unstable__fastRender,
|
|
60
|
+
unstable__noScript,
|
|
62
61
|
scheme,
|
|
63
62
|
...props
|
|
64
63
|
} = _ref5;
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
64
|
+
return /* @__PURE__ */jsxRuntime.jsx(NextStudioClientOnly, {
|
|
65
|
+
fallback: /* @__PURE__ */jsxRuntime.jsx(NextStudioLoading.NextStudioLoading, {
|
|
66
|
+
unstable__noScript,
|
|
67
|
+
config,
|
|
68
|
+
scheme
|
|
69
|
+
}),
|
|
70
|
+
children: /* @__PURE__ */jsxRuntime.jsx(NextStudioLayout, {
|
|
71
|
+
config,
|
|
72
|
+
scheme,
|
|
73
|
+
children: children || /* @__PURE__ */jsxRuntime.jsx(sanity.Studio, {
|
|
68
74
|
config,
|
|
69
75
|
scheme,
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
scheme,
|
|
73
|
-
unstable_globalStyles: true,
|
|
74
|
-
...props
|
|
75
|
-
})
|
|
76
|
-
})]
|
|
77
|
-
});
|
|
78
|
-
}
|
|
79
|
-
return /* @__PURE__ */jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
80
|
-
children: [unstable__noScript && /* @__PURE__ */jsxRuntime.jsx(NextStudioLoading.NextStudioNoScript, {}), /* @__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
|
-
children: children || /* @__PURE__ */jsxRuntime.jsx(sanity.Studio, {
|
|
90
|
-
config,
|
|
91
|
-
scheme,
|
|
92
|
-
unstable_globalStyles: true,
|
|
93
|
-
...props
|
|
94
|
-
})
|
|
76
|
+
unstable_globalStyles: true,
|
|
77
|
+
...props
|
|
95
78
|
})
|
|
96
|
-
})
|
|
79
|
+
})
|
|
97
80
|
});
|
|
98
81
|
};
|
|
99
82
|
const NextStudio = react.memo(NextStudioComponent);
|
|
@@ -1 +1 @@
|
|
|
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 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\ntype LayoutProps = {\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\nconst NextStudioLayoutComponent = ({\n children,\n config,\n scheme = 'light',\n}: NextStudioLayoutProps) => {\n const theme = useTheme(config)\n\n return (\n <Layout\n data-ui=\"NextStudioLayout\"\n $fontFamily={theme.fonts.text.family}\n $bg={theme.color[scheme
|
|
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 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\ntype LayoutProps = {\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\nconst NextStudioLayoutComponent = ({\n children,\n config,\n scheme = 'light',\n}: NextStudioLayoutProps) => {\n const theme = useTheme(config)\n\n return (\n <Layout\n data-ui=\"NextStudioLayout\"\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 {Studio, type StudioProps} from 'sanity'\n\nimport {NextStudioClientOnly} from './NextStudioClientOnly'\nimport {NextStudioLayout} from './NextStudioLayout'\nimport {NextStudioLoading, type NextStudioLoadingProps} from './NextStudioLoading'\n\nexport type {NextStudioLoadingProps}\n\n/** @beta */\nexport interface NextStudioProps extends StudioProps {\n children?: React.ReactNode\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__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 config={config} scheme={scheme}>\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","_ref","children","fallback","mounted","setMounted","useState","useEffect","startTransition","jsx","Fragment","Layout","styled","default","div","_templateObject","_taggedTemplateLiteral","_ref2","$fontFamily","_ref3","$bg","NextStudioLayoutComponent","_ref4","config","scheme","theme","useTheme","fonts","text","family","color","base","bg","NextStudioLayout","memo","NextStudioComponent","_ref5","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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"}
|
package/dist/studio/index.d.ts
CHANGED
|
@@ -24,14 +24,7 @@ import type {ThemeColorSchemeKey} from '@sanity/ui'
|
|
|
24
24
|
* @beta
|
|
25
25
|
*/
|
|
26
26
|
export declare const NextStudio: MemoExoticComponent<
|
|
27
|
-
({
|
|
28
|
-
children,
|
|
29
|
-
config,
|
|
30
|
-
unstable__noScript,
|
|
31
|
-
unstable__fastRender,
|
|
32
|
-
scheme,
|
|
33
|
-
...props
|
|
34
|
-
}: NextStudioProps) => JSX.Element
|
|
27
|
+
({children, config, unstable__noScript, scheme, ...props}: NextStudioProps) => JSX.Element
|
|
35
28
|
>
|
|
36
29
|
|
|
37
30
|
/** @alpha */
|
|
@@ -56,10 +49,7 @@ export declare interface NextStudioLayoutProps extends Pick<StudioProps, 'config
|
|
|
56
49
|
children: React.ReactNode
|
|
57
50
|
}
|
|
58
51
|
|
|
59
|
-
/**
|
|
60
|
-
* @alpha
|
|
61
|
-
* @deprecated Will be removed in the next major release
|
|
62
|
-
*/
|
|
52
|
+
/** @alpha */
|
|
63
53
|
export declare interface NextStudioLoadingProps extends Pick<StudioProps, 'scheme'> {
|
|
64
54
|
/**
|
|
65
55
|
* If your Studio Config has a custom theme you can pass it here to ensure the loading screen matches your theme.
|
|
@@ -84,13 +74,7 @@ export declare interface NextStudioProps extends StudioProps {
|
|
|
84
74
|
* @defaultValue true
|
|
85
75
|
* @alpha
|
|
86
76
|
*/
|
|
87
|
-
unstable__noScript?:
|
|
88
|
-
/**
|
|
89
|
-
* Render in a faster mode that requires `styled-components` SSR to be setup.
|
|
90
|
-
* @defaultValue false
|
|
91
|
-
* @alpha
|
|
92
|
-
*/
|
|
93
|
-
unstable__fastRender?: boolean
|
|
77
|
+
unstable__noScript?: NextStudioLoadingProps['unstable__noScript']
|
|
94
78
|
}
|
|
95
79
|
|
|
96
80
|
/** @alpha */
|
package/dist/studio/index.js
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
var _templateObject;
|
|
2
2
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
3
|
-
import { jsx, Fragment
|
|
3
|
+
import { jsx, Fragment } from 'react/jsx-runtime';
|
|
4
4
|
import { useState, useEffect, startTransition, memo, useSyncExternalStore } from 'react';
|
|
5
5
|
import { Studio } from 'sanity';
|
|
6
6
|
import styled from 'styled-components';
|
|
7
|
-
import { useTheme,
|
|
7
|
+
import { useTheme, NextStudioLoading } from '../_chunks/NextStudioLoading-8cf56cdf.js';
|
|
8
|
+
export { NextStudioNoScript } from '../_chunks/NextStudioLoading-8cf56cdf.js';
|
|
8
9
|
function NextStudioClientOnly(_ref) {
|
|
9
10
|
let {
|
|
10
11
|
children,
|
|
@@ -37,7 +38,7 @@ const NextStudioLayoutComponent = _ref4 => {
|
|
|
37
38
|
return /* @__PURE__ */jsx(Layout, {
|
|
38
39
|
"data-ui": "NextStudioLayout",
|
|
39
40
|
$fontFamily: theme.fonts.text.family,
|
|
40
|
-
$bg: theme.color[scheme
|
|
41
|
+
$bg: theme.color[scheme].default.base.bg,
|
|
41
42
|
children
|
|
42
43
|
});
|
|
43
44
|
};
|
|
@@ -46,43 +47,26 @@ const NextStudioComponent = _ref5 => {
|
|
|
46
47
|
let {
|
|
47
48
|
children,
|
|
48
49
|
config,
|
|
49
|
-
unstable__noScript
|
|
50
|
-
unstable__fastRender,
|
|
50
|
+
unstable__noScript,
|
|
51
51
|
scheme,
|
|
52
52
|
...props
|
|
53
53
|
} = _ref5;
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
54
|
+
return /* @__PURE__ */jsx(NextStudioClientOnly, {
|
|
55
|
+
fallback: /* @__PURE__ */jsx(NextStudioLoading, {
|
|
56
|
+
unstable__noScript,
|
|
57
|
+
config,
|
|
58
|
+
scheme
|
|
59
|
+
}),
|
|
60
|
+
children: /* @__PURE__ */jsx(NextStudioLayout, {
|
|
61
|
+
config,
|
|
62
|
+
scheme,
|
|
63
|
+
children: children || /* @__PURE__ */jsx(Studio, {
|
|
57
64
|
config,
|
|
58
65
|
scheme,
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
scheme,
|
|
62
|
-
unstable_globalStyles: true,
|
|
63
|
-
...props
|
|
64
|
-
})
|
|
65
|
-
})]
|
|
66
|
-
});
|
|
67
|
-
}
|
|
68
|
-
return /* @__PURE__ */jsxs(Fragment, {
|
|
69
|
-
children: [unstable__noScript && /* @__PURE__ */jsx(NextStudioNoScript, {}), /* @__PURE__ */jsx(NextStudioClientOnly, {
|
|
70
|
-
fallback: /* @__PURE__ */jsx(NextStudioLoading, {
|
|
71
|
-
unstable__noScript,
|
|
72
|
-
config,
|
|
73
|
-
scheme
|
|
74
|
-
}),
|
|
75
|
-
children: /* @__PURE__ */jsx(NextStudioLayout, {
|
|
76
|
-
config,
|
|
77
|
-
scheme,
|
|
78
|
-
children: children || /* @__PURE__ */jsx(Studio, {
|
|
79
|
-
config,
|
|
80
|
-
scheme,
|
|
81
|
-
unstable_globalStyles: true,
|
|
82
|
-
...props
|
|
83
|
-
})
|
|
66
|
+
unstable_globalStyles: true,
|
|
67
|
+
...props
|
|
84
68
|
})
|
|
85
|
-
})
|
|
69
|
+
})
|
|
86
70
|
});
|
|
87
71
|
};
|
|
88
72
|
const NextStudio = memo(NextStudioComponent);
|
|
@@ -108,5 +92,5 @@ const store = createStore();
|
|
|
108
92
|
function usePrefersColorScheme() {
|
|
109
93
|
return useSyncExternalStore(store.subscribe, store.getSnapshot, store.getServerSnapshot);
|
|
110
94
|
}
|
|
111
|
-
export { NextStudio, NextStudioClientOnly, NextStudioLayout,
|
|
95
|
+
export { NextStudio, NextStudioClientOnly, NextStudioLayout, usePrefersColorScheme, useTheme };
|
|
112
96
|
//# sourceMappingURL=index.js.map
|
package/dist/studio/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","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 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\ntype LayoutProps = {\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\nconst NextStudioLayoutComponent = ({\n children,\n config,\n scheme = 'light',\n}: NextStudioLayoutProps) => {\n const theme = useTheme(config)\n\n return (\n <Layout\n data-ui=\"NextStudioLayout\"\n $fontFamily={theme.fonts.text.family}\n $bg={theme.color[scheme
|
|
1
|
+
{"version":3,"file":"index.js","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 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\ntype LayoutProps = {\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\nconst NextStudioLayoutComponent = ({\n children,\n config,\n scheme = 'light',\n}: NextStudioLayoutProps) => {\n const theme = useTheme(config)\n\n return (\n <Layout\n data-ui=\"NextStudioLayout\"\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 {Studio, type StudioProps} from 'sanity'\n\nimport {NextStudioClientOnly} from './NextStudioClientOnly'\nimport {NextStudioLayout} from './NextStudioLayout'\nimport {NextStudioLoading, type NextStudioLoadingProps} from './NextStudioLoading'\n\nexport type {NextStudioLoadingProps}\n\n/** @beta */\nexport interface NextStudioProps extends StudioProps {\n children?: React.ReactNode\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__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 config={config} scheme={scheme}>\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","_ref","children","fallback","mounted","setMounted","useState","useEffect","startTransition","jsx","Fragment","Layout","styled","div","_templateObject","_taggedTemplateLiteral","_ref2","$fontFamily","_ref3","$bg","NextStudioLayoutComponent","_ref4","config","scheme","theme","useTheme","fonts","text","family","color","default","base","bg","NextStudioLayout","memo","NextStudioComponent","_ref5","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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"}
|
package/dist/studio/loading.cjs
CHANGED
|
@@ -3,6 +3,6 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
var NextStudioLoading = require('../_chunks/NextStudioLoading-
|
|
6
|
+
var NextStudioLoading = require('../_chunks/NextStudioLoading-bf57e61a.cjs');
|
|
7
7
|
exports.NextStudioLoading = NextStudioLoading.NextStudioLoading;
|
|
8
8
|
//# sourceMappingURL=loading.cjs.map
|
package/dist/studio/loading.d.ts
CHANGED
|
@@ -1,13 +1,12 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
|
|
1
3
|
import type {Config} from 'sanity'
|
|
2
4
|
import type {SingleWorkspace} from 'sanity'
|
|
3
5
|
import type {StudioProps} from 'sanity'
|
|
4
6
|
|
|
5
7
|
export declare function NextStudioLoading(props: NextStudioLoadingProps): JSX.Element
|
|
6
8
|
|
|
7
|
-
/**
|
|
8
|
-
* @alpha
|
|
9
|
-
* @deprecated Will be removed in the next major release
|
|
10
|
-
*/
|
|
9
|
+
/** @alpha */
|
|
11
10
|
export declare interface NextStudioLoadingProps extends Pick<StudioProps, 'scheme'> {
|
|
12
11
|
/**
|
|
13
12
|
* If your Studio Config has a custom theme you can pass it here to ensure the loading screen matches your theme.
|
package/dist/studio/loading.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { NextStudioLoading } from '../_chunks/NextStudioLoading-
|
|
1
|
+
export { NextStudioLoading } from '../_chunks/NextStudioLoading-8cf56cdf.js';
|
|
2
2
|
//# sourceMappingURL=loading.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "next-sanity",
|
|
3
|
-
"version": "4.2.0",
|
|
3
|
+
"version": "4.2.1-dev.0",
|
|
4
4
|
"description": "Sanity.io toolkit for Next.js",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"sanity",
|
|
@@ -79,17 +79,6 @@
|
|
|
79
79
|
"import": "./dist/studio/loading.js",
|
|
80
80
|
"default": "./dist/studio/loading.js"
|
|
81
81
|
},
|
|
82
|
-
"./studio/metadata": {
|
|
83
|
-
"types": "./dist/studio/metadata.d.ts",
|
|
84
|
-
"source": "./src/studio/metadata.ts",
|
|
85
|
-
"require": "./dist/studio/metadata.cjs",
|
|
86
|
-
"node": {
|
|
87
|
-
"import": "./dist/studio/metadata.cjs.js",
|
|
88
|
-
"require": "./dist/studio/metadata.cjs"
|
|
89
|
-
},
|
|
90
|
-
"import": "./dist/studio/metadata.js",
|
|
91
|
-
"default": "./dist/studio/metadata.js"
|
|
92
|
-
},
|
|
93
82
|
"./webhook": {
|
|
94
83
|
"types": "./dist/webhook.d.ts",
|
|
95
84
|
"source": "./src/webhook/index.ts",
|
|
@@ -121,9 +110,6 @@
|
|
|
121
110
|
"studio/loading": [
|
|
122
111
|
"./dist/studio/loading.d.ts"
|
|
123
112
|
],
|
|
124
|
-
"studio/metadata": [
|
|
125
|
-
"./dist/studio/metadata.d.ts"
|
|
126
|
-
],
|
|
127
113
|
"webhook": [
|
|
128
114
|
"./dist/webhook.d.ts"
|
|
129
115
|
]
|
|
@@ -160,10 +146,10 @@
|
|
|
160
146
|
"singleQuote": true
|
|
161
147
|
},
|
|
162
148
|
"dependencies": {
|
|
163
|
-
"@sanity/client": "5",
|
|
164
|
-
"@sanity/preview-kit": "1.4.
|
|
165
|
-
"@sanity/webhook": "2",
|
|
166
|
-
"groq": "3"
|
|
149
|
+
"@sanity/client": "5.4.3-dev.4",
|
|
150
|
+
"@sanity/preview-kit": "1.4.2-dev.1",
|
|
151
|
+
"@sanity/webhook": "^2.0.0",
|
|
152
|
+
"groq": "^3.0.0"
|
|
167
153
|
},
|
|
168
154
|
"devDependencies": {
|
|
169
155
|
"@rollup/plugin-url": "^8.0.1",
|
|
@@ -181,17 +167,17 @@
|
|
|
181
167
|
"@typescript-eslint/eslint-plugin": "^5.54.1",
|
|
182
168
|
"autoprefixer": "^10.4.14",
|
|
183
169
|
"eslint": "^8.36.0",
|
|
184
|
-
"eslint-config-next": "13.
|
|
170
|
+
"eslint-config-next": "13.2.4",
|
|
185
171
|
"eslint-config-prettier": "^8.7.0",
|
|
186
172
|
"eslint-config-sanity": "^6.0.0",
|
|
187
173
|
"eslint-gitignore": "^0.1.0",
|
|
188
174
|
"eslint-plugin-prettier": "^4.2.1",
|
|
189
175
|
"eslint-plugin-simple-import-sort": "^10.0.0",
|
|
190
|
-
"groqd": "^0.
|
|
176
|
+
"groqd": "^0.12.0",
|
|
191
177
|
"jest": "^29.5.0",
|
|
192
178
|
"jest-environment-jsdom": "^29.5.0",
|
|
193
179
|
"ls-engines": "^0.9.0",
|
|
194
|
-
"next": "13.
|
|
180
|
+
"next": "13.2.4",
|
|
195
181
|
"postcss": "^8.4.21",
|
|
196
182
|
"prettier": "^2.8.4",
|
|
197
183
|
"prettier-plugin-packagejson": "^2.4.3",
|
|
@@ -207,13 +193,12 @@
|
|
|
207
193
|
"url-loader": "^4.1.1"
|
|
208
194
|
},
|
|
209
195
|
"peerDependencies": {
|
|
210
|
-
"@sanity/icons": "2",
|
|
211
|
-
"@sanity/types": "3",
|
|
212
|
-
"@sanity/ui": "1",
|
|
213
|
-
"
|
|
214
|
-
"
|
|
215
|
-
"
|
|
216
|
-
"sanity": "3",
|
|
196
|
+
"@sanity/icons": "^2",
|
|
197
|
+
"@sanity/types": "^3",
|
|
198
|
+
"@sanity/ui": "^1",
|
|
199
|
+
"next": "^13",
|
|
200
|
+
"react": "^18",
|
|
201
|
+
"sanity": "^3",
|
|
217
202
|
"styled-components": "^5.2"
|
|
218
203
|
},
|
|
219
204
|
"engines": {
|
package/src/client.ts
CHANGED
|
@@ -1,2 +1,37 @@
|
|
|
1
|
+
import {
|
|
2
|
+
type ClientConfig as _ClientConfig,
|
|
3
|
+
createClient as _createClient,
|
|
4
|
+
} from '@sanity/preview-kit/client'
|
|
5
|
+
|
|
1
6
|
/** @public */
|
|
2
|
-
export
|
|
7
|
+
export interface ClientConfig extends Omit<_ClientConfig, 'studioUrl' | 'encodeSourceMap'> {
|
|
8
|
+
/**
|
|
9
|
+
* Where the Studio is hosted.
|
|
10
|
+
* If it's embedded in the app, use the base path for example `/studio`.
|
|
11
|
+
* Otherwise provide the full URL to where the Studio is hosted, for example: `https://blog.sanity.studio`.
|
|
12
|
+
* @defaultValue process.env.NEXT_PUBLIC_SANITY_STUDIO_URL
|
|
13
|
+
* @alpha
|
|
14
|
+
*/
|
|
15
|
+
studioUrl?: _ClientConfig['studioUrl']
|
|
16
|
+
/**
|
|
17
|
+
* If there's no `studioUrl` then the default value is `none` and the normal `@sanity/client` will be used. If `studioUrl` is set, then it's `auto` by default.
|
|
18
|
+
* @defaultValue process.env.MEXT_PUBLIC_SANITY_SOURCE_MAP || studioUrl ? 'auto' : 'none'
|
|
19
|
+
* @alpha
|
|
20
|
+
*/
|
|
21
|
+
encodeSourceMap?: _ClientConfig['encodeSourceMap']
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
/**
|
|
25
|
+
* @public
|
|
26
|
+
*/
|
|
27
|
+
export function createClient(config: ClientConfig): ReturnType<typeof _createClient> {
|
|
28
|
+
let {
|
|
29
|
+
// eslint-disable-next-line prefer-const
|
|
30
|
+
studioUrl = process.env.NEXT_PUBLIC_SANITY_STUDIO_URL! as _ClientConfig['studioUrl'],
|
|
31
|
+
encodeSourceMap = (studioUrl ? 'auto' : false) satisfies _ClientConfig['encodeSourceMap'],
|
|
32
|
+
} = config
|
|
33
|
+
if (encodeSourceMap === 'auto' && process.env.NEXT_PUBLIC_VERCEL_ENV === 'preview') {
|
|
34
|
+
encodeSourceMap = true
|
|
35
|
+
}
|
|
36
|
+
return _createClient({...config, studioUrl, encodeSourceMap})
|
|
37
|
+
}
|
|
@@ -3,10 +3,9 @@ import {Studio, type StudioProps} from 'sanity'
|
|
|
3
3
|
|
|
4
4
|
import {NextStudioClientOnly} from './NextStudioClientOnly'
|
|
5
5
|
import {NextStudioLayout} from './NextStudioLayout'
|
|
6
|
-
import {NextStudioLoading} from './NextStudioLoading'
|
|
7
|
-
import {NextStudioNoScript} from './NextStudioNoScript'
|
|
6
|
+
import {NextStudioLoading, type NextStudioLoadingProps} from './NextStudioLoading'
|
|
8
7
|
|
|
9
|
-
export type {NextStudioLoadingProps}
|
|
8
|
+
export type {NextStudioLoadingProps}
|
|
10
9
|
|
|
11
10
|
/** @beta */
|
|
12
11
|
export interface NextStudioProps extends StudioProps {
|
|
@@ -16,13 +15,7 @@ export interface NextStudioProps extends StudioProps {
|
|
|
16
15
|
* @defaultValue true
|
|
17
16
|
* @alpha
|
|
18
17
|
*/
|
|
19
|
-
unstable__noScript?:
|
|
20
|
-
/**
|
|
21
|
-
* Render in a faster mode that requires `styled-components` SSR to be setup.
|
|
22
|
-
* @defaultValue false
|
|
23
|
-
* @alpha
|
|
24
|
-
*/
|
|
25
|
-
unstable__fastRender?: boolean
|
|
18
|
+
unstable__noScript?: NextStudioLoadingProps['unstable__noScript']
|
|
26
19
|
}
|
|
27
20
|
/**
|
|
28
21
|
* 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
|
|
@@ -31,45 +24,24 @@ export interface NextStudioProps extends StudioProps {
|
|
|
31
24
|
const NextStudioComponent = ({
|
|
32
25
|
children,
|
|
33
26
|
config,
|
|
34
|
-
unstable__noScript
|
|
35
|
-
unstable__fastRender,
|
|
27
|
+
unstable__noScript,
|
|
36
28
|
scheme,
|
|
37
29
|
...props
|
|
38
|
-
}: NextStudioProps) =>
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
{unstable__noScript
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
<>
|
|
54
|
-
{unstable__noScript && <NextStudioNoScript />}
|
|
55
|
-
<NextStudioClientOnly
|
|
56
|
-
fallback={
|
|
57
|
-
<NextStudioLoading
|
|
58
|
-
unstable__noScript={unstable__noScript}
|
|
59
|
-
config={config}
|
|
60
|
-
scheme={scheme}
|
|
61
|
-
/>
|
|
62
|
-
}
|
|
63
|
-
>
|
|
64
|
-
<NextStudioLayout config={config} scheme={scheme}>
|
|
65
|
-
{children || (
|
|
66
|
-
<Studio config={config} scheme={scheme} unstable_globalStyles {...props} />
|
|
67
|
-
)}
|
|
68
|
-
</NextStudioLayout>
|
|
69
|
-
</NextStudioClientOnly>
|
|
70
|
-
</>
|
|
71
|
-
)
|
|
72
|
-
}
|
|
30
|
+
}: NextStudioProps) => (
|
|
31
|
+
<NextStudioClientOnly
|
|
32
|
+
fallback={
|
|
33
|
+
<NextStudioLoading
|
|
34
|
+
unstable__noScript={unstable__noScript}
|
|
35
|
+
config={config}
|
|
36
|
+
scheme={scheme}
|
|
37
|
+
/>
|
|
38
|
+
}
|
|
39
|
+
>
|
|
40
|
+
<NextStudioLayout config={config} scheme={scheme}>
|
|
41
|
+
{children || <Studio config={config} scheme={scheme} unstable_globalStyles {...props} />}
|
|
42
|
+
</NextStudioLayout>
|
|
43
|
+
</NextStudioClientOnly>
|
|
44
|
+
)
|
|
73
45
|
|
|
74
46
|
/**
|
|
75
47
|
* Override how the Studio renders by passing children.
|
|
@@ -35,7 +35,7 @@ const NextStudioLayoutComponent = ({
|
|
|
35
35
|
<Layout
|
|
36
36
|
data-ui="NextStudioLayout"
|
|
37
37
|
$fontFamily={theme.fonts.text.family}
|
|
38
|
-
$bg={theme.color[scheme
|
|
38
|
+
$bg={theme.color[scheme].default.base.bg}
|
|
39
39
|
>
|
|
40
40
|
{children}
|
|
41
41
|
</Layout>
|
|
@@ -9,10 +9,7 @@ import type {Config, SingleWorkspace, StudioProps} from 'sanity'
|
|
|
9
9
|
import {NextStudioNoScript} from './NextStudioNoScript'
|
|
10
10
|
import {useTheme} from './useTheme'
|
|
11
11
|
|
|
12
|
-
/**
|
|
13
|
-
* @alpha
|
|
14
|
-
* @deprecated Will be removed in the next major release
|
|
15
|
-
*/
|
|
12
|
+
/** @alpha */
|
|
16
13
|
export interface NextStudioLoadingProps extends Pick<StudioProps, 'scheme'> {
|
|
17
14
|
/**
|
|
18
15
|
* If your Studio Config has a custom theme you can pass it here to ensure the loading screen matches your theme.
|
|
@@ -50,9 +47,7 @@ export function NextStudioLoading(props: NextStudioLoadingProps) {
|
|
|
50
47
|
wrapper: {
|
|
51
48
|
display: 'block',
|
|
52
49
|
animation: `${id} 500ms linear infinite`,
|
|
53
|
-
color:
|
|
54
|
-
theme.color[scheme === 'dark' ? 'dark' : 'light'].default.muted.default.enabled.muted
|
|
55
|
-
.fg,
|
|
50
|
+
color: theme.color[scheme].default.muted.default.enabled.muted.fg,
|
|
56
51
|
width: rem(capHeight),
|
|
57
52
|
height: rem(capHeight),
|
|
58
53
|
},
|
|
@@ -71,7 +66,7 @@ export function NextStudioLoading(props: NextStudioLoadingProps) {
|
|
|
71
66
|
<div
|
|
72
67
|
style={{
|
|
73
68
|
fontFamily: fonts.text.family,
|
|
74
|
-
backgroundColor: theme.color[scheme
|
|
69
|
+
backgroundColor: theme.color[scheme].default.base.bg,
|
|
75
70
|
height: '100vh',
|
|
76
71
|
maxHeight: '100dvh',
|
|
77
72
|
overscrollBehavior: 'none',
|
|
@@ -110,9 +105,7 @@ export function NextStudioLoading(props: NextStudioLoadingProps) {
|
|
|
110
105
|
lineHeight: 'calc(1.3125)',
|
|
111
106
|
// @TODO use rem calc
|
|
112
107
|
transform: 'translateY(-5px)',
|
|
113
|
-
color:
|
|
114
|
-
theme.color[scheme === 'dark' ? 'dark' : 'light'].default.muted.default.enabled
|
|
115
|
-
.muted.fg,
|
|
108
|
+
color: theme.color[scheme].default.muted.default.enabled.muted.fg,
|
|
116
109
|
}}
|
|
117
110
|
>
|
|
118
111
|
<span>Loading…</span>
|
|
@@ -79,7 +79,6 @@ export interface NextStudioHeadProps {
|
|
|
79
79
|
* }
|
|
80
80
|
* ```
|
|
81
81
|
* @public
|
|
82
|
-
* @deprecated Use `import {metadata} from 'next-sanity/studio'` instead, this component will be removed in the next major release.
|
|
83
82
|
*/
|
|
84
83
|
export function NextStudioHead(props: NextStudioHeadProps) {
|
|
85
84
|
const {
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"NextStudioLoading-2003f32a.js","sources":["../../src/studio/useTheme.ts","../../src/studio/NextStudioNoScript.tsx","../../src/studio/NextStudioLoading.tsx"],"sourcesContent":["import {studioTheme} from '@sanity/ui'\nimport {useMemo} from 'react'\nimport type {Config, SingleWorkspace, StudioTheme} from 'sanity'\n\n/** @alpha */\nexport function useTheme(\n config?: Config | Required<Pick<SingleWorkspace, 'theme'>>\n): StudioTheme {\n const workspace = useMemo<\n SingleWorkspace | Required<Pick<SingleWorkspace, 'theme'>> | undefined\n >(() => (Array.isArray(config) ? config[0] : config), [config])\n return useMemo<StudioTheme>(() => workspace?.theme || studioTheme, [workspace])\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","/* eslint-disable no-warning-comments */\n// Intentionally not using `styled-components` to ensure it works in any `next` setup.\n// Whether 'styled-components' SSR is setup or not.\n\nimport {SpinnerIcon} from '@sanity/icons'\nimport {_responsive, rem} from '@sanity/ui'\nimport type {Config, SingleWorkspace, StudioProps} from 'sanity'\n\nimport {NextStudioNoScript} from './NextStudioNoScript'\nimport {useTheme} from './useTheme'\n\n/**\n * @alpha\n * @deprecated Will be removed in the next major release\n */\nexport interface NextStudioLoadingProps extends Pick<StudioProps, 'scheme'> {\n /**\n * If your Studio Config has a custom theme you can pass it here to ensure the loading screen matches your theme.\n */\n config?: Config | Required<Pick<SingleWorkspace, 'theme'>>\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 display: 'block',\n animation: `${id} 500ms linear infinite`,\n color:\n theme.color[scheme === 'dark' ? 'dark' : 'light'].default.muted.default.enabled.muted\n .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 === 'dark' ? 'dark' : 'light'].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 // @TODO use rem calc\n gap: '10px',\n }}\n >\n <style key={scheme}>{`@keyframes ${id} {${keyframes}}`}</style>\n <div\n data-ui=\"Text\"\n style={{\n position: 'relative',\n // @TODO read from theme\n fontWeight: 400,\n // @TODO read from theme\n padding: '1px 0px',\n // @TODO use rem calc\n fontSize: '1rem',\n // @TODO use rem calc\n lineHeight: 'calc(1.3125)',\n // @TODO use rem calc\n transform: 'translateY(-5px)',\n color:\n theme.color[scheme === 'dark' ? 'dark' : 'light'].default.muted.default.enabled\n .muted.fg,\n }}\n >\n <span>Loading…</span>\n </div>\n <div data-ui=\"Spinner\" style={styles.wrapper}>\n <SpinnerIcon style={styles.svg} />\n </div>\n </div>\n </div>\n </>\n )\n}\n"],"names":["useTheme","config","workspace","useMemo","Array","isArray","theme","studioTheme","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","display","animation","color","default","muted","enabled","fg","width","rem","height","svg","margin","Fragment","fontFamily","family","backgroundColor","base","bg","maxHeight","overscrollBehavior","WebkitFontSmoothing","overflow","minWidth","minHeight","alignItems","justifyContent","flexDirection","padding","gap","concat","position","fontWeight","fontSize","transform","SpinnerIcon"],"mappings":"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"}
|