@gobolt/genesis 0.4.25 → 0.4.26

package/dist/components/Message/Message.d.ts

@@ -9,6 +9,7 @@ export interface MessageProps {
     message: string;
     action?: MessageAction;
     size?: Extract<keyof typeof SIZE, "small" | "standard">;
+    isFullWidth?: boolean;
 }
-declare const Message: ({ state, message, action, size, }: MessageProps) => import("react/jsx-runtime").JSX.Element;
+declare const Message: ({ state, message, action, size, isFullWidth, }: MessageProps) => import("react/jsx-runtime").JSX.Element;
 export default Message;

package/dist/components/Message/styles.d.ts

@@ -1,9 +1,11 @@
 export declare const MessageRow: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     state: string;
     size: string;
+    isFullWidth: boolean;
 }>> & string;
 export declare const MessageContent: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     size?: string;
     action?: unknown;
+    isFullWidth?: boolean;
 }>> & string;
 export declare const ActionButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;

package/dist/index.cjs

@@ -78958,7 +78958,7 @@ const MessageRow = styled.div`
   gap: ${({ theme }) => theme.sizing.Size4}px;
   padding: ${({ theme }) => theme.sizing.Size3}px;
   background-color: ${({ theme, state }) => theme.colors.status[state].surface};
-  width: ${({ theme, state, size }) => size === "standard" ? "320px" : "240px"};
+  width: ${({ theme, state, size, isFullWidth }) => isFullWidth ? "100%" : size === "standard" ? "320px" : "240px"};
   pointer-events: none;
   cursor: default;
   border-radius: ${({ theme }) => theme.borderRadius.BorderRadiusSm}px;
@@ -78968,7 +78968,7 @@ const MessageContent = styled.div`
   align-items: center;
   gap: ${({ theme }) => theme.sizing.Size2}px;
   flex: 1;
-  max-width: ${({ size, action }) => size === "standard" || !action ? "320px" : "240px"};
+  max-width: ${({ size, action, isFullWidth }) => isFullWidth ? "100%" : size === "standard" || !action ? "320px" : "240px"};
 
   .ant-typography {
     display: -webkit-box;
@@ -79035,7 +79035,8 @@ const Message = ({
   state = STATE.info,
   message: message2,
   action,
-  size = SIZE.standard
+  size = SIZE.standard,
+  isFullWidth = false
 }) => {
   const theme = styled.useTheme();
   const color2 = getIconColor$1(state, theme);
@@ -79043,8 +79044,8 @@ const Message = ({
   const [linkColor, setLinkColor] = React.useState(
     theme.colors.interactive.link.active
   );
-  return /* @__PURE__ */ jsxRuntime.jsxs(MessageRow, { state, size, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(MessageContent, { action, size, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(MessageRow, { state, size, isFullWidth, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(MessageContent, { action, size, isFullWidth, children: [
       getIcon(state, color2),
       /* @__PURE__ */ jsxRuntime.jsx(
         Typography,
@@ -81612,7 +81613,7 @@ const Progress = ({
     ] });
   }
   if (isProgressCombined) {
-    const combinedPercent = getCombinedPercent(firstBarData, secondBarData);
+    const combinedPercent = getCombinedPercent(firstBarData, secondBarData || null);
     const textColor = Number(combinedPercent) === 100 ? "green" : "black";
     const adjustedFirstBar = secondBarData?.value === 100 ? 100 : firstBarData?.value || 0;
     const firstBarStrokeColor = theme?.colors?.inputs?.progress?.[firstBarData?.status || "info"];
@@ -86753,7 +86754,7 @@ const mockColumns = [
       const textColor = record.isSelected ? "white" : "#6c6c6c";
       return React.createElement(Typography, {
         variant: "body2",
-        children: address,
+        children: typeof address === "string" ? address : JSON.stringify(address),
         color: `${textColor}`
       });
     }

package/dist/index.js

@@ -78940,7 +78940,7 @@ const MessageRow = styled.div`
   gap: ${({ theme }) => theme.sizing.Size4}px;
   padding: ${({ theme }) => theme.sizing.Size3}px;
   background-color: ${({ theme, state }) => theme.colors.status[state].surface};
-  width: ${({ theme, state, size }) => size === "standard" ? "320px" : "240px"};
+  width: ${({ theme, state, size, isFullWidth }) => isFullWidth ? "100%" : size === "standard" ? "320px" : "240px"};
   pointer-events: none;
   cursor: default;
   border-radius: ${({ theme }) => theme.borderRadius.BorderRadiusSm}px;
@@ -78950,7 +78950,7 @@ const MessageContent = styled.div`
   align-items: center;
   gap: ${({ theme }) => theme.sizing.Size2}px;
   flex: 1;
-  max-width: ${({ size, action }) => size === "standard" || !action ? "320px" : "240px"};
+  max-width: ${({ size, action, isFullWidth }) => isFullWidth ? "100%" : size === "standard" || !action ? "320px" : "240px"};
 
   .ant-typography {
     display: -webkit-box;
@@ -79017,7 +79017,8 @@ const Message = ({
   state = STATE.info,
   message: message2,
   action,
-  size = SIZE.standard
+  size = SIZE.standard,
+  isFullWidth = false
 }) => {
   const theme = useTheme$1();
   const color2 = getIconColor$1(state, theme);
@@ -79025,8 +79026,8 @@ const Message = ({
   const [linkColor, setLinkColor] = useState(
     theme.colors.interactive.link.active
   );
-  return /* @__PURE__ */ jsxs(MessageRow, { state, size, children: [
-    /* @__PURE__ */ jsxs(MessageContent, { action, size, children: [
+  return /* @__PURE__ */ jsxs(MessageRow, { state, size, isFullWidth, children: [
+    /* @__PURE__ */ jsxs(MessageContent, { action, size, isFullWidth, children: [
       getIcon(state, color2),
       /* @__PURE__ */ jsx(
         Typography,
@@ -81594,7 +81595,7 @@ const Progress = ({
     ] });
   }
   if (isProgressCombined) {
-    const combinedPercent = getCombinedPercent(firstBarData, secondBarData);
+    const combinedPercent = getCombinedPercent(firstBarData, secondBarData || null);
     const textColor = Number(combinedPercent) === 100 ? "green" : "black";
     const adjustedFirstBar = secondBarData?.value === 100 ? 100 : firstBarData?.value || 0;
     const firstBarStrokeColor = theme?.colors?.inputs?.progress?.[firstBarData?.status || "info"];
@@ -86735,7 +86736,7 @@ const mockColumns = [
       const textColor = record.isSelected ? "white" : "#6c6c6c";
       return React__default.createElement(Typography, {
         variant: "body2",
-        children: address,
+        children: typeof address === "string" ? address : JSON.stringify(address),
         color: `${textColor}`
       });
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gobolt/genesis",
-  "version": "0.4.25",
+  "version": "0.4.26",
   "description": "genesis design system",
   "author": "gobolt",
   "license": "MIT",