@nascentdigital/funnel-ui 4.6.7 → 5.0.1
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/client/fields/EmbeddedVideo/EmbeddedVideo.d.ts +2 -2
- package/dist/client/fields/EmbeddedVideo/EmbeddedVideo.js +3 -3
- package/dist/client/fields/EmbeddedVideo/vimeo/VimeoVideo.d.ts +3 -3
- package/dist/client/fields/EmbeddedVideo/vimeo/VimeoVideo.js +4 -3
- package/dist/client/fields/EmbeddedVideo/youtube/YoutubeVideo.d.ts +3 -3
- package/dist/client/fields/EmbeddedVideo/youtube/YoutubeVideo.js +4 -3
- package/dist/client/fields/LazyVideo.d.ts +5 -1
- package/dist/client/fields/LazyVideo.js +6 -4
- package/dist/client/hooks/useTouch.js +1 -0
- package/dist/client/interaction/paginator/Paginator.js +0 -1
- package/dist/server/blocks/Block.d.ts +82 -14
- package/dist/server/blocks/Block.js +780 -60
- package/dist/server/blocks/MediaLayout.d.ts +23 -4
- package/dist/server/blocks/MediaLayout.js +2 -12
- package/dist/server/blocks/RelatedPages.js +4 -4
- package/dist/server/fields/Media.d.ts +50 -22
- package/dist/server/fields/Media.js +73 -46
- package/dist/server/fields/Visual.d.ts +6 -2
- package/dist/server/fields/Visual.js +9 -5
- package/dist/server/index.d.ts +1 -0
- package/dist/server/index.js +1 -0
- package/dist/server/layouts/accordion/Accordion.d.ts +21 -0
- package/dist/server/layouts/accordion/Accordion.js +66 -0
- package/dist/server/layouts/accordion/AccordionContainer.d.ts +5 -0
- package/dist/server/layouts/accordion/AccordionContainer.js +18 -0
- package/dist/server/layouts/accordion/AccordionContext.d.ts +7 -0
- package/dist/server/layouts/accordion/AccordionContext.js +7 -0
- package/dist/server/layouts/accordion/AccordionExpander.d.ts +9 -0
- package/dist/server/layouts/accordion/AccordionExpander.js +72 -0
- package/dist/server/layouts/accordion/AccordionItem.d.ts +8 -0
- package/dist/server/layouts/accordion/AccordionItem.js +22 -0
- package/dist/server/layouts/accordion/AccordionLayout.d.ts +7 -0
- package/dist/server/layouts/accordion/AccordionLayout.js +26 -0
- package/dist/server/layouts/accordion/AccordionOptions.d.ts +3 -0
- package/dist/server/layouts/accordion/AccordionOptions.js +2 -0
- package/dist/server/layouts/accordion/index.d.ts +3 -0
- package/dist/server/layouts/accordion/index.js +19 -0
- package/dist/server/layouts/accordion/useAccordion.d.ts +1 -0
- package/dist/server/layouts/accordion/useAccordion.js +34 -0
- package/dist/server/layouts/index.d.ts +2 -1
- package/dist/server/layouts/index.js +2 -1
- package/dist/server/panels/BlockPanel.d.ts +14 -80
- package/dist/server/panels/BlockPanel.js +46 -707
- package/dist/server/panels/ListPanel.js +6 -3
- package/dist/server/panels/MessagePanel.js +33 -33
- package/dist/server/panels/VisualPanel.d.ts +58 -10
- package/dist/server/panels/VisualPanel.js +155 -79
- package/dist/server/schema/ListPanelLayout.d.ts +1 -0
- package/dist/server/schema/ListPanelLayout.js +1 -0
- package/dist/styles/blocks/Block-layout.css +81 -80
- package/dist/styles/blocks/Editorial.css +2 -2
- package/dist/styles/blocks/Form.css +2 -2
- package/dist/styles/blocks/MediaLayout.css +1 -1
- package/dist/styles/components/container.css +3 -24
- package/dist/styles/layouts/Accordion.css +29 -0
- package/dist/styles/layouts/_index.css +2 -1
- package/dist/styles/panels/VisualPanel.css +2 -1
- package/package.json +2 -2
|
@@ -6,17 +6,17 @@ const react_1 = require("react");
|
|
|
6
6
|
const vimeo_1 = require("./vimeo");
|
|
7
7
|
const youtube_1 = require("./youtube");
|
|
8
8
|
// component
|
|
9
|
-
exports.EmbeddedVideo = (0, react_1.forwardRef)(function EmbeddedVideo({ className, video, language,
|
|
9
|
+
exports.EmbeddedVideo = (0, react_1.forwardRef)(function EmbeddedVideo({ className, video, language, controls = true, autoPlay = false, muted = false }, ref) {
|
|
10
10
|
// skip if there's no video
|
|
11
11
|
if (!video) {
|
|
12
12
|
return null;
|
|
13
13
|
}
|
|
14
14
|
// render youtube
|
|
15
15
|
else if (video.type === 'youtube') {
|
|
16
|
-
return ((0, jsx_runtime_1.jsx)(youtube_1.YoutubeVideo, { ref: ref, className: className, video: video, language: language,
|
|
16
|
+
return ((0, jsx_runtime_1.jsx)(youtube_1.YoutubeVideo, { ref: ref, className: className, video: video, language: language, controls: controls, autoPlay: autoPlay, muted: muted }));
|
|
17
17
|
}
|
|
18
18
|
// render vimeo
|
|
19
19
|
else {
|
|
20
|
-
return ((0, jsx_runtime_1.jsx)(vimeo_1.VimeoVideo, { ref: ref, className: className, video: video, language: language,
|
|
20
|
+
return ((0, jsx_runtime_1.jsx)(vimeo_1.VimeoVideo, { ref: ref, className: className, video: video, language: language, controls: controls, autoPlay: autoPlay, muted: muted }));
|
|
21
21
|
}
|
|
22
22
|
});
|
|
@@ -6,8 +6,8 @@ export declare namespace VimeoVideo {
|
|
|
6
6
|
className?: string;
|
|
7
7
|
video: Schema.EmbeddedVideoField.Value.Vimeo;
|
|
8
8
|
language?: Language;
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
9
|
+
controls: boolean;
|
|
10
|
+
autoPlay: boolean;
|
|
11
|
+
muted: boolean;
|
|
12
12
|
};
|
|
13
13
|
}
|
|
@@ -10,11 +10,12 @@ const react_1 = require("react");
|
|
|
10
10
|
const hooks_1 = require("../../../hooks");
|
|
11
11
|
const VimeoPlayer_1 = require("./VimeoPlayer");
|
|
12
12
|
// component
|
|
13
|
-
exports.VimeoVideo = (0, react_1.forwardRef)(function VimeoVideo({ className, video, language = 'en',
|
|
13
|
+
exports.VimeoVideo = (0, react_1.forwardRef)(function VimeoVideo({ className, video, language = 'en', controls, autoPlay, muted }, ref) {
|
|
14
14
|
// bind state
|
|
15
15
|
const { videoId, thumbUrl, hash } = video;
|
|
16
16
|
const elementId = (0, react_1.useId)();
|
|
17
17
|
const touch = (0, hooks_1.useTouch)();
|
|
18
|
+
const background = autoPlay;
|
|
18
19
|
const player = (0, react_1.useMemo)(() => new VimeoPlayer_1.VimeoPlayer({ elementId, videoId, hash, language, muted, background }), [elementId, videoId, hash, language, muted, background]);
|
|
19
20
|
const { state, ready, started } = player;
|
|
20
21
|
// bind ref
|
|
@@ -55,6 +56,6 @@ exports.VimeoVideo = (0, react_1.forwardRef)(function VimeoVideo({ className, vi
|
|
|
55
56
|
'nd-VimeoPlayer-ready': ready,
|
|
56
57
|
'nd-VimeoPlayer-started': started,
|
|
57
58
|
'nd-VimeoPlayer-playing': state === 'playing',
|
|
58
|
-
'nd-VimeoPlayer-noControls':
|
|
59
|
-
}), children: (0, jsx_runtime_1.jsxs)("div", { className: "nd-VimeoPlayer-container", children: [(0, jsx_runtime_1.jsx)("img", { className: "nd-VimeoPlayer-thumbnail", src: thumbUrl, alt: "Video thumbnail", draggable: false, onClick:
|
|
59
|
+
'nd-VimeoPlayer-noControls': !controls || background
|
|
60
|
+
}), children: (0, jsx_runtime_1.jsxs)("div", { className: "nd-VimeoPlayer-container", children: [(0, jsx_runtime_1.jsx)("img", { className: "nd-VimeoPlayer-thumbnail", src: thumbUrl, alt: "Video thumbnail", draggable: false, onClick: !controls || background ? undefined : onOverlayClick }), (0, jsx_runtime_1.jsx)("div", { id: elementId, className: "nd-VimeoPlayer-player" })] }) }));
|
|
60
61
|
});
|
|
@@ -6,8 +6,8 @@ export declare namespace YoutubeVideo {
|
|
|
6
6
|
className?: string;
|
|
7
7
|
video: Schema.EmbeddedVideoField.Value.Youtube;
|
|
8
8
|
language?: Language;
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
9
|
+
controls: boolean;
|
|
10
|
+
autoPlay: boolean;
|
|
11
|
+
muted: boolean;
|
|
12
12
|
};
|
|
13
13
|
}
|
|
@@ -11,11 +11,12 @@ const hooks_1 = require("../../../hooks");
|
|
|
11
11
|
const EmbeddedVideoContext_1 = require("../EmbeddedVideoContext");
|
|
12
12
|
const YoutubePlayer_1 = require("./YoutubePlayer");
|
|
13
13
|
// component
|
|
14
|
-
exports.YoutubeVideo = (0, react_1.forwardRef)(function YoutubeVideo({ className, video, language = 'en',
|
|
14
|
+
exports.YoutubeVideo = (0, react_1.forwardRef)(function YoutubeVideo({ className, video, language = 'en', controls, autoPlay, muted }, ref) {
|
|
15
15
|
// bind state
|
|
16
16
|
const { videoId, thumbUrl } = video;
|
|
17
17
|
const elementId = (0, react_1.useId)();
|
|
18
18
|
const { youtubeReady, youtubeHack } = (0, react_1.useContext)(EmbeddedVideoContext_1.EmbeddedVideoContext);
|
|
19
|
+
const background = autoPlay;
|
|
19
20
|
const player = (0, react_1.useMemo)(() => new YoutubePlayer_1.YoutubePlayer({ elementId, videoId, language, muted, background }), [elementId, videoId, language, muted, background]);
|
|
20
21
|
const touch = (0, hooks_1.useTouch)();
|
|
21
22
|
const { state, ready, started } = player;
|
|
@@ -66,6 +67,6 @@ exports.YoutubeVideo = (0, react_1.forwardRef)(function YoutubeVideo({ className
|
|
|
66
67
|
'nd-YoutubePlayer-ready': ready,
|
|
67
68
|
'nd-YoutubePlayer-started': started,
|
|
68
69
|
'nd-YoutubePlayer-playing': state === 'playing',
|
|
69
|
-
'nd-YoutubePlayer-noControls':
|
|
70
|
-
}), children: (0, jsx_runtime_1.jsxs)("div", { className: "nd-YoutubePlayer-container", children: [(0, jsx_runtime_1.jsx)("img", { className: "nd-YoutubePlayer-thumbnail", src: thumbUrl, alt: "Video thumbnail", draggable: false, onClick:
|
|
70
|
+
'nd-YoutubePlayer-noControls': !controls || background
|
|
71
|
+
}), children: (0, jsx_runtime_1.jsxs)("div", { className: "nd-YoutubePlayer-container", children: [(0, jsx_runtime_1.jsx)("img", { className: "nd-YoutubePlayer-thumbnail", src: thumbUrl, alt: "Video thumbnail", draggable: false, onClick: !controls || background ? undefined : onOverlayClick }), (0, jsx_runtime_1.jsx)("div", { id: elementId })] }) }));
|
|
71
72
|
});
|
|
@@ -1,9 +1,13 @@
|
|
|
1
1
|
import { Schema } from '@nascentdigital/funnel-core';
|
|
2
2
|
import { HTMLAttributes } from 'react';
|
|
3
|
-
export declare function LazyVideo({ className, video: asset, poster, ...props }: LazyVideo.Props): import("react/jsx-runtime").JSX.Element | null;
|
|
3
|
+
export declare function LazyVideo({ className, video: asset, poster, controls, autoPlay, loop, muted, ...props }: LazyVideo.Props): import("react/jsx-runtime").JSX.Element | null;
|
|
4
4
|
export declare namespace LazyVideo {
|
|
5
5
|
type Props = Omit<HTMLAttributes<HTMLImageElement> & HTMLAttributes<HTMLVideoElement>, 'children'> & {
|
|
6
6
|
video?: Schema.AssetField.LinkedValue.Video;
|
|
7
7
|
poster?: string;
|
|
8
|
+
controls?: boolean;
|
|
9
|
+
autoPlay?: boolean;
|
|
10
|
+
loop?: boolean;
|
|
11
|
+
muted?: boolean;
|
|
8
12
|
};
|
|
9
13
|
}
|
|
@@ -23,7 +23,7 @@ const react_2 = require("react");
|
|
|
23
23
|
const hooks_1 = require("../hooks");
|
|
24
24
|
// component
|
|
25
25
|
function LazyVideo(_a) {
|
|
26
|
-
var { className, video: asset, poster } = _a, props = __rest(_a, ["className", "video", "poster"]);
|
|
26
|
+
var { className, video: asset, poster, controls = true, autoPlay = false, loop = true, muted = true } = _a, props = __rest(_a, ["className", "video", "poster", "controls", "autoPlay", "loop", "muted"]);
|
|
27
27
|
// bind state + refs
|
|
28
28
|
const { type, url, metadata: { crop, dimensions: { width, height } = {}, blurHash } = {} } = asset !== null && asset !== void 0 ? asset : {};
|
|
29
29
|
const [state, setState] = (0, react_2.useState)('uninitialized');
|
|
@@ -65,7 +65,9 @@ function LazyVideo(_a) {
|
|
|
65
65
|
// play/pause video based on visibility
|
|
66
66
|
case 'ready': {
|
|
67
67
|
if (videoVisible) {
|
|
68
|
-
|
|
68
|
+
if (autoPlay) {
|
|
69
|
+
videoProxy === null || videoProxy === void 0 ? void 0 : videoProxy.play({ loop: true }).catch(console.error);
|
|
70
|
+
}
|
|
69
71
|
}
|
|
70
72
|
else {
|
|
71
73
|
videoProxy === null || videoProxy === void 0 ? void 0 : videoProxy.pause().catch(console.error);
|
|
@@ -73,7 +75,7 @@ function LazyVideo(_a) {
|
|
|
73
75
|
break;
|
|
74
76
|
}
|
|
75
77
|
}
|
|
76
|
-
}, [state, videoReady, videoVisible, videoProxy]);
|
|
78
|
+
}, [state, videoReady, videoVisible, videoProxy, autoPlay]);
|
|
77
79
|
// load video when available
|
|
78
80
|
(0, react_2.useEffect)(() => {
|
|
79
81
|
// skip if not ready to load
|
|
@@ -95,6 +97,6 @@ function LazyVideo(_a) {
|
|
|
95
97
|
'--_nd-visual-native-width': width ? `${width}` : '1',
|
|
96
98
|
'--_nd-visual-native-height': height ? `${height}` : '1'
|
|
97
99
|
}, children: (0, jsx_runtime_1.jsxs)("div", { className: "nd-LazyVideo-content", children: [blurHash &&
|
|
98
|
-
(0, jsx_runtime_1.jsx)("canvas", { ref: blurCanvasRef, className: "nd-LazyVideo-blurHash", width: 32, height: 32, draggable: false }), (0, jsx_runtime_1.jsxs)("video", { ref: videoRef, className: (0, classnames_1.default)('nd-LazyVideo-video'), preload: "none",
|
|
100
|
+
(0, jsx_runtime_1.jsx)("canvas", { ref: blurCanvasRef, className: "nd-LazyVideo-blurHash", width: 32, height: 32, draggable: false }), (0, jsx_runtime_1.jsxs)("video", { ref: videoRef, className: (0, classnames_1.default)('nd-LazyVideo-video'), preload: "none", controls: controls, muted: muted, loop: loop, playsInline: true, poster: poster, children: [state !== 'uninitialized' &&
|
|
99
101
|
(0, jsx_runtime_1.jsx)("source", { src: url, type: type }), "Your browser does not support the video content."] })] }) })));
|
|
100
102
|
}
|
|
@@ -56,7 +56,6 @@ function Paginator({ manualLoad = false, loadOffset, query, pageSize, pageOffset
|
|
|
56
56
|
onLoadMore().catch(e => console.error('[Paginator] failed to fetch after reset', e));
|
|
57
57
|
}
|
|
58
58
|
}, [onLoadMore, wasReset]);
|
|
59
|
-
console.debug('[Paginator] rendering with state', state);
|
|
60
59
|
// render
|
|
61
60
|
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [items.length === 0 && state === 'complete' && emptyElement, items.map((item, index) => (0, jsx_runtime_1.jsx)(ItemElement, { item: item }, index)), state !== 'complete' &&
|
|
62
61
|
(0, jsx_runtime_1.jsx)(Loader_1.Loader, { className: "nd-Paginator-loader", state: state, action: state === 'error'
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { BlockLayout, Schema, Transform } from '@nascentdigital/funnel-core';
|
|
2
|
-
import { FunctionComponent,
|
|
2
|
+
import { FunctionComponent, ReactNode } from 'react';
|
|
3
3
|
import { HTMLBlockElement } from '../../types';
|
|
4
|
-
import {
|
|
5
|
-
import { BlockConfig, ListPanelLayout } from '../schema';
|
|
4
|
+
import { ListPanel, MessagePanel, VisualPanel } from '../panels';
|
|
5
|
+
import { BlockConfig, ItemAlignment, ListPanelLayout, PanelLayout, RowRatio, SlotVariation } from '../schema';
|
|
6
6
|
export declare function Block({ className, config, layout, renderPanel, ...props }: Block.Props): import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
export declare namespace Block {
|
|
8
8
|
type Props = HTMLBlockElement<'div'> & {
|
|
@@ -14,9 +14,8 @@ export declare namespace Block {
|
|
|
14
14
|
className?: string;
|
|
15
15
|
panel: BlockLayout.Panel;
|
|
16
16
|
};
|
|
17
|
-
function create<TBlockId extends string, TMessage extends boolean | undefined = undefined, TVisual extends boolean | undefined = undefined, TList extends Schema.ListField | undefined = undefined, TExtend extends Schema.Block.Config = Schema.Block.Config, TItemProps = any>(args: Create.Args<TBlockId, TMessage, TVisual, TList, TExtend, TItemProps>): Create.Result<TBlockId, TMessage, TVisual, TList, TExtend, TItemProps>;
|
|
18
17
|
namespace Create {
|
|
19
|
-
type Args<TBlockId extends string, TMessage extends boolean | undefined, TVisual extends boolean | undefined, TList extends Schema.ListField | undefined, TExtend extends Schema.Block.Config, TItemProps> = {
|
|
18
|
+
type Args<TBlockId extends string, TMessage extends boolean | undefined, TVisual extends boolean | undefined, TList extends Schema.Optional.Maybe<Schema.ListField> | undefined, TExtend extends Schema.Block.Config, TItemProps> = {
|
|
20
19
|
id: TBlockId;
|
|
21
20
|
name: string;
|
|
22
21
|
version: number;
|
|
@@ -27,34 +26,34 @@ export declare namespace Block {
|
|
|
27
26
|
list?: TList;
|
|
28
27
|
extendConfigSchema?: TExtend;
|
|
29
28
|
};
|
|
30
|
-
type Result<TBlockId extends string, TMessage extends boolean | undefined, TVisual extends boolean | undefined, TList extends Schema.ListField | undefined, TExtend extends Schema.Block.Config, TItemProps> = {
|
|
29
|
+
type Result<TBlockId extends string, TMessage extends boolean | undefined, TVisual extends boolean | undefined, TList extends Schema.Optional.Maybe<Schema.ListField> | undefined, TExtend extends Schema.Block.Config, TItemProps> = {
|
|
31
30
|
Component: FunctionComponent<Result.ComponentProps<TBlockId, TMessage, TVisual, TList, TExtend, TItemProps>>;
|
|
32
31
|
schema: Result.Schema<TBlockId, TMessage, TVisual, TList, TExtend>;
|
|
33
32
|
};
|
|
34
33
|
namespace Result {
|
|
35
|
-
type FieldsSchema<TMessage extends boolean | undefined, TVisual extends boolean | undefined, TList extends Schema.ListField | undefined> = ((TMessage extends true ? typeof MessagePanel.Fields.all : {}) & (TVisual extends true ? typeof VisualPanel.Fields.all : {}) & (TList extends Schema.ListField ? {
|
|
34
|
+
type FieldsSchema<TMessage extends boolean | undefined, TVisual extends boolean | undefined, TList extends Schema.Optional.Maybe<Schema.ListField> | undefined> = ((TMessage extends true ? typeof MessagePanel.Fields.all : {}) & (TVisual extends true ? typeof VisualPanel.Fields.all : {}) & (TList extends Schema.Optional.Maybe<Schema.ListField> ? {
|
|
36
35
|
list: TList;
|
|
37
36
|
} : {}));
|
|
38
|
-
type ConfigSchema<TMessage extends boolean | undefined, TVisual extends boolean | undefined, TList extends Schema.ListField | undefined, TExtend extends Schema.Block.Config, TFields extends FieldsSchema<TMessage, TVisual, TList> = FieldsSchema<TMessage, TVisual, TList>> =
|
|
39
|
-
type Schema<TBlockId extends string, TMessage extends boolean | undefined, TVisual extends boolean | undefined, TList extends Schema.ListField | undefined, TExtend extends Schema.Block.Config> = Schema.Block<TBlockId, FieldsSchema<TMessage, TVisual, TList>, ConfigSchema<TMessage, TVisual, TList, TExtend>>;
|
|
40
|
-
type ComponentProps<TBlockId extends string, TMessage extends boolean | undefined, TVisual extends boolean | undefined, TList extends Schema.ListField | undefined, TExtend extends Schema.Block.Config, TItemProps> = {
|
|
37
|
+
type ConfigSchema<TMessage extends boolean | undefined, TVisual extends boolean | undefined, TList extends Schema.Optional.Maybe<Schema.ListField> | undefined, TExtend extends Schema.Block.Config, TFields extends FieldsSchema<TMessage, TVisual, TList> = FieldsSchema<TMessage, TVisual, TList>> = GetConfigSchema.Result<TFields, TMessage extends true ? 'message' : undefined, TVisual extends true ? 'visual' extends Schema.Fields.CollectionFields.Keys<TFields> ? 'visual' : undefined : undefined, TList extends Schema.Optional.Maybe<Schema.ListField> ? 'list' extends Schema.Fields.ListFields.Keys<TFields> ? 'list' : undefined : undefined, TExtend>;
|
|
38
|
+
type Schema<TBlockId extends string, TMessage extends boolean | undefined, TVisual extends boolean | undefined, TList extends Schema.Optional.Maybe<Schema.ListField> | undefined, TExtend extends Schema.Block.Config> = Schema.Block<TBlockId, FieldsSchema<TMessage, TVisual, TList>, ConfigSchema<TMessage, TVisual, TList, TExtend>>;
|
|
39
|
+
type ComponentProps<TBlockId extends string, TMessage extends boolean | undefined, TVisual extends boolean | undefined, TList extends Schema.Optional.Maybe<Schema.ListField> | undefined, TExtend extends Schema.Block.Config, TItemProps> = {
|
|
41
40
|
className?: string;
|
|
42
41
|
model: Schema.Block.LinkedData<Schema<TBlockId, TMessage, TVisual, TList, TExtend>>;
|
|
43
42
|
} & ((TMessage extends true ? {
|
|
44
43
|
messagePanelProps?: MessagePanel.Props.Configuration;
|
|
45
44
|
} : {}) & (TVisual extends true ? {
|
|
46
45
|
visualPanelProps?: VisualPanel.Props.Configuration;
|
|
47
|
-
} : {}) & (TList extends Schema.ListField ? {
|
|
46
|
+
} : {}) & (TList extends Schema.Optional.Maybe<Schema.ListField<infer TContent>> ? {
|
|
48
47
|
listPanelProps?: ListPanel.Props.Configuration & {
|
|
49
48
|
itemProps?: TItemProps;
|
|
50
49
|
};
|
|
51
|
-
children:
|
|
50
|
+
children: (args: ComponentProps.RenderItemArgs<TContent, TItemProps>) => ReactNode;
|
|
52
51
|
} : {})) & HTMLBlockElement<'div'>;
|
|
53
52
|
namespace ComponentProps {
|
|
54
53
|
type ForMessage = ComponentProps<string, true, undefined, undefined, {}, unknown>;
|
|
55
54
|
type ForVisual = ComponentProps<string, undefined, true, undefined, {}, unknown>;
|
|
56
55
|
type ForList = ComponentProps<string, undefined, undefined, Schema.ListField, {}, any>;
|
|
57
|
-
type RenderItemArgs<TItem extends Schema.ListField.Content, TItemProps> = {
|
|
56
|
+
type RenderItemArgs<TItem extends Schema.ListField.Content, TItemProps = {}> = {
|
|
58
57
|
item: Schema.ListField.LinkedValue.ForItem<TItem>;
|
|
59
58
|
itemProps: TItemProps;
|
|
60
59
|
listLayout: ListPanelLayout;
|
|
@@ -63,5 +62,74 @@ export declare namespace Block {
|
|
|
63
62
|
}
|
|
64
63
|
}
|
|
65
64
|
}
|
|
66
|
-
function
|
|
65
|
+
function create<TBlockId extends string, TMessage extends boolean | undefined = undefined, TVisual extends boolean | undefined = undefined, TList extends Schema.Optional.Maybe<Schema.ListField> | undefined = undefined, TExtend extends Schema.Block.Config = Schema.Block.Config, TItemProps = any>(args: Create.Args<TBlockId, TMessage, TVisual, TList, TExtend, TItemProps>): Create.Result<TBlockId, TMessage, TVisual, TList, TExtend, TItemProps>;
|
|
66
|
+
namespace GetConfigSchema {
|
|
67
|
+
type Key<T extends string> = T | Key.WithLabel<T>;
|
|
68
|
+
namespace Key {
|
|
69
|
+
type WithLabel<T extends string> = {
|
|
70
|
+
key: T;
|
|
71
|
+
name: string;
|
|
72
|
+
};
|
|
73
|
+
type Optional<T extends string | undefined> = T extends string ? Key<T> : undefined;
|
|
74
|
+
function normalize<T extends string>(key: Key<T>): WithLabel<T>;
|
|
75
|
+
}
|
|
76
|
+
type Args<TFields extends Schema.Fields, TMessageKey extends string | undefined, TVisualKey extends Schema.Fields.CollectionFields.Keys<TFields> | undefined, TListKey extends Schema.Fields.ListFields.Keys<TFields> | undefined, TConfigExtended extends Schema.Block.Config> = {
|
|
77
|
+
fields: TFields;
|
|
78
|
+
extend?: TConfigExtended;
|
|
79
|
+
messageKey?: Key.Optional<TMessageKey>;
|
|
80
|
+
visualKey?: Key.Optional<TVisualKey>;
|
|
81
|
+
listKey?: TListKey;
|
|
82
|
+
};
|
|
83
|
+
type Result<TFields extends Schema.Fields, TMessageKey extends string | undefined, TVisualKey extends Schema.Fields.CollectionFields.Keys<TFields> | undefined, TListKey extends Schema.Fields.ListFields.Keys<TFields> | undefined, TConfigExtended extends Schema.Block.Config> = (BlockConfig.Presets.ThemeOnly.Schema & {
|
|
84
|
+
layout: PanelLayout.Schema;
|
|
85
|
+
} & {
|
|
86
|
+
slotVariation: SlotVariation.Schema;
|
|
87
|
+
} & (TMessageKey extends string ? MessagePanel.Config.Entries<TMessageKey> : {}) & (TVisualKey extends Schema.Fields.CollectionFields.Keys<TFields> ? VisualPanel.Config.Entries<TVisualKey> : {}) & (TListKey extends Schema.Fields.ListFields.Keys<TFields> ? ListPanel.Config.Entries<TListKey> : {}) & (TMessageKey extends string ? TVisualKey extends Schema.Fields.CollectionFields.Keys<TFields> ? ({
|
|
88
|
+
contentAlign: ItemAlignment.Vertical.Schema;
|
|
89
|
+
contentSplit: RowRatio.Schema;
|
|
90
|
+
}) : TListKey extends Schema.Fields.ListFields.Keys<TFields> ? ({
|
|
91
|
+
contentAlign: ItemAlignment.Vertical.Schema;
|
|
92
|
+
contentSplit: RowRatio.Schema;
|
|
93
|
+
}) : {} : TVisualKey extends Schema.Fields.CollectionFields.Keys<TFields> ? TListKey extends Schema.Fields.ListFields.Keys<TFields> ? ({
|
|
94
|
+
contentAlign: ItemAlignment.Vertical.Schema;
|
|
95
|
+
contentSplit: RowRatio.Schema;
|
|
96
|
+
}) : {} : {})) & TConfigExtended;
|
|
97
|
+
}
|
|
98
|
+
function getConfigSchema<TFields extends Schema.Fields, TMessageKey extends string | undefined = undefined, TVisualKey extends Schema.Fields.CollectionFields.Keys<TFields> | undefined = undefined, TListKey extends Schema.Fields.ListFields.Keys<TFields> | undefined = undefined, TConfigExtended extends Schema.Block.Config = Schema.Block.Config>({ extend, messageKey: messageKeyRaw, visualKey: visualKeyRaw, listKey: listKeyRaw }: GetConfigSchema.Args<TFields, TMessageKey, TVisualKey, TListKey, TConfigExtended>): GetConfigSchema.Result<TFields, TMessageKey, TVisualKey, TListKey, TConfigExtended>;
|
|
99
|
+
namespace GetConfig {
|
|
100
|
+
type Args<TConfig extends Schema.Block.Config, TFields extends Schema.Fields, TMessageFieldKeys extends Partial<MessagePanel.Fields.Keys> | undefined, TMessageKey extends string | undefined, TVisualKey extends Schema.Fields.CollectionFields.Keys<TFields> | undefined, TListKey extends Schema.Fields.ListFields.Keys<TFields> | undefined> = {
|
|
101
|
+
args: Schema.Block.GetConfig.Args<TConfig, TFields>;
|
|
102
|
+
messageFieldKeys?: TMessageFieldKeys;
|
|
103
|
+
messageKey?: TMessageKey;
|
|
104
|
+
visualKey?: TVisualKey;
|
|
105
|
+
listKey?: TListKey;
|
|
106
|
+
};
|
|
107
|
+
}
|
|
108
|
+
function getConfig<TConfig extends Schema.Block.Config, TFields extends Schema.Fields, TMessageFieldKeys extends Partial<MessagePanel.Fields.Keys> | undefined, TMessageKey extends string | undefined, TVisualKey extends Schema.Fields.CollectionFields.Keys<TFields> | undefined, TListKey extends Schema.Fields.ListFields.Keys<TFields> | undefined>({ args, messageFieldKeys, messageKey, visualKey, listKey }: GetConfig.Args<TConfig, TFields, TMessageFieldKeys, TMessageKey, TVisualKey, TListKey>): Schema.Block.GetConfig.Result<TConfig>;
|
|
109
|
+
namespace GetLayout {
|
|
110
|
+
type Args<TConfig extends Schema.Block.Config, TFields extends Schema.Fields, TMessageFieldKeys extends Partial<MessagePanel.Fields.Keys> | undefined, TMessageKey extends string, TVisualKey extends Schema.Fields.CollectionFields.Keys<TFields>, TListKey extends Schema.Fields.ListFields.Keys<TFields>> = {
|
|
111
|
+
args: Schema.Block.GetLayout.Args<TConfig, TFields>;
|
|
112
|
+
messageFieldKeys?: TMessageFieldKeys;
|
|
113
|
+
messageKey?: TMessageKey;
|
|
114
|
+
visualKey?: TVisualKey;
|
|
115
|
+
listKey?: TListKey;
|
|
116
|
+
};
|
|
117
|
+
}
|
|
118
|
+
function getLayout<TConfig extends Schema.Block.Config, TFields extends Schema.Fields, TMessageFieldKeys extends Partial<MessagePanel.Fields.Keys> | undefined, TMessageKey extends string, TVisualKey extends Schema.Fields.CollectionFields.Keys<TFields>, TListKey extends Schema.Fields.ListFields.Keys<TFields>>({ args, messageFieldKeys, messageKey, visualKey, listKey }: GetLayout.Args<TConfig, TFields, TMessageFieldKeys, TMessageKey, TVisualKey, TListKey>): BlockLayout;
|
|
119
|
+
namespace GetActivePanels {
|
|
120
|
+
type Args<TFields extends Schema.Fields, TMessageFieldKeys extends Partial<MessagePanel.Fields.Keys> | undefined, TMessageKey extends string | undefined, TVisualKey extends Schema.Fields.CollectionFields.Keys<TFields>, TListKey extends Schema.Fields.ListFields.Keys<TFields>> = {
|
|
121
|
+
fields: Partial<Schema.Block.Data.ForFields<TFields>> | Partial<Schema.Block.LinkedData.ForFields<TFields>>;
|
|
122
|
+
messageFieldKeys?: TMessageFieldKeys;
|
|
123
|
+
messageKey?: TMessageKey;
|
|
124
|
+
visualKey?: TVisualKey;
|
|
125
|
+
listKey?: TListKey;
|
|
126
|
+
};
|
|
127
|
+
type Result = {
|
|
128
|
+
message: PanelStatus;
|
|
129
|
+
visual: PanelStatus;
|
|
130
|
+
list: PanelStatus;
|
|
131
|
+
};
|
|
132
|
+
type PanelStatus = 'valid' | 'invalid' | false;
|
|
133
|
+
}
|
|
134
|
+
function getActivePanels<TFields extends Schema.Fields, TMessageFieldKeys extends Partial<MessagePanel.Fields.Keys> | undefined, TMessageKey extends string | undefined, TVisualKey extends Schema.Fields.CollectionFields.Keys<TFields>, TListKey extends Schema.Fields.ListFields.Keys<TFields>>({ fields: fieldsRaw, messageFieldKeys, messageKey, visualKey, listKey }: GetActivePanels.Args<TFields, TMessageFieldKeys, TMessageKey, TVisualKey, TListKey>): GetActivePanels.Result;
|
|
67
135
|
}
|