cecomponent 1.0.81 → 1.0.83

package/dist/ce-component-lib.mjs

@@ -1743,21 +1743,26 @@ const Breadcrumbs = ({ items: e, maxVisible: t = 4, onItemClick: r }) => {
   children: i,
   className: s = "",
   sx: n = {},
-  color: a
+  color: a,
+  label: o,
+  icon: l
 }) => {
-  const o = getSizeStyle(t), l = getVariantClass(e);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+  const f = getSizeStyle(t), c = getVariantClass(e);
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
     "button",
     {
-      className: `ce-button ${l} ${s}`,
+      className: `ce-button ${c} ${s}`,
       onClick: r,
       style: {
-        ...o,
+        ...f,
         ...n,
         ...a ? { color: a } : {}
       },
       disabled: e === "disabled",
-      children: i
+      children: [
+        l && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ce-button__icon", children: l }),
+        o ?? i
+      ]
     }
   );
 }, CeBox = forwardRef(function({
@@ -31301,12 +31306,90 @@ const ExportIcon = "data:image/svg+xml,%3csvg%20width='24'%20height='25'%20viewB
     ] }),
     S(o, p, E, "Chosen")
   ] });
+}, CEChatbox = ({ buttonLabel: e, buttonIcon: t }) => {
+  const [r, i] = useState([
+    {
+      id: 1,
+      author: "David Brown",
+      initials: "DB",
+      timestamp: "Jan 22, 2024 at 8:50 PM",
+      content: "Contract amendments have been drafted and sent to all affected agencies. Expected completion by end of month."
+    },
+    {
+      id: 2,
+      author: "Mike Wilson",
+      initials: "MW",
+      timestamp: "Jan 21, 2024 at 5:00 PM",
+      content: "Utah DEQ has approved the new pricing structure. All 15 state agencies have been notified and are in agreement with the changes."
+    }
+  ]), [s, n] = useState(""), a = () => {
+    if (s.trim()) {
+      const l = {
+        id: r.length + 1,
+        author: "Current User",
+        initials: "CU",
+        timestamp: (/* @__PURE__ */ new Date()).toLocaleDateString("en-US", {
+          month: "short",
+          day: "numeric",
+          year: "numeric",
+          hour: "numeric",
+          minute: "2-digit",
+          hour12: !0
+        }),
+        content: s
+      };
+      i([l, ...r]), n("");
+    }
+  }, o = (l) => {
+    l.key === "Enter" && a();
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "notes-container", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "notes-header", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "notes-icon", children: "📝" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "notes-title", children: "Notes" })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "add-note-section", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "textarea",
+        {
+          value: s,
+          onChange: (l) => n(l.target.value),
+          onKeyPress: o,
+          placeholder: "Add a note...",
+          className: "add-note-input",
+          rows: 3
+        }
+      ),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        CEButton,
+        {
+          label: e,
+          icon: t,
+          variant: "outlinedGreen",
+          onClick: a,
+          sx: { width: "100%", marginTop: "10px" },
+          children: void 0
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "notes-list", children: r.map((l) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "note-item", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "note-avatar", children: l.initials }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "note-content", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "note-header", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "note-author", children: l.author }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "note-timestamp", children: l.timestamp })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "note-text", children: l.content })
+      ] })
+    ] }, l.id)) })
+  ] });
 };
 export {
   CEAutoSuggestInput,
   CEAvatarMenu,
   Breadcrumbs as CEBreadcrumbs,
   CEButton,
+  CEChatbox,
   CECheckBox as CECheckbox,
   CEChipInput,
   CEDataGridDynamicTable,

package/dist/components/CEChatbox/CEChatbox.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+interface CEChatboxProps {
+    buttonLabel: string;
+    buttonIcon?: React.ReactNode;
+}
+declare const CEChatbox: React.FC<CEChatboxProps>;
+export default CEChatbox;

package/dist/components/Common/Button/CEButton.d.ts

@@ -2,6 +2,7 @@ import { default as React } from 'react';
 import { Size } from '../Tokens/CESizes';
 type ButtonVariant = "primary" | "secondary" | "text" | "neutral" | "outlined" | "outlinedGreen" | "disabled" | "underline";
 interface CEButtonProps {
+    label?: string;
     variant?: ButtonVariant;
     size?: Size;
     onClick: () => void;
@@ -9,6 +10,7 @@ interface CEButtonProps {
     className?: string;
     sx?: React.CSSProperties;
     color?: string;
+    icon?: React.ReactNode;
 }
 declare const CEButton: React.FC<CEButtonProps>;
 export default CEButton;

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

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+interface CEBadgeProps {
+    label: string;
+    backgroundColor?: string;
+    textColor?: string;
+    style?: React.CSSProperties;
+}
+declare const CEBadge: React.FC<CEBadgeProps>;
+export default CEBadge;

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

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+interface CEChatboxProps {
+    buttonLabel: string;
+    buttonIcon?: React.ReactNode;
+}
+declare const CEChatbox: React.FC<CEChatboxProps>;
+export default CEChatbox;

package/dist/index.d.ts

@@ -42,3 +42,4 @@ export { default as CETemplate } from './components/Common/Template/CETemplate';
 export { default as CETimePicker } from './components/Common/Timepicker/CETimePicker';
 export { default as TransferList } from './components/Common/TransferListNew/CETransferList';
 export { default as CETransferButton } from './components/Common/TransferListNew/CETransferButton';
+export { default as CEChatbox } from './components/CEChatbox/CEChatbox';

package/package.json

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