@plitzi/sdk-elements 0.38.9 → 0.38.11
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/CHANGELOG.md +271 -0
- package/dist/Element/hooks/useElementInternal.mjs +67 -59
- package/dist/elements/advanced/BlockHtml/index.mjs +3 -3
- package/dist/elements/advanced/BlockJsx/index.mjs +3 -3
- package/dist/elements/advanced/Custom/index.mjs +3 -3
- package/dist/elements/basic/Button/index.mjs +3 -3
- package/dist/elements/basic/ThemeToggle/ThemeToggle.mjs +13 -13
- package/dist/elements/declarations/index.d.ts +28 -16
- package/dist/elements/declarations/index.mjs +6 -6
- package/dist/elements/form/Form/Form.mjs +19 -19
- package/dist/elements/form/FormControl/FormControl.mjs +10 -10
- package/dist/elements/form/FormControl/declaration.mjs +1 -1
- package/dist/elements/internal/NotFound/index.mjs +3 -3
- package/dist/elements/internal/Page/Page.d.ts +5 -0
- package/dist/elements/internal/Page/Page.mjs +26 -25
- package/dist/elements/internal/Page/PageHead.d.ts +12 -0
- package/dist/elements/internal/Page/PageHead.mjs +29 -0
- package/dist/elements/internal/Page/declaration.d.ts +2 -0
- package/dist/elements/internal/Page/declaration.mjs +5 -0
- package/dist/elements/internal/Page/index.d.ts +2 -0
- package/dist/elements/provider/ApiContainer/ApiContainer.mjs +187 -187
- package/dist/elements/provider/ApiContainer/declaration.d.ts +10 -9
- package/dist/elements/provider/ApiContainer/declaration.mjs +1 -0
- package/dist/elements/provider/ApiContainer/index.d.ts +10 -9
- package/dist/elements/provider/Channel/Channel.mjs +58 -57
- package/dist/elements/provider/Channel/declaration.d.ts +7 -1
- package/dist/elements/provider/Channel/declaration.mjs +8 -2
- package/dist/elements/provider/Channel/index.d.ts +7 -1
- package/dist/elements/structure/Carousel/Carousel.mjs +72 -72
- package/dist/elements/structure/Carousel/CarouselTrack/index.mjs +3 -3
- package/dist/elements/structure/Carousel/declaration.d.ts +1 -1
- package/dist/elements/structure/Carousel/index.d.ts +1 -1
- package/dist/elements/structure/Container/Container.mjs +8 -8
- package/dist/elements/structure/DialogContainer/DialogContainer.mjs +14 -14
- package/dist/elements/structure/DialogContainer/declaration.d.ts +1 -2
- package/dist/elements/structure/DialogContainer/declaration.mjs +1 -2
- package/dist/elements/structure/DialogContainer/index.d.ts +1 -2
- package/dist/elements/structure/List/modes/ListControlled/ListControlled.mjs +8 -8
- package/dist/elements/structure/ModalContainer/ModalContainer.mjs +16 -16
- package/dist/elements/structure/ModalContainer/declaration.d.ts +2 -3
- package/dist/elements/structure/ModalContainer/declaration.mjs +2 -3
- package/dist/elements/structure/ModalContainer/index.d.ts +2 -3
- package/dist/elements/structure/Pagination/Pagination.mjs +10 -10
- package/dist/index.d.ts +23 -16
- package/dist/realtime/useChannel.d.ts +4 -3
- package/dist/realtime/useChannel.mjs +36 -36
- package/package.json +12 -8
|
@@ -155,8 +155,7 @@ declare const DialogContainer: {
|
|
|
155
155
|
readonly top: "0";
|
|
156
156
|
readonly position: "absolute";
|
|
157
157
|
readonly 'z-index': "210";
|
|
158
|
-
readonly 'background-color': "
|
|
159
|
-
readonly opacity: "0.5";
|
|
158
|
+
readonly 'background-color': "rgb(0 0 0 / 50%)";
|
|
160
159
|
};
|
|
161
160
|
};
|
|
162
161
|
readonly rootContainer: {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import e from "
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
import r from "./
|
|
5
|
-
import i from "
|
|
1
|
+
import e from "../../declaration.mjs";
|
|
2
|
+
import t from "../../../../../Element/hooks/useElement.mjs";
|
|
3
|
+
import { RootElement as n } from "../../../../../Element/RootElement.mjs";
|
|
4
|
+
import { rowKeys as r } from "./rowKeys.mjs";
|
|
5
|
+
import i from "./ListControlledItem.mjs";
|
|
6
6
|
import { useCallback as a, useMemo as o } from "react";
|
|
7
7
|
import s from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
|
|
8
8
|
import { get as c } from "@plitzi/plitzi-ui/helpers";
|
|
@@ -14,7 +14,7 @@ import h from "@plitzi/sdk-shared/dataSource/helpers/getSourceName";
|
|
|
14
14
|
import g from "@plitzi/sdk-shared/dataSource/hooks/useRegisterSource";
|
|
15
15
|
//#region src/elements/structure/List/modes/ListControlled/ListControlled.tsx
|
|
16
16
|
var _ = ({ ref: _, className: v = "", subType: y = "ul", children: b, items: x = [], itemKey: S, label: C = "" }) => {
|
|
17
|
-
let { id: w, definition: { label: T } } =
|
|
17
|
+
let { id: w, definition: { label: T } } = t(), E = h(e.sourceType, w), { settings: { previewMode: D } } = s(), O = o(() => Array.isArray(x) ? x : [], [x]), k = o(() => r(O, S), [O, S]), A = a(() => d({
|
|
18
18
|
item: c(O, "0", {}),
|
|
19
19
|
index: 0
|
|
20
20
|
}).reduce((e, t) => [...e, {
|
|
@@ -26,7 +26,7 @@ var _ = ({ ref: _, className: v = "", subType: y = "ul", children: b, items: x =
|
|
|
26
26
|
source: E,
|
|
27
27
|
name: T || `List - ${w}`,
|
|
28
28
|
fields: A
|
|
29
|
-
}), /* @__PURE__ */ p(
|
|
29
|
+
}), /* @__PURE__ */ p(n, {
|
|
30
30
|
ref: _,
|
|
31
31
|
tag: y,
|
|
32
32
|
"aria-label": C || void 0,
|
|
@@ -41,7 +41,7 @@ var _ = ({ ref: _, className: v = "", subType: y = "ul", children: b, items: x =
|
|
|
41
41
|
className: "controlled-list-item__counter",
|
|
42
42
|
children: `List Item - ${t + 1}`
|
|
43
43
|
})
|
|
44
|
-
}, t) : /* @__PURE__ */ f(
|
|
44
|
+
}, t) : /* @__PURE__ */ f(i, {
|
|
45
45
|
index: t,
|
|
46
46
|
isTemplate: t !== 0 && !D,
|
|
47
47
|
record: e,
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import e from "
|
|
2
|
-
import t from "../../../Element/
|
|
3
|
-
import
|
|
4
|
-
import r from "../../../
|
|
5
|
-
import i from "
|
|
6
|
-
import a from "./
|
|
1
|
+
import e from "./declaration.mjs";
|
|
2
|
+
import t from "../../../Element/hocs/withElement.mjs";
|
|
3
|
+
import n from "../../../Element/hooks/useElement.mjs";
|
|
4
|
+
import { RootElement as r } from "../../../Element/RootElement.mjs";
|
|
5
|
+
import i from "../../../dataSource/pathFields.mjs";
|
|
6
|
+
import a from "./useModalDialog.mjs";
|
|
7
7
|
import { metadataFromText as o } from "./metadataFromText.mjs";
|
|
8
8
|
import { use as s, useCallback as c, useEffect as l, useMemo as u, useRef as d, useState as f } from "react";
|
|
9
9
|
import p from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
|
|
@@ -14,8 +14,8 @@ import v from "clsx";
|
|
|
14
14
|
import y from "@plitzi/sdk-shared/dataSource/helpers/getSourceName";
|
|
15
15
|
import b from "@plitzi/sdk-shared/dataSource/hooks/useRegisterSource";
|
|
16
16
|
//#region src/elements/structure/ModalContainer/ModalContainer.tsx
|
|
17
|
-
var x = ({ ref:
|
|
18
|
-
let { id: T, rootId: E, visible: D, definition: { styleSelectors: O, label: k = "Modal" }, elementState: A, setElementState: j } =
|
|
17
|
+
var x = ({ ref: t, className: x = "", children: S, title: C = "Modal Header", autoHideAfterClick: w = !0 }) => {
|
|
18
|
+
let { id: T, rootId: E, visible: D, definition: { styleSelectors: O, label: k = "Modal" }, elementState: A, setElementState: j } = n(), M = y(e.sourceType, T), { settings: { previewMode: N }, contexts: { InteractionsContext: P } } = p(), { interactionsManager: F } = s(P), [I, L] = f({}), R = d(null), z = `${E}_${T}_title`, B = c((e) => {
|
|
19
19
|
let { metadata: t } = e;
|
|
20
20
|
L(t && typeof t == "object" ? t : typeof t == "string" ? o(t) : typeof t == "boolean" || typeof t == "number" ? { content: t } : {}), j((e) => ({
|
|
21
21
|
...e,
|
|
@@ -46,12 +46,12 @@ var x = ({ ref: e, className: x = "", children: S, title: C = "Modal Header", au
|
|
|
46
46
|
T
|
|
47
47
|
]), U = u(() => ({
|
|
48
48
|
openModal: {
|
|
49
|
-
...
|
|
49
|
+
...e.callbacks.openModal,
|
|
50
50
|
title: `Open ${k}`,
|
|
51
51
|
callback: B
|
|
52
52
|
},
|
|
53
53
|
closeModal: {
|
|
54
|
-
...
|
|
54
|
+
...e.callbacks.closeModal,
|
|
55
55
|
title: `Close ${k}`,
|
|
56
56
|
callback: V
|
|
57
57
|
}
|
|
@@ -60,7 +60,7 @@ var x = ({ ref: e, className: x = "", children: S, title: C = "Modal Header", au
|
|
|
60
60
|
B,
|
|
61
61
|
k
|
|
62
62
|
]);
|
|
63
|
-
|
|
63
|
+
a({
|
|
64
64
|
panelRef: R,
|
|
65
65
|
open: !!N && D,
|
|
66
66
|
onClose: V
|
|
@@ -72,7 +72,7 @@ var x = ({ ref: e, className: x = "", children: S, title: C = "Modal Header", au
|
|
|
72
72
|
I,
|
|
73
73
|
A.visibility
|
|
74
74
|
]);
|
|
75
|
-
let W = c(() =>
|
|
75
|
+
let W = c(() => i(I), [I]);
|
|
76
76
|
b({
|
|
77
77
|
id: T,
|
|
78
78
|
source: M,
|
|
@@ -80,10 +80,10 @@ var x = ({ ref: e, className: x = "", children: S, title: C = "Modal Header", au
|
|
|
80
80
|
fields: W
|
|
81
81
|
});
|
|
82
82
|
let G = u(() => M ? { runtime: { sources: { [M]: I } } } : h, [M, I]);
|
|
83
|
-
return /* @__PURE__ */ _(
|
|
84
|
-
ref:
|
|
83
|
+
return /* @__PURE__ */ _(r, {
|
|
84
|
+
ref: t,
|
|
85
85
|
className: v("plitzi-component__modal-container", x),
|
|
86
|
-
interactionTriggers:
|
|
86
|
+
interactionTriggers: e.triggers,
|
|
87
87
|
interactionCallbacks: U,
|
|
88
88
|
children: [/* @__PURE__ */ g("div", {
|
|
89
89
|
className: v("modal-container__background", O.backgroundContainer),
|
|
@@ -124,6 +124,6 @@ var x = ({ ref: e, className: x = "", children: S, title: C = "Modal Header", au
|
|
|
124
124
|
})]
|
|
125
125
|
})]
|
|
126
126
|
});
|
|
127
|
-
}, S =
|
|
127
|
+
}, S = t(x);
|
|
128
128
|
//#endregion
|
|
129
129
|
export { x as ModalContainer, S as default };
|
|
@@ -59,7 +59,7 @@ declare const declaration: {
|
|
|
59
59
|
readonly definition: {
|
|
60
60
|
readonly label: "Modal Container";
|
|
61
61
|
readonly type: "modalContainer";
|
|
62
|
-
readonly description:
|
|
62
|
+
readonly description: string;
|
|
63
63
|
readonly items: readonly [];
|
|
64
64
|
readonly bindings: {};
|
|
65
65
|
/**
|
|
@@ -121,8 +121,7 @@ declare const declaration: {
|
|
|
121
121
|
readonly top: "0";
|
|
122
122
|
readonly position: "absolute";
|
|
123
123
|
readonly 'z-index': "210";
|
|
124
|
-
readonly 'background-color': "
|
|
125
|
-
readonly opacity: "0.5";
|
|
124
|
+
readonly 'background-color': "rgb(0 0 0 / 50%)";
|
|
126
125
|
};
|
|
127
126
|
};
|
|
128
127
|
readonly rootContainer: {
|
|
@@ -49,7 +49,7 @@ var t = e()({
|
|
|
49
49
|
definition: {
|
|
50
50
|
label: "Modal Container",
|
|
51
51
|
type: "modalContainer",
|
|
52
|
-
description: "A modal overlay container opened and closed through interactions; use for dialogs over the page.",
|
|
52
|
+
description: "A modal overlay container opened and closed through interactions; use for dialogs over the page. The element itself is fixed over the whole viewport, and holds two layers side by side — neither inside the other: `backgroundContainer`, the dim layer, `rgb(0 0 0 / 50%)` (its `background-color` is the whole dim), and `rootContainer`, the dialog, centred by `top: 50%`, `left: 50%` and `transform: translate3d(-50%, -50%, 0)` — to sit it near the top, set `top` and `transform: translateX(-50%)`; flex alignment on the dim layer moves nothing. Inside the dialog, top to bottom: `headerContainer` (with `headerTitle` and `headerCloseButton`) and `bodyContainer`.",
|
|
53
53
|
items: [],
|
|
54
54
|
bindings: {},
|
|
55
55
|
loadStrategy: "lazy",
|
|
@@ -101,8 +101,7 @@ var t = e()({
|
|
|
101
101
|
top: "0",
|
|
102
102
|
position: "absolute",
|
|
103
103
|
"z-index": "210",
|
|
104
|
-
"background-color": "
|
|
105
|
-
opacity: "0.5"
|
|
104
|
+
"background-color": "rgb(0 0 0 / 50%)"
|
|
106
105
|
} },
|
|
107
106
|
rootContainer: { default: {
|
|
108
107
|
display: "flex",
|
|
@@ -58,7 +58,7 @@ declare const ModalContainer: {
|
|
|
58
58
|
readonly definition: {
|
|
59
59
|
readonly label: "Modal Container";
|
|
60
60
|
readonly type: "modalContainer";
|
|
61
|
-
readonly description:
|
|
61
|
+
readonly description: string;
|
|
62
62
|
readonly items: readonly [];
|
|
63
63
|
readonly bindings: {};
|
|
64
64
|
readonly loadStrategy: "lazy";
|
|
@@ -115,8 +115,7 @@ declare const ModalContainer: {
|
|
|
115
115
|
readonly top: "0";
|
|
116
116
|
readonly position: "absolute";
|
|
117
117
|
readonly 'z-index': "210";
|
|
118
|
-
readonly 'background-color': "
|
|
119
|
-
readonly opacity: "0.5";
|
|
118
|
+
readonly 'background-color': "rgb(0 0 0 / 50%)";
|
|
120
119
|
};
|
|
121
120
|
};
|
|
122
121
|
readonly rootContainer: {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import e from "
|
|
2
|
-
import t from "../../../Element/
|
|
3
|
-
import
|
|
4
|
-
import r from "
|
|
1
|
+
import e from "./declaration.mjs";
|
|
2
|
+
import t from "../../../Element/hocs/withElement.mjs";
|
|
3
|
+
import n from "../../../Element/hooks/useElement.mjs";
|
|
4
|
+
import { RootElement as r } from "../../../Element/RootElement.mjs";
|
|
5
5
|
import i from "./buildPageWindow.mjs";
|
|
6
6
|
import { use as a, useCallback as o, useMemo as s } from "react";
|
|
7
7
|
import c from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
|
|
@@ -14,8 +14,8 @@ var h = (e, t) => {
|
|
|
14
14
|
if (typeof window > "u") return "";
|
|
15
15
|
let n = new URL(window.location.href);
|
|
16
16
|
return t <= 1 ? n.searchParams.delete(e) : n.searchParams.set(e, String(t)), `${n.pathname}${n.search}`;
|
|
17
|
-
}, g = ({ ref:
|
|
18
|
-
let { id: D, definition: { styleSelectors: O } } =
|
|
17
|
+
}, g = ({ ref: t, className: g = "", children: _, pageInfo: v = u, mode: y = "pages", pageParam: b = "page", target: x = "url", windowSize: S = 5, previousLabel: C = "Previous", nextLabel: w = "Next", loadMoreLabel: T = "Load more", label: E = "Pagination" }) => {
|
|
18
|
+
let { id: D, definition: { styleSelectors: O } } = n(), { settings: { previewMode: k }, contexts: { InteractionsContext: A } } = c(), { interactionsManager: j } = a(A), [M] = l("navigation.navigate"), N = v.page ?? 1, P = v.pageCount ?? 0, F = v.hasPrevPage ?? N > 1, I = v.hasNextPage ?? !1, L = s(() => i(N, P, S), [
|
|
19
19
|
N,
|
|
20
20
|
P,
|
|
21
21
|
S
|
|
@@ -31,12 +31,12 @@ var h = (e, t) => {
|
|
|
31
31
|
]), z = o((e) => (t) => {
|
|
32
32
|
t.preventDefault(), R(e);
|
|
33
33
|
}, [R]), B = P === 0 && !I && !F;
|
|
34
|
-
return /* @__PURE__ */ p(
|
|
35
|
-
ref:
|
|
34
|
+
return /* @__PURE__ */ p(r, {
|
|
35
|
+
ref: t,
|
|
36
36
|
tag: "nav",
|
|
37
37
|
"aria-label": E || void 0,
|
|
38
38
|
className: m("plitzi-component__pagination", g),
|
|
39
|
-
interactionTriggers:
|
|
39
|
+
interactionTriggers: e.triggers,
|
|
40
40
|
children: [
|
|
41
41
|
y === "loadMore" && /* @__PURE__ */ f("button", {
|
|
42
42
|
type: "button",
|
|
@@ -75,6 +75,6 @@ var h = (e, t) => {
|
|
|
75
75
|
_
|
|
76
76
|
]
|
|
77
77
|
});
|
|
78
|
-
}, _ =
|
|
78
|
+
}, _ = t(g);
|
|
79
79
|
//#endregion
|
|
80
80
|
export { g as Pagination, _ as default };
|
package/dist/index.d.ts
CHANGED
|
@@ -836,6 +836,7 @@ export declare const defaultElements: {
|
|
|
836
836
|
displayName: string;
|
|
837
837
|
} & {
|
|
838
838
|
readonly type: "page";
|
|
839
|
+
readonly serverTemplates: readonly ["seoPageTitle", "seoPageDescription", "notFound"];
|
|
839
840
|
readonly triggers: {
|
|
840
841
|
readonly onPageLoad: {
|
|
841
842
|
readonly action: "onPageLoad";
|
|
@@ -916,6 +917,7 @@ export declare const defaultElements: {
|
|
|
916
917
|
};
|
|
917
918
|
} & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
|
|
918
919
|
layout?: string | undefined;
|
|
920
|
+
notFound?: string | undefined;
|
|
919
921
|
layoutContainer?: string | undefined;
|
|
920
922
|
seoEnabled?: boolean | undefined;
|
|
921
923
|
seoPageTitle?: string | undefined;
|
|
@@ -1201,8 +1203,7 @@ export declare const defaultElements: {
|
|
|
1201
1203
|
readonly top: "0";
|
|
1202
1204
|
readonly position: "absolute";
|
|
1203
1205
|
readonly 'z-index': "210";
|
|
1204
|
-
readonly 'background-color': "
|
|
1205
|
-
readonly opacity: "0.5";
|
|
1206
|
+
readonly 'background-color': "rgb(0 0 0 / 50%)";
|
|
1206
1207
|
};
|
|
1207
1208
|
};
|
|
1208
1209
|
readonly rootContainer: {
|
|
@@ -1398,7 +1399,7 @@ export declare const defaultElements: {
|
|
|
1398
1399
|
readonly definition: {
|
|
1399
1400
|
readonly label: "Modal Container";
|
|
1400
1401
|
readonly type: "modalContainer";
|
|
1401
|
-
readonly description:
|
|
1402
|
+
readonly description: string;
|
|
1402
1403
|
readonly items: readonly [];
|
|
1403
1404
|
readonly bindings: {};
|
|
1404
1405
|
readonly loadStrategy: "lazy";
|
|
@@ -1455,8 +1456,7 @@ export declare const defaultElements: {
|
|
|
1455
1456
|
readonly top: "0";
|
|
1456
1457
|
readonly position: "absolute";
|
|
1457
1458
|
readonly 'z-index': "210";
|
|
1458
|
-
readonly 'background-color': "
|
|
1459
|
-
readonly opacity: "0.5";
|
|
1459
|
+
readonly 'background-color': "rgb(0 0 0 / 50%)";
|
|
1460
1460
|
};
|
|
1461
1461
|
};
|
|
1462
1462
|
readonly rootContainer: {
|
|
@@ -1940,8 +1940,8 @@ export declare const defaultElements: {
|
|
|
1940
1940
|
items?: unknown[] | undefined;
|
|
1941
1941
|
speed?: number | undefined;
|
|
1942
1942
|
loop?: boolean | undefined;
|
|
1943
|
-
autoplay?: number | undefined;
|
|
1944
1943
|
pauseOnHover?: boolean | undefined;
|
|
1944
|
+
autoplay?: number | undefined;
|
|
1945
1945
|
transition?: import('./elements/structure/Carousel/CarouselContext').CarouselTransition | undefined;
|
|
1946
1946
|
itemKey?: string | undefined;
|
|
1947
1947
|
}>;
|
|
@@ -4221,6 +4221,7 @@ export declare const defaultElements: {
|
|
|
4221
4221
|
readonly pagination: readonly string[];
|
|
4222
4222
|
};
|
|
4223
4223
|
readonly sourceType: "apiContainer";
|
|
4224
|
+
readonly serverTemplates: readonly ["notFound"];
|
|
4224
4225
|
readonly triggers: {
|
|
4225
4226
|
readonly onApiError: {
|
|
4226
4227
|
readonly action: "onApiError";
|
|
@@ -4384,25 +4385,25 @@ export declare const defaultElements: {
|
|
|
4384
4385
|
headers?: Record<string, string> | undefined;
|
|
4385
4386
|
notFound?: string | undefined;
|
|
4386
4387
|
subType?: "div" | "header" | "footer" | "nav" | "main" | "section" | "article" | "aside" | "address" | "figure" | "" | undefined;
|
|
4388
|
+
credentials?: RequestCredentials | undefined;
|
|
4389
|
+
staleTime?: number | string | undefined;
|
|
4390
|
+
gcTime?: number | string | undefined;
|
|
4391
|
+
pageParam?: string | undefined;
|
|
4387
4392
|
query?: string | undefined;
|
|
4388
4393
|
accessToken?: string | undefined;
|
|
4389
4394
|
mockData?: (Record<string, unknown> | string) | undefined;
|
|
4390
|
-
|
|
4395
|
+
singleRecord?: boolean | undefined;
|
|
4396
|
+
pagination?: import('./elements/provider/ApiContainer/hooks/useProviderPagination').ProviderPagination | undefined;
|
|
4397
|
+
renderWhileLoading?: boolean | undefined;
|
|
4398
|
+
loadingSlot?: string | undefined;
|
|
4399
|
+
refreshSeconds?: number | string | undefined;
|
|
4391
4400
|
connector?: string | undefined;
|
|
4392
4401
|
limit?: string | undefined;
|
|
4393
|
-
singleRecord?: boolean | undefined;
|
|
4394
4402
|
filters?: {
|
|
4395
4403
|
field: string;
|
|
4396
4404
|
operator: string;
|
|
4397
4405
|
value: string;
|
|
4398
4406
|
}[] | undefined;
|
|
4399
|
-
pagination?: import('./elements/provider/ApiContainer/hooks/useProviderPagination').ProviderPagination | undefined;
|
|
4400
|
-
pageParam?: string | undefined;
|
|
4401
|
-
renderWhileLoading?: boolean | undefined;
|
|
4402
|
-
loadingSlot?: string | undefined;
|
|
4403
|
-
staleTime?: number | string | undefined;
|
|
4404
|
-
gcTime?: number | string | undefined;
|
|
4405
|
-
refreshSeconds?: number | string | undefined;
|
|
4406
4407
|
}>>;
|
|
4407
4408
|
channel: {
|
|
4408
4409
|
(props: import('./Element/hocs/withElement').WithElementProps<import('./elements/provider/Channel/Channel').ChannelProps>): import('react').JSX.Element;
|
|
@@ -4425,6 +4426,7 @@ export declare const defaultElements: {
|
|
|
4425
4426
|
readonly from: "";
|
|
4426
4427
|
readonly user: "";
|
|
4427
4428
|
readonly at: "";
|
|
4429
|
+
readonly echo: false;
|
|
4428
4430
|
};
|
|
4429
4431
|
};
|
|
4430
4432
|
readonly onJoin: {
|
|
@@ -4467,6 +4469,11 @@ export declare const defaultElements: {
|
|
|
4467
4469
|
readonly defaultValue: "";
|
|
4468
4470
|
readonly type: "text";
|
|
4469
4471
|
};
|
|
4472
|
+
readonly echo: {
|
|
4473
|
+
readonly label: "Heard on this page too";
|
|
4474
|
+
readonly defaultValue: false;
|
|
4475
|
+
readonly type: "boolean";
|
|
4476
|
+
};
|
|
4470
4477
|
};
|
|
4471
4478
|
};
|
|
4472
4479
|
readonly setPresence: {
|
|
@@ -4535,9 +4542,9 @@ export declare const defaultElements: {
|
|
|
4535
4542
|
};
|
|
4536
4543
|
} & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
|
|
4537
4544
|
subType?: "" | "div" | "section" | "aside" | "main" | undefined;
|
|
4538
|
-
topic?: string | undefined;
|
|
4539
4545
|
grant?: string | undefined;
|
|
4540
4546
|
presence?: unknown;
|
|
4547
|
+
topic?: string | undefined;
|
|
4541
4548
|
keep?: number | string | undefined;
|
|
4542
4549
|
}>>;
|
|
4543
4550
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { RealtimeMessage } from '@plitzi/sdk-shared';
|
|
1
|
+
import { RealtimeMessage, RealtimePublishOptions } from '@plitzi/sdk-shared';
|
|
2
2
|
import { RealtimeMember } from '@plitzi/sdk-shared/realtime';
|
|
3
3
|
export type UseChannelOptions = {
|
|
4
4
|
/**
|
|
@@ -20,7 +20,8 @@ export type ChannelHandle = {
|
|
|
20
20
|
/** This page's name on the channel — the `from` of what it sends. */
|
|
21
21
|
me: string | undefined;
|
|
22
22
|
members: RealtimeMember[];
|
|
23
|
-
|
|
23
|
+
/** Heard by every other page on the topic — and by this one too with `{ echo: true }`, once the server took it. */
|
|
24
|
+
publish: (type: string, data: unknown, options?: RealtimePublishOptions) => Promise<boolean>;
|
|
24
25
|
setPresence: (state: unknown) => void;
|
|
25
26
|
};
|
|
26
27
|
/**
|
|
@@ -31,5 +32,5 @@ export type ChannelHandle = {
|
|
|
31
32
|
* re-render the component sixty times a second. Closed — no connection, no members — where the page has no server to
|
|
32
33
|
* connect to (the builder, an embed), and on the server.
|
|
33
34
|
*/
|
|
34
|
-
declare const useChannel: (
|
|
35
|
+
declare const useChannel: (asked: string | undefined, { grant, presence, onMessage, onJoin, onLeave }?: UseChannelOptions) => ChannelHandle;
|
|
35
36
|
export default useChannel;
|
|
@@ -1,57 +1,57 @@
|
|
|
1
1
|
import { useCallback as e, useEffect as t, useMemo as n, useRef as r, useState as i } from "react";
|
|
2
2
|
import { useCommonStore as a } from "@plitzi/sdk-shared/store";
|
|
3
|
-
import { REVOKED_TYPE as o,
|
|
3
|
+
import { REVOKED_TYPE as o, isValidTopic as s, matchChannel as c, realtimeClientFor as l, trackPresence as u } from "@plitzi/sdk-shared/realtime";
|
|
4
4
|
//#region src/realtime/useChannel.ts
|
|
5
|
-
var
|
|
6
|
-
let [
|
|
7
|
-
onMessage:
|
|
8
|
-
onJoin:
|
|
9
|
-
onLeave:
|
|
5
|
+
var d = (d, { grant: f, presence: p, onMessage: m, onJoin: h, onLeave: g } = {}) => {
|
|
6
|
+
let [_] = a("schema.settings.channels"), v = d && (_ ? c(d, _) : s(d)) ? d : void 0, [y] = a("realtime.endpoint"), [b] = a("realtime.transport"), x = n(() => y && typeof window < "u" ? l(y, b) : void 0, [y, b]), [S, C] = i(!1), [w, T] = i([]), E = r(void 0), D = r({
|
|
7
|
+
onMessage: m,
|
|
8
|
+
onJoin: h,
|
|
9
|
+
onLeave: g
|
|
10
10
|
});
|
|
11
11
|
t(() => {
|
|
12
|
-
|
|
13
|
-
onMessage:
|
|
14
|
-
onJoin:
|
|
15
|
-
onLeave:
|
|
12
|
+
D.current = {
|
|
13
|
+
onMessage: m,
|
|
14
|
+
onJoin: h,
|
|
15
|
+
onLeave: g
|
|
16
16
|
};
|
|
17
17
|
}), t(() => {
|
|
18
|
-
|
|
18
|
+
x && v && f && x.grant(v, f);
|
|
19
19
|
}, [
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
20
|
+
x,
|
|
21
|
+
v,
|
|
22
|
+
f
|
|
23
23
|
]), t(() => {
|
|
24
|
-
if (!
|
|
25
|
-
let e =
|
|
26
|
-
onChange:
|
|
24
|
+
if (!x || !v) return;
|
|
25
|
+
let e = u(x, v, {
|
|
26
|
+
onChange: T,
|
|
27
27
|
onMessage: (e) => {
|
|
28
|
-
e.type === o && e.from === "server" &&
|
|
28
|
+
e.type === o && e.from === "server" && C(!1), D.current.onMessage?.(e);
|
|
29
29
|
},
|
|
30
|
-
onArrive: (e) =>
|
|
31
|
-
onDepart: (e) =>
|
|
30
|
+
onArrive: (e) => D.current.onJoin?.(e),
|
|
31
|
+
onDepart: (e) => D.current.onLeave?.(e)
|
|
32
32
|
});
|
|
33
|
-
|
|
34
|
-
let t =
|
|
33
|
+
E.current = e, C(x.status === "open" && !x.refusal(v));
|
|
34
|
+
let t = x.onStatus((e) => C(e === "open" && !x.refusal(v)));
|
|
35
35
|
return () => {
|
|
36
|
-
t(), e.stop(),
|
|
36
|
+
t(), e.stop(), E.current = void 0, T([]), C(!1);
|
|
37
37
|
};
|
|
38
|
-
}, [
|
|
39
|
-
let
|
|
38
|
+
}, [x, v]);
|
|
39
|
+
let O = p === void 0 ? void 0 : JSON.stringify(p);
|
|
40
40
|
t(() => {
|
|
41
|
-
|
|
41
|
+
O !== void 0 && E.current?.set(JSON.parse(O));
|
|
42
42
|
}, [
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
43
|
+
O,
|
|
44
|
+
x,
|
|
45
|
+
v
|
|
46
46
|
]);
|
|
47
|
-
let
|
|
47
|
+
let k = e((e, t, n) => x && v ? x.publish(v, e, t, n) : Promise.resolve(!1), [x, v]), A = e((e) => E.current?.set(e), []);
|
|
48
48
|
return {
|
|
49
|
-
connected:
|
|
50
|
-
me:
|
|
51
|
-
members:
|
|
52
|
-
publish:
|
|
53
|
-
setPresence:
|
|
49
|
+
connected: S,
|
|
50
|
+
me: S ? x?.me : void 0,
|
|
51
|
+
members: w,
|
|
52
|
+
publish: k,
|
|
53
|
+
setPresence: A
|
|
54
54
|
};
|
|
55
55
|
};
|
|
56
56
|
//#endregion
|
|
57
|
-
export {
|
|
57
|
+
export { d as default };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@plitzi/sdk-elements",
|
|
3
|
-
"version": "0.38.
|
|
3
|
+
"version": "0.38.11",
|
|
4
4
|
"license": "AGPL-3.0",
|
|
5
5
|
"files": [
|
|
6
6
|
"dist"
|
|
@@ -798,6 +798,10 @@
|
|
|
798
798
|
"types": "./dist/elements/internal/Page/Page.d.ts",
|
|
799
799
|
"import": "./dist/elements/internal/Page/Page.mjs"
|
|
800
800
|
},
|
|
801
|
+
"./elements/internal/Page/PageHead": {
|
|
802
|
+
"types": "./dist/elements/internal/Page/PageHead.d.ts",
|
|
803
|
+
"import": "./dist/elements/internal/Page/PageHead.mjs"
|
|
804
|
+
},
|
|
801
805
|
"./elements/internal/Page/Settings": {
|
|
802
806
|
"types": "./dist/elements/internal/Page/Settings.d.ts",
|
|
803
807
|
"import": "./dist/elements/internal/Page/Settings.mjs"
|
|
@@ -1370,13 +1374,13 @@
|
|
|
1370
1374
|
"dependencies": {
|
|
1371
1375
|
"@dr.pogodin/react-helmet": "^3.3.2",
|
|
1372
1376
|
"@plitzi/nexus": "^1.4.0",
|
|
1373
|
-
"@plitzi/plitzi-ui": "^1.6.
|
|
1374
|
-
"@plitzi/sdk-auth": "0.38.
|
|
1375
|
-
"@plitzi/sdk-event-bridge": "0.38.
|
|
1376
|
-
"@plitzi/sdk-interactions": "0.38.
|
|
1377
|
-
"@plitzi/sdk-navigation": "0.38.
|
|
1378
|
-
"@plitzi/sdk-schema": "0.38.
|
|
1379
|
-
"@plitzi/sdk-shared": "0.38.
|
|
1377
|
+
"@plitzi/plitzi-ui": "^1.6.33",
|
|
1378
|
+
"@plitzi/sdk-auth": "0.38.11",
|
|
1379
|
+
"@plitzi/sdk-event-bridge": "0.38.11",
|
|
1380
|
+
"@plitzi/sdk-interactions": "0.38.11",
|
|
1381
|
+
"@plitzi/sdk-navigation": "0.38.11",
|
|
1382
|
+
"@plitzi/sdk-schema": "0.38.11",
|
|
1383
|
+
"@plitzi/sdk-shared": "0.38.11",
|
|
1380
1384
|
"clsx": "^2.1.1",
|
|
1381
1385
|
"immer": "^11.1.21",
|
|
1382
1386
|
"react-markdown": "^10.1.0",
|