datastake-daf 0.6.122 → 0.6.123

package/dist/components/index.js

@@ -20066,202 +20066,6 @@ const DetailsSection = _ref => {
   });
 };
 
-const SDG_CONFIG = {
-  1: {
-    name: "No Poverty",
-    color: "#E5243B",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-01.jpg"
-  },
-  2: {
-    name: "Zero Hunger",
-    color: "#DDA63A",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-02.jpg"
-  },
-  3: {
-    name: "Good Health and Well-being",
-    color: "#4C9F38",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-03.jpg"
-  },
-  4: {
-    name: "Quality Education",
-    color: "#C5192D",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-04.jpg"
-  },
-  6: {
-    name: "Clean Water and Sanitation",
-    color: "#26BDE2",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-06.jpg"
-  },
-  8: {
-    name: "Decent Work and Economic Growth",
-    color: "#A21942",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-08.jpg"
-  },
-  13: {
-    name: "Climate Action",
-    color: "#48773E",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-13.jpg"
-  },
-  15: {
-    name: "Life on Land",
-    color: "#3EB049",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-15.jpg"
-  }
-};
-
-// Default SDGs to show (matching the image)
-const DEFAULT_SDGS = [1, 2, 3, 4, 6, 8, 13, 15];
-
-// Individual Project Card Component
-const ProjectCard = _ref => {
-  let {
-    title,
-    image,
-    imgAlt,
-    country,
-    countryFlag,
-    sectoralScope,
-    methodology,
-    sdgs = []
-  } = _ref;
-  return /*#__PURE__*/jsxRuntime.jsxs(antd.Card, {
-    style: {
-      minWidth: 280,
-      width: "100%",
-      borderRadius: "12px",
-      overflow: "hidden",
-      border: "1px solid #e5e7eb",
-      boxShadow: "0 1px 3px rgba(0,0,0,0.08)"
-    },
-    cover: /*#__PURE__*/jsxRuntime.jsx("div", {
-      className: "relative w-full h-40 overflow-hidden",
-      children: image ? /*#__PURE__*/jsxRuntime.jsx("img", {
-        alt: imgAlt || "".concat(title, " image"),
-        src: image,
-        style: {
-          width: "100%",
-          height: "100%",
-          objectFit: "cover"
-        }
-      }) : /*#__PURE__*/jsxRuntime.jsx("div", {
-        className: "w-full h-full flex items-center justify-center bg-gray-100",
-        children: /*#__PURE__*/jsxRuntime.jsx(antd.Empty, {
-          image: antd.Empty.PRESENTED_IMAGE_SIMPLE
-        })
-      })
-    }),
-    bodyStyle: {
-      padding: "16px"
-    },
-    children: [title && /*#__PURE__*/jsxRuntime.jsx("h3", {
-      className: "text-md font-semibold text-gray-900 mb-3",
-      children: title
-    }), country && /*#__PURE__*/jsxRuntime.jsxs("div", {
-      className: "flex items-center justify-between py-2 border-b border-gray-200",
-      children: [/*#__PURE__*/jsxRuntime.jsx("span", {
-        className: "text-sm text-gray-600",
-        children: "Country"
-      }), /*#__PURE__*/jsxRuntime.jsxs("div", {
-        className: "flex items-center gap-1",
-        children: [countryFlag && /*#__PURE__*/jsxRuntime.jsx("img", {
-          src: countryFlag,
-          alt: "".concat(country, " flag"),
-          style: {
-            width: "16px",
-            height: "12px"
-          }
-        }), /*#__PURE__*/jsxRuntime.jsx("span", {
-          className: "text-sm font-medium text-gray-900",
-          children: country
-        })]
-      })]
-    }), sectoralScope && /*#__PURE__*/jsxRuntime.jsxs("div", {
-      className: "flex items-center justify-between py-2 border-b border-gray-200",
-      children: [/*#__PURE__*/jsxRuntime.jsx("span", {
-        className: "text-sm text-gray-600",
-        children: "Sectoral Scope"
-      }), /*#__PURE__*/jsxRuntime.jsx("span", {
-        className: "text-sm font-medium text-gray-900",
-        children: sectoralScope
-      })]
-    }), methodology && /*#__PURE__*/jsxRuntime.jsxs("div", {
-      className: "flex items-center justify-between py-2 border-b border-gray-200",
-      children: [/*#__PURE__*/jsxRuntime.jsx("span", {
-        className: "text-sm text-gray-600",
-        children: "Methodology"
-      }), /*#__PURE__*/jsxRuntime.jsx("span", {
-        className: "text-sm font-medium text-gray-900",
-        children: methodology
-      })]
-    }), /*#__PURE__*/jsxRuntime.jsxs("div", {
-      className: "pt-2",
-      children: [/*#__PURE__*/jsxRuntime.jsx("span", {
-        className: "text-sm text-gray-600",
-        children: "SDGs"
-      }), /*#__PURE__*/jsxRuntime.jsx("div", {
-        className: "flex flex-wrap gap-1 mt-2",
-        children: (sdgs.length > 0 ? sdgs : DEFAULT_SDGS).map((sdg, index) => {
-          const sdgConfig = typeof sdg === "number" ? SDG_CONFIG[sdg] : sdg;
-          return /*#__PURE__*/jsxRuntime.jsx("img", {
-            src: sdgConfig === null || sdgConfig === void 0 ? void 0 : sdgConfig.icon,
-            alt: sdgConfig === null || sdgConfig === void 0 ? void 0 : sdgConfig.name,
-            style: {
-              width: "22px",
-              height: "22px",
-              objectFit: "cover"
-            }
-          }, index);
-        })
-      })]
-    })]
-  });
-};
-
-// Main Widget Catalogue Component
-function WidgetCatalogue(_ref2) {
-  let {
-    title = "Project Catalogue",
-    projects = [],
-    loading = false,
-    className = ""
-  } = _ref2;
-  if (loading) {
-    return /*#__PURE__*/jsxRuntime.jsx(Widget, {
-      title: title,
-      className: "with-border-header",
-      children: /*#__PURE__*/jsxRuntime.jsx("div", {
-        className: "flex justify-center items-center h-64",
-        children: /*#__PURE__*/jsxRuntime.jsx(antd.Spin, {
-          size: "large"
-        })
-      })
-    });
-  }
-  return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
-    children: /*#__PURE__*/jsxRuntime.jsx(Widget, {
-      title: title,
-      className: "with-border-header",
-      children: /*#__PURE__*/jsxRuntime.jsx("div", {
-        style: {
-          display: "flex",
-          gap: "16px",
-          justifyContent: "space-between"
-        },
-        children: projects.slice(0, 3).map((project, idx) => /*#__PURE__*/jsxRuntime.jsx("div", {
-          style: {
-            flex: "1 1 0",
-            // make each card take equal width
-            maxWidth: "calc(33.333% - 16px)"
-          },
-          children: /*#__PURE__*/jsxRuntime.jsx(ProjectCard, {
-            project: project
-          })
-        }, idx))
-      })
-    })
-  });
-}
-
 var Style$w = dt.div`
   border: 1px solid var(--base-gray-40);
   padding: 12px;
@@ -59640,7 +59444,6 @@ exports.ViewForm = Content;
 exports.ViewFormInput = Input;
 exports.ViewFormNavigation = Navigation;
 exports.Widget = Widget;
-exports.WidgetCatalogue = WidgetCatalogue;
 exports.WidgetImage = ImageWidget;
 exports.WidgetLoader = Loader;
 exports.WidgetPlaceholder = WidgetPlaceholder;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "datastake-daf",
-	"version": "0.6.122",
+	"version": "0.6.123",
 	"dependencies": {
 		"@ant-design/icons": "^5.2.5",
 		"@antv/g2": "^5.1.1",

package/src/@daf/core/components/Dashboard/Widget/_style.scss

@@ -6,42 +6,6 @@
   position: relative;
   flex-direction: column;
 
-  // Widget Catalogue specific styles
-  &.widget-catalogue {
-    padding: var(--size-lg);
-    
-    @media (max-width: 850px) {
-      padding: var(--size);
-    }
-
-    .grid {
-      display: grid;
-      gap: 1.5rem;
-      
-      @media (min-width: 768px) {
-        grid-template-columns: repeat(2, 1fr);
-      }
-      
-      @media (min-width: 1024px) {
-        grid-template-columns: repeat(3, 1fr);
-      }
-      
-      @media (min-width: 1280px) {
-        grid-template-columns: repeat(4, 1fr);
-      }
-    }
-
-    .ant-card {
-      transition: all 0.2s ease-in-out;
-      border: 1px solid #e5e7eb;
-      
-      &:hover {
-        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-        transform: translateY(-2px);
-      }
-    }
-  }
-
   .month-select {
     min-width: 165px;
     max-width: 165px;

package/src/index.js

@@ -69,7 +69,6 @@ export { default as DafDashboardDetails } from "./@daf/core/components/Dashboard
 export { default as KeyIndicatorsDetails } from "./@daf/core/components/Dashboard/Widget/Details/KeyIndicatorsDetails.jsx";
 export { default as DetailsSection } from "./@daf/core/components/Dashboard/Widget/DetailsSection/index.jsx";
 export { default as ComponentWithFocus } from "./@daf/core/components/Dashboard/ComponentWithFocus/index.jsx";
-export { default as WidgetCatalogue } from "./@daf/core/components/Dashboard/Widget/WidgetCatalogue/index.jsx";
 
 // Forms
 export { default as ViewForm } from "./@daf/core/components/ViewForm/content.jsx";

package/src/@daf/core/components/Dashboard/Widget/WidgetCatalogue/WidgetCatalogue.stories.jsx

@@ -1,109 +0,0 @@
-import React from "react";
-import WidgetCatalogue from "./index.jsx";
-
-// Sample projects data matching the image exactly
-const sampleProjects = [
-  {
-    title: "ABC Mangrove Senegal",
-    image:
-      "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=400&h=200&fit=crop",
-    country: "Senegal",
-    countryFlag: "https://flagcdn.com/w40/sn.png",
-    sectoralScope: "AFOLU",
-    methodology: "VM0033",
-    imgAlt: "Mangrove landscape with calm water reflecting green trees",
-  },
-  {
-    title: "IFM Jujuy",
-    image:
-      "https://images.unsplash.com/photo-1559827260-dc66d52bef19?w=400&h=200&fit=crop",
-    country: "Argentina",
-    countryFlag: "https://flagcdn.com/w40/ar.png",
-    sectoralScope: "AFOLU",
-    methodology: "VM0033",
-    imgAlt: "White-faced whistling ducks in shallow water with green grass",
-  },
-  {
-    title: "Sur del Meta",
-    image:
-      "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=400&h=200&fit=crop",
-    country: "Colombia",
-    countryFlag: "https://flagcdn.com/w40/co.png",
-    sectoralScope: "AFOLU",
-    methodology: "VM0033",
-    imgAlt: "Aerial view of braided river channels through green landscape",
-  },
-];
-
-export default {
-  title: "Dashboard/Widgets/WidgetCatalogue",
-  component: WidgetCatalogue,
-  parameters: {
-    layout: "padded",
-    docs: {
-      description: {
-        component:
-          "A widget component that displays multiple project cards in a responsive grid layout, mapping over an array of project data. Each card shows project details including image, title, country, sectoral scope, methodology, and SDGs.",
-      },
-    },
-  },
-  argTypes: {
-    title: {
-      control: "text",
-      description: "Widget title displayed at the top",
-    },
-    projects: {
-      control: "object",
-      description: "Array of project objects to display",
-    },
-    loading: {
-      control: "boolean",
-      description: "Loading state - shows spinner when true",
-    },
-    className: {
-      control: "text",
-      description: "Additional CSS classes for styling",
-    },
-  },
-};
-
-// Template for the story
-const Template = (args) => (
-  <div
-    style={{ padding: "20px", backgroundColor: "#f5f5f5", minHeight: "100vh" }}
-  >
-    <WidgetCatalogue {...args} />
-  </div>
-);
-
-// Populated state - matches the image exactly
-export const Populated = Template.bind({});
-Populated.args = {
-  title: "Project Catalogue",
-  projects: sampleProjects,
-  loading: false,
-};
-Populated.parameters = {
-  docs: {
-    description: {
-      story:
-        "Widget with multiple project cards, matching the design from the reference image. Shows three projects with images, country flags, and SDG icons.",
-    },
-  },
-};
-
-// Single project
-export const SingleProject = Template.bind({});
-SingleProject.args = {
-  title: "Featured Project",
-  projects: [sampleProjects[0]],
-  loading: false,
-};
-SingleProject.parameters = {
-  docs: {
-    description: {
-      story:
-        "Widget with a single project card - shows how the grid adapts to fewer items.",
-    },
-  },
-};

package/src/@daf/core/components/Dashboard/Widget/WidgetCatalogue/index.jsx

@@ -1,197 +0,0 @@
-import React from "react";
-import { Image, Empty, Spin } from "antd";
-import { ExpandOutlined } from "@ant-design/icons";
-import { Card } from "antd";
-import Widget from "../index.jsx";
-
-// SDG configuration with proper colors and icons
-const SDG_CONFIG = {
-  1: {
-    name: "No Poverty",
-    color: "#E5243B",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-01.jpg",
-  },
-  2: {
-    name: "Zero Hunger",
-    color: "#DDA63A",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-02.jpg",
-  },
-  3: {
-    name: "Good Health and Well-being",
-    color: "#4C9F38",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-03.jpg",
-  },
-  4: {
-    name: "Quality Education",
-    color: "#C5192D",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-04.jpg",
-  },
-  6: {
-    name: "Clean Water and Sanitation",
-    color: "#26BDE2",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-06.jpg",
-  },
-  8: {
-    name: "Decent Work and Economic Growth",
-    color: "#A21942",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-08.jpg",
-  },
-  13: {
-    name: "Climate Action",
-    color: "#48773E",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-13.jpg",
-  },
-  15: {
-    name: "Life on Land",
-    color: "#3EB049",
-    icon: "https://sdgs.un.org/sites/default/files/goals/E_SDG_Icons-15.jpg",
-  },
-};
-
-// Default SDGs to show (matching the image)
-const DEFAULT_SDGS = [1, 2, 3, 4, 6, 8, 13, 15];
-
-// Individual Project Card Component
-const ProjectCard = ({
-  title,
-  image,
-  imgAlt,
-  country,
-  countryFlag,
-  sectoralScope,
-  methodology,
-  sdgs = [],
-}) => {
-  return (
-    <Card
-      style={{
-        minWidth: 280,
-        width: "100%",
-        borderRadius: "12px",
-        overflow: "hidden",
-        border: "1px solid #e5e7eb",
-        boxShadow: "0 1px 3px rgba(0,0,0,0.08)",
-      }}
-      cover={
-        <div className="relative w-full h-40 overflow-hidden">
-          {image ? (
-            <img
-              alt={imgAlt || `${title} image`}
-              src={image}
-              style={{ width: "100%", height: "100%", objectFit: "cover" }}
-            />
-          ) : (
-            <div className="w-full h-full flex items-center justify-center bg-gray-100">
-              <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
-            </div>
-          )}
-        </div>
-      }
-      bodyStyle={{ padding: "16px" }}
-    >
-      {/* Title */}
-      {title && (
-        <h3 className="text-md font-semibold text-gray-900 mb-3">{title}</h3>
-      )}
-
-      {/* Country */}
-      {country && (
-        <div className="flex items-center justify-between py-2 border-b border-gray-200">
-          <span className="text-sm text-gray-600">Country</span>
-          <div className="flex items-center gap-1">
-            {countryFlag && (
-              <img
-                src={countryFlag}
-                alt={`${country} flag`}
-                style={{ width: "16px", height: "12px" }}
-              />
-            )}
-            <span className="text-sm font-medium text-gray-900">{country}</span>
-          </div>
-        </div>
-      )}
-
-      {/* Sectoral Scope */}
-      {sectoralScope && (
-        <div className="flex items-center justify-between py-2 border-b border-gray-200">
-          <span className="text-sm text-gray-600">Sectoral Scope</span>
-          <span className="text-sm font-medium text-gray-900">
-            {sectoralScope}
-          </span>
-        </div>
-      )}
-
-      {/* Methodology */}
-      {methodology && (
-        <div className="flex items-center justify-between py-2 border-b border-gray-200">
-          <span className="text-sm text-gray-600">Methodology</span>
-          <span className="text-sm font-medium text-gray-900">
-            {methodology}
-          </span>
-        </div>
-      )}
-
-      {/* SDGs */}
-      <div className="pt-2">
-        <span className="text-sm text-gray-600">SDGs</span>
-        <div className="flex flex-wrap gap-1 mt-2">
-          {(sdgs.length > 0 ? sdgs : DEFAULT_SDGS).map((sdg, index) => {
-            const sdgConfig = typeof sdg === "number" ? SDG_CONFIG[sdg] : sdg;
-            return (
-              <img
-                key={index}
-                src={sdgConfig?.icon}
-                alt={sdgConfig?.name}
-                style={{ width: "22px", height: "22px", objectFit: "cover" }}
-              />
-            );
-          })}
-        </div>
-      </div>
-    </Card>
-  );
-};
-
-// Main Widget Catalogue Component
-export default function WidgetCatalogue({
-  title = "Project Catalogue",
-  projects = [],
-  loading = false,
-  className = "",
-}) {
-  if (loading) {
-    return (
-      <Widget title={title} className="with-border-header">
-        <div className="flex justify-center items-center h-64">
-          <Spin size="large" />
-        </div>
-      </Widget>
-    );
-  }
-
-  return (
-    <>
-      <Widget title={title} className="with-border-header">
-        <div
-          style={{
-            display: "flex",
-            gap: "16px",
-            justifyContent: "space-between",
-          }}
-        >
-          {projects.slice(0, 3).map((project, idx) => (
-            <div
-              key={idx}
-              style={{
-                flex: "1 1 0", // make each card take equal width
-                maxWidth: "calc(33.333% - 16px)",
-              }}
-            >
-              <ProjectCard project={project} />
-            </div>
-          ))}
-        </div>
-      </Widget>
-    </>
-  );
-}