cecomponent 1.0.177 → 1.0.179

package/dist/ce-component-lib.mjs

@@ -1903,7 +1903,10 @@ const Breadcrumbs = ({ items: e, maxVisible: t = 4, onItemClick: n }) => {
               "aria-describedby": L ? `${e}-error` : void 0
             }
           ),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "floating-label", children: e }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: "floating-label", children: [
+            e,
+            p && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "required-asterisk", children: "*" })
+          ] }),
           S && g.length > 0 && createPortal(
             /* @__PURE__ */ jsxRuntimeExports.jsx(
               "ul",
@@ -42648,66 +42651,71 @@ const CESkeletonTable = ({ columns: e, rows: t }) => /* @__PURE__ */ jsxRuntimeE
   allowClear: f = !0,
   showInputPills: p = !0,
   id: d,
-  name: m
+  name: m,
+  required: g = !1
 }) => {
-  const [g, _] = useState(!1), [S, E] = useState(!1), b = useRef(null), A = { ...getSizeStyle$1(l), ...u }, R = (j) => {
+  const [_, S] = useState(!1), [E, b] = useState(!1), T = useRef(null), R = { ...getSizeStyle$1(l), ...u }, C = (M) => {
     if (i) {
-      const M = t.includes(j) ? t.filter((N) => N !== j) : [...t, j];
-      n(M);
+      const N = t.includes(M) ? t.filter((D) => D !== M) : [...t, M];
+      n(N);
     } else
-      n([j]), _(!1);
-  }, C = () => n([]), I = e.filter((j) => t.includes(j.value)).map((j) => j.label);
+      n([M]), S(!1);
+  }, I = () => n([]), O = e.filter((M) => t.includes(M.value)).map((M) => M.label);
   useEffect(() => {
-    const j = (M) => {
-      var N;
-      (N = b.current) != null && N.contains(M.target) || _(!1);
+    const M = (N) => {
+      var D;
+      (D = T.current) != null && D.contains(N.target) || S(!1);
     };
-    return document.addEventListener("mousedown", j), () => document.removeEventListener("mousedown", j);
+    return document.addEventListener("mousedown", M), () => document.removeEventListener("mousedown", M);
   }, []);
-  const O = (j) => {
-    const M = t.filter((N) => N !== j);
-    n(M);
+  const j = (M) => {
+    const N = t.filter((D) => D !== M);
+    n(N);
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
     "div",
     {
-      className: `dropdown-container ${g || t.length > 0 ? "float" : ""}`,
-      ref: b,
-      style: A,
+      className: `dropdown-container ${_ || t.length > 0 ? "float" : ""}`,
+      ref: T,
+      style: R,
       id: d,
       "data-name": m,
+      "aria-required": g,
       children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
         "div",
         {
-          className: `dropdown-input ${g ? "open" : ""}`,
-          onClick: () => _((j) => !j),
-          onFocus: () => E(!0),
-          onBlur: () => E(!1),
+          className: `dropdown-input ${_ ? "open" : ""}`,
+          onClick: () => S((M) => !M),
+          onFocus: () => b(!0),
+          onBlur: () => b(!1),
           tabIndex: 0,
           children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "floating-placeholder", children: o }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "selected-display", children: t.length === 0 ? "" : i ? p ? I.map((j, M) => /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "chip", children: [
-              j,
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: "floating-placeholder", children: [
+              o,
+              g && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "required-asterisk", "aria-hidden": "true", children: "*" })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "selected-display", children: t.length === 0 ? "" : i ? p ? O.map((M, N) => /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "chip", children: [
+              M,
               /* @__PURE__ */ jsxRuntimeExports.jsx(
                 "span",
                 {
                   className: "close-icon",
-                  onClick: (N) => {
-                    var D;
-                    N.stopPropagation(), O(
-                      ((D = e.find((F) => F.label === j)) == null ? void 0 : D.value) || ""
+                  onClick: (D) => {
+                    var F;
+                    D.stopPropagation(), j(
+                      ((F = e.find((q) => q.label === M)) == null ? void 0 : F.value) || ""
                     );
                   },
                   children: "×"
                 }
               )
-            ] }, M)) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "selected-display-label", children: I.join(",") }) : /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: I[0] }) }),
+            ] }, N)) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "selected-display-label", children: O.join(",") }) : /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: O[0] }) }),
             f && t.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(
               "button",
               {
                 className: "clear-button",
-                onClick: (j) => {
-                  j.stopPropagation(), C();
+                onClick: (M) => {
+                  M.stopPropagation(), I();
                 },
                 children: "×"
               }
@@ -42720,7 +42728,7 @@ const CESkeletonTable = ({ columns: e, rows: t }) => /* @__PURE__ */ jsxRuntimeE
                 viewBox: "0 0 24 25",
                 fill: "none",
                 xmlns: "http://www.w3.org/2000/svg",
-                className: `dropdown-icon-img ${g ? "rotate-icon" : ""}`,
+                className: `dropdown-icon-img ${_ ? "rotate-icon" : ""}`,
                 children: /* @__PURE__ */ jsxRuntimeExports.jsx(
                   "path",
                   {
@@ -42731,12 +42739,12 @@ const CESkeletonTable = ({ columns: e, rows: t }) => /* @__PURE__ */ jsxRuntimeE
                 )
               }
             ) }),
-            g && /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: "dropdown-options", children: e.map((j) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            _ && /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: "dropdown-options", children: e.map((M) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
               "li",
               {
-                className: `dropdown-option ${t.includes(j.value) ? "selected" : ""}`,
-                onClick: (M) => {
-                  M.stopPropagation(), R(j.value);
+                className: `dropdown-option ${t.includes(M.value) ? "selected" : ""}`,
+                onClick: (N) => {
+                  N.stopPropagation(), C(M.value);
                 },
                 children: [
                   i && /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -42744,13 +42752,13 @@ const CESkeletonTable = ({ columns: e, rows: t }) => /* @__PURE__ */ jsxRuntimeE
                     {
                       type: "checkbox",
                       readOnly: !0,
-                      checked: t.includes(j.value)
+                      checked: t.includes(M.value)
                     }
                   ),
-                  j.label
+                  M.label
                 ]
               },
-              j.value
+              M.value
             )) })
           ]
         }
@@ -64080,7 +64088,11 @@ const CEBarChart = ({
 }) => {
   const [g, _] = useState(
     t || []
-  ), S = g.length > 0 ? e.filter(
+  );
+  useEffect(() => {
+    _(t);
+  }, [t]);
+  const S = g.length > 0 ? e.filter(
     (C) => g.includes(C.facility)
   ) : e, E = (C) => {
     const { x: I, y: O, width: j, height: M, value: N } = C;
@@ -64096,6 +64108,7 @@ const CEBarChart = ({
         fill: "white",
         fontSize: 10,
         fontWeight: "500",
+        className: "custom-bar-chart-label",
         children: [
           D,
           d == null ? void 0 : d.unit
@@ -64104,7 +64117,7 @@ const CEBarChart = ({
     );
   }, b = ({ active: C, payload: I, label: O }) => {
     if (C && I && I.length) {
-      const j = I.find((F) => F.dataKey === (d == null ? void 0 : d.key)), M = I.filter((F) => F.dataKey !== (d == null ? void 0 : d.key)), N = M.reduce(
+      const j = I.find((F) => F.dataKey === (d == null ? void 0 : d.linekey)), M = I.filter((F) => F.dataKey !== (d == null ? void 0 : d.linekey)), N = M.reduce(
         (F, q) => F + q.value,
         0
       ), D = parseFloat(N.toFixed(1));
@@ -64134,11 +64147,10 @@ const CEBarChart = ({
           d == null ? void 0 : d.unit
         ] }),
         j && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "chart-tooltip-revenue", children: [
-          "Total ",
-          d == null ? void 0 : d.type,
+          d == null ? void 0 : d.lineName,
           ": ",
           j.value,
-          d == null ? void 0 : d.unit
+          d == null ? void 0 : d.lineUnit
         ] })
       ] });
     }
@@ -64232,7 +64244,7 @@ const CEBarChart = ({
           yAxisId: "right",
           type: "monotone",
           dataKey: (d == null ? void 0 : d.linekey) || "totalRevenue",
-          stroke: "#dc2626",
+          stroke: (d == null ? void 0 : d.lineStrokeColor) ?? "#dc2626",
           strokeWidth: 3,
           dot: {
             fill: d.lineColor ?? "#dc2626",

package/dist/components/Common/InputDropDown/InputDropDown.d.ts

@@ -16,6 +16,7 @@ interface InputDropDownProps {
     showInputPills?: boolean;
     id?: string;
     name?: string;
+    required?: boolean;
 }
 declare const InputDropDown: React.FC<InputDropDownProps>;
 export default InputDropDown;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "cecomponent",
   "description": "A React component library for building modern UIs for Cleanearth",
-  "version": "1.0.177",
+  "version": "1.0.179",
   "main": "dist/ce-component-lib.js",
   "module": "dist/ce-component-lib.mjs",
   "types": "dist/idex.d.ts",