@xyo-network/react-embed 2.27.27 → 2.27.30
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/components/XyoEmbedPlugin.d.ts +1 -1
- package/dist/cjs/components/XyoEmbedPlugin.d.ts.map +1 -1
- package/dist/cjs/components/XyoEmbedPlugin.js +2 -2
- package/dist/cjs/components/XyoEmbedPlugin.js.map +1 -1
- package/dist/cjs/components/XyoEmbedPluginProps.d.ts +9 -0
- package/dist/cjs/components/XyoEmbedPluginProps.d.ts.map +1 -1
- package/dist/cjs/components/embed-card/EmbedCardHeader.d.ts +4 -0
- package/dist/cjs/components/embed-card/EmbedCardHeader.d.ts.map +1 -0
- package/dist/cjs/components/embed-card/EmbedCardHeader.js +18 -0
- package/dist/cjs/components/embed-card/EmbedCardHeader.js.map +1 -0
- package/dist/cjs/components/embed-card/EmbedPluginContainer.d.ts +1 -4
- package/dist/cjs/components/embed-card/EmbedPluginContainer.d.ts.map +1 -1
- package/dist/cjs/components/embed-card/EmbedPluginContainer.js +7 -9
- package/dist/cjs/components/embed-card/EmbedPluginContainer.js.map +1 -1
- package/dist/cjs/contexts/XyoEmbedPluginContext/Provider.d.ts +2 -6
- package/dist/cjs/contexts/XyoEmbedPluginContext/Provider.d.ts.map +1 -1
- package/dist/cjs/contexts/XyoEmbedPluginContext/Provider.js +13 -2
- package/dist/cjs/contexts/XyoEmbedPluginContext/Provider.js.map +1 -1
- package/dist/cjs/contexts/XyoEmbedPluginContext/State.d.ts +25 -6
- package/dist/cjs/contexts/XyoEmbedPluginContext/State.d.ts.map +1 -1
- package/dist/cjs/types/XyoEmbedPluginProps.d.ts +7 -0
- package/dist/cjs/types/XyoEmbedPluginProps.d.ts.map +1 -0
- package/dist/cjs/types/XyoEmbedPluginProps.js +3 -0
- package/dist/cjs/types/XyoEmbedPluginProps.js.map +1 -0
- package/dist/cjs/types/index.d.ts +2 -0
- package/dist/cjs/types/index.d.ts.map +1 -0
- package/dist/cjs/types/index.js +5 -0
- package/dist/cjs/types/index.js.map +1 -0
- package/dist/docs.json +2 -2
- package/dist/esm/components/XyoEmbedPlugin.d.ts +1 -1
- package/dist/esm/components/XyoEmbedPlugin.d.ts.map +1 -1
- package/dist/esm/components/XyoEmbedPlugin.js +2 -2
- package/dist/esm/components/XyoEmbedPlugin.js.map +1 -1
- package/dist/esm/components/XyoEmbedPluginProps.d.ts +9 -0
- package/dist/esm/components/XyoEmbedPluginProps.d.ts.map +1 -1
- package/dist/esm/components/embed-card/EmbedCardHeader.d.ts +4 -0
- package/dist/esm/components/embed-card/EmbedCardHeader.d.ts.map +1 -0
- package/dist/esm/components/embed-card/EmbedCardHeader.js +12 -0
- package/dist/esm/components/embed-card/EmbedCardHeader.js.map +1 -0
- package/dist/esm/components/embed-card/EmbedPluginContainer.d.ts +1 -4
- package/dist/esm/components/embed-card/EmbedPluginContainer.d.ts.map +1 -1
- package/dist/esm/components/embed-card/EmbedPluginContainer.js +8 -8
- package/dist/esm/components/embed-card/EmbedPluginContainer.js.map +1 -1
- package/dist/esm/contexts/XyoEmbedPluginContext/Provider.d.ts +2 -6
- package/dist/esm/contexts/XyoEmbedPluginContext/Provider.d.ts.map +1 -1
- package/dist/esm/contexts/XyoEmbedPluginContext/Provider.js +13 -2
- package/dist/esm/contexts/XyoEmbedPluginContext/Provider.js.map +1 -1
- package/dist/esm/contexts/XyoEmbedPluginContext/State.d.ts +25 -6
- package/dist/esm/contexts/XyoEmbedPluginContext/State.d.ts.map +1 -1
- package/dist/esm/types/XyoEmbedPluginProps.d.ts +7 -0
- package/dist/esm/types/XyoEmbedPluginProps.d.ts.map +1 -0
- package/dist/esm/types/XyoEmbedPluginProps.js +2 -0
- package/dist/esm/types/XyoEmbedPluginProps.js.map +1 -0
- package/dist/esm/types/index.d.ts +2 -0
- package/dist/esm/types/index.d.ts.map +1 -0
- package/dist/esm/types/index.js +2 -0
- package/dist/esm/types/index.js.map +1 -0
- package/package.json +9 -9
- package/src/components/XyoEmbedPlugin.stories.tsx +17 -2
- package/src/components/XyoEmbedPlugin.tsx +12 -3
- package/src/components/embed-card/EmbedCardHeader.tsx +43 -0
- package/src/components/embed-card/EmbedPluginContainer.tsx +10 -36
- package/src/contexts/XyoEmbedPluginContext/Provider.tsx +20 -9
- package/src/contexts/XyoEmbedPluginContext/State.ts +28 -6
- package/src/types/XyoEmbedPluginProps.ts +8 -0
- package/src/types/index.ts +1 -0
- package/src/components/RenderComponent.tsx +0 -13
- package/src/components/XyoEmbedPluginProps.ts +0 -10
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"XyoEmbedPlugin.d.ts","sourceRoot":"","sources":["../../../src/components/XyoEmbedPlugin.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"XyoEmbedPlugin.d.ts","sourceRoot":"","sources":["../../../src/components/XyoEmbedPlugin.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAA;AAG9C,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA8BxD,CAAA"}
|
|
@@ -7,8 +7,8 @@ const react_shared_1 = require("@xyo-network/react-shared");
|
|
|
7
7
|
const contexts_1 = require("../contexts");
|
|
8
8
|
const embed_card_1 = require("./embed-card");
|
|
9
9
|
const XyoEmbedPlugin = (_a) => {
|
|
10
|
-
var { validateSchema, plugins = [], huri, refreshTitle = '', timestampLabel = 'Data From' } = _a, props = tslib_1.__rest(_a, ["validateSchema", "plugins", "huri", "refreshTitle", "timestampLabel"]);
|
|
11
|
-
return ((0, jsx_runtime_1.jsx)(contexts_1.XyoEmbedPluginProvider, Object.assign({ refreshTitle: refreshTitle, timestampLabel: timestampLabel, plugins: plugins, huri: huri }, { children: (0, jsx_runtime_1.jsx)(contexts_1.ValidatePayloadProvider, Object.assign({ enabled: validateSchema }, { children: (0, jsx_runtime_1.jsx)(react_shared_1.ListModeProvider, { children: (0, jsx_runtime_1.jsx)(embed_card_1.ValidatePlugins, { children: (0, jsx_runtime_1.jsx)(embed_card_1.ValidatePayload, { children: (0, jsx_runtime_1.jsx)(embed_card_1.EmbedPluginContainer, Object.assign({}, props)) }) }) }) })) })));
|
|
10
|
+
var { validateSchema, plugins = [], huri, refreshTitle = '', timestampLabel = 'Data From', hideElementsConfig, embedPluginConfig } = _a, props = tslib_1.__rest(_a, ["validateSchema", "plugins", "huri", "refreshTitle", "timestampLabel", "hideElementsConfig", "embedPluginConfig"]);
|
|
11
|
+
return ((0, jsx_runtime_1.jsx)(contexts_1.XyoEmbedPluginProvider, Object.assign({ refreshTitle: refreshTitle, timestampLabel: timestampLabel, plugins: plugins, huri: huri, embedPluginConfig: embedPluginConfig, hideElementsConfig: hideElementsConfig }, { children: (0, jsx_runtime_1.jsx)(contexts_1.ValidatePayloadProvider, Object.assign({ enabled: validateSchema }, { children: (0, jsx_runtime_1.jsx)(react_shared_1.ListModeProvider, Object.assign({ defaultListMode: embedPluginConfig === null || embedPluginConfig === void 0 ? void 0 : embedPluginConfig.listMode }, { children: (0, jsx_runtime_1.jsx)(embed_card_1.ValidatePlugins, { children: (0, jsx_runtime_1.jsx)(embed_card_1.ValidatePayload, { children: (0, jsx_runtime_1.jsx)(embed_card_1.EmbedPluginContainer, Object.assign({}, props)) }) }) })) })) })));
|
|
12
12
|
};
|
|
13
13
|
exports.XyoEmbedPlugin = XyoEmbedPlugin;
|
|
14
14
|
//# sourceMappingURL=XyoEmbedPlugin.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"XyoEmbedPlugin.js","sourceRoot":"","sources":["../../../src/components/XyoEmbedPlugin.tsx"],"names":[],"mappings":";;;;;AAAA,4DAA4D;AAE5D,0CAA6E;
|
|
1
|
+
{"version":3,"file":"XyoEmbedPlugin.js","sourceRoot":"","sources":["../../../src/components/XyoEmbedPlugin.tsx"],"names":[],"mappings":";;;;;AAAA,4DAA4D;AAE5D,0CAA6E;AAE7E,6CAAqF;AAE9E,MAAM,cAAc,GAAkC,CAAC,EAS7D,EAAE,EAAE;QATyD,EAC5D,cAAc,EACd,OAAO,GAAG,EAAE,EACZ,IAAI,EACJ,YAAY,GAAG,EAAE,EACjB,cAAc,GAAG,WAAW,EAC5B,kBAAkB,EAClB,iBAAiB,OAElB,EADI,KAAK,sBARoD,kHAS7D,CADS;IAER,OAAO,CACL,uBAAC,iCAAsB,kBACrB,YAAY,EAAE,YAAY,EAC1B,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,iBAAiB,EAAE,iBAAiB,EACpC,kBAAkB,EAAE,kBAAkB,gBAEtC,uBAAC,kCAAuB,kBAAC,OAAO,EAAE,cAAc,gBAC9C,uBAAC,+BAAgB,kBAAC,eAAe,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,QAAQ,gBAC5D,uBAAC,4BAAe,cACd,uBAAC,4BAAe,cACd,uBAAC,iCAAoB,oBAAK,KAAK,EAAI,GACnB,GACF,IACD,IACK,IACH,CAC1B,CAAA;AACH,CAAC,CAAA;AA9BY,QAAA,cAAc,kBA8B1B"}
|
|
@@ -1,10 +1,19 @@
|
|
|
1
1
|
import { CardProps } from '@mui/material';
|
|
2
2
|
import { XyoPayloadRenderPlugin } from '@xyo-network/react-payload-plugin';
|
|
3
|
+
export interface EmbedPluginVisibilityConfig {
|
|
4
|
+
hideAvatar?: boolean;
|
|
5
|
+
hideTitle?: boolean;
|
|
6
|
+
hideRefreshButton?: boolean;
|
|
7
|
+
hideTimestamp?: boolean;
|
|
8
|
+
hideCardActions?: boolean;
|
|
9
|
+
hideCardHeader?: boolean;
|
|
10
|
+
}
|
|
3
11
|
export interface XyoEmbedPluginProps extends CardProps {
|
|
4
12
|
plugins?: XyoPayloadRenderPlugin[];
|
|
5
13
|
huri?: string;
|
|
6
14
|
refreshTitle?: string;
|
|
7
15
|
timestampLabel?: string;
|
|
8
16
|
validateSchema?: boolean;
|
|
17
|
+
hideElementsConfig?: EmbedPluginVisibilityConfig;
|
|
9
18
|
}
|
|
10
19
|
//# sourceMappingURL=XyoEmbedPluginProps.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"XyoEmbedPluginProps.d.ts","sourceRoot":"","sources":["../../../src/components/XyoEmbedPluginProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACzC,OAAO,EAAE,sBAAsB,EAAE,MAAM,mCAAmC,CAAA;AAE1E,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD,OAAO,CAAC,EAAE,sBAAsB,EAAE,CAAA;IAClC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"XyoEmbedPluginProps.d.ts","sourceRoot":"","sources":["../../../src/components/XyoEmbedPluginProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACzC,OAAO,EAAE,sBAAsB,EAAE,MAAM,mCAAmC,CAAA;AAE1E,MAAM,WAAW,2BAA2B;IAC1C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB;AAED,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD,OAAO,CAAC,EAAE,sBAAsB,EAAE,CAAA;IAClC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,kBAAkB,CAAC,EAAE,2BAA2B,CAAA;CACjD"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmbedCardHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/embed-card/EmbedCardHeader.tsx"],"names":[],"mappings":";AACA,OAAO,EAAsB,eAAe,EAAe,MAAM,eAAe,CAAA;AAMhF,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAmCrD,CAAA"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.EmbedCardHeader = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
const Refresh_1 = tslib_1.__importDefault(require("@mui/icons-material/Refresh"));
|
|
7
|
+
const material_1 = require("@mui/material");
|
|
8
|
+
const react_flexbox_1 = require("@xylabs/react-flexbox");
|
|
9
|
+
const contexts_1 = require("../../contexts");
|
|
10
|
+
const menu_1 = require("./menu");
|
|
11
|
+
const EmbedCardHeader = () => {
|
|
12
|
+
var _a;
|
|
13
|
+
const { activePlugin, payload, timestampLabel, refreshHuri, hideElementsConfig } = (0, contexts_1.useXyoEmbedPluginState)();
|
|
14
|
+
const { hideAvatar, hideTitle, hideRefreshButton, hideTimestamp, hideCardActions } = hideElementsConfig !== null && hideElementsConfig !== void 0 ? hideElementsConfig : {};
|
|
15
|
+
return ((0, jsx_runtime_1.jsx)(material_1.CardHeader, { sx: { flexWrap: 'wrap', rowGap: 1 }, avatar: hideAvatar ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})) : ((0, jsx_runtime_1.jsx)(material_1.Avatar, Object.assign({ sx: { bgcolor: (theme) => theme.palette.primary.main }, "aria-label": activePlugin === null || activePlugin === void 0 ? void 0 : activePlugin.name }, { children: (_a = activePlugin === null || activePlugin === void 0 ? void 0 : activePlugin.name) === null || _a === void 0 ? void 0 : _a.charAt(0) }))), action: (0, jsx_runtime_1.jsxs)(react_flexbox_1.FlexRow, { children: [(payload === null || payload === void 0 ? void 0 : payload.timestamp) ? (hideTimestamp && hideRefreshButton ? ('') : ((0, jsx_runtime_1.jsx)(material_1.Chip, { avatar: hideRefreshButton ? (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}) : (0, jsx_runtime_1.jsx)(Refresh_1.default, {}), clickable: true, onClick: refreshHuri, label: hideTimestamp ? '' : `${timestampLabel} ${new Date(payload.timestamp).toLocaleString()}` }))) : null, hideCardActions ? null : (0, jsx_runtime_1.jsx)(menu_1.EmbedMenu, {})] }), title: hideTitle ? '' : activePlugin === null || activePlugin === void 0 ? void 0 : activePlugin.name }));
|
|
16
|
+
};
|
|
17
|
+
exports.EmbedCardHeader = EmbedCardHeader;
|
|
18
|
+
//# sourceMappingURL=EmbedCardHeader.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmbedCardHeader.js","sourceRoot":"","sources":["../../../../src/components/embed-card/EmbedCardHeader.tsx"],"names":[],"mappings":";;;;;AAAA,kFAAqD;AACrD,4CAAgF;AAChF,yDAA+C;AAE/C,6CAAuD;AACvD,iCAAkC;AAE3B,MAAM,eAAe,GAA8B,GAAG,EAAE;;IAC7D,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,kBAAkB,EAAE,GAAG,IAAA,iCAAsB,GAAE,CAAA;IAC3G,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,iBAAiB,EAAE,aAAa,EAAE,eAAe,EAAE,GAAG,kBAAkB,aAAlB,kBAAkB,cAAlB,kBAAkB,GAAI,EAAE,CAAA;IAC7G,OAAO,CACL,uBAAC,qBAAU,IACT,EAAE,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,EAAE,EACnC,MAAM,EACJ,UAAU,CAAC,CAAC,CAAC,CACX,kDAAK,CACN,CAAC,CAAC,CAAC,CACF,uBAAC,iBAAM,kBAAC,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,KAAY,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE,gBAAc,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,gBAClG,MAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,0CAAE,MAAM,CAAC,CAAC,CAAC,IACvB,CACV,EAEH,MAAM,EACJ,wBAAC,uBAAO,eACL,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,SAAS,EAAC,CAAC,CAAC,CACpB,aAAa,IAAI,iBAAiB,CAAC,CAAC,CAAC,CACnC,EAAE,CACH,CAAC,CAAC,CAAC,CACF,uBAAC,eAAI,IACH,MAAM,EAAE,iBAAiB,CAAC,CAAC,CAAC,kDAAK,CAAC,CAAC,CAAC,uBAAC,iBAAW,KAAG,EACnD,SAAS,QACT,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,cAAc,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,cAAc,EAAE,EAAE,GAC/F,CACH,CACF,CAAC,CAAC,CAAC,IAAI,EACP,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,uBAAC,gBAAS,KAAG,IAC/B,EAEZ,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,GAC1C,CACH,CAAA;AACH,CAAC,CAAA;AAnCY,QAAA,eAAe,mBAmC3B"}
|
|
@@ -1,7 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { CardProps } from '@mui/material';
|
|
3
|
-
export
|
|
4
|
-
hideEmbedMenu?: boolean;
|
|
5
|
-
}
|
|
6
|
-
export declare const EmbedPluginContainer: React.FC<EmbedPluginContainerProps>;
|
|
3
|
+
export declare const EmbedPluginContainer: React.FC<CardProps>;
|
|
7
4
|
//# sourceMappingURL=EmbedPluginContainer.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmbedPluginContainer.d.ts","sourceRoot":"","sources":["../../../../src/components/embed-card/EmbedPluginContainer.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"EmbedPluginContainer.d.ts","sourceRoot":"","sources":["../../../../src/components/embed-card/EmbedPluginContainer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,SAAS,EAAE,MAAM,eAAe,CAAA;AAQ5D,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAcpD,CAAA"}
|
|
@@ -1,20 +1,18 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.EmbedPluginContainer = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
-
const Refresh_1 = tslib_1.__importDefault(require("@mui/icons-material/Refresh"));
|
|
7
5
|
const material_1 = require("@mui/material");
|
|
8
6
|
const react_flexbox_1 = require("@xylabs/react-flexbox");
|
|
7
|
+
const react_shared_1 = require("@xyo-network/react-shared");
|
|
9
8
|
const contexts_1 = require("../../contexts");
|
|
10
9
|
const controls_1 = require("../controls");
|
|
11
|
-
const
|
|
12
|
-
const
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.Card, Object.assign({ elevation: 3, variant: "elevation" }, props, { children: [(0, jsx_runtime_1.jsx)(material_1.CardHeader, { sx: { flexWrap: 'wrap', rowGap: 1 }, avatar: (0, jsx_runtime_1.jsx)(material_1.Avatar, Object.assign({ sx: { bgcolor: (theme) => theme.palette.primary.main }, "aria-label": activePlugin === null || activePlugin === void 0 ? void 0 : activePlugin.name }, { children: (_b = activePlugin === null || activePlugin === void 0 ? void 0 : activePlugin.name) === null || _b === void 0 ? void 0 : _b.charAt(0) })), action: (0, jsx_runtime_1.jsxs)(react_flexbox_1.FlexRow, { children: [(payload === null || payload === void 0 ? void 0 : payload.timestamp) ? ((0, jsx_runtime_1.jsx)(material_1.Chip, { avatar: (0, jsx_runtime_1.jsx)(Refresh_1.default, {}), clickable: true, onClick: refreshHuri, label: `${timestampLabel} ${new Date(payload.timestamp).toLocaleString()}` })) : null, hideEmbedMenu ? null : (0, jsx_runtime_1.jsx)(menu_1.EmbedMenu, {})] }), title: activePlugin === null || activePlugin === void 0 ? void 0 : activePlugin.name }), (0, jsx_runtime_1.jsxs)(react_flexbox_1.FlexGrowRow, Object.assign({ columnGap: 2, rowGap: 2, flexWrap: "wrap", justifyContent: "center", pb: 1 }, { children: [plugins && plugins.length > 1 ? (0, jsx_runtime_1.jsx)(controls_1.EmbedRenderSelect, {}) : null, ((_f = (_e = (_d = (_c = activePlugin === null || activePlugin === void 0 ? void 0 : activePlugin.components) === null || _c === void 0 ? void 0 : _c.box) === null || _d === void 0 ? void 0 : _d.listModes) === null || _e === void 0 ? void 0 : _e.length) !== null && _f !== void 0 ? _f : 0) > 1 ? (0, jsx_runtime_1.jsx)(controls_1.ListModeSelectFormControl, {}) : null] })), (0, jsx_runtime_1.jsx)(material_1.CardContent, { children: (0, jsx_runtime_1.jsx)(RenderComponent_1.RenderComponent, { payload: payload, ActivePlugin: activePlugin }) })] })));
|
|
10
|
+
const EmbedCardHeader_1 = require("./EmbedCardHeader");
|
|
11
|
+
const EmbedPluginContainer = (props) => {
|
|
12
|
+
var _a, _b, _c, _d;
|
|
13
|
+
const { activePlugin: ActivePlugin, payload, plugins, hideElementsConfig } = (0, contexts_1.useXyoEmbedPluginState)();
|
|
14
|
+
const { listMode } = (0, react_shared_1.useListMode)();
|
|
15
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.Card, Object.assign({ elevation: 3, variant: "elevation" }, props, { children: [(hideElementsConfig === null || hideElementsConfig === void 0 ? void 0 : hideElementsConfig.hideCardHeader) ? null : (0, jsx_runtime_1.jsx)(EmbedCardHeader_1.EmbedCardHeader, {}), (0, jsx_runtime_1.jsxs)(react_flexbox_1.FlexGrowRow, Object.assign({ columnGap: 2, rowGap: 2, flexWrap: "wrap", justifyContent: "center", pb: 1 }, { children: [plugins && plugins.length > 1 ? (0, jsx_runtime_1.jsx)(controls_1.EmbedRenderSelect, {}) : null, ((_d = (_c = (_b = (_a = ActivePlugin === null || ActivePlugin === void 0 ? void 0 : ActivePlugin.components) === null || _a === void 0 ? void 0 : _a.box) === null || _b === void 0 ? void 0 : _b.listModes) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0) > 1 ? (0, jsx_runtime_1.jsx)(controls_1.ListModeSelectFormControl, {}) : null] })), (0, jsx_runtime_1.jsx)(material_1.CardContent, { children: ActivePlugin ? (0, jsx_runtime_1.jsx)(ActivePlugin.components.box.details, { payload: payload, listMode: listMode }) : null })] })));
|
|
18
16
|
};
|
|
19
17
|
exports.EmbedPluginContainer = EmbedPluginContainer;
|
|
20
18
|
//# sourceMappingURL=EmbedPluginContainer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmbedPluginContainer.js","sourceRoot":"","sources":["../../../../src/components/embed-card/EmbedPluginContainer.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"EmbedPluginContainer.js","sourceRoot":"","sources":["../../../../src/components/embed-card/EmbedPluginContainer.tsx"],"names":[],"mappings":";;;;AAAA,4CAA4D;AAC5D,yDAAmD;AACnD,4DAAuD;AAEvD,6CAAuD;AACvD,0CAA0E;AAC1E,uDAAmD;AAE5C,MAAM,oBAAoB,GAAwB,CAAC,KAAK,EAAE,EAAE;;IACjE,MAAM,EAAE,YAAY,EAAE,YAAY,EAAE,OAAO,EAAE,OAAO,EAAE,kBAAkB,EAAE,GAAG,IAAA,iCAAsB,GAAE,CAAA;IACrG,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAA,0BAAW,GAAE,CAAA;IAElC,OAAO,CACL,wBAAC,eAAI,kBAAC,SAAS,EAAE,CAAC,EAAE,OAAO,EAAC,WAAW,IAAK,KAAK,eAC9C,CAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,cAAc,EAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,uBAAC,iCAAe,KAAG,EAChE,wBAAC,2BAAW,kBAAC,SAAS,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAC,MAAM,EAAC,cAAc,EAAC,QAAQ,EAAC,EAAE,EAAE,CAAC,iBAChF,OAAO,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,uBAAC,4BAAiB,KAAG,CAAC,CAAC,CAAC,IAAI,EAC5D,CAAC,MAAA,MAAA,MAAA,MAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,UAAU,0CAAE,GAAG,0CAAE,SAAS,0CAAE,MAAM,mCAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,uBAAC,oCAAyB,KAAG,CAAC,CAAC,CAAC,IAAI,KACvF,EACd,uBAAC,sBAAW,cAAE,YAAY,CAAC,CAAC,CAAC,uBAAC,YAAY,CAAC,UAAU,CAAC,GAAG,CAAC,OAAO,IAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC,CAAC,CAAC,IAAI,GAAe,KAC3H,CACR,CAAA;AACH,CAAC,CAAA;AAdY,QAAA,oBAAoB,wBAchC"}
|
|
@@ -1,12 +1,8 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { FlexBoxProps } from '@xylabs/react-flexbox';
|
|
3
3
|
import { WithChildren } from '@xylabs/react-shared';
|
|
4
|
-
import {
|
|
5
|
-
export interface XyoEmbedPluginProviderProps extends FlexBoxProps {
|
|
6
|
-
plugins?: XyoPayloadRenderPlugin[];
|
|
7
|
-
huri?: string;
|
|
8
|
-
refreshTitle?: string;
|
|
9
|
-
timestampLabel?: string;
|
|
4
|
+
import { XyoEmbedPluginBase } from './State';
|
|
5
|
+
export interface XyoEmbedPluginProviderProps extends XyoEmbedPluginBase, FlexBoxProps {
|
|
10
6
|
}
|
|
11
7
|
export declare const XyoEmbedPluginProvider: React.FC<WithChildren<XyoEmbedPluginProviderProps>>;
|
|
12
8
|
//# sourceMappingURL=Provider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Provider.d.ts","sourceRoot":"","sources":["../../../../src/contexts/XyoEmbedPluginContext/Provider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAW,MAAM,uBAAuB,CAAA;AAC7D,OAAO,EAAkB,YAAY,EAAE,MAAM,sBAAsB,CAAA;
|
|
1
|
+
{"version":3,"file":"Provider.d.ts","sourceRoot":"","sources":["../../../../src/contexts/XyoEmbedPluginContext/Provider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAW,MAAM,uBAAuB,CAAA;AAC7D,OAAO,EAAkB,YAAY,EAAE,MAAM,sBAAsB,CAAA;AAUnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAE5C,MAAM,WAAW,2BAA4B,SAAQ,kBAAkB,EAAE,YAAY;CAAG;AAExF,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAAC,2BAA2B,CAAC,CAmEtF,CAAA"}
|
|
@@ -12,7 +12,7 @@ const react_webapp_1 = require("@xyo-network/react-webapp");
|
|
|
12
12
|
const react_1 = require("react");
|
|
13
13
|
const Context_1 = require("./Context");
|
|
14
14
|
const XyoEmbedPluginProvider = (_a) => {
|
|
15
|
-
var { children, refreshTitle, timestampLabel, huri, plugins } = _a, props = tslib_1.__rest(_a, ["children", "refreshTitle", "timestampLabel", "huri", "plugins"]);
|
|
15
|
+
var { children, refreshTitle, timestampLabel, hideElementsConfig, huri, plugins, embedPluginConfig } = _a, props = tslib_1.__rest(_a, ["children", "refreshTitle", "timestampLabel", "hideElementsConfig", "huri", "plugins", "embedPluginConfig"]);
|
|
16
16
|
const [payload, setPayload] = (0, react_1.useState)();
|
|
17
17
|
const [notFound, setNotFound] = (0, react_1.useState)();
|
|
18
18
|
const [huriApiError, setHuriApiError] = (0, react_1.useState)();
|
|
@@ -41,7 +41,18 @@ const XyoEmbedPluginProvider = (_a) => {
|
|
|
41
41
|
const refreshHuri = () => {
|
|
42
42
|
setRefreshPayload(0);
|
|
43
43
|
};
|
|
44
|
-
return ((0, jsx_runtime_1.jsx)(Context_1.XyoEmbedPluginContext.Provider, Object.assign({ value: {
|
|
44
|
+
return ((0, jsx_runtime_1.jsx)(Context_1.XyoEmbedPluginContext.Provider, Object.assign({ value: {
|
|
45
|
+
activePlugin,
|
|
46
|
+
embedPluginConfig,
|
|
47
|
+
hideElementsConfig,
|
|
48
|
+
huri,
|
|
49
|
+
payload,
|
|
50
|
+
provided: true,
|
|
51
|
+
refreshHuri,
|
|
52
|
+
refreshTitle,
|
|
53
|
+
setActivePlugin,
|
|
54
|
+
timestampLabel,
|
|
55
|
+
} }, { children: (0, jsx_runtime_1.jsx)(react_webapp_1.ResultLoader, Object.assign({ searchResult: payload, notFound: !!notFound, apiError: huriApiError }, { children: (0, jsx_runtime_1.jsx)(react_auth_service_1.XyoApiErrorRender, Object.assign({ apiError: huriApiError }, { children: (0, jsx_runtime_1.jsx)(react_flexbox_1.FlexCol, Object.assign({ busy: Boolean(!refreshPayload && payload) }, props, { children: children })) })) })) })));
|
|
45
56
|
};
|
|
46
57
|
exports.XyoEmbedPluginProvider = XyoEmbedPluginProvider;
|
|
47
58
|
//# sourceMappingURL=Provider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Provider.js","sourceRoot":"","sources":["../../../../src/contexts/XyoEmbedPluginContext/Provider.tsx"],"names":[],"mappings":";;;;;AAAA,yDAA6D;AAC7D,uDAAmE;AACnE,2CAAsC;AAEtC,kDAAuD;AACvD,wEAAmE;AAEnE,4DAAwD;AACxD,iCAAgC;AAEhC,uCAAiD;
|
|
1
|
+
{"version":3,"file":"Provider.js","sourceRoot":"","sources":["../../../../src/contexts/XyoEmbedPluginContext/Provider.tsx"],"names":[],"mappings":";;;;;AAAA,yDAA6D;AAC7D,uDAAmE;AACnE,2CAAsC;AAEtC,kDAAuD;AACvD,wEAAmE;AAEnE,4DAAwD;AACxD,iCAAgC;AAEhC,uCAAiD;AAK1C,MAAM,sBAAsB,GAAwD,CAAC,EAS3F,EAAE,EAAE;QATuF,EAC1F,QAAQ,EACR,YAAY,EACZ,cAAc,EACd,kBAAkB,EAClB,IAAI,EACJ,OAAO,EACP,iBAAiB,OAElB,EADI,KAAK,sBARkF,4GAS3F,CADS;IAER,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,GAAc,CAAA;IACpD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,GAAW,CAAA;IACnD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,IAAA,gBAAQ,GAAe,CAAA;IAC/D,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,IAAA,gBAAQ,EAAqC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;IACtH,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAAC,CAAC,CAAC,CAAA;IAEvD,IAAA,6BAAc;IACZ,uDAAuD;IACvD,CAAO,OAAO,EAAE,EAAE;QAChB,IAAI,IAAI,IAAI,CAAC,cAAc,EAAE;YAC3B,IAAI;gBACF,MAAM,YAAY,GAAG,IAAI,cAAI,CAAC,IAAI,CAAC,CAAA;gBACnC,MAAM,MAAM,GAAG,MAAM,YAAY,CAAC,KAAK,EAAE,CAAA;gBACzC,4EAA4E;gBAC5E,MAAM,IAAA,cAAK,EAAC,GAAG,CAAC,CAAA;gBAEhB,IAAI,OAAO,EAAE,EAAE;oBACb,WAAW,CAAC,MAAM,KAAK,IAAI,CAAC,CAAA;oBAC5B,UAAU,CAAC,MAAM,CAAC,CAAA;oBAClB,iBAAiB,CAAC,CAAC,CAAC,CAAA;iBACrB;aACF;YAAC,OAAO,CAAC,EAAE;gBACV,eAAe,CAAC,CAAgB,CAAC,CAAA;aAClC;SACF;IACH,CAAC,CAAA,EACD,CAAC,IAAI,EAAE,OAAO,EAAE,cAAc,CAAC,CAChC,CAAA;IAED,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,iBAAiB,CAAC,CAAC,CAAC,CAAA;IACtB,CAAC,CAAA;IAED,OAAO,CACL,uBAAC,+BAAqB,CAAC,QAAQ,kBAC7B,KAAK,EAAE;YACL,YAAY;YACZ,iBAAiB;YACjB,kBAAkB;YAClB,IAAI;YACJ,OAAO;YACP,QAAQ,EAAE,IAAI;YACd,WAAW;YACX,YAAY;YACZ,eAAe;YACf,cAAc;SACf,gBAED,uBAAC,2BAAY,kBAAC,YAAY,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAC,CAAC,QAAQ,EAAE,QAAQ,EAAE,YAAY,gBAC/E,uBAAC,sCAAiB,kBAAC,QAAQ,EAAE,YAAY,gBACvC,uBAAC,uBAAO,kBAAC,IAAI,EAAE,OAAO,CAAC,CAAC,cAAc,IAAI,OAAO,CAAC,IAAM,KAAK,cAC1D,QAAQ,IACD,IACQ,IACP,IACgB,CAClC,CAAA;AACH,CAAC,CAAA;AAnEY,QAAA,sBAAsB,0BAmElC"}
|
|
@@ -1,15 +1,34 @@
|
|
|
1
1
|
import { XyoPayload } from '@xyo-network/payload';
|
|
2
2
|
import { XyoPayloadRenderPlugin } from '@xyo-network/react-payload-plugin';
|
|
3
|
-
import { ContextExState } from '@xyo-network/react-shared';
|
|
3
|
+
import { ContextExState, ListMode } from '@xyo-network/react-shared';
|
|
4
4
|
import { Dispatch, SetStateAction } from 'react';
|
|
5
|
-
export interface
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
5
|
+
export interface EmbedPluginVisibilityConfig {
|
|
6
|
+
hideAvatar?: boolean;
|
|
7
|
+
hideTitle?: boolean;
|
|
8
|
+
hideRefreshButton?: boolean;
|
|
9
|
+
hideTimestamp?: boolean;
|
|
10
|
+
hideCardActions?: boolean;
|
|
11
|
+
hideCardHeader?: boolean;
|
|
12
|
+
}
|
|
13
|
+
/**
|
|
14
|
+
* Extend for custom plugin configuration
|
|
15
|
+
*/
|
|
16
|
+
export interface XyoPluginConfig {
|
|
17
|
+
listMode?: ListMode;
|
|
18
|
+
}
|
|
19
|
+
export interface XyoEmbedPluginBase {
|
|
9
20
|
plugins?: XyoPayloadRenderPlugin[];
|
|
10
|
-
|
|
21
|
+
/** XyoEmbedPlugin component configuration */
|
|
22
|
+
embedPluginConfig?: XyoPluginConfig;
|
|
11
23
|
huri?: string;
|
|
12
24
|
refreshTitle?: string;
|
|
13
25
|
timestampLabel?: string;
|
|
26
|
+
hideElementsConfig?: EmbedPluginVisibilityConfig;
|
|
27
|
+
}
|
|
28
|
+
export interface XyoEmbedPluginState extends XyoEmbedPluginBase, ContextExState {
|
|
29
|
+
activePlugin?: XyoPayloadRenderPlugin;
|
|
30
|
+
setActivePlugin?: Dispatch<SetStateAction<XyoPayloadRenderPlugin | undefined>>;
|
|
31
|
+
payload?: XyoPayload;
|
|
32
|
+
refreshHuri?: () => void;
|
|
14
33
|
}
|
|
15
34
|
//# sourceMappingURL=State.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"State.d.ts","sourceRoot":"","sources":["../../../../src/contexts/XyoEmbedPluginContext/State.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AACjD,OAAO,EAAE,sBAAsB,EAAE,MAAM,mCAAmC,CAAA;AAC1E,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;
|
|
1
|
+
{"version":3,"file":"State.d.ts","sourceRoot":"","sources":["../../../../src/contexts/XyoEmbedPluginContext/State.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AACjD,OAAO,EAAE,sBAAsB,EAAE,MAAM,mCAAmC,CAAA;AAC1E,OAAO,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAA;AACpE,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAEhD,MAAM,WAAW,2BAA2B;IAC1C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB;AAED;;GAEG;AACH,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,QAAQ,CAAA;CACpB;AAED,MAAM,WAAW,kBAAkB;IACjC,OAAO,CAAC,EAAE,sBAAsB,EAAE,CAAA;IAClC,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,eAAe,CAAA;IACnC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,kBAAkB,CAAC,EAAE,2BAA2B,CAAA;CACjD;AAED,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB,EAAE,cAAc;IAC7E,YAAY,CAAC,EAAE,sBAAsB,CAAA;IACrC,eAAe,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,sBAAsB,GAAG,SAAS,CAAC,CAAC,CAAA;IAC9E,OAAO,CAAC,EAAE,UAAU,CAAA;IACpB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;CACzB"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { CardProps } from '@mui/material';
|
|
2
|
+
import { EmbedPluginVisibilityConfig, XyoEmbedPluginBase } from '../contexts';
|
|
3
|
+
export interface XyoEmbedPluginProps extends XyoEmbedPluginBase, CardProps {
|
|
4
|
+
validateSchema?: boolean;
|
|
5
|
+
hideElementsConfig?: EmbedPluginVisibilityConfig;
|
|
6
|
+
}
|
|
7
|
+
//# sourceMappingURL=XyoEmbedPluginProps.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"XyoEmbedPluginProps.d.ts","sourceRoot":"","sources":["../../../src/types/XyoEmbedPluginProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAEzC,OAAO,EAAE,2BAA2B,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAA;AAE7E,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB,EAAE,SAAS;IACxE,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,kBAAkB,CAAC,EAAE,2BAA2B,CAAA;CACjD"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"XyoEmbedPluginProps.js","sourceRoot":"","sources":["../../../src/types/XyoEmbedPluginProps.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":";;;AAAA,gEAAqC"}
|
package/dist/docs.json
CHANGED
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
"fileName": "packages/sdk/embed/src/components/XyoEmbedPlugin.tsx",
|
|
18
18
|
"line": 7,
|
|
19
19
|
"character": 13,
|
|
20
|
-
"url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/blob/
|
|
20
|
+
"url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/blob/83588f3e/packages/sdk/embed/src/components/XyoEmbedPlugin.tsx#L7"
|
|
21
21
|
}
|
|
22
22
|
],
|
|
23
23
|
"signatures": [
|
|
@@ -95,7 +95,7 @@
|
|
|
95
95
|
"fileName": "packages/sdk/embed/src/index.ts",
|
|
96
96
|
"line": 1,
|
|
97
97
|
"character": 0,
|
|
98
|
-
"url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/blob/
|
|
98
|
+
"url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/blob/83588f3e/packages/sdk/embed/src/index.ts#L1"
|
|
99
99
|
}
|
|
100
100
|
]
|
|
101
101
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"XyoEmbedPlugin.d.ts","sourceRoot":"","sources":["../../../src/components/XyoEmbedPlugin.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"XyoEmbedPlugin.d.ts","sourceRoot":"","sources":["../../../src/components/XyoEmbedPlugin.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAA;AAG9C,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA8BxD,CAAA"}
|
|
@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { ListModeProvider } from '@xyo-network/react-shared';
|
|
3
3
|
import { ValidatePayloadProvider, XyoEmbedPluginProvider } from '../contexts';
|
|
4
4
|
import { EmbedPluginContainer, ValidatePayload, ValidatePlugins } from './embed-card';
|
|
5
|
-
export const XyoEmbedPlugin = ({ validateSchema, plugins = [], huri, refreshTitle = '', timestampLabel = 'Data From', ...props }) => {
|
|
6
|
-
return (_jsx(XyoEmbedPluginProvider, { refreshTitle: refreshTitle, timestampLabel: timestampLabel, plugins: plugins, huri: huri, children: _jsx(ValidatePayloadProvider, { enabled: validateSchema, children: _jsx(ListModeProvider, { children: _jsx(ValidatePlugins, { children: _jsx(ValidatePayload, { children: _jsx(EmbedPluginContainer, { ...props }) }) }) }) }) }));
|
|
5
|
+
export const XyoEmbedPlugin = ({ validateSchema, plugins = [], huri, refreshTitle = '', timestampLabel = 'Data From', hideElementsConfig, embedPluginConfig, ...props }) => {
|
|
6
|
+
return (_jsx(XyoEmbedPluginProvider, { refreshTitle: refreshTitle, timestampLabel: timestampLabel, plugins: plugins, huri: huri, embedPluginConfig: embedPluginConfig, hideElementsConfig: hideElementsConfig, children: _jsx(ValidatePayloadProvider, { enabled: validateSchema, children: _jsx(ListModeProvider, { defaultListMode: embedPluginConfig?.listMode, children: _jsx(ValidatePlugins, { children: _jsx(ValidatePayload, { children: _jsx(EmbedPluginContainer, { ...props }) }) }) }) }) }));
|
|
7
7
|
};
|
|
8
8
|
//# sourceMappingURL=XyoEmbedPlugin.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"XyoEmbedPlugin.js","sourceRoot":"","sources":["../../../src/components/XyoEmbedPlugin.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAE5D,OAAO,EAAE,uBAAuB,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAA;
|
|
1
|
+
{"version":3,"file":"XyoEmbedPlugin.js","sourceRoot":"","sources":["../../../src/components/XyoEmbedPlugin.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAE5D,OAAO,EAAE,uBAAuB,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAA;AAE7E,OAAO,EAAE,oBAAoB,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAErF,MAAM,CAAC,MAAM,cAAc,GAAkC,CAAC,EAC5D,cAAc,EACd,OAAO,GAAG,EAAE,EACZ,IAAI,EACJ,YAAY,GAAG,EAAE,EACjB,cAAc,GAAG,WAAW,EAC5B,kBAAkB,EAClB,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,OAAO,CACL,KAAC,sBAAsB,IACrB,YAAY,EAAE,YAAY,EAC1B,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,iBAAiB,EAAE,iBAAiB,EACpC,kBAAkB,EAAE,kBAAkB,YAEtC,KAAC,uBAAuB,IAAC,OAAO,EAAE,cAAc,YAC9C,KAAC,gBAAgB,IAAC,eAAe,EAAE,iBAAiB,EAAE,QAAQ,YAC5D,KAAC,eAAe,cACd,KAAC,eAAe,cACd,KAAC,oBAAoB,OAAK,KAAK,GAAI,GACnB,GACF,GACD,GACK,GACH,CAC1B,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -1,10 +1,19 @@
|
|
|
1
1
|
import { CardProps } from '@mui/material';
|
|
2
2
|
import { XyoPayloadRenderPlugin } from '@xyo-network/react-payload-plugin';
|
|
3
|
+
export interface EmbedPluginVisibilityConfig {
|
|
4
|
+
hideAvatar?: boolean;
|
|
5
|
+
hideTitle?: boolean;
|
|
6
|
+
hideRefreshButton?: boolean;
|
|
7
|
+
hideTimestamp?: boolean;
|
|
8
|
+
hideCardActions?: boolean;
|
|
9
|
+
hideCardHeader?: boolean;
|
|
10
|
+
}
|
|
3
11
|
export interface XyoEmbedPluginProps extends CardProps {
|
|
4
12
|
plugins?: XyoPayloadRenderPlugin[];
|
|
5
13
|
huri?: string;
|
|
6
14
|
refreshTitle?: string;
|
|
7
15
|
timestampLabel?: string;
|
|
8
16
|
validateSchema?: boolean;
|
|
17
|
+
hideElementsConfig?: EmbedPluginVisibilityConfig;
|
|
9
18
|
}
|
|
10
19
|
//# sourceMappingURL=XyoEmbedPluginProps.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"XyoEmbedPluginProps.d.ts","sourceRoot":"","sources":["../../../src/components/XyoEmbedPluginProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACzC,OAAO,EAAE,sBAAsB,EAAE,MAAM,mCAAmC,CAAA;AAE1E,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD,OAAO,CAAC,EAAE,sBAAsB,EAAE,CAAA;IAClC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"XyoEmbedPluginProps.d.ts","sourceRoot":"","sources":["../../../src/components/XyoEmbedPluginProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACzC,OAAO,EAAE,sBAAsB,EAAE,MAAM,mCAAmC,CAAA;AAE1E,MAAM,WAAW,2BAA2B;IAC1C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB;AAED,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD,OAAO,CAAC,EAAE,sBAAsB,EAAE,CAAA;IAClC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,kBAAkB,CAAC,EAAE,2BAA2B,CAAA;CACjD"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmbedCardHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/embed-card/EmbedCardHeader.tsx"],"names":[],"mappings":";AACA,OAAO,EAAsB,eAAe,EAAe,MAAM,eAAe,CAAA;AAMhF,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAmCrD,CAAA"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import RefreshIcon from '@mui/icons-material/Refresh';
|
|
3
|
+
import { Avatar, CardHeader, Chip } from '@mui/material';
|
|
4
|
+
import { FlexRow } from '@xylabs/react-flexbox';
|
|
5
|
+
import { useXyoEmbedPluginState } from '../../contexts';
|
|
6
|
+
import { EmbedMenu } from './menu';
|
|
7
|
+
export const EmbedCardHeader = () => {
|
|
8
|
+
const { activePlugin, payload, timestampLabel, refreshHuri, hideElementsConfig } = useXyoEmbedPluginState();
|
|
9
|
+
const { hideAvatar, hideTitle, hideRefreshButton, hideTimestamp, hideCardActions } = hideElementsConfig ?? {};
|
|
10
|
+
return (_jsx(CardHeader, { sx: { flexWrap: 'wrap', rowGap: 1 }, avatar: hideAvatar ? (_jsx(_Fragment, {})) : (_jsx(Avatar, { sx: { bgcolor: (theme) => theme.palette.primary.main }, "aria-label": activePlugin?.name, children: activePlugin?.name?.charAt(0) })), action: _jsxs(FlexRow, { children: [payload?.timestamp ? (hideTimestamp && hideRefreshButton ? ('') : (_jsx(Chip, { avatar: hideRefreshButton ? _jsx(_Fragment, {}) : _jsx(RefreshIcon, {}), clickable: true, onClick: refreshHuri, label: hideTimestamp ? '' : `${timestampLabel} ${new Date(payload.timestamp).toLocaleString()}` }))) : null, hideCardActions ? null : _jsx(EmbedMenu, {})] }), title: hideTitle ? '' : activePlugin?.name }));
|
|
11
|
+
};
|
|
12
|
+
//# sourceMappingURL=EmbedCardHeader.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmbedCardHeader.js","sourceRoot":"","sources":["../../../../src/components/embed-card/EmbedCardHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,WAAW,MAAM,6BAA6B,CAAA;AACrD,OAAO,EAAE,MAAM,EAAE,UAAU,EAAmB,IAAI,EAAS,MAAM,eAAe,CAAA;AAChF,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAE/C,OAAO,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAA;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAA;AAElC,MAAM,CAAC,MAAM,eAAe,GAA8B,GAAG,EAAE;IAC7D,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,kBAAkB,EAAE,GAAG,sBAAsB,EAAE,CAAA;IAC3G,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,iBAAiB,EAAE,aAAa,EAAE,eAAe,EAAE,GAAG,kBAAkB,IAAI,EAAE,CAAA;IAC7G,OAAO,CACL,KAAC,UAAU,IACT,EAAE,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,EAAE,EACnC,MAAM,EACJ,UAAU,CAAC,CAAC,CAAC,CACX,mBAAK,CACN,CAAC,CAAC,CAAC,CACF,KAAC,MAAM,IAAC,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,KAAY,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE,gBAAc,YAAY,EAAE,IAAI,YAClG,YAAY,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,GACvB,CACV,EAEH,MAAM,EACJ,MAAC,OAAO,eACL,OAAO,EAAE,SAAS,CAAC,CAAC,CAAC,CACpB,aAAa,IAAI,iBAAiB,CAAC,CAAC,CAAC,CACnC,EAAE,CACH,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IACH,MAAM,EAAE,iBAAiB,CAAC,CAAC,CAAC,mBAAK,CAAC,CAAC,CAAC,KAAC,WAAW,KAAG,EACnD,SAAS,QACT,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,cAAc,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,cAAc,EAAE,EAAE,GAC/F,CACH,CACF,CAAC,CAAC,CAAC,IAAI,EACP,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAC,SAAS,KAAG,IAC/B,EAEZ,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,IAAI,GAC1C,CACH,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -1,7 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { CardProps } from '@mui/material';
|
|
3
|
-
export
|
|
4
|
-
hideEmbedMenu?: boolean;
|
|
5
|
-
}
|
|
6
|
-
export declare const EmbedPluginContainer: React.FC<EmbedPluginContainerProps>;
|
|
3
|
+
export declare const EmbedPluginContainer: React.FC<CardProps>;
|
|
7
4
|
//# sourceMappingURL=EmbedPluginContainer.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmbedPluginContainer.d.ts","sourceRoot":"","sources":["../../../../src/components/embed-card/EmbedPluginContainer.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"EmbedPluginContainer.d.ts","sourceRoot":"","sources":["../../../../src/components/embed-card/EmbedPluginContainer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,SAAS,EAAE,MAAM,eAAe,CAAA;AAQ5D,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAcpD,CAAA"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
2
|
+
import { Card, CardContent } from '@mui/material';
|
|
3
|
+
import { FlexGrowRow } from '@xylabs/react-flexbox';
|
|
4
|
+
import { useListMode } from '@xyo-network/react-shared';
|
|
5
5
|
import { useXyoEmbedPluginState } from '../../contexts';
|
|
6
6
|
import { EmbedRenderSelect, ListModeSelectFormControl } from '../controls';
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
const {
|
|
11
|
-
return (_jsxs(Card, { elevation: 3, variant: "elevation", ...props, children: [
|
|
7
|
+
import { EmbedCardHeader } from './EmbedCardHeader';
|
|
8
|
+
export const EmbedPluginContainer = (props) => {
|
|
9
|
+
const { activePlugin: ActivePlugin, payload, plugins, hideElementsConfig } = useXyoEmbedPluginState();
|
|
10
|
+
const { listMode } = useListMode();
|
|
11
|
+
return (_jsxs(Card, { elevation: 3, variant: "elevation", ...props, children: [hideElementsConfig?.hideCardHeader ? null : _jsx(EmbedCardHeader, {}), _jsxs(FlexGrowRow, { columnGap: 2, rowGap: 2, flexWrap: "wrap", justifyContent: "center", pb: 1, children: [plugins && plugins.length > 1 ? _jsx(EmbedRenderSelect, {}) : null, (ActivePlugin?.components?.box?.listModes?.length ?? 0) > 1 ? _jsx(ListModeSelectFormControl, {}) : null] }), _jsx(CardContent, { children: ActivePlugin ? _jsx(ActivePlugin.components.box.details, { payload: payload, listMode: listMode }) : null })] }));
|
|
12
12
|
};
|
|
13
13
|
//# sourceMappingURL=EmbedPluginContainer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmbedPluginContainer.js","sourceRoot":"","sources":["../../../../src/components/embed-card/EmbedPluginContainer.tsx"],"names":[],"mappings":";AAAA,OAAO,WAAW,MAAM,
|
|
1
|
+
{"version":3,"file":"EmbedPluginContainer.js","sourceRoot":"","sources":["../../../../src/components/embed-card/EmbedPluginContainer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAa,MAAM,eAAe,CAAA;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AAEvD,OAAO,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAA;AACvD,OAAO,EAAE,iBAAiB,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAA;AAC1E,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAEnD,MAAM,CAAC,MAAM,oBAAoB,GAAwB,CAAC,KAAK,EAAE,EAAE;IACjE,MAAM,EAAE,YAAY,EAAE,YAAY,EAAE,OAAO,EAAE,OAAO,EAAE,kBAAkB,EAAE,GAAG,sBAAsB,EAAE,CAAA;IACrG,MAAM,EAAE,QAAQ,EAAE,GAAG,WAAW,EAAE,CAAA;IAElC,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,CAAC,EAAE,OAAO,EAAC,WAAW,KAAK,KAAK,aAC9C,kBAAkB,EAAE,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAC,eAAe,KAAG,EAChE,MAAC,WAAW,IAAC,SAAS,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAC,MAAM,EAAC,cAAc,EAAC,QAAQ,EAAC,EAAE,EAAE,CAAC,aAChF,OAAO,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,KAAC,iBAAiB,KAAG,CAAC,CAAC,CAAC,IAAI,EAC5D,CAAC,YAAY,EAAE,UAAU,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAAC,yBAAyB,KAAG,CAAC,CAAC,CAAC,IAAI,IACvF,EACd,KAAC,WAAW,cAAE,YAAY,CAAC,CAAC,CAAC,KAAC,YAAY,CAAC,UAAU,CAAC,GAAG,CAAC,OAAO,IAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC,CAAC,CAAC,IAAI,GAAe,IAC3H,CACR,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -1,12 +1,8 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { FlexBoxProps } from '@xylabs/react-flexbox';
|
|
3
3
|
import { WithChildren } from '@xylabs/react-shared';
|
|
4
|
-
import {
|
|
5
|
-
export interface XyoEmbedPluginProviderProps extends FlexBoxProps {
|
|
6
|
-
plugins?: XyoPayloadRenderPlugin[];
|
|
7
|
-
huri?: string;
|
|
8
|
-
refreshTitle?: string;
|
|
9
|
-
timestampLabel?: string;
|
|
4
|
+
import { XyoEmbedPluginBase } from './State';
|
|
5
|
+
export interface XyoEmbedPluginProviderProps extends XyoEmbedPluginBase, FlexBoxProps {
|
|
10
6
|
}
|
|
11
7
|
export declare const XyoEmbedPluginProvider: React.FC<WithChildren<XyoEmbedPluginProviderProps>>;
|
|
12
8
|
//# sourceMappingURL=Provider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Provider.d.ts","sourceRoot":"","sources":["../../../../src/contexts/XyoEmbedPluginContext/Provider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAW,MAAM,uBAAuB,CAAA;AAC7D,OAAO,EAAkB,YAAY,EAAE,MAAM,sBAAsB,CAAA;
|
|
1
|
+
{"version":3,"file":"Provider.d.ts","sourceRoot":"","sources":["../../../../src/contexts/XyoEmbedPluginContext/Provider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAW,MAAM,uBAAuB,CAAA;AAC7D,OAAO,EAAkB,YAAY,EAAE,MAAM,sBAAsB,CAAA;AAUnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAE5C,MAAM,WAAW,2BAA4B,SAAQ,kBAAkB,EAAE,YAAY;CAAG;AAExF,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAAC,2BAA2B,CAAC,CAmEtF,CAAA"}
|
|
@@ -7,7 +7,7 @@ import { XyoApiErrorRender } from '@xyo-network/react-auth-service';
|
|
|
7
7
|
import { ResultLoader } from '@xyo-network/react-webapp';
|
|
8
8
|
import { useState } from 'react';
|
|
9
9
|
import { XyoEmbedPluginContext } from './Context';
|
|
10
|
-
export const XyoEmbedPluginProvider = ({ children, refreshTitle, timestampLabel, huri, plugins, ...props }) => {
|
|
10
|
+
export const XyoEmbedPluginProvider = ({ children, refreshTitle, timestampLabel, hideElementsConfig, huri, plugins, embedPluginConfig, ...props }) => {
|
|
11
11
|
const [payload, setPayload] = useState();
|
|
12
12
|
const [notFound, setNotFound] = useState();
|
|
13
13
|
const [huriApiError, setHuriApiError] = useState();
|
|
@@ -36,6 +36,17 @@ export const XyoEmbedPluginProvider = ({ children, refreshTitle, timestampLabel,
|
|
|
36
36
|
const refreshHuri = () => {
|
|
37
37
|
setRefreshPayload(0);
|
|
38
38
|
};
|
|
39
|
-
return (_jsx(XyoEmbedPluginContext.Provider, { value: {
|
|
39
|
+
return (_jsx(XyoEmbedPluginContext.Provider, { value: {
|
|
40
|
+
activePlugin,
|
|
41
|
+
embedPluginConfig,
|
|
42
|
+
hideElementsConfig,
|
|
43
|
+
huri,
|
|
44
|
+
payload,
|
|
45
|
+
provided: true,
|
|
46
|
+
refreshHuri,
|
|
47
|
+
refreshTitle,
|
|
48
|
+
setActivePlugin,
|
|
49
|
+
timestampLabel,
|
|
50
|
+
}, children: _jsx(ResultLoader, { searchResult: payload, notFound: !!notFound, apiError: huriApiError, children: _jsx(XyoApiErrorRender, { apiError: huriApiError, children: _jsx(FlexCol, { busy: Boolean(!refreshPayload && payload), ...props, children: children }) }) }) }));
|
|
40
51
|
};
|
|
41
52
|
//# sourceMappingURL=Provider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Provider.js","sourceRoot":"","sources":["../../../../src/contexts/XyoEmbedPluginContext/Provider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAgB,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC7D,OAAO,EAAE,cAAc,EAAgB,MAAM,sBAAsB,CAAA;AACnE,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAc,MAAM,sBAAsB,CAAA;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAA;AAEnE,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEhC,OAAO,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"Provider.js","sourceRoot":"","sources":["../../../../src/contexts/XyoEmbedPluginContext/Provider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAgB,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC7D,OAAO,EAAE,cAAc,EAAgB,MAAM,sBAAsB,CAAA;AACnE,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAc,MAAM,sBAAsB,CAAA;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAA;AAEnE,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEhC,OAAO,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAA;AAKjD,MAAM,CAAC,MAAM,sBAAsB,GAAwD,CAAC,EAC1F,QAAQ,EACR,YAAY,EACZ,cAAc,EACd,kBAAkB,EAClB,IAAI,EACJ,OAAO,EACP,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,EAAc,CAAA;IACpD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,EAAW,CAAA;IACnD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,EAAe,CAAA;IAC/D,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAqC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;IACtH,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;IAEvD,cAAc;IACZ,uDAAuD;IACvD,KAAK,EAAE,OAAO,EAAE,EAAE;QAChB,IAAI,IAAI,IAAI,CAAC,cAAc,EAAE;YAC3B,IAAI;gBACF,MAAM,YAAY,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,CAAA;gBACnC,MAAM,MAAM,GAAG,MAAM,YAAY,CAAC,KAAK,EAAE,CAAA;gBACzC,4EAA4E;gBAC5E,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;gBAEhB,IAAI,OAAO,EAAE,EAAE;oBACb,WAAW,CAAC,MAAM,KAAK,IAAI,CAAC,CAAA;oBAC5B,UAAU,CAAC,MAAM,CAAC,CAAA;oBAClB,iBAAiB,CAAC,CAAC,CAAC,CAAA;iBACrB;aACF;YAAC,OAAO,CAAC,EAAE;gBACV,eAAe,CAAC,CAAgB,CAAC,CAAA;aAClC;SACF;IACH,CAAC,EACD,CAAC,IAAI,EAAE,OAAO,EAAE,cAAc,CAAC,CAChC,CAAA;IAED,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,iBAAiB,CAAC,CAAC,CAAC,CAAA;IACtB,CAAC,CAAA;IAED,OAAO,CACL,KAAC,qBAAqB,CAAC,QAAQ,IAC7B,KAAK,EAAE;YACL,YAAY;YACZ,iBAAiB;YACjB,kBAAkB;YAClB,IAAI;YACJ,OAAO;YACP,QAAQ,EAAE,IAAI;YACd,WAAW;YACX,YAAY;YACZ,eAAe;YACf,cAAc;SACf,YAED,KAAC,YAAY,IAAC,YAAY,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAC,CAAC,QAAQ,EAAE,QAAQ,EAAE,YAAY,YAC/E,KAAC,iBAAiB,IAAC,QAAQ,EAAE,YAAY,YACvC,KAAC,OAAO,IAAC,IAAI,EAAE,OAAO,CAAC,CAAC,cAAc,IAAI,OAAO,CAAC,KAAM,KAAK,YAC1D,QAAQ,GACD,GACQ,GACP,GACgB,CAClC,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -1,15 +1,34 @@
|
|
|
1
1
|
import { XyoPayload } from '@xyo-network/payload';
|
|
2
2
|
import { XyoPayloadRenderPlugin } from '@xyo-network/react-payload-plugin';
|
|
3
|
-
import { ContextExState } from '@xyo-network/react-shared';
|
|
3
|
+
import { ContextExState, ListMode } from '@xyo-network/react-shared';
|
|
4
4
|
import { Dispatch, SetStateAction } from 'react';
|
|
5
|
-
export interface
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
5
|
+
export interface EmbedPluginVisibilityConfig {
|
|
6
|
+
hideAvatar?: boolean;
|
|
7
|
+
hideTitle?: boolean;
|
|
8
|
+
hideRefreshButton?: boolean;
|
|
9
|
+
hideTimestamp?: boolean;
|
|
10
|
+
hideCardActions?: boolean;
|
|
11
|
+
hideCardHeader?: boolean;
|
|
12
|
+
}
|
|
13
|
+
/**
|
|
14
|
+
* Extend for custom plugin configuration
|
|
15
|
+
*/
|
|
16
|
+
export interface XyoPluginConfig {
|
|
17
|
+
listMode?: ListMode;
|
|
18
|
+
}
|
|
19
|
+
export interface XyoEmbedPluginBase {
|
|
9
20
|
plugins?: XyoPayloadRenderPlugin[];
|
|
10
|
-
|
|
21
|
+
/** XyoEmbedPlugin component configuration */
|
|
22
|
+
embedPluginConfig?: XyoPluginConfig;
|
|
11
23
|
huri?: string;
|
|
12
24
|
refreshTitle?: string;
|
|
13
25
|
timestampLabel?: string;
|
|
26
|
+
hideElementsConfig?: EmbedPluginVisibilityConfig;
|
|
27
|
+
}
|
|
28
|
+
export interface XyoEmbedPluginState extends XyoEmbedPluginBase, ContextExState {
|
|
29
|
+
activePlugin?: XyoPayloadRenderPlugin;
|
|
30
|
+
setActivePlugin?: Dispatch<SetStateAction<XyoPayloadRenderPlugin | undefined>>;
|
|
31
|
+
payload?: XyoPayload;
|
|
32
|
+
refreshHuri?: () => void;
|
|
14
33
|
}
|
|
15
34
|
//# sourceMappingURL=State.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"State.d.ts","sourceRoot":"","sources":["../../../../src/contexts/XyoEmbedPluginContext/State.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AACjD,OAAO,EAAE,sBAAsB,EAAE,MAAM,mCAAmC,CAAA;AAC1E,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;
|
|
1
|
+
{"version":3,"file":"State.d.ts","sourceRoot":"","sources":["../../../../src/contexts/XyoEmbedPluginContext/State.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AACjD,OAAO,EAAE,sBAAsB,EAAE,MAAM,mCAAmC,CAAA;AAC1E,OAAO,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAA;AACpE,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAEhD,MAAM,WAAW,2BAA2B;IAC1C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB;AAED;;GAEG;AACH,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,QAAQ,CAAA;CACpB;AAED,MAAM,WAAW,kBAAkB;IACjC,OAAO,CAAC,EAAE,sBAAsB,EAAE,CAAA;IAClC,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,eAAe,CAAA;IACnC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,kBAAkB,CAAC,EAAE,2BAA2B,CAAA;CACjD;AAED,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB,EAAE,cAAc;IAC7E,YAAY,CAAC,EAAE,sBAAsB,CAAA;IACrC,eAAe,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,sBAAsB,GAAG,SAAS,CAAC,CAAC,CAAA;IAC9E,OAAO,CAAC,EAAE,UAAU,CAAA;IACpB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;CACzB"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { CardProps } from '@mui/material';
|
|
2
|
+
import { EmbedPluginVisibilityConfig, XyoEmbedPluginBase } from '../contexts';
|
|
3
|
+
export interface XyoEmbedPluginProps extends XyoEmbedPluginBase, CardProps {
|
|
4
|
+
validateSchema?: boolean;
|
|
5
|
+
hideElementsConfig?: EmbedPluginVisibilityConfig;
|
|
6
|
+
}
|
|
7
|
+
//# sourceMappingURL=XyoEmbedPluginProps.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"XyoEmbedPluginProps.d.ts","sourceRoot":"","sources":["../../../src/types/XyoEmbedPluginProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAEzC,OAAO,EAAE,2BAA2B,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAA;AAE7E,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB,EAAE,SAAS;IACxE,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,kBAAkB,CAAC,EAAE,2BAA2B,CAAA;CACjD"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"XyoEmbedPluginProps.js","sourceRoot":"","sources":["../../../src/types/XyoEmbedPluginProps.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
|
package/package.json
CHANGED
|
@@ -16,13 +16,13 @@
|
|
|
16
16
|
"@mui/material": "^5.10.0",
|
|
17
17
|
"@xylabs/react-flexbox": "^2.14.13",
|
|
18
18
|
"@xylabs/react-shared": "^2.14.13",
|
|
19
|
-
"@xylabs/sdk-js": "^2.6.
|
|
19
|
+
"@xylabs/sdk-js": "^2.6.6",
|
|
20
20
|
"@xyo-network/api": "^2.25.2",
|
|
21
21
|
"@xyo-network/payload": "^2.25.2",
|
|
22
|
-
"@xyo-network/react-auth-service": "^2.27.
|
|
23
|
-
"@xyo-network/react-payload-plugin": "^2.27.
|
|
24
|
-
"@xyo-network/react-shared": "^2.27.
|
|
25
|
-
"@xyo-network/react-webapp": "^2.27.
|
|
22
|
+
"@xyo-network/react-auth-service": "^2.27.32",
|
|
23
|
+
"@xyo-network/react-payload-plugin": "^2.27.32",
|
|
24
|
+
"@xyo-network/react-shared": "^2.27.32",
|
|
25
|
+
"@xyo-network/react-webapp": "^2.27.32",
|
|
26
26
|
"@xyo-network/utils": "^2.25.2",
|
|
27
27
|
"react": "^18.2.0",
|
|
28
28
|
"react-dom": "^18.2.0",
|
|
@@ -31,9 +31,9 @@
|
|
|
31
31
|
"description": "Common React library for all XYO projects that use React",
|
|
32
32
|
"devDependencies": {
|
|
33
33
|
"@storybook/react": "^6.5.10",
|
|
34
|
-
"@xylabs/tsconfig-dom": "^2.5.
|
|
35
|
-
"@xyo-network/react-aggregate-price-plugin": "^2.27.
|
|
36
|
-
"@xyo-network/react-crypto-market-uniswap-payload-plugin": "^2.27.
|
|
34
|
+
"@xylabs/tsconfig-dom": "^2.5.99",
|
|
35
|
+
"@xyo-network/react-aggregate-price-plugin": "^2.27.31",
|
|
36
|
+
"@xyo-network/react-crypto-market-uniswap-payload-plugin": "^2.27.32",
|
|
37
37
|
"react-router-dom": "^6.3.0"
|
|
38
38
|
},
|
|
39
39
|
"browser": "dist/esm/index.js",
|
|
@@ -78,5 +78,5 @@
|
|
|
78
78
|
},
|
|
79
79
|
"sideEffects": false,
|
|
80
80
|
"types": "dist/esm/index.d.ts",
|
|
81
|
-
"version": "2.27.
|
|
81
|
+
"version": "2.27.30"
|
|
82
82
|
}
|
|
@@ -6,7 +6,7 @@ import { BrowserRouter } from 'react-router-dom'
|
|
|
6
6
|
|
|
7
7
|
import { XyoEmbedPlugin } from './XyoEmbedPlugin'
|
|
8
8
|
|
|
9
|
-
const AggregatePricePointer = 'https://api.archivist.xyo.network/
|
|
9
|
+
const AggregatePricePointer = 'https://api.archivist.xyo.network/1948bf4eedf90ee2b8a1f63216b7c6b3b18d7bc2834330d85bcd6ab3d6428a20'
|
|
10
10
|
const UniswapPairPointer = 'https://beta.api.archivist.xyo.network/e36602006239d86b6e08412f7879372b2c622d74f4d6bc508a08a46fa8ad6523'
|
|
11
11
|
|
|
12
12
|
// eslint-disable-next-line import/no-default-export
|
|
@@ -66,4 +66,19 @@ Error.args = {
|
|
|
66
66
|
timestampLabel: 'Last Updated - ',
|
|
67
67
|
}
|
|
68
68
|
|
|
69
|
-
|
|
69
|
+
const HiddenElements = Template.bind({})
|
|
70
|
+
HiddenElements.args = {
|
|
71
|
+
hideElementsConfig: {
|
|
72
|
+
hideAvatar: true,
|
|
73
|
+
hideCardActions: true,
|
|
74
|
+
hideCardHeader: true,
|
|
75
|
+
hideRefreshButton: true,
|
|
76
|
+
hideTimestamp: true,
|
|
77
|
+
hideTitle: true,
|
|
78
|
+
},
|
|
79
|
+
huri: AggregatePricePointer,
|
|
80
|
+
plugins: [CryptoAssetRenderPlugin],
|
|
81
|
+
timestampLabel: 'Last Updated - ',
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
export { AggregatePriceExample, Default, Error, HiddenElements, UniswapPairsExample }
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { ListModeProvider } from '@xyo-network/react-shared'
|
|
2
2
|
|
|
3
3
|
import { ValidatePayloadProvider, XyoEmbedPluginProvider } from '../contexts'
|
|
4
|
+
import { XyoEmbedPluginProps } from '../types'
|
|
4
5
|
import { EmbedPluginContainer, ValidatePayload, ValidatePlugins } from './embed-card'
|
|
5
|
-
import { XyoEmbedPluginProps } from './XyoEmbedPluginProps'
|
|
6
6
|
|
|
7
7
|
export const XyoEmbedPlugin: React.FC<XyoEmbedPluginProps> = ({
|
|
8
8
|
validateSchema,
|
|
@@ -10,12 +10,21 @@ export const XyoEmbedPlugin: React.FC<XyoEmbedPluginProps> = ({
|
|
|
10
10
|
huri,
|
|
11
11
|
refreshTitle = '',
|
|
12
12
|
timestampLabel = 'Data From',
|
|
13
|
+
hideElementsConfig,
|
|
14
|
+
embedPluginConfig,
|
|
13
15
|
...props
|
|
14
16
|
}) => {
|
|
15
17
|
return (
|
|
16
|
-
<XyoEmbedPluginProvider
|
|
18
|
+
<XyoEmbedPluginProvider
|
|
19
|
+
refreshTitle={refreshTitle}
|
|
20
|
+
timestampLabel={timestampLabel}
|
|
21
|
+
plugins={plugins}
|
|
22
|
+
huri={huri}
|
|
23
|
+
embedPluginConfig={embedPluginConfig}
|
|
24
|
+
hideElementsConfig={hideElementsConfig}
|
|
25
|
+
>
|
|
17
26
|
<ValidatePayloadProvider enabled={validateSchema}>
|
|
18
|
-
<ListModeProvider>
|
|
27
|
+
<ListModeProvider defaultListMode={embedPluginConfig?.listMode}>
|
|
19
28
|
<ValidatePlugins>
|
|
20
29
|
<ValidatePayload>
|
|
21
30
|
<EmbedPluginContainer {...props} />
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import RefreshIcon from '@mui/icons-material/Refresh'
|
|
2
|
+
import { Avatar, CardHeader, CardHeaderProps, Chip, Theme } from '@mui/material'
|
|
3
|
+
import { FlexRow } from '@xylabs/react-flexbox'
|
|
4
|
+
|
|
5
|
+
import { useXyoEmbedPluginState } from '../../contexts'
|
|
6
|
+
import { EmbedMenu } from './menu'
|
|
7
|
+
|
|
8
|
+
export const EmbedCardHeader: React.FC<CardHeaderProps> = () => {
|
|
9
|
+
const { activePlugin, payload, timestampLabel, refreshHuri, hideElementsConfig } = useXyoEmbedPluginState()
|
|
10
|
+
const { hideAvatar, hideTitle, hideRefreshButton, hideTimestamp, hideCardActions } = hideElementsConfig ?? {}
|
|
11
|
+
return (
|
|
12
|
+
<CardHeader
|
|
13
|
+
sx={{ flexWrap: 'wrap', rowGap: 1 }}
|
|
14
|
+
avatar={
|
|
15
|
+
hideAvatar ? (
|
|
16
|
+
<></>
|
|
17
|
+
) : (
|
|
18
|
+
<Avatar sx={{ bgcolor: (theme: Theme) => theme.palette.primary.main }} aria-label={activePlugin?.name}>
|
|
19
|
+
{activePlugin?.name?.charAt(0)}
|
|
20
|
+
</Avatar>
|
|
21
|
+
)
|
|
22
|
+
}
|
|
23
|
+
action={
|
|
24
|
+
<FlexRow>
|
|
25
|
+
{payload?.timestamp ? (
|
|
26
|
+
hideTimestamp && hideRefreshButton ? (
|
|
27
|
+
''
|
|
28
|
+
) : (
|
|
29
|
+
<Chip
|
|
30
|
+
avatar={hideRefreshButton ? <></> : <RefreshIcon />}
|
|
31
|
+
clickable
|
|
32
|
+
onClick={refreshHuri}
|
|
33
|
+
label={hideTimestamp ? '' : `${timestampLabel} ${new Date(payload.timestamp).toLocaleString()}`}
|
|
34
|
+
/>
|
|
35
|
+
)
|
|
36
|
+
) : null}
|
|
37
|
+
{hideCardActions ? null : <EmbedMenu />}
|
|
38
|
+
</FlexRow>
|
|
39
|
+
}
|
|
40
|
+
title={hideTitle ? '' : activePlugin?.name}
|
|
41
|
+
/>
|
|
42
|
+
)
|
|
43
|
+
}
|
|
@@ -1,49 +1,23 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
1
|
+
import { Card, CardContent, CardProps } from '@mui/material'
|
|
2
|
+
import { FlexGrowRow } from '@xylabs/react-flexbox'
|
|
3
|
+
import { useListMode } from '@xyo-network/react-shared'
|
|
4
4
|
|
|
5
5
|
import { useXyoEmbedPluginState } from '../../contexts'
|
|
6
6
|
import { EmbedRenderSelect, ListModeSelectFormControl } from '../controls'
|
|
7
|
-
import {
|
|
8
|
-
import { EmbedMenu } from './menu'
|
|
7
|
+
import { EmbedCardHeader } from './EmbedCardHeader'
|
|
9
8
|
|
|
10
|
-
export
|
|
11
|
-
|
|
12
|
-
}
|
|
9
|
+
export const EmbedPluginContainer: React.FC<CardProps> = (props) => {
|
|
10
|
+
const { activePlugin: ActivePlugin, payload, plugins, hideElementsConfig } = useXyoEmbedPluginState()
|
|
11
|
+
const { listMode } = useListMode()
|
|
13
12
|
|
|
14
|
-
export const EmbedPluginContainer: React.FC<EmbedPluginContainerProps> = ({ hideEmbedMenu, ...props }) => {
|
|
15
|
-
const { activePlugin, payload, timestampLabel, refreshHuri, plugins } = useXyoEmbedPluginState()
|
|
16
13
|
return (
|
|
17
14
|
<Card elevation={3} variant="elevation" {...props}>
|
|
18
|
-
<
|
|
19
|
-
sx={{ flexWrap: 'wrap', rowGap: 1 }}
|
|
20
|
-
avatar={
|
|
21
|
-
<Avatar sx={{ bgcolor: (theme: Theme) => theme.palette.primary.main }} aria-label={activePlugin?.name}>
|
|
22
|
-
{activePlugin?.name?.charAt(0)}
|
|
23
|
-
</Avatar>
|
|
24
|
-
}
|
|
25
|
-
action={
|
|
26
|
-
<FlexRow>
|
|
27
|
-
{payload?.timestamp ? (
|
|
28
|
-
<Chip
|
|
29
|
-
avatar={<RefreshIcon />}
|
|
30
|
-
clickable
|
|
31
|
-
onClick={refreshHuri}
|
|
32
|
-
label={`${timestampLabel} ${new Date(payload.timestamp).toLocaleString()}`}
|
|
33
|
-
/>
|
|
34
|
-
) : null}
|
|
35
|
-
{hideEmbedMenu ? null : <EmbedMenu />}
|
|
36
|
-
</FlexRow>
|
|
37
|
-
}
|
|
38
|
-
title={activePlugin?.name}
|
|
39
|
-
/>
|
|
15
|
+
{hideElementsConfig?.hideCardHeader ? null : <EmbedCardHeader />}
|
|
40
16
|
<FlexGrowRow columnGap={2} rowGap={2} flexWrap="wrap" justifyContent="center" pb={1}>
|
|
41
17
|
{plugins && plugins.length > 1 ? <EmbedRenderSelect /> : null}
|
|
42
|
-
{(
|
|
18
|
+
{(ActivePlugin?.components?.box?.listModes?.length ?? 0) > 1 ? <ListModeSelectFormControl /> : null}
|
|
43
19
|
</FlexGrowRow>
|
|
44
|
-
<CardContent>
|
|
45
|
-
<RenderComponent payload={payload} ActivePlugin={activePlugin} />
|
|
46
|
-
</CardContent>
|
|
20
|
+
<CardContent>{ActivePlugin ? <ActivePlugin.components.box.details payload={payload} listMode={listMode} /> : null}</CardContent>
|
|
47
21
|
</Card>
|
|
48
22
|
)
|
|
49
23
|
}
|
|
@@ -9,20 +9,18 @@ import { ResultLoader } from '@xyo-network/react-webapp'
|
|
|
9
9
|
import { useState } from 'react'
|
|
10
10
|
|
|
11
11
|
import { XyoEmbedPluginContext } from './Context'
|
|
12
|
+
import { XyoEmbedPluginBase } from './State'
|
|
12
13
|
|
|
13
|
-
export interface XyoEmbedPluginProviderProps extends FlexBoxProps {
|
|
14
|
-
plugins?: XyoPayloadRenderPlugin[]
|
|
15
|
-
huri?: string
|
|
16
|
-
refreshTitle?: string
|
|
17
|
-
timestampLabel?: string
|
|
18
|
-
}
|
|
14
|
+
export interface XyoEmbedPluginProviderProps extends XyoEmbedPluginBase, FlexBoxProps {}
|
|
19
15
|
|
|
20
16
|
export const XyoEmbedPluginProvider: React.FC<WithChildren<XyoEmbedPluginProviderProps>> = ({
|
|
21
17
|
children,
|
|
22
18
|
refreshTitle,
|
|
23
19
|
timestampLabel,
|
|
20
|
+
hideElementsConfig,
|
|
24
21
|
huri,
|
|
25
22
|
plugins,
|
|
23
|
+
embedPluginConfig,
|
|
26
24
|
...props
|
|
27
25
|
}) => {
|
|
28
26
|
const [payload, setPayload] = useState<XyoPayload>()
|
|
@@ -60,11 +58,24 @@ export const XyoEmbedPluginProvider: React.FC<WithChildren<XyoEmbedPluginProvide
|
|
|
60
58
|
|
|
61
59
|
return (
|
|
62
60
|
<XyoEmbedPluginContext.Provider
|
|
63
|
-
value={{
|
|
61
|
+
value={{
|
|
62
|
+
activePlugin,
|
|
63
|
+
embedPluginConfig,
|
|
64
|
+
hideElementsConfig,
|
|
65
|
+
huri,
|
|
66
|
+
payload,
|
|
67
|
+
provided: true,
|
|
68
|
+
refreshHuri,
|
|
69
|
+
refreshTitle,
|
|
70
|
+
setActivePlugin,
|
|
71
|
+
timestampLabel,
|
|
72
|
+
}}
|
|
64
73
|
>
|
|
65
74
|
<ResultLoader searchResult={payload} notFound={!!notFound} apiError={huriApiError}>
|
|
66
|
-
<XyoApiErrorRender apiError={huriApiError}
|
|
67
|
-
<FlexCol
|
|
75
|
+
<XyoApiErrorRender apiError={huriApiError}>
|
|
76
|
+
<FlexCol busy={Boolean(!refreshPayload && payload)} {...props}>
|
|
77
|
+
{children}
|
|
78
|
+
</FlexCol>
|
|
68
79
|
</XyoApiErrorRender>
|
|
69
80
|
</ResultLoader>
|
|
70
81
|
</XyoEmbedPluginContext.Provider>
|
|
@@ -1,15 +1,37 @@
|
|
|
1
1
|
import { XyoPayload } from '@xyo-network/payload'
|
|
2
2
|
import { XyoPayloadRenderPlugin } from '@xyo-network/react-payload-plugin'
|
|
3
|
-
import { ContextExState } from '@xyo-network/react-shared'
|
|
3
|
+
import { ContextExState, ListMode } from '@xyo-network/react-shared'
|
|
4
4
|
import { Dispatch, SetStateAction } from 'react'
|
|
5
5
|
|
|
6
|
-
export interface
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
6
|
+
export interface EmbedPluginVisibilityConfig {
|
|
7
|
+
hideAvatar?: boolean
|
|
8
|
+
hideTitle?: boolean
|
|
9
|
+
hideRefreshButton?: boolean
|
|
10
|
+
hideTimestamp?: boolean
|
|
11
|
+
hideCardActions?: boolean
|
|
12
|
+
hideCardHeader?: boolean
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* Extend for custom plugin configuration
|
|
17
|
+
*/
|
|
18
|
+
export interface XyoPluginConfig {
|
|
19
|
+
listMode?: ListMode
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
export interface XyoEmbedPluginBase {
|
|
10
23
|
plugins?: XyoPayloadRenderPlugin[]
|
|
11
|
-
|
|
24
|
+
/** XyoEmbedPlugin component configuration */
|
|
25
|
+
embedPluginConfig?: XyoPluginConfig
|
|
12
26
|
huri?: string
|
|
13
27
|
refreshTitle?: string
|
|
14
28
|
timestampLabel?: string
|
|
29
|
+
hideElementsConfig?: EmbedPluginVisibilityConfig
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
export interface XyoEmbedPluginState extends XyoEmbedPluginBase, ContextExState {
|
|
33
|
+
activePlugin?: XyoPayloadRenderPlugin
|
|
34
|
+
setActivePlugin?: Dispatch<SetStateAction<XyoPayloadRenderPlugin | undefined>>
|
|
35
|
+
payload?: XyoPayload
|
|
36
|
+
refreshHuri?: () => void
|
|
15
37
|
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { CardProps } from '@mui/material'
|
|
2
|
+
|
|
3
|
+
import { EmbedPluginVisibilityConfig, XyoEmbedPluginBase } from '../contexts'
|
|
4
|
+
|
|
5
|
+
export interface XyoEmbedPluginProps extends XyoEmbedPluginBase, CardProps {
|
|
6
|
+
validateSchema?: boolean
|
|
7
|
+
hideElementsConfig?: EmbedPluginVisibilityConfig
|
|
8
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './XyoEmbedPluginProps'
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { XyoPayload } from '@xyo-network/payload'
|
|
2
|
-
import { XyoPayloadRenderPlugin } from '@xyo-network/react-payload-plugin'
|
|
3
|
-
import { useListMode } from '@xyo-network/react-shared'
|
|
4
|
-
|
|
5
|
-
interface RenderComponentProps {
|
|
6
|
-
ActivePlugin?: XyoPayloadRenderPlugin
|
|
7
|
-
payload?: XyoPayload
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
export const RenderComponent: React.FC<RenderComponentProps> = ({ ActivePlugin, payload }) => {
|
|
11
|
-
const { listMode } = useListMode()
|
|
12
|
-
return <>{ActivePlugin ? <ActivePlugin.components.box.details payload={payload} listMode={listMode} /> : null}</>
|
|
13
|
-
}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { CardProps } from '@mui/material'
|
|
2
|
-
import { XyoPayloadRenderPlugin } from '@xyo-network/react-payload-plugin'
|
|
3
|
-
|
|
4
|
-
export interface XyoEmbedPluginProps extends CardProps {
|
|
5
|
-
plugins?: XyoPayloadRenderPlugin[]
|
|
6
|
-
huri?: string
|
|
7
|
-
refreshTitle?: string
|
|
8
|
-
timestampLabel?: string
|
|
9
|
-
validateSchema?: boolean
|
|
10
|
-
}
|