@fluid-app/rep-widgets 0.1.15 → 0.1.16
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/EmbedWidget-B7RFGTJB.js +3 -0
- package/dist/{EmbedWidget-JCTT47DQ.js.map → EmbedWidget-B7RFGTJB.js.map} +1 -1
- package/dist/EmbedWidget-RETHBVTD.cjs +16 -0
- package/dist/{EmbedWidget-HJH4Q5EH.cjs.map → EmbedWidget-RETHBVTD.cjs.map} +1 -1
- package/dist/{chunk-HOFHBVGL.js → chunk-SINQXEBL.js} +44 -17
- package/dist/chunk-SINQXEBL.js.map +1 -0
- package/dist/{chunk-VB5MPLLG.cjs → chunk-WWKBIVET.cjs} +44 -17
- package/dist/chunk-WWKBIVET.cjs.map +1 -0
- package/dist/widgets/index.cjs +4 -4
- package/dist/widgets/index.d.cts +3 -1
- package/dist/widgets/index.d.ts +3 -1
- package/dist/widgets/index.js +2 -2
- package/package.json +3 -3
- package/dist/EmbedWidget-HJH4Q5EH.cjs +0 -16
- package/dist/EmbedWidget-JCTT47DQ.js +0 -3
- package/dist/chunk-HOFHBVGL.js.map +0 -1
- package/dist/chunk-VB5MPLLG.cjs.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"EmbedWidget-
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"EmbedWidget-B7RFGTJB.js"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var chunkWWKBIVET_cjs = require('./chunk-WWKBIVET.cjs');
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
Object.defineProperty(exports, "EmbedWidget", {
|
|
8
|
+
enumerable: true,
|
|
9
|
+
get: function () { return chunkWWKBIVET_cjs.EmbedWidget; }
|
|
10
|
+
});
|
|
11
|
+
Object.defineProperty(exports, "embedWidgetPropertySchema", {
|
|
12
|
+
enumerable: true,
|
|
13
|
+
get: function () { return chunkWWKBIVET_cjs.embedWidgetPropertySchema; }
|
|
14
|
+
});
|
|
15
|
+
//# sourceMappingURL=EmbedWidget-RETHBVTD.cjs.map
|
|
16
|
+
//# sourceMappingURL=EmbedWidget-RETHBVTD.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"EmbedWidget-
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"EmbedWidget-RETHBVTD.cjs"}
|
|
@@ -12,6 +12,8 @@ function EmbedWidget({
|
|
|
12
12
|
allowFullscreen = true,
|
|
13
13
|
loading = "lazy",
|
|
14
14
|
borderRadius = "md",
|
|
15
|
+
editMode = false,
|
|
16
|
+
isSelected = false,
|
|
15
17
|
className,
|
|
16
18
|
...props
|
|
17
19
|
}) {
|
|
@@ -31,24 +33,49 @@ function EmbedWidget({
|
|
|
31
33
|
}
|
|
32
34
|
);
|
|
33
35
|
}
|
|
34
|
-
|
|
36
|
+
const normalizedUrl = url.startsWith("http://") || url.startsWith("https://") ? url : `https://${url}`;
|
|
37
|
+
let isValidUrl = false;
|
|
38
|
+
try {
|
|
39
|
+
const parsed = new URL(normalizedUrl);
|
|
40
|
+
isValidUrl = (parsed.protocol === "http:" || parsed.protocol === "https:") && (parsed.hostname.includes(".") || parsed.hostname === "localhost");
|
|
41
|
+
} catch {
|
|
42
|
+
}
|
|
43
|
+
if (!isValidUrl) {
|
|
44
|
+
return /* @__PURE__ */ jsx(
|
|
45
|
+
"div",
|
|
46
|
+
{
|
|
47
|
+
className: `flex items-center justify-center rounded-${borderRadius} border-border bg-muted text-muted-foreground border-2 border-dashed ${isFullScreen ? "h-full" : ""} ${className}`,
|
|
48
|
+
style: isFullScreen ? void 0 : { height },
|
|
49
|
+
...props,
|
|
50
|
+
children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-2 p-6 text-center", children: [
|
|
51
|
+
/* @__PURE__ */ jsx(FontAwesomeIcon, { icon: faGlobe, className: "h-12 w-12 opacity-50" }),
|
|
52
|
+
/* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: "Enter a URL to embed external content" }),
|
|
53
|
+
/* @__PURE__ */ jsx("p", { className: "text-xs opacity-75", children: "Configure the URL in the properties panel" })
|
|
54
|
+
] })
|
|
55
|
+
}
|
|
56
|
+
);
|
|
57
|
+
}
|
|
58
|
+
return /* @__PURE__ */ jsxs(
|
|
35
59
|
"div",
|
|
36
60
|
{
|
|
37
|
-
className: `w-full ${isFullScreen ? "h-full" : ""} ${className}`,
|
|
61
|
+
className: `relative w-full ${isFullScreen ? "h-full" : ""} ${className}`,
|
|
38
62
|
...props,
|
|
39
|
-
children:
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
63
|
+
children: [
|
|
64
|
+
/* @__PURE__ */ jsx(
|
|
65
|
+
"iframe",
|
|
66
|
+
{
|
|
67
|
+
src: normalizedUrl,
|
|
68
|
+
title,
|
|
69
|
+
width: "100%",
|
|
70
|
+
style: isFullScreen ? { height: "100%" } : { height },
|
|
71
|
+
loading,
|
|
72
|
+
allowFullScreen: allowFullscreen,
|
|
73
|
+
className: `rounded-${borderRadius} border-border border`,
|
|
74
|
+
sandbox: "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox"
|
|
75
|
+
}
|
|
76
|
+
),
|
|
77
|
+
editMode && !isSelected && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-10" })
|
|
78
|
+
]
|
|
52
79
|
}
|
|
53
80
|
);
|
|
54
81
|
}
|
|
@@ -129,5 +156,5 @@ var embedWidgetPropertySchema = {
|
|
|
129
156
|
};
|
|
130
157
|
|
|
131
158
|
export { EmbedWidget, embedWidgetPropertySchema };
|
|
132
|
-
//# sourceMappingURL=chunk-
|
|
133
|
-
//# sourceMappingURL=chunk-
|
|
159
|
+
//# sourceMappingURL=chunk-SINQXEBL.js.map
|
|
160
|
+
//# sourceMappingURL=chunk-SINQXEBL.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/widgets/EmbedWidget.tsx"],"names":[],"mappings":"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","file":"chunk-SINQXEBL.js","sourcesContent":["import { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faGlobe } from \"@fortawesome/pro-regular-svg-icons\";\nimport type { ComponentProps } from \"react\";\nimport {\n getBorderRadiusField,\n getHeightField,\n type WidgetPropertySchema,\n} from \"@fluid-app/rep-core/registries\";\nimport type { BorderRadiusOptions } from \"@fluid-app/rep-core/types\";\n\ntype EmbedWidgetProps = ComponentProps<\"div\"> & {\n url?: string;\n title?: string;\n height?: string;\n fullScreen?: boolean;\n allowFullscreen?: boolean;\n loading?: \"eager\" | \"lazy\";\n borderRadius?: BorderRadiusOptions;\n editMode?: boolean;\n isSelected?: boolean;\n};\n\nexport function EmbedWidget({\n url = \"\",\n title = \"Embedded Content\",\n height = \"400px\",\n fullScreen = false,\n allowFullscreen = true,\n loading = \"lazy\",\n borderRadius = \"md\",\n editMode = false,\n isSelected = false,\n className,\n ...props\n}: EmbedWidgetProps) {\n const isFullScreen = fullScreen;\n\n // Show placeholder if no URL is provided\n if (!url) {\n return (\n <div\n className={`flex items-center justify-center rounded-${borderRadius} border-border bg-muted text-muted-foreground border-2 border-dashed ${isFullScreen ? \"h-full\" : \"\"} ${className}`}\n style={isFullScreen ? undefined : { height }}\n {...props}\n >\n <div className=\"flex flex-col items-center gap-2 p-6 text-center\">\n <FontAwesomeIcon icon={faGlobe} className=\"h-12 w-12 opacity-50\" />\n <p className=\"text-sm font-medium\">\n Enter a URL to embed external content\n </p>\n <p className=\"text-xs opacity-75\">\n Configure the URL in the properties panel\n </p>\n </div>\n </div>\n );\n }\n\n const normalizedUrl =\n url.startsWith(\"http://\") || url.startsWith(\"https://\")\n ? url\n : `https://${url}`;\n\n let isValidUrl = false;\n try {\n const parsed = new URL(normalizedUrl);\n isValidUrl =\n (parsed.protocol === \"http:\" || parsed.protocol === \"https:\") &&\n (parsed.hostname.includes(\".\") || parsed.hostname === \"localhost\");\n } catch {\n // invalid URL\n }\n\n if (!isValidUrl) {\n return (\n <div\n className={`flex items-center justify-center rounded-${borderRadius} border-border bg-muted text-muted-foreground border-2 border-dashed ${isFullScreen ? \"h-full\" : \"\"} ${className}`}\n style={isFullScreen ? undefined : { height }}\n {...props}\n >\n <div className=\"flex flex-col items-center gap-2 p-6 text-center\">\n <FontAwesomeIcon icon={faGlobe} className=\"h-12 w-12 opacity-50\" />\n <p className=\"text-sm font-medium\">\n Enter a URL to embed external content\n </p>\n <p className=\"text-xs opacity-75\">\n Configure the URL in the properties panel\n </p>\n </div>\n </div>\n );\n }\n\n return (\n <div\n className={`relative w-full ${isFullScreen ? \"h-full\" : \"\"} ${className}`}\n {...props}\n >\n <iframe\n src={normalizedUrl}\n title={title}\n width=\"100%\"\n style={isFullScreen ? { height: \"100%\" } : { height }}\n loading={loading}\n allowFullScreen={allowFullscreen}\n className={`rounded-${borderRadius} border-border border`}\n sandbox=\"allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox\"\n />\n {editMode && !isSelected && <div className=\"absolute inset-0 z-10\" />}\n </div>\n );\n}\n\nexport const embedWidgetPropertySchema: WidgetPropertySchema = {\n widgetType: \"EmbedWidget\",\n displayName: \"Embed\",\n fields: [\n // Content\n {\n key: \"url\",\n label: \"URL\",\n type: \"text\",\n description: \"The URL of the external site to embed\",\n placeholder: \"https://example.com\",\n defaultValue: \"\",\n group: \"Content\",\n },\n {\n key: \"title\",\n label: \"Title\",\n type: \"text\",\n description: \"Accessibility title for the embedded content\",\n defaultValue: \"Embedded Content\",\n group: \"Content\",\n },\n\n // Design\n getBorderRadiusField({\n key: \"borderRadius\",\n label: \"Border Radius\",\n description: \"Border radius for the embed container\",\n defaultValue: \"md\",\n group: \"Design\",\n }),\n {\n key: \"fullScreen\",\n label: \"Full Screen\",\n type: \"boolean\",\n description: \"When enabled, the embed fills the available space\",\n defaultValue: false,\n group: \"Design\",\n },\n getHeightField({\n key: \"height\",\n label: \"Height\",\n description: \"Height of the embedded iframe\",\n min: 50,\n max: 1200,\n step: 10,\n defaultValue: \"400px\",\n group: \"Design\",\n requiresKeyValue: {\n key: \"fullScreen\",\n value: false,\n },\n }),\n\n // Settings\n {\n key: \"allowFullscreen\",\n label: \"Allow Fullscreen\",\n type: \"boolean\",\n description: \"Allow the embedded content to use fullscreen mode\",\n defaultValue: true,\n group: \"Settings\",\n },\n {\n key: \"loading\",\n label: \"Loading\",\n type: \"select\",\n description: \"When to load the embedded content\",\n options: [\n { label: \"Lazy (on scroll)\", value: \"lazy\" },\n { label: \"Eager (immediately)\", value: \"eager\" },\n ],\n defaultValue: \"lazy\",\n group: \"Settings\",\n },\n ],\n};\n"]}
|
|
@@ -14,6 +14,8 @@ function EmbedWidget({
|
|
|
14
14
|
allowFullscreen = true,
|
|
15
15
|
loading = "lazy",
|
|
16
16
|
borderRadius = "md",
|
|
17
|
+
editMode = false,
|
|
18
|
+
isSelected = false,
|
|
17
19
|
className,
|
|
18
20
|
...props
|
|
19
21
|
}) {
|
|
@@ -33,24 +35,49 @@ function EmbedWidget({
|
|
|
33
35
|
}
|
|
34
36
|
);
|
|
35
37
|
}
|
|
36
|
-
|
|
38
|
+
const normalizedUrl = url.startsWith("http://") || url.startsWith("https://") ? url : `https://${url}`;
|
|
39
|
+
let isValidUrl = false;
|
|
40
|
+
try {
|
|
41
|
+
const parsed = new URL(normalizedUrl);
|
|
42
|
+
isValidUrl = (parsed.protocol === "http:" || parsed.protocol === "https:") && (parsed.hostname.includes(".") || parsed.hostname === "localhost");
|
|
43
|
+
} catch {
|
|
44
|
+
}
|
|
45
|
+
if (!isValidUrl) {
|
|
46
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
47
|
+
"div",
|
|
48
|
+
{
|
|
49
|
+
className: `flex items-center justify-center rounded-${borderRadius} border-border bg-muted text-muted-foreground border-2 border-dashed ${isFullScreen ? "h-full" : ""} ${className}`,
|
|
50
|
+
style: isFullScreen ? void 0 : { height },
|
|
51
|
+
...props,
|
|
52
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-2 p-6 text-center", children: [
|
|
53
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactFontawesome.FontAwesomeIcon, { icon: proRegularSvgIcons.faGlobe, className: "h-12 w-12 opacity-50" }),
|
|
54
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium", children: "Enter a URL to embed external content" }),
|
|
55
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs opacity-75", children: "Configure the URL in the properties panel" })
|
|
56
|
+
] })
|
|
57
|
+
}
|
|
58
|
+
);
|
|
59
|
+
}
|
|
60
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
37
61
|
"div",
|
|
38
62
|
{
|
|
39
|
-
className: `w-full ${isFullScreen ? "h-full" : ""} ${className}`,
|
|
63
|
+
className: `relative w-full ${isFullScreen ? "h-full" : ""} ${className}`,
|
|
40
64
|
...props,
|
|
41
|
-
children:
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
65
|
+
children: [
|
|
66
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
67
|
+
"iframe",
|
|
68
|
+
{
|
|
69
|
+
src: normalizedUrl,
|
|
70
|
+
title,
|
|
71
|
+
width: "100%",
|
|
72
|
+
style: isFullScreen ? { height: "100%" } : { height },
|
|
73
|
+
loading,
|
|
74
|
+
allowFullScreen: allowFullscreen,
|
|
75
|
+
className: `rounded-${borderRadius} border-border border`,
|
|
76
|
+
sandbox: "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox"
|
|
77
|
+
}
|
|
78
|
+
),
|
|
79
|
+
editMode && !isSelected && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 z-10" })
|
|
80
|
+
]
|
|
54
81
|
}
|
|
55
82
|
);
|
|
56
83
|
}
|
|
@@ -132,5 +159,5 @@ var embedWidgetPropertySchema = {
|
|
|
132
159
|
|
|
133
160
|
exports.EmbedWidget = EmbedWidget;
|
|
134
161
|
exports.embedWidgetPropertySchema = embedWidgetPropertySchema;
|
|
135
|
-
//# sourceMappingURL=chunk-
|
|
136
|
-
//# sourceMappingURL=chunk-
|
|
162
|
+
//# sourceMappingURL=chunk-WWKBIVET.cjs.map
|
|
163
|
+
//# sourceMappingURL=chunk-WWKBIVET.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/widgets/EmbedWidget.tsx"],"names":["jsx","jsxs","FontAwesomeIcon","faGlobe","getBorderRadiusField","getHeightField"],"mappings":"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","file":"chunk-WWKBIVET.cjs","sourcesContent":["import { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faGlobe } from \"@fortawesome/pro-regular-svg-icons\";\nimport type { ComponentProps } from \"react\";\nimport {\n getBorderRadiusField,\n getHeightField,\n type WidgetPropertySchema,\n} from \"@fluid-app/rep-core/registries\";\nimport type { BorderRadiusOptions } from \"@fluid-app/rep-core/types\";\n\ntype EmbedWidgetProps = ComponentProps<\"div\"> & {\n url?: string;\n title?: string;\n height?: string;\n fullScreen?: boolean;\n allowFullscreen?: boolean;\n loading?: \"eager\" | \"lazy\";\n borderRadius?: BorderRadiusOptions;\n editMode?: boolean;\n isSelected?: boolean;\n};\n\nexport function EmbedWidget({\n url = \"\",\n title = \"Embedded Content\",\n height = \"400px\",\n fullScreen = false,\n allowFullscreen = true,\n loading = \"lazy\",\n borderRadius = \"md\",\n editMode = false,\n isSelected = false,\n className,\n ...props\n}: EmbedWidgetProps) {\n const isFullScreen = fullScreen;\n\n // Show placeholder if no URL is provided\n if (!url) {\n return (\n <div\n className={`flex items-center justify-center rounded-${borderRadius} border-border bg-muted text-muted-foreground border-2 border-dashed ${isFullScreen ? \"h-full\" : \"\"} ${className}`}\n style={isFullScreen ? undefined : { height }}\n {...props}\n >\n <div className=\"flex flex-col items-center gap-2 p-6 text-center\">\n <FontAwesomeIcon icon={faGlobe} className=\"h-12 w-12 opacity-50\" />\n <p className=\"text-sm font-medium\">\n Enter a URL to embed external content\n </p>\n <p className=\"text-xs opacity-75\">\n Configure the URL in the properties panel\n </p>\n </div>\n </div>\n );\n }\n\n const normalizedUrl =\n url.startsWith(\"http://\") || url.startsWith(\"https://\")\n ? url\n : `https://${url}`;\n\n let isValidUrl = false;\n try {\n const parsed = new URL(normalizedUrl);\n isValidUrl =\n (parsed.protocol === \"http:\" || parsed.protocol === \"https:\") &&\n (parsed.hostname.includes(\".\") || parsed.hostname === \"localhost\");\n } catch {\n // invalid URL\n }\n\n if (!isValidUrl) {\n return (\n <div\n className={`flex items-center justify-center rounded-${borderRadius} border-border bg-muted text-muted-foreground border-2 border-dashed ${isFullScreen ? \"h-full\" : \"\"} ${className}`}\n style={isFullScreen ? undefined : { height }}\n {...props}\n >\n <div className=\"flex flex-col items-center gap-2 p-6 text-center\">\n <FontAwesomeIcon icon={faGlobe} className=\"h-12 w-12 opacity-50\" />\n <p className=\"text-sm font-medium\">\n Enter a URL to embed external content\n </p>\n <p className=\"text-xs opacity-75\">\n Configure the URL in the properties panel\n </p>\n </div>\n </div>\n );\n }\n\n return (\n <div\n className={`relative w-full ${isFullScreen ? \"h-full\" : \"\"} ${className}`}\n {...props}\n >\n <iframe\n src={normalizedUrl}\n title={title}\n width=\"100%\"\n style={isFullScreen ? { height: \"100%\" } : { height }}\n loading={loading}\n allowFullScreen={allowFullscreen}\n className={`rounded-${borderRadius} border-border border`}\n sandbox=\"allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox\"\n />\n {editMode && !isSelected && <div className=\"absolute inset-0 z-10\" />}\n </div>\n );\n}\n\nexport const embedWidgetPropertySchema: WidgetPropertySchema = {\n widgetType: \"EmbedWidget\",\n displayName: \"Embed\",\n fields: [\n // Content\n {\n key: \"url\",\n label: \"URL\",\n type: \"text\",\n description: \"The URL of the external site to embed\",\n placeholder: \"https://example.com\",\n defaultValue: \"\",\n group: \"Content\",\n },\n {\n key: \"title\",\n label: \"Title\",\n type: \"text\",\n description: \"Accessibility title for the embedded content\",\n defaultValue: \"Embedded Content\",\n group: \"Content\",\n },\n\n // Design\n getBorderRadiusField({\n key: \"borderRadius\",\n label: \"Border Radius\",\n description: \"Border radius for the embed container\",\n defaultValue: \"md\",\n group: \"Design\",\n }),\n {\n key: \"fullScreen\",\n label: \"Full Screen\",\n type: \"boolean\",\n description: \"When enabled, the embed fills the available space\",\n defaultValue: false,\n group: \"Design\",\n },\n getHeightField({\n key: \"height\",\n label: \"Height\",\n description: \"Height of the embedded iframe\",\n min: 50,\n max: 1200,\n step: 10,\n defaultValue: \"400px\",\n group: \"Design\",\n requiresKeyValue: {\n key: \"fullScreen\",\n value: false,\n },\n }),\n\n // Settings\n {\n key: \"allowFullscreen\",\n label: \"Allow Fullscreen\",\n type: \"boolean\",\n description: \"Allow the embedded content to use fullscreen mode\",\n defaultValue: true,\n group: \"Settings\",\n },\n {\n key: \"loading\",\n label: \"Loading\",\n type: \"select\",\n description: \"When to load the embedded content\",\n options: [\n { label: \"Lazy (on scroll)\", value: \"lazy\" },\n { label: \"Eager (immediately)\", value: \"eager\" },\n ],\n defaultValue: \"lazy\",\n group: \"Settings\",\n },\n ],\n};\n"]}
|
package/dist/widgets/index.cjs
CHANGED
|
@@ -13,7 +13,7 @@ var chunkWTQNKZKV_cjs = require('../chunk-WTQNKZKV.cjs');
|
|
|
13
13
|
var chunkP6AKK6TA_cjs = require('../chunk-P6AKK6TA.cjs');
|
|
14
14
|
var chunkHREBEVS5_cjs = require('../chunk-HREBEVS5.cjs');
|
|
15
15
|
var chunkRPNLSRUS_cjs = require('../chunk-RPNLSRUS.cjs');
|
|
16
|
-
var
|
|
16
|
+
var chunkWWKBIVET_cjs = require('../chunk-WWKBIVET.cjs');
|
|
17
17
|
var chunkQ5YXTDPX_cjs = require('../chunk-Q5YXTDPX.cjs');
|
|
18
18
|
var chunkNPTCR22X_cjs = require('../chunk-NPTCR22X.cjs');
|
|
19
19
|
require('../chunk-FSLUSFJ2.cjs');
|
|
@@ -35,7 +35,7 @@ var widgetPropertySchemas = {
|
|
|
35
35
|
CatchUpWidget: () => import('../CatchUpWidget-XBU2GPFS.cjs').then((m) => m.catchUpWidgetPropertySchema),
|
|
36
36
|
ChartWidget: () => import('../ChartWidget-463QVROY.cjs').then((m) => m.chartWidgetPropertySchema),
|
|
37
37
|
ContainerWidget: () => import('../ContainerWidget-IOXW77X7.cjs').then((m) => m.containerWidgetPropertySchema),
|
|
38
|
-
EmbedWidget: () => import('../EmbedWidget-
|
|
38
|
+
EmbedWidget: () => import('../EmbedWidget-RETHBVTD.cjs').then((m) => m.embedWidgetPropertySchema),
|
|
39
39
|
ImageWidget: () => import('../ImageWidget-SBC7LK7A.cjs').then((m) => m.imageWidgetPropertySchema),
|
|
40
40
|
LayoutWidget: () => import('../LayoutWidget-F3BDSGDP.cjs').then((m) => m.layoutWidgetPropertySchema),
|
|
41
41
|
ListWidget: () => import('../ListWidget-4PKBMBAS.cjs').then((m) => m.listWidgetPropertySchema),
|
|
@@ -158,11 +158,11 @@ Object.defineProperty(exports, "layoutWidgetPropertySchema", {
|
|
|
158
158
|
});
|
|
159
159
|
Object.defineProperty(exports, "EmbedWidget", {
|
|
160
160
|
enumerable: true,
|
|
161
|
-
get: function () { return
|
|
161
|
+
get: function () { return chunkWWKBIVET_cjs.EmbedWidget; }
|
|
162
162
|
});
|
|
163
163
|
Object.defineProperty(exports, "embedWidgetPropertySchema", {
|
|
164
164
|
enumerable: true,
|
|
165
|
-
get: function () { return
|
|
165
|
+
get: function () { return chunkWWKBIVET_cjs.embedWidgetPropertySchema; }
|
|
166
166
|
});
|
|
167
167
|
Object.defineProperty(exports, "ImageWidget", {
|
|
168
168
|
enumerable: true,
|
package/dist/widgets/index.d.cts
CHANGED
|
@@ -262,8 +262,10 @@ type EmbedWidgetProps = ComponentProps<"div"> & {
|
|
|
262
262
|
allowFullscreen?: boolean;
|
|
263
263
|
loading?: "eager" | "lazy";
|
|
264
264
|
borderRadius?: BorderRadiusOptions;
|
|
265
|
+
editMode?: boolean;
|
|
266
|
+
isSelected?: boolean;
|
|
265
267
|
};
|
|
266
|
-
declare function EmbedWidget({ url, title, height, fullScreen, allowFullscreen, loading, borderRadius, className, ...props }: EmbedWidgetProps): react_jsx_runtime.JSX.Element;
|
|
268
|
+
declare function EmbedWidget({ url, title, height, fullScreen, allowFullscreen, loading, borderRadius, editMode, isSelected, className, ...props }: EmbedWidgetProps): react_jsx_runtime.JSX.Element;
|
|
267
269
|
declare const embedWidgetPropertySchema: WidgetPropertySchema;
|
|
268
270
|
|
|
269
271
|
type ImageWidgetProps = ComponentProps<"div"> & {
|
package/dist/widgets/index.d.ts
CHANGED
|
@@ -262,8 +262,10 @@ type EmbedWidgetProps = ComponentProps<"div"> & {
|
|
|
262
262
|
allowFullscreen?: boolean;
|
|
263
263
|
loading?: "eager" | "lazy";
|
|
264
264
|
borderRadius?: BorderRadiusOptions;
|
|
265
|
+
editMode?: boolean;
|
|
266
|
+
isSelected?: boolean;
|
|
265
267
|
};
|
|
266
|
-
declare function EmbedWidget({ url, title, height, fullScreen, allowFullscreen, loading, borderRadius, className, ...props }: EmbedWidgetProps): react_jsx_runtime.JSX.Element;
|
|
268
|
+
declare function EmbedWidget({ url, title, height, fullScreen, allowFullscreen, loading, borderRadius, editMode, isSelected, className, ...props }: EmbedWidgetProps): react_jsx_runtime.JSX.Element;
|
|
267
269
|
declare const embedWidgetPropertySchema: WidgetPropertySchema;
|
|
268
270
|
|
|
269
271
|
type ImageWidgetProps = ComponentProps<"div"> & {
|
package/dist/widgets/index.js
CHANGED
|
@@ -11,7 +11,7 @@ export { CatchUpWidget, catchUpWidgetPropertySchema } from '../chunk-QB6UW6DD.js
|
|
|
11
11
|
export { ChartWidget, chartWidgetPropertySchema } from '../chunk-UZF75XZJ.js';
|
|
12
12
|
export { ContainerWidget, containerWidgetPropertySchema } from '../chunk-E5ERYB7Q.js';
|
|
13
13
|
export { LayoutWidget, layoutWidgetPropertySchema } from '../chunk-2NPVYROG.js';
|
|
14
|
-
export { EmbedWidget, embedWidgetPropertySchema } from '../chunk-
|
|
14
|
+
export { EmbedWidget, embedWidgetPropertySchema } from '../chunk-SINQXEBL.js';
|
|
15
15
|
export { ImageWidget, imageWidgetPropertySchema } from '../chunk-UZ7TYGUO.js';
|
|
16
16
|
export { ListWidget, listWidgetPropertySchema } from '../chunk-HDUFHTQC.js';
|
|
17
17
|
import '../chunk-RKDOQV4T.js';
|
|
@@ -33,7 +33,7 @@ var widgetPropertySchemas = {
|
|
|
33
33
|
CatchUpWidget: () => import('../CatchUpWidget-NEMYZ7L5.js').then((m) => m.catchUpWidgetPropertySchema),
|
|
34
34
|
ChartWidget: () => import('../ChartWidget-554S2GQF.js').then((m) => m.chartWidgetPropertySchema),
|
|
35
35
|
ContainerWidget: () => import('../ContainerWidget-OLQPEXDT.js').then((m) => m.containerWidgetPropertySchema),
|
|
36
|
-
EmbedWidget: () => import('../EmbedWidget-
|
|
36
|
+
EmbedWidget: () => import('../EmbedWidget-B7RFGTJB.js').then((m) => m.embedWidgetPropertySchema),
|
|
37
37
|
ImageWidget: () => import('../ImageWidget-BA2V3DPL.js').then((m) => m.imageWidgetPropertySchema),
|
|
38
38
|
LayoutWidget: () => import('../LayoutWidget-MBUJVGKA.js').then((m) => m.layoutWidgetPropertySchema),
|
|
39
39
|
ListWidget: () => import('../ListWidget-6SZK6X3X.js').then((m) => m.listWidgetPropertySchema),
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluid-app/rep-widgets",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.16",
|
|
4
4
|
"description": "Widget components for the Fluid rep platform",
|
|
5
5
|
"files": [
|
|
6
6
|
"dist",
|
|
@@ -79,8 +79,8 @@
|
|
|
79
79
|
"tailwind-merge": "^3.0.2",
|
|
80
80
|
"tailwindcss": "^4.1.18",
|
|
81
81
|
"tw-animate-css": "^1.4.0",
|
|
82
|
-
"@fluid-app/
|
|
83
|
-
"@fluid-app/
|
|
82
|
+
"@fluid-app/rep-core": "0.1.12",
|
|
83
|
+
"@fluid-app/ui-primitives": "0.1.5"
|
|
84
84
|
},
|
|
85
85
|
"devDependencies": {
|
|
86
86
|
"@tanstack/react-query": "^5.90.11",
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var chunkVB5MPLLG_cjs = require('./chunk-VB5MPLLG.cjs');
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
Object.defineProperty(exports, "EmbedWidget", {
|
|
8
|
-
enumerable: true,
|
|
9
|
-
get: function () { return chunkVB5MPLLG_cjs.EmbedWidget; }
|
|
10
|
-
});
|
|
11
|
-
Object.defineProperty(exports, "embedWidgetPropertySchema", {
|
|
12
|
-
enumerable: true,
|
|
13
|
-
get: function () { return chunkVB5MPLLG_cjs.embedWidgetPropertySchema; }
|
|
14
|
-
});
|
|
15
|
-
//# sourceMappingURL=EmbedWidget-HJH4Q5EH.cjs.map
|
|
16
|
-
//# sourceMappingURL=EmbedWidget-HJH4Q5EH.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/widgets/EmbedWidget.tsx"],"names":[],"mappings":"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","file":"chunk-HOFHBVGL.js","sourcesContent":["import { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faGlobe } from \"@fortawesome/pro-regular-svg-icons\";\nimport type { ComponentProps } from \"react\";\nimport {\n getBorderRadiusField,\n getHeightField,\n type WidgetPropertySchema,\n} from \"@fluid-app/rep-core/registries\";\nimport type { BorderRadiusOptions } from \"@fluid-app/rep-core/types\";\n\ntype EmbedWidgetProps = ComponentProps<\"div\"> & {\n url?: string;\n title?: string;\n height?: string;\n fullScreen?: boolean;\n allowFullscreen?: boolean;\n loading?: \"eager\" | \"lazy\";\n borderRadius?: BorderRadiusOptions;\n};\n\nexport function EmbedWidget({\n url = \"\",\n title = \"Embedded Content\",\n height = \"400px\",\n fullScreen = false,\n allowFullscreen = true,\n loading = \"lazy\",\n borderRadius = \"md\",\n className,\n ...props\n}: EmbedWidgetProps) {\n const isFullScreen = fullScreen;\n\n // Show placeholder if no URL is provided\n if (!url) {\n return (\n <div\n className={`flex items-center justify-center rounded-${borderRadius} border-border bg-muted text-muted-foreground border-2 border-dashed ${isFullScreen ? \"h-full\" : \"\"} ${className}`}\n style={isFullScreen ? undefined : { height }}\n {...props}\n >\n <div className=\"flex flex-col items-center gap-2 p-6 text-center\">\n <FontAwesomeIcon icon={faGlobe} className=\"h-12 w-12 opacity-50\" />\n <p className=\"text-sm font-medium\">\n Enter a URL to embed external content\n </p>\n <p className=\"text-xs opacity-75\">\n Configure the URL in the properties panel\n </p>\n </div>\n </div>\n );\n }\n\n return (\n <div\n className={`w-full ${isFullScreen ? \"h-full\" : \"\"} ${className}`}\n {...props}\n >\n <iframe\n src={url}\n title={title}\n width=\"100%\"\n height={isFullScreen ? \"100%\" : height}\n loading={loading}\n allowFullScreen={allowFullscreen}\n className={`rounded-${borderRadius} border-border border`}\n sandbox=\"allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox\"\n />\n </div>\n );\n}\n\nexport const embedWidgetPropertySchema: WidgetPropertySchema = {\n widgetType: \"EmbedWidget\",\n displayName: \"Embed\",\n fields: [\n // Content\n {\n key: \"url\",\n label: \"URL\",\n type: \"text\",\n description: \"The URL of the external site to embed\",\n placeholder: \"https://example.com\",\n defaultValue: \"\",\n group: \"Content\",\n },\n {\n key: \"title\",\n label: \"Title\",\n type: \"text\",\n description: \"Accessibility title for the embedded content\",\n defaultValue: \"Embedded Content\",\n group: \"Content\",\n },\n\n // Design\n getBorderRadiusField({\n key: \"borderRadius\",\n label: \"Border Radius\",\n description: \"Border radius for the embed container\",\n defaultValue: \"md\",\n group: \"Design\",\n }),\n {\n key: \"fullScreen\",\n label: \"Full Screen\",\n type: \"boolean\",\n description: \"When enabled, the embed fills the available space\",\n defaultValue: false,\n group: \"Design\",\n },\n getHeightField({\n key: \"height\",\n label: \"Height\",\n description: \"Height of the embedded iframe\",\n min: 50,\n max: 1200,\n step: 10,\n defaultValue: \"400px\",\n group: \"Design\",\n requiresKeyValue: {\n key: \"fullScreen\",\n value: false,\n },\n }),\n\n // Settings\n {\n key: \"allowFullscreen\",\n label: \"Allow Fullscreen\",\n type: \"boolean\",\n description: \"Allow the embedded content to use fullscreen mode\",\n defaultValue: true,\n group: \"Settings\",\n },\n {\n key: \"loading\",\n label: \"Loading\",\n type: \"select\",\n description: \"When to load the embedded content\",\n options: [\n { label: \"Lazy (on scroll)\", value: \"lazy\" },\n { label: \"Eager (immediately)\", value: \"eager\" },\n ],\n defaultValue: \"lazy\",\n group: \"Settings\",\n },\n ],\n};\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/widgets/EmbedWidget.tsx"],"names":["jsx","jsxs","FontAwesomeIcon","faGlobe","getBorderRadiusField","getHeightField"],"mappings":"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","file":"chunk-VB5MPLLG.cjs","sourcesContent":["import { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faGlobe } from \"@fortawesome/pro-regular-svg-icons\";\nimport type { ComponentProps } from \"react\";\nimport {\n getBorderRadiusField,\n getHeightField,\n type WidgetPropertySchema,\n} from \"@fluid-app/rep-core/registries\";\nimport type { BorderRadiusOptions } from \"@fluid-app/rep-core/types\";\n\ntype EmbedWidgetProps = ComponentProps<\"div\"> & {\n url?: string;\n title?: string;\n height?: string;\n fullScreen?: boolean;\n allowFullscreen?: boolean;\n loading?: \"eager\" | \"lazy\";\n borderRadius?: BorderRadiusOptions;\n};\n\nexport function EmbedWidget({\n url = \"\",\n title = \"Embedded Content\",\n height = \"400px\",\n fullScreen = false,\n allowFullscreen = true,\n loading = \"lazy\",\n borderRadius = \"md\",\n className,\n ...props\n}: EmbedWidgetProps) {\n const isFullScreen = fullScreen;\n\n // Show placeholder if no URL is provided\n if (!url) {\n return (\n <div\n className={`flex items-center justify-center rounded-${borderRadius} border-border bg-muted text-muted-foreground border-2 border-dashed ${isFullScreen ? \"h-full\" : \"\"} ${className}`}\n style={isFullScreen ? undefined : { height }}\n {...props}\n >\n <div className=\"flex flex-col items-center gap-2 p-6 text-center\">\n <FontAwesomeIcon icon={faGlobe} className=\"h-12 w-12 opacity-50\" />\n <p className=\"text-sm font-medium\">\n Enter a URL to embed external content\n </p>\n <p className=\"text-xs opacity-75\">\n Configure the URL in the properties panel\n </p>\n </div>\n </div>\n );\n }\n\n return (\n <div\n className={`w-full ${isFullScreen ? \"h-full\" : \"\"} ${className}`}\n {...props}\n >\n <iframe\n src={url}\n title={title}\n width=\"100%\"\n height={isFullScreen ? \"100%\" : height}\n loading={loading}\n allowFullScreen={allowFullscreen}\n className={`rounded-${borderRadius} border-border border`}\n sandbox=\"allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox\"\n />\n </div>\n );\n}\n\nexport const embedWidgetPropertySchema: WidgetPropertySchema = {\n widgetType: \"EmbedWidget\",\n displayName: \"Embed\",\n fields: [\n // Content\n {\n key: \"url\",\n label: \"URL\",\n type: \"text\",\n description: \"The URL of the external site to embed\",\n placeholder: \"https://example.com\",\n defaultValue: \"\",\n group: \"Content\",\n },\n {\n key: \"title\",\n label: \"Title\",\n type: \"text\",\n description: \"Accessibility title for the embedded content\",\n defaultValue: \"Embedded Content\",\n group: \"Content\",\n },\n\n // Design\n getBorderRadiusField({\n key: \"borderRadius\",\n label: \"Border Radius\",\n description: \"Border radius for the embed container\",\n defaultValue: \"md\",\n group: \"Design\",\n }),\n {\n key: \"fullScreen\",\n label: \"Full Screen\",\n type: \"boolean\",\n description: \"When enabled, the embed fills the available space\",\n defaultValue: false,\n group: \"Design\",\n },\n getHeightField({\n key: \"height\",\n label: \"Height\",\n description: \"Height of the embedded iframe\",\n min: 50,\n max: 1200,\n step: 10,\n defaultValue: \"400px\",\n group: \"Design\",\n requiresKeyValue: {\n key: \"fullScreen\",\n value: false,\n },\n }),\n\n // Settings\n {\n key: \"allowFullscreen\",\n label: \"Allow Fullscreen\",\n type: \"boolean\",\n description: \"Allow the embedded content to use fullscreen mode\",\n defaultValue: true,\n group: \"Settings\",\n },\n {\n key: \"loading\",\n label: \"Loading\",\n type: \"select\",\n description: \"When to load the embedded content\",\n options: [\n { label: \"Lazy (on scroll)\", value: \"lazy\" },\n { label: \"Eager (immediately)\", value: \"eager\" },\n ],\n defaultValue: \"lazy\",\n group: \"Settings\",\n },\n ],\n};\n"]}
|