@mittwald/flow-remote-react-renderer 0.2.0-alpha.41 → 0.2.0-alpha.411
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/js/RemoteRenderer.mjs +5 -4
- package/dist/js/RemoteRenderer.mjs.map +1 -1
- package/dist/js/core/src/file.mjs +19 -0
- package/dist/js/core/src/file.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/RemoteRendererBrowser.mjs +119 -0
- package/dist/js/remote-react-renderer/src/RemoteRendererBrowser.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/auto-generated/index.mjs +309 -0
- package/dist/js/remote-react-renderer/src/auto-generated/index.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/components/Form.mjs +37 -0
- package/dist/js/remote-react-renderer/src/components/Form.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/components/NotificationRenderController.mjs +25 -0
- package/dist/js/remote-react-renderer/src/components/NotificationRenderController.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/components/SlotRootWrapper.mjs +11 -0
- package/dist/js/remote-react-renderer/src/components/SlotRootWrapper.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/components/lib/prepareFormData.mjs +29 -0
- package/dist/js/remote-react-renderer/src/components/lib/prepareFormData.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/components.mjs +50 -0
- package/dist/js/remote-react-renderer/src/components.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/hooks/useControllableSuspenseTrigger.mjs +31 -0
- package/dist/js/remote-react-renderer/src/hooks/useControllableSuspenseTrigger.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/hooks/useMergedComponents.mjs +24 -0
- package/dist/js/remote-react-renderer/src/hooks/useMergedComponents.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/hooks/useUpdateHostPathnameOnRemote.mjs +17 -0
- package/dist/js/remote-react-renderer/src/hooks/useUpdateHostPathnameOnRemote.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/integrations/react-hook-form/Form.mjs +16 -0
- package/dist/js/remote-react-renderer/src/integrations/react-hook-form/Form.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/lib/createFlowRemoteComponentRenderer.mjs +47 -0
- package/dist/js/remote-react-renderer/src/lib/createFlowRemoteComponentRenderer.mjs.map +1 -0
- package/dist/js/{lib → remote-react-renderer/src/lib}/elementFactory.mjs +9 -5
- package/dist/js/remote-react-renderer/src/lib/elementFactory.mjs.map +1 -0
- package/dist/js/remote-react-renderer/src/lib/mapAttributeToReactProperty.mjs.map +1 -0
- package/dist/js/{lib → remote-react-renderer/src/lib}/propClassifiers.mjs +0 -4
- package/dist/js/remote-react-renderer/src/lib/propClassifiers.mjs.map +1 -0
- package/dist/types/RemoteRenderer.d.ts +2 -2
- package/dist/types/RemoteRenderer.d.ts.map +1 -1
- package/dist/types/RemoteRendererBrowser.d.ts +15 -0
- package/dist/types/RemoteRendererBrowser.d.ts.map +1 -0
- package/dist/types/auto-generated/index.d.ts +118 -95
- package/dist/types/auto-generated/index.d.ts.map +1 -1
- package/dist/types/components/Form.d.ts +8 -2
- package/dist/types/components/Form.d.ts.map +1 -1
- package/dist/types/components/NotificationRenderController.d.ts +4 -0
- package/dist/types/components/NotificationRenderController.d.ts.map +1 -0
- package/dist/types/components/SlotRootWrapper.d.ts +4 -0
- package/dist/types/components/SlotRootWrapper.d.ts.map +1 -0
- package/dist/types/components/index.d.ts +3 -0
- package/dist/types/components/index.d.ts.map +1 -0
- package/dist/types/components/lib/prepareFormData.d.ts +2 -0
- package/dist/types/components/lib/prepareFormData.d.ts.map +1 -0
- package/dist/types/components.d.ts +133 -101
- package/dist/types/components.d.ts.map +1 -1
- package/dist/types/hooks/useControllableSuspenseTrigger.d.ts +5 -0
- package/dist/types/hooks/useControllableSuspenseTrigger.d.ts.map +1 -0
- package/dist/types/hooks/useMergedComponents.d.ts +5 -0
- package/dist/types/hooks/useMergedComponents.d.ts.map +1 -0
- package/dist/types/hooks/useUpdateHostPathnameOnRemote.d.ts +4 -0
- package/dist/types/hooks/useUpdateHostPathnameOnRemote.d.ts.map +1 -0
- package/dist/types/integrations/react-hook-form/Form.d.ts +16 -0
- package/dist/types/integrations/react-hook-form/Form.d.ts.map +1 -0
- package/dist/types/lib/createFlowRemoteComponentRenderer.d.ts +2 -2
- package/dist/types/lib/createFlowRemoteComponentRenderer.d.ts.map +1 -1
- package/dist/types/lib/elementFactory.d.ts +4 -1
- package/dist/types/lib/elementFactory.d.ts.map +1 -1
- package/dist/types/lib/mapAttributeToReactProperty.d.ts.map +1 -1
- package/dist/types/lib/propClassifiers.d.ts +0 -2
- package/dist/types/lib/propClassifiers.d.ts.map +1 -1
- package/dist/types/lib/types.d.ts +1 -1
- package/dist/types/lib/types.d.ts.map +1 -1
- package/package.json +23 -20
- package/dist/js/RemoteRendererClient.mjs +0 -51
- package/dist/js/RemoteRendererClient.mjs.map +0 -1
- package/dist/js/auto-generated/index.mjs +0 -108
- package/dist/js/auto-generated/index.mjs.map +0 -1
- package/dist/js/components/Form.mjs +0 -22
- package/dist/js/components/Form.mjs.map +0 -1
- package/dist/js/components/lib/getFormDataObject.mjs +0 -7
- package/dist/js/components/lib/getFormDataObject.mjs.map +0 -1
- package/dist/js/components.mjs +0 -26
- package/dist/js/components.mjs.map +0 -1
- package/dist/js/hooks/useIsMounted.mjs +0 -14
- package/dist/js/hooks/useIsMounted.mjs.map +0 -1
- package/dist/js/lib/createFlowRemoteComponentRenderer.mjs +0 -36
- package/dist/js/lib/createFlowRemoteComponentRenderer.mjs.map +0 -1
- package/dist/js/lib/elementFactory.mjs.map +0 -1
- package/dist/js/lib/mapAttributeToReactProperty.mjs.map +0 -1
- package/dist/js/lib/propClassifiers.mjs.map +0 -1
- package/dist/types/RemoteRendererClient.d.ts +0 -10
- package/dist/types/RemoteRendererClient.d.ts.map +0 -1
- package/dist/types/components/lib/getFormDataObject.d.ts +0 -2
- package/dist/types/components/lib/getFormDataObject.d.ts.map +0 -1
- package/dist/types/lib/stringChildrenExtractor.d.ts +0 -3
- package/dist/types/lib/stringChildrenExtractor.d.ts.map +0 -1
- /package/dist/js/{lib → remote-react-renderer/src/lib}/mapAttributeToReactProperty.mjs +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SlotRootWrapper.mjs","sources":["../../../../../src/components/SlotRootWrapper.ts"],"sourcesContent":["import React, { createElement, type FC, type PropsWithChildren } from \"react\";\n\nexport const SlotRootWrapper: FC<PropsWithChildren> = (props) => {\n return createElement(React.Fragment, {}, props.children);\n};\n\nexport default SlotRootWrapper;\n"],"names":[],"mappings":";AAEa,MAAA,kBAAyC,CAAC,UAAU;AAC/D,SAAO,cAAc,MAAM,UAAU,CAAA,GAAI,MAAM,QAAQ;AACzD;"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
/* */
|
|
3
|
+
import { addAwaitedArrayBuffer } from "../../../../core/src/file.mjs";
|
|
4
|
+
const prepareFormData = async (formData) => {
|
|
5
|
+
for (const [fieldName] of formData) {
|
|
6
|
+
const fieldValues = formData.getAll(fieldName);
|
|
7
|
+
if (fieldValues.every((v) => v instanceof File)) {
|
|
8
|
+
formData.delete(fieldName);
|
|
9
|
+
}
|
|
10
|
+
for (let value of fieldValues) {
|
|
11
|
+
if (value instanceof File) {
|
|
12
|
+
if (!value.name || value.size <= 0) {
|
|
13
|
+
break;
|
|
14
|
+
}
|
|
15
|
+
value = await addAwaitedArrayBuffer(value);
|
|
16
|
+
if (formData.has(fieldName)) {
|
|
17
|
+
formData.append(fieldName, value);
|
|
18
|
+
} else {
|
|
19
|
+
formData.set(fieldName, value);
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
return formData;
|
|
25
|
+
};
|
|
26
|
+
export {
|
|
27
|
+
prepareFormData
|
|
28
|
+
};
|
|
29
|
+
//# sourceMappingURL=prepareFormData.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"prepareFormData.mjs","sources":["../../../../../../src/components/lib/prepareFormData.ts"],"sourcesContent":["import { addAwaitedArrayBuffer } from \"@mittwald/flow-core\";\n\nexport const prepareFormData = async (\n formData: FormData,\n): Promise<FormData> => {\n for (const [fieldName] of formData) {\n const fieldValues = formData.getAll(fieldName);\n\n if (fieldValues.every((v) => v instanceof File)) {\n formData.delete(fieldName);\n }\n\n for (let value of fieldValues) {\n if (value instanceof File) {\n if (!value.name || value.size <= 0) {\n break;\n }\n\n value = await addAwaitedArrayBuffer(value);\n if (formData.has(fieldName)) {\n formData.append(fieldName, value);\n } else {\n formData.set(fieldName, value);\n }\n }\n }\n }\n\n return formData;\n};\n"],"names":[],"mappings":";AAEa,MAAA,kBAAkB,OAC7B,aACsB;AACX,aAAA,CAAC,SAAS,KAAK,UAAU;AAC5B,UAAA,cAAc,SAAS,OAAO,SAAS;AAE7C,QAAI,YAAY,MAAM,CAAC,MAAM,aAAa,IAAI,GAAG;AAC/C,eAAS,OAAO,SAAS;AAAA,IAAA;AAG3B,aAAS,SAAS,aAAa;AAC7B,UAAI,iBAAiB,MAAM;AACzB,YAAI,CAAC,MAAM,QAAQ,MAAM,QAAQ,GAAG;AAClC;AAAA,QAAA;AAGM,gBAAA,MAAM,sBAAsB,KAAK;AACrC,YAAA,SAAS,IAAI,SAAS,GAAG;AAClB,mBAAA,OAAO,WAAW,KAAK;AAAA,QAAA,OAC3B;AACI,mBAAA,IAAI,WAAW,KAAK;AAAA,QAAA;AAAA,MAC/B;AAAA,IACF;AAAA,EACF;AAGK,SAAA;AACT;"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
/* */
|
|
3
|
+
import { createFlowRemoteComponentRenderer } from "./lib/createFlowRemoteComponentRenderer.mjs";
|
|
4
|
+
import { elementFactory } from "./lib/elementFactory.mjs";
|
|
5
|
+
import { createRemoteComponentRenderer } from "@mittwald/remote-dom-react/host";
|
|
6
|
+
import { flowComponents } from "./auto-generated/index.mjs";
|
|
7
|
+
import { Form as Form$1 } from "./components/Form.mjs";
|
|
8
|
+
import { SlotRootWrapper } from "./components/SlotRootWrapper.mjs";
|
|
9
|
+
import { Form } from "./integrations/react-hook-form/Form.mjs";
|
|
10
|
+
import { NotificationRenderController } from "./components/NotificationRenderController.mjs";
|
|
11
|
+
const htmlComponentsMap = {
|
|
12
|
+
svg: createRemoteComponentRenderer(elementFactory("svg")),
|
|
13
|
+
circle: createRemoteComponentRenderer(elementFactory("circle")),
|
|
14
|
+
g: createRemoteComponentRenderer(elementFactory("g")),
|
|
15
|
+
path: createRemoteComponentRenderer(elementFactory("path")),
|
|
16
|
+
strong: createRemoteComponentRenderer(elementFactory("strong")),
|
|
17
|
+
s: createRemoteComponentRenderer(elementFactory("s")),
|
|
18
|
+
ul: createRemoteComponentRenderer(elementFactory("ul")),
|
|
19
|
+
ol: createRemoteComponentRenderer(elementFactory("ol")),
|
|
20
|
+
li: createRemoteComponentRenderer(elementFactory("li")),
|
|
21
|
+
small: createRemoteComponentRenderer(elementFactory("small")),
|
|
22
|
+
br: createRemoteComponentRenderer(
|
|
23
|
+
elementFactory("br", { isVoidElement: true })
|
|
24
|
+
)
|
|
25
|
+
};
|
|
26
|
+
const skippedComponentsMap = {
|
|
27
|
+
script: () => null
|
|
28
|
+
};
|
|
29
|
+
const flowComponentsMap = {
|
|
30
|
+
"flr-form": createFlowRemoteComponentRenderer("Form", Form$1),
|
|
31
|
+
"flr-rhf-form": createFlowRemoteComponentRenderer("RhfForm", Form),
|
|
32
|
+
"flr-slot-root-wrapper": createFlowRemoteComponentRenderer(
|
|
33
|
+
"SlotRootWrapper",
|
|
34
|
+
SlotRootWrapper
|
|
35
|
+
),
|
|
36
|
+
"flr-notification": createFlowRemoteComponentRenderer(
|
|
37
|
+
"Notification",
|
|
38
|
+
NotificationRenderController
|
|
39
|
+
)
|
|
40
|
+
};
|
|
41
|
+
const components = {
|
|
42
|
+
...htmlComponentsMap,
|
|
43
|
+
...skippedComponentsMap,
|
|
44
|
+
...flowComponents,
|
|
45
|
+
...flowComponentsMap
|
|
46
|
+
};
|
|
47
|
+
export {
|
|
48
|
+
components
|
|
49
|
+
};
|
|
50
|
+
//# sourceMappingURL=components.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"components.mjs","sources":["../../../../src/components.ts"],"sourcesContent":["import { createFlowRemoteComponentRenderer } from \"@/lib/createFlowRemoteComponentRenderer\";\nimport { elementFactory } from \"@/lib/elementFactory\";\nimport { createRemoteComponentRenderer } from \"@mittwald/remote-dom-react/host\";\nimport autoGenerated from \"./auto-generated\";\nimport { Form, SlotRootWrapper } from \"@/components/\";\nimport { Form as RhfForm } from \"@/integrations/react-hook-form/Form\";\nimport { NotificationRenderController } from \"@/components/NotificationRenderController\";\n\nconst htmlComponentsMap = {\n svg: createRemoteComponentRenderer(elementFactory(\"svg\")),\n circle: createRemoteComponentRenderer(elementFactory(\"circle\")),\n g: createRemoteComponentRenderer(elementFactory(\"g\")),\n path: createRemoteComponentRenderer(elementFactory(\"path\")),\n strong: createRemoteComponentRenderer(elementFactory(\"strong\")),\n s: createRemoteComponentRenderer(elementFactory(\"s\")),\n ul: createRemoteComponentRenderer(elementFactory(\"ul\")),\n ol: createRemoteComponentRenderer(elementFactory(\"ol\")),\n li: createRemoteComponentRenderer(elementFactory(\"li\")),\n small: createRemoteComponentRenderer(elementFactory(\"small\")),\n br: createRemoteComponentRenderer(\n elementFactory(\"br\", { isVoidElement: true }),\n ),\n} as const;\n\n/**\n * Components that are allowed to be used remotely but should not be rendered on\n * the host.\n */\nconst skippedComponentsMap = {\n script: () => null,\n} as const;\n\nconst flowComponentsMap = {\n \"flr-form\": createFlowRemoteComponentRenderer(\"Form\", Form),\n \"flr-rhf-form\": createFlowRemoteComponentRenderer(\"RhfForm\", RhfForm),\n \"flr-slot-root-wrapper\": createFlowRemoteComponentRenderer(\n \"SlotRootWrapper\",\n SlotRootWrapper,\n ),\n \"flr-notification\": createFlowRemoteComponentRenderer(\n \"Notification\",\n NotificationRenderController,\n ),\n};\n\nexport const components = {\n ...htmlComponentsMap,\n ...skippedComponentsMap,\n ...autoGenerated,\n ...flowComponentsMap,\n};\n"],"names":["Form","RhfForm","autoGenerated"],"mappings":";;;;;;;;AAQA,MAAM,oBAAoB;AAAA,EACxB,KAAK,8BAA8B,eAAe,KAAK,CAAC;AAAA,EACxD,QAAQ,8BAA8B,eAAe,QAAQ,CAAC;AAAA,EAC9D,GAAG,8BAA8B,eAAe,GAAG,CAAC;AAAA,EACpD,MAAM,8BAA8B,eAAe,MAAM,CAAC;AAAA,EAC1D,QAAQ,8BAA8B,eAAe,QAAQ,CAAC;AAAA,EAC9D,GAAG,8BAA8B,eAAe,GAAG,CAAC;AAAA,EACpD,IAAI,8BAA8B,eAAe,IAAI,CAAC;AAAA,EACtD,IAAI,8BAA8B,eAAe,IAAI,CAAC;AAAA,EACtD,IAAI,8BAA8B,eAAe,IAAI,CAAC;AAAA,EACtD,OAAO,8BAA8B,eAAe,OAAO,CAAC;AAAA,EAC5D,IAAI;AAAA,IACF,eAAe,MAAM,EAAE,eAAe,KAAM,CAAA;AAAA,EAAA;AAEhD;AAMA,MAAM,uBAAuB;AAAA,EAC3B,QAAQ,MAAM;AAChB;AAEA,MAAM,oBAAoB;AAAA,EACxB,YAAY,kCAAkC,QAAQA,MAAI;AAAA,EAC1D,gBAAgB,kCAAkC,WAAWC,IAAO;AAAA,EACpE,yBAAyB;AAAA,IACvB;AAAA,IACA;AAAA,EACF;AAAA,EACA,oBAAoB;AAAA,IAClB;AAAA,IACA;AAAA,EAAA;AAEJ;AAEO,MAAM,aAAa;AAAA,EACxB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAGC;AAAAA,EACH,GAAG;AACL;"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
/* */
|
|
3
|
+
import { usePromise } from "@mittwald/react-use-promise";
|
|
4
|
+
import { useId, useRef, useState } from "react";
|
|
5
|
+
const useControllableSuspenseTrigger = () => {
|
|
6
|
+
const localId = useId();
|
|
7
|
+
const promise = useRef(null);
|
|
8
|
+
const [startedCount, setStartedCount] = useState(0);
|
|
9
|
+
usePromise(
|
|
10
|
+
(promise2) => promise2,
|
|
11
|
+
promise.current ? [promise.current.promise] : null,
|
|
12
|
+
{
|
|
13
|
+
keepValueWhileLoading: false,
|
|
14
|
+
loaderId: localId + startedCount
|
|
15
|
+
}
|
|
16
|
+
);
|
|
17
|
+
return {
|
|
18
|
+
start: () => {
|
|
19
|
+
promise.current = Promise.withResolvers();
|
|
20
|
+
setStartedCount((c) => c + 1);
|
|
21
|
+
},
|
|
22
|
+
stop: () => {
|
|
23
|
+
var _a;
|
|
24
|
+
(_a = promise.current) == null ? void 0 : _a.resolve();
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
};
|
|
28
|
+
export {
|
|
29
|
+
useControllableSuspenseTrigger
|
|
30
|
+
};
|
|
31
|
+
//# sourceMappingURL=useControllableSuspenseTrigger.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useControllableSuspenseTrigger.mjs","sources":["../../../../../src/hooks/useControllableSuspenseTrigger.ts"],"sourcesContent":["import { usePromise } from \"@mittwald/react-use-promise\";\nimport { useId, useRef, useState } from \"react\";\n\nexport const useControllableSuspenseTrigger = () => {\n const localId = useId();\n const promise = useRef<PromiseWithResolvers<void>>(null);\n const [startedCount, setStartedCount] = useState(0);\n\n usePromise(\n (promise: Promise<void>) => promise,\n promise.current ? [promise.current.promise] : null,\n {\n keepValueWhileLoading: false,\n loaderId: localId + startedCount,\n },\n );\n\n return {\n start: () => {\n promise.current = Promise.withResolvers<void>();\n setStartedCount((c) => c + 1);\n },\n stop: () => {\n promise.current?.resolve();\n },\n };\n};\n"],"names":["promise"],"mappings":";;AAGO,MAAM,iCAAiC,MAAM;AAClD,QAAM,UAAU,MAAM;AAChB,QAAA,UAAU,OAAmC,IAAI;AACvD,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,CAAC;AAElD;AAAA,IACE,CAACA,aAA2BA;AAAAA,IAC5B,QAAQ,UAAU,CAAC,QAAQ,QAAQ,OAAO,IAAI;AAAA,IAC9C;AAAA,MACE,uBAAuB;AAAA,MACvB,UAAU,UAAU;AAAA,IAAA;AAAA,EAExB;AAEO,SAAA;AAAA,IACL,OAAO,MAAM;AACH,cAAA,UAAU,QAAQ,cAAoB;AAC9B,sBAAA,CAAC,MAAM,IAAI,CAAC;AAAA,IAC9B;AAAA,IACA,MAAM,MAAM;;AACV,oBAAQ,YAAR,mBAAiB;AAAA,IAAQ;AAAA,EAE7B;AACF;"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
/* */
|
|
3
|
+
import { components } from "../components.mjs";
|
|
4
|
+
import { useMemo } from "react";
|
|
5
|
+
import { reduce } from "remeda";
|
|
6
|
+
const useMergedComponents = (integrations) => useMemo(
|
|
7
|
+
() => new Map(
|
|
8
|
+
Object.entries(
|
|
9
|
+
reduce(
|
|
10
|
+
[...integrations, components],
|
|
11
|
+
(merged, current) => ({
|
|
12
|
+
...merged,
|
|
13
|
+
...current
|
|
14
|
+
}),
|
|
15
|
+
{}
|
|
16
|
+
)
|
|
17
|
+
)
|
|
18
|
+
),
|
|
19
|
+
[...integrations]
|
|
20
|
+
);
|
|
21
|
+
export {
|
|
22
|
+
useMergedComponents
|
|
23
|
+
};
|
|
24
|
+
//# sourceMappingURL=useMergedComponents.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useMergedComponents.mjs","sources":["../../../../../src/hooks/useMergedComponents.ts"],"sourcesContent":["import { components } from \"@/components\";\nimport type { RemoteComponentsMap } from \"@/lib/types\";\nimport type { RemoteComponentRendererProps } from \"@mittwald/remote-dom-react/host\";\nimport { type ComponentType, useMemo } from \"react\";\nimport { reduce } from \"remeda\";\n\nexport const useMergedComponents = (\n integrations: RemoteComponentsMap<never>[],\n) =>\n useMemo(\n () =>\n new Map<string, ComponentType<RemoteComponentRendererProps>>(\n Object.entries(\n reduce(\n [...integrations, components],\n (merged, current) => ({\n ...merged,\n ...current,\n }),\n {},\n ),\n ),\n ),\n [...integrations],\n );\n"],"names":[],"mappings":";;;AAMa,MAAA,sBAAsB,CACjC,iBAEA;AAAA,EACE,MACE,IAAI;AAAA,IACF,OAAO;AAAA,MACL;AAAA,QACE,CAAC,GAAG,cAAc,UAAU;AAAA,QAC5B,CAAC,QAAQ,aAAa;AAAA,UACpB,GAAG;AAAA,UACH,GAAG;AAAA,QAAA;AAAA,QAEL,CAAA;AAAA,MAAC;AAAA,IACH;AAAA,EAEJ;AAAA,EACF,CAAC,GAAG,YAAY;AAClB;"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
/* */
|
|
3
|
+
import "@mittwald/flow-remote-core";
|
|
4
|
+
import { useLayoutEffect } from "react";
|
|
5
|
+
const useUpdateHostPathnameOnRemote = (hostPathname, connection) => {
|
|
6
|
+
useLayoutEffect(() => {
|
|
7
|
+
if (hostPathname === void 0 || !connection) {
|
|
8
|
+
return;
|
|
9
|
+
}
|
|
10
|
+
const { updateHostPathname } = connection;
|
|
11
|
+
updateHostPathname(hostPathname);
|
|
12
|
+
}, [hostPathname, connection]);
|
|
13
|
+
};
|
|
14
|
+
export {
|
|
15
|
+
useUpdateHostPathnameOnRemote
|
|
16
|
+
};
|
|
17
|
+
//# sourceMappingURL=useUpdateHostPathnameOnRemote.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useUpdateHostPathnameOnRemote.mjs","sources":["../../../../../src/hooks/useUpdateHostPathnameOnRemote.ts"],"sourcesContent":["import { type HostToRemoteConnection } from \"@mittwald/flow-remote-core\";\nimport { useLayoutEffect } from \"react\";\n\n/** Updates the host pathname in the remote connection. */\nexport const useUpdateHostPathnameOnRemote = (\n hostPathname?: string,\n connection?: HostToRemoteConnection,\n) => {\n useLayoutEffect(() => {\n if (hostPathname === undefined || !connection) {\n return;\n }\n\n const { updateHostPathname } = connection;\n updateHostPathname(hostPathname);\n }, [hostPathname, connection]);\n};\n"],"names":[],"mappings":";;AAIa,MAAA,gCAAgC,CAC3C,cACA,eACG;AACH,kBAAgB,MAAM;AAChB,QAAA,iBAAiB,UAAa,CAAC,YAAY;AAC7C;AAAA,IAAA;AAGI,UAAA,EAAE,uBAAuB;AAC/B,uBAAmB,YAAY;AAAA,EAAA,GAC9B,CAAC,cAAc,UAAU,CAAC;AAC/B;"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
/* */
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
import "react";
|
|
5
|
+
const Form = (props) => {
|
|
6
|
+
const { onSubmit: onSubmitFromProps, ref, ...rest } = props;
|
|
7
|
+
const onSubmit = async (event) => {
|
|
8
|
+
event.preventDefault();
|
|
9
|
+
await (onSubmitFromProps == null ? void 0 : onSubmitFromProps());
|
|
10
|
+
};
|
|
11
|
+
return /* @__PURE__ */ jsx("form", { ...rest, ref, onSubmit });
|
|
12
|
+
};
|
|
13
|
+
export {
|
|
14
|
+
Form
|
|
15
|
+
};
|
|
16
|
+
//# sourceMappingURL=Form.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Form.mjs","sources":["../../../../../../src/integrations/react-hook-form/Form.tsx"],"sourcesContent":["import {\n type FC,\n type FormEvent,\n type PropsWithChildren,\n type RefObject,\n} from \"react\";\nimport React from \"react\";\n\ntype FormProps = {\n onSubmit?: () => void | Promise<void>;\n ref?: RefObject<HTMLFormElement>;\n} & PropsWithChildren;\n\n/**\n * ReactHookForm won't send the data over onSubmit, the form state is\n * transferred over onChange. To avoid sending unnecessary data, this RemoteForm\n * sends only the onSubmit without any formData.\n *\n * @class\n * @param props\n */\nexport const Form: FC<FormProps> = (props) => {\n const { onSubmit: onSubmitFromProps, ref, ...rest } = props;\n\n const onSubmit = async (event: FormEvent<HTMLFormElement>) => {\n event.preventDefault();\n await onSubmitFromProps?.();\n };\n\n return <form {...rest} ref={ref} onSubmit={onSubmit} />;\n};\n"],"names":[],"mappings":";;AAqBa,MAAA,OAAsB,CAAC,UAAU;AAC5C,QAAM,EAAE,UAAU,mBAAmB,KAAK,GAAG,KAAS,IAAA;AAEhD,QAAA,WAAW,OAAO,UAAsC;AAC5D,UAAM,eAAe;AACrB,WAAM;AAAA,EACR;AAEA,SAAQ,oBAAA,QAAA,EAAM,GAAG,MAAM,KAAU,UAAoB;AACvD;"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
/* */
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
import { isStyleProp, isReactSuspendedStyle } from "./propClassifiers.mjs";
|
|
5
|
+
import { createRemoteComponentRenderer } from "@mittwald/remote-dom-react/host";
|
|
6
|
+
import { FlowRemoteElement } from "@mittwald/flow-remote-elements";
|
|
7
|
+
import { Version } from "@mittwald/flow-remote-core";
|
|
8
|
+
import "react";
|
|
9
|
+
import { mapValues } from "remeda";
|
|
10
|
+
const mapProperty = (val, key) => {
|
|
11
|
+
if (isStyleProp(key)) {
|
|
12
|
+
if (isReactSuspendedStyle(val)) {
|
|
13
|
+
return {
|
|
14
|
+
display: "none"
|
|
15
|
+
};
|
|
16
|
+
}
|
|
17
|
+
return {};
|
|
18
|
+
}
|
|
19
|
+
return val;
|
|
20
|
+
};
|
|
21
|
+
const createFlowRemoteComponentRenderer = (name, Component) => {
|
|
22
|
+
function HostComponent(props) {
|
|
23
|
+
const hostComponentProps = mapValues(
|
|
24
|
+
props,
|
|
25
|
+
(v, k) => mapProperty(v, k)
|
|
26
|
+
);
|
|
27
|
+
const {
|
|
28
|
+
[FlowRemoteElement.versionPropertyName]: version = Version.v1,
|
|
29
|
+
[FlowRemoteElement.initializationPropertyName]: initialized = false,
|
|
30
|
+
...restProps
|
|
31
|
+
} = hostComponentProps;
|
|
32
|
+
if (version >= Version.v3) {
|
|
33
|
+
if (!initialized) {
|
|
34
|
+
return null;
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
return /* @__PURE__ */ jsx(Component, { ...restProps });
|
|
38
|
+
}
|
|
39
|
+
HostComponent.displayName = `FlowRemoteRenderer(${name})`;
|
|
40
|
+
return createRemoteComponentRenderer(HostComponent, {
|
|
41
|
+
name: `RemoteRenderer(${name})`
|
|
42
|
+
});
|
|
43
|
+
};
|
|
44
|
+
export {
|
|
45
|
+
createFlowRemoteComponentRenderer
|
|
46
|
+
};
|
|
47
|
+
//# sourceMappingURL=createFlowRemoteComponentRenderer.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"createFlowRemoteComponentRenderer.mjs","sources":["../../../../../src/lib/createFlowRemoteComponentRenderer.tsx"],"sourcesContent":["import { isReactSuspendedStyle, isStyleProp } from \"@/lib/propClassifiers\";\nimport type { RemoteComponentRendererProps } from \"@mittwald/remote-dom-react/host\";\nimport { createRemoteComponentRenderer } from \"@mittwald/remote-dom-react/host\";\nimport { FlowRemoteElement } from \"@mittwald/flow-remote-elements\";\nimport type { FlowRemoteElementMetaData } from \"@mittwald/flow-remote-elements\";\nimport { Version } from \"@mittwald/flow-remote-core\";\nimport { type ComponentType } from \"react\";\nimport { mapValues } from \"remeda\";\n\nconst mapProperty = (val: unknown, key: string) => {\n if (isStyleProp(key)) {\n if (isReactSuspendedStyle(val)) {\n return {\n display: \"none\",\n };\n }\n return {};\n }\n return val;\n};\n\nexport const createFlowRemoteComponentRenderer = <P extends object>(\n name: string,\n Component: ComponentType<P>,\n): ComponentType<RemoteComponentRendererProps> => {\n function HostComponent(props: P & FlowRemoteElementMetaData) {\n const hostComponentProps = mapValues(props, (v, k) =>\n mapProperty(v, k),\n ) as P & FlowRemoteElementMetaData;\n\n const {\n [FlowRemoteElement.versionPropertyName]: version = Version.v1,\n [FlowRemoteElement.initializationPropertyName]: initialized = false,\n ...restProps\n } = hostComponentProps;\n\n if (version >= Version.v3) {\n // \"initialized\" handling introduced in version 3\n if (!initialized) {\n return null;\n }\n }\n\n return <Component {...(restProps as P)} />;\n }\n HostComponent.displayName = `FlowRemoteRenderer(${name})`;\n return createRemoteComponentRenderer(HostComponent, {\n name: `RemoteRenderer(${name})`,\n });\n};\n"],"names":[],"mappings":";;;;;;;AASA,MAAM,cAAc,CAAC,KAAc,QAAgB;AAC7C,MAAA,YAAY,GAAG,GAAG;AAChB,QAAA,sBAAsB,GAAG,GAAG;AACvB,aAAA;AAAA,QACL,SAAS;AAAA,MACX;AAAA,IAAA;AAEF,WAAO,CAAC;AAAA,EAAA;AAEH,SAAA;AACT;AAEa,MAAA,oCAAoC,CAC/C,MACA,cACgD;AAChD,WAAS,cAAc,OAAsC;AAC3D,UAAM,qBAAqB;AAAA,MAAU;AAAA,MAAO,CAAC,GAAG,MAC9C,YAAY,GAAG,CAAC;AAAA,IAClB;AAEM,UAAA;AAAA,MACJ,CAAC,kBAAkB,mBAAmB,GAAG,UAAU,QAAQ;AAAA,MAC3D,CAAC,kBAAkB,0BAA0B,GAAG,cAAc;AAAA,MAC9D,GAAG;AAAA,IAAA,IACD;AAEA,QAAA,WAAW,QAAQ,IAAI;AAEzB,UAAI,CAAC,aAAa;AACT,eAAA;AAAA,MAAA;AAAA,IACT;AAGK,WAAA,oBAAC,WAAW,EAAA,GAAI,UAAiB,CAAA;AAAA,EAAA;AAE5B,gBAAA,cAAc,sBAAsB,IAAI;AACtD,SAAO,8BAA8B,eAAe;AAAA,IAClD,MAAM,kBAAkB,IAAI;AAAA,EAAA,CAC7B;AACH;"}
|
|
@@ -1,14 +1,18 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
|
+
import { mapAttributeToReactProperty } from "./mapAttributeToReactProperty.mjs";
|
|
4
|
+
import clsx from "clsx";
|
|
3
5
|
import { createElement } from "react";
|
|
4
6
|
import { mapKeys } from "remeda";
|
|
5
|
-
|
|
6
|
-
import { mapAttributeToReactProperty } from "./mapAttributeToReactProperty.mjs";
|
|
7
|
-
const elementFactory = (element) => (props) => {
|
|
7
|
+
const elementFactory = (element, options = {}) => (props) => {
|
|
8
8
|
const result = { ...props };
|
|
9
|
+
const { isVoidElement = false } = options;
|
|
10
|
+
if (isVoidElement) {
|
|
11
|
+
delete result["children"];
|
|
12
|
+
}
|
|
9
13
|
result["className"] = clsx(
|
|
10
|
-
String(result["className"]),
|
|
11
|
-
String(result["class"])
|
|
14
|
+
"className" in result && String(result["className"]),
|
|
15
|
+
"class" in result && String(result["class"])
|
|
12
16
|
);
|
|
13
17
|
delete result["class"];
|
|
14
18
|
return createElement(element, mapKeys(result, mapAttributeToReactProperty));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"elementFactory.mjs","sources":["../../../../../src/lib/elementFactory.ts"],"sourcesContent":["import { mapAttributeToReactProperty } from \"@/lib/mapAttributeToReactProperty\";\nimport clsx from \"clsx\";\nimport { createElement } from \"react\";\nimport { mapKeys } from \"remeda\";\n\ntype ElementTagNameMap = HTMLElementTagNameMap &\n Pick<\n SVGElementTagNameMap,\n Exclude<keyof SVGElementTagNameMap, keyof HTMLElementTagNameMap>\n >;\n\ninterface Options {\n isVoidElement?: boolean;\n}\n\nexport const elementFactory =\n <E extends keyof ElementTagNameMap>(element: E, options: Options = {}) =>\n (props: Record<string, unknown>) => {\n const result = { ...props };\n const { isVoidElement = false } = options;\n\n if (isVoidElement) {\n delete result[\"children\"];\n }\n\n // merge className and class\n result[\"className\"] = clsx(\n \"className\" in result && String(result[\"className\"]),\n \"class\" in result && String(result[\"class\"]),\n );\n\n delete result[\"class\"];\n\n return createElement(element, mapKeys(result, mapAttributeToReactProperty));\n };\n"],"names":[],"mappings":";;;;AAeO,MAAM,iBACX,CAAoC,SAAY,UAAmB,CAAC,MACpE,CAAC,UAAmC;AAC5B,QAAA,SAAS,EAAE,GAAG,MAAM;AACpB,QAAA,EAAE,gBAAgB,MAAA,IAAU;AAElC,MAAI,eAAe;AACjB,WAAO,OAAO,UAAU;AAAA,EAAA;AAI1B,SAAO,WAAW,IAAI;AAAA,IACpB,eAAe,UAAU,OAAO,OAAO,WAAW,CAAC;AAAA,IACnD,WAAW,UAAU,OAAO,OAAO,OAAO,CAAC;AAAA,EAC7C;AAEA,SAAO,OAAO,OAAO;AAErB,SAAO,cAAc,SAAS,QAAQ,QAAQ,2BAA2B,CAAC;AAC5E;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"mapAttributeToReactProperty.mjs","sources":["../../../../../src/lib/mapAttributeToReactProperty.ts"],"sourcesContent":["import { toCamelCase } from \"remeda\";\n\nconst keepWhenStartsWith = [\"aria-\", \"data-\"];\n\nexport const mapAttributeToReactProperty = (key: string) => {\n if (keepWhenStartsWith.some((prefix) => key.startsWith(prefix))) {\n return key;\n }\n\n return toCamelCase(key);\n};\n"],"names":[],"mappings":";AAEA,MAAM,qBAAqB,CAAC,SAAS,OAAO;AAE/B,MAAA,8BAA8B,CAAC,QAAgB;AACtD,MAAA,mBAAmB,KAAK,CAAC,WAAW,IAAI,WAAW,MAAM,CAAC,GAAG;AACxD,WAAA;AAAA,EAAA;AAGT,SAAO,YAAY,GAAG;AACxB;"}
|
|
@@ -1,12 +1,8 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
|
-
import { isFunction } from "remeda";
|
|
4
|
-
const defaultEventPropMatcher = /on[A-Z].*/;
|
|
5
|
-
const isEventProp = (name, value) => !!name.match(defaultEventPropMatcher) && isFunction(value);
|
|
6
3
|
const isStyleProp = (name) => name === "style";
|
|
7
4
|
const isReactSuspendedStyle = (value) => value === "display: none !important;";
|
|
8
5
|
export {
|
|
9
|
-
isEventProp,
|
|
10
6
|
isReactSuspendedStyle,
|
|
11
7
|
isStyleProp
|
|
12
8
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"propClassifiers.mjs","sources":["../../../../../src/lib/propClassifiers.ts"],"sourcesContent":["export const isStyleProp = (name: string): boolean => name === \"style\";\n\nexport const isReactSuspendedStyle = (value: unknown): boolean =>\n value === \"display: none !important;\";\n"],"names":[],"mappings":"AAAa,MAAA,cAAc,CAAC,SAA0B,SAAS;AAElD,MAAA,wBAAwB,CAAC,UACpC,UAAU;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import { RemoteRendererBrowserProps } from './RemoteRendererBrowser';
|
|
1
2
|
import { FC } from 'react';
|
|
2
|
-
|
|
3
|
-
export declare const RemoteRenderer: FC<RemoteRendererProps>;
|
|
3
|
+
export declare const RemoteRenderer: FC<RemoteRendererBrowserProps>;
|
|
4
4
|
export default RemoteRenderer;
|
|
5
5
|
//# sourceMappingURL=RemoteRenderer.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RemoteRenderer.d.ts","sourceRoot":"","sources":["../../src/RemoteRenderer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"RemoteRenderer.d.ts","sourceRoot":"","sources":["../../src/RemoteRenderer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AAE1E,OAAc,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAMvC,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,0BAA0B,CAMzD,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { RemoteComponentsMap } from './lib/types';
|
|
2
|
+
import { ExtBridgeConnectionApi } from '@mittwald/ext-bridge';
|
|
3
|
+
import { NavigationState } from '@mittwald/flow-remote-core';
|
|
4
|
+
import { FC } from 'react';
|
|
5
|
+
export interface RemoteRendererBrowserProps {
|
|
6
|
+
integrations?: RemoteComponentsMap<never>[];
|
|
7
|
+
src: string;
|
|
8
|
+
timeoutMs?: number;
|
|
9
|
+
onNavigationStateChanged?: (state: NavigationState) => void;
|
|
10
|
+
hostPathname?: string;
|
|
11
|
+
extBridgeImplementation?: ExtBridgeConnectionApi;
|
|
12
|
+
}
|
|
13
|
+
export declare const RemoteRendererBrowser: FC<RemoteRendererBrowserProps>;
|
|
14
|
+
export default RemoteRendererBrowser;
|
|
15
|
+
//# sourceMappingURL=RemoteRendererBrowser.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RemoteRendererBrowser.d.ts","sourceRoot":"","sources":["../../src/RemoteRendererBrowser.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAC;AACnE,OAAO,EAIL,KAAK,eAAe,EACrB,MAAM,4BAA4B,CAAC;AAMpC,OAAO,EAAsB,KAAK,EAAE,EAA6B,MAAM,OAAO,CAAC;AAE/E,MAAM,WAAW,0BAA0B;IACzC,YAAY,CAAC,EAAE,mBAAmB,CAAC,KAAK,CAAC,EAAE,CAAC;IAC5C,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wBAAwB,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC5D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,uBAAuB,CAAC,EAAE,sBAAsB,CAAC;CAClD;AAWD,eAAO,MAAM,qBAAqB,EAAE,EAAE,CAAC,0BAA0B,CA6GhE,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
|