datastake-daf 0.6.795 → 0.6.797

package/dist/components/index.js

@@ -4778,7 +4778,7 @@ const config$2 = {
   Down: config$3
 };
 
-const _excluded$C = ["width", "height", "size", "name", "fill"];
+const _excluded$D = ["width", "height", "size", "name", "fill"];
 const CustomIcon = _ref => {
   let {
       width = 14,
@@ -4787,7 +4787,7 @@ const CustomIcon = _ref => {
       name = "",
       fill = "none"
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$C);
+    props = _objectWithoutProperties(_ref, _excluded$D);
   const conf = config$2[name];
   if (conf) {
     return /*#__PURE__*/jsxRuntime.jsx("svg", _objectSpread2(_objectSpread2({}, props), {}, {
@@ -5076,7 +5076,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$B = ["view", "module", "scope", "form", "meta", "createdAt", "updatedAt"];
+const _excluded$C = ["view", "module", "scope", "form", "meta", "createdAt", "updatedAt"];
 dayjs__default["default"].extend(customParseFormat);
 dayjs__default["default"].extend(utc);
 dayjs__default["default"].extend(utc);
@@ -5452,7 +5452,7 @@ const filterCreateData = data => {
       createdAt,
       updatedAt
     } = data,
-    rest = _objectWithoutProperties(data, _excluded$B);
+    rest = _objectWithoutProperties(data, _excluded$C);
   const _meta = isObjectEmpty(meta) ? undefined : meta;
   return _objectSpread2(_objectSpread2({}, rest), {}, {
     meta: _meta
@@ -5848,7 +5848,7 @@ SelectFilters.propTypes = {
   apiUrl: PropTypes__default["default"].string
 };
 
-const _excluded$A = ["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$B = ["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 = [],
@@ -5879,7 +5879,7 @@ function DAFTable(_ref) {
       app,
       doEmptyRows
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$A);
+    rest = _objectWithoutProperties(_ref, _excluded$B);
   const [source, setSource] = React.useState([]);
   const projectData = (projects || []).find(p => p.id === selectedProject);
   const [filtersInit, setFiltersInit] = React.useState(!loading);
@@ -6623,8 +6623,8 @@ Pagination.propTypes = {
   isMobile: PropTypes__default["default"].bool
 };
 
-var _templateObject$g;
-const Style$T = styled__default["default"].div(_templateObject$g || (_templateObject$g = _taggedTemplateLiteral(["\n\tposition: relative;\n\twidth: 100%;\n\theight: 100%;\n\n\t.p-placeholder {\n\t\tposition: absolute;\n\t\ttop: 0px;\n\t\tleft: 0px;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tbackground: transparent;\n\t\tz-index: 100;\n\t}\n"])));
+var _templateObject$h;
+const Style$T = styled__default["default"].div(_templateObject$h || (_templateObject$h = _taggedTemplateLiteral(["\n\tposition: relative;\n\twidth: 100%;\n\theight: 100%;\n\n\t.p-placeholder {\n\t\tposition: absolute;\n\t\ttop: 0px;\n\t\tleft: 0px;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tbackground: transparent;\n\t\tz-index: 100;\n\t}\n"])));
 
 /**
  * ComponentWithFocus
@@ -6696,8 +6696,8 @@ function ComponentWithFocus(_ref) {
   });
 }
 
-var _templateObject$f;
-const _excluded$z = ["size", "maxHeight", "containerHeight", "dataSource", "columns", "pagination", "doEmptyRows"];
+var _templateObject$g;
+const _excluded$A = ["size", "maxHeight", "containerHeight", "dataSource", "columns", "pagination", "doEmptyRows"];
 function StickyTable(_ref) {
   let {
       size = "small",
@@ -6708,7 +6708,7 @@ function StickyTable(_ref) {
       pagination = false,
       doEmptyRows = true
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$z);
+    props = _objectWithoutProperties(_ref, _excluded$A);
   const data = React__default["default"].useMemo(() => {
     if (!doEmptyRows) {
       return dataSource;
@@ -6754,7 +6754,7 @@ function StickyTable(_ref) {
     })
   });
 }
-const Style$S = styled__default["default"].div(_templateObject$f || (_templateObject$f = _taggedTemplateLiteral(["\n\tmax-width: calc(100% - 48px);\n\tmargin-left: var(--size-lg);\n\toverflow: hidden;\n\n\t.daf-table {\n\t\tpadding: 0px;\n\t\tmargin-top: 0px;\n\n\t\t.ant-tag {\n\t\t\ttext-align: center;\n\t\t}\n\t}\n\n\t.daf-select-filters .filters {\n\t\tpadding-top: 16px;\n\t\tpadding-left: 0;\n\t\tpadding-right: 0;\n\t}\n\n\t.daf-table {\n\t\tpadding-top: 16px;\n\t}\n"])));
+const Style$S = styled__default["default"].div(_templateObject$g || (_templateObject$g = _taggedTemplateLiteral(["\n\tmax-width: calc(100% - 48px);\n\tmargin-left: var(--size-lg);\n\toverflow: hidden;\n\n\t.daf-table {\n\t\tpadding: 0px;\n\t\tmargin-top: 0px;\n\n\t\t.ant-tag {\n\t\t\ttext-align: center;\n\t\t}\n\t}\n\n\t.daf-select-filters .filters {\n\t\tpadding-top: 16px;\n\t\tpadding-left: 0;\n\t\tpadding-right: 0;\n\t}\n\n\t.daf-table {\n\t\tpadding-top: 16px;\n\t}\n"])));
 StickyTable.propTypes = {
   size: PropTypes__default["default"].any,
   maxHeight: PropTypes__default["default"].number,
@@ -7236,7 +7236,7 @@ const BTN_SIZE = {
   LG: 'large'
 };
 
-const _excluded$y = ["content", "size", "type", "icon", "onClick", "disabled", "loading", "title", "style", "className"];
+const _excluded$z = ["content", "size", "type", "icon", "onClick", "disabled", "loading", "title", "style", "className"];
 function DafButton(_ref) {
   let {
       content = '',
@@ -7250,7 +7250,7 @@ function DafButton(_ref) {
       style = {},
       className = ''
     } = _ref,
-    restProps = _objectWithoutProperties(_ref, _excluded$y);
+    restProps = _objectWithoutProperties(_ref, _excluded$z);
   return /*#__PURE__*/jsxRuntime.jsx(antd.Button, _objectSpread2(_objectSpread2({
     icon: icon,
     type: type,
@@ -7369,12 +7369,12 @@ const Style$R = styled__default["default"].div`
   }
 `;
 
-const _excluded$x = ["children"];
+const _excluded$y = ["children"];
 const BorderedButton = _ref => {
   let {
       children
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$x);
+    props = _objectWithoutProperties(_ref, _excluded$y);
   return /*#__PURE__*/jsxRuntime.jsx(Style$R, {
     className: "d-btn-cont",
     children: /*#__PURE__*/jsxRuntime.jsx(antd.Button, _objectSpread2(_objectSpread2({}, props), {}, {
@@ -7383,7 +7383,7 @@ const BorderedButton = _ref => {
   });
 };
 
-var _templateObject$e;
+var _templateObject$f;
 const variantConfig = {
   default: {
     className: "default-badge",
@@ -7501,7 +7501,7 @@ function Badge(_ref) {
     })
   });
 }
-const Style$Q = styled__default["default"].div(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral(["\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n\tgap: 4px;\n\tpadding: 4px;\n\tmax-width: 100%;\n\n\toverflow: hidden;\n\twhite-space: nowrap;\n\ttext-overflow: ellipsis;\n\n\t> svg {\n\t\tflex-shrink: 0;\n\t}\n\n\t> span {\n\t\tall: unset;\n\t\tmargin-left: 4px;\n\t\tfont-weight: 600;\n\t\tfont-size: 12px;\n\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\twhite-space: nowrap;\n\t\tdisplay: block;\n\t\tmax-width: 100%;\n\t}\n"])));
+const Style$Q = styled__default["default"].div(_templateObject$f || (_templateObject$f = _taggedTemplateLiteral(["\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n\tgap: 4px;\n\tpadding: 4px;\n\tmax-width: 100%;\n\n\toverflow: hidden;\n\twhite-space: nowrap;\n\ttext-overflow: ellipsis;\n\n\t> svg {\n\t\tflex-shrink: 0;\n\t}\n\n\t> span {\n\t\tall: unset;\n\t\tmargin-left: 4px;\n\t\tfont-weight: 600;\n\t\tfont-size: 12px;\n\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\twhite-space: nowrap;\n\t\tdisplay: block;\n\t\tmax-width: 100%;\n\t}\n"])));
 Badge.propTypes = {
   children: PropTypes__default["default"].node,
   className: PropTypes__default["default"].string,
@@ -7514,12 +7514,12 @@ Badge.propTypes = {
   props: PropTypes__default["default"].object
 };
 
-const _excluded$w = ["icon"];
+const _excluded$x = ["icon"];
 function GetIcon(_ref) {
   let {
       icon
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$w);
+    props = _objectWithoutProperties(_ref, _excluded$x);
   let Icon = Icons__namespace.CloseOutlined;
   if (Icons__namespace[icon]) {
     Icon = Icons__namespace[icon];
@@ -7849,7 +7849,7 @@ const MultiSelectStyled = styled__default["default"](antd.Select)`
   }
 `;
 
-const _excluded$v = ["options", "defaultSelected", "onChange", "textWhenMultiple", "withCount", "oneAlwaysSelected", "canUnselectLast", "isAvatarGroup", "maxAvatarCount", "dropDownWidth", "topAvatarValue", "isSingle", "selectionType"];
+const _excluded$w = ["options", "defaultSelected", "onChange", "textWhenMultiple", "withCount", "oneAlwaysSelected", "canUnselectLast", "isAvatarGroup", "maxAvatarCount", "dropDownWidth", "topAvatarValue", "isSingle", "selectionType"];
 const {
   useToken: useToken$n
 } = antd.theme;
@@ -7942,7 +7942,7 @@ function Multiselect(_ref) {
       isSingle = false,
       selectionType = SELECTION_TYPES.DEFAULT
     } = _ref,
-    restProps = _objectWithoutProperties(_ref, _excluded$v);
+    restProps = _objectWithoutProperties(_ref, _excluded$w);
   const {
     token
   } = useToken$n();
@@ -8501,22 +8501,20 @@ const useHeader = _ref => {
 const {
   useToken: useToken$m
 } = antd.theme;
-function BreadCrumbs(_ref) {
-  let {
-    breadcrumbs = [],
-    mainContWidth = 0
-  } = _ref;
+function BreadCrumbs({
+  breadcrumbs = [],
+  mainContWidth = 0
+}) {
   const [splitIndex, setSplitIndex] = React.useState(0);
   const {
     token
   } = useToken$m();
-  const _renderBreadcrumb = function (b, i, isLast) {
-    let noOnClickLast = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
+  const _renderBreadcrumb = (b, i, isLast, noOnClickLast = false) => {
     return /*#__PURE__*/jsxRuntime.jsxs("div", {
       className: "flex breadcrumb-item",
-      onClick: noOnClickLast && isLast ? undefined : b === null || b === void 0 ? void 0 : b.onClick,
+      onClick: noOnClickLast && isLast ? undefined : b?.onClick,
       children: [/*#__PURE__*/jsxRuntime.jsx("span", {
-        children: b === null || b === void 0 ? void 0 : b.label
+        children: b?.label
       }), !isLast && /*#__PURE__*/jsxRuntime.jsx("div", {
         className: "flex flex-column justify-content-center",
         children: /*#__PURE__*/jsxRuntime.jsx(CustomIcon, {
@@ -8526,7 +8524,7 @@ function BreadCrumbs(_ref) {
           color: token.baseGray50
         })
       })]
-    }, "breadcrumb-item-".concat(i));
+    }, `breadcrumb-item-${i}`);
   };
   React.useEffect(() => {
     const _placeholderCont = document.getElementById("header-breadcrumbs");
@@ -8569,7 +8567,7 @@ function BreadCrumbs(_ref) {
         placement: "bottomRight",
         menu: {
           items: groupedBreadCrumbs[2].map((it, i) => ({
-            key: "items-".concat(i),
+            key: `items-${i}`,
             label: it.label,
             onClick: it.onClick
           }))
@@ -8664,7 +8662,7 @@ DAFHeader.propTypes = {
   filtersConfig: PropTypes__default["default"].any
 };
 
-const _excluded$u = ["tabs", "onChange", "value", "className"];
+const _excluded$v = ["tabs", "onChange", "value", "className"];
 function TabsHeader(_ref) {
   let {
       tabs = [],
@@ -8672,7 +8670,7 @@ function TabsHeader(_ref) {
       value = '',
       className = 'mt-2'
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$u);
+    rest = _objectWithoutProperties(_ref, _excluded$v);
   return /*#__PURE__*/jsxRuntime.jsx("div", {
     className: formatClassname(['daf-tabs-header pl-6 pr-6', className]),
     children: /*#__PURE__*/jsxRuntime.jsx(antd.Tabs, _objectSpread2({
@@ -8769,7 +8767,7 @@ DrawerHeader.propTypes = {
   tabsConfig: PropTypes__default["default"].any
 };
 
-const _excluded$t = ["label", "onClick", "icon", "type", "tooltip", "disabled", "loading", "style", "className"];
+const _excluded$u = ["label", "onClick", "icon", "type", "tooltip", "disabled", "loading", "style", "className"];
 const useFooter = _ref => {
   let {
     leftContent,
@@ -8804,7 +8802,7 @@ const useFooter = _ref => {
                 style = {},
                 className = ""
               } = button,
-              restProps = _objectWithoutProperties(button, _excluded$t);
+              restProps = _objectWithoutProperties(button, _excluded$u);
             return /*#__PURE__*/jsxRuntime.jsx(DafButton, _objectSpread2({
               content: label,
               type: type,
@@ -8831,8 +8829,8 @@ const useFooter = _ref => {
   };
 };
 
-var _templateObject$d;
-const FooterContainer = styled__default["default"].div(_templateObject$d || (_templateObject$d = _taggedTemplateLiteral(["\n\t.daf-footer {\n\t\tbackground: #ffffff;\n\t\tborder-top: 1px solid #e8e8e8;\n\t\tborder-left: none;\n\t\tborder-right: none;\n\t\tborder-bottom: none;\n\t\tborder-radius: 0;\n\t\tpadding: 24px;\n\t\tmargin: 0;\n\t\tbox-shadow: none;\n\t\tz-index: 100;\n\t\tposition: relative;\n\t\tmin-height: 80px;\n\n\t\t&.daf-footer-fixed {\n\t\t\tposition: fixed;\n\t\t\tbottom: 0;\n\t\t\tleft: 0;\n\t\t\tright: 0;\n\t\t\tz-index: 1000;\n\t\t}\n\n\t\t.daf-footer-content {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tjustify-content: space-between;\n\t\t\twidth: 100%;\n\t\t\tmin-height: 32px;\n\n\t\t\t.daf-footer-left {\n\t\t\t\tflex: 1;\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: flex-start;\n\t\t\t}\n\n\t\t\t.daf-footer-center {\n\t\t\t\tflex: 1;\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t}\n\n\t\t\t.daf-footer-right {\n\t\t\t\tflex: 1;\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: flex-end;\n\t\t\t\tgap: 12px;\n\n\t\t\t\t.daf-footer-actions {\n\t\t\t\t\t.ant-btn {\n\t\t\t\t\t\theight: 40px;\n\t\t\t\t\t\tpadding: 0 24px;\n\t\t\t\t\t\tborder-radius: 6px;\n\t\t\t\t\t\tfont-weight: 500;\n\t\t\t\t\t\tfont-size: 14px;\n\t\t\t\t\t\ttransition: all 0.3s ease;\n\t\t\t\t\t\tborder: 1px solid transparent;\n\n\t\t\t\t\t\t&.ant-btn-primary {\n\t\t\t\t\t\t\tbackground-color: var(--color-primary-70);\n\t\t\t\t\t\t\tcolor: #ffffff;\n\t\t\t\t\t\t\tborder-color: var(--color-primary-70);\n\n\t\t\t\t\t\t\t&:hover {\n\t\t\t\t\t\t\t\tbackground-color: var(--color-primary-60);\n\t\t\t\t\t\t\t\tborder-color: var(--color-primary-60);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t&:active {\n\t\t\t\t\t\t\t\tbackground-color: var(--color-primary-80);\n\t\t\t\t\t\t\t\tborder-color: var(--color-primary-80);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t&:disabled {\n\t\t\t\t\t\t\t\tbackground-color: #f5f5f5;\n\t\t\t\t\t\t\t\tcolor: #bfbfbf;\n\t\t\t\t\t\t\t\tborder-color: #d9d9d9;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t&.ant-btn-default {\n\t\t\t\t\t\t\tbackground: #ffffff;\n\t\t\t\t\t\t\tcolor: #666666;\n\t\t\t\t\t\t\tborder-color: #d9d9d9;\n\n\t\t\t\t\t\t\t&:hover {\n\t\t\t\t\t\t\t\tborder-color: var(--color-primary-70);\n\t\t\t\t\t\t\t\tcolor: var(--color-primary-70);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t&:active {\n\t\t\t\t\t\t\t\tborder-color: var(--color-primary-80);\n\t\t\t\t\t\t\t\tcolor: var(--color-primary-80);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t&:disabled {\n\t\t\t\t\t\t\t\tbackground-color: #f5f5f5;\n\t\t\t\t\t\t\t\tcolor: #bfbfbf;\n\t\t\t\t\t\t\t\tborder-color: #d9d9d9;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t&.ant-btn-ghost {\n\t\t\t\t\t\t\tbackground: transparent;\n\t\t\t\t\t\t\tcolor: #666666;\n\t\t\t\t\t\t\tborder-color: #d9d9d9;\n\n\t\t\t\t\t\t\t&:hover {\n\t\t\t\t\t\t\t\tborder-color: var(--color-primary-70);\n\t\t\t\t\t\t\t\tcolor: var(--color-primary-70);\n\t\t\t\t\t\t\t\tbackground: rgba(0, 0, 0, 0.02);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t&:active {\n\t\t\t\t\t\t\t\tborder-color: var(--color-primary-80);\n\t\t\t\t\t\t\t\tcolor: var(--color-primary-80);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t&:disabled {\n\t\t\t\t\t\t\t\tcolor: #bfbfbf;\n\t\t\t\t\t\t\t\tborder-color: #d9d9d9;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t/* Responsive design */\n\t@media (max-width: 768px) {\n\t\t.daf-footer {\n\t\t\tmargin: 0;\n\t\t\tpadding: 16px;\n\n\t\t\t.daf-footer-content {\n\t\t\t\tflex-direction: column;\n\t\t\t\tgap: 16px;\n\t\t\t\talign-items: stretch;\n\n\t\t\t\t.daf-footer-left,\n\t\t\t\t.daf-footer-center,\n\t\t\t\t.daf-footer-right {\n\t\t\t\t\tflex: none;\n\t\t\t\t\tjustify-content: center;\n\t\t\t\t}\n\n\t\t\t\t.daf-footer-right {\n\t\t\t\t\t.daf-footer-actions {\n\t\t\t\t\t\tjustify-content: center;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t/* App-specific styling */\n\t&.sbg-app {\n\t\t.daf-footer {\n\t\t\tbackground: #f8f9fa;\n\t\t\tborder-color: #e9ecef;\n\t\t}\n\t}\n\n\t&.nashiriki-app {\n\t\t.daf-footer {\n\t\t\tbackground: #fff;\n\t\t\tborder-color: #d9d9d9;\n\t\t}\n\t}\n"])));
+var _templateObject$e;
+const FooterContainer = styled__default["default"].div(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral(["\n\t.daf-footer {\n\t\tbackground: #ffffff;\n\t\tborder-top: 1px solid #e8e8e8;\n\t\tborder-left: none;\n\t\tborder-right: none;\n\t\tborder-bottom: none;\n\t\tborder-radius: 0;\n\t\tpadding: 24px;\n\t\tmargin: 0;\n\t\tbox-shadow: none;\n\t\tz-index: 100;\n\t\tposition: relative;\n\t\tmin-height: 80px;\n\n\t\t&.daf-footer-fixed {\n\t\t\tposition: fixed;\n\t\t\tbottom: 0;\n\t\t\tleft: 0;\n\t\t\tright: 0;\n\t\t\tz-index: 1000;\n\t\t}\n\n\t\t.daf-footer-content {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tjustify-content: space-between;\n\t\t\twidth: 100%;\n\t\t\tmin-height: 32px;\n\n\t\t\t.daf-footer-left {\n\t\t\t\tflex: 1;\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: flex-start;\n\t\t\t}\n\n\t\t\t.daf-footer-center {\n\t\t\t\tflex: 1;\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t}\n\n\t\t\t.daf-footer-right {\n\t\t\t\tflex: 1;\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: flex-end;\n\t\t\t\tgap: 12px;\n\n\t\t\t\t.daf-footer-actions {\n\t\t\t\t\t.ant-btn {\n\t\t\t\t\t\theight: 40px;\n\t\t\t\t\t\tpadding: 0 24px;\n\t\t\t\t\t\tborder-radius: 6px;\n\t\t\t\t\t\tfont-weight: 500;\n\t\t\t\t\t\tfont-size: 14px;\n\t\t\t\t\t\ttransition: all 0.3s ease;\n\t\t\t\t\t\tborder: 1px solid transparent;\n\n\t\t\t\t\t\t&.ant-btn-primary {\n\t\t\t\t\t\t\tbackground-color: var(--color-primary-70);\n\t\t\t\t\t\t\tcolor: #ffffff;\n\t\t\t\t\t\t\tborder-color: var(--color-primary-70);\n\n\t\t\t\t\t\t\t&:hover {\n\t\t\t\t\t\t\t\tbackground-color: var(--color-primary-60);\n\t\t\t\t\t\t\t\tborder-color: var(--color-primary-60);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t&:active {\n\t\t\t\t\t\t\t\tbackground-color: var(--color-primary-80);\n\t\t\t\t\t\t\t\tborder-color: var(--color-primary-80);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t&:disabled {\n\t\t\t\t\t\t\t\tbackground-color: #f5f5f5;\n\t\t\t\t\t\t\t\tcolor: #bfbfbf;\n\t\t\t\t\t\t\t\tborder-color: #d9d9d9;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t&.ant-btn-default {\n\t\t\t\t\t\t\tbackground: #ffffff;\n\t\t\t\t\t\t\tcolor: #666666;\n\t\t\t\t\t\t\tborder-color: #d9d9d9;\n\n\t\t\t\t\t\t\t&:hover {\n\t\t\t\t\t\t\t\tborder-color: var(--color-primary-70);\n\t\t\t\t\t\t\t\tcolor: var(--color-primary-70);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t&:active {\n\t\t\t\t\t\t\t\tborder-color: var(--color-primary-80);\n\t\t\t\t\t\t\t\tcolor: var(--color-primary-80);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t&:disabled {\n\t\t\t\t\t\t\t\tbackground-color: #f5f5f5;\n\t\t\t\t\t\t\t\tcolor: #bfbfbf;\n\t\t\t\t\t\t\t\tborder-color: #d9d9d9;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t&.ant-btn-ghost {\n\t\t\t\t\t\t\tbackground: transparent;\n\t\t\t\t\t\t\tcolor: #666666;\n\t\t\t\t\t\t\tborder-color: #d9d9d9;\n\n\t\t\t\t\t\t\t&:hover {\n\t\t\t\t\t\t\t\tborder-color: var(--color-primary-70);\n\t\t\t\t\t\t\t\tcolor: var(--color-primary-70);\n\t\t\t\t\t\t\t\tbackground: rgba(0, 0, 0, 0.02);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t&:active {\n\t\t\t\t\t\t\t\tborder-color: var(--color-primary-80);\n\t\t\t\t\t\t\t\tcolor: var(--color-primary-80);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t&:disabled {\n\t\t\t\t\t\t\t\tcolor: #bfbfbf;\n\t\t\t\t\t\t\t\tborder-color: #d9d9d9;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t/* Responsive design */\n\t@media (max-width: 768px) {\n\t\t.daf-footer {\n\t\t\tmargin: 0;\n\t\t\tpadding: 16px;\n\n\t\t\t.daf-footer-content {\n\t\t\t\tflex-direction: column;\n\t\t\t\tgap: 16px;\n\t\t\t\talign-items: stretch;\n\n\t\t\t\t.daf-footer-left,\n\t\t\t\t.daf-footer-center,\n\t\t\t\t.daf-footer-right {\n\t\t\t\t\tflex: none;\n\t\t\t\t\tjustify-content: center;\n\t\t\t\t}\n\n\t\t\t\t.daf-footer-right {\n\t\t\t\t\t.daf-footer-actions {\n\t\t\t\t\t\tjustify-content: center;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t/* App-specific styling */\n\t&.sbg-app {\n\t\t.daf-footer {\n\t\t\tbackground: #f8f9fa;\n\t\t\tborder-color: #e9ecef;\n\t\t}\n\t}\n\n\t&.nashiriki-app {\n\t\t.daf-footer {\n\t\t\tbackground: #fff;\n\t\t\tborder-color: #d9d9d9;\n\t\t}\n\t}\n"])));
 
 function DAFFooter(_ref) {
   let {
@@ -9561,29 +9559,24 @@ const processConditionalTableKeys = (tableKeys, item) => {
   });
   return processedKeys;
 };
-const renderFieldData = function (type, value, user, config) {
-  let getApiBaseUrl = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : () => {};
-  let getAppHeader = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : () => {};
-  let app = arguments.length > 6 ? arguments[6] : undefined;
-  let allValues = arguments.length > 7 ? arguments[7] : undefined;
-  let formValues = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : {};
+const renderFieldData = (type, value, user, config, getApiBaseUrl = () => {}, getAppHeader = () => {}, app, allValues, formValues = {}) => {
   switch (type) {
     case 'year':
       return value !== '-' ? renderDateFormatted(value, 'YYYY', 'en') : '-';
     case 'date':
       {
-        const language = user !== null && user !== void 0 && user.language && (user === null || user === void 0 ? void 0 : user.language) === 'sp' ? 'es' : user === null || user === void 0 ? void 0 : user.language;
+        const language = user?.language && user?.language === 'sp' ? 'es' : user?.language;
         return value !== '-' ? renderDateFormatted(value, 'DD MMM YYYY', language || 'en') : '-';
       }
     case 'select':
       {
-        const options = (config === null || config === void 0 ? void 0 : config.options) || [];
+        const options = config?.options || [];
         const option = findOptions(value, options);
         return option;
       }
     case 'multiselect':
       {
-        const options = (config === null || config === void 0 ? void 0 : config.options) || [];
+        const options = config?.options || [];
         const _val = typeof value === 'string' ? value.split(',').map(v => v.trim()) : value;
         const option = findOptions(_val, options);
         return option.join(', ');
@@ -9598,7 +9591,7 @@ const renderFieldData = function (type, value, user, config) {
         formValues: formValues
       });
     case 'percentage':
-      return value === '-' || value === null || value === undefined ? '-' : "".concat(value, " %");
+      return value === '-' || value === null || value === undefined ? '-' : `${value} %`;
     case 'geolocation':
       {
         const val = JSON.parse(value) || {};
@@ -9612,7 +9605,7 @@ const renderFieldData = function (type, value, user, config) {
     case 'upload':
     case 'videoUpload':
       {
-        const documentName = allValues === null || allValues === void 0 ? void 0 : allValues.map(item => item === null || item === void 0 ? void 0 : item.name).join(', ');
+        const documentName = allValues?.map(item => item?.name).join(', ');
         return documentName;
       }
     default:
@@ -11690,7 +11683,7 @@ Widget.propTypes = {
 };
 Widget.displayName = 'Widget';
 
-const _excluded$s = ["loading", "title", "image", "description", "imgAlt", "noDescriptionText", "isPdf"];
+const _excluded$t = ["loading", "title", "image", "description", "imgAlt", "noDescriptionText", "isPdf"];
 function ImageWidget(_ref) {
   let {
       loading = false,
@@ -11701,7 +11694,7 @@ function ImageWidget(_ref) {
       noDescriptionText,
       isPdf = false
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$s);
+    props = _objectWithoutProperties(_ref, _excluded$t);
   const expandable = isPdf ? false : props.expandable;
   return /*#__PURE__*/jsxRuntime.jsx(Widget, _objectSpread2(_objectSpread2({
     loading: loading,
@@ -11760,8 +11753,8 @@ function ImageWidget(_ref) {
 }
 ImageWidget.displayName = 'ImageWidget';
 
-var _templateObject$c;
-const _excluded$r = ["title", "loading", "data", "current", "defaultActiveTab", "widgetClassname", "className", "direction"];
+var _templateObject$d;
+const _excluded$s = ["title", "loading", "data", "current", "defaultActiveTab", "widgetClassname", "className", "direction"];
 function FlowWidget(_ref) {
   let {
       title,
@@ -11773,7 +11766,7 @@ function FlowWidget(_ref) {
       className,
       direction = "horizontal"
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$r);
+    rest = _objectWithoutProperties(_ref, _excluded$s);
   const [activeTab, setActiveTab] = React.useState();
   React.useEffect(() => {
     if (defaultActiveTab) {
@@ -11910,7 +11903,7 @@ function Icon(_ref2) {
     return icon(status);
   }
 }
-const Style$P = styled__default["default"].div(_templateObject$c || (_templateObject$c = _taggedTemplateLiteral(["\n\toverflow-x: auto;\n\toverflow-y: hidden;\n\n\t::-webkit-scrollbar {\n\t\tdisplay: none;\n\t}\n\n\tscrollbar-width: none;\n\n\t-ms-overflow-style: none;\n\n\t@media (max-width: 532px) {\n\t\toverflow-x: hidden;\n\t}\n\n\t:where(.ant-steps-horizontal):not(.ant-steps-label-vertical) {\n\t\t.ant-steps-item-content {\n\t\t\twidth: 100%;\n\n\t\t\t.ant-steps-item-description {\n\t\t\t\tmin-width: 205px;\n\t\t\t\twidth: 100%;\n\t\t\t}\n\t\t}\n\t}\n"])));
+const Style$P = styled__default["default"].div(_templateObject$d || (_templateObject$d = _taggedTemplateLiteral(["\n\toverflow-x: auto;\n\toverflow-y: hidden;\n\n\t::-webkit-scrollbar {\n\t\tdisplay: none;\n\t}\n\n\tscrollbar-width: none;\n\n\t-ms-overflow-style: none;\n\n\t@media (max-width: 532px) {\n\t\toverflow-x: hidden;\n\t}\n\n\t:where(.ant-steps-horizontal):not(.ant-steps-label-vertical) {\n\t\t.ant-steps-item-content {\n\t\t\twidth: 100%;\n\n\t\t\t.ant-steps-item-description {\n\t\t\t\tmin-width: 205px;\n\t\t\t\twidth: 100%;\n\t\t\t}\n\t\t}\n\t}\n"])));
 FlowWidget.propTypes = {
   title: PropTypes__default["default"].string,
   loading: PropTypes__default["default"].bool,
@@ -12325,12 +12318,8 @@ const Style$N = styled__default["default"].div`
 		border-left: none;
 		border-bottom: none;
 		
-		/* Add separator line for each item (except items in the last row) */
-		/* Items 1-4 (rows 1 and 2) get separator, items 5-6 (last row) don't */
-		&:nth-child(1),
-		&:nth-child(2),
-		&:nth-child(3),
-		&:nth-child(4) {
+		/* Add separator line for all items except the last two (last items in each column) */
+		&:not(:nth-last-child(-n+2)) {
 			&::after {
 				content: '';
 				position: absolute;
@@ -12452,7 +12441,7 @@ const NoMinWidth = styled__default["default"].div`
 	}
 `;
 
-var _templateObject$b;
+var _templateObject$c;
 function ActivityIndicatorsWidget(_ref) {
   let {
     t = s => s,
@@ -12538,12 +12527,18 @@ function Label$1(_ref2) {
  * @param {string} configItem.type - "empty" | "compliant" | "notCompliant"
  * @param {Function} configItem.onClick - Optional callback for empty type
  * @param {string} configItem.statusIcon - Optional custom icon name for status badge (overrides default)
+ * @param {string} configItem.statusIconColor - Optional custom color for status icon
+ * @param {string} configItem.statusBadgeBackgroundColor - Optional custom background color for status badge
+ * @param {string} configItem.statusBadgeBorderColor - Optional custom border color for status badge
  */
 function renderStatus$1(configItem) {
   const {
     type,
     onClick,
-    statusIcon
+    statusIcon,
+    statusIconColor,
+    statusBadgeBackgroundColor,
+    statusBadgeBorderColor
   } = configItem;
   switch (type) {
     case "empty":
@@ -12559,21 +12554,29 @@ function renderStatus$1(configItem) {
     case "compliant":
       return /*#__PURE__*/jsxRuntime.jsx(StatusBadge, {
         className: "status-badge compliant border",
+        style: {
+          backgroundColor: statusBadgeBackgroundColor || "#ECFDF3",
+          borderColor: statusBadgeBorderColor || "#A7F3D0"
+        },
         children: /*#__PURE__*/jsxRuntime.jsx(CustomIcon, {
           name: statusIcon || "Check",
           width: 14,
           height: 14,
-          color: "#12B76A"
+          color: statusIconColor || "#12B76A"
         })
       });
     case "notCompliant":
       return /*#__PURE__*/jsxRuntime.jsx(StatusBadge, {
         className: "status-badge not-compliant border",
+        style: {
+          backgroundColor: statusBadgeBackgroundColor || "#FEF3F2",
+          borderColor: statusBadgeBorderColor || "#FECACA"
+        },
         children: /*#__PURE__*/jsxRuntime.jsx(CustomIcon, {
           name: statusIcon || "Close",
           width: 14,
           height: 14,
-          color: "#D92D20"
+          color: statusIconColor || "#D92D20"
         })
       });
     default:
@@ -12587,7 +12590,7 @@ function renderStatus$1(configItem) {
       });
   }
 }
-const StatusBadge = styled__default["default"].div(_templateObject$b || (_templateObject$b = _taggedTemplateLiteral(["\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex-shrink: 0;\n\n\t&.compliant {\n\t\tbackground-color: #ECFDF3;\n\t\tborder: 1px solid #A7F3D0;\n\t}\n\n\t&.not-compliant {\n\t\tbackground-color: #FEF3F2;\n\t\tborder: 1px solid #FECACA;\n\t}\n\n\t&.empty {\n\t\tbackground-color: #F9FAFB;\n\t\tborder: 1px solid #E5E7EB;\n\t}\n"])));
+const StatusBadge = styled__default["default"].div(_templateObject$c || (_templateObject$c = _taggedTemplateLiteral(["\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex-shrink: 0;\n\n\t&.compliant {\n\t\tbackground-color: #ECFDF3;\n\t\tborder: 1px solid #A7F3D0;\n\t}\n\n\t&.not-compliant {\n\t\tbackground-color: #FEF3F2;\n\t\tborder: 1px solid #FECACA;\n\t}\n\n\t&.empty {\n\t\tbackground-color: #F9FAFB;\n\t\tborder: 1px solid #E5E7EB;\n\t}\n"])));
 ActivityIndicatorsWidget.displayName = "ActivityIndicatorsWidget";
 
 function TooltipIcon(_ref) {
@@ -15479,7 +15482,7 @@ Map$3.propTypes = {
   link: PropTypes__default["default"].any
 };
 
-const _excluded$q = ["isExpanded", "shouldRenderMap", "renderKey", "title", "loading", "t", "user", "data", "height", "widgetConfig"];
+const _excluded$r = ["isExpanded", "shouldRenderMap", "renderKey", "title", "loading", "t", "user", "data", "height", "widgetConfig"];
 function InExpandableWidgetMap(_ref) {
   let {
       isExpanded,
@@ -15493,7 +15496,7 @@ function InExpandableWidgetMap(_ref) {
       height,
       widgetConfig
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$q);
+    rest = _objectWithoutProperties(_ref, _excluded$r);
   const [mapKey, setMapKey] = React.useState(0);
   const [isMapReady, setIsMapReady] = React.useState(false);
   React.useEffect(() => {
@@ -17693,14 +17696,14 @@ const MapConfig = ({
   });
 };
 
-const _excluded$p = ["config", "title", "loading"];
+const _excluded$q = ["config", "title", "loading"];
 const Details = _ref => {
   let {
       config = [],
       title,
       loading = false
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$p);
+    rest = _objectWithoutProperties(_ref, _excluded$q);
   return /*#__PURE__*/jsxRuntime.jsx(Widget, _objectSpread2(_objectSpread2({
     className: "with-border-header h-w-btn-header card",
     loading: loading,
@@ -17716,14 +17719,14 @@ const Details = _ref => {
   }));
 };
 
-const _excluded$o = ["config", "title", "loading"];
+const _excluded$p = ["config", "title", "loading"];
 const KeyIndicatorsDetails = _ref => {
   let {
       config,
       title,
       loading = false
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$o);
+    rest = _objectWithoutProperties(_ref, _excluded$p);
   return /*#__PURE__*/jsxRuntime.jsx(Widget, _objectSpread2(_objectSpread2({
     className: "with-border-header h-w-btn-header",
     title: title,
@@ -17753,7 +17756,7 @@ const Style$G = styled__default["default"].div`
     }    
 `;
 
-const _excluded$n = ["children", "config", "detailsTitle", "firstColumnWidth"];
+const _excluded$o = ["children", "config", "detailsTitle", "firstColumnWidth"];
 const DetailsSection = _ref => {
   let {
       children,
@@ -17761,7 +17764,7 @@ const DetailsSection = _ref => {
       detailsTitle,
       firstColumnWidth = "250px"
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$n);
+    rest = _objectWithoutProperties(_ref, _excluded$o);
   return /*#__PURE__*/jsxRuntime.jsx(Style$G, {
     firstColumnWidth: firstColumnWidth,
     children: /*#__PURE__*/jsxRuntime.jsxs("div", {
@@ -17936,15 +17939,15 @@ const getGoalConfig = () => {
   }];
 };
 
-var _templateObject$a;
-const _excluded$m = ["title", "activeSdgGoals", "t"];
+var _templateObject$b;
+const _excluded$n = ["title", "activeSdgGoals", "t"];
 function SDGWidget(_ref) {
   let {
       title = "Sustainable Development Goals",
       activeSdgGoals = [],
       t = key => key
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$m);
+    props = _objectWithoutProperties(_ref, _excluded$n);
   const sdgConfig = getGoalConfig();
   return /*#__PURE__*/jsxRuntime.jsx(Widget, _objectSpread2(_objectSpread2({
     title: title,
@@ -17965,10 +17968,10 @@ function SDGWidget(_ref) {
     })
   }));
 }
-const SDGContainer = styled__default["default"].div(_templateObject$a || (_templateObject$a = _taggedTemplateLiteral(["\n\tdisplay: grid;\n\tgrid-template-columns: repeat(auto-fit, minmax(53px, 1fr));\n\tgap: 8px;\n\n\t.sdg-item {\n\t\theight: 53px;\n\t\twidth: 53px;\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 SDGContainer = styled__default["default"].div(_templateObject$b || (_templateObject$b = _taggedTemplateLiteral(["\n\tdisplay: grid;\n\tgrid-template-columns: repeat(auto-fit, minmax(53px, 1fr));\n\tgap: 8px;\n\n\t.sdg-item {\n\t\theight: 53px;\n\t\twidth: 53px;\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"])));
 
-var _templateObject$9;
-const Style$F = styled__default["default"].div(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteral(["\n\tposition: relative;\n\twidth: 100%;\n\theight: 100%;\n\n\t.p-placeholder {\n\t\tposition: absolute;\n\t\ttop: 0px;\n\t\tleft: 0px;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tbackground: transparent;\n\t\tz-index: 100;\n\t\tcursor: default;\n\t}\n"])));
+var _templateObject$a;
+const Style$F = styled__default["default"].div(_templateObject$a || (_templateObject$a = _taggedTemplateLiteral(["\n\tposition: relative;\n\twidth: 100%;\n\theight: 100%;\n\n\t.p-placeholder {\n\t\tposition: absolute;\n\t\ttop: 0px;\n\t\tleft: 0px;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tbackground: transparent;\n\t\tz-index: 100;\n\t\tcursor: default;\n\t}\n"])));
 
 /**
  * ComponentWithHoverFocus
@@ -18242,7 +18245,7 @@ function SdgList({
   });
 }
 
-const _excluded$l = ["title", "description", "onLinkClick", "image", "linkIcon", "sdgList", "items", "onCardClick", "hideSDGList", "t"];
+const _excluded$m = ["title", "description", "onLinkClick", "image", "linkIcon", "sdgList", "items", "onCardClick", "hideSDGList", "t"];
 const {
   Meta
 } = antd.Card;
@@ -18262,7 +18265,7 @@ function ProjectWidget(_ref) {
       hideSDGList = false,
       t = x => x
     } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded$l);
+    props = _objectWithoutProperties(_ref, _excluded$m);
   const [isHovered, setIsHovered] = React__default["default"].useState(false);
   const {
     token
@@ -18534,13 +18537,13 @@ const WidgetCard = _ref => {
   });
 };
 
-const _excluded$k = ["title", "children"];
+const _excluded$l = ["title", "children"];
 const CarouselWidget = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
       title,
       children
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$k);
+    rest = _objectWithoutProperties(_ref, _excluded$l);
   /**
    * Handles carousel slide change events
    * @param {number} currentSlide - The index of the current slide after change
@@ -18704,7 +18707,7 @@ const EmptyStateContainer = styled__default["default"].div`
   }
 `;
 
-const _excluded$j = ["title", "images", "height", "fallback", "activeDotColor", "inactiveDotColor", "arrowIconColor", "arrowHoverIconColor", "customArrows", "emptyLogo", "emptyText"];
+const _excluded$k = ["title", "images", "height", "fallback", "activeDotColor", "inactiveDotColor", "arrowIconColor", "arrowHoverIconColor", "customArrows", "emptyLogo", "emptyText"];
 function ImageCarousel(_ref) {
   let {
       title,
@@ -18719,7 +18722,7 @@ function ImageCarousel(_ref) {
       emptyLogo = antd.Empty.PRESENTED_IMAGE_SIMPLE,
       emptyText = "No Image"
     } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$j);
+    rest = _objectWithoutProperties(_ref, _excluded$k);
   const [previewVisible, setPreviewVisible] = React.useState(false);
   const [current, setCurrent] = React.useState(0);
   const carouselRef = React.useRef(null);
@@ -19017,6 +19020,167 @@ const StatCard = _ref => {
   }));
 };
 
+const VEGETATION_KEYS = {
+  HEALTHY: "healthy",
+  WHITE_SPOTS: "white",
+  BLACK_SPOTS: "black",
+  REDDISH_SPOTS: "reddish",
+  YELLOWING: "yellowing",
+  MOSAIC: "mosaic",
+  DRY_OR_DEAD: "dryOrDead",
+  NO_LEAVES: "noLeaves",
+  SPIDER_WEBS: "spiderWebs",
+  DAMAGE_FROM_INSECTS: "damageFromInsects"
+};
+
+// Mapping from growthObservations keys to VEGETATION_KEYS
+const GROWTH_OBSERVATIONS_TO_VEGETATION_KEYS = {
+  "white_spots": VEGETATION_KEYS.WHITE_SPOTS,
+  "healthy_leaves": VEGETATION_KEYS.HEALTHY,
+  "yellowing_leaves": VEGETATION_KEYS.YELLOWING,
+  "leaf_mosaic": VEGETATION_KEYS.MOSAIC,
+  "dry_dead_leaves": VEGETATION_KEYS.DRY_OR_DEAD,
+  "no_leaves": VEGETATION_KEYS.NO_LEAVES,
+  "black_spots": VEGETATION_KEYS.BLACK_SPOTS,
+  "reddish_spots": VEGETATION_KEYS.REDDISH_SPOTS,
+  "spider_webs": VEGETATION_KEYS.SPIDER_WEBS,
+  "insect_damage": VEGETATION_KEYS.DAMAGE_FROM_INSECTS
+};
+const getVegetationConfig = () => {
+  return [{
+    img: "/Vegetation/healthy.svg",
+    key: VEGETATION_KEYS.HEALTHY,
+    disabled: "/Vegetation/healthy-default.svg"
+  }, {
+    img: "/Vegetation/white.svg",
+    key: VEGETATION_KEYS.WHITE_SPOTS,
+    disabled: "/Vegetation/white-default.svg"
+  }, {
+    img: "/Vegetation/black.svg",
+    key: VEGETATION_KEYS.BLACK_SPOTS,
+    disabled: "/Vegetation/black-default.svg"
+  }, {
+    img: "/Vegetation/reddish.svg",
+    key: VEGETATION_KEYS.REDDISH_SPOTS,
+    disabled: "/Vegetation/reddish-default.svg"
+  }, {
+    img: "/Vegetation/yellowing.svg",
+    key: VEGETATION_KEYS.YELLOWING,
+    disabled: "/Vegetation/yellowing-default.svg"
+  }, {
+    img: "/Vegetation/mosaic.svg",
+    key: VEGETATION_KEYS.MOSAIC,
+    disabled: "/Vegetation/mosaic-default.svg"
+  }, {
+    img: "/Vegetation/dry-or-dead.svg",
+    key: VEGETATION_KEYS.DRY_OR_DEAD,
+    disabled: "/Vegetation/dry-or-dead-default.svg"
+  }, {
+    img: "/Vegetation/no-leaves.svg",
+    key: VEGETATION_KEYS.NO_LEAVES,
+    disabled: "/Vegetation/no-leaves-default.svg"
+  }, {
+    img: "/Vegetation/spider-webs.svg",
+    key: VEGETATION_KEYS.SPIDER_WEBS,
+    disabled: "/Vegetation/spider-webs-default.svg"
+  }, {
+    img: "/Vegetation/damage-from-insects.svg",
+    key: VEGETATION_KEYS.DAMAGE_FROM_INSECTS,
+    disabled: "/Vegetation/damage-from-insects-default.svg"
+  }];
+};
+
+var _templateObject$9, _templateObject2$1;
+const _excluded$j = ["title", "activeVegetationConditions", "filterKeys", "columnsPerRow", "itemWidth", "itemHeight", "growthObservations", "t"];
+function VegetationWidget(_ref) {
+  let {
+      title = "Vegetation Health",
+      activeVegetationConditions = [],
+      filterKeys = null,
+      columnsPerRow = null,
+      itemWidth = 140.33,
+      itemHeight = 140,
+      growthObservations = [],
+      t = key => key
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded$j);
+  let vegetationConfig = getVegetationConfig();
+
+  // Get all VEGETATION_KEYS values before filtering (needed for mapping check)
+  const allVegetationKeys = vegetationConfig.map(item => item.key);
+
+  // Filter to show only specific keys if filterKeys is provided
+  if (filterKeys && Array.isArray(filterKeys)) {
+    vegetationConfig = vegetationConfig.filter(item => filterKeys.includes(item.key));
+  }
+
+  // Map growthObservations to VEGETATION_KEYS
+  // Handle both formats: growthObservations keys (e.g., "yellowing_leaves") and VEGETATION_KEYS (e.g., "yellowing")
+  const mappedGrowthObservations = Array.isArray(growthObservations) ? growthObservations.map(obs => {
+    // First try to map from growthObservations format
+    const mapped = GROWTH_OBSERVATIONS_TO_VEGETATION_KEYS[obs];
+    if (mapped) {
+      return mapped;
+    }
+    // If not mapped, check if it's already a VEGETATION_KEY value
+    if (allVegetationKeys.includes(obs)) {
+      return obs;
+    }
+    // Debug: log unmapped observations
+    if (obs) {
+      console.warn("VegetationWidget: Unmapped growthObservation \"".concat(obs, "\""));
+    }
+    return null;
+  }).filter(Boolean) : [];
+  return /*#__PURE__*/jsxRuntime.jsx(Widget, _objectSpread2(_objectSpread2({
+    title: title,
+    className: "with-border-header"
+  }, props), {}, {
+    children: /*#__PURE__*/jsxRuntime.jsx(VegetationWrapper, {
+      $columnsPerRow: columnsPerRow,
+      children: /*#__PURE__*/jsxRuntime.jsx(VegetationContainer, {
+        $columnsPerRow: columnsPerRow,
+        $itemWidth: itemWidth,
+        $itemHeight: itemHeight,
+        children: vegetationConfig.map(item => {
+          // Use colored SVG if the item's key exists in growthObservations (mapped)
+          // Otherwise use default SVG
+          // Also check activeVegetationConditions for backward compatibility
+          const isInGrowthObservations = mappedGrowthObservations.includes(item.key);
+          const isInActiveConditions = activeVegetationConditions.includes(item.key);
+
+          // Use colored SVG if it exists in growthObservations OR activeVegetationConditions
+          const shouldUseColored = isInGrowthObservations || isInActiveConditions;
+
+          // Debug logging for yellowing specifically
+          if (item.key === "yellowing") {
+            console.log("Yellowing debug:", {
+              itemKey: item.key,
+              growthObservations,
+              mappedGrowthObservations,
+              isInGrowthObservations,
+              isInActiveConditions,
+              shouldUseColored,
+              img: item.img,
+              disabled: item.disabled
+            });
+          }
+          return /*#__PURE__*/jsxRuntime.jsx(antd.Tooltip, {
+            title: t("straatos::".concat(item.key)),
+            children: /*#__PURE__*/jsxRuntime.jsx("img", {
+              src: shouldUseColored ? item.img : item.disabled,
+              className: "vegetation-item",
+              alt: item.key
+            }, item.key)
+          }, item.key);
+        })
+      })
+    })
+  }));
+}
+const VegetationWrapper = styled__default["default"].div(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteral(["\n\t", "\n"])), props => props.$columnsPerRow ? "\n\t\toverflow-x: auto;\n\t\twidth: 100%;\n\t" : '');
+const VegetationContainer = styled__default["default"].div(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n\tdisplay: grid;\n\tgrid-template-columns: ", ";\n\tgap: 24px;\n\t", "\n\n\t.vegetation-item {\n\t\twidth: 100%;\n\t\taspect-ratio: ", ";\n\t\tborder-radius: 7px;\n\t\tflex-shrink: 0;\n\t\n\t\tbackground-size: cover;\n\t\tbackground-position: center;\n\t\tbackground-repeat: no-repeat;\n\t}\n\n\t.vegetation-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"])), props => props.$columnsPerRow ? "repeat(".concat(props.$columnsPerRow, ", 1fr)") : "repeat(auto-fit, minmax(".concat(props.$itemWidth, "px, 1fr))"), props => props.$columnsPerRow ? "\n\t\twidth: 100%;\n\t" : '', props => props.$itemWidth / props.$itemHeight);
+
 var Style$C = styled__default["default"].div`
   border: 1px solid var(--base-gray-40);
   padding: 12px;
@@ -25185,6 +25349,9 @@ class VersionService extends BaseService {
 var VersionService$1 = createLazyService(VersionService);
 
 const getSourcesType = subject => {
+  console.log({
+    subject
+  });
   const typeMapping = {
     locations: "location",
     location: "location",
@@ -25198,7 +25365,8 @@ const getSourcesType = subject => {
     events: "event",
     event: "event",
     activities: "event",
-    incidents: "event"
+    incidents: "event",
+    "planting-cycle": "planting-cycle"
   };
   return typeMapping[subject] ?? null;
 };
@@ -51038,7 +51206,7 @@ const BaseScreen = _ref => {
  */
 const renderNumber = (val, doubleDigit = false) => {
   if (typeof val !== 'number') {
-    return '--';
+    return '-';
   }
   const _string = Number(val).toLocaleString('en-us');
   if (doubleDigit) {
@@ -62687,6 +62855,7 @@ exports.TabsHeader = TabsHeader;
 exports.TooltipIcon = TooltipIcon;
 exports.TradeRelationship = index$1;
 exports.UserTable = UserTable;
+exports.VegetationHealth = VegetationWidget;
 exports.ViewForm = Content$1;
 exports.ViewFormInput = Input;
 exports.ViewFormNavigation = Navigation;