datastake-daf 0.6.168 → 0.6.170

package/dist/components/index.js

@@ -3065,7 +3065,7 @@ const config$3 = {
   Integration: config$4
 };
 
-const _excluded$s = ["width", "height", "size", "name", "fill"];
+const _excluded$u = ["width", "height", "size", "name", "fill"];
 const CustomIcon = _ref => {
   let {
       width = 14,
@@ -3074,7 +3074,7 @@ const CustomIcon = _ref => {
       name = "",
       fill = "none"
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$s);
+    props = _objectWithoutProperties(_ref, _excluded$u);
   const conf = config$3[name];
   if (conf) {
     return /*#__PURE__*/jsxRuntime.jsx("svg", _objectSpread2(_objectSpread2({}, props), {}, {
@@ -9276,7 +9276,7 @@ createCommonjsModule(function (module, exports) {
 !function(e,n){module.exports=n();}(commonjsGlobal,(function(){return {name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(e){var n=["th","st","nd","rd"],t=e%100;return "["+e+(n[(t-20)%10]||n[t]||n[0])+"]"}}}));
 });
 
-const _excluded$r = ["view", "module", "scope", "form", "meta"];
+const _excluded$t = ["view", "module", "scope", "form", "meta"];
 dayjs__default["default"].extend(customParseFormat);
 dayjs__default["default"].extend(utc);
 dayjs__default["default"].extend(utc);
@@ -9650,7 +9650,7 @@ const filterCreateData = data => {
       form,
       meta
     } = data,
-    rest = _objectWithoutProperties(data, _excluded$r);
+    rest = _objectWithoutProperties(data, _excluded$t);
   const _meta = isObjectEmpty(meta) ? undefined : meta;
   return _objectSpread2(_objectSpread2({}, rest), {}, {
     meta: _meta
@@ -10035,7 +10035,7 @@ SelectFilters.propTypes = {
   apiUrl: PropTypes__default["default"].string
 };
 
-const _excluded$q = ["columns", "data", "defaultFilters", "style", "pagination", "loading", "onChange", "onFilterChange", "selectOptions", "filtersConfig", "rowSelection", "setShowFilters", "rowKey", "showFilters", "hideOnLoading", "sourcesKey", "className", "projects", "t", "selectedProject", "sourceId", "projectSources", "language", "scrollX", "apiUrl", "app", "doEmptyRows"];
+const _excluded$s = ["columns", "data", "defaultFilters", "style", "pagination", "loading", "onChange", "onFilterChange", "selectOptions", "filtersConfig", "rowSelection", "setShowFilters", "rowKey", "showFilters", "hideOnLoading", "sourcesKey", "className", "projects", "t", "selectedProject", "sourceId", "projectSources", "language", "scrollX", "apiUrl", "app", "doEmptyRows"];
 function DAFTable(_ref) {
   let {
       columns = [],
@@ -10066,7 +10066,7 @@ function DAFTable(_ref) {
       app,
       doEmptyRows
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$q);
+    rest = _objectWithoutProperties(_ref, _excluded$s);
   const [source, setSource] = React.useState([]);
   const projectData = (projects || []).find(p => p.id === selectedProject);
   const [filtersInit, setFiltersInit] = React.useState(!loading);
@@ -10788,7 +10788,7 @@ Pagination.propTypes = {
   isMobile: PropTypes__default["default"].bool
 };
 
-const _excluded$p = ["size", "maxHeight", "dataSource", "columns", "pagination"];
+const _excluded$r = ["size", "maxHeight", "dataSource", "columns", "pagination"];
 function StickyTable(_ref) {
   let {
       size = null,
@@ -10797,7 +10797,7 @@ function StickyTable(_ref) {
       columns = {},
       pagination = false
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$p);
+    props = _objectWithoutProperties(_ref, _excluded$r);
   return /*#__PURE__*/jsxRuntime.jsx("div", {
     className: "daf-sticky-table",
     children: /*#__PURE__*/jsxRuntime.jsx(antd.Table, _objectSpread2(_objectSpread2({}, props), {}, {
@@ -11262,7 +11262,7 @@ const BTN_SIZE = {
   LG: 'large'
 };
 
-const _excluded$o = ["content", "size", "type", "icon", "onClick", "disabled", "loading", "title", "style", "className"];
+const _excluded$q = ["content", "size", "type", "icon", "onClick", "disabled", "loading", "title", "style", "className"];
 function DafButton(_ref) {
   let {
       content = '',
@@ -11276,7 +11276,7 @@ function DafButton(_ref) {
       style = {},
       className = ''
     } = _ref,
-    restProps = _objectWithoutProperties(_ref, _excluded$o);
+    restProps = _objectWithoutProperties(_ref, _excluded$q);
   return /*#__PURE__*/jsxRuntime.jsx(antd.Button, _objectSpread2(_objectSpread2({
     icon: icon,
     type: type,
@@ -11510,12 +11510,12 @@ const Style$I = dt.div`
   }
 `;
 
-const _excluded$n = ["children"];
+const _excluded$p = ["children"];
 const BorderedButton = _ref => {
   let {
       children
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$n);
+    props = _objectWithoutProperties(_ref, _excluded$p);
   return /*#__PURE__*/jsxRuntime.jsx(Style$I, {
     className: "d-btn-cont",
     children: /*#__PURE__*/jsxRuntime.jsx(antd.Button, _objectSpread2(_objectSpread2({}, props), {}, {
@@ -11655,12 +11655,12 @@ Badge.propTypes = {
   props: PropTypes__default["default"].object
 };
 
-const _excluded$m = ["icon"];
+const _excluded$o = ["icon"];
 function GetIcon(_ref) {
   let {
       icon
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$m);
+    props = _objectWithoutProperties(_ref, _excluded$o);
   let Icon = Icons__namespace.CloseOutlined;
   if (Icons__namespace[icon]) {
     Icon = Icons__namespace[icon];
@@ -11979,7 +11979,7 @@ GoToSelect.propTypes = {
   t: PropTypes__default["default"].func
 };
 
-const _excluded$l = ["options", "defaultSelected", "onChange", "textWhenMultiple", "withCount", "oneAlwaysSelected", "canUnselectLast", "isAvatarGroup", "maxAvatarCount", "dropDownWidth", "topAvatarValue", "isSingle", "selectionType"];
+const _excluded$n = ["options", "defaultSelected", "onChange", "textWhenMultiple", "withCount", "oneAlwaysSelected", "canUnselectLast", "isAvatarGroup", "maxAvatarCount", "dropDownWidth", "topAvatarValue", "isSingle", "selectionType"];
 const {
   useToken: useToken$k
 } = antd.theme;
@@ -12072,7 +12072,7 @@ function Multiselect(_ref) {
       isSingle = false,
       selectionType = SELECTION_TYPES.DEFAULT
     } = _ref,
-    restProps = _objectWithoutProperties(_ref, _excluded$l);
+    restProps = _objectWithoutProperties(_ref, _excluded$n);
   const {
     token
   } = useToken$k();
@@ -12739,7 +12739,7 @@ DAFHeader.propTypes = {
   downloadDisabled: PropTypes__default["default"].any
 };
 
-const _excluded$k = ["tabs", "onChange", "value", "className"];
+const _excluded$m = ["tabs", "onChange", "value", "className"];
 function TabsHeader(_ref) {
   let {
       tabs = [],
@@ -12747,7 +12747,7 @@ function TabsHeader(_ref) {
       value = '',
       className = 'mt-2'
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$k);
+    rest = _objectWithoutProperties(_ref, _excluded$m);
   return /*#__PURE__*/jsxRuntime.jsx("div", {
     className: formatClassname(['daf-tabs-header pl-6 pr-6', className]),
     children: /*#__PURE__*/jsxRuntime.jsx(antd.Tabs, _objectSpread2({
@@ -12844,7 +12844,7 @@ DrawerHeader.propTypes = {
   tabsConfig: PropTypes__default["default"].any
 };
 
-const _excluded$j = ["label", "onClick", "icon", "type", "tooltip", "disabled", "loading", "style", "className"];
+const _excluded$l = ["label", "onClick", "icon", "type", "tooltip", "disabled", "loading", "style", "className"];
 const useFooter = _ref => {
   let {
     leftContent,
@@ -12879,7 +12879,7 @@ const useFooter = _ref => {
                 style = {},
                 className = ""
               } = button,
-              restProps = _objectWithoutProperties(button, _excluded$j);
+              restProps = _objectWithoutProperties(button, _excluded$l);
             return /*#__PURE__*/jsxRuntime.jsx(DafButton, _objectSpread2({
               content: label,
               type: type,
@@ -15369,7 +15369,7 @@ Widget.propTypes = {
   onExpandChange: PropTypes__default["default"].func
 };
 
-const _excluded$i = ["loading", "title", "image", "description", "imgAlt", "noDescriptionText"];
+const _excluded$k = ["loading", "title", "image", "description", "imgAlt", "noDescriptionText"];
 function ImageWidget(_ref) {
   let {
       loading = false,
@@ -15379,7 +15379,7 @@ function ImageWidget(_ref) {
       imgAlt,
       noDescriptionText
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$i);
+    props = _objectWithoutProperties(_ref, _excluded$k);
   return /*#__PURE__*/jsxRuntime.jsx(Widget, _objectSpread2(_objectSpread2({
     loading: loading,
     title: title,
@@ -15436,7 +15436,7 @@ function ImageWidget(_ref) {
 }
 
 var _templateObject$a;
-const _excluded$h = ["title", "loading", "data", "current", "defaultActiveTab", "widgetClassname", "className", "direction"];
+const _excluded$j = ["title", "loading", "data", "current", "defaultActiveTab", "widgetClassname", "className", "direction"];
 function FlowWidget(_ref) {
   let {
       title,
@@ -15448,7 +15448,7 @@ function FlowWidget(_ref) {
       className,
       direction = "horizontal"
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$h);
+    rest = _objectWithoutProperties(_ref, _excluded$j);
   const [activeTab, setActiveTab] = React.useState();
   React.useEffect(() => {
     if (defaultActiveTab) {
@@ -20129,14 +20129,14 @@ const MapConfig = ({
   });
 };
 
-const _excluded$g = ["config", "title", "loading"];
+const _excluded$i = ["config", "title", "loading"];
 const Details = _ref => {
   let {
       config = [],
       title,
       loading = false
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$g);
+    rest = _objectWithoutProperties(_ref, _excluded$i);
   return /*#__PURE__*/jsxRuntime.jsx(Widget, _objectSpread2(_objectSpread2({
     className: "with-border-header h-w-btn-header card",
     loading: loading,
@@ -20152,14 +20152,14 @@ const Details = _ref => {
   }));
 };
 
-const _excluded$f = ["config", "title", "loading"];
+const _excluded$h = ["config", "title", "loading"];
 const KeyIndicatorsDetails = _ref => {
   let {
       config,
       title,
       loading = false
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$f);
+    rest = _objectWithoutProperties(_ref, _excluded$h);
   return /*#__PURE__*/jsxRuntime.jsx(Widget, _objectSpread2(_objectSpread2({
     className: "with-border-header h-w-btn-header",
     title: title,
@@ -20189,7 +20189,7 @@ const Style$y = dt.div`
     }    
 `;
 
-const _excluded$e = ["children", "config", "detailsTitle", "firstColumnWidth"];
+const _excluded$g = ["children", "config", "detailsTitle", "firstColumnWidth"];
 const DetailsSection = _ref => {
   let {
       children,
@@ -20197,7 +20197,7 @@ const DetailsSection = _ref => {
       detailsTitle,
       firstColumnWidth = "250px"
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$e);
+    rest = _objectWithoutProperties(_ref, _excluded$g);
   return /*#__PURE__*/jsxRuntime.jsx(Style$y, {
     firstColumnWidth: firstColumnWidth,
     children: /*#__PURE__*/jsxRuntime.jsxs("div", {
@@ -20373,14 +20373,14 @@ const getGoalConfig = () => {
 };
 
 var _templateObject$8;
-const _excluded$d = ["title", "activeSdgGoals", "t"];
+const _excluded$f = ["title", "activeSdgGoals", "t"];
 function SDGWidget(_ref) {
   let {
       title = "Sustainable Development Goals",
       activeSdgGoals = [],
       t = key => key
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$d);
+    props = _objectWithoutProperties(_ref, _excluded$f);
   const sdgConfig = getGoalConfig();
   return /*#__PURE__*/jsxRuntime.jsx(Widget, _objectSpread2(_objectSpread2({
     title: title,
@@ -20401,100 +20401,113 @@ function SDGWidget(_ref) {
 const SDGContainer = dt.div(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteral(["\n\tdisplay: grid;\n\tgrid-template-columns: repeat(auto-fit, minmax(90px, 1fr));\n\tgap: 8px;\n\n\t.sdg-item {\n\t\theight: 90px;\n\t\twidth: 90px;\n\t\tborder-radius: 8px;\n\t\tbackground-size: cover;\n\t\tbackground-position: center;\n\t\tbackground-repeat: no-repeat;\n\t}\n\n\t.sdg-item-content {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\theight: 100%;\n\t\tcolor: white;\n\t\ttext-align: center;\n\t}\n"])));
 
 const ImageContainer = dt.div`
-	overflow: hidden;
-	position: relative;
+  overflow: hidden;
+  position: relative;
 
-	.image {
-		width: 100%;
-		height: 151px;
-		background-size: cover;
-		background-position: center;
-		background-repeat: no-repeat;
+  .image {
+    width: 100%;
+    height: 151px;
+    background-size: cover;
+    background-position: center;
+    background-repeat: no-repeat;
 
-		border-bottom-left-radius: 3px;
-		border-bottom-right-radius: 3px;
-	}
+    border-bottom-left-radius: 3px;
+    border-bottom-right-radius: 3px;
+  }
 
-	.icon-container {
-		position: absolute;
-		top: 10px;
-		right: 10px;
-		background: white;
-		padding: 10px;
-		border-radius: 6px;
-		cursor: pointer;
-	}
+  .icon-container {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    background: white;
+    padding: 10px;
+    border-radius: 6px;
+    cursor: pointer;
+  }
 `;
 const ProjectWidgetItems = dt.ul`
-	list-style: none;
-	padding: 0;
-	padding-top: 10px;
-	margin: 0;
+  list-style: none;
+  padding: 0;
+  padding-top: 10px;
+  margin: 0;
 
-	.project-widget-item {
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		border-bottom: 1px solid var(--base-gray-30);
-		padding: 10px 0;
+  .project-widget-item {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border-bottom: 1px solid var(--base-gray-30);
+    padding: 10px 0;
 
-		&:last-of-type {
-			border-bottom: 0;
-		}
-	}
+    &:last-of-type {
+      border-bottom: 0;
+    }
+  }
 `;
+const Label = dt.span`
+  font-family: SF UI Display;
+  font-weight: 500;
+  font-style: Medium;
+  font-size: 14px;
+  leading-trim: NONE;
+  line-height: 26px;
+  letter-spacing: 0%;
+  color: #6c737f;
+`;
+
 const SDGList = dt.ul`
-	list-style: none;
-	padding: 0;
-	width: 100%;
-	overflow-x: hidden;
-	display: flex;
-	flex-wrap: nowrap;
-	gap: 4px;
-	margin: 0;
-
-	.sdg-item-image {
-		width: 24px;
-		height: 24px;
-		background-size: cover;
-		background-position: center;
-		background-repeat: no-repeat;
-	}
+  list-style: none;
+  padding: 0;
+  width: 100%;
+  overflow-x: hidden;
+  display: flex;
+  flex-wrap: nowrap;
+  gap: 4px;
+  margin: 0;
 
-	.sdg-item-more {
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		background: var(--base-gray-30);
-		color: var(--base-gray-90);
-	}
-`;
-const Label = dt.span`
-	font-family: SF UI Display;
-	font-weight: 500;
-	font-style: Medium;
-	font-size: 14px;
-	leading-trim: NONE;
-	line-height: 26px;
-	letter-spacing: 0%;
-	color: #6c737f;
+  .sdg-item-image {
+    background-size: cover;
+    background-position: center;
+    background-repeat: no-repeat;
+  }
+
+  .sdg-item-more {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: var(--base-gray-30);
+    color: var(--base-gray-90);
+  }
 `;
 
-const SDG_IMAGE_WIDTH = 24;
 const GAP_BETWEEN_SDGS = 4;
-const TOTAL_SPACE_FOR_SDG = SDG_IMAGE_WIDTH + GAP_BETWEEN_SDGS;
-function SdgList({
+function SDGIcons({
   sdgList = [],
-  t,
-  cardWidth
+  t = str => str,
+  iconSize = 24
 }) {
-  const maxSdgToShow = React.useMemo(() => {
-    return Math.floor(cardWidth / TOTAL_SPACE_FOR_SDG);
-  }, [cardWidth]);
+  const containerRef = React__default["default"].useRef(null);
+  const [width, setWidth] = React__default["default"].useState(0);
+  React__default["default"].useEffect(() => {
+    if (containerRef.current) {
+      const resizeObserver = new ResizeObserver(entries => {
+        for (let entry of entries) {
+          setWidth(entry.contentRect.width);
+        }
+      });
+      resizeObserver.observe(containerRef.current);
+      return () => {
+        resizeObserver.disconnect();
+      };
+    }
+  }, []);
+  const maxSdgToShow = React__default["default"].useMemo(() => {
+    const TOTAL_SPACE_FOR_SDG = iconSize + GAP_BETWEEN_SDGS;
+    return Math.floor(width / TOTAL_SPACE_FOR_SDG);
+  }, [width, iconSize]);
   const {
     visibleSdgs,
     hiddenCount
-  } = React.useMemo(() => {
+  } = React__default["default"].useMemo(() => {
     if (sdgList.length <= maxSdgToShow) {
       return {
         visibleSdgs: sdgList,
@@ -20506,17 +20519,18 @@ function SdgList({
       hiddenCount: sdgList.length - (maxSdgToShow - 1)
     };
   }, [sdgList, maxSdgToShow]);
-  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/jsxRuntime.jsx(Label, {
-      children: "SDGs:"
-    }), /*#__PURE__*/jsxRuntime.jsxs(SDGList, {
+  return /*#__PURE__*/jsxRuntime.jsx("div", {
+    ref: containerRef,
+    children: /*#__PURE__*/jsxRuntime.jsxs(SDGList, {
       children: [visibleSdgs.map((sdg, index) => /*#__PURE__*/jsxRuntime.jsx("li", {
         className: "project-widget-item",
         children: /*#__PURE__*/jsxRuntime.jsx(antd.Tooltip, {
           title: t(`SDGS::${sdg}`),
           children: /*#__PURE__*/jsxRuntime.jsx("div", {
             style: {
-              backgroundImage: `url(${SDG_IMAGES[sdg].img})`
+              backgroundImage: `url(${SDG_IMAGES[sdg].img})`,
+              height: iconSize,
+              width: iconSize
             },
             className: "sdg-item-image"
           })
@@ -20536,8 +20550,8 @@ function SdgList({
               title: t(`SDGS::${sdg}`),
               children: /*#__PURE__*/jsxRuntime.jsx("div", {
                 style: {
-                  width: SDG_IMAGE_WIDTH,
-                  height: SDG_IMAGE_WIDTH,
+                  width: iconSize,
+                  height: iconSize,
                   backgroundImage: `url(${SDG_IMAGES[sdg].img})`,
                   backgroundSize: "cover",
                   borderRadius: 4
@@ -20552,11 +20566,25 @@ function SdgList({
           })
         })
       })]
+    })
+  });
+}
+
+function SdgList({
+  sdgList = [],
+  t
+}) {
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx(Label, {
+      children: "SDGs:"
+    }), /*#__PURE__*/jsxRuntime.jsx(SDGIcons, {
+      sdgList: sdgList,
+      t: t
     })]
   });
 }
 
-const _excluded$c = ["title", "description", "onLinkClick", "image", "linkIcon", "sdgList", "items", "onCardClick", "hideSDGList", "t"];
+const _excluded$e = ["title", "description", "onLinkClick", "image", "linkIcon", "sdgList", "items", "onCardClick", "hideSDGList", "t"];
 const {
   Meta
 } = antd.Card;
@@ -20576,20 +20604,11 @@ function ProjectWidget(_ref) {
       hideSDGList = false,
       t = x => x
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$c);
+    props = _objectWithoutProperties(_ref, _excluded$e);
   const [isHovered, setIsHovered] = React__default["default"].useState(false);
   const {
     token
   } = useToken$i();
-  const cardRef = React__default["default"].useRef(null);
-  const [cardWidth, setCardWidth] = React__default["default"].useState(0);
-  React__default["default"].useEffect(() => {
-    const resizeObserver = new ResizeObserver(entries => {
-      setCardWidth(entries[0].contentRect.width);
-    });
-    resizeObserver.observe(cardRef.current);
-    return () => resizeObserver.disconnect();
-  }, [cardRef]);
   return /*#__PURE__*/jsxRuntime.jsxs(antd.Card, _objectSpread2(_objectSpread2({
     style: {
       flex: 1,
@@ -20601,11 +20620,18 @@ function ProjectWidget(_ref) {
     onMouseLeave: () => setIsHovered(false),
     onClick: onCardClick,
     cover: /*#__PURE__*/jsxRuntime.jsxs(ImageContainer, {
-      children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+      children: [image ? /*#__PURE__*/jsxRuntime.jsx("div", {
         className: "image",
         style: {
           backgroundImage: "url(".concat(image, ")")
         }
+      }) : /*#__PURE__*/jsxRuntime.jsx("div", {
+        style: {
+          height: "103px"
+        },
+        children: /*#__PURE__*/jsxRuntime.jsx(antd.Empty, {
+          image: antd.Empty.PRESENTED_IMAGE_SIMPLE
+        })
       }), onLinkClick && /*#__PURE__*/jsxRuntime.jsx("div", {
         className: "icon-container",
         onClick: onLinkClick,
@@ -20633,11 +20659,9 @@ function ProjectWidget(_ref) {
         borderTop: "1px solid var(--base-gray-30)",
         paddingTop: "10px"
       },
-      ref: cardRef,
       children: /*#__PURE__*/jsxRuntime.jsx(SdgList, {
         sdgList: sdgList,
-        t: t,
-        cardWidth: cardWidth
+        t: t
       })
     })]
   }));
@@ -20743,6 +20767,106 @@ const WidgetCard = _ref => {
   });
 };
 
+const _excluded$d = ["title", "children"];
+function CarouselWidget(_ref) {
+  let {
+      title,
+      children
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded$d);
+  /**
+   * Handles carousel slide change events
+   * @param {number} currentSlide - The index of the current slide after change
+   * @private
+   */
+  const onChange = currentSlide => {
+    console.log(currentSlide);
+  };
+  return /*#__PURE__*/jsxRuntime.jsx(Widget, {
+    title: title,
+    className: "with-border-header h-w-btn-header",
+    children: /*#__PURE__*/jsxRuntime.jsx(antd.Carousel, _objectSpread2(_objectSpread2({
+      afterChange: onChange
+    }, rest), {}, {
+      children: children
+    }))
+  });
+}
+
+const _excluded$c = ["title", "images", "height", "fallback"];
+function ImageCarousel(_ref) {
+  let {
+      title,
+      images,
+      height = 400,
+      fallback = "/assets/images/empty-box.svg"
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded$c);
+  const [previewVisible, setPreviewVisible] = React.useState(false);
+  const [current, setCurrent] = React.useState(0);
+  const carouselRef = React.useRef(null);
+  const handleCarouselChange = index => {
+    setCurrent(index);
+  };
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx(CarouselWidget, _objectSpread2(_objectSpread2({
+      title: title
+    }, rest), {}, {
+      dots: false,
+      children: /*#__PURE__*/jsxRuntime.jsx(antd.Carousel, {
+        ref: carouselRef,
+        afterChange: handleCarouselChange,
+        infinite: true,
+        children: images.map((image, index) => {
+          const imageSrc = typeof image === "string" ? image : image.src;
+          const imageAlt = typeof image === "string" ? "".concat(title, " - Image ").concat(index + 1) : image.alt;
+          return /*#__PURE__*/jsxRuntime.jsx("div", {
+            children: /*#__PURE__*/jsxRuntime.jsx(antd.Image, {
+              src: imageSrc,
+              alt: imageAlt,
+              height: height,
+              width: "100%",
+              fallback: fallback,
+              loading: "lazy",
+              preview: {
+                visible: false
+              },
+              onClick: () => {
+                setCurrent(index);
+                setPreviewVisible(true);
+              }
+            })
+          }, imageSrc);
+        })
+      })
+    })), /*#__PURE__*/jsxRuntime.jsx("div", {
+      style: {
+        display: "none"
+      },
+      children: /*#__PURE__*/jsxRuntime.jsx(antd.Image.PreviewGroup, {
+        preview: {
+          visible: previewVisible,
+          current,
+          onVisibleChange: vis => setPreviewVisible(vis),
+          onChange: idx => {
+            var _carouselRef$current;
+            setCurrent(idx);
+            (_carouselRef$current = carouselRef.current) === null || _carouselRef$current === void 0 || _carouselRef$current.goTo(idx);
+          }
+        },
+        children: images.map((image, index) => {
+          const imageSrc = typeof image === "string" ? image : image.src;
+          const imageAlt = typeof image === "string" ? "".concat(title, " - Image ").concat(index + 1) : image.alt;
+          return /*#__PURE__*/jsxRuntime.jsx(antd.Image, {
+            src: imageSrc,
+            alt: imageAlt
+          }, imageSrc);
+        })
+      })
+    })]
+  });
+}
+
 var Style$w = dt.div`
   border: 1px solid var(--base-gray-40);
   padding: 12px;
@@ -60033,6 +60157,7 @@ exports.BarChart = BarChart;
 exports.BaseScreen = BaseScreen;
 exports.BorderedButton = BorderedButton;
 exports.Button = DafButton;
+exports.CarouselWidget = CarouselWidget;
 exports.ColumnChart = ColumnChart;
 exports.ComponentWithFocus = ComponentWithFocus;
 exports.CustomIcon = CustomIcon;
@@ -60062,6 +60187,7 @@ exports.GetIcon = GetIcon;
 exports.Globe = Globe;
 exports.GoToSelect = GoToSelect;
 exports.Header = DAFHeader;
+exports.ImageCarousel = ImageCarousel;
 exports.InformationChannelProvider = InformationChannelProvider;
 exports.InformationChannels = DataStoreTable;
 exports.InformationChannelsDataPoint = DataPoint;