@databrainhq/plugin 0.8.11 → 0.8.13

package/dist/components/Charts/FunnelChart.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
-declare const FunnelChart: ({ funnelData, margins, legendSettings, labelSettings, colors, chartClickConfig, chartRef, handleChartRightClick, }: any) => JSX.Element;
+declare const FunnelChart: ({ funnelData, margins, legendSettings, labelSettings, colors, chartClickConfig, chartRef, handleChartRightClick, customSettings, }: any) => JSX.Element;
 export default FunnelChart;

package/dist/index.es.js

@@ -7464,6 +7464,7 @@ const useExternalMetric = ({
             createdBy: clientId || "external user",
             clientId,
             isCreatedByClient: !!clientId,
+            resizeAttributes: metric == null ? void 0 : metric.resizeAttributes,
             externalDashboardMetrics: {
               data: dashboardIds.map((externalDashboardId) => ({
                 externalDashboardId
@@ -80503,12 +80504,13 @@ const FunnelChart = ({
   colors: colors2,
   chartClickConfig,
   chartRef,
-  handleChartRightClick
+  handleChartRightClick,
+  customSettings
 }) => {
   const option2 = {
     tooltip: {
       trigger: "item",
-      formatter: "{b} : {c}k",
+      formatter: "{b} : {c}",
       backgroundColor: "black",
       textStyle: {
         color: "white"
@@ -80549,7 +80551,8 @@ const FunnelChart = ({
       gap: 3,
       label: {
         show: labelSettings.show,
-        position: labelSettings.position
+        position: labelSettings.position,
+        formatter: customSettings.showLabelValues ? "{b} : {c}" : "{b}"
       },
       labelLine: {
         length: 10,
@@ -86146,7 +86149,8 @@ const MetricChart = ({
       colors: colors2,
       chartClickConfig,
       chartRef,
-      handleChartRightClick
+      handleChartRightClick,
+      customSettings
     });
   }
   if (chartType2 === CHART_TYPES.gauge) {
@@ -86273,7 +86277,7 @@ const menuContainer$1 = "_menuContainer_1ecv1_13";
 const buttonText = "_buttonText_1ecv1_19";
 const buttonIcon = "_buttonIcon_1ecv1_25";
 const filterName = "_filterName_1ecv1_31";
-const filterDropdown$1 = "_filterDropdown_1ecv1_37";
+const filterDropdown$2 = "_filterDropdown_1ecv1_37";
 var styles$n = {
   button: button$5,
   menu: menu$3,
@@ -86281,7 +86285,7 @@ var styles$n = {
   buttonText,
   buttonIcon,
   filterName,
-  filterDropdown: filterDropdown$1
+  filterDropdown: filterDropdown$2
 };
 const container$a = "_container_1qflp_1";
 const popover$1 = "_popover_1qflp_9";
@@ -86387,8 +86391,8 @@ const FilterField = ({
   tableName
 }) => {
   const [operator, setOperator] = useState({
-    value: "",
-    label: ""
+    value: "=",
+    label: "Equal to (=)"
   });
   const [option2, setOption] = useState({
     value: "",
@@ -86493,20 +86497,21 @@ const FilterField = ({
     })
   });
 };
-const container$9 = "_container_9vrf0_1";
-const form$1 = "_form_9vrf0_7";
-const filterHeader = "_filterHeader_9vrf0_13";
-const titleContent = "_titleContent_9vrf0_19";
-const title = "_title_9vrf0_19";
-const buttons = "_buttons_9vrf0_31";
-const apply = "_apply_9vrf0_37";
-const applyIcon = "_applyIcon_9vrf0_43";
-const reset = "_reset_9vrf0_49";
-const filterFields = "_filterFields_9vrf0_55";
-const filters = "_filters_9vrf0_61";
-const filterItem = "_filterItem_9vrf0_67";
-const filterItemOperator = "_filterItemOperator_9vrf0_73";
-const remove = "_remove_9vrf0_79";
+const container$9 = "_container_1cs1m_1";
+const form$1 = "_form_1cs1m_7";
+const filterHeader = "_filterHeader_1cs1m_13";
+const titleContent = "_titleContent_1cs1m_19";
+const title = "_title_1cs1m_19";
+const buttons = "_buttons_1cs1m_31";
+const apply = "_apply_1cs1m_37";
+const applyIcon = "_applyIcon_1cs1m_43";
+const reset = "_reset_1cs1m_49";
+const filterFields = "_filterFields_1cs1m_55";
+const filterDropdown$1 = "_filterDropdown_1cs1m_61";
+const filters = "_filters_1cs1m_67";
+const filterItem = "_filterItem_1cs1m_73";
+const filterItemOperator = "_filterItemOperator_1cs1m_79";
+const remove = "_remove_1cs1m_85";
 var styles$l = {
   container: container$9,
   form: form$1,
@@ -86518,6 +86523,7 @@ var styles$l = {
   applyIcon,
   reset,
   filterFields,
+  filterDropdown: filterDropdown$1,
   filters,
   filterItem,
   filterItemOperator,
@@ -86578,6 +86584,14 @@ const GlobalFilters = ({
       filters: filterColumns
     });
   };
+  const getSelectedOption = useCallback((col) => {
+    var _a2;
+    const colValue = ((_a2 = appliedfilters.find((filter2) => filter2.column === col)) == null ? void 0 : _a2.value) || "";
+    return {
+      label: colValue,
+      value: colValue
+    };
+  }, [appliedfilters]);
   return /* @__PURE__ */ jsx(Fragment, {
     children: /* @__PURE__ */ jsxs("div", {
       className: styles$l.container,
@@ -86617,20 +86631,33 @@ const GlobalFilters = ({
           })]
         }), /* @__PURE__ */ jsx("div", {
           className: styles$l.filterFields,
-          children: filters2[0].columns.map((col) => /* @__PURE__ */ jsx(FilterField, {
-            tableName: filters2[0].tableName,
-            filter: col,
-            isResetted: !appliedfilters.find((a2) => a2.column === col.name),
-            onChange: (field2) => setAppliedFilters((prev) => {
-              const index2 = prev.findIndex((f2) => f2.column === field2.column);
-              if (index2 === -1)
-                return [...prev, field2];
-              const updated = [...prev];
-              updated[index2] = field2;
-              return updated;
-            }),
-            companyId
-          }, col.name))
+          children: filters2[0].columns.map((col) => /* @__PURE__ */ jsx("div", {
+            className: styles$l.filterDropdown,
+            children: /* @__PURE__ */ jsx(FilterDropDown, {
+              filter: {
+                tableName: filters2[0].tableName,
+                columnName: col.name
+              },
+              companyId,
+              selectedOption: getSelectedOption(col.name),
+              autoSelected: false,
+              onChange: (option2) => setAppliedFilters((prev) => {
+                const field2 = {
+                  column: col.name,
+                  operator: "=",
+                  value: option2.value
+                };
+                const index2 = prev.findIndex((f2) => f2.column === col.name);
+                if (index2 === -1)
+                  return [...prev, field2];
+                const updated = [...prev];
+                updated[index2] = field2;
+                return updated;
+              }),
+              labelDesign: "client",
+              isSearchEnabled: true
+            })
+          }))
         })]
       }), appliedfilters.length ? /* @__PURE__ */ jsx("ul", {
         className: styles$l.filters,
@@ -87271,6 +87298,14 @@ const ChartConfigure = ({
                   }))
                 })
               })]
+            }), chartType2 === "funnel" && /* @__PURE__ */ jsx(InputField, {
+              type: "checkbox",
+              label: "Show labels with values",
+              checked: customSettings.showLabelValues,
+              onChange: (e2) => setCustomSettings((settings2) => ({
+                ...settings2,
+                showLabelValues: e2.target.checked
+              }))
             }), chartType2 !== "pie" && chartType2 !== "doughnut" && chartType2 !== "funnel" && chartType2 !== "gauge" && chartType2 !== "sankey" && chartType2 !== "singleValue" && chartType2 !== "table" && /* @__PURE__ */ jsxs(Fragment, {
               children: [/* @__PURE__ */ jsxs("div", {
                 className: styles$g.seriesWrapper,
@@ -89757,7 +89792,8 @@ const EmbeddedMetricCreation = ({
     subHeaderFontSize: 0,
     dateFormatter: "none",
     numberFormatter: "original",
-    xRotation: 50
+    xRotation: 50,
+    showLabelValues: false
   });
   const [tableSettings, setTableSettings] = useState({
     contentAlignment: "center",
@@ -96042,7 +96078,8 @@ const MetricCard = ({
     subHeaderFontSize: 0,
     dateFormatter: "none",
     numberFormatter: "original",
-    xRotation: 50
+    xRotation: 50,
+    showLabelValues: false
   });
   const [backGroundColor, setBackGroundColor] = useState({
     show: false
@@ -96077,7 +96114,8 @@ const MetricCard = ({
       subHeaderFontSize: 0,
       dateFormatter: "none",
       numberFormatter: "original",
-      xRotation: 50
+      xRotation: 50,
+      showLabelValues: false
     });
     setEnableGroupBy(metricItem == null ? void 0 : metricItem.isEnableGroupBy);
     setSelectedGroupBy(metricItem == null ? void 0 : metricItem.selectedGroupBy);
@@ -96538,7 +96576,8 @@ const SingleValueCard = ({
     subHeaderFontSize: 0,
     dateFormatter: "none",
     numberFormatter: "original",
-    xRotation: 50
+    xRotation: 50,
+    showLabelValues: false
   });
   const {
     data: metricdata,
@@ -96573,7 +96612,8 @@ const SingleValueCard = ({
       subHeaderFontSize: 0,
       dateFormatter: "none",
       numberFormatter: "original",
-      xRotation: 50
+      xRotation: 50,
+      showLabelValues: false
     });
     setClickBehaviourConfigs(metricItem.clickActions || {
       card: {