@makeswift/runtime 0.24.0 → 0.24.1-canary.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.
@@ -40,16 +40,15 @@ var import_BackgroundsContainer = __toESM(require("../../shared/BackgroundsConta
40
40
  var import_use_global_style = require("../../../runtimes/react/use-global-style");
41
41
  var import_grid_item = require("../../shared/grid-item");
42
42
  var import_use_style = require("../../../runtimes/react/use-style");
43
+ var import_root_style_registry = require("../../../next/root-style-registry");
43
44
  const Root = (0, import_react.forwardRef)(function Page({ children, backgrounds, rowGap, columnGap }, ref) {
44
- (0, import_use_global_style.useGlobalStyle)({
45
- html: {
46
- boxSizing: "border-box"
47
- },
48
- "*, *::before, *::after": {
49
- boxSizing: "inherit"
50
- }
51
- });
52
- (0, import_use_global_style.useGlobalStyle)((0, import_polished.normalize)());
45
+ const cssResetEnabled = (0, import_root_style_registry.useCSSResetEnabled)();
46
+ (0, import_use_global_style.useGlobalStyle)(
47
+ cssResetEnabled ? [
48
+ { html: { boxSizing: "border-box" }, "*, *::before, *::after": { boxSizing: "inherit" } },
49
+ (0, import_polished.normalize)()
50
+ ] : []
51
+ );
53
52
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_BackgroundsContainer.default, { ref, style: { background: "white" }, backgrounds, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_use_style.useStyle)({ display: "flex", flexWrap: "wrap", width: "100%" }), children: children && children.elements.length > 0 ? children.elements.map((child, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
54
53
  import_grid_item.GridItem,
55
54
  {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/builtin/Root/Root.tsx"],"sourcesContent":["import { normalize } from 'polished'\nimport { forwardRef, Ref } from 'react'\n\nimport Placeholder from './components/Placeholder'\nimport { Element } from '../../../runtimes/react'\nimport BackgroundsContainer from '../../shared/BackgroundsContainer'\nimport { useGlobalStyle } from '../../../runtimes/react/use-global-style'\nimport { GridItem } from '../../shared/grid-item'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { GridData, ResponsiveBackgroundsData, ResponsiveGapData } from '@makeswift/prop-controllers'\n\ntype Props = {\n children?: GridData\n backgrounds?: ResponsiveBackgroundsData\n rowGap?: ResponsiveGapData\n columnGap?: ResponsiveGapData\n}\n\nconst Root = forwardRef(function Page(\n { children, backgrounds, rowGap, columnGap }: Props,\n ref: Ref<HTMLDivElement>,\n) {\n useGlobalStyle({\n html: {\n boxSizing: 'border-box',\n },\n '*, *::before, *::after': {\n boxSizing: 'inherit',\n },\n })\n\n useGlobalStyle(normalize())\n\n return (\n <BackgroundsContainer ref={ref} style={{ background: 'white' }} backgrounds={backgrounds}>\n <div className={useStyle({ display: 'flex', flexWrap: 'wrap', width: '100%' })}>\n {children && children.elements.length > 0 ? (\n children.elements.map((child, index) => (\n <GridItem\n key={child.key}\n grid={children.columns}\n index={index}\n columnGap={columnGap}\n rowGap={rowGap}\n >\n <Element element={child} />\n </GridItem>\n ))\n ) : (\n <Placeholder />\n )}\n </div>\n </BackgroundsContainer>\n )\n})\n\nexport default Root\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA6Cc;AA7Cd,sBAA0B;AAC1B,mBAAgC;AAEhC,yBAAwB;AACxB,IAAAA,gBAAwB;AACxB,kCAAiC;AACjC,8BAA+B;AAC/B,uBAAyB;AACzB,uBAAyB;AAUzB,MAAM,WAAO,yBAAW,SAAS,KAC/B,EAAE,UAAU,aAAa,QAAQ,UAAU,GAC3C,KACA;AACA,8CAAe;AAAA,IACb,MAAM;AAAA,MACJ,WAAW;AAAA,IACb;AAAA,IACA,0BAA0B;AAAA,MACxB,WAAW;AAAA,IACb;AAAA,EACF,CAAC;AAED,kDAAe,2BAAU,CAAC;AAE1B,SACE,4CAAC,4BAAAC,SAAA,EAAqB,KAAU,OAAO,EAAE,YAAY,QAAQ,GAAG,aAC9D,sDAAC,SAAI,eAAW,2BAAS,EAAE,SAAS,QAAQ,UAAU,QAAQ,OAAO,OAAO,CAAC,GAC1E,sBAAY,SAAS,SAAS,SAAS,IACtC,SAAS,SAAS,IAAI,CAAC,OAAO,UAC5B;AAAA,IAAC;AAAA;AAAA,MAEC,MAAM,SAAS;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MAEA,sDAAC,yBAAQ,SAAS,OAAO;AAAA;AAAA,IANpB,MAAM;AAAA,EAOb,CACD,IAED,4CAAC,mBAAAC,SAAA,EAAY,GAEjB,GACF;AAEJ,CAAC;AAED,IAAO,eAAQ;","names":["import_react","BackgroundsContainer","Placeholder"]}
1
+ {"version":3,"sources":["../../../../../src/components/builtin/Root/Root.tsx"],"sourcesContent":["import { normalize } from 'polished'\nimport { forwardRef, Ref } from 'react'\n\nimport Placeholder from './components/Placeholder'\nimport { Element } from '../../../runtimes/react'\nimport BackgroundsContainer from '../../shared/BackgroundsContainer'\nimport { useGlobalStyle } from '../../../runtimes/react/use-global-style'\nimport { GridItem } from '../../shared/grid-item'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { GridData, ResponsiveBackgroundsData, ResponsiveGapData } from '@makeswift/prop-controllers'\nimport { useCSSResetEnabled } from '../../../next/root-style-registry'\n\ntype Props = {\n children?: GridData\n backgrounds?: ResponsiveBackgroundsData\n rowGap?: ResponsiveGapData\n columnGap?: ResponsiveGapData\n}\n\nconst Root = forwardRef(function Page(\n { children, backgrounds, rowGap, columnGap }: Props,\n ref: Ref<HTMLDivElement>,\n) {\n const cssResetEnabled = useCSSResetEnabled()\n\n useGlobalStyle(\n cssResetEnabled\n ? [\n { html: { boxSizing: 'border-box' }, '*, *::before, *::after': { boxSizing: 'inherit' } },\n normalize(),\n ]\n : [],\n )\n\n return (\n <BackgroundsContainer ref={ref} style={{ background: 'white' }} backgrounds={backgrounds}>\n <div className={useStyle({ display: 'flex', flexWrap: 'wrap', width: '100%' })}>\n {children && children.elements.length > 0 ? (\n children.elements.map((child, index) => (\n <GridItem\n key={child.key}\n grid={children.columns}\n index={index}\n columnGap={columnGap}\n rowGap={rowGap}\n >\n <Element element={child} />\n </GridItem>\n ))\n ) : (\n <Placeholder />\n )}\n </div>\n </BackgroundsContainer>\n )\n})\n\nexport default Root\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA8Cc;AA9Cd,sBAA0B;AAC1B,mBAAgC;AAEhC,yBAAwB;AACxB,IAAAA,gBAAwB;AACxB,kCAAiC;AACjC,8BAA+B;AAC/B,uBAAyB;AACzB,uBAAyB;AAEzB,iCAAmC;AASnC,MAAM,WAAO,yBAAW,SAAS,KAC/B,EAAE,UAAU,aAAa,QAAQ,UAAU,GAC3C,KACA;AACA,QAAM,sBAAkB,+CAAmB;AAE3C;AAAA,IACE,kBACI;AAAA,MACE,EAAE,MAAM,EAAE,WAAW,aAAa,GAAG,0BAA0B,EAAE,WAAW,UAAU,EAAE;AAAA,UACxF,2BAAU;AAAA,IACZ,IACA,CAAC;AAAA,EACP;AAEA,SACE,4CAAC,4BAAAC,SAAA,EAAqB,KAAU,OAAO,EAAE,YAAY,QAAQ,GAAG,aAC9D,sDAAC,SAAI,eAAW,2BAAS,EAAE,SAAS,QAAQ,UAAU,QAAQ,OAAO,OAAO,CAAC,GAC1E,sBAAY,SAAS,SAAS,SAAS,IACtC,SAAS,SAAS,IAAI,CAAC,OAAO,UAC5B;AAAA,IAAC;AAAA;AAAA,MAEC,MAAM,SAAS;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MAEA,sDAAC,yBAAQ,SAAS,OAAO;AAAA;AAAA,IANpB,MAAM;AAAA,EAOb,CACD,IAED,4CAAC,mBAAAC,SAAA,EAAY,GAEjB,GACF;AAEJ,CAAC;AAED,IAAO,eAAQ;","names":["import_react","BackgroundsContainer","Placeholder"]}
@@ -37,7 +37,7 @@ async function handler(...args) {
37
37
  const supportsDraftMode = (0, import_ts_pattern.match)(args).with(routeHandlerPattern, () => true).with(apiRoutePattern, () => false).exhaustive();
38
38
  const supportsWebhook = (0, import_ts_pattern.match)(args).with(routeHandlerPattern, () => true).with(apiRoutePattern, () => false).exhaustive();
39
39
  const body = {
40
- version: "0.24.0",
40
+ version: "0.24.1-canary.0",
41
41
  previewMode: supportsPreviewMode,
42
42
  draftMode: supportsDraftMode,
43
43
  interactionMode: true,
@@ -30,6 +30,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
30
30
  var root_style_registry_exports = {};
31
31
  __export(root_style_registry_exports, {
32
32
  RootStyleRegistry: () => RootStyleRegistry,
33
+ useCSSResetEnabled: () => useCSSResetEnabled,
33
34
  useCache: () => useCache
34
35
  });
35
36
  module.exports = __toCommonJS(root_style_registry_exports);
@@ -39,6 +40,8 @@ var import_css = require("@emotion/css");
39
40
  var import_navigation = require("next/navigation");
40
41
  var import_react = require("react");
41
42
  const CacheContext = (0, import_react.createContext)(import_css.cache);
43
+ const DEFAULT_CSS_RESET_ENABLED = true;
44
+ const CSSResetEnabledContext = (0, import_react.createContext)(DEFAULT_CSS_RESET_ENABLED);
42
45
  const createRootStyleCache = ({ key }) => {
43
46
  const cache2 = (0, import_cache.default)({ key });
44
47
  cache2.compat = true;
@@ -60,7 +63,8 @@ const createRootStyleCache = ({ key }) => {
60
63
  };
61
64
  function RootStyleRegistry({
62
65
  children,
63
- cacheKey
66
+ cacheKey,
67
+ enableCssReset = DEFAULT_CSS_RESET_ENABLED
64
68
  }) {
65
69
  const [{ cache: cache2, flush }] = (0, import_react.useState)(() => createRootStyleCache({ key: cacheKey ?? "mswft" }));
66
70
  (0, import_navigation.useServerInsertedHTML)(() => {
@@ -81,14 +85,18 @@ function RootStyleRegistry({
81
85
  }
82
86
  );
83
87
  });
84
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CacheContext.Provider, { value: cache2, children });
88
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CacheContext.Provider, { value: cache2, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CSSResetEnabledContext.Provider, { value: enableCssReset, children }) });
85
89
  }
86
90
  function useCache() {
87
91
  return (0, import_react.useContext)(CacheContext);
88
92
  }
93
+ function useCSSResetEnabled() {
94
+ return (0, import_react.useContext)(CSSResetEnabledContext);
95
+ }
89
96
  // Annotate the CommonJS export names for ESM import in node:
90
97
  0 && (module.exports = {
91
98
  RootStyleRegistry,
99
+ useCSSResetEnabled,
92
100
  useCache
93
101
  });
94
102
  //# sourceMappingURL=root-style-registry.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/next/root-style-registry.tsx"],"sourcesContent":["'use client'\n\nimport createCache, { EmotionCache } from '@emotion/cache'\nimport { cache } from '@emotion/css'\nimport { useServerInsertedHTML } from 'next/navigation'\nimport { ReactNode, createContext, useContext, useState } from 'react'\n\nconst CacheContext = createContext(cache)\n\nconst createRootStyleCache = ({ key }: { key: string }) => {\n const cache = createCache({ key })\n cache.compat = true\n\n const prevInsert = cache.insert\n let inserted: string[] = []\n\n cache.insert = (...args) => {\n const serialized = args[1]\n if (cache.inserted[serialized.name] === undefined) {\n inserted.push(serialized.name)\n }\n return prevInsert(...args)\n }\n\n const flush = () => {\n const prevInserted = inserted\n inserted = []\n return prevInserted\n }\n\n return { cache, flush }\n}\n\nexport function RootStyleRegistry({\n children,\n cacheKey,\n}: {\n children: ReactNode\n cacheKey?: string\n}) {\n const [{ cache, flush }] = useState(() => createRootStyleCache({ key: cacheKey ?? 'mswft' }))\n\n useServerInsertedHTML(() => {\n const names = flush()\n if (names.length === 0) return null\n let styles = ''\n for (const name of names) {\n styles += cache.inserted[name]\n }\n\n return (\n <style\n data-emotion={`${cache.key} ${names.join(' ')}`}\n dangerouslySetInnerHTML={{\n __html: styles,\n }}\n />\n )\n })\n\n return <CacheContext.Provider value={cache}>{children}</CacheContext.Provider>\n}\n\nexport function useCache(): EmotionCache {\n return useContext(CacheContext)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmDM;AAjDN,mBAA0C;AAC1C,iBAAsB;AACtB,wBAAsC;AACtC,mBAA+D;AAE/D,MAAM,mBAAe,4BAAc,gBAAK;AAExC,MAAM,uBAAuB,CAAC,EAAE,IAAI,MAAuB;AACzD,QAAMA,aAAQ,aAAAC,SAAY,EAAE,IAAI,CAAC;AACjC,EAAAD,OAAM,SAAS;AAEf,QAAM,aAAaA,OAAM;AACzB,MAAI,WAAqB,CAAC;AAE1B,EAAAA,OAAM,SAAS,IAAI,SAAS;AAC1B,UAAM,aAAa,KAAK,CAAC;AACzB,QAAIA,OAAM,SAAS,WAAW,IAAI,MAAM,QAAW;AACjD,eAAS,KAAK,WAAW,IAAI;AAAA,IAC/B;AACA,WAAO,WAAW,GAAG,IAAI;AAAA,EAC3B;AAEA,QAAM,QAAQ,MAAM;AAClB,UAAM,eAAe;AACrB,eAAW,CAAC;AACZ,WAAO;AAAA,EACT;AAEA,SAAO,EAAE,OAAAA,QAAO,MAAM;AACxB;AAEO,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA;AACF,GAGG;AACD,QAAM,CAAC,EAAE,OAAAA,QAAO,MAAM,CAAC,QAAI,uBAAS,MAAM,qBAAqB,EAAE,KAAK,YAAY,QAAQ,CAAC,CAAC;AAE5F,+CAAsB,MAAM;AAC1B,UAAM,QAAQ,MAAM;AACpB,QAAI,MAAM,WAAW;AAAG,aAAO;AAC/B,QAAI,SAAS;AACb,eAAW,QAAQ,OAAO;AACxB,gBAAUA,OAAM,SAAS,IAAI;AAAA,IAC/B;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,gBAAc,GAAGA,OAAM,GAAG,IAAI,MAAM,KAAK,GAAG,CAAC;AAAA,QAC7C,yBAAyB;AAAA,UACvB,QAAQ;AAAA,QACV;AAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AAED,SAAO,4CAAC,aAAa,UAAb,EAAsB,OAAOA,QAAQ,UAAS;AACxD;AAEO,SAAS,WAAyB;AACvC,aAAO,yBAAW,YAAY;AAChC;","names":["cache","createCache"]}
1
+ {"version":3,"sources":["../../../src/next/root-style-registry.tsx"],"sourcesContent":["'use client'\n\nimport createCache, { EmotionCache } from '@emotion/cache'\nimport { cache } from '@emotion/css'\nimport { useServerInsertedHTML } from 'next/navigation'\nimport { ReactNode, createContext, useContext, useState } from 'react'\n\nconst CacheContext = createContext(cache)\n\nconst DEFAULT_CSS_RESET_ENABLED = true\nconst CSSResetEnabledContext = createContext(DEFAULT_CSS_RESET_ENABLED)\n\nconst createRootStyleCache = ({ key }: { key: string }) => {\n const cache = createCache({ key })\n cache.compat = true\n\n const prevInsert = cache.insert\n let inserted: string[] = []\n\n cache.insert = (...args) => {\n const serialized = args[1]\n if (cache.inserted[serialized.name] === undefined) {\n inserted.push(serialized.name)\n }\n return prevInsert(...args)\n }\n\n const flush = () => {\n const prevInserted = inserted\n inserted = []\n return prevInserted\n }\n\n return { cache, flush }\n}\n\ntype Props = {\n children: ReactNode\n cacheKey?: string\n /**\n * Toggle the built-in CSS reset.\n * Set to `false` when using `@layer`-based CSS frameworks like Tailwind.\n */\n enableCssReset?: boolean\n}\n\nexport function RootStyleRegistry({\n children,\n cacheKey,\n enableCssReset = DEFAULT_CSS_RESET_ENABLED,\n}: Props) {\n const [{ cache, flush }] = useState(() => createRootStyleCache({ key: cacheKey ?? 'mswft' }))\n\n useServerInsertedHTML(() => {\n const names = flush()\n if (names.length === 0) return null\n let styles = ''\n for (const name of names) {\n styles += cache.inserted[name]\n }\n\n return (\n <style\n data-emotion={`${cache.key} ${names.join(' ')}`}\n dangerouslySetInnerHTML={{\n __html: styles,\n }}\n />\n )\n })\n\n return (\n <CacheContext.Provider value={cache}>\n <CSSResetEnabledContext.Provider value={enableCssReset}>\n {children}\n </CSSResetEnabledContext.Provider>\n </CacheContext.Provider>\n )\n}\n\nexport function useCache(): EmotionCache {\n return useContext(CacheContext)\n}\n\nexport function useCSSResetEnabled(): boolean {\n return useContext(CSSResetEnabledContext)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA8DM;AA5DN,mBAA0C;AAC1C,iBAAsB;AACtB,wBAAsC;AACtC,mBAA+D;AAE/D,MAAM,mBAAe,4BAAc,gBAAK;AAExC,MAAM,4BAA4B;AAClC,MAAM,6BAAyB,4BAAc,yBAAyB;AAEtE,MAAM,uBAAuB,CAAC,EAAE,IAAI,MAAuB;AACzD,QAAMA,aAAQ,aAAAC,SAAY,EAAE,IAAI,CAAC;AACjC,EAAAD,OAAM,SAAS;AAEf,QAAM,aAAaA,OAAM;AACzB,MAAI,WAAqB,CAAC;AAE1B,EAAAA,OAAM,SAAS,IAAI,SAAS;AAC1B,UAAM,aAAa,KAAK,CAAC;AACzB,QAAIA,OAAM,SAAS,WAAW,IAAI,MAAM,QAAW;AACjD,eAAS,KAAK,WAAW,IAAI;AAAA,IAC/B;AACA,WAAO,WAAW,GAAG,IAAI;AAAA,EAC3B;AAEA,QAAM,QAAQ,MAAM;AAClB,UAAM,eAAe;AACrB,eAAW,CAAC;AACZ,WAAO;AAAA,EACT;AAEA,SAAO,EAAE,OAAAA,QAAO,MAAM;AACxB;AAYO,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA;AAAA,EACA,iBAAiB;AACnB,GAAU;AACR,QAAM,CAAC,EAAE,OAAAA,QAAO,MAAM,CAAC,QAAI,uBAAS,MAAM,qBAAqB,EAAE,KAAK,YAAY,QAAQ,CAAC,CAAC;AAE5F,+CAAsB,MAAM;AAC1B,UAAM,QAAQ,MAAM;AACpB,QAAI,MAAM,WAAW;AAAG,aAAO;AAC/B,QAAI,SAAS;AACb,eAAW,QAAQ,OAAO;AACxB,gBAAUA,OAAM,SAAS,IAAI;AAAA,IAC/B;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,gBAAc,GAAGA,OAAM,GAAG,IAAI,MAAM,KAAK,GAAG,CAAC;AAAA,QAC7C,yBAAyB;AAAA,UACvB,QAAQ;AAAA,QACV;AAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AAED,SACE,4CAAC,aAAa,UAAb,EAAsB,OAAOA,QAC5B,sDAAC,uBAAuB,UAAvB,EAAgC,OAAO,gBACrC,UACH,GACF;AAEJ;AAEO,SAAS,WAAyB;AACvC,aAAO,yBAAW,YAAY;AAChC;AAEO,SAAS,qBAA8B;AAC5C,aAAO,yBAAW,sBAAsB;AAC1C;","names":["cache","createCache"]}
@@ -7,16 +7,15 @@ import BackgroundsContainer from "../../shared/BackgroundsContainer";
7
7
  import { useGlobalStyle } from "../../../runtimes/react/use-global-style";
8
8
  import { GridItem } from "../../shared/grid-item";
9
9
  import { useStyle } from "../../../runtimes/react/use-style";
10
+ import { useCSSResetEnabled } from "../../../next/root-style-registry";
10
11
  const Root = forwardRef(function Page({ children, backgrounds, rowGap, columnGap }, ref) {
11
- useGlobalStyle({
12
- html: {
13
- boxSizing: "border-box"
14
- },
15
- "*, *::before, *::after": {
16
- boxSizing: "inherit"
17
- }
18
- });
19
- useGlobalStyle(normalize());
12
+ const cssResetEnabled = useCSSResetEnabled();
13
+ useGlobalStyle(
14
+ cssResetEnabled ? [
15
+ { html: { boxSizing: "border-box" }, "*, *::before, *::after": { boxSizing: "inherit" } },
16
+ normalize()
17
+ ] : []
18
+ );
20
19
  return /* @__PURE__ */ jsx(BackgroundsContainer, { ref, style: { background: "white" }, backgrounds, children: /* @__PURE__ */ jsx("div", { className: useStyle({ display: "flex", flexWrap: "wrap", width: "100%" }), children: children && children.elements.length > 0 ? children.elements.map((child, index) => /* @__PURE__ */ jsx(
21
20
  GridItem,
22
21
  {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/builtin/Root/Root.tsx"],"sourcesContent":["import { normalize } from 'polished'\nimport { forwardRef, Ref } from 'react'\n\nimport Placeholder from './components/Placeholder'\nimport { Element } from '../../../runtimes/react'\nimport BackgroundsContainer from '../../shared/BackgroundsContainer'\nimport { useGlobalStyle } from '../../../runtimes/react/use-global-style'\nimport { GridItem } from '../../shared/grid-item'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { GridData, ResponsiveBackgroundsData, ResponsiveGapData } from '@makeswift/prop-controllers'\n\ntype Props = {\n children?: GridData\n backgrounds?: ResponsiveBackgroundsData\n rowGap?: ResponsiveGapData\n columnGap?: ResponsiveGapData\n}\n\nconst Root = forwardRef(function Page(\n { children, backgrounds, rowGap, columnGap }: Props,\n ref: Ref<HTMLDivElement>,\n) {\n useGlobalStyle({\n html: {\n boxSizing: 'border-box',\n },\n '*, *::before, *::after': {\n boxSizing: 'inherit',\n },\n })\n\n useGlobalStyle(normalize())\n\n return (\n <BackgroundsContainer ref={ref} style={{ background: 'white' }} backgrounds={backgrounds}>\n <div className={useStyle({ display: 'flex', flexWrap: 'wrap', width: '100%' })}>\n {children && children.elements.length > 0 ? (\n children.elements.map((child, index) => (\n <GridItem\n key={child.key}\n grid={children.columns}\n index={index}\n columnGap={columnGap}\n rowGap={rowGap}\n >\n <Element element={child} />\n </GridItem>\n ))\n ) : (\n <Placeholder />\n )}\n </div>\n </BackgroundsContainer>\n )\n})\n\nexport default Root\n"],"mappings":"AA6Cc;AA7Cd,SAAS,iBAAiB;AAC1B,SAAS,kBAAuB;AAEhC,OAAO,iBAAiB;AACxB,SAAS,eAAe;AACxB,OAAO,0BAA0B;AACjC,SAAS,sBAAsB;AAC/B,SAAS,gBAAgB;AACzB,SAAS,gBAAgB;AAUzB,MAAM,OAAO,WAAW,SAAS,KAC/B,EAAE,UAAU,aAAa,QAAQ,UAAU,GAC3C,KACA;AACA,iBAAe;AAAA,IACb,MAAM;AAAA,MACJ,WAAW;AAAA,IACb;AAAA,IACA,0BAA0B;AAAA,MACxB,WAAW;AAAA,IACb;AAAA,EACF,CAAC;AAED,iBAAe,UAAU,CAAC;AAE1B,SACE,oBAAC,wBAAqB,KAAU,OAAO,EAAE,YAAY,QAAQ,GAAG,aAC9D,8BAAC,SAAI,WAAW,SAAS,EAAE,SAAS,QAAQ,UAAU,QAAQ,OAAO,OAAO,CAAC,GAC1E,sBAAY,SAAS,SAAS,SAAS,IACtC,SAAS,SAAS,IAAI,CAAC,OAAO,UAC5B;AAAA,IAAC;AAAA;AAAA,MAEC,MAAM,SAAS;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MAEA,8BAAC,WAAQ,SAAS,OAAO;AAAA;AAAA,IANpB,MAAM;AAAA,EAOb,CACD,IAED,oBAAC,eAAY,GAEjB,GACF;AAEJ,CAAC;AAED,IAAO,eAAQ;","names":[]}
1
+ {"version":3,"sources":["../../../../../src/components/builtin/Root/Root.tsx"],"sourcesContent":["import { normalize } from 'polished'\nimport { forwardRef, Ref } from 'react'\n\nimport Placeholder from './components/Placeholder'\nimport { Element } from '../../../runtimes/react'\nimport BackgroundsContainer from '../../shared/BackgroundsContainer'\nimport { useGlobalStyle } from '../../../runtimes/react/use-global-style'\nimport { GridItem } from '../../shared/grid-item'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { GridData, ResponsiveBackgroundsData, ResponsiveGapData } from '@makeswift/prop-controllers'\nimport { useCSSResetEnabled } from '../../../next/root-style-registry'\n\ntype Props = {\n children?: GridData\n backgrounds?: ResponsiveBackgroundsData\n rowGap?: ResponsiveGapData\n columnGap?: ResponsiveGapData\n}\n\nconst Root = forwardRef(function Page(\n { children, backgrounds, rowGap, columnGap }: Props,\n ref: Ref<HTMLDivElement>,\n) {\n const cssResetEnabled = useCSSResetEnabled()\n\n useGlobalStyle(\n cssResetEnabled\n ? [\n { html: { boxSizing: 'border-box' }, '*, *::before, *::after': { boxSizing: 'inherit' } },\n normalize(),\n ]\n : [],\n )\n\n return (\n <BackgroundsContainer ref={ref} style={{ background: 'white' }} backgrounds={backgrounds}>\n <div className={useStyle({ display: 'flex', flexWrap: 'wrap', width: '100%' })}>\n {children && children.elements.length > 0 ? (\n children.elements.map((child, index) => (\n <GridItem\n key={child.key}\n grid={children.columns}\n index={index}\n columnGap={columnGap}\n rowGap={rowGap}\n >\n <Element element={child} />\n </GridItem>\n ))\n ) : (\n <Placeholder />\n )}\n </div>\n </BackgroundsContainer>\n )\n})\n\nexport default Root\n"],"mappings":"AA8Cc;AA9Cd,SAAS,iBAAiB;AAC1B,SAAS,kBAAuB;AAEhC,OAAO,iBAAiB;AACxB,SAAS,eAAe;AACxB,OAAO,0BAA0B;AACjC,SAAS,sBAAsB;AAC/B,SAAS,gBAAgB;AACzB,SAAS,gBAAgB;AAEzB,SAAS,0BAA0B;AASnC,MAAM,OAAO,WAAW,SAAS,KAC/B,EAAE,UAAU,aAAa,QAAQ,UAAU,GAC3C,KACA;AACA,QAAM,kBAAkB,mBAAmB;AAE3C;AAAA,IACE,kBACI;AAAA,MACE,EAAE,MAAM,EAAE,WAAW,aAAa,GAAG,0BAA0B,EAAE,WAAW,UAAU,EAAE;AAAA,MACxF,UAAU;AAAA,IACZ,IACA,CAAC;AAAA,EACP;AAEA,SACE,oBAAC,wBAAqB,KAAU,OAAO,EAAE,YAAY,QAAQ,GAAG,aAC9D,8BAAC,SAAI,WAAW,SAAS,EAAE,SAAS,QAAQ,UAAU,QAAQ,OAAO,OAAO,CAAC,GAC1E,sBAAY,SAAS,SAAS,SAAS,IACtC,SAAS,SAAS,IAAI,CAAC,OAAO,UAC5B;AAAA,IAAC;AAAA;AAAA,MAEC,MAAM,SAAS;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MAEA,8BAAC,WAAQ,SAAS,OAAO;AAAA;AAAA,IANpB,MAAM;AAAA,EAOb,CACD,IAED,oBAAC,eAAY,GAEjB,GACF;AAEJ,CAAC;AAED,IAAO,eAAQ;","names":[]}
@@ -14,7 +14,7 @@ async function handler(...args) {
14
14
  const supportsDraftMode = match(args).with(routeHandlerPattern, () => true).with(apiRoutePattern, () => false).exhaustive();
15
15
  const supportsWebhook = match(args).with(routeHandlerPattern, () => true).with(apiRoutePattern, () => false).exhaustive();
16
16
  const body = {
17
- version: "0.24.0",
17
+ version: "0.24.1-canary.0",
18
18
  previewMode: supportsPreviewMode,
19
19
  draftMode: supportsDraftMode,
20
20
  interactionMode: true,
@@ -5,6 +5,8 @@ import { cache } from "@emotion/css";
5
5
  import { useServerInsertedHTML } from "next/navigation";
6
6
  import { createContext, useContext, useState } from "react";
7
7
  const CacheContext = createContext(cache);
8
+ const DEFAULT_CSS_RESET_ENABLED = true;
9
+ const CSSResetEnabledContext = createContext(DEFAULT_CSS_RESET_ENABLED);
8
10
  const createRootStyleCache = ({ key }) => {
9
11
  const cache2 = createCache({ key });
10
12
  cache2.compat = true;
@@ -26,7 +28,8 @@ const createRootStyleCache = ({ key }) => {
26
28
  };
27
29
  function RootStyleRegistry({
28
30
  children,
29
- cacheKey
31
+ cacheKey,
32
+ enableCssReset = DEFAULT_CSS_RESET_ENABLED
30
33
  }) {
31
34
  const [{ cache: cache2, flush }] = useState(() => createRootStyleCache({ key: cacheKey ?? "mswft" }));
32
35
  useServerInsertedHTML(() => {
@@ -47,13 +50,17 @@ function RootStyleRegistry({
47
50
  }
48
51
  );
49
52
  });
50
- return /* @__PURE__ */ jsx(CacheContext.Provider, { value: cache2, children });
53
+ return /* @__PURE__ */ jsx(CacheContext.Provider, { value: cache2, children: /* @__PURE__ */ jsx(CSSResetEnabledContext.Provider, { value: enableCssReset, children }) });
51
54
  }
52
55
  function useCache() {
53
56
  return useContext(CacheContext);
54
57
  }
58
+ function useCSSResetEnabled() {
59
+ return useContext(CSSResetEnabledContext);
60
+ }
55
61
  export {
56
62
  RootStyleRegistry,
63
+ useCSSResetEnabled,
57
64
  useCache
58
65
  };
59
66
  //# sourceMappingURL=root-style-registry.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/next/root-style-registry.tsx"],"sourcesContent":["'use client'\n\nimport createCache, { EmotionCache } from '@emotion/cache'\nimport { cache } from '@emotion/css'\nimport { useServerInsertedHTML } from 'next/navigation'\nimport { ReactNode, createContext, useContext, useState } from 'react'\n\nconst CacheContext = createContext(cache)\n\nconst createRootStyleCache = ({ key }: { key: string }) => {\n const cache = createCache({ key })\n cache.compat = true\n\n const prevInsert = cache.insert\n let inserted: string[] = []\n\n cache.insert = (...args) => {\n const serialized = args[1]\n if (cache.inserted[serialized.name] === undefined) {\n inserted.push(serialized.name)\n }\n return prevInsert(...args)\n }\n\n const flush = () => {\n const prevInserted = inserted\n inserted = []\n return prevInserted\n }\n\n return { cache, flush }\n}\n\nexport function RootStyleRegistry({\n children,\n cacheKey,\n}: {\n children: ReactNode\n cacheKey?: string\n}) {\n const [{ cache, flush }] = useState(() => createRootStyleCache({ key: cacheKey ?? 'mswft' }))\n\n useServerInsertedHTML(() => {\n const names = flush()\n if (names.length === 0) return null\n let styles = ''\n for (const name of names) {\n styles += cache.inserted[name]\n }\n\n return (\n <style\n data-emotion={`${cache.key} ${names.join(' ')}`}\n dangerouslySetInnerHTML={{\n __html: styles,\n }}\n />\n )\n })\n\n return <CacheContext.Provider value={cache}>{children}</CacheContext.Provider>\n}\n\nexport function useCache(): EmotionCache {\n return useContext(CacheContext)\n}\n"],"mappings":";AAmDM;AAjDN,OAAO,iBAAmC;AAC1C,SAAS,aAAa;AACtB,SAAS,6BAA6B;AACtC,SAAoB,eAAe,YAAY,gBAAgB;AAE/D,MAAM,eAAe,cAAc,KAAK;AAExC,MAAM,uBAAuB,CAAC,EAAE,IAAI,MAAuB;AACzD,QAAMA,SAAQ,YAAY,EAAE,IAAI,CAAC;AACjC,EAAAA,OAAM,SAAS;AAEf,QAAM,aAAaA,OAAM;AACzB,MAAI,WAAqB,CAAC;AAE1B,EAAAA,OAAM,SAAS,IAAI,SAAS;AAC1B,UAAM,aAAa,KAAK,CAAC;AACzB,QAAIA,OAAM,SAAS,WAAW,IAAI,MAAM,QAAW;AACjD,eAAS,KAAK,WAAW,IAAI;AAAA,IAC/B;AACA,WAAO,WAAW,GAAG,IAAI;AAAA,EAC3B;AAEA,QAAM,QAAQ,MAAM;AAClB,UAAM,eAAe;AACrB,eAAW,CAAC;AACZ,WAAO;AAAA,EACT;AAEA,SAAO,EAAE,OAAAA,QAAO,MAAM;AACxB;AAEO,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA;AACF,GAGG;AACD,QAAM,CAAC,EAAE,OAAAA,QAAO,MAAM,CAAC,IAAI,SAAS,MAAM,qBAAqB,EAAE,KAAK,YAAY,QAAQ,CAAC,CAAC;AAE5F,wBAAsB,MAAM;AAC1B,UAAM,QAAQ,MAAM;AACpB,QAAI,MAAM,WAAW;AAAG,aAAO;AAC/B,QAAI,SAAS;AACb,eAAW,QAAQ,OAAO;AACxB,gBAAUA,OAAM,SAAS,IAAI;AAAA,IAC/B;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,gBAAc,GAAGA,OAAM,GAAG,IAAI,MAAM,KAAK,GAAG,CAAC;AAAA,QAC7C,yBAAyB;AAAA,UACvB,QAAQ;AAAA,QACV;AAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AAED,SAAO,oBAAC,aAAa,UAAb,EAAsB,OAAOA,QAAQ,UAAS;AACxD;AAEO,SAAS,WAAyB;AACvC,SAAO,WAAW,YAAY;AAChC;","names":["cache"]}
1
+ {"version":3,"sources":["../../../src/next/root-style-registry.tsx"],"sourcesContent":["'use client'\n\nimport createCache, { EmotionCache } from '@emotion/cache'\nimport { cache } from '@emotion/css'\nimport { useServerInsertedHTML } from 'next/navigation'\nimport { ReactNode, createContext, useContext, useState } from 'react'\n\nconst CacheContext = createContext(cache)\n\nconst DEFAULT_CSS_RESET_ENABLED = true\nconst CSSResetEnabledContext = createContext(DEFAULT_CSS_RESET_ENABLED)\n\nconst createRootStyleCache = ({ key }: { key: string }) => {\n const cache = createCache({ key })\n cache.compat = true\n\n const prevInsert = cache.insert\n let inserted: string[] = []\n\n cache.insert = (...args) => {\n const serialized = args[1]\n if (cache.inserted[serialized.name] === undefined) {\n inserted.push(serialized.name)\n }\n return prevInsert(...args)\n }\n\n const flush = () => {\n const prevInserted = inserted\n inserted = []\n return prevInserted\n }\n\n return { cache, flush }\n}\n\ntype Props = {\n children: ReactNode\n cacheKey?: string\n /**\n * Toggle the built-in CSS reset.\n * Set to `false` when using `@layer`-based CSS frameworks like Tailwind.\n */\n enableCssReset?: boolean\n}\n\nexport function RootStyleRegistry({\n children,\n cacheKey,\n enableCssReset = DEFAULT_CSS_RESET_ENABLED,\n}: Props) {\n const [{ cache, flush }] = useState(() => createRootStyleCache({ key: cacheKey ?? 'mswft' }))\n\n useServerInsertedHTML(() => {\n const names = flush()\n if (names.length === 0) return null\n let styles = ''\n for (const name of names) {\n styles += cache.inserted[name]\n }\n\n return (\n <style\n data-emotion={`${cache.key} ${names.join(' ')}`}\n dangerouslySetInnerHTML={{\n __html: styles,\n }}\n />\n )\n })\n\n return (\n <CacheContext.Provider value={cache}>\n <CSSResetEnabledContext.Provider value={enableCssReset}>\n {children}\n </CSSResetEnabledContext.Provider>\n </CacheContext.Provider>\n )\n}\n\nexport function useCache(): EmotionCache {\n return useContext(CacheContext)\n}\n\nexport function useCSSResetEnabled(): boolean {\n return useContext(CSSResetEnabledContext)\n}\n"],"mappings":";AA8DM;AA5DN,OAAO,iBAAmC;AAC1C,SAAS,aAAa;AACtB,SAAS,6BAA6B;AACtC,SAAoB,eAAe,YAAY,gBAAgB;AAE/D,MAAM,eAAe,cAAc,KAAK;AAExC,MAAM,4BAA4B;AAClC,MAAM,yBAAyB,cAAc,yBAAyB;AAEtE,MAAM,uBAAuB,CAAC,EAAE,IAAI,MAAuB;AACzD,QAAMA,SAAQ,YAAY,EAAE,IAAI,CAAC;AACjC,EAAAA,OAAM,SAAS;AAEf,QAAM,aAAaA,OAAM;AACzB,MAAI,WAAqB,CAAC;AAE1B,EAAAA,OAAM,SAAS,IAAI,SAAS;AAC1B,UAAM,aAAa,KAAK,CAAC;AACzB,QAAIA,OAAM,SAAS,WAAW,IAAI,MAAM,QAAW;AACjD,eAAS,KAAK,WAAW,IAAI;AAAA,IAC/B;AACA,WAAO,WAAW,GAAG,IAAI;AAAA,EAC3B;AAEA,QAAM,QAAQ,MAAM;AAClB,UAAM,eAAe;AACrB,eAAW,CAAC;AACZ,WAAO;AAAA,EACT;AAEA,SAAO,EAAE,OAAAA,QAAO,MAAM;AACxB;AAYO,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA;AAAA,EACA,iBAAiB;AACnB,GAAU;AACR,QAAM,CAAC,EAAE,OAAAA,QAAO,MAAM,CAAC,IAAI,SAAS,MAAM,qBAAqB,EAAE,KAAK,YAAY,QAAQ,CAAC,CAAC;AAE5F,wBAAsB,MAAM;AAC1B,UAAM,QAAQ,MAAM;AACpB,QAAI,MAAM,WAAW;AAAG,aAAO;AAC/B,QAAI,SAAS;AACb,eAAW,QAAQ,OAAO;AACxB,gBAAUA,OAAM,SAAS,IAAI;AAAA,IAC/B;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,gBAAc,GAAGA,OAAM,GAAG,IAAI,MAAM,KAAK,GAAG,CAAC;AAAA,QAC7C,yBAAyB;AAAA,UACvB,QAAQ;AAAA,QACV;AAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AAED,SACE,oBAAC,aAAa,UAAb,EAAsB,OAAOA,QAC5B,8BAAC,uBAAuB,UAAvB,EAAgC,OAAO,gBACrC,UACH,GACF;AAEJ;AAEO,SAAS,WAAyB;AACvC,SAAO,WAAW,YAAY;AAChC;AAEO,SAAS,qBAA8B;AAC5C,SAAO,WAAW,sBAAsB;AAC1C;","names":["cache"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Root.d.ts","sourceRoot":"","sources":["../../../../../src/components/builtin/Root/Root.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,QAAQ,EAAE,yBAAyB,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAA;AAEpG,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,WAAW,CAAC,EAAE,yBAAyB,CAAA;IACvC,MAAM,CAAC,EAAE,iBAAiB,CAAA;IAC1B,SAAS,CAAC,EAAE,iBAAiB,CAAA;CAC9B,CAAA;AAED,QAAA,MAAM,IAAI,kGAoCR,CAAA;AAEF,eAAe,IAAI,CAAA"}
1
+ {"version":3,"file":"Root.d.ts","sourceRoot":"","sources":["../../../../../src/components/builtin/Root/Root.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,QAAQ,EAAE,yBAAyB,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAA;AAGpG,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,WAAW,CAAC,EAAE,yBAAyB,CAAA;IACvC,MAAM,CAAC,EAAE,iBAAiB,CAAA;IAC1B,SAAS,CAAC,EAAE,iBAAiB,CAAA;CAC9B,CAAA;AAED,QAAA,MAAM,IAAI,kGAoCR,CAAA;AAEF,eAAe,IAAI,CAAA"}
@@ -1,8 +1,16 @@
1
1
  import { EmotionCache } from '@emotion/cache';
2
2
  import { ReactNode } from 'react';
3
- export declare function RootStyleRegistry({ children, cacheKey, }: {
3
+ type Props = {
4
4
  children: ReactNode;
5
5
  cacheKey?: string;
6
- }): import("react/jsx-runtime").JSX.Element;
6
+ /**
7
+ * Toggle the built-in CSS reset.
8
+ * Set to `false` when using `@layer`-based CSS frameworks like Tailwind.
9
+ */
10
+ enableCssReset?: boolean;
11
+ };
12
+ export declare function RootStyleRegistry({ children, cacheKey, enableCssReset, }: Props): import("react/jsx-runtime").JSX.Element;
7
13
  export declare function useCache(): EmotionCache;
14
+ export declare function useCSSResetEnabled(): boolean;
15
+ export {};
8
16
  //# sourceMappingURL=root-style-registry.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"root-style-registry.d.ts","sourceRoot":"","sources":["../../../src/next/root-style-registry.tsx"],"names":[],"mappings":"AAEA,OAAoB,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAG1D,OAAO,EAAE,SAAS,EAAuC,MAAM,OAAO,CAAA;AA4BtE,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAA;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,2CAsBA;AAED,wBAAgB,QAAQ,IAAI,YAAY,CAEvC"}
1
+ {"version":3,"file":"root-style-registry.d.ts","sourceRoot":"","sources":["../../../src/next/root-style-registry.tsx"],"names":[],"mappings":"AAEA,OAAoB,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAG1D,OAAO,EAAE,SAAS,EAAuC,MAAM,OAAO,CAAA;AA+BtE,KAAK,KAAK,GAAG;IACX,QAAQ,EAAE,SAAS,CAAA;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB,CAAA;AAED,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,QAAQ,EACR,cAA0C,GAC3C,EAAE,KAAK,2CA4BP;AAED,wBAAgB,QAAQ,IAAI,YAAY,CAEvC;AAED,wBAAgB,kBAAkB,IAAI,OAAO,CAE5C"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@makeswift/runtime",
3
- "version": "0.24.0",
3
+ "version": "0.24.1-canary.0",
4
4
  "license": "MIT",
5
5
  "files": [
6
6
  "dist",
@@ -163,9 +163,9 @@
163
163
  "use-sync-external-store": "^1.0.0-rc.0",
164
164
  "uuid": "^9.0.0",
165
165
  "zod": "^3.21.4",
166
- "@makeswift/next-plugin": "0.4.0",
166
+ "@makeswift/controls": "0.1.8",
167
167
  "@makeswift/prop-controllers": "0.4.1",
168
- "@makeswift/controls": "0.1.8"
168
+ "@makeswift/next-plugin": "0.4.0"
169
169
  },
170
170
  "devDependencies": {
171
171
  "@emotion/jest": "^11.11.0",