@makeswift/runtime 0.29.0-canary.24 → 0.29.0-canary.25
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/dist/cjs/api/graphql-api-client.js +1 -1
- package/dist/cjs/api/rest-api-client.js +1 -1
- package/dist/cjs/api-handler/handlers/manifest.js +1 -1
- package/dist/cjs/components/shared/ErrorBoundary.js +3 -3
- package/dist/cjs/components/shared/ErrorBoundary.js.map +1 -1
- package/dist/cjs/runtimes/react/components/Element.js +11 -3
- package/dist/cjs/runtimes/react/components/Element.js.map +1 -1
- package/dist/esm/api/graphql-api-client.js +1 -1
- package/dist/esm/api/rest-api-client.js +1 -1
- package/dist/esm/api-handler/handlers/manifest.js +1 -1
- package/dist/esm/components/shared/ErrorBoundary.js +3 -3
- package/dist/esm/components/shared/ErrorBoundary.js.map +1 -1
- package/dist/esm/runtimes/react/components/Element.js +11 -3
- package/dist/esm/runtimes/react/components/Element.js.map +1 -1
- package/dist/types/components/shared/ErrorBoundary.d.ts +10 -9
- package/dist/types/components/shared/ErrorBoundary.d.ts.map +1 -1
- package/dist/types/runtimes/react/components/Element.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -27,7 +27,7 @@ class MakeswiftGraphQLApiClient {
|
|
|
27
27
|
graphqlClient;
|
|
28
28
|
constructor({ endpoint }) {
|
|
29
29
|
this.graphqlClient = new import_client.GraphQLClient(endpoint, {
|
|
30
|
-
"makeswift-runtime-version": "0.29.0-canary.
|
|
30
|
+
"makeswift-runtime-version": "0.29.0-canary.25"
|
|
31
31
|
});
|
|
32
32
|
}
|
|
33
33
|
async getUnversionedResources({
|
|
@@ -223,7 +223,7 @@ class MakeswiftRestAPIClient {
|
|
|
223
223
|
const requestHeaders = new Headers({
|
|
224
224
|
"x-api-key": this.apiKey,
|
|
225
225
|
"makeswift-site-api-key": this.apiKey,
|
|
226
|
-
"makeswift-runtime-version": "0.29.0-canary.
|
|
226
|
+
"makeswift-runtime-version": "0.29.0-canary.25"
|
|
227
227
|
});
|
|
228
228
|
if (siteVersion?.token) {
|
|
229
229
|
requestUrl.searchParams.set("version", siteVersion.version);
|
|
@@ -28,7 +28,7 @@ async function manifestHandler(req, { apiKey, manifest }) {
|
|
|
28
28
|
return import_request_response.ApiResponse.json({ message: "Unauthorized" }, { status: 401 });
|
|
29
29
|
}
|
|
30
30
|
return import_request_response.ApiResponse.json({
|
|
31
|
-
version: "0.29.0-canary.
|
|
31
|
+
version: "0.29.0-canary.25",
|
|
32
32
|
interactionMode: true,
|
|
33
33
|
clientSideNavigation: false,
|
|
34
34
|
elementFromPoint: false,
|
|
@@ -24,14 +24,14 @@ module.exports = __toCommonJS(ErrorBoundary_exports);
|
|
|
24
24
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
25
25
|
var import_react = require("react");
|
|
26
26
|
class ErrorBoundary extends import_react.Component {
|
|
27
|
-
static getDerivedStateFromError() {
|
|
28
|
-
return { hasError: true };
|
|
27
|
+
static getDerivedStateFromError(error) {
|
|
28
|
+
return { hasError: true, details: error.message };
|
|
29
29
|
}
|
|
30
30
|
state = { hasError: false };
|
|
31
31
|
render() {
|
|
32
32
|
const { FallbackComponent } = this.props;
|
|
33
33
|
if (this.state.hasError)
|
|
34
|
-
return FallbackComponent ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FallbackComponent, {}) : null;
|
|
34
|
+
return FallbackComponent ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FallbackComponent, { details: this.state.details }) : null;
|
|
35
35
|
return this.props.children;
|
|
36
36
|
}
|
|
37
37
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/shared/ErrorBoundary.tsx"],"sourcesContent":["import { Component, ElementType, ReactNode } from 'react'\n\ntype ErrorProps = {\n FallbackComponent: ElementType
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/shared/ErrorBoundary.tsx"],"sourcesContent":["import { Component, type ElementType, type ReactNode } from 'react'\n\ntype ErrorProps = {\n FallbackComponent: ElementType<{ details: string }>\n children: ReactNode\n}\n\ntype State =\n | {\n hasError: false\n }\n | {\n hasError: true\n details: string\n }\n\nexport class ErrorBoundary extends Component<ErrorProps, State> {\n static getDerivedStateFromError(error: Error): State {\n return { hasError: true, details: error.message }\n }\n\n state: State = { hasError: false }\n\n render() {\n const { FallbackComponent } = this.props\n\n if (this.state.hasError)\n return FallbackComponent ? <FallbackComponent details={this.state.details} /> : null\n\n return this.props.children\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA2BiC;AA3BjC,mBAA4D;AAgBrD,MAAM,sBAAsB,uBAA6B;AAAA,EAC9D,OAAO,yBAAyB,OAAqB;AACnD,WAAO,EAAE,UAAU,MAAM,SAAS,MAAM,QAAQ;AAAA,EAClD;AAAA,EAEA,QAAe,EAAE,UAAU,MAAM;AAAA,EAEjC,SAAS;AACP,UAAM,EAAE,kBAAkB,IAAI,KAAK;AAEnC,QAAI,KAAK,MAAM;AACb,aAAO,oBAAoB,4CAAC,qBAAkB,SAAS,KAAK,MAAM,SAAS,IAAK;AAElF,WAAO,KAAK,MAAM;AAAA,EACpB;AACF;","names":[]}
|
|
@@ -49,6 +49,17 @@ const Element = (0, import_react.memo)(
|
|
|
49
49
|
const { imperativeHandleRef, findDomNodeCallbackRef, elementCallbackRef } = useElementImperativeHandle(ref);
|
|
50
50
|
const isRegisterElementDisabled = (0, import_use_disable_register_element.useIsRegisterElementDisabled)();
|
|
51
51
|
const ElementRegistration = (0, import_use_is_read_only.useIsReadOnly)() || isRegisterElementDisabled ? NoOp : BuilderElementRegistration;
|
|
52
|
+
const ErrorFallback = (0, import_react.useCallback)(
|
|
53
|
+
({ details }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
54
|
+
import_FallbackComponent.FallbackComponent,
|
|
55
|
+
{
|
|
56
|
+
text: `Error rendering component`,
|
|
57
|
+
details: `Error rendering component '${element.type}':
|
|
58
|
+
${details}`
|
|
59
|
+
}
|
|
60
|
+
),
|
|
61
|
+
[element.type]
|
|
62
|
+
);
|
|
52
63
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
53
64
|
ElementRegistration,
|
|
54
65
|
{
|
|
@@ -85,9 +96,6 @@ function useElementImperativeHandle(ref) {
|
|
|
85
96
|
function NoOp({ children }) {
|
|
86
97
|
return children;
|
|
87
98
|
}
|
|
88
|
-
function ErrorFallback() {
|
|
89
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_FallbackComponent.FallbackComponent, { text: `Error rendering component` });
|
|
90
|
-
}
|
|
91
99
|
// Annotate the CommonJS export names for ESM import in node:
|
|
92
100
|
0 && (module.exports = {
|
|
93
101
|
Element
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/runtimes/react/components/Element.tsx"],"sourcesContent":["'use client'\n\nimport {\n type ReactNode,\n type Ref,\n type PropsWithChildren,\n forwardRef,\n memo,\n useCallback,\n useImperativeHandle,\n useRef,\n lazy,\n} from 'react'\n\nimport {\n isElementReference,\n type Element as ElementDataOrRef,\n} from '../../../state/read-only-state'\n\nimport { FallbackComponent } from '../../../components/shared/FallbackComponent'\nimport { ErrorBoundary } from '../../../components/shared/ErrorBoundary'\n\nimport { useIsReadOnly } from '../hooks/use-is-read-only'\nimport { useIsRegisterElementDisabled } from '../hooks/use-disable-register-element'\n\nimport { ElementImperativeHandle } from '../element-imperative-handle'\nimport { FindDomNode } from '../find-dom-node'\n\nimport { ElementReference } from './ElementReference'\nimport { ElementData } from './ElementData'\n\nconst BuilderElementRegistration = lazy(() => import('./ElementRegistration'))\n\ntype Props = {\n element: ElementDataOrRef\n}\n\nexport const Element = memo(\n forwardRef(function Element(\n { element }: Props,\n ref: Ref<ElementImperativeHandle>,\n ): ReactNode | null {\n const { imperativeHandleRef, findDomNodeCallbackRef, elementCallbackRef } =\n useElementImperativeHandle(ref)\n\n const isRegisterElementDisabled = useIsRegisterElementDisabled()\n const ElementRegistration =\n useIsReadOnly() || isRegisterElementDisabled ? NoOp : BuilderElementRegistration\n\n return (\n <ElementRegistration\n componentHandle={imperativeHandleRef.current}\n elementKey={element.key}\n componentType={element.type}\n >\n <FindDomNode ref={findDomNodeCallbackRef}>\n <ErrorBoundary FallbackComponent={ErrorFallback}>\n {isElementReference(element) ? (\n <ElementReference\n key={element.key}\n ref={elementCallbackRef}\n elementReference={element}\n />\n ) : (\n <ElementData key={element.key} ref={elementCallbackRef} elementData={element} />\n )}\n </ErrorBoundary>\n </FindDomNode>\n </ElementRegistration>\n )\n }),\n)\n\n/**\n * Creates an `ElementImperativeHandle` instance that reports the element's DOM location to\n * the builder.\n *\n * Uses the element's attached ref when available; otherwise, falls back to React's\n * `findDOMNode` to locate the rendered DOM node.\n */\nfunction useElementImperativeHandle(ref: Ref<ElementImperativeHandle>) {\n const useFindDomNodeRef = useRef(true)\n const imperativeHandleRef = useRef(new ElementImperativeHandle())\n\n const findDomNodeCallbackRef = useCallback((current: (() => Element | Text | null) | null) => {\n if (useFindDomNodeRef.current === true) {\n imperativeHandleRef.current.callback(() => current?.() ?? null)\n }\n }, [])\n\n const elementCallbackRef = useCallback((current: unknown | null) => {\n useFindDomNodeRef.current = false\n\n imperativeHandleRef.current.callback(() => current)\n }, [])\n\n useImperativeHandle(ref, () => imperativeHandleRef.current, [])\n\n return { imperativeHandleRef, findDomNodeCallbackRef, elementCallbackRef }\n}\n\nfunction NoOp({ children }: PropsWithChildren) {\n return children\n}\n
|
|
1
|
+
{"version":3,"sources":["../../../../../src/runtimes/react/components/Element.tsx"],"sourcesContent":["'use client'\n\nimport {\n type ReactNode,\n type Ref,\n type PropsWithChildren,\n forwardRef,\n memo,\n useCallback,\n useImperativeHandle,\n useRef,\n lazy,\n} from 'react'\n\nimport {\n isElementReference,\n type Element as ElementDataOrRef,\n} from '../../../state/read-only-state'\n\nimport { FallbackComponent } from '../../../components/shared/FallbackComponent'\nimport { ErrorBoundary } from '../../../components/shared/ErrorBoundary'\n\nimport { useIsReadOnly } from '../hooks/use-is-read-only'\nimport { useIsRegisterElementDisabled } from '../hooks/use-disable-register-element'\n\nimport { ElementImperativeHandle } from '../element-imperative-handle'\nimport { FindDomNode } from '../find-dom-node'\n\nimport { ElementReference } from './ElementReference'\nimport { ElementData } from './ElementData'\n\nconst BuilderElementRegistration = lazy(() => import('./ElementRegistration'))\n\ntype Props = {\n element: ElementDataOrRef\n}\n\nexport const Element = memo(\n forwardRef(function Element(\n { element }: Props,\n ref: Ref<ElementImperativeHandle>,\n ): ReactNode | null {\n const { imperativeHandleRef, findDomNodeCallbackRef, elementCallbackRef } =\n useElementImperativeHandle(ref)\n\n const isRegisterElementDisabled = useIsRegisterElementDisabled()\n const ElementRegistration =\n useIsReadOnly() || isRegisterElementDisabled ? NoOp : BuilderElementRegistration\n\n const ErrorFallback = useCallback(\n ({ details }: { details: string }) => (\n <FallbackComponent\n text={`Error rendering component`}\n details={`Error rendering component '${element.type}':\\n${details}`}\n />\n ),\n [element.type],\n )\n\n return (\n <ElementRegistration\n componentHandle={imperativeHandleRef.current}\n elementKey={element.key}\n componentType={element.type}\n >\n <FindDomNode ref={findDomNodeCallbackRef}>\n <ErrorBoundary FallbackComponent={ErrorFallback}>\n {isElementReference(element) ? (\n <ElementReference\n key={element.key}\n ref={elementCallbackRef}\n elementReference={element}\n />\n ) : (\n <ElementData key={element.key} ref={elementCallbackRef} elementData={element} />\n )}\n </ErrorBoundary>\n </FindDomNode>\n </ElementRegistration>\n )\n }),\n)\n\n/**\n * Creates an `ElementImperativeHandle` instance that reports the element's DOM location to\n * the builder.\n *\n * Uses the element's attached ref when available; otherwise, falls back to React's\n * `findDOMNode` to locate the rendered DOM node.\n */\nfunction useElementImperativeHandle(ref: Ref<ElementImperativeHandle>) {\n const useFindDomNodeRef = useRef(true)\n const imperativeHandleRef = useRef(new ElementImperativeHandle())\n\n const findDomNodeCallbackRef = useCallback((current: (() => Element | Text | null) | null) => {\n if (useFindDomNodeRef.current === true) {\n imperativeHandleRef.current.callback(() => current?.() ?? null)\n }\n }, [])\n\n const elementCallbackRef = useCallback((current: unknown | null) => {\n useFindDomNodeRef.current = false\n\n imperativeHandleRef.current.callback(() => current)\n }, [])\n\n useImperativeHandle(ref, () => imperativeHandleRef.current, [])\n\n return { imperativeHandleRef, findDomNodeCallbackRef, elementCallbackRef }\n}\n\nfunction NoOp({ children }: PropsWithChildren) {\n return children\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAmDQ;AAjDR,mBAUO;AAEP,6BAGO;AAEP,+BAAkC;AAClC,2BAA8B;AAE9B,8BAA8B;AAC9B,0CAA6C;AAE7C,uCAAwC;AACxC,2BAA4B;AAE5B,8BAAiC;AACjC,yBAA4B;AAE5B,MAAM,iCAA6B,mBAAK,MAAM,6CAAO,uBAAuB,GAAC;AAMtE,MAAM,cAAU;AAAA,MACrB,yBAAW,SAASA,SAClB,EAAE,QAAQ,GACV,KACkB;AAClB,UAAM,EAAE,qBAAqB,wBAAwB,mBAAmB,IACtE,2BAA2B,GAAG;AAEhC,UAAM,gCAA4B,kEAA6B;AAC/D,UAAM,0BACJ,uCAAc,KAAK,4BAA4B,OAAO;AAExD,UAAM,oBAAgB;AAAA,MACpB,CAAC,EAAE,QAAQ,MACT;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,SAAS,8BAA8B,QAAQ,IAAI;AAAA,EAAO,OAAO;AAAA;AAAA,MACnE;AAAA,MAEF,CAAC,QAAQ,IAAI;AAAA,IACf;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,iBAAiB,oBAAoB;AAAA,QACrC,YAAY,QAAQ;AAAA,QACpB,eAAe,QAAQ;AAAA,QAEvB,sDAAC,oCAAY,KAAK,wBAChB,sDAAC,sCAAc,mBAAmB,eAC/B,yDAAmB,OAAO,IACzB;AAAA,UAAC;AAAA;AAAA,YAEC,KAAK;AAAA,YACL,kBAAkB;AAAA;AAAA,UAFb,QAAQ;AAAA,QAGf,IAEA,4CAAC,kCAA8B,KAAK,oBAAoB,aAAa,WAAnD,QAAQ,GAAoD,GAElF,GACF;AAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AACH;AASA,SAAS,2BAA2B,KAAmC;AACrE,QAAM,wBAAoB,qBAAO,IAAI;AACrC,QAAM,0BAAsB,qBAAO,IAAI,yDAAwB,CAAC;AAEhE,QAAM,6BAAyB,0BAAY,CAAC,YAAkD;AAC5F,QAAI,kBAAkB,YAAY,MAAM;AACtC,0BAAoB,QAAQ,SAAS,MAAM,UAAU,KAAK,IAAI;AAAA,IAChE;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,yBAAqB,0BAAY,CAAC,YAA4B;AAClE,sBAAkB,UAAU;AAE5B,wBAAoB,QAAQ,SAAS,MAAM,OAAO;AAAA,EACpD,GAAG,CAAC,CAAC;AAEL,wCAAoB,KAAK,MAAM,oBAAoB,SAAS,CAAC,CAAC;AAE9D,SAAO,EAAE,qBAAqB,wBAAwB,mBAAmB;AAC3E;AAEA,SAAS,KAAK,EAAE,SAAS,GAAsB;AAC7C,SAAO;AACT;","names":["Element"]}
|
|
@@ -4,7 +4,7 @@ class MakeswiftGraphQLApiClient {
|
|
|
4
4
|
graphqlClient;
|
|
5
5
|
constructor({ endpoint }) {
|
|
6
6
|
this.graphqlClient = new GraphQLClient(endpoint, {
|
|
7
|
-
"makeswift-runtime-version": "0.29.0-canary.
|
|
7
|
+
"makeswift-runtime-version": "0.29.0-canary.25"
|
|
8
8
|
});
|
|
9
9
|
}
|
|
10
10
|
async getUnversionedResources({
|
|
@@ -188,7 +188,7 @@ class MakeswiftRestAPIClient {
|
|
|
188
188
|
const requestHeaders = new Headers({
|
|
189
189
|
"x-api-key": this.apiKey,
|
|
190
190
|
"makeswift-site-api-key": this.apiKey,
|
|
191
|
-
"makeswift-runtime-version": "0.29.0-canary.
|
|
191
|
+
"makeswift-runtime-version": "0.29.0-canary.25"
|
|
192
192
|
});
|
|
193
193
|
if (siteVersion?.token) {
|
|
194
194
|
requestUrl.searchParams.set("version", siteVersion.version);
|
|
@@ -8,7 +8,7 @@ async function manifestHandler(req, { apiKey, manifest }) {
|
|
|
8
8
|
return ApiResponse.json({ message: "Unauthorized" }, { status: 401 });
|
|
9
9
|
}
|
|
10
10
|
return ApiResponse.json({
|
|
11
|
-
version: "0.29.0-canary.
|
|
11
|
+
version: "0.29.0-canary.25",
|
|
12
12
|
interactionMode: true,
|
|
13
13
|
clientSideNavigation: false,
|
|
14
14
|
elementFromPoint: false,
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { Component } from "react";
|
|
3
3
|
class ErrorBoundary extends Component {
|
|
4
|
-
static getDerivedStateFromError() {
|
|
5
|
-
return { hasError: true };
|
|
4
|
+
static getDerivedStateFromError(error) {
|
|
5
|
+
return { hasError: true, details: error.message };
|
|
6
6
|
}
|
|
7
7
|
state = { hasError: false };
|
|
8
8
|
render() {
|
|
9
9
|
const { FallbackComponent } = this.props;
|
|
10
10
|
if (this.state.hasError)
|
|
11
|
-
return FallbackComponent ? /* @__PURE__ */ jsx(FallbackComponent, {}) : null;
|
|
11
|
+
return FallbackComponent ? /* @__PURE__ */ jsx(FallbackComponent, { details: this.state.details }) : null;
|
|
12
12
|
return this.props.children;
|
|
13
13
|
}
|
|
14
14
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/shared/ErrorBoundary.tsx"],"sourcesContent":["import { Component, ElementType, ReactNode } from 'react'\n\ntype ErrorProps = {\n FallbackComponent: ElementType
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/shared/ErrorBoundary.tsx"],"sourcesContent":["import { Component, type ElementType, type ReactNode } from 'react'\n\ntype ErrorProps = {\n FallbackComponent: ElementType<{ details: string }>\n children: ReactNode\n}\n\ntype State =\n | {\n hasError: false\n }\n | {\n hasError: true\n details: string\n }\n\nexport class ErrorBoundary extends Component<ErrorProps, State> {\n static getDerivedStateFromError(error: Error): State {\n return { hasError: true, details: error.message }\n }\n\n state: State = { hasError: false }\n\n render() {\n const { FallbackComponent } = this.props\n\n if (this.state.hasError)\n return FallbackComponent ? <FallbackComponent details={this.state.details} /> : null\n\n return this.props.children\n }\n}\n"],"mappings":"AA2BiC;AA3BjC,SAAS,iBAAmD;AAgBrD,MAAM,sBAAsB,UAA6B;AAAA,EAC9D,OAAO,yBAAyB,OAAqB;AACnD,WAAO,EAAE,UAAU,MAAM,SAAS,MAAM,QAAQ;AAAA,EAClD;AAAA,EAEA,QAAe,EAAE,UAAU,MAAM;AAAA,EAEjC,SAAS;AACP,UAAM,EAAE,kBAAkB,IAAI,KAAK;AAEnC,QAAI,KAAK,MAAM;AACb,aAAO,oBAAoB,oBAAC,qBAAkB,SAAS,KAAK,MAAM,SAAS,IAAK;AAElF,WAAO,KAAK,MAAM;AAAA,EACpB;AACF;","names":[]}
|
|
@@ -25,6 +25,17 @@ const Element = memo(
|
|
|
25
25
|
const { imperativeHandleRef, findDomNodeCallbackRef, elementCallbackRef } = useElementImperativeHandle(ref);
|
|
26
26
|
const isRegisterElementDisabled = useIsRegisterElementDisabled();
|
|
27
27
|
const ElementRegistration = useIsReadOnly() || isRegisterElementDisabled ? NoOp : BuilderElementRegistration;
|
|
28
|
+
const ErrorFallback = useCallback(
|
|
29
|
+
({ details }) => /* @__PURE__ */ jsx(
|
|
30
|
+
FallbackComponent,
|
|
31
|
+
{
|
|
32
|
+
text: `Error rendering component`,
|
|
33
|
+
details: `Error rendering component '${element.type}':
|
|
34
|
+
${details}`
|
|
35
|
+
}
|
|
36
|
+
),
|
|
37
|
+
[element.type]
|
|
38
|
+
);
|
|
28
39
|
return /* @__PURE__ */ jsx(
|
|
29
40
|
ElementRegistration,
|
|
30
41
|
{
|
|
@@ -61,9 +72,6 @@ function useElementImperativeHandle(ref) {
|
|
|
61
72
|
function NoOp({ children }) {
|
|
62
73
|
return children;
|
|
63
74
|
}
|
|
64
|
-
function ErrorFallback() {
|
|
65
|
-
return /* @__PURE__ */ jsx(FallbackComponent, { text: `Error rendering component` });
|
|
66
|
-
}
|
|
67
75
|
export {
|
|
68
76
|
Element
|
|
69
77
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/runtimes/react/components/Element.tsx"],"sourcesContent":["'use client'\n\nimport {\n type ReactNode,\n type Ref,\n type PropsWithChildren,\n forwardRef,\n memo,\n useCallback,\n useImperativeHandle,\n useRef,\n lazy,\n} from 'react'\n\nimport {\n isElementReference,\n type Element as ElementDataOrRef,\n} from '../../../state/read-only-state'\n\nimport { FallbackComponent } from '../../../components/shared/FallbackComponent'\nimport { ErrorBoundary } from '../../../components/shared/ErrorBoundary'\n\nimport { useIsReadOnly } from '../hooks/use-is-read-only'\nimport { useIsRegisterElementDisabled } from '../hooks/use-disable-register-element'\n\nimport { ElementImperativeHandle } from '../element-imperative-handle'\nimport { FindDomNode } from '../find-dom-node'\n\nimport { ElementReference } from './ElementReference'\nimport { ElementData } from './ElementData'\n\nconst BuilderElementRegistration = lazy(() => import('./ElementRegistration'))\n\ntype Props = {\n element: ElementDataOrRef\n}\n\nexport const Element = memo(\n forwardRef(function Element(\n { element }: Props,\n ref: Ref<ElementImperativeHandle>,\n ): ReactNode | null {\n const { imperativeHandleRef, findDomNodeCallbackRef, elementCallbackRef } =\n useElementImperativeHandle(ref)\n\n const isRegisterElementDisabled = useIsRegisterElementDisabled()\n const ElementRegistration =\n useIsReadOnly() || isRegisterElementDisabled ? NoOp : BuilderElementRegistration\n\n return (\n <ElementRegistration\n componentHandle={imperativeHandleRef.current}\n elementKey={element.key}\n componentType={element.type}\n >\n <FindDomNode ref={findDomNodeCallbackRef}>\n <ErrorBoundary FallbackComponent={ErrorFallback}>\n {isElementReference(element) ? (\n <ElementReference\n key={element.key}\n ref={elementCallbackRef}\n elementReference={element}\n />\n ) : (\n <ElementData key={element.key} ref={elementCallbackRef} elementData={element} />\n )}\n </ErrorBoundary>\n </FindDomNode>\n </ElementRegistration>\n )\n }),\n)\n\n/**\n * Creates an `ElementImperativeHandle` instance that reports the element's DOM location to\n * the builder.\n *\n * Uses the element's attached ref when available; otherwise, falls back to React's\n * `findDOMNode` to locate the rendered DOM node.\n */\nfunction useElementImperativeHandle(ref: Ref<ElementImperativeHandle>) {\n const useFindDomNodeRef = useRef(true)\n const imperativeHandleRef = useRef(new ElementImperativeHandle())\n\n const findDomNodeCallbackRef = useCallback((current: (() => Element | Text | null) | null) => {\n if (useFindDomNodeRef.current === true) {\n imperativeHandleRef.current.callback(() => current?.() ?? null)\n }\n }, [])\n\n const elementCallbackRef = useCallback((current: unknown | null) => {\n useFindDomNodeRef.current = false\n\n imperativeHandleRef.current.callback(() => current)\n }, [])\n\n useImperativeHandle(ref, () => imperativeHandleRef.current, [])\n\n return { imperativeHandleRef, findDomNodeCallbackRef, elementCallbackRef }\n}\n\nfunction NoOp({ children }: PropsWithChildren) {\n return children\n}\n
|
|
1
|
+
{"version":3,"sources":["../../../../../src/runtimes/react/components/Element.tsx"],"sourcesContent":["'use client'\n\nimport {\n type ReactNode,\n type Ref,\n type PropsWithChildren,\n forwardRef,\n memo,\n useCallback,\n useImperativeHandle,\n useRef,\n lazy,\n} from 'react'\n\nimport {\n isElementReference,\n type Element as ElementDataOrRef,\n} from '../../../state/read-only-state'\n\nimport { FallbackComponent } from '../../../components/shared/FallbackComponent'\nimport { ErrorBoundary } from '../../../components/shared/ErrorBoundary'\n\nimport { useIsReadOnly } from '../hooks/use-is-read-only'\nimport { useIsRegisterElementDisabled } from '../hooks/use-disable-register-element'\n\nimport { ElementImperativeHandle } from '../element-imperative-handle'\nimport { FindDomNode } from '../find-dom-node'\n\nimport { ElementReference } from './ElementReference'\nimport { ElementData } from './ElementData'\n\nconst BuilderElementRegistration = lazy(() => import('./ElementRegistration'))\n\ntype Props = {\n element: ElementDataOrRef\n}\n\nexport const Element = memo(\n forwardRef(function Element(\n { element }: Props,\n ref: Ref<ElementImperativeHandle>,\n ): ReactNode | null {\n const { imperativeHandleRef, findDomNodeCallbackRef, elementCallbackRef } =\n useElementImperativeHandle(ref)\n\n const isRegisterElementDisabled = useIsRegisterElementDisabled()\n const ElementRegistration =\n useIsReadOnly() || isRegisterElementDisabled ? NoOp : BuilderElementRegistration\n\n const ErrorFallback = useCallback(\n ({ details }: { details: string }) => (\n <FallbackComponent\n text={`Error rendering component`}\n details={`Error rendering component '${element.type}':\\n${details}`}\n />\n ),\n [element.type],\n )\n\n return (\n <ElementRegistration\n componentHandle={imperativeHandleRef.current}\n elementKey={element.key}\n componentType={element.type}\n >\n <FindDomNode ref={findDomNodeCallbackRef}>\n <ErrorBoundary FallbackComponent={ErrorFallback}>\n {isElementReference(element) ? (\n <ElementReference\n key={element.key}\n ref={elementCallbackRef}\n elementReference={element}\n />\n ) : (\n <ElementData key={element.key} ref={elementCallbackRef} elementData={element} />\n )}\n </ErrorBoundary>\n </FindDomNode>\n </ElementRegistration>\n )\n }),\n)\n\n/**\n * Creates an `ElementImperativeHandle` instance that reports the element's DOM location to\n * the builder.\n *\n * Uses the element's attached ref when available; otherwise, falls back to React's\n * `findDOMNode` to locate the rendered DOM node.\n */\nfunction useElementImperativeHandle(ref: Ref<ElementImperativeHandle>) {\n const useFindDomNodeRef = useRef(true)\n const imperativeHandleRef = useRef(new ElementImperativeHandle())\n\n const findDomNodeCallbackRef = useCallback((current: (() => Element | Text | null) | null) => {\n if (useFindDomNodeRef.current === true) {\n imperativeHandleRef.current.callback(() => current?.() ?? null)\n }\n }, [])\n\n const elementCallbackRef = useCallback((current: unknown | null) => {\n useFindDomNodeRef.current = false\n\n imperativeHandleRef.current.callback(() => current)\n }, [])\n\n useImperativeHandle(ref, () => imperativeHandleRef.current, [])\n\n return { imperativeHandleRef, findDomNodeCallbackRef, elementCallbackRef }\n}\n\nfunction NoOp({ children }: PropsWithChildren) {\n return children\n}\n"],"mappings":";AAmDQ;AAjDR;AAAA,EAIE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP;AAAA,EACE;AAAA,OAEK;AAEP,SAAS,yBAAyB;AAClC,SAAS,qBAAqB;AAE9B,SAAS,qBAAqB;AAC9B,SAAS,oCAAoC;AAE7C,SAAS,+BAA+B;AACxC,SAAS,mBAAmB;AAE5B,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAE5B,MAAM,6BAA6B,KAAK,MAAM,OAAO,uBAAuB,CAAC;AAMtE,MAAM,UAAU;AAAA,EACrB,WAAW,SAASA,SAClB,EAAE,QAAQ,GACV,KACkB;AAClB,UAAM,EAAE,qBAAqB,wBAAwB,mBAAmB,IACtE,2BAA2B,GAAG;AAEhC,UAAM,4BAA4B,6BAA6B;AAC/D,UAAM,sBACJ,cAAc,KAAK,4BAA4B,OAAO;AAExD,UAAM,gBAAgB;AAAA,MACpB,CAAC,EAAE,QAAQ,MACT;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,SAAS,8BAA8B,QAAQ,IAAI;AAAA,EAAO,OAAO;AAAA;AAAA,MACnE;AAAA,MAEF,CAAC,QAAQ,IAAI;AAAA,IACf;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,iBAAiB,oBAAoB;AAAA,QACrC,YAAY,QAAQ;AAAA,QACpB,eAAe,QAAQ;AAAA,QAEvB,8BAAC,eAAY,KAAK,wBAChB,8BAAC,iBAAc,mBAAmB,eAC/B,6BAAmB,OAAO,IACzB;AAAA,UAAC;AAAA;AAAA,YAEC,KAAK;AAAA,YACL,kBAAkB;AAAA;AAAA,UAFb,QAAQ;AAAA,QAGf,IAEA,oBAAC,eAA8B,KAAK,oBAAoB,aAAa,WAAnD,QAAQ,GAAoD,GAElF,GACF;AAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AACH;AASA,SAAS,2BAA2B,KAAmC;AACrE,QAAM,oBAAoB,OAAO,IAAI;AACrC,QAAM,sBAAsB,OAAO,IAAI,wBAAwB,CAAC;AAEhE,QAAM,yBAAyB,YAAY,CAAC,YAAkD;AAC5F,QAAI,kBAAkB,YAAY,MAAM;AACtC,0BAAoB,QAAQ,SAAS,MAAM,UAAU,KAAK,IAAI;AAAA,IAChE;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,qBAAqB,YAAY,CAAC,YAA4B;AAClE,sBAAkB,UAAU;AAE5B,wBAAoB,QAAQ,SAAS,MAAM,OAAO;AAAA,EACpD,GAAG,CAAC,CAAC;AAEL,sBAAoB,KAAK,MAAM,oBAAoB,SAAS,CAAC,CAAC;AAE9D,SAAO,EAAE,qBAAqB,wBAAwB,mBAAmB;AAC3E;AAEA,SAAS,KAAK,EAAE,SAAS,GAAsB;AAC7C,SAAO;AACT;","names":["Element"]}
|
|
@@ -1,18 +1,19 @@
|
|
|
1
|
-
import { Component, ElementType, ReactNode } from 'react';
|
|
1
|
+
import { Component, type ElementType, type ReactNode } from 'react';
|
|
2
2
|
type ErrorProps = {
|
|
3
|
-
FallbackComponent: ElementType
|
|
3
|
+
FallbackComponent: ElementType<{
|
|
4
|
+
details: string;
|
|
5
|
+
}>;
|
|
4
6
|
children: ReactNode;
|
|
5
7
|
};
|
|
6
8
|
type State = {
|
|
7
|
-
hasError:
|
|
9
|
+
hasError: false;
|
|
10
|
+
} | {
|
|
11
|
+
hasError: true;
|
|
12
|
+
details: string;
|
|
8
13
|
};
|
|
9
14
|
export declare class ErrorBoundary extends Component<ErrorProps, State> {
|
|
10
|
-
static getDerivedStateFromError():
|
|
11
|
-
|
|
12
|
-
};
|
|
13
|
-
state: {
|
|
14
|
-
hasError: boolean;
|
|
15
|
-
};
|
|
15
|
+
static getDerivedStateFromError(error: Error): State;
|
|
16
|
+
state: State;
|
|
16
17
|
render(): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
|
|
17
18
|
}
|
|
18
19
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ErrorBoundary.d.ts","sourceRoot":"","sources":["../../../../src/components/shared/ErrorBoundary.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"ErrorBoundary.d.ts","sourceRoot":"","sources":["../../../../src/components/shared/ErrorBoundary.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAEnE,KAAK,UAAU,GAAG;IAChB,iBAAiB,EAAE,WAAW,CAAC;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACnD,QAAQ,EAAE,SAAS,CAAA;CACpB,CAAA;AAED,KAAK,KAAK,GACN;IACE,QAAQ,EAAE,KAAK,CAAA;CAChB,GACD;IACE,QAAQ,EAAE,IAAI,CAAA;IACd,OAAO,EAAE,MAAM,CAAA;CAChB,CAAA;AAEL,qBAAa,aAAc,SAAQ,SAAS,CAAC,UAAU,EAAE,KAAK,CAAC;IAC7D,MAAM,CAAC,wBAAwB,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK;IAIpD,KAAK,EAAE,KAAK,CAAsB;IAElC,MAAM;CAQP"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Element.d.ts","sourceRoot":"","sources":["../../../../../src/runtimes/react/components/Element.tsx"],"names":[],"mappings":"AAcA,OAAO,EAEL,KAAK,OAAO,IAAI,gBAAgB,EACjC,MAAM,gCAAgC,CAAA;AAQvC,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAA;AAQtE,KAAK,KAAK,GAAG;IACX,OAAO,EAAE,gBAAgB,CAAA;CAC1B,CAAA;AAED,eAAO,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"Element.d.ts","sourceRoot":"","sources":["../../../../../src/runtimes/react/components/Element.tsx"],"names":[],"mappings":"AAcA,OAAO,EAEL,KAAK,OAAO,IAAI,gBAAgB,EACjC,MAAM,gCAAgC,CAAA;AAQvC,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAA;AAQtE,KAAK,KAAK,GAAG;IACX,OAAO,EAAE,gBAAgB,CAAA;CAC1B,CAAA;AAED,eAAO,MAAM,OAAO,2KA4CnB,CAAA"}
|