npm - @fluid-app/portal-sdk - Versions diffs - 0.1.45 → 0.1.46 - Mend

@fluid-app/portal-sdk 0.1.45 → 0.1.46

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.

Files changed (239) hide show

package/dist/{QuickShareWidget-DJSBoNdI.cjs → QuickShareWidget-CIfXUWCx.cjs} RENAMED Viewed

@@ -8,7 +8,7 @@ var QuickShareWidget_exports = /* @__PURE__ */ require_chunk.__exportAll({
 	QuickShareWidget: () => QuickShareWidget,
 	quickShareWidgetPropertySchema: () => quickShareWidgetPropertySchema
 });
-function QuickShareWidget({ shareableResource, titleEnabled = true, titleText = "", titleFontSize = "2xl", titleColor = "foreground", textColor = "foreground", accentColor = "primary", padding = 4, borderRadius = "md", overlayEnabled = true, overlayType = "solid", overlayIntensity = 50, showBuyButton = false, className, ...props }) {
+function QuickShareWidget({ shareableResource, titleEnabled = true, titleText = "", titleFontSize = "2xl", titleColor = "foreground", textColor = "foreground", accentColor = "primary", padding = 4, borderRadius = "md", borderWidth = "none", borderColor = "muted", overlayEnabled = true, overlayType = "solid", overlayIntensity = 50, showBuyButton = false, className, ...props }) {
 	const backgroundImageUrl = shareableResource?.image_url || shareableResource?.imageUrl;
 	const shareLink = shareableResource?.share_link || "";
 	const displayUrl = shareLink || "Select a resource to generate link";
@@ -23,7 +23,7 @@ function QuickShareWidget({ shareableResource, titleEnabled = true, titleText =
 		}
 	};
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: `relative overflow-hidden rounded-${borderRadius} bg-muted text-${textColor} ${className ?? ""}`,
+		className: `relative overflow-hidden rounded-${borderRadius} ${_fluid_app_portal_core_registries.borderWidthClasses[borderWidth]} ${borderWidth !== "none" ? _fluid_app_portal_core_registries.borderColorClasses[borderColor] : ""} bg-muted text-${textColor} ${className ?? ""}`,
 		...props,
 		children: [backgroundImageUrl ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			className: "absolute inset-0",
@@ -226,6 +226,22 @@ const quickShareWidgetPropertySchema = {
 			defaultValue: "md",
 			tab: "styling",
 			group: "Design"
+		}),
+		(0, _fluid_app_portal_core_registries.getBorderWidthField)({
+			key: "borderWidth",
+			label: "Border Width",
+			description: "Border width for the widget",
+			defaultValue: "none",
+			tab: "styling",
+			group: "Design"
+		}),
+		(0, _fluid_app_portal_core_registries.getBorderColorField)({
+			key: "borderColor",
+			label: "Border Color",
+			description: "Border color for the widget",
+			defaultValue: "muted",
+			tab: "styling",
+			group: "Design"
 		})
 	]
 };
@@ -249,4 +265,4 @@ Object.defineProperty(exports, "quickShareWidgetPropertySchema", {
 	}
 });
-//# sourceMappingURL=QuickShareWidget-DJSBoNdI.cjs.map
+//# sourceMappingURL=QuickShareWidget-CIfXUWCx.cjs.map

package/dist/QuickShareWidget-CIfXUWCx.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"QuickShareWidget-CIfXUWCx.cjs","names":["borderWidthClasses","borderColorClasses","Image","QRCodeSVG","Copy","ShoppingCart"],"sources":["../../widgets/src/widgets/QuickShareWidget.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport type React from \"react\";\nimport type {\n BorderRadiusOptions,\n BorderWidthOptions,\n ColorOptions,\n FontSizeOptions,\n PaddingOptions,\n} from \"@fluid-app/portal-core/types\";\nimport type { WidgetPropertySchema } from \"@fluid-app/portal-core/registries\";\nimport type { ShareableItem } from \"@fluid-app/portal-core/types\";\nimport {\n getBorderRadiusField,\n getBorderWidthField,\n getBorderColorField,\n borderWidthClasses,\n borderColorClasses,\n getColorField,\n getFontSizeField,\n getPaddingField,\n} from \"../core/fields\";\nimport { QRCodeSVG } from \"qrcode.react\";\nimport { Copy, ShoppingCart, Image } from \"lucide-react\";\n\ntype QuickShareWidgetProps = ComponentProps<\"div\"> & {\n // Resource\n shareableResource?: ShareableItem;\n\n // Title\n titleEnabled?: boolean;\n titleText?: string;\n titleFontSize?: FontSizeOptions;\n titleColor?: ColorOptions;\n\n // Styling\n textColor?: ColorOptions;\n accentColor?: ColorOptions;\n padding?: PaddingOptions;\n borderRadius?: BorderRadiusOptions;\n borderWidth?: BorderWidthOptions;\n borderColor?: ColorOptions;\n\n // Overlay\n overlayEnabled?: boolean;\n overlayType?: \"solid\" | \"gradient\";\n overlayIntensity?: number;\n\n // Actions\n showBuyButton?: boolean;\n};\n\nexport function QuickShareWidget({\n // Resource\n shareableResource,\n\n // Title defaults\n titleEnabled = true,\n titleText = \"\",\n titleFontSize = \"2xl\",\n titleColor = \"foreground\",\n\n textColor = \"foreground\",\n accentColor = \"primary\",\n padding = 4,\n borderRadius = \"md\",\n borderWidth = \"none\",\n borderColor = \"muted\",\n\n // Overlay defaults\n overlayEnabled = true,\n overlayType = \"solid\",\n overlayIntensity = 50,\n\n // Actions defaults\n showBuyButton = false,\n\n className,\n ...props\n}: QuickShareWidgetProps): React.JSX.Element {\n // Determine background styling\n const backgroundImageUrl =\n shareableResource?.image_url || shareableResource?.imageUrl;\n\n // Get share link from resource\n const shareLink = shareableResource?.share_link || \"\";\n const displayUrl = shareLink || \"Select a resource to generate link\";\n\n // Determine title - use provided title or fall back to resource title\n const displayTitle =\n titleText || shareableResource?.title || \"Select a resource to display!\";\n\n // Check if resource is a Product for buy button visibility\n const isProduct =\n shareableResource?.type === \"Product\" ||\n shareableResource?.shareableType === \"Product\";\n const shouldShowBuyButton = showBuyButton && isProduct;\n\n // Copy to clipboard handler\n const handleCopyToClipboard = async () => {\n if (shareLink) {\n try {\n await navigator.clipboard.writeText(shareLink);\n } catch (error) {\n console.error(\"Failed to copy to clipboard:\", error);\n }\n }\n };\n\n return (\n <div\n className={`relative overflow-hidden rounded-${borderRadius} ${borderWidthClasses[borderWidth]} ${borderWidth !== \"none\" ? borderColorClasses[borderColor] : \"\"} bg-muted text-${textColor} ${className ?? \"\"}`}\n {...props}\n >\n {/* Background Image with Overlay */}\n {backgroundImageUrl ? (\n <div className=\"absolute inset-0\">\n <img\n src={backgroundImageUrl}\n alt=\"\"\n className=\"h-full w-full object-cover\"\n />\n {overlayEnabled && (\n <div\n className={`absolute inset-0 ${\n overlayType === \"gradient\"\n ? \"bg-gradient-to-t from-black to-transparent\"\n : \"bg-black\"\n }`}\n style={{\n opacity:\n (Number(String(overlayIntensity).replace(\"%\", \"\")) || 50) /\n 100,\n }}\n />\n )}\n </div>\n ) : (\n <div\n className={`bg-muted absolute inset-0 flex items-center justify-center`}\n >\n <Image className=\"h-16 w-16 opacity-20\" />\n </div>\n )}\n\n {/* Content Container */}\n <div className={`relative flex min-h-[400px] flex-col p-${padding}`}>\n {/* Title Overlay */}\n {titleEnabled && displayTitle && (\n <div className=\"flex flex-1 items-center justify-center\">\n <h2\n className={`text-center text-${titleFontSize} font-header font-semibold text-${titleColor} drop-shadow-lg`}\n >\n {displayTitle}\n </h2>\n </div>\n )}\n\n {/* Bottom Section - QR Code, URL, and Buttons */}\n <div className=\"mt-auto flex flex-col gap-4\">\n <div className=\"flex items-end justify-between gap-4\">\n {/* QR Code */}\n <div className=\"shrink-0 rounded-lg bg-white p-2\">\n <QRCodeSVG\n value={shareLink || \"https://example.com\"}\n size={100}\n level=\"H\"\n />\n </div>\n\n {/* URL Display */}\n <div className=\"min-w-0 flex-1\">\n <p className=\"mb-2 text-sm font-semibold tracking-wide drop-shadow\">\n Your Shareable URL\n </p>\n <div className=\"flex items-center justify-between rounded-md border border-white/20 bg-black/50 p-2 text-sm text-white backdrop-blur\">\n <span className=\"truncate\">{displayUrl}</span>\n <button\n type=\"button\"\n onClick={handleCopyToClipboard}\n className={`ml-2 shrink-0 rounded p-1 transition-colors hover:bg-${accentColor}/20`}\n aria-label=\"Copy link\"\n >\n <Copy className=\"h-4 w-4\" />\n </button>\n </div>\n </div>\n </div>\n\n {/* Action Buttons */}\n {/* TODO: Needs button link implmented, once it is uncomment the config for showBuyButton */}\n {shouldShowBuyButton && (\n <div className=\"flex\">\n <button\n type=\"button\"\n className={`flex w-full items-center justify-center gap-2 rounded-lg bg-${accentColor} p-3 font-medium text-${accentColor}-foreground transition-all hover:bg-${accentColor}-500`}\n >\n <ShoppingCart className=\"h-4 w-4\" />\n <span>Buy</span>\n </button>\n </div>\n )}\n </div>\n </div>\n </div>\n );\n}\n\nexport const quickShareWidgetPropertySchema: WidgetPropertySchema = {\n widgetType: \"QuickShareWidget\",\n displayName: \"Quick Share Widget\",\n tabsConfig: [{ id: \"styling\", label: \"Styling\" }],\n fields: [\n // Styling Tab - Resource\n {\n key: \"shareableResource\",\n label: \"Shareable Content\",\n type: \"resource\",\n description: \"Select the content to generate a share link for\",\n allowedTypes: [\"Product\", \"Page\", \"EnrollmentPack\", \"Medium\", \"Library\"],\n tab: \"styling\",\n group: \"Content\",\n },\n\n // Styling Tab - Title Group\n {\n key: \"titleEnabled\",\n label: \"Show Title\",\n type: \"boolean\",\n description: \"Display a title overlay on the widget\",\n defaultValue: true,\n tab: \"styling\",\n group: \"Title\",\n },\n {\n key: \"titleText\",\n label: \"Title\",\n type: \"text\",\n description: \"Custom title text (defaults to resource title if empty)\",\n defaultValue: \"\",\n tab: \"styling\",\n group: \"Title\",\n requiresKeyToBeTrue: \"titleEnabled\",\n },\n getFontSizeField({\n key: \"titleFontSize\",\n label: \"Title Font Size\",\n description: \"Font size for the title text\",\n defaultValue: \"2xl\",\n tab: \"styling\",\n group: \"Title\",\n requiresKeyToBeTrue: \"titleEnabled\",\n }),\n getColorField({\n key: \"titleColor\",\n label: \"Title Color\",\n description: \"Color for the title text\",\n defaultValue: \"background\",\n tab: \"styling\",\n group: \"Title\",\n requiresKeyToBeTrue: \"titleEnabled\",\n }),\n\n // Styling Tab - Actions Group\n // {\n // key: \"showBuyButton\",\n // label: \"Show Buy Button\",\n // type: \"boolean\",\n // description: \"Display the buy button (only visible for Product type)\",\n // defaultValue: false,\n // tab: \"styling\",\n // group: \"Actions\",\n // },\n\n // Styling Tab - Design Group\n getColorField({\n key: \"textColor\",\n label: \"Text Color\",\n description: \"Default text color for the widget\",\n defaultValue: \"background\",\n tab: \"styling\",\n group: \"Design\",\n }),\n getColorField({\n key: \"accentColor\",\n label: \"Accent Color\",\n description: \"Color for accent elements and buy button\",\n defaultValue: \"primary\",\n tab: \"styling\",\n group: \"Design\",\n }),\n {\n key: \"overlayEnabled\",\n label: \"Enable Overlay\",\n type: \"boolean\",\n description: \"Add background overlay for text readability\",\n defaultValue: true,\n tab: \"styling\",\n group: \"Design\",\n },\n {\n key: \"overlayType\",\n label: \"Overlay Type\",\n type: \"buttonGroup\",\n description: \"Type of overlay to add to the background\",\n defaultValue: \"solid\",\n options: [\n { label: \"Solid\", value: \"solid\" },\n { label: \"Gradient\", value: \"gradient\" },\n ],\n tab: \"styling\",\n group: \"Design\",\n requiresKeyToBeTrue: \"overlayEnabled\",\n },\n {\n key: \"overlayIntensity\",\n label: \"Overlay Intensity\",\n type: \"slider\",\n description: \"Opacity of the overlay background (0-100)\",\n min: 0,\n max: 100,\n step: 5,\n defaultValue: 50,\n unit: \"%\",\n tab: \"styling\",\n group: \"Design\",\n requiresKeyToBeTrue: \"overlayEnabled\",\n },\n {\n key: \"separator\",\n type: \"separator\",\n label: \"Separator\",\n tab: \"styling\",\n group: \"Design\",\n },\n getPaddingField({\n key: \"padding\",\n label: \"Padding\",\n description: \"Padding around the widget content\",\n defaultValue: 4,\n tab: \"styling\",\n group: \"Design\",\n }),\n getBorderRadiusField({\n key: \"borderRadius\",\n label: \"Border Radius\",\n description: \"Border radius for the widget container\",\n defaultValue: \"md\",\n tab: \"styling\",\n group: \"Design\",\n }),\n getBorderWidthField({\n key: \"borderWidth\",\n label: \"Border Width\",\n description: \"Border width for the widget\",\n defaultValue: \"none\",\n tab: \"styling\",\n group: \"Design\",\n }),\n getBorderColorField({\n key: \"borderColor\",\n label: \"Border Color\",\n description: \"Border color for the widget\",\n defaultValue: \"muted\",\n tab: \"styling\",\n group: \"Design\",\n }),\n ],\n} as const satisfies WidgetPropertySchema;\n"],"mappings":";;;;;;;;;;AAmDA,SAAgB,iBAAiB,EAE/B,mBAGA,eAAe,MACf,YAAY,IACZ,gBAAgB,OAChB,aAAa,cAEb,YAAY,cACZ,cAAc,WACd,UAAU,GACV,eAAe,MACf,cAAc,QACd,cAAc,SAGd,iBAAiB,MACjB,cAAc,SACd,mBAAmB,IAGnB,gBAAgB,OAEhB,WACA,GAAG,SACwC;CAE3C,MAAM,qBACJ,mBAAmB,aAAa,mBAAmB;CAGrD,MAAM,YAAY,mBAAmB,cAAc;CACnD,MAAM,aAAa,aAAa;CAGhC,MAAM,eACJ,aAAa,mBAAmB,SAAS;CAG3C,MAAM,YACJ,mBAAmB,SAAS,aAC5B,mBAAmB,kBAAkB;CACvC,MAAM,sBAAsB,iBAAiB;CAG7C,MAAM,wBAAwB,YAAY;AACxC,MAAI,UACF,KAAI;AACF,SAAM,UAAU,UAAU,UAAU,UAAU;WACvC,OAAO;AACd,WAAQ,MAAM,gCAAgC,MAAM;;;AAK1D,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EACE,WAAW,oCAAoC,aAAa,GAAGA,kCAAAA,mBAAmB,aAAa,GAAG,gBAAgB,SAASC,kCAAAA,mBAAmB,eAAe,GAAG,iBAAiB,UAAU,GAAG,aAAa;EAC3M,GAAI;YAFN,CAKG,qBACC,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAK,WAAU;aAAf,CACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;IACE,KAAK;IACL,KAAI;IACJ,WAAU;IACV,CAAA,EACD,kBACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;IACE,WAAW,oBACT,gBAAgB,aACZ,+CACA;IAEN,OAAO,EACL,UACG,OAAO,OAAO,iBAAiB,CAAC,QAAQ,KAAK,GAAG,CAAC,IAAI,MACtD,KACH;IACD,CAAA,CAEA;OAEN,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,WAAW;aAEX,iBAAA,GAAA,kBAAA,KAACC,aAAAA,OAAD,EAAO,WAAU,wBAAyB,CAAA;GACtC,CAAA,EAIR,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAK,WAAW,0CAA0C;aAA1D,CAEG,gBAAgB,gBACf,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,WAAU;cACb,iBAAA,GAAA,kBAAA,KAAC,MAAD;KACE,WAAW,oBAAoB,cAAc,kCAAkC,WAAW;eAEzF;KACE,CAAA;IACD,CAAA,EAIR,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,WAAU;cAAf,CACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;KAAK,WAAU;eAAf,CAEE,iBAAA,GAAA,kBAAA,KAAC,OAAD;MAAK,WAAU;gBACb,iBAAA,GAAA,kBAAA,KAACC,aAAAA,WAAD;OACE,OAAO,aAAa;OACpB,MAAM;OACN,OAAM;OACN,CAAA;MACE,CAAA,EAGN,iBAAA,GAAA,kBAAA,MAAC,OAAD;MAAK,WAAU;gBAAf,CACE,iBAAA,GAAA,kBAAA,KAAC,KAAD;OAAG,WAAU;iBAAuD;OAEhE,CAAA,EACJ,iBAAA,GAAA,kBAAA,MAAC,OAAD;OAAK,WAAU;iBAAf,CACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;QAAM,WAAU;kBAAY;QAAkB,CAAA,EAC9C,iBAAA,GAAA,kBAAA,KAAC,UAAD;QACE,MAAK;QACL,SAAS;QACT,WAAW,wDAAwD,YAAY;QAC/E,cAAW;kBAEX,iBAAA,GAAA,kBAAA,KAACC,aAAAA,MAAD,EAAM,WAAU,WAAY,CAAA;QACrB,CAAA,CACL;SACF;QACF;QAIL,uBACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;KAAK,WAAU;eACb,iBAAA,GAAA,kBAAA,MAAC,UAAD;MACE,MAAK;MACL,WAAW,+DAA+D,YAAY,wBAAwB,YAAY,sCAAsC,YAAY;gBAF9K,CAIE,iBAAA,GAAA,kBAAA,KAACC,aAAAA,cAAD,EAAc,WAAU,WAAY,CAAA,EACpC,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAA,UAAM,OAAU,CAAA,CACT;;KACL,CAAA,CAEJ;MACF;KACF;;;AAIV,MAAa,iCAAuD;CAClE,YAAY;CACZ,aAAa;CACb,YAAY,CAAC;EAAE,IAAI;EAAW,OAAO;EAAW,CAAC;CACjD,QAAQ;EAEN;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;IAAC;IAAW;IAAQ;IAAkB;IAAU;IAAU;GACxE,KAAK;GACL,OAAO;GACR;EAGD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR;EACD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB;0DACgB;GACf,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB,CAAC;uDACY;GACZ,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB,CAAC;uDAcY;GACZ,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;uDACY;GACZ,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;EACF;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR;EACD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,SAAS,CACP;IAAE,OAAO;IAAS,OAAO;IAAS,EAClC;IAAE,OAAO;IAAY,OAAO;IAAY,CACzC;GACD,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB;EACD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,KAAK;GACL,KAAK;GACL,MAAM;GACN,cAAc;GACd,MAAM;GACN,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB;EACD;GACE,KAAK;GACL,MAAM;GACN,OAAO;GACP,KAAK;GACL,OAAO;GACR;yDACe;GACd,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;8DACmB;GACnB,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;6DACkB;GAClB,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;6DACkB;GAClB,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;EACH;CACF"}

package/dist/{QuickShareWidget-DzvaOfZL.mjs → QuickShareWidget-CvdvBmEn.mjs} RENAMED Viewed

@@ -1,5 +1,5 @@
 import { n as __exportAll } from "./chunk-CRV2RMSr.mjs";
-import { a as getColorField, o as getFontSizeField, r as getBorderRadiusField, u as getPaddingField } from "./fields-DW1nDGRz.mjs";
+import { i as getBorderColorField, l as getColorField, m as getPaddingField, n as borderWidthClasses, o as getBorderRadiusField, s as getBorderWidthField, t as borderColorClasses, u as getFontSizeField } from "./fields-CjDogNNF.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Copy, Image, ShoppingCart } from "lucide-react";
 import { QRCodeSVG } from "qrcode.react";
@@ -8,7 +8,7 @@ var QuickShareWidget_exports = /* @__PURE__ */ __exportAll({
 	QuickShareWidget: () => QuickShareWidget,
 	quickShareWidgetPropertySchema: () => quickShareWidgetPropertySchema
 });
-function QuickShareWidget({ shareableResource, titleEnabled = true, titleText = "", titleFontSize = "2xl", titleColor = "foreground", textColor = "foreground", accentColor = "primary", padding = 4, borderRadius = "md", overlayEnabled = true, overlayType = "solid", overlayIntensity = 50, showBuyButton = false, className, ...props }) {
+function QuickShareWidget({ shareableResource, titleEnabled = true, titleText = "", titleFontSize = "2xl", titleColor = "foreground", textColor = "foreground", accentColor = "primary", padding = 4, borderRadius = "md", borderWidth = "none", borderColor = "muted", overlayEnabled = true, overlayType = "solid", overlayIntensity = 50, showBuyButton = false, className, ...props }) {
 	const backgroundImageUrl = shareableResource?.image_url || shareableResource?.imageUrl;
 	const shareLink = shareableResource?.share_link || "";
 	const displayUrl = shareLink || "Select a resource to generate link";
@@ -23,7 +23,7 @@ function QuickShareWidget({ shareableResource, titleEnabled = true, titleText =
 		}
 	};
 	return /* @__PURE__ */ jsxs("div", {
-		className: `relative overflow-hidden rounded-${borderRadius} bg-muted text-${textColor} ${className ?? ""}`,
+		className: `relative overflow-hidden rounded-${borderRadius} ${borderWidthClasses[borderWidth]} ${borderWidth !== "none" ? borderColorClasses[borderColor] : ""} bg-muted text-${textColor} ${className ?? ""}`,
 		...props,
 		children: [backgroundImageUrl ? /* @__PURE__ */ jsxs("div", {
 			className: "absolute inset-0",
@@ -226,10 +226,26 @@ const quickShareWidgetPropertySchema = {
 			defaultValue: "md",
 			tab: "styling",
 			group: "Design"
+		}),
+		getBorderWidthField({
+			key: "borderWidth",
+			label: "Border Width",
+			description: "Border width for the widget",
+			defaultValue: "none",
+			tab: "styling",
+			group: "Design"
+		}),
+		getBorderColorField({
+			key: "borderColor",
+			label: "Border Color",
+			description: "Border color for the widget",
+			defaultValue: "muted",
+			tab: "styling",
+			group: "Design"
 		})
 	]
 };
 //#endregion
 export { QuickShareWidget_exports as n, quickShareWidgetPropertySchema as r, QuickShareWidget as t };
-//# sourceMappingURL=QuickShareWidget-DzvaOfZL.mjs.map
+//# sourceMappingURL=QuickShareWidget-CvdvBmEn.mjs.map

package/dist/QuickShareWidget-CvdvBmEn.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"QuickShareWidget-CvdvBmEn.mjs","names":[],"sources":["../../widgets/src/widgets/QuickShareWidget.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport type React from \"react\";\nimport type {\n BorderRadiusOptions,\n BorderWidthOptions,\n ColorOptions,\n FontSizeOptions,\n PaddingOptions,\n} from \"@fluid-app/portal-core/types\";\nimport type { WidgetPropertySchema } from \"@fluid-app/portal-core/registries\";\nimport type { ShareableItem } from \"@fluid-app/portal-core/types\";\nimport {\n getBorderRadiusField,\n getBorderWidthField,\n getBorderColorField,\n borderWidthClasses,\n borderColorClasses,\n getColorField,\n getFontSizeField,\n getPaddingField,\n} from \"../core/fields\";\nimport { QRCodeSVG } from \"qrcode.react\";\nimport { Copy, ShoppingCart, Image } from \"lucide-react\";\n\ntype QuickShareWidgetProps = ComponentProps<\"div\"> & {\n // Resource\n shareableResource?: ShareableItem;\n\n // Title\n titleEnabled?: boolean;\n titleText?: string;\n titleFontSize?: FontSizeOptions;\n titleColor?: ColorOptions;\n\n // Styling\n textColor?: ColorOptions;\n accentColor?: ColorOptions;\n padding?: PaddingOptions;\n borderRadius?: BorderRadiusOptions;\n borderWidth?: BorderWidthOptions;\n borderColor?: ColorOptions;\n\n // Overlay\n overlayEnabled?: boolean;\n overlayType?: \"solid\" | \"gradient\";\n overlayIntensity?: number;\n\n // Actions\n showBuyButton?: boolean;\n};\n\nexport function QuickShareWidget({\n // Resource\n shareableResource,\n\n // Title defaults\n titleEnabled = true,\n titleText = \"\",\n titleFontSize = \"2xl\",\n titleColor = \"foreground\",\n\n textColor = \"foreground\",\n accentColor = \"primary\",\n padding = 4,\n borderRadius = \"md\",\n borderWidth = \"none\",\n borderColor = \"muted\",\n\n // Overlay defaults\n overlayEnabled = true,\n overlayType = \"solid\",\n overlayIntensity = 50,\n\n // Actions defaults\n showBuyButton = false,\n\n className,\n ...props\n}: QuickShareWidgetProps): React.JSX.Element {\n // Determine background styling\n const backgroundImageUrl =\n shareableResource?.image_url || shareableResource?.imageUrl;\n\n // Get share link from resource\n const shareLink = shareableResource?.share_link || \"\";\n const displayUrl = shareLink || \"Select a resource to generate link\";\n\n // Determine title - use provided title or fall back to resource title\n const displayTitle =\n titleText || shareableResource?.title || \"Select a resource to display!\";\n\n // Check if resource is a Product for buy button visibility\n const isProduct =\n shareableResource?.type === \"Product\" ||\n shareableResource?.shareableType === \"Product\";\n const shouldShowBuyButton = showBuyButton && isProduct;\n\n // Copy to clipboard handler\n const handleCopyToClipboard = async () => {\n if (shareLink) {\n try {\n await navigator.clipboard.writeText(shareLink);\n } catch (error) {\n console.error(\"Failed to copy to clipboard:\", error);\n }\n }\n };\n\n return (\n <div\n className={`relative overflow-hidden rounded-${borderRadius} ${borderWidthClasses[borderWidth]} ${borderWidth !== \"none\" ? borderColorClasses[borderColor] : \"\"} bg-muted text-${textColor} ${className ?? \"\"}`}\n {...props}\n >\n {/* Background Image with Overlay */}\n {backgroundImageUrl ? (\n <div className=\"absolute inset-0\">\n <img\n src={backgroundImageUrl}\n alt=\"\"\n className=\"h-full w-full object-cover\"\n />\n {overlayEnabled && (\n <div\n className={`absolute inset-0 ${\n overlayType === \"gradient\"\n ? \"bg-gradient-to-t from-black to-transparent\"\n : \"bg-black\"\n }`}\n style={{\n opacity:\n (Number(String(overlayIntensity).replace(\"%\", \"\")) || 50) /\n 100,\n }}\n />\n )}\n </div>\n ) : (\n <div\n className={`bg-muted absolute inset-0 flex items-center justify-center`}\n >\n <Image className=\"h-16 w-16 opacity-20\" />\n </div>\n )}\n\n {/* Content Container */}\n <div className={`relative flex min-h-[400px] flex-col p-${padding}`}>\n {/* Title Overlay */}\n {titleEnabled && displayTitle && (\n <div className=\"flex flex-1 items-center justify-center\">\n <h2\n className={`text-center text-${titleFontSize} font-header font-semibold text-${titleColor} drop-shadow-lg`}\n >\n {displayTitle}\n </h2>\n </div>\n )}\n\n {/* Bottom Section - QR Code, URL, and Buttons */}\n <div className=\"mt-auto flex flex-col gap-4\">\n <div className=\"flex items-end justify-between gap-4\">\n {/* QR Code */}\n <div className=\"shrink-0 rounded-lg bg-white p-2\">\n <QRCodeSVG\n value={shareLink || \"https://example.com\"}\n size={100}\n level=\"H\"\n />\n </div>\n\n {/* URL Display */}\n <div className=\"min-w-0 flex-1\">\n <p className=\"mb-2 text-sm font-semibold tracking-wide drop-shadow\">\n Your Shareable URL\n </p>\n <div className=\"flex items-center justify-between rounded-md border border-white/20 bg-black/50 p-2 text-sm text-white backdrop-blur\">\n <span className=\"truncate\">{displayUrl}</span>\n <button\n type=\"button\"\n onClick={handleCopyToClipboard}\n className={`ml-2 shrink-0 rounded p-1 transition-colors hover:bg-${accentColor}/20`}\n aria-label=\"Copy link\"\n >\n <Copy className=\"h-4 w-4\" />\n </button>\n </div>\n </div>\n </div>\n\n {/* Action Buttons */}\n {/* TODO: Needs button link implmented, once it is uncomment the config for showBuyButton */}\n {shouldShowBuyButton && (\n <div className=\"flex\">\n <button\n type=\"button\"\n className={`flex w-full items-center justify-center gap-2 rounded-lg bg-${accentColor} p-3 font-medium text-${accentColor}-foreground transition-all hover:bg-${accentColor}-500`}\n >\n <ShoppingCart className=\"h-4 w-4\" />\n <span>Buy</span>\n </button>\n </div>\n )}\n </div>\n </div>\n </div>\n );\n}\n\nexport const quickShareWidgetPropertySchema: WidgetPropertySchema = {\n widgetType: \"QuickShareWidget\",\n displayName: \"Quick Share Widget\",\n tabsConfig: [{ id: \"styling\", label: \"Styling\" }],\n fields: [\n // Styling Tab - Resource\n {\n key: \"shareableResource\",\n label: \"Shareable Content\",\n type: \"resource\",\n description: \"Select the content to generate a share link for\",\n allowedTypes: [\"Product\", \"Page\", \"EnrollmentPack\", \"Medium\", \"Library\"],\n tab: \"styling\",\n group: \"Content\",\n },\n\n // Styling Tab - Title Group\n {\n key: \"titleEnabled\",\n label: \"Show Title\",\n type: \"boolean\",\n description: \"Display a title overlay on the widget\",\n defaultValue: true,\n tab: \"styling\",\n group: \"Title\",\n },\n {\n key: \"titleText\",\n label: \"Title\",\n type: \"text\",\n description: \"Custom title text (defaults to resource title if empty)\",\n defaultValue: \"\",\n tab: \"styling\",\n group: \"Title\",\n requiresKeyToBeTrue: \"titleEnabled\",\n },\n getFontSizeField({\n key: \"titleFontSize\",\n label: \"Title Font Size\",\n description: \"Font size for the title text\",\n defaultValue: \"2xl\",\n tab: \"styling\",\n group: \"Title\",\n requiresKeyToBeTrue: \"titleEnabled\",\n }),\n getColorField({\n key: \"titleColor\",\n label: \"Title Color\",\n description: \"Color for the title text\",\n defaultValue: \"background\",\n tab: \"styling\",\n group: \"Title\",\n requiresKeyToBeTrue: \"titleEnabled\",\n }),\n\n // Styling Tab - Actions Group\n // {\n // key: \"showBuyButton\",\n // label: \"Show Buy Button\",\n // type: \"boolean\",\n // description: \"Display the buy button (only visible for Product type)\",\n // defaultValue: false,\n // tab: \"styling\",\n // group: \"Actions\",\n // },\n\n // Styling Tab - Design Group\n getColorField({\n key: \"textColor\",\n label: \"Text Color\",\n description: \"Default text color for the widget\",\n defaultValue: \"background\",\n tab: \"styling\",\n group: \"Design\",\n }),\n getColorField({\n key: \"accentColor\",\n label: \"Accent Color\",\n description: \"Color for accent elements and buy button\",\n defaultValue: \"primary\",\n tab: \"styling\",\n group: \"Design\",\n }),\n {\n key: \"overlayEnabled\",\n label: \"Enable Overlay\",\n type: \"boolean\",\n description: \"Add background overlay for text readability\",\n defaultValue: true,\n tab: \"styling\",\n group: \"Design\",\n },\n {\n key: \"overlayType\",\n label: \"Overlay Type\",\n type: \"buttonGroup\",\n description: \"Type of overlay to add to the background\",\n defaultValue: \"solid\",\n options: [\n { label: \"Solid\", value: \"solid\" },\n { label: \"Gradient\", value: \"gradient\" },\n ],\n tab: \"styling\",\n group: \"Design\",\n requiresKeyToBeTrue: \"overlayEnabled\",\n },\n {\n key: \"overlayIntensity\",\n label: \"Overlay Intensity\",\n type: \"slider\",\n description: \"Opacity of the overlay background (0-100)\",\n min: 0,\n max: 100,\n step: 5,\n defaultValue: 50,\n unit: \"%\",\n tab: \"styling\",\n group: \"Design\",\n requiresKeyToBeTrue: \"overlayEnabled\",\n },\n {\n key: \"separator\",\n type: \"separator\",\n label: \"Separator\",\n tab: \"styling\",\n group: \"Design\",\n },\n getPaddingField({\n key: \"padding\",\n label: \"Padding\",\n description: \"Padding around the widget content\",\n defaultValue: 4,\n tab: \"styling\",\n group: \"Design\",\n }),\n getBorderRadiusField({\n key: \"borderRadius\",\n label: \"Border Radius\",\n description: \"Border radius for the widget container\",\n defaultValue: \"md\",\n tab: \"styling\",\n group: \"Design\",\n }),\n getBorderWidthField({\n key: \"borderWidth\",\n label: \"Border Width\",\n description: \"Border width for the widget\",\n defaultValue: \"none\",\n tab: \"styling\",\n group: \"Design\",\n }),\n getBorderColorField({\n key: \"borderColor\",\n label: \"Border Color\",\n description: \"Border color for the widget\",\n defaultValue: \"muted\",\n tab: \"styling\",\n group: \"Design\",\n }),\n ],\n} as const satisfies WidgetPropertySchema;\n"],"mappings":"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d,KAAK;GACL,OAAO;GACR,CAAC;EACF,cAAc;GACZ,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;EACF;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR;EACD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,SAAS,CACP;IAAE,OAAO;IAAS,OAAO;IAAS,EAClC;IAAE,OAAO;IAAY,OAAO;IAAY,CACzC;GACD,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB;EACD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,KAAK;GACL,KAAK;GACL,MAAM;GACN,cAAc;GACd,MAAM;GACN,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB;EACD;GACE,KAAK;GACL,MAAM;GACN,OAAO;GACP,KAAK;GACL,OAAO;GACR;EACD,gBAAgB;GACd,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;EACF,qBAAqB;GACnB,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;EACF,oBAAoB;GAClB,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;EACF,oBAAoB;GAClB,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;EACH;CACF"}

package/dist/{RecentActivityWidget-DxCHufm5.cjs → RecentActivityWidget-kRfjO1IV.cjs} RENAMED Viewed

@@ -208,7 +208,7 @@ function ActivityFeedItem({ activity, accentColor, textColor }) {
 function RecentActivityWidget({ titleEnabled = true, titleText = "Recent Activity", titleFontSize = "lg", titleColor = "foreground", background = {
 	type: "solid",
 	color: "background"
-}, textColor = "foreground", accentColor = "primary", padding = 4, borderRadius = "md", maxItemsToShow = 5, className, ...props }) {
+}, textColor = "foreground", accentColor = "primary", padding = 4, borderRadius = "md", borderWidth = "thin", borderColor = "muted", maxItemsToShow = 5, className, ...props }) {
 	const backgroundColor = background.color || "background";
 	const backgroundImage = (background.resource?.image_url || background.resource?.imageUrl) && background.type === "image" ? `url(${background.resource.image_url || background.resource.imageUrl})` : "none";
 	const { data: activities = [], isLoading, isError } = useActivities();
@@ -232,7 +232,7 @@ function RecentActivityWidget({ titleEnabled = true, titleText = "Recent Activit
 		return result;
 	}, [groupedActivities, maxItemsToShow]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: `@container overflow-hidden rounded-${borderRadius} bg-${backgroundColor} text-${textColor} border-muted border ${className}`,
+		className: `@container overflow-hidden rounded-${borderRadius} bg-${backgroundColor} text-${textColor} ${_fluid_app_portal_core_registries.borderWidthClasses[borderWidth]} ${borderWidth !== "none" ? _fluid_app_portal_core_registries.borderColorClasses[borderColor] : ""} ${className}`,
 		style: { backgroundImage },
 		...props,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -375,6 +375,22 @@ const recentActivityWidgetPropertySchema = {
 			tab: "styling",
 			group: "Design"
 		}),
+		(0, _fluid_app_portal_core_registries.getBorderWidthField)({
+			key: "borderWidth",
+			label: "Border Width",
+			description: "Border width for the widget container",
+			defaultValue: "thin",
+			tab: "styling",
+			group: "Design"
+		}),
+		(0, _fluid_app_portal_core_registries.getBorderColorField)({
+			key: "borderColor",
+			label: "Border Color",
+			description: "Border color for the widget container",
+			defaultValue: "muted",
+			tab: "styling",
+			group: "Design"
+		}),
 		{
 			key: "maxItemsToShow",
 			label: "Max Items",
@@ -406,4 +422,4 @@ Object.defineProperty(exports, "recentActivityWidgetPropertySchema", {
 	}
 });
-//# sourceMappingURL=RecentActivityWidget-DxCHufm5.cjs.map
+//# sourceMappingURL=RecentActivityWidget-kRfjO1IV.cjs.map

package/dist/RecentActivityWidget-kRfjO1IV.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"RecentActivityWidget-kRfjO1IV.cjs","names":["useDataSourceConfig","useWidgetPreviewContext","ShoppingCart","MessageSquare","Play","UserPlus","Eye","Calendar","Star","SquareCheck","Bell","Trophy","User","DOMPurify","borderWidthClasses","borderColorClasses","ErrorState"],"sources":["../../widgets/src/hooks/use-activities.preview.ts","../../widgets/src/hooks/use-activities.ts","../../widgets/src/widgets/RecentActivityWidget.tsx"],"sourcesContent":["import type { Activity } from \"./use-activities.types\";\n\nconst now = new Date();\n\nfunction minutesAgo(minutes: number): string {\n return new Date(now.getTime() - minutes * 60_000).toISOString();\n}\n\nexport const PREVIEW_DATA: Activity[] = [\n {\n id: 1,\n userName: \"Sarah Johnson\",\n avatarUrl: null,\n activityType: \"Order Placed\",\n targetName: \"Wellness Starter Kit\",\n timestamp: minutesAgo(12),\n slug: \"order_placed\",\n },\n {\n id: 2,\n userName: \"Mike Chen\",\n avatarUrl: null,\n activityType: \"New Lead\",\n targetName: \"Signed up from Instagram link\",\n timestamp: minutesAgo(45),\n slug: \"new_lead\",\n },\n {\n id: 3,\n userName: \"Visitor from Austin, TX\",\n avatarUrl: null,\n activityType: \"Page Views\",\n targetName: \"Viewed product catalog (3 pages)\",\n timestamp: minutesAgo(90),\n slug: \"page_views\",\n },\n {\n id: 4,\n userName: \"Lisa Park\",\n avatarUrl: null,\n activityType: \"Video Complete\",\n targetName: \"Watched: Getting Started Guide\",\n timestamp: minutesAgo(180),\n slug: \"video_complete\",\n },\n];\n","import { useQuery, type UseQueryResult } from \"@tanstack/react-query\";\nimport { useDataSourceConfig } from \"@fluid-app/portal-react/data-sources/context\";\nimport { useWidgetPreviewContext } from \"@fluid-app/portal-react/data-sources/preview-context\";\nimport { PREVIEW_DATA } from \"./use-activities.preview\";\nimport type {\n Activity,\n ActivityContact,\n ActivityVisitor,\n ApiActivity,\n} from \"./use-activities.types\";\n\nexport type {\n ActivityContact,\n ActivityVisitor,\n ActivitySlug,\n ApiActivity,\n Activity,\n} from \"./use-activities.types\";\n\ntype PaginationInfo = {\n current: number;\n previous: number | null;\n next: number | null;\n per_page: number;\n pages: number;\n count: number;\n};\n\ntype ApiResponse = [{ pagination: PaginationInfo }, { items: ApiActivity[] }];\n\nexport function useActivities(): UseQueryResult<Activity[], Error> {\n const { baseUrl, getApiHeaders } = useDataSourceConfig();\n const { isPreview } = useWidgetPreviewContext();\n\n return useQuery({\n queryKey: [\n \"portal-widget-use\",\n \"activities\",\n isPreview ? \"preview\" : baseUrl,\n ] as const,\n queryFn: async ({ signal }): Promise<Activity[]> => {\n const url = baseUrl\n ? `${baseUrl}/v1.1/activities.json`\n : \"/v1.1/activities.json\";\n const response = await fetch(url, {\n headers: {\n \"content-type\": \"application/json\",\n ...getApiHeaders?.(),\n },\n signal,\n });\n\n if (!response.ok) {\n throw new Error(`Failed to fetch activities: ${response.status}`);\n }\n\n const data: ApiResponse = await response.json();\n return transformActivities(data);\n },\n enabled: !isPreview,\n ...(isPreview && { placeholderData: PREVIEW_DATA }),\n });\n}\n\n// Transform and format helpers\nfunction getUserName(\n contact: ActivityContact | null,\n visitor: ActivityVisitor | null,\n): string {\n if (contact?.full_name) {\n return contact.full_name;\n }\n if (contact?.first_name && contact?.last_name) {\n return `${contact.first_name} ${contact.last_name}`;\n }\n if (visitor?.city && visitor?.state) {\n return `Visitor from ${visitor.city}, ${visitor.state}`;\n }\n return \"Unknown Visitor\";\n}\n\nfunction transformActivities(rawData: ApiResponse): Activity[] {\n const itemsObj = rawData[1];\n if (!itemsObj?.items) return [];\n\n return itemsObj.items\n .map((activity) => ({\n id: activity.id,\n userName: getUserName(activity.contact, activity.visitor),\n avatarUrl: activity.contact?.avatar_url ?? null,\n activityType: formatActivityType(activity.slug),\n targetName: activity.description || activity.title,\n timestamp: activity.created_at,\n slug: activity.slug,\n }))\n .sort(\n (a, b) =>\n new Date(b.timestamp).getTime() - new Date(a.timestamp).getTime(),\n );\n}\n\nfunction formatActivityType(slug: string): string {\n return slug\n .split(\"_\")\n .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(\" \");\n}\n","import DOMPurify from \"dompurify\";\nimport { useMemo, type ComponentProps } from \"react\";\nimport type React from \"react\";\nimport type {\n BackgroundValue,\n BorderRadiusOptions,\n BorderWidthOptions,\n ColorOptions,\n FontSizeOptions,\n PaddingOptions,\n} from \"@fluid-app/portal-core/types\";\nimport type { WidgetPropertySchema } from \"@fluid-app/portal-core/registries\";\nimport {\n getBorderRadiusField,\n getBorderWidthField,\n getBorderColorField,\n getColorField,\n getFontSizeField,\n getPaddingField,\n borderWidthClasses,\n borderColorClasses,\n} from \"../core/fields\";\nimport {\n useActivities,\n type Activity,\n type ActivitySlug,\n} from \"../hooks/use-activities\";\nimport { ErrorState } from \"../components/error-state\";\nimport {\n Bell,\n Calendar,\n SquareCheck,\n Eye,\n MessageSquare,\n Play,\n ShoppingCart,\n Star,\n Trophy,\n User,\n UserPlus,\n type LucideIcon,\n} from \"lucide-react\";\n\n// Format timestamp to time string\nconst formatTimestamp = (timestamp: string): string => {\n const date = new Date(timestamp);\n return date.toLocaleTimeString(\"en-US\", {\n hour: \"numeric\",\n minute: \"2-digit\",\n hour12: true,\n });\n};\n\n// Format date for grouping header\nconst formatDateHeader = (timestamp: string): string => {\n const date = new Date(timestamp);\n return date.toLocaleDateString(\"en-US\", {\n month: \"long\",\n day: \"numeric\",\n });\n};\n\n// Get date string for grouping (without time)\nconst getDateKey = (timestamp: string): string => {\n const date = new Date(timestamp);\n return date.toISOString().split(\"T\")[0] ?? timestamp;\n};\n\n// Group activities by date\nconst groupActivitiesByDate = (\n activities: Activity[],\n): Map<string, Activity[]> => {\n const grouped = new Map<string, Activity[]>();\n\n for (const activity of activities) {\n const dateKey = getDateKey(activity.timestamp);\n const existing = grouped.get(dateKey);\n if (existing) {\n existing.push(activity);\n } else {\n grouped.set(dateKey, [activity]);\n }\n }\n\n return grouped;\n};\n\n// Activity slug to icon mapping\nconst ACTIVITY_ICON_MAP: Record<ActivitySlug, LucideIcon> = {\n // Orders/Cart\n order_placed: ShoppingCart,\n abandoned_cart: ShoppingCart,\n cart_items_added: ShoppingCart,\n new_cart_items_added: ShoppingCart,\n // Messages\n direct_message: MessageSquare,\n comment_reply: MessageSquare,\n message_received: MessageSquare,\n message_sent: MessageSquare,\n // Video\n video: Play,\n video_complete: Play,\n video_contact: Play,\n video_complete_contact: Play,\n // Leads\n new_lead: UserPlus,\n page_views_contact: UserPlus,\n smart_link_clicked: UserPlus,\n // Page Views\n page_views: Eye,\n // Events\n upcoming_event: Calendar,\n // Reviews\n review_left: Star,\n // Tasks\n tasks: SquareCheck,\n // Announcements\n announcements: Bell,\n // Fantasy\n fantasy_point: Trophy,\n};\n\nconst getActivityIcon = (slug: ActivitySlug) => ACTIVITY_ICON_MAP[slug] ?? User;\n\n// Activity feed item component\ntype ActivityFeedItemProps = {\n activity: Activity;\n accentColor: ColorOptions;\n textColor: ColorOptions;\n};\n\nfunction ActivityFeedItem({\n activity,\n accentColor,\n textColor,\n}: ActivityFeedItemProps) {\n const Icon = getActivityIcon(activity.slug);\n\n return (\n <div className=\"flex w-full items-start gap-1.5\">\n {/* Avatar */}\n <div className=\"shrink-0\">\n {activity.avatarUrl ? (\n <div className=\"relative size-8 overflow-hidden rounded-full\">\n <img\n src={activity.avatarUrl}\n alt={activity.userName}\n className=\"size-full object-cover\"\n />\n <div className=\"border-foreground/[0.08] absolute inset-0 rounded-full border\" />\n </div>\n ) : (\n <div\n className={`bg-muted flex size-8 items-center justify-center rounded-full`}\n >\n <Icon className={`size-3.5 text-${textColor} opacity-60`} />\n </div>\n )}\n </div>\n\n {/* Content */}\n <div className=\"min-w-0 flex-1\">\n <div className=\"flex w-full items-center gap-1.5\">\n <p\n className={`flex-1 text-base font-semibold text-${textColor} truncate`}\n >\n {activity.activityType}\n </p>\n <p className={`text-xs text-${textColor} shrink-0 opacity-50`}>\n {formatTimestamp(activity.timestamp)}\n </p>\n </div>\n <p className={`text-sm text-${textColor} opacity-80`}>\n <span className={`font-medium text-${accentColor}`}>\n {activity.userName}\n </span>{\" \"}\n <span\n dangerouslySetInnerHTML={{\n __html: DOMPurify.sanitize(activity.targetName, {\n ALLOWED_TAGS: [\"br\", \"strong\", \"em\", \"b\", \"i\"],\n ALLOWED_ATTR: [],\n }),\n }}\n />\n </p>\n </div>\n </div>\n );\n}\n\ntype RecentActivityWidgetProps = ComponentProps<\"div\"> & {\n // Title\n titleEnabled?: boolean;\n titleText?: string;\n titleFontSize?: FontSizeOptions;\n titleColor?: ColorOptions;\n\n // Styling\n background?: BackgroundValue;\n textColor?: ColorOptions;\n accentColor?: ColorOptions;\n padding?: PaddingOptions;\n borderRadius?: BorderRadiusOptions;\n borderWidth?: BorderWidthOptions;\n borderColor?: ColorOptions;\n\n // Activity settings\n maxItemsToShow?: number;\n};\n\nexport function RecentActivityWidget({\n // Title defaults\n titleEnabled = true,\n titleText = \"Recent Activity\",\n titleFontSize = \"lg\",\n titleColor = \"foreground\",\n\n // Styling defaults\n background = {\n type: \"solid\",\n color: \"background\",\n },\n textColor = \"foreground\",\n accentColor = \"primary\",\n padding = 4,\n borderRadius = \"md\",\n borderWidth = \"thin\",\n borderColor = \"muted\",\n\n // Activity defaults\n maxItemsToShow = 5,\n\n className,\n ...props\n}: RecentActivityWidgetProps): React.JSX.Element {\n const backgroundColor = background.color || \"background\";\n const backgroundImage =\n (background.resource?.image_url || background.resource?.imageUrl) &&\n background.type === \"image\"\n ? `url(${background.resource.image_url || background.resource.imageUrl})`\n : \"none\";\n const { data: activities = [], isLoading, isError } = useActivities();\n\n const groupedActivities = useMemo(\n () => groupActivitiesByDate(activities),\n [activities],\n );\n\n const totalCount = Math.min(activities.length, maxItemsToShow);\n\n // Get activities to display (limited by maxItemsToShow)\n const activitiesToShow = useMemo(() => {\n const result: { date: string; items: Activity[] }[] = [];\n let count = 0;\n\n for (const [dateKey, items] of groupedActivities) {\n if (count >= maxItemsToShow) break;\n\n const remainingSlots = maxItemsToShow - count;\n const itemsToAdd = items.slice(0, remainingSlots);\n\n if (itemsToAdd.length > 0) {\n result.push({\n date: formatDateHeader(items[0]?.timestamp ?? dateKey),\n items: itemsToAdd,\n });\n count += itemsToAdd.length;\n }\n }\n\n return result;\n }, [groupedActivities, maxItemsToShow]);\n\n return (\n <div\n className={`@container overflow-hidden rounded-${borderRadius} bg-${backgroundColor} text-${textColor} ${borderWidthClasses[borderWidth]} ${borderWidth !== \"none\" ? borderColorClasses[borderColor] : \"\"} ${className}`}\n style={{ backgroundImage }}\n {...props}\n >\n <div className={`p-${padding} flex flex-col gap-2`}>\n {/* Header */}\n {titleEnabled && titleText && (\n <div className=\"flex w-full items-start gap-2\">\n <h2\n className={`flex-1 text-${titleFontSize} font-header font-bold text-${titleColor}`}\n >\n {titleText}\n </h2>\n {!isLoading && (\n <span\n className={`text-4xl font-bold text-${textColor} leading-none`}\n >\n {totalCount.toString().padStart(2, \"0\")}\n </span>\n )}\n </div>\n )}\n\n {/* Loading state */}\n {isLoading ? (\n <div className=\"flex min-h-[200px] items-center justify-center\">\n <div className=\"h-8 w-8 animate-spin rounded-full border-2 border-current border-t-transparent\" />\n </div>\n ) : isError ? (\n /* Error state */\n <ErrorState />\n ) : activities.length === 0 ? (\n /* Empty state */\n <div className=\"flex min-h-[200px] flex-col items-center justify-center gap-2\">\n <User className={`size-12 text-${textColor} opacity-30`} />\n <p\n className={`text-base font-semibold text-${textColor} opacity-50`}\n >\n No Activity To Report\n </p>\n <p className={`text-sm text-${textColor} opacity-40`}>\n You'll Do Great!\n </p>\n </div>\n ) : (\n /* Activity list */\n <div className=\"flex flex-col gap-4\">\n {activitiesToShow.map((group, groupIndex) => (\n <div key={groupIndex} className=\"flex flex-col gap-4\">\n {/* Date header */}\n <p className={`text-base font-semibold text-${textColor}`}>\n {group.date}\n </p>\n\n {/* Activity items */}\n <div className=\"flex flex-col gap-4\">\n {group.items.map((activity) => (\n <ActivityFeedItem\n key={activity.id}\n activity={activity}\n accentColor={accentColor}\n textColor={textColor}\n />\n ))}\n </div>\n </div>\n ))}\n </div>\n )}\n </div>\n </div>\n );\n}\n\nexport const recentActivityWidgetPropertySchema: WidgetPropertySchema = {\n widgetType: \"RecentActivityWidget\",\n displayName: \"Recent Activity Widget\",\n tabsConfig: [{ id: \"styling\", label: \"Styling\" }],\n fields: [\n // Styling Tab - Title Group\n {\n key: \"titleEnabled\",\n label: \"Widget Title\",\n type: \"boolean\",\n description: \"Enable the title displayed above the activity feed\",\n defaultValue: true,\n tab: \"styling\",\n group: \"Title\",\n },\n {\n key: \"titleText\",\n label: \"Title\",\n type: \"text\",\n description: \"Title text displayed above the activity feed\",\n defaultValue: \"Recent Activity\",\n tab: \"styling\",\n group: \"Title\",\n requiresKeyToBeTrue: \"titleEnabled\",\n },\n getFontSizeField({\n key: \"titleFontSize\",\n label: \"Title Font Size\",\n description: \"Font size for the widget title\",\n defaultValue: \"xl\",\n tab: \"styling\",\n group: \"Title\",\n requiresKeyToBeTrue: \"titleEnabled\",\n }),\n getColorField({\n key: \"titleColor\",\n label: \"Title Color\",\n description: \"Color for the widget title\",\n defaultValue: \"foreground\",\n tab: \"styling\",\n group: \"Title\",\n requiresKeyToBeTrue: \"titleEnabled\",\n }),\n\n // Styling Tab - Design Group\n {\n type: \"background\",\n key: \"background\",\n label: \"Background\",\n description: \"Background for the widget container\",\n defaultValue: \"background\",\n tab: \"styling\",\n group: \"Design\",\n },\n getColorField({\n key: \"textColor\",\n label: \"Text Color\",\n description: \"Default text color for activity content\",\n defaultValue: \"foreground\",\n tab: \"styling\",\n group: \"Design\",\n }),\n getColorField({\n key: \"accentColor\",\n label: \"Accent Color\",\n description: \"Color used for links and highlights\",\n defaultValue: \"primary\",\n tab: \"styling\",\n group: \"Design\",\n }),\n {\n key: \"separator\",\n type: \"separator\",\n label: \"Separator\",\n tab: \"styling\",\n group: \"Design\",\n },\n getPaddingField({\n key: \"padding\",\n label: \"Padding\",\n description: \"Padding around the widget container\",\n defaultValue: 4,\n tab: \"styling\",\n group: \"Design\",\n }),\n getBorderRadiusField({\n key: \"borderRadius\",\n label: \"Border Radius\",\n description: \"Border radius for the widget container\",\n defaultValue: \"md\",\n tab: \"styling\",\n group: \"Design\",\n }),\n getBorderWidthField({\n key: \"borderWidth\",\n label: \"Border Width\",\n description: \"Border width for the widget container\",\n defaultValue: \"thin\",\n tab: \"styling\",\n group: \"Design\",\n }),\n getBorderColorField({\n key: \"borderColor\",\n label: \"Border Color\",\n description: \"Border color for the widget container\",\n defaultValue: \"muted\",\n tab: \"styling\",\n group: \"Design\",\n }),\n\n // Styling Tab - Display Group\n {\n key: \"maxItemsToShow\",\n label: \"Max Items\",\n type: \"number\",\n description: \"Maximum number of activity items to display\",\n defaultValue: 5,\n tab: \"styling\",\n group: \"Display\",\n },\n ],\n} as const satisfies WidgetPropertySchema;\n"],"mappings":"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O;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR;EACD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB;0DACgB;GACf,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB,CAAC;uDACY;GACZ,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB,CAAC;EAGF;GACE,MAAM;GACN,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR;uDACa;GACZ,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;uDACY;GACZ,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;EACF;GACE,KAAK;GACL,MAAM;GACN,OAAO;GACP,KAAK;GACL,OAAO;GACR;yDACe;GACd,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;8DACmB;GACnB,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;6DACkB;GAClB,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;6DACkB;GAClB,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR,CAAC;EAGF;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR;EACF;CACF"}

package/dist/{RecentActivityWidget-Dw6yeZKX.mjs → RecentActivityWidget-uegOsG5c.mjs} RENAMED Viewed

@@ -1,6 +1,6 @@
 import { n as __exportAll } from "./chunk-CRV2RMSr.mjs";
 import { i as useDataSourceConfig, n as useWidgetPreviewContext, t as ErrorState } from "./error-state-BGEvTYIh.mjs";
-import { a as getColorField, o as getFontSizeField, r as getBorderRadiusField, u as getPaddingField } from "./fields-DW1nDGRz.mjs";
+import { i as getBorderColorField, l as getColorField, m as getPaddingField, n as borderWidthClasses, o as getBorderRadiusField, s as getBorderWidthField, t as borderColorClasses, u as getFontSizeField } from "./fields-CjDogNNF.mjs";
 import { t as purify } from "./purify.es-CKZbQnR8.mjs";
 import { useMemo } from "react";
 import { useQuery } from "@tanstack/react-query";
@@ -208,7 +208,7 @@ function ActivityFeedItem({ activity, accentColor, textColor }) {
 function RecentActivityWidget({ titleEnabled = true, titleText = "Recent Activity", titleFontSize = "lg", titleColor = "foreground", background = {
 	type: "solid",
 	color: "background"
-}, textColor = "foreground", accentColor = "primary", padding = 4, borderRadius = "md", maxItemsToShow = 5, className, ...props }) {
+}, textColor = "foreground", accentColor = "primary", padding = 4, borderRadius = "md", borderWidth = "thin", borderColor = "muted", maxItemsToShow = 5, className, ...props }) {
 	const backgroundColor = background.color || "background";
 	const backgroundImage = (background.resource?.image_url || background.resource?.imageUrl) && background.type === "image" ? `url(${background.resource.image_url || background.resource.imageUrl})` : "none";
 	const { data: activities = [], isLoading, isError } = useActivities();
@@ -232,7 +232,7 @@ function RecentActivityWidget({ titleEnabled = true, titleText = "Recent Activit
 		return result;
 	}, [groupedActivities, maxItemsToShow]);
 	return /* @__PURE__ */ jsx("div", {
-		className: `@container overflow-hidden rounded-${borderRadius} bg-${backgroundColor} text-${textColor} border-muted border ${className}`,
+		className: `@container overflow-hidden rounded-${borderRadius} bg-${backgroundColor} text-${textColor} ${borderWidthClasses[borderWidth]} ${borderWidth !== "none" ? borderColorClasses[borderColor] : ""} ${className}`,
 		style: { backgroundImage },
 		...props,
 		children: /* @__PURE__ */ jsxs("div", {
@@ -375,6 +375,22 @@ const recentActivityWidgetPropertySchema = {
 			tab: "styling",
 			group: "Design"
 		}),
+		getBorderWidthField({
+			key: "borderWidth",
+			label: "Border Width",
+			description: "Border width for the widget container",
+			defaultValue: "thin",
+			tab: "styling",
+			group: "Design"
+		}),
+		getBorderColorField({
+			key: "borderColor",
+			label: "Border Color",
+			description: "Border color for the widget container",
+			defaultValue: "muted",
+			tab: "styling",
+			group: "Design"
+		}),
 		{
 			key: "maxItemsToShow",
 			label: "Max Items",
@@ -389,4 +405,4 @@ const recentActivityWidgetPropertySchema = {
 //#endregion
 export { RecentActivityWidget_exports as n, recentActivityWidgetPropertySchema as r, RecentActivityWidget as t };
-//# sourceMappingURL=RecentActivityWidget-Dw6yeZKX.mjs.map
+//# sourceMappingURL=RecentActivityWidget-uegOsG5c.mjs.map

package/dist/RecentActivityWidget-uegOsG5c.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"RecentActivityWidget-uegOsG5c.mjs","names":["DOMPurify"],"sources":["../../widgets/src/hooks/use-activities.preview.ts","../../widgets/src/hooks/use-activities.ts","../../widgets/src/widgets/RecentActivityWidget.tsx"],"sourcesContent":["import type { Activity } from \"./use-activities.types\";\n\nconst now = new Date();\n\nfunction minutesAgo(minutes: number): string {\n return new Date(now.getTime() - minutes * 60_000).toISOString();\n}\n\nexport const PREVIEW_DATA: Activity[] = [\n {\n id: 1,\n userName: \"Sarah Johnson\",\n avatarUrl: null,\n activityType: \"Order Placed\",\n targetName: \"Wellness Starter Kit\",\n timestamp: minutesAgo(12),\n slug: \"order_placed\",\n },\n {\n id: 2,\n userName: \"Mike Chen\",\n avatarUrl: null,\n activityType: \"New Lead\",\n targetName: \"Signed up from Instagram link\",\n timestamp: minutesAgo(45),\n slug: \"new_lead\",\n },\n {\n id: 3,\n userName: \"Visitor from Austin, TX\",\n avatarUrl: null,\n activityType: \"Page Views\",\n targetName: \"Viewed product catalog (3 pages)\",\n timestamp: minutesAgo(90),\n slug: \"page_views\",\n },\n {\n id: 4,\n userName: \"Lisa Park\",\n avatarUrl: null,\n activityType: \"Video Complete\",\n targetName: \"Watched: Getting Started Guide\",\n timestamp: minutesAgo(180),\n slug: \"video_complete\",\n },\n];\n","import { useQuery, type UseQueryResult } from \"@tanstack/react-query\";\nimport { useDataSourceConfig } from \"@fluid-app/portal-react/data-sources/context\";\nimport { useWidgetPreviewContext } from \"@fluid-app/portal-react/data-sources/preview-context\";\nimport { PREVIEW_DATA } from \"./use-activities.preview\";\nimport type {\n Activity,\n ActivityContact,\n ActivityVisitor,\n ApiActivity,\n} from \"./use-activities.types\";\n\nexport type {\n ActivityContact,\n ActivityVisitor,\n ActivitySlug,\n ApiActivity,\n Activity,\n} from \"./use-activities.types\";\n\ntype PaginationInfo = {\n current: number;\n previous: number | null;\n next: number | null;\n per_page: number;\n pages: number;\n count: number;\n};\n\ntype ApiResponse = [{ pagination: PaginationInfo }, { items: ApiActivity[] }];\n\nexport function useActivities(): UseQueryResult<Activity[], Error> {\n const { baseUrl, getApiHeaders } = useDataSourceConfig();\n const { isPreview } = useWidgetPreviewContext();\n\n return useQuery({\n queryKey: [\n \"portal-widget-use\",\n \"activities\",\n isPreview ? \"preview\" : baseUrl,\n ] as const,\n queryFn: async ({ signal }): Promise<Activity[]> => {\n const url = baseUrl\n ? `${baseUrl}/v1.1/activities.json`\n : \"/v1.1/activities.json\";\n const response = await fetch(url, {\n headers: {\n \"content-type\": \"application/json\",\n ...getApiHeaders?.(),\n },\n signal,\n });\n\n if (!response.ok) {\n throw new Error(`Failed to fetch activities: ${response.status}`);\n }\n\n const data: ApiResponse = await response.json();\n return transformActivities(data);\n },\n enabled: !isPreview,\n ...(isPreview && { placeholderData: PREVIEW_DATA }),\n });\n}\n\n// Transform and format helpers\nfunction getUserName(\n contact: ActivityContact | null,\n visitor: ActivityVisitor | null,\n): string {\n if (contact?.full_name) {\n return contact.full_name;\n }\n if (contact?.first_name && contact?.last_name) {\n return `${contact.first_name} ${contact.last_name}`;\n }\n if (visitor?.city && visitor?.state) {\n return `Visitor from ${visitor.city}, ${visitor.state}`;\n }\n return \"Unknown Visitor\";\n}\n\nfunction transformActivities(rawData: ApiResponse): Activity[] {\n const itemsObj = rawData[1];\n if (!itemsObj?.items) return [];\n\n return itemsObj.items\n .map((activity) => ({\n id: activity.id,\n userName: getUserName(activity.contact, activity.visitor),\n avatarUrl: activity.contact?.avatar_url ?? null,\n activityType: formatActivityType(activity.slug),\n targetName: activity.description || activity.title,\n timestamp: activity.created_at,\n slug: activity.slug,\n }))\n .sort(\n (a, b) =>\n new Date(b.timestamp).getTime() - new Date(a.timestamp).getTime(),\n );\n}\n\nfunction formatActivityType(slug: string): string {\n return slug\n .split(\"_\")\n .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(\" \");\n}\n","import DOMPurify from \"dompurify\";\nimport { useMemo, type ComponentProps } from \"react\";\nimport type React from \"react\";\nimport type {\n BackgroundValue,\n BorderRadiusOptions,\n BorderWidthOptions,\n ColorOptions,\n FontSizeOptions,\n PaddingOptions,\n} from \"@fluid-app/portal-core/types\";\nimport type { WidgetPropertySchema } from \"@fluid-app/portal-core/registries\";\nimport {\n getBorderRadiusField,\n getBorderWidthField,\n getBorderColorField,\n getColorField,\n getFontSizeField,\n getPaddingField,\n borderWidthClasses,\n borderColorClasses,\n} from \"../core/fields\";\nimport {\n useActivities,\n type Activity,\n type ActivitySlug,\n} from \"../hooks/use-activities\";\nimport { ErrorState } from \"../components/error-state\";\nimport {\n Bell,\n Calendar,\n SquareCheck,\n Eye,\n MessageSquare,\n Play,\n ShoppingCart,\n Star,\n Trophy,\n User,\n UserPlus,\n type LucideIcon,\n} from \"lucide-react\";\n\n// Format timestamp to time string\nconst formatTimestamp = (timestamp: string): string => {\n const date = new Date(timestamp);\n return date.toLocaleTimeString(\"en-US\", {\n hour: \"numeric\",\n minute: \"2-digit\",\n hour12: true,\n });\n};\n\n// Format date for grouping header\nconst formatDateHeader = (timestamp: string): string => {\n const date = new Date(timestamp);\n return date.toLocaleDateString(\"en-US\", {\n month: \"long\",\n day: \"numeric\",\n });\n};\n\n// Get date string for grouping (without time)\nconst getDateKey = (timestamp: string): string => {\n const date = new Date(timestamp);\n return date.toISOString().split(\"T\")[0] ?? timestamp;\n};\n\n// Group activities by date\nconst groupActivitiesByDate = (\n activities: Activity[],\n): Map<string, Activity[]> => {\n const grouped = new Map<string, Activity[]>();\n\n for (const activity of activities) {\n const dateKey = getDateKey(activity.timestamp);\n const existing = grouped.get(dateKey);\n if (existing) {\n existing.push(activity);\n } else {\n grouped.set(dateKey, [activity]);\n }\n }\n\n return grouped;\n};\n\n// Activity slug to icon mapping\nconst ACTIVITY_ICON_MAP: Record<ActivitySlug, LucideIcon> = {\n // Orders/Cart\n order_placed: ShoppingCart,\n abandoned_cart: ShoppingCart,\n cart_items_added: ShoppingCart,\n new_cart_items_added: ShoppingCart,\n // Messages\n direct_message: MessageSquare,\n comment_reply: MessageSquare,\n message_received: MessageSquare,\n message_sent: MessageSquare,\n // Video\n video: Play,\n video_complete: Play,\n video_contact: Play,\n video_complete_contact: Play,\n // Leads\n new_lead: UserPlus,\n page_views_contact: UserPlus,\n smart_link_clicked: UserPlus,\n // Page Views\n page_views: Eye,\n // Events\n upcoming_event: Calendar,\n // Reviews\n review_left: Star,\n // Tasks\n tasks: SquareCheck,\n // Announcements\n announcements: Bell,\n // Fantasy\n fantasy_point: Trophy,\n};\n\nconst getActivityIcon = (slug: ActivitySlug) => ACTIVITY_ICON_MAP[slug] ?? User;\n\n// Activity feed item component\ntype ActivityFeedItemProps = {\n activity: Activity;\n accentColor: ColorOptions;\n textColor: ColorOptions;\n};\n\nfunction ActivityFeedItem({\n activity,\n accentColor,\n textColor,\n}: ActivityFeedItemProps) {\n const Icon = getActivityIcon(activity.slug);\n\n return (\n <div className=\"flex w-full items-start gap-1.5\">\n {/* Avatar */}\n <div className=\"shrink-0\">\n {activity.avatarUrl ? (\n <div className=\"relative size-8 overflow-hidden rounded-full\">\n <img\n src={activity.avatarUrl}\n alt={activity.userName}\n className=\"size-full object-cover\"\n />\n <div className=\"border-foreground/[0.08] absolute inset-0 rounded-full border\" />\n </div>\n ) : (\n <div\n className={`bg-muted flex size-8 items-center justify-center rounded-full`}\n >\n <Icon className={`size-3.5 text-${textColor} opacity-60`} />\n </div>\n )}\n </div>\n\n {/* Content */}\n <div className=\"min-w-0 flex-1\">\n <div className=\"flex w-full items-center gap-1.5\">\n <p\n className={`flex-1 text-base font-semibold text-${textColor} truncate`}\n >\n {activity.activityType}\n </p>\n <p className={`text-xs text-${textColor} shrink-0 opacity-50`}>\n {formatTimestamp(activity.timestamp)}\n </p>\n </div>\n <p className={`text-sm text-${textColor} opacity-80`}>\n <span className={`font-medium text-${accentColor}`}>\n {activity.userName}\n </span>{\" \"}\n <span\n dangerouslySetInnerHTML={{\n __html: DOMPurify.sanitize(activity.targetName, {\n ALLOWED_TAGS: [\"br\", \"strong\", \"em\", \"b\", \"i\"],\n ALLOWED_ATTR: [],\n }),\n }}\n />\n </p>\n </div>\n </div>\n );\n}\n\ntype RecentActivityWidgetProps = ComponentProps<\"div\"> & {\n // Title\n titleEnabled?: boolean;\n titleText?: string;\n titleFontSize?: FontSizeOptions;\n titleColor?: ColorOptions;\n\n // Styling\n background?: BackgroundValue;\n textColor?: ColorOptions;\n accentColor?: ColorOptions;\n padding?: PaddingOptions;\n borderRadius?: BorderRadiusOptions;\n borderWidth?: BorderWidthOptions;\n borderColor?: ColorOptions;\n\n // Activity settings\n maxItemsToShow?: number;\n};\n\nexport function RecentActivityWidget({\n // Title defaults\n titleEnabled = true,\n titleText = \"Recent Activity\",\n titleFontSize = \"lg\",\n titleColor = \"foreground\",\n\n // Styling defaults\n background = {\n type: \"solid\",\n color: \"background\",\n },\n textColor = \"foreground\",\n accentColor = \"primary\",\n padding = 4,\n borderRadius = \"md\",\n borderWidth = \"thin\",\n borderColor = \"muted\",\n\n // Activity defaults\n maxItemsToShow = 5,\n\n className,\n ...props\n}: RecentActivityWidgetProps): React.JSX.Element {\n const backgroundColor = background.color || \"background\";\n const backgroundImage =\n (background.resource?.image_url || background.resource?.imageUrl) &&\n background.type === \"image\"\n ? `url(${background.resource.image_url || background.resource.imageUrl})`\n : \"none\";\n const { data: activities = [], isLoading, isError } = useActivities();\n\n const groupedActivities = useMemo(\n () => groupActivitiesByDate(activities),\n [activities],\n );\n\n const totalCount = Math.min(activities.length, maxItemsToShow);\n\n // Get activities to display (limited by maxItemsToShow)\n const activitiesToShow = useMemo(() => {\n const result: { date: string; items: Activity[] }[] = [];\n let count = 0;\n\n for (const [dateKey, items] of groupedActivities) {\n if (count >= maxItemsToShow) break;\n\n const remainingSlots = maxItemsToShow - count;\n const itemsToAdd = items.slice(0, remainingSlots);\n\n if (itemsToAdd.length > 0) {\n result.push({\n date: formatDateHeader(items[0]?.timestamp ?? dateKey),\n items: itemsToAdd,\n });\n count += itemsToAdd.length;\n }\n }\n\n return result;\n }, [groupedActivities, maxItemsToShow]);\n\n return (\n <div\n className={`@container overflow-hidden rounded-${borderRadius} bg-${backgroundColor} text-${textColor} ${borderWidthClasses[borderWidth]} ${borderWidth !== \"none\" ? borderColorClasses[borderColor] : \"\"} ${className}`}\n style={{ backgroundImage }}\n {...props}\n >\n <div className={`p-${padding} flex flex-col gap-2`}>\n {/* Header */}\n {titleEnabled && titleText && (\n <div className=\"flex w-full items-start gap-2\">\n <h2\n className={`flex-1 text-${titleFontSize} font-header font-bold text-${titleColor}`}\n >\n {titleText}\n </h2>\n {!isLoading && (\n <span\n className={`text-4xl font-bold text-${textColor} leading-none`}\n >\n {totalCount.toString().padStart(2, \"0\")}\n </span>\n )}\n </div>\n )}\n\n {/* Loading state */}\n {isLoading ? (\n <div className=\"flex min-h-[200px] items-center justify-center\">\n <div className=\"h-8 w-8 animate-spin rounded-full border-2 border-current border-t-transparent\" />\n </div>\n ) : isError ? (\n /* Error state */\n <ErrorState />\n ) : activities.length === 0 ? (\n /* Empty state */\n <div className=\"flex min-h-[200px] flex-col items-center justify-center gap-2\">\n <User className={`size-12 text-${textColor} opacity-30`} />\n <p\n className={`text-base font-semibold text-${textColor} opacity-50`}\n >\n No Activity To Report\n </p>\n <p className={`text-sm text-${textColor} opacity-40`}>\n You'll Do Great!\n </p>\n </div>\n ) : (\n /* Activity list */\n <div className=\"flex flex-col gap-4\">\n {activitiesToShow.map((group, groupIndex) => (\n <div key={groupIndex} className=\"flex flex-col gap-4\">\n {/* Date header */}\n <p className={`text-base font-semibold text-${textColor}`}>\n {group.date}\n </p>\n\n {/* Activity items */}\n <div className=\"flex flex-col gap-4\">\n {group.items.map((activity) => (\n <ActivityFeedItem\n key={activity.id}\n activity={activity}\n accentColor={accentColor}\n textColor={textColor}\n />\n ))}\n </div>\n </div>\n ))}\n </div>\n )}\n </div>\n </div>\n );\n}\n\nexport const recentActivityWidgetPropertySchema: WidgetPropertySchema = {\n widgetType: \"RecentActivityWidget\",\n displayName: \"Recent Activity Widget\",\n tabsConfig: [{ id: \"styling\", label: \"Styling\" }],\n fields: [\n // Styling Tab - Title Group\n {\n key: \"titleEnabled\",\n label: \"Widget Title\",\n type: \"boolean\",\n description: \"Enable the title displayed above the activity feed\",\n defaultValue: true,\n tab: \"styling\",\n group: \"Title\",\n },\n {\n key: \"titleText\",\n label: \"Title\",\n type: \"text\",\n description: \"Title text displayed above the activity feed\",\n defaultValue: \"Recent Activity\",\n tab: \"styling\",\n group: \"Title\",\n requiresKeyToBeTrue: \"titleEnabled\",\n },\n getFontSizeField({\n key: \"titleFontSize\",\n label: \"Title Font Size\",\n description: \"Font size for the widget title\",\n defaultValue: \"xl\",\n tab: \"styling\",\n group: \"Title\",\n requiresKeyToBeTrue: \"titleEnabled\",\n }),\n getColorField({\n key: \"titleColor\",\n label: \"Title Color\",\n description: \"Color for the widget title\",\n defaultValue: \"foreground\",\n tab: \"styling\",\n group: \"Title\",\n requiresKeyToBeTrue: \"titleEnabled\",\n }),\n\n // Styling Tab - Design Group\n {\n type: \"background\",\n key: \"background\",\n label: \"Background\",\n description: \"Background for the widget container\",\n defaultValue: \"background\",\n tab: \"styling\",\n group: \"Design\",\n },\n getColorField({\n key: \"textColor\",\n label: \"Text Color\",\n description: \"Default text color for activity content\",\n defaultValue: \"foreground\",\n tab: \"styling\",\n group: \"Design\",\n }),\n getColorField({\n key: \"accentColor\",\n label: \"Accent Color\",\n description: \"Color used for links and highlights\",\n defaultValue: \"primary\",\n tab: \"styling\",\n group: \"Design\",\n }),\n {\n key: \"separator\",\n type: \"separator\",\n label: \"Separator\",\n tab: \"styling\",\n group: \"Design\",\n },\n getPaddingField({\n key: \"padding\",\n label: \"Padding\",\n description: \"Padding around the widget container\",\n defaultValue: 4,\n tab: \"styling\",\n group: \"Design\",\n }),\n getBorderRadiusField({\n key: \"borderRadius\",\n label: \"Border Radius\",\n description: \"Border radius for the widget container\",\n defaultValue: \"md\",\n tab: \"styling\",\n group: \"Design\",\n }),\n getBorderWidthField({\n key: \"borderWidth\",\n label: \"Border Width\",\n description: \"Border width for the widget container\",\n defaultValue: \"thin\",\n tab: \"styling\",\n group: \"Design\",\n }),\n getBorderColorField({\n key: \"borderColor\",\n label: \"Border Color\",\n description: \"Border color for the widget container\",\n defaultValue: \"muted\",\n tab: \"styling\",\n group: \"Design\",\n }),\n\n // Styling Tab - Display Group\n {\n key: \"maxItemsToShow\",\n label: \"Max Items\",\n type: \"number\",\n description: \"Maximum number of activity items to display\",\n defaultValue: 5,\n tab: \"styling\",\n group: \"Display\",\n },\n ],\n} as const satisfies WidgetPropertySchema;\n"],"mappings":"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"}

package/dist/{SeparatorWidget-DQEGdSLZ.mjs → SeparatorWidget-CkFIxxkI.mjs} RENAMED Viewed

@@ -1,5 +1,5 @@
 import { n as __exportAll } from "./chunk-CRV2RMSr.mjs";
-import { a as getColorField } from "./fields-DW1nDGRz.mjs";
+import { l as getColorField } from "./fields-CjDogNNF.mjs";
 import { jsx } from "react/jsx-runtime";
 import { Ban } from "lucide-react";
 //#region ../widgets/src/widgets/SeparatorWidget.tsx
@@ -166,4 +166,4 @@ const separatorWidgetPropertySchema = {
 //#endregion
 export { SeparatorWidget_exports as n, separatorWidgetPropertySchema as r, SeparatorWidget as t };
-//# sourceMappingURL=SeparatorWidget-DQEGdSLZ.mjs.map
+//# sourceMappingURL=SeparatorWidget-CkFIxxkI.mjs.map

package/dist/{SeparatorWidget-DQEGdSLZ.mjs.map → SeparatorWidget-CkFIxxkI.mjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SeparatorWidget-~~DQEGdSLZ~~.mjs","names":[],"sources":["../../widgets/src/widgets/SeparatorWidget.tsx"],"sourcesContent":["import type { WidgetPropertySchema } from \"@fluid-app/portal-core/registries\";\nimport type { ColorOptions } from \"@fluid-app/portal-core/types\";\nimport { Ban } from \"lucide-react\";\nimport type { ComponentProps } from \"react\";\nimport type React from \"react\";\nimport { getColorField } from \"../core/fields\";\n\ntype SpacingOptions = 0 \| 2 \| 4 \| 6 \| 8 \| 10;\n\ntype SeparatorWidgetProps = ComponentProps<\"div\"> & {\n orientation?: \"horizontal\" \| \"vertical\";\n color?: ColorOptions;\n thickness?: `${number}px`;\n width?: `${number}%`;\n marginTop?: SpacingOptions;\n marginBottom?: SpacingOptions;\n};\n\nexport function SeparatorWidget({\n orientation = \"horizontal\",\n color = \"muted\",\n thickness = \"1px\",\n width = \"100%\",\n marginTop = 4,\n marginBottom = 4,\n className,\n style,\n ...props\n}: SeparatorWidgetProps): React.JSX.Element {\n const isHorizontal = orientation === \"horizontal\";\n\n return (\n <div\n className={`flex ${isHorizontal ? \"flex-row justify-center\" : \"h-full flex-col items-center\"} ${className ?? \"\"}`}\n style={{\n ...(isHorizontal\n ? {\n marginTop: `${marginTop * 4}px`,\n marginBottom: `${marginBottom * 4}px`,\n }\n : {\n paddingTop: `${marginTop * 4}px`,\n paddingBottom: `${marginBottom * 4}px`,\n }),\n ...style,\n }}\n aria-hidden=\"true\"\n {...props}\n >\n {isHorizontal ? (\n <div\n className={`bg-${color}`}\n style={{\n width,\n height: thickness,\n }}\n />\n ) : (\n <div\n className={`bg-${color}`}\n style={{\n width: thickness,\n height: \"100%\",\n }}\n />\n )}\n </div>\n );\n}\n\nexport const separatorWidgetPropertySchema: WidgetPropertySchema = {\n widgetType: \"SeparatorWidget\",\n displayName: \"Separator\",\n fields: [\n {\n key: \"orientation\",\n label: \"Orientation\",\n type: \"select\",\n description: \"Direction of the separator line\",\n defaultValue: \"horizontal\",\n options: [\n { label: \"Horizontal\", value: \"horizontal\" },\n { label: \"Vertical\", value: \"vertical\" },\n ],\n group: \"Separator\",\n },\n getColorField({\n key: \"color\",\n label: \"Color\",\n description: \"Color of the separator line\",\n defaultValue: \"muted\",\n group: \"Separator\",\n }),\n {\n key: \"thickness\",\n label: \"Thickness\",\n type: \"cssUnit\",\n description: \"Thickness of the separator line\",\n defaultValue: \"1px\",\n allowedUnits: [\"px\"],\n minByUnit: { px: 1 },\n maxByUnit: { px: 20 },\n stepByUnit: { px: 1 },\n group: \"Separator\",\n },\n {\n key: \"width\",\n label: \"Width\",\n type: \"cssUnit\",\n description: \"Width of the separator\",\n defaultValue: \"100%\",\n allowedUnits: [\"%\"],\n defaultUnit: \"%\",\n minByUnit: { \"%\": 1 },\n maxByUnit: { \"%\": 100 },\n stepByUnit: { \"%\": 1 },\n group: \"Separator\",\n requiresKeyValue: { key: \"orientation\", value: \"horizontal\" },\n },\n {\n key: \"marginTop\",\n label: \"Margin Top\",\n type: \"buttonGroup\",\n description: \"Space above the separator\",\n defaultValue: 4,\n options: [\n { icon: Ban, value: 0 },\n { label: \"SM\", value: 2 },\n { label: \"MD\", value: 4 },\n { label: \"LG\", value: 6 },\n { label: \"XL\", value: 8 },\n { label: \"FULL\", value: 10 },\n ],\n group: \"Spacing\",\n },\n {\n key: \"marginBottom\",\n label: \"Margin Bottom\",\n type: \"buttonGroup\",\n description: \"Space below the separator\",\n defaultValue: 4,\n options: [\n { icon: Ban, value: 0 },\n { label: \"SM\", value: 2 },\n { label: \"MD\", value: 4 },\n { label: \"LG\", value: 6 },\n { label: \"XL\", value: 8 },\n { label: \"FULL\", value: 10 },\n ],\n group: \"Spacing\",\n },\n ],\n};\n"],"mappings":";;;;;;;;;AAkBA,SAAgB,gBAAgB,EAC9B,cAAc,cACd,QAAQ,SACR,YAAY,OACZ,QAAQ,QACR,YAAY,GACZ,eAAe,GACf,WACA,OACA,GAAG,SACuC;CAC1C,MAAM,eAAe,gBAAgB;AAErC,QACE,oBAAC,OAAD;EACE,WAAW,QAAQ,eAAe,4BAA4B,+BAA+B,GAAG,aAAa;EAC7G,OAAO;GACL,GAAI,eACA;IACE,WAAW,GAAG,YAAY,EAAE;IAC5B,cAAc,GAAG,eAAe,EAAE;IACnC,GACD;IACE,YAAY,GAAG,YAAY,EAAE;IAC7B,eAAe,GAAG,eAAe,EAAE;IACpC;GACL,GAAG;GACJ;EACD,eAAY;EACZ,GAAI;YAEH,eACC,oBAAC,OAAD;GACE,WAAW,MAAM;GACjB,OAAO;IACL;IACA,QAAQ;IACT;GACD,CAAA,GAEF,oBAAC,OAAD;GACE,WAAW,MAAM;GACjB,OAAO;IACL,OAAO;IACP,QAAQ;IACT;GACD,CAAA;EAEA,CAAA;;AAIV,MAAa,gCAAsD;CACjE,YAAY;CACZ,aAAa;CACb,QAAQ;EACN;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,SAAS,CACP;IAAE,OAAO;IAAc,OAAO;IAAc,EAC5C;IAAE,OAAO;IAAY,OAAO;IAAY,CACzC;GACD,OAAO;GACR;EACD,cAAc;GACZ,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,OAAO;GACR,CAAC;EACF;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,cAAc,CAAC,KAAK;GACpB,WAAW,EAAE,IAAI,GAAG;GACpB,WAAW,EAAE,IAAI,IAAI;GACrB,YAAY,EAAE,IAAI,GAAG;GACrB,OAAO;GACR;EACD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,cAAc,CAAC,IAAI;GACnB,aAAa;GACb,WAAW,EAAE,KAAK,GAAG;GACrB,WAAW,EAAE,KAAK,KAAK;GACvB,YAAY,EAAE,KAAK,GAAG;GACtB,OAAO;GACP,kBAAkB;IAAE,KAAK;IAAe,OAAO;IAAc;GAC9D;EACD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,SAAS;IACP;KAAE,MAAM;KAAK,OAAO;KAAG;IACvB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAQ,OAAO;KAAI;IAC7B;GACD,OAAO;GACR;EACD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,SAAS;IACP;KAAE,MAAM;KAAK,OAAO;KAAG;IACvB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAQ,OAAO;KAAI;IAC7B;GACD,OAAO;GACR;EACF;CACF"}
1	+ {"version":3,"file":"SeparatorWidget-CkFIxxkI.mjs","names":[],"sources":["../../widgets/src/widgets/SeparatorWidget.tsx"],"sourcesContent":["import type { WidgetPropertySchema } from \"@fluid-app/portal-core/registries\";\nimport type { ColorOptions } from \"@fluid-app/portal-core/types\";\nimport { Ban } from \"lucide-react\";\nimport type { ComponentProps } from \"react\";\nimport type React from \"react\";\nimport { getColorField } from \"../core/fields\";\n\ntype SpacingOptions = 0 \| 2 \| 4 \| 6 \| 8 \| 10;\n\ntype SeparatorWidgetProps = ComponentProps<\"div\"> & {\n orientation?: \"horizontal\" \| \"vertical\";\n color?: ColorOptions;\n thickness?: `${number}px`;\n width?: `${number}%`;\n marginTop?: SpacingOptions;\n marginBottom?: SpacingOptions;\n};\n\nexport function SeparatorWidget({\n orientation = \"horizontal\",\n color = \"muted\",\n thickness = \"1px\",\n width = \"100%\",\n marginTop = 4,\n marginBottom = 4,\n className,\n style,\n ...props\n}: SeparatorWidgetProps): React.JSX.Element {\n const isHorizontal = orientation === \"horizontal\";\n\n return (\n <div\n className={`flex ${isHorizontal ? \"flex-row justify-center\" : \"h-full flex-col items-center\"} ${className ?? \"\"}`}\n style={{\n ...(isHorizontal\n ? {\n marginTop: `${marginTop * 4}px`,\n marginBottom: `${marginBottom * 4}px`,\n }\n : {\n paddingTop: `${marginTop * 4}px`,\n paddingBottom: `${marginBottom * 4}px`,\n }),\n ...style,\n }}\n aria-hidden=\"true\"\n {...props}\n >\n {isHorizontal ? (\n <div\n className={`bg-${color}`}\n style={{\n width,\n height: thickness,\n }}\n />\n ) : (\n <div\n className={`bg-${color}`}\n style={{\n width: thickness,\n height: \"100%\",\n }}\n />\n )}\n </div>\n );\n}\n\nexport const separatorWidgetPropertySchema: WidgetPropertySchema = {\n widgetType: \"SeparatorWidget\",\n displayName: \"Separator\",\n fields: [\n {\n key: \"orientation\",\n label: \"Orientation\",\n type: \"select\",\n description: \"Direction of the separator line\",\n defaultValue: \"horizontal\",\n options: [\n { label: \"Horizontal\", value: \"horizontal\" },\n { label: \"Vertical\", value: \"vertical\" },\n ],\n group: \"Separator\",\n },\n getColorField({\n key: \"color\",\n label: \"Color\",\n description: \"Color of the separator line\",\n defaultValue: \"muted\",\n group: \"Separator\",\n }),\n {\n key: \"thickness\",\n label: \"Thickness\",\n type: \"cssUnit\",\n description: \"Thickness of the separator line\",\n defaultValue: \"1px\",\n allowedUnits: [\"px\"],\n minByUnit: { px: 1 },\n maxByUnit: { px: 20 },\n stepByUnit: { px: 1 },\n group: \"Separator\",\n },\n {\n key: \"width\",\n label: \"Width\",\n type: \"cssUnit\",\n description: \"Width of the separator\",\n defaultValue: \"100%\",\n allowedUnits: [\"%\"],\n defaultUnit: \"%\",\n minByUnit: { \"%\": 1 },\n maxByUnit: { \"%\": 100 },\n stepByUnit: { \"%\": 1 },\n group: \"Separator\",\n requiresKeyValue: { key: \"orientation\", value: \"horizontal\" },\n },\n {\n key: \"marginTop\",\n label: \"Margin Top\",\n type: \"buttonGroup\",\n description: \"Space above the separator\",\n defaultValue: 4,\n options: [\n { icon: Ban, value: 0 },\n { label: \"SM\", value: 2 },\n { label: \"MD\", value: 4 },\n { label: \"LG\", value: 6 },\n { label: \"XL\", value: 8 },\n { label: \"FULL\", value: 10 },\n ],\n group: \"Spacing\",\n },\n {\n key: \"marginBottom\",\n label: \"Margin Bottom\",\n type: \"buttonGroup\",\n description: \"Space below the separator\",\n defaultValue: 4,\n options: [\n { icon: Ban, value: 0 },\n { label: \"SM\", value: 2 },\n { label: \"MD\", value: 4 },\n { label: \"LG\", value: 6 },\n { label: \"XL\", value: 8 },\n { label: \"FULL\", value: 10 },\n ],\n group: \"Spacing\",\n },\n ],\n};\n"],"mappings":";;;;;;;;;AAkBA,SAAgB,gBAAgB,EAC9B,cAAc,cACd,QAAQ,SACR,YAAY,OACZ,QAAQ,QACR,YAAY,GACZ,eAAe,GACf,WACA,OACA,GAAG,SACuC;CAC1C,MAAM,eAAe,gBAAgB;AAErC,QACE,oBAAC,OAAD;EACE,WAAW,QAAQ,eAAe,4BAA4B,+BAA+B,GAAG,aAAa;EAC7G,OAAO;GACL,GAAI,eACA;IACE,WAAW,GAAG,YAAY,EAAE;IAC5B,cAAc,GAAG,eAAe,EAAE;IACnC,GACD;IACE,YAAY,GAAG,YAAY,EAAE;IAC7B,eAAe,GAAG,eAAe,EAAE;IACpC;GACL,GAAG;GACJ;EACD,eAAY;EACZ,GAAI;YAEH,eACC,oBAAC,OAAD;GACE,WAAW,MAAM;GACjB,OAAO;IACL;IACA,QAAQ;IACT;GACD,CAAA,GAEF,oBAAC,OAAD;GACE,WAAW,MAAM;GACjB,OAAO;IACL,OAAO;IACP,QAAQ;IACT;GACD,CAAA;EAEA,CAAA;;AAIV,MAAa,gCAAsD;CACjE,YAAY;CACZ,aAAa;CACb,QAAQ;EACN;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,SAAS,CACP;IAAE,OAAO;IAAc,OAAO;IAAc,EAC5C;IAAE,OAAO;IAAY,OAAO;IAAY,CACzC;GACD,OAAO;GACR;EACD,cAAc;GACZ,KAAK;GACL,OAAO;GACP,aAAa;GACb,cAAc;GACd,OAAO;GACR,CAAC;EACF;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,cAAc,CAAC,KAAK;GACpB,WAAW,EAAE,IAAI,GAAG;GACpB,WAAW,EAAE,IAAI,IAAI;GACrB,YAAY,EAAE,IAAI,GAAG;GACrB,OAAO;GACR;EACD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,cAAc,CAAC,IAAI;GACnB,aAAa;GACb,WAAW,EAAE,KAAK,GAAG;GACrB,WAAW,EAAE,KAAK,KAAK;GACvB,YAAY,EAAE,KAAK,GAAG;GACtB,OAAO;GACP,kBAAkB;IAAE,KAAK;IAAe,OAAO;IAAc;GAC9D;EACD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,SAAS;IACP;KAAE,MAAM;KAAK,OAAO;KAAG;IACvB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAQ,OAAO;KAAI;IAC7B;GACD,OAAO;GACR;EACD;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,SAAS;IACP;KAAE,MAAM;KAAK,OAAO;KAAG;IACvB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAM,OAAO;KAAG;IACzB;KAAE,OAAO;KAAQ,OAAO;KAAI;IAC7B;GACD,OAAO;GACR;EACF;CACF"}

package/dist/{ShareablesScreen-DX_Drc1P.mjs → ShareablesScreen-0JcyLc7i.mjs} RENAMED Viewed

@@ -1,6 +1,6 @@
-import { i as useSdkClient } from "./use-account-clients-DSdeJkp0.mjs";
-import { i as ShareablesCoreProvider, n as ShareablesApp, r as ShareablesUIProvider } from "./src-CzKSt-6K.mjs";
-import { i as useCurrentUser } from "./products-fvXefwYo.mjs";
+import { i as useSdkClient } from "./use-account-clients-EEcG-B1B.mjs";
+import { i as ShareablesCoreProvider, n as ShareablesApp, r as ShareablesUIProvider } from "./src-CIhTbou2.mjs";
+import { i as useCurrentUser } from "./products-DOCuAQDz.mjs";
 import { n as useAppNavigation } from "./AppNavigationContext-CcRZ_LqM.mjs";
 import { useCallback, useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -130,4 +130,4 @@ const shareablesScreenPropertySchema = {
 //#endregion
 export { shareablesScreenPropertySchema as n, ShareablesScreen as t };
-//# sourceMappingURL=ShareablesScreen-DX_Drc1P.mjs.map
+//# sourceMappingURL=ShareablesScreen-0JcyLc7i.mjs.map

package/dist/{ShareablesScreen-DX_Drc1P.mjs.map → ShareablesScreen-0JcyLc7i.mjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ShareablesScreen-~~DX_Drc1P~~.mjs","names":[],"sources":["../../../file-picker/api-client/src/client.ts","../src/screens/ShareablesScreen.tsx"],"sourcesContent":["import type { FetchClientInstance } from \"@fluid-app/api-client-core\";\nimport type { DamAssetCreateResponse } from \"@fluid-app/file-picker-core\";\n\nexport interface DamUploadStrategy {\n uploadFile(params: {\n file: File;\n name: string;\n description?: string;\n tags?: string[];\n onProgress?: (progress: number) => void;\n companyId?: number;\n }): Promise<DamAssetCreateResponse>;\n}\n\nexport interface FilePickerClientConfig {\n fetchClient: FetchClientInstance;\n uploadStrategy?: DamUploadStrategy;\n unsplashAccessKey?: string;\n proxyEndpoint?: string; // defaults to \"/api/proxy-url\"\n}\n\nexport interface FilePickerClient {\n fetchClient: FetchClientInstance;\n uploadStrategy?: DamUploadStrategy;\n unsplashAccessKey?: string;\n proxyEndpoint: string;\n}\n\nexport function createFilePickerClient(\n config: FilePickerClientConfig,\n): FilePickerClient {\n return {\n fetchClient: config.fetchClient,\n uploadStrategy: config.uploadStrategy,\n unsplashAccessKey: config.unsplashAccessKey,\n proxyEndpoint: config.proxyEndpoint ?? \"/api/proxy-url\",\n };\n}\n","import { useCallback, useMemo, type ComponentProps } from \"react\";\nimport type {\n BackgroundValue,\n BorderRadiusOptions,\n ColorOptions,\n PaddingOptions,\n} from \"../types\";\nimport type { WidgetPropertySchema } from \"../registries/property-schema-types\";\nimport { ShareablesCoreProvider } from \"@fluid-app/shareables-core\";\nimport { ShareablesUIProvider, ShareablesApp } from \"@fluid-app/shareables-ui\";\nimport { createFilePickerClient } from \"@fluid-app/file-picker-api-client\";\nimport { useCurrentUser } from \"../hooks/use-current-user\";\nimport { useAppNavigation } from \"../shell/AppNavigationContext\";\nimport { useSdkClient } from \"../account/use-account-clients\";\n\ntype ShareablesScreenProps = ComponentProps<\"div\"> & {\n background?: BackgroundValue;\n textColor?: ColorOptions;\n accentColor?: ColorOptions;\n padding?: PaddingOptions;\n borderRadius?: BorderRadiusOptions;\n};\n\n/*\n Parse the current shareables sub-route from the full slug.\n \n System nav slugs are \"share/products\", \"share/media\", \"share/playlists\".\n * Detail pages append an ID: \"share/products/123\", \"share/media/456\".\n \n \"share/products\" → screen=\"products\", detailId=null\n * \"share/products/123\" → screen=\"products\", detailId=\"123\"\n * \"share/media/456\" → screen=\"media\", detailId=\"456\"\n * \"share/playlists\" → screen=\"playlists\", detailId=null\n * \"share/playlists/789\" → screen=\"playlists\", detailId=\"789\"\n * \"share/files\" → screen=\"files\", detailId=null\n * \"share\" → screen=null (default to products)\n /\nfunction parseShareablesRoute(currentSlug: string): {\n screen: string \| null;\n detailId: string \| null;\n action: string \| null;\n} {\n // Strip the \"share\" prefix\n const slugWithoutPrefix = currentSlug.replace(/^share\\/?/, \"\");\n if (!slugWithoutPrefix) {\n return { screen: null, detailId: null, action: null };\n }\n\n const parts = slugWithoutPrefix.split(\"/\");\n const screen = parts[0] \|\| null;\n const detailId = parts[1] \|\| null;\n const action = parts[2] \|\| null;\n return { screen, detailId, action };\n}\n\nexport function ShareablesScreen({\n / eslint-disable @typescript-eslint/no-unused-vars -- destructured to exclude from divProps spread /\n background,\n textColor,\n accentColor,\n padding,\n borderRadius,\n / eslint-enable @typescript-eslint/no-unused-vars */\n ...divProps\n}: ShareablesScreenProps): React.JSX.Element {\n const domainClient = useSdkClient();\n const { data: userData } = useCurrentUser();\n const { currentSlug, navigate } = useAppNavigation();\n\n const { screen, detailId, action } = parseShareablesRoute(currentSlug);\n\n const handleNavigate = useCallback(\n (subScreen: string, id?: string) => {\n const path = id ? `share/${subScreen}/${id}` : `share/${subScreen}`;\n navigate(path);\n },\n [navigate],\n );\n\n const handleBack = useCallback(() => {\n if (detailId && screen) {\n // Navigate back to the listing for the current screen\n navigate(`share/${screen}`);\n } else {\n // Navigate to the default shareables screen\n navigate(\"share/products\");\n }\n }, [navigate, detailId, screen]);\n\n const coreConfig = useMemo(\n () => ({\n client: domainClient,\n user: userData ? { id: userData.id } : null,\n repContext: true,\n }),\n [domainClient, userData],\n );\n\n const filePickerClient = useMemo(\n () => createFilePickerClient({ fetchClient: domainClient }),\n [domainClient],\n );\n\n const uiConfig = useMemo(\n () => ({\n user: userData\n ? {\n id: userData.id,\n company: userData.company\n ? { logo_url: userData.company.logo_url }\n : null,\n }\n : undefined,\n affiliateId:\n (userData as { affiliate_id?: number } \| undefined)?.affiliate_id ??\n null,\n basePath: \"\",\n navigate: (path: string) => {\n // Strip leading slash — cards generate paths like \"/share/product/123\"\n const cleanPath = path.replace(/^\\//, \"\");\n // Ensure share/ prefix — screen components pass relative paths like \"media/new\"\n const prefixed = cleanPath.startsWith(\"share/\")\n ? cleanPath\n : `share/${cleanPath}`;\n navigate(prefixed);\n },\n showToast: (opts: {\n title: string;\n type: \"success\" \| \"error\" \| \"warning\";\n }) => {\n console.warn(`[Shareables] ${opts.type}: ${opts.title}`);\n },\n filePickerClient,\n onToggleFavorite: async (params: {\n favoriteableId: number;\n favoriteableType: string;\n }) => {\n const affiliateId = (userData as { affiliate_id?: number } \| undefined)\n ?.affiliate_id;\n if (!affiliateId) throw new Error(\"No affiliate ID\");\n return domainClient.post<{ is_favorited: boolean }>(\n `/user_companies/${affiliateId}/favorites/toggle.json`,\n {\n favoriteable_id: params.favoriteableId,\n favoriteable_type: params.favoriteableType,\n },\n );\n },\n onDeletePlaylist: async (playlistId: number) => {\n const { playlists: playlistsApi } =\n await import(\"@fluid-app/shareables-api-client\");\n await playlistsApi.deletePlaylist(domainClient, playlistId);\n },\n }),\n [userData, navigate, filePickerClient, domainClient],\n );\n\n return (\n <div {...divProps} className={`h-full ${divProps.className ?? \"\"}`}>\n <ShareablesCoreProvider config={coreConfig}>\n <ShareablesUIProvider config={uiConfig}>\n <ShareablesApp\n screen={screen}\n detailId={detailId}\n action={action}\n companyLogoUrl={userData?.company?.logo_url}\n countryCode={userData?.country?.iso}\n onNavigate={handleNavigate}\n onBack={handleBack}\n />\n </ShareablesUIProvider>\n </ShareablesCoreProvider>\n </div>\n );\n}\n\nexport const shareablesScreenPropertySchema: WidgetPropertySchema = {\n widgetType: \"ShareablesScreen\",\n displayName: \"Shareables Screen\",\n tabsConfig: [{ id: \"styling\", label: \"Styling\" }],\n fields: [],\n} as const satisfies WidgetPropertySchema;\n"],"mappings":";;;;;;;AA4BA,SAAgB,uBACd,QACkB;AAClB,QAAO;EACL,aAAa,OAAO;EACpB,gBAAgB,OAAO;EACvB,mBAAmB,OAAO;EAC1B,eAAe,OAAO,iBAAiB;EACxC;;;;;;;;;;;;;;;;;;ACCH,SAAS,qBAAqB,aAI5B;CAEA,MAAM,oBAAoB,YAAY,QAAQ,aAAa,GAAG;AAC9D,KAAI,CAAC,kBACH,QAAO;EAAE,QAAQ;EAAM,UAAU;EAAM,QAAQ;EAAM;CAGvD,MAAM,QAAQ,kBAAkB,MAAM,IAAI;AAI1C,QAAO;EAAE,QAHM,MAAM,MAAM;EAGV,UAFA,MAAM,MAAM;EAEF,QADZ,MAAM,MAAM;EACQ;;AAGrC,SAAgB,iBAAiB,EAE/B,YACA,WACA,aACA,SACA,cAEA,GAAG,YACwC;CAC3C,MAAM,eAAe,cAAc;CACnC,MAAM,EAAE,MAAM,aAAa,gBAAgB;CAC3C,MAAM,EAAE,aAAa,aAAa,kBAAkB;CAEpD,MAAM,EAAE,QAAQ,UAAU,WAAW,qBAAqB,YAAY;CAEtE,MAAM,iBAAiB,aACpB,WAAmB,OAAgB;AAElC,WADa,KAAK,SAAS,UAAU,GAAG,OAAO,SAAS,YAC1C;IAEhB,CAAC,SAAS,CACX;CAED,MAAM,aAAa,kBAAkB;AACnC,MAAI,YAAY,OAEd,UAAS,SAAS,SAAS;MAG3B,UAAS,iBAAiB;IAE3B;EAAC;EAAU;EAAU;EAAO,CAAC;CAEhC,MAAM,aAAa,eACV;EACL,QAAQ;EACR,MAAM,WAAW,EAAE,IAAI,SAAS,IAAI,GAAG;EACvC,YAAY;EACb,GACD,CAAC,cAAc,SAAS,CACzB;CAED,MAAM,mBAAmB,cACjB,uBAAuB,EAAE,aAAa,cAAc,CAAC,EAC3D,CAAC,aAAa,CACf;CAED,MAAM,WAAW,eACR;EACL,MAAM,WACF;GACE,IAAI,SAAS;GACb,SAAS,SAAS,UACd,EAAE,UAAU,SAAS,QAAQ,UAAU,GACvC;GACL,GACD,KAAA;EACJ,aACG,UAAoD,gBACrD;EACF,UAAU;EACV,WAAW,SAAiB;GAE1B,MAAM,YAAY,KAAK,QAAQ,OAAO,GAAG;AAKzC,YAHiB,UAAU,WAAW,SAAS,GAC3C,YACA,SAAS,YACK;;EAEpB,YAAY,SAGN;AACJ,WAAQ,KAAK,gBAAgB,KAAK,KAAK,IAAI,KAAK,QAAQ;;EAE1D;EACA,kBAAkB,OAAO,WAGnB;GACJ,MAAM,cAAe,UACjB;AACJ,OAAI,CAAC,YAAa,OAAM,IAAI,MAAM,kBAAkB;AACpD,UAAO,aAAa,KAClB,mBAAmB,YAAY,yBAC/B;IACE,iBAAiB,OAAO;IACxB,mBAAmB,OAAO;IAC3B,CACF;;EAEH,kBAAkB,OAAO,eAAuB;GAC9C,MAAM,EAAE,WAAW,iBACjB,MAAM,OAAO,sBAAA,MAAA,MAAA,EAAA,EAAA;AACf,SAAM,aAAa,eAAe,cAAc,WAAW;;EAE9D,GACD;EAAC;EAAU;EAAU;EAAkB;EAAa,CACrD;AAED,QACE,oBAAC,OAAD;EAAK,GAAI;EAAU,WAAW,UAAU,SAAS,aAAa;YAC5D,oBAAC,wBAAD;GAAwB,QAAQ;aAC9B,oBAAC,sBAAD;IAAsB,QAAQ;cAC5B,oBAAC,eAAD;KACU;KACE;KACF;KACR,gBAAgB,UAAU,SAAS;KACnC,aAAa,UAAU,SAAS;KAChC,YAAY;KACZ,QAAQ;KACR,CAAA;IACmB,CAAA;GACA,CAAA;EACrB,CAAA;;AAIV,MAAa,iCAAuD;CAClE,YAAY;CACZ,aAAa;CACb,YAAY,CAAC;EAAE,IAAI;EAAW,OAAO;EAAW,CAAC;CACjD,QAAQ,EAAE;CACX"}
1	+ {"version":3,"file":"ShareablesScreen-0JcyLc7i.mjs","names":[],"sources":["../../../file-picker/api-client/src/client.ts","../src/screens/ShareablesScreen.tsx"],"sourcesContent":["import type { FetchClientInstance } from \"@fluid-app/api-client-core\";\nimport type { DamAssetCreateResponse } from \"@fluid-app/file-picker-core\";\n\nexport interface DamUploadStrategy {\n uploadFile(params: {\n file: File;\n name: string;\n description?: string;\n tags?: string[];\n onProgress?: (progress: number) => void;\n companyId?: number;\n }): Promise<DamAssetCreateResponse>;\n}\n\nexport interface FilePickerClientConfig {\n fetchClient: FetchClientInstance;\n uploadStrategy?: DamUploadStrategy;\n unsplashAccessKey?: string;\n proxyEndpoint?: string; // defaults to \"/api/proxy-url\"\n}\n\nexport interface FilePickerClient {\n fetchClient: FetchClientInstance;\n uploadStrategy?: DamUploadStrategy;\n unsplashAccessKey?: string;\n proxyEndpoint: string;\n}\n\nexport function createFilePickerClient(\n config: FilePickerClientConfig,\n): FilePickerClient {\n return {\n fetchClient: config.fetchClient,\n uploadStrategy: config.uploadStrategy,\n unsplashAccessKey: config.unsplashAccessKey,\n proxyEndpoint: config.proxyEndpoint ?? \"/api/proxy-url\",\n };\n}\n","import { useCallback, useMemo, type ComponentProps } from \"react\";\nimport type {\n BackgroundValue,\n BorderRadiusOptions,\n ColorOptions,\n PaddingOptions,\n} from \"../types\";\nimport type { WidgetPropertySchema } from \"../registries/property-schema-types\";\nimport { ShareablesCoreProvider } from \"@fluid-app/shareables-core\";\nimport { ShareablesUIProvider, ShareablesApp } from \"@fluid-app/shareables-ui\";\nimport { createFilePickerClient } from \"@fluid-app/file-picker-api-client\";\nimport { useCurrentUser } from \"../hooks/use-current-user\";\nimport { useAppNavigation } from \"../shell/AppNavigationContext\";\nimport { useSdkClient } from \"../account/use-account-clients\";\n\ntype ShareablesScreenProps = ComponentProps<\"div\"> & {\n background?: BackgroundValue;\n textColor?: ColorOptions;\n accentColor?: ColorOptions;\n padding?: PaddingOptions;\n borderRadius?: BorderRadiusOptions;\n};\n\n/*\n Parse the current shareables sub-route from the full slug.\n \n System nav slugs are \"share/products\", \"share/media\", \"share/playlists\".\n * Detail pages append an ID: \"share/products/123\", \"share/media/456\".\n \n \"share/products\" → screen=\"products\", detailId=null\n * \"share/products/123\" → screen=\"products\", detailId=\"123\"\n * \"share/media/456\" → screen=\"media\", detailId=\"456\"\n * \"share/playlists\" → screen=\"playlists\", detailId=null\n * \"share/playlists/789\" → screen=\"playlists\", detailId=\"789\"\n * \"share/files\" → screen=\"files\", detailId=null\n * \"share\" → screen=null (default to products)\n /\nfunction parseShareablesRoute(currentSlug: string): {\n screen: string \| null;\n detailId: string \| null;\n action: string \| null;\n} {\n // Strip the \"share\" prefix\n const slugWithoutPrefix = currentSlug.replace(/^share\\/?/, \"\");\n if (!slugWithoutPrefix) {\n return { screen: null, detailId: null, action: null };\n }\n\n const parts = slugWithoutPrefix.split(\"/\");\n const screen = parts[0] \|\| null;\n const detailId = parts[1] \|\| null;\n const action = parts[2] \|\| null;\n return { screen, detailId, action };\n}\n\nexport function ShareablesScreen({\n / eslint-disable @typescript-eslint/no-unused-vars -- destructured to exclude from divProps spread /\n background,\n textColor,\n accentColor,\n padding,\n borderRadius,\n / eslint-enable @typescript-eslint/no-unused-vars */\n ...divProps\n}: ShareablesScreenProps): React.JSX.Element {\n const domainClient = useSdkClient();\n const { data: userData } = useCurrentUser();\n const { currentSlug, navigate } = useAppNavigation();\n\n const { screen, detailId, action } = parseShareablesRoute(currentSlug);\n\n const handleNavigate = useCallback(\n (subScreen: string, id?: string) => {\n const path = id ? `share/${subScreen}/${id}` : `share/${subScreen}`;\n navigate(path);\n },\n [navigate],\n );\n\n const handleBack = useCallback(() => {\n if (detailId && screen) {\n // Navigate back to the listing for the current screen\n navigate(`share/${screen}`);\n } else {\n // Navigate to the default shareables screen\n navigate(\"share/products\");\n }\n }, [navigate, detailId, screen]);\n\n const coreConfig = useMemo(\n () => ({\n client: domainClient,\n user: userData ? { id: userData.id } : null,\n repContext: true,\n }),\n [domainClient, userData],\n );\n\n const filePickerClient = useMemo(\n () => createFilePickerClient({ fetchClient: domainClient }),\n [domainClient],\n );\n\n const uiConfig = useMemo(\n () => ({\n user: userData\n ? {\n id: userData.id,\n company: userData.company\n ? { logo_url: userData.company.logo_url }\n : null,\n }\n : undefined,\n affiliateId:\n (userData as { affiliate_id?: number } \| undefined)?.affiliate_id ??\n null,\n basePath: \"\",\n navigate: (path: string) => {\n // Strip leading slash — cards generate paths like \"/share/product/123\"\n const cleanPath = path.replace(/^\\//, \"\");\n // Ensure share/ prefix — screen components pass relative paths like \"media/new\"\n const prefixed = cleanPath.startsWith(\"share/\")\n ? cleanPath\n : `share/${cleanPath}`;\n navigate(prefixed);\n },\n showToast: (opts: {\n title: string;\n type: \"success\" \| \"error\" \| \"warning\";\n }) => {\n console.warn(`[Shareables] ${opts.type}: ${opts.title}`);\n },\n filePickerClient,\n onToggleFavorite: async (params: {\n favoriteableId: number;\n favoriteableType: string;\n }) => {\n const affiliateId = (userData as { affiliate_id?: number } \| undefined)\n ?.affiliate_id;\n if (!affiliateId) throw new Error(\"No affiliate ID\");\n return domainClient.post<{ is_favorited: boolean }>(\n `/user_companies/${affiliateId}/favorites/toggle.json`,\n {\n favoriteable_id: params.favoriteableId,\n favoriteable_type: params.favoriteableType,\n },\n );\n },\n onDeletePlaylist: async (playlistId: number) => {\n const { playlists: playlistsApi } =\n await import(\"@fluid-app/shareables-api-client\");\n await playlistsApi.deletePlaylist(domainClient, playlistId);\n },\n }),\n [userData, navigate, filePickerClient, domainClient],\n );\n\n return (\n <div {...divProps} className={`h-full ${divProps.className ?? \"\"}`}>\n <ShareablesCoreProvider config={coreConfig}>\n <ShareablesUIProvider config={uiConfig}>\n <ShareablesApp\n screen={screen}\n detailId={detailId}\n action={action}\n companyLogoUrl={userData?.company?.logo_url}\n countryCode={userData?.country?.iso}\n onNavigate={handleNavigate}\n onBack={handleBack}\n />\n </ShareablesUIProvider>\n </ShareablesCoreProvider>\n </div>\n );\n}\n\nexport const shareablesScreenPropertySchema: WidgetPropertySchema = {\n widgetType: \"ShareablesScreen\",\n displayName: \"Shareables Screen\",\n tabsConfig: [{ id: \"styling\", label: \"Styling\" }],\n fields: [],\n} as const satisfies WidgetPropertySchema;\n"],"mappings":";;;;;;;AA4BA,SAAgB,uBACd,QACkB;AAClB,QAAO;EACL,aAAa,OAAO;EACpB,gBAAgB,OAAO;EACvB,mBAAmB,OAAO;EAC1B,eAAe,OAAO,iBAAiB;EACxC;;;;;;;;;;;;;;;;;;ACCH,SAAS,qBAAqB,aAI5B;CAEA,MAAM,oBAAoB,YAAY,QAAQ,aAAa,GAAG;AAC9D,KAAI,CAAC,kBACH,QAAO;EAAE,QAAQ;EAAM,UAAU;EAAM,QAAQ;EAAM;CAGvD,MAAM,QAAQ,kBAAkB,MAAM,IAAI;AAI1C,QAAO;EAAE,QAHM,MAAM,MAAM;EAGV,UAFA,MAAM,MAAM;EAEF,QADZ,MAAM,MAAM;EACQ;;AAGrC,SAAgB,iBAAiB,EAE/B,YACA,WACA,aACA,SACA,cAEA,GAAG,YACwC;CAC3C,MAAM,eAAe,cAAc;CACnC,MAAM,EAAE,MAAM,aAAa,gBAAgB;CAC3C,MAAM,EAAE,aAAa,aAAa,kBAAkB;CAEpD,MAAM,EAAE,QAAQ,UAAU,WAAW,qBAAqB,YAAY;CAEtE,MAAM,iBAAiB,aACpB,WAAmB,OAAgB;AAElC,WADa,KAAK,SAAS,UAAU,GAAG,OAAO,SAAS,YAC1C;IAEhB,CAAC,SAAS,CACX;CAED,MAAM,aAAa,kBAAkB;AACnC,MAAI,YAAY,OAEd,UAAS,SAAS,SAAS;MAG3B,UAAS,iBAAiB;IAE3B;EAAC;EAAU;EAAU;EAAO,CAAC;CAEhC,MAAM,aAAa,eACV;EACL,QAAQ;EACR,MAAM,WAAW,EAAE,IAAI,SAAS,IAAI,GAAG;EACvC,YAAY;EACb,GACD,CAAC,cAAc,SAAS,CACzB;CAED,MAAM,mBAAmB,cACjB,uBAAuB,EAAE,aAAa,cAAc,CAAC,EAC3D,CAAC,aAAa,CACf;CAED,MAAM,WAAW,eACR;EACL,MAAM,WACF;GACE,IAAI,SAAS;GACb,SAAS,SAAS,UACd,EAAE,UAAU,SAAS,QAAQ,UAAU,GACvC;GACL,GACD,KAAA;EACJ,aACG,UAAoD,gBACrD;EACF,UAAU;EACV,WAAW,SAAiB;GAE1B,MAAM,YAAY,KAAK,QAAQ,OAAO,GAAG;AAKzC,YAHiB,UAAU,WAAW,SAAS,GAC3C,YACA,SAAS,YACK;;EAEpB,YAAY,SAGN;AACJ,WAAQ,KAAK,gBAAgB,KAAK,KAAK,IAAI,KAAK,QAAQ;;EAE1D;EACA,kBAAkB,OAAO,WAGnB;GACJ,MAAM,cAAe,UACjB;AACJ,OAAI,CAAC,YAAa,OAAM,IAAI,MAAM,kBAAkB;AACpD,UAAO,aAAa,KAClB,mBAAmB,YAAY,yBAC/B;IACE,iBAAiB,OAAO;IACxB,mBAAmB,OAAO;IAC3B,CACF;;EAEH,kBAAkB,OAAO,eAAuB;GAC9C,MAAM,EAAE,WAAW,iBACjB,MAAM,OAAO,sBAAA,MAAA,MAAA,EAAA,EAAA;AACf,SAAM,aAAa,eAAe,cAAc,WAAW;;EAE9D,GACD;EAAC;EAAU;EAAU;EAAkB;EAAa,CACrD;AAED,QACE,oBAAC,OAAD;EAAK,GAAI;EAAU,WAAW,UAAU,SAAS,aAAa;YAC5D,oBAAC,wBAAD;GAAwB,QAAQ;aAC9B,oBAAC,sBAAD;IAAsB,QAAQ;cAC5B,oBAAC,eAAD;KACU;KACE;KACF;KACR,gBAAgB,UAAU,SAAS;KACnC,aAAa,UAAU,SAAS;KAChC,YAAY;KACZ,QAAQ;KACR,CAAA;IACmB,CAAA;GACA,CAAA;EACrB,CAAA;;AAIV,MAAa,iCAAuD;CAClE,YAAY;CACZ,aAAa;CACb,YAAY,CAAC;EAAE,IAAI;EAAW,OAAO;EAAW,CAAC;CACjD,QAAQ,EAAE;CACX"}

package/dist/ShareablesScreen-CBw3gH0u.cjs ADDED Viewed

@@ -0,0 +1,41 @@
+require("./chunk-DAgNkxik.cjs");
+require("./FluidProvider-DzrMOFXn.cjs");
+require("./error-state-CGCSDJIJ.cjs");
+require("./ScreenRenderer-C-H-ju1C.cjs");
+require("./WidgetInteractionContext-ywxCBIMm.cjs");
+require("./EmbedWidget-D6eRvOud.cjs");
+require("./fields-BCNGRVzZ.cjs");
+require("./TextWidget-XBeVX2oM.cjs");
+require("./AlertWidget-CSYWU2c3.cjs");
+require("./BulletListWidget-BUMq15V1.cjs");
+require("./CalendarWidget-DLkcnQVx.cjs");
+require("./CardWidget-B4cJHq6g.cjs");
+require("./purify.es-CmsCRU2T.cjs");
+require("./src-CWGmmrLZ.cjs");
+require("./scroll-arrows-Dw7eLYdG.cjs");
+require("./MediaRenderer-CEV-eeB-.cjs");
+require("./CarouselWidget-Bx5jrthO.cjs");
+require("./CatchUpWidget-CFL4REYX.cjs");
+require("./ChartWidget-DWWeWN0Q.cjs");
+require("./LayoutWidget-CsdItxHF.cjs");
+require("./ContainerWidget-DZXzmDZl.cjs");
+require("./ImageWidget-DwM4H6SC.cjs");
+require("./LinkWidget-CJKveS10.cjs");
+require("./ListWidget-D8yMrpa5.cjs");
+require("./MySiteWidget-DeAwyK5y.cjs");
+require("./NestedWidget-CZuN2QY2.cjs");
+require("./QuickShareWidget-CIfXUWCx.cjs");
+require("./RecentActivityWidget-kRfjO1IV.cjs");
+require("./SeparatorWidget-BUXIxV-F.cjs");
+require("./SpacerWidget-DW_7QXrs.cjs");
+require("./TableWidget-DFWfQIWv.cjs");
+require("./ToDoWidget-GmeRwP_0.cjs");
+require("./VideoWidget-CN8nMeGP.cjs");
+require("./src-CXGrnE7x.cjs");
+require("./dist-CtcLRHrv.cjs");
+require("./es-BZa0y3qY.cjs");
+require("./dist-BUWkpuUk.cjs");
+const require_ShareablesScreen = require("./ShareablesScreen-Dfa0LM6R.cjs");
+require("./dist-DqYiTOfX.cjs");
+exports.ShareablesScreen = require_ShareablesScreen.ShareablesScreen;
+exports.shareablesScreenPropertySchema = require_ShareablesScreen.shareablesScreenPropertySchema;

package/dist/{ShareablesScreen-CLjjDaWJ.cjs → ShareablesScreen-Dfa0LM6R.cjs} RENAMED Viewed

@@ -1,7 +1,7 @@
 require("./chunk-DAgNkxik.cjs");
-const require_use_account_clients = require("./use-account-clients-DR-cFoiZ.cjs");
-const require_src = require("./src-BxmqgcCj.cjs");
-const require_products = require("./products-CbSNg_2Q.cjs");
+const require_use_account_clients = require("./use-account-clients-BOwgvZok.cjs");
+const require_src = require("./src-CXGrnE7x.cjs");
+const require_products = require("./products-zutaVs48.cjs");
 const require_AppNavigationContext = require("./AppNavigationContext-CbWjJMoI.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -142,4 +142,4 @@ Object.defineProperty(exports, "shareablesScreenPropertySchema", {
 	}
 });
-//# sourceMappingURL=ShareablesScreen-CLjjDaWJ.cjs.map
+//# sourceMappingURL=ShareablesScreen-Dfa0LM6R.cjs.map