@fluid-app/portal-widgets 0.1.17

package/dist/CarouselWidget-Bdn0LVXT.cjs

@@ -0,0 +1,453 @@
+const require_chunk = require("./chunk-CZWwpsFl.cjs");
+const require_scroll_arrows = require("./scroll-arrows-BZIlsE_x.cjs");
+const require_MediaRenderer = require("./MediaRenderer-CcJvyOJ1.cjs");
+let _fluid_app_portal_core_registries = require("@fluid-app/portal-core/registries");
+let react_jsx_runtime = require("react/jsx-runtime");
+let react = require("react");
+let dompurify = require("dompurify");
+dompurify = require_chunk.__toESM(dompurify);
+let _fluid_app_ui_primitives = require("@fluid-app/ui-primitives");
+//#region src/widgets/CarouselWidget.tsx
+var CarouselWidget_exports = /* @__PURE__ */ require_chunk.__exportAll({
+	CarouselWidget: () => CarouselWidget,
+	carouselWidgetPropertySchema: () => carouselWidgetPropertySchema
+});
+const DEFAULT_SLIDES = [];
+function CarouselWidget({ slides = DEFAULT_SLIDES, autoScrollInterval = 3e3, enableAutoScroll = false, carouselHeight = "400px", align = {
+	vertical: "bottom",
+	horizontal: "left"
+}, overlayIntensity = 40, borderRadius = "none", padding = 0, textWidth = "100%", headerSize = "lg", headerColor = "background", textSize = "md", textColor = "background", showButton = true, buttonColor = "background", buttonSize = "default", overlayEnabled = true, overlayType = "solid", className, ...props }) {
+	const [currentIndex, setCurrentIndex] = (0, react.useState)(0);
+	const [isHovered, setIsHovered] = (0, react.useState)(false);
+	const hasSlides = slides.length > 0;
+	const totalSlides = slides.length;
+	const goToNext = (0, react.useCallback)(() => {
+		if (!hasSlides) return;
+		setCurrentIndex((prev) => {
+			if (prev === totalSlides - 1) return 0;
+			return prev + 1;
+		});
+	}, [hasSlides, totalSlides]);
+	const goToPrevious = (0, react.useCallback)(() => {
+		if (!hasSlides) return;
+		setCurrentIndex((prev) => {
+			if (prev === 0) return totalSlides - 1;
+			return prev - 1;
+		});
+	}, [hasSlides, totalSlides]);
+	const goToSlide = (0, react.useCallback)((index) => {
+		if (!hasSlides) return;
+		if (index >= 0 && index < totalSlides) setCurrentIndex(index);
+	}, [hasSlides, totalSlides]);
+	(0, react.useEffect)(() => {
+		if (!enableAutoScroll || !hasSlides || isHovered) return;
+		const intervalId = setInterval(() => {
+			goToNext();
+		}, autoScrollInterval);
+		return () => clearInterval(intervalId);
+	}, [
+		enableAutoScroll,
+		autoScrollInterval,
+		hasSlides,
+		isHovered,
+		goToNext
+	]);
+	(0, react.useEffect)(() => {
+		if (currentIndex >= totalSlides && totalSlides > 0) setCurrentIndex(0);
+	}, [totalSlides, currentIndex]);
+	if (!hasSlides) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: `rounded-${borderRadius} ${className} w-full overflow-hidden`,
+		style: { minHeight: carouselHeight },
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "bg-muted flex h-full w-full items-center justify-center",
+			style: { minHeight: carouselHeight },
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "text-muted-foreground flex flex-col items-center gap-2",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "text-4xl",
+						children: "🎠"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: "text-sm",
+						children: "No slides added"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: "text-muted-foreground/70 text-xs",
+						children: "Add slides to create a carousel"
+					})
+				]
+			})
+		})
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: `relative w-full overflow-hidden rounded-${borderRadius} ${className}`,
+		style: { minHeight: carouselHeight },
+		onMouseEnter: () => setIsHovered(true),
+		onMouseLeave: () => setIsHovered(false),
+		...props,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "relative h-full w-full",
+			style: { minHeight: carouselHeight },
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex h-full transition-transform duration-500 ease-in-out",
+				style: { transform: `translateX(-${currentIndex * 100}%)` },
+				children: slides.map((slide) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "relative h-full w-full flex-shrink-0",
+					style: {
+						minWidth: "100%",
+						minHeight: carouselHeight
+					},
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "absolute inset-0 h-full w-full",
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MediaRenderer.MediaRenderer, { ...require_MediaRenderer.getMediaPropsFromWidgetSchema(slide.content) })
+						}),
+						overlayEnabled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: `absolute inset-0 z-9 ${overlayType === "gradient" ? "bg-gradient-to-t from-black to-transparent" : "bg-black"}`,
+							style: { opacity: (Number(String(overlayIntensity).replace("%", "")) || 40) / 100 }
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: `absolute inset-x-0 z-10 flex px-3 ${align.horizontal === "left" ? "justify-start" : align.horizontal === "center" ? "justify-center" : "justify-end"} ${align.vertical === "top" ? "top-0 pt-13" : align.vertical === "center" ? "top-1/2 -translate-y-1/2" : "bottom-0 pb-13"}`,
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: `p-${padding} flex flex-col gap-3`,
+								style: { maxWidth: textWidth },
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: `flex flex-col text-${align.horizontal}`,
+									children: [slide.title && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
+										className: `mb-2 leading-tight font-bold text-${headerColor} text-${headerSize === "md" ? "base" : headerSize}`,
+										children: slide.title
+									}), slide.description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+										className: `leading-snug text-${textColor} text-${textSize === "md" ? "base" : textSize} line-clamp-2`,
+										dangerouslySetInnerHTML: { __html: dompurify.default.sanitize(slide.description, {
+											ALLOWED_TAGS: [
+												"br",
+												"strong",
+												"em",
+												"b",
+												"i",
+												"ul",
+												"ol",
+												"li",
+												"p"
+											],
+											ALLOWED_ATTR: []
+										}) }
+									})]
+								}), slide.buttonText && slide.buttonEnabled && showButton && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: `text-${align.horizontal}`,
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_fluid_app_ui_primitives.Button, {
+										size: buttonSize,
+										className: `rounded-md py-1 font-semibold bg-${buttonColor} text-${buttonColor}-foreground hover:bg-${buttonColor}/90`,
+										asChild: true,
+										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
+											href: slide.buttonLink,
+											children: slide.buttonText
+										})
+									})
+								})]
+							})
+						})
+					]
+				}, slide.id))
+			})
+		}), totalSlides > 1 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: `p-${padding} absolute bottom-0 z-10 flex w-full items-center justify-between ${align.horizontal === "center" ? "h-full" : ""}`,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: `flex items-center ${align.horizontal === "center" ? `p-${padding} absolute inset-x-0 bottom-3 justify-center` : ""}`,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: `flex items-center gap-2 ${align.horizontal === "center" ? "justify-center" : ""}`,
+					children: slides.map((_, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						className: `h-[6px] w-[6px] rounded-full transition-colors ${index === currentIndex ? "bg-background" : "bg-background/40 hover:bg-background/60"}`,
+						onClick: () => goToSlide(index),
+						"aria-label": `Go to slide ${index + 1}`,
+						"aria-current": index === currentIndex ? "true" : "false"
+					}, `dot-${index}`))
+				})
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: `flex items-center gap-[10px] ${align.horizontal === "center" ? `absolute inset-x-0 top-1/2 justify-between px-${padding}` : ""}`,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_scroll_arrows.ScrollArrows, {
+					onPrevious: goToPrevious,
+					onNext: goToNext
+				})
+			})]
+		})]
+	});
+}
+const carouselWidgetPropertySchema = {
+	widgetType: "CarouselWidget",
+	displayName: "Carousel",
+	tabsConfig: [
+		{
+			id: "styling",
+			label: "Styling"
+		},
+		{
+			id: "behavior",
+			label: "Behavior"
+		},
+		{
+			id: "data",
+			label: "Data"
+		}
+	],
+	dataSourceTargetProps: ["slides"],
+	fields: [
+		(0, _fluid_app_portal_core_registries.getFontSizeField)({
+			defaultValue: "lg",
+			key: "headerSize",
+			label: "Header Font Size",
+			description: "Font size for the slide header",
+			tab: "styling",
+			group: "Text Styling"
+		}),
+		(0, _fluid_app_portal_core_registries.getColorField)({
+			defaultValue: "background",
+			key: "headerColor",
+			label: "Header Color",
+			description: "Color variant for the slide header",
+			tab: "styling",
+			group: "Text Styling"
+		}),
+		{
+			key: "separator",
+			type: "separator",
+			label: "Separator",
+			tab: "styling",
+			group: "Text Styling"
+		},
+		(0, _fluid_app_portal_core_registries.getFontSizeField)({
+			defaultValue: "md",
+			key: "textSize",
+			label: "Text Font Size",
+			description: "Font size for the slide text",
+			tab: "styling",
+			group: "Text Styling"
+		}),
+		(0, _fluid_app_portal_core_registries.getColorField)({
+			defaultValue: "background",
+			key: "textColor",
+			label: "Text Color",
+			description: "Color variant for the slide text",
+			tab: "styling",
+			group: "Text Styling"
+		}),
+		{
+			key: "align",
+			label: "Alignment",
+			type: "alignment",
+			description: "Alignment of the carousel content",
+			defaultValue: {
+				vertical: "bottom",
+				horizontal: "left"
+			},
+			options: {
+				verticalEnabled: true,
+				horizontalEnabled: true
+			},
+			tab: "styling",
+			group: "Layout"
+		},
+		{
+			key: "textWidth",
+			label: "Content Width",
+			type: "text",
+			description: "Maximum width for slide content (e.g., 100%, 50%, 600px)",
+			defaultValue: "100%",
+			tab: "styling",
+			group: "Layout"
+		},
+		(0, _fluid_app_portal_core_registries.getHeightField)({
+			key: "carouselHeight",
+			label: "Carousel Height",
+			description: "Height of the carousel",
+			min: 100,
+			max: 1200,
+			step: 10,
+			defaultValue: "400px",
+			tab: "styling",
+			group: "Design"
+		}),
+		{
+			key: "separator2",
+			type: "separator",
+			label: "Separator",
+			tab: "styling",
+			group: "Design"
+		},
+		(0, _fluid_app_portal_core_registries.getBorderRadiusField)({
+			defaultValue: "md",
+			key: "borderRadius",
+			label: "Border Radius",
+			description: "Rounded corners for the carousel",
+			tab: "styling",
+			group: "Design"
+		}),
+		(0, _fluid_app_portal_core_registries.getPaddingField)({
+			defaultValue: 4,
+			key: "padding",
+			label: "Padding",
+			description: "Padding for the carousel",
+			tab: "styling",
+			group: "Design"
+		}),
+		{
+			key: "overlayEnabled",
+			label: "Enable Overlay",
+			type: "boolean",
+			description: "Add background overlay to slide content",
+			defaultValue: true,
+			tab: "styling",
+			group: "Design"
+		},
+		{
+			key: "overlayType",
+			label: "Overlay Type",
+			type: "buttonGroup",
+			description: "Type of overlay to add to the slide content",
+			defaultValue: "gradient",
+			options: [{
+				label: "Solid",
+				value: "solid"
+			}, {
+				label: "Gradient",
+				value: "gradient"
+			}],
+			tab: "styling",
+			group: "Design",
+			requiresKeyToBeTrue: "overlayEnabled"
+		},
+		{
+			key: "overlayIntensity",
+			label: "Overlay Intensity",
+			type: "slider",
+			description: "Opacity of the overlay background (0-100)",
+			min: 0,
+			max: 100,
+			step: 5,
+			defaultValue: 50,
+			unit: "%",
+			tab: "styling",
+			group: "Design",
+			requiresKeyToBeTrue: "overlayEnabled"
+		},
+		{
+			key: "showButton",
+			label: "Show Button",
+			type: "boolean",
+			description: "Display the button in slide content",
+			defaultValue: true,
+			tab: "styling",
+			group: "Design"
+		},
+		(0, _fluid_app_portal_core_registries.getColorField)({
+			defaultValue: "primary",
+			key: "buttonColor",
+			label: "Button Color",
+			description: "Color variant for the slide button",
+			tab: "styling",
+			group: "Design",
+			requiresKeyToBeTrue: "showButton"
+		}),
+		(0, _fluid_app_portal_core_registries.getButtonSizeField)({
+			defaultValue: "default",
+			key: "buttonSize",
+			label: "Button Size",
+			description: "Size of the slide button",
+			tab: "styling",
+			group: "Design",
+			requiresKeyToBeTrue: "showButton"
+		}),
+		{
+			key: "enableAutoScroll",
+			label: "Enable Auto-Scroll",
+			type: "boolean",
+			description: "Automatically advance to the next slide",
+			defaultValue: false,
+			tab: "behavior",
+			group: "Auto-Scroll"
+		},
+		{
+			key: "autoScrollInterval",
+			label: "Auto-Scroll Interval (ms)",
+			type: "number",
+			description: "Time in milliseconds between automatic slide transitions",
+			min: 1e3,
+			max: 1e4,
+			step: 500,
+			defaultValue: 3e3,
+			tab: "behavior",
+			group: "Auto-Scroll",
+			requiresKeyToBeTrue: "enableAutoScroll"
+		},
+		{
+			key: "dataSource",
+			label: "Data Source",
+			type: "dataSource",
+			description: "",
+			tab: "data",
+			group: "Data Configuration"
+		}
+	],
+	itemConfigSchema: {
+		description: "Configure settings for this slide",
+		fields: [
+			{
+				key: "title",
+				label: "Custom Title",
+				type: "text",
+				description: "Override the item's title for this slide"
+			},
+			{
+				key: "description",
+				label: "Custom Description",
+				type: "textarea",
+				description: "Override the item's description for this slide",
+				rows: 3
+			},
+			{
+				key: "buttonEnabled",
+				label: "Show Button",
+				type: "boolean",
+				description: "Show the button in the slide",
+				defaultValue: false
+			},
+			{
+				key: "buttonText",
+				label: "Button Text",
+				type: "text",
+				description: "Text to display on the slide button",
+				requiresKeyToBeTrue: "buttonEnabled"
+			},
+			{
+				key: "buttonLink",
+				label: "Button Link",
+				type: "text",
+				description: "URL for the slide button",
+				requiresKeyToBeTrue: "buttonEnabled"
+			}
+		]
+	}
+};
+//#endregion
+Object.defineProperty(exports, "CarouselWidget", {
+	enumerable: true,
+	get: function() {
+		return CarouselWidget;
+	}
+});
+Object.defineProperty(exports, "CarouselWidget_exports", {
+	enumerable: true,
+	get: function() {
+		return CarouselWidget_exports;
+	}
+});
+Object.defineProperty(exports, "carouselWidgetPropertySchema", {
+	enumerable: true,
+	get: function() {
+		return carouselWidgetPropertySchema;
+	}
+});
+
+//# sourceMappingURL=CarouselWidget-Bdn0LVXT.cjs.map

package/dist/CarouselWidget-Bdn0LVXT.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CarouselWidget-Bdn0LVXT.cjs","names":["MediaRenderer","getMediaPropsFromWidgetSchema","DOMPurify","Button","ScrollArrows"],"sources":["../src/widgets/CarouselWidget.tsx"],"sourcesContent":["import DOMPurify from \"dompurify\";\nimport { Button } from \"@fluid-app/ui-primitives\";\nimport { ScrollArrows } from \"../ui/scroll-arrows\";\nimport type { ComponentProps } from \"react\";\nimport { useEffect, useState, useCallback } from \"react\";\nimport type React from \"react\";\nimport {\n  MediaRenderer,\n  getMediaPropsFromWidgetSchema,\n} from \"../components/MediaRenderer\";\nimport type {\n  WidgetSchema,\n  BorderRadiusOptions,\n  ColorOptions,\n  AlignOptions,\n  FontSizeOptions,\n  PaddingOptions,\n  ButtonSizeOptions,\n} from \"@fluid-app/portal-core/types\";\nimport {\n  getHeightField,\n  type WidgetPropertySchema,\n} from \"@fluid-app/portal-core/registries\";\nimport {\n  getBorderRadiusField,\n  getColorField,\n  getFontSizeField,\n  getPaddingField,\n  getButtonSizeField,\n} from \"../core/fields\";\n\nconst DEFAULT_SLIDES: CarouselSlide[] = [];\n\ntype CarouselSlide = {\n  id: string;\n  content: WidgetSchema;\n  title?: string;\n  description?: string;\n  buttonEnabled?: boolean;\n  buttonText?: string;\n  buttonVariant?:\n    | \"default\"\n    | \"secondary\"\n    | \"outline\"\n    | \"destructive\"\n    | \"ghost\"\n    | \"link\";\n  buttonLink?: string;\n};\n\ntype CarouselWidgetProps = ComponentProps<\"div\"> & {\n  slides?: CarouselSlide[];\n  autoScrollInterval?: number;\n  enableAutoScroll?: boolean;\n\n  // Layout\n  align?: AlignOptions;\n  carouselHeight?: string;\n  borderRadius?: BorderRadiusOptions;\n  padding?: PaddingOptions;\n\n  // Text Styling\n  headerSize?: FontSizeOptions;\n  headerColor?: ColorOptions;\n  textSize?: FontSizeOptions;\n  textColor?: ColorOptions;\n  textWidth?: string;\n\n  // Button\n  showButton?: boolean;\n  buttonColor?: ColorOptions;\n  buttonSize?: ButtonSizeOptions;\n\n  // Overlay\n  overlayEnabled?: boolean;\n  overlayType?: \"solid\" | \"gradient\";\n  overlayIntensity?: number;\n};\n\nexport function CarouselWidget({\n  slides = DEFAULT_SLIDES,\n  autoScrollInterval = 3000,\n  enableAutoScroll = false,\n  carouselHeight = \"400px\",\n  align = { vertical: \"bottom\", horizontal: \"left\" },\n  overlayIntensity = 40,\n  borderRadius = \"none\",\n  padding = 0,\n  textWidth = \"100%\",\n  headerSize = \"lg\",\n  headerColor = \"background\",\n  textSize = \"md\",\n  textColor = \"background\",\n  showButton = true,\n  buttonColor = \"background\",\n  buttonSize = \"default\",\n  overlayEnabled = true,\n  overlayType = \"solid\",\n  className,\n  ...props\n}: CarouselWidgetProps): React.JSX.Element {\n  const [currentIndex, setCurrentIndex] = useState(0);\n  const [isHovered, setIsHovered] = useState(false);\n\n  const hasSlides = slides.length > 0;\n  const totalSlides = slides.length;\n\n  const goToNext = useCallback(() => {\n    if (!hasSlides) return;\n    setCurrentIndex((prev) => {\n      if (prev === totalSlides - 1) {\n        return 0;\n      }\n      return prev + 1;\n    });\n  }, [hasSlides, totalSlides]);\n\n  const goToPrevious = useCallback(() => {\n    if (!hasSlides) return;\n    setCurrentIndex((prev) => {\n      if (prev === 0) {\n        return totalSlides - 1;\n      }\n      return prev - 1;\n    });\n  }, [hasSlides, totalSlides]);\n\n  const goToSlide = useCallback(\n    (index: number) => {\n      if (!hasSlides) return;\n      if (index >= 0 && index < totalSlides) {\n        setCurrentIndex(index);\n      }\n    },\n    [hasSlides, totalSlides],\n  );\n\n  // Auto-scroll effect\n  useEffect(() => {\n    if (!enableAutoScroll || !hasSlides || isHovered) return;\n\n    const intervalId = setInterval(() => {\n      goToNext();\n    }, autoScrollInterval);\n\n    return () => clearInterval(intervalId);\n  }, [enableAutoScroll, autoScrollInterval, hasSlides, isHovered, goToNext]);\n\n  // Reset to first slide if slides change\n  useEffect(() => {\n    if (currentIndex >= totalSlides && totalSlides > 0) {\n      setCurrentIndex(0);\n    }\n  }, [totalSlides, currentIndex]);\n\n  if (!hasSlides) {\n    return (\n      <div\n        className={`rounded-${borderRadius} ${className} w-full overflow-hidden`}\n        style={{ minHeight: carouselHeight }}\n        {...props}\n      >\n        <div\n          className=\"bg-muted flex h-full w-full items-center justify-center\"\n          style={{ minHeight: carouselHeight }}\n        >\n          <div className=\"text-muted-foreground flex flex-col items-center gap-2\">\n            <div className=\"text-4xl\">🎠</div>\n            <p className=\"text-sm\">No slides added</p>\n            <p className=\"text-muted-foreground/70 text-xs\">\n              Add slides to create a carousel\n            </p>\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div\n      className={`relative w-full overflow-hidden rounded-${borderRadius} ${className}`}\n      style={{ minHeight: carouselHeight }}\n      onMouseEnter={() => setIsHovered(true)}\n      onMouseLeave={() => setIsHovered(false)}\n      {...props}\n    >\n      {/* Slides Container */}\n      <div\n        className=\"relative h-full w-full\"\n        style={{ minHeight: carouselHeight }}\n      >\n        <div\n          className=\"flex h-full transition-transform duration-500 ease-in-out\"\n          style={{\n            transform: `translateX(-${currentIndex * 100}%)`,\n          }}\n        >\n          {slides.map((slide) => (\n            <div\n              key={slide.id}\n              className=\"relative h-full w-full flex-shrink-0\"\n              style={{ minWidth: \"100%\", minHeight: carouselHeight }}\n            >\n              {/* Background image/content layer */}\n              <div className=\"absolute inset-0 h-full w-full\">\n                <MediaRenderer\n                  {...getMediaPropsFromWidgetSchema(slide.content)}\n                />\n              </div>\n\n              {/* Dark overlay for text readability */}\n              {overlayEnabled && (\n                <div\n                  className={`absolute inset-0 z-9 ${\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(\"%\", \"\")) ||\n                        40) / 100,\n                  }}\n                />\n              )}\n\n              {/* Content box */}\n              <div\n                className={`absolute inset-x-0 z-10 flex px-3 ${\n                  align.horizontal === \"left\"\n                    ? \"justify-start\"\n                    : align.horizontal === \"center\"\n                      ? \"justify-center\"\n                      : \"justify-end\"\n                } ${\n                  align.vertical === \"top\"\n                    ? \"top-0 pt-13\"\n                    : align.vertical === \"center\"\n                      ? \"top-1/2 -translate-y-1/2\"\n                      : \"bottom-0 pb-13\"\n                }`}\n              >\n                <div\n                  className={`p-${padding} flex flex-col gap-3`}\n                  style={{ maxWidth: textWidth }}\n                >\n                  {/* Heading and text */}\n                  <div className={`flex flex-col text-${align.horizontal}`}>\n                    {slide.title && (\n                      <h2\n                        className={`mb-2 leading-tight font-bold text-${headerColor} text-${headerSize === \"md\" ? \"base\" : headerSize}`}\n                      >\n                        {slide.title}\n                      </h2>\n                    )}\n                    {slide.description && (\n                      <div\n                        className={`leading-snug text-${textColor} text-${textSize === \"md\" ? \"base\" : textSize} line-clamp-2`}\n                        dangerouslySetInnerHTML={{\n                          __html: DOMPurify.sanitize(slide.description, {\n                            ALLOWED_TAGS: [\n                              \"br\",\n                              \"strong\",\n                              \"em\",\n                              \"b\",\n                              \"i\",\n                              \"ul\",\n                              \"ol\",\n                              \"li\",\n                              \"p\",\n                            ],\n                            ALLOWED_ATTR: [],\n                          }),\n                        }}\n                      />\n                    )}\n                  </div>\n\n                  {/* Button */}\n                  {slide.buttonText && slide.buttonEnabled && showButton && (\n                    <div className={`text-${align.horizontal}`}>\n                      <Button\n                        size={buttonSize}\n                        className={`rounded-md py-1 font-semibold bg-${buttonColor} text-${buttonColor}-foreground hover:bg-${buttonColor}/90`}\n                        asChild\n                      >\n                        <a href={slide.buttonLink}>{slide.buttonText}</a>\n                      </Button>\n                    </div>\n                  )}\n                </div>\n              </div>\n            </div>\n          ))}\n        </div>\n      </div>\n      {/* Dots and Navigation */}\n      {totalSlides > 1 && (\n        <div\n          className={`p-${padding} absolute bottom-0 z-10 flex w-full items-center justify-between ${align.horizontal === \"center\" ? \"h-full\" : \"\"}`}\n        >\n          {/* Pagination dots - always at bottom */}\n          <div\n            className={`flex items-center ${\n              align.horizontal === \"center\"\n                ? `p-${padding} absolute inset-x-0 bottom-3 justify-center`\n                : \"\"\n            }`}\n          >\n            <div\n              className={`flex items-center gap-2 ${\n                align.horizontal === \"center\" ? \"justify-center\" : \"\"\n              }`}\n            >\n              {slides.map((_, index) => (\n                <button\n                  key={`dot-${index}`}\n                  className={`h-[6px] w-[6px] rounded-full transition-colors ${\n                    index === currentIndex\n                      ? \"bg-background\"\n                      : \"bg-background/40 hover:bg-background/60\"\n                  }`}\n                  onClick={() => goToSlide(index)}\n                  aria-label={`Go to slide ${index + 1}`}\n                  aria-current={index === currentIndex ? \"true\" : \"false\"}\n                />\n              ))}\n            </div>\n          </div>\n\n          {/* Navigation arrows - position changes based on alignment */}\n          <div\n            className={`flex items-center gap-[10px] ${\n              align.horizontal === \"center\"\n                ? `absolute inset-x-0 top-1/2 justify-between px-${padding}`\n                : \"\"\n            }`}\n          >\n            <ScrollArrows onPrevious={goToPrevious} onNext={goToNext} />\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport const carouselWidgetPropertySchema: WidgetPropertySchema = {\n  widgetType: \"CarouselWidget\",\n  displayName: \"Carousel\",\n  tabsConfig: [\n    { id: \"styling\", label: \"Styling\" },\n    { id: \"behavior\", label: \"Behavior\" },\n    { id: \"data\", label: \"Data\" },\n  ],\n  dataSourceTargetProps: [\"slides\"],\n  fields: [\n    // Styling tab - Text Styling group\n    getFontSizeField({\n      defaultValue: \"lg\",\n      key: \"headerSize\",\n      label: \"Header Font Size\",\n      description: \"Font size for the slide header\",\n      tab: \"styling\",\n      group: \"Text Styling\",\n    }),\n    getColorField({\n      defaultValue: \"background\",\n      key: \"headerColor\",\n      label: \"Header Color\",\n      description: \"Color variant for the slide header\",\n      tab: \"styling\",\n      group: \"Text Styling\",\n    }),\n    {\n      key: \"separator\",\n      type: \"separator\",\n      label: \"Separator\",\n      tab: \"styling\",\n      group: \"Text Styling\",\n    },\n    getFontSizeField({\n      defaultValue: \"md\",\n      key: \"textSize\",\n      label: \"Text Font Size\",\n      description: \"Font size for the slide text\",\n      tab: \"styling\",\n      group: \"Text Styling\",\n    }),\n    getColorField({\n      defaultValue: \"background\",\n      key: \"textColor\",\n      label: \"Text Color\",\n      description: \"Color variant for the slide text\",\n      tab: \"styling\",\n      group: \"Text Styling\",\n    }),\n    // Styling tab - Layout group\n    {\n      key: \"align\",\n      label: \"Alignment\",\n      type: \"alignment\",\n      description: \"Alignment of the carousel content\",\n      defaultValue: { vertical: \"bottom\", horizontal: \"left\" },\n      options: {\n        verticalEnabled: true,\n        horizontalEnabled: true,\n      },\n      tab: \"styling\",\n      group: \"Layout\",\n    },\n    {\n      key: \"textWidth\",\n      label: \"Content Width\",\n      type: \"text\",\n      description: \"Maximum width for slide content (e.g., 100%, 50%, 600px)\",\n      defaultValue: \"100%\",\n      tab: \"styling\",\n      group: \"Layout\",\n    },\n    // Styling tab - Design group\n    getHeightField({\n      key: \"carouselHeight\",\n      label: \"Carousel Height\",\n      description: \"Height of the carousel\",\n      min: 100,\n      max: 1200,\n      step: 10,\n      defaultValue: \"400px\",\n      tab: \"styling\",\n      group: \"Design\",\n    }),\n    {\n      key: \"separator2\",\n      type: \"separator\",\n      label: \"Separator\",\n      tab: \"styling\",\n      group: \"Design\",\n    },\n    getBorderRadiusField({\n      defaultValue: \"md\",\n      key: \"borderRadius\",\n      label: \"Border Radius\",\n      description: \"Rounded corners for the carousel\",\n      tab: \"styling\",\n      group: \"Design\",\n    }),\n    getPaddingField({\n      defaultValue: 4,\n      key: \"padding\",\n      label: \"Padding\",\n      description: \"Padding for the carousel\",\n      tab: \"styling\",\n      group: \"Design\",\n    }),\n    {\n      key: \"overlayEnabled\",\n      label: \"Enable Overlay\",\n      type: \"boolean\",\n      description: \"Add background overlay to slide content\",\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 slide content\",\n      defaultValue: \"gradient\",\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: \"showButton\",\n      label: \"Show Button\",\n      type: \"boolean\",\n      description: \"Display the button in slide content\",\n      defaultValue: true,\n      tab: \"styling\",\n      group: \"Design\",\n    },\n    getColorField({\n      defaultValue: \"primary\",\n      key: \"buttonColor\",\n      label: \"Button Color\",\n      description: \"Color variant for the slide button\",\n      tab: \"styling\",\n      group: \"Design\",\n      requiresKeyToBeTrue: \"showButton\",\n    }),\n    getButtonSizeField({\n      defaultValue: \"default\",\n      key: \"buttonSize\",\n      label: \"Button Size\",\n      description: \"Size of the slide button\",\n      tab: \"styling\",\n      group: \"Design\",\n      requiresKeyToBeTrue: \"showButton\",\n    }),\n    // Behavior tab - Auto-Scroll group\n    {\n      key: \"enableAutoScroll\",\n      label: \"Enable Auto-Scroll\",\n      type: \"boolean\",\n      description: \"Automatically advance to the next slide\",\n      defaultValue: false,\n      tab: \"behavior\",\n      group: \"Auto-Scroll\",\n    },\n    {\n      key: \"autoScrollInterval\",\n      label: \"Auto-Scroll Interval (ms)\",\n      type: \"number\",\n      description: \"Time in milliseconds between automatic slide transitions\",\n      min: 1000,\n      max: 10000,\n      step: 500,\n      defaultValue: 3000,\n      tab: \"behavior\",\n      group: \"Auto-Scroll\",\n      requiresKeyToBeTrue: \"enableAutoScroll\",\n    },\n    // Data tab - Data Configuration group\n    {\n      key: \"dataSource\",\n      label: \"Data Source\",\n      type: \"dataSource\",\n      description: \"\",\n      tab: \"data\",\n      group: \"Data Configuration\",\n    },\n  ],\n  // Per-item configuration schema for custom data sources\n  itemConfigSchema: {\n    description: \"Configure settings for this slide\",\n    fields: [\n      {\n        key: \"title\",\n        label: \"Custom Title\",\n        type: \"text\",\n        description: \"Override the item's title for this slide\",\n      },\n      {\n        key: \"description\",\n        label: \"Custom Description\",\n        type: \"textarea\",\n        description: \"Override the item's description for this slide\",\n        rows: 3,\n      },\n      {\n        key: \"buttonEnabled\",\n        label: \"Show Button\",\n        type: \"boolean\",\n        description: \"Show the button in the slide\",\n        defaultValue: false,\n      },\n      {\n        key: \"buttonText\",\n        label: \"Button Text\",\n        type: \"text\",\n        description: \"Text to display on the slide button\",\n        requiresKeyToBeTrue: \"buttonEnabled\",\n      },\n      {\n        key: \"buttonLink\",\n        label: \"Button Link\",\n        type: \"text\",\n        description: \"URL for the slide button\",\n        requiresKeyToBeTrue: \"buttonEnabled\",\n      },\n    ],\n  },\n} as const satisfies WidgetPropertySchema;\n"],"mappings":"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AO;GACP,KAAK;GACL,OAAO;GACR;8DACoB;GACnB,cAAc;GACd,KAAK;GACL,OAAO;GACP,aAAa;GACb,KAAK;GACL,OAAO;GACR,CAAC;yDACc;GACd,cAAc;GACd,KAAK;GACL,OAAO;GACP,aAAa;GACb,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,OAAO;GACP,MAAM;GACN,aAAa;GACb,cAAc;GACd,KAAK;GACL,OAAO;GACR;uDACa;GACZ,cAAc;GACd,KAAK;GACL,OAAO;GACP,aAAa;GACb,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB,CAAC;4DACiB;GACjB,cAAc;GACd,KAAK;GACL,OAAO;GACP,aAAa;GACb,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB,CAAC;EAEF;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,KAAK;GACL,KAAK;GACL,MAAM;GACN,cAAc;GACd,KAAK;GACL,OAAO;GACP,qBAAqB;GACtB;EAED;GACE,KAAK;GACL,OAAO;GACP,MAAM;GACN,aAAa;GACb,KAAK;GACL,OAAO;GACR;EACF;CAED,kBAAkB;EAChB,aAAa;EACb,QAAQ;GACN;IACE,KAAK;IACL,OAAO;IACP,MAAM;IACN,aAAa;IACd;GACD;IACE,KAAK;IACL,OAAO;IACP,MAAM;IACN,aAAa;IACb,MAAM;IACP;GACD;IACE,KAAK;IACL,OAAO;IACP,MAAM;IACN,aAAa;IACb,cAAc;IACf;GACD;IACE,KAAK;IACL,OAAO;IACP,MAAM;IACN,aAAa;IACb,qBAAqB;IACtB;GACD;IACE,KAAK;IACL,OAAO;IACP,MAAM;IACN,aAAa;IACb,qBAAqB;IACtB;GACF;EACF;CACF"}