@gnist/design-system 3.5.5 → 3.6.0

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.6.0](https://github.com/mollerdigital/design-system-design-system/compare/@gnist/design-system@3.5.6...@gnist/design-system@3.6.0) (2025-07-07)
+
+### Features
+
+* AlertBanner message-prop allows React Node ([c911154](https://github.com/mollerdigital/design-system-design-system/commit/c911154f4a3c2b8bea410bf963a9c4b14943a508))
+
+## [3.5.6](https://github.com/mollerdigital/design-system-design-system/compare/@gnist/design-system@3.5.5...@gnist/design-system@3.5.6) (2025-07-04)
+
+### Bug Fixes
+
+* set flex-shrink to 0 on iconButton ([24490b6](https://github.com/mollerdigital/design-system-design-system/commit/24490b60ca492c49b5732bc6336a4081f02cb0cf))
+
 ## [3.5.5](https://github.com/mollerdigital/design-system-design-system/compare/@gnist/design-system@3.5.4...@gnist/design-system@3.5.5) (2025-06-27)
 
 ### Bug Fixes

package/dist/components/actions/buttons/styles.css.cjs

@@ -73,7 +73,8 @@ const buttonRecipe = recipes.recipe({
         atoms_css_js.atoms({ columnGap: "base", padding: "none" }),
         {
           display: "grid",
-          gridAutoFlow: "column"
+          gridAutoFlow: "column",
+          flexShrink: "0"
         }
       ]
     }

package/dist/components/actions/buttons/styles.css.d.ts

@@ -32,6 +32,7 @@ export declare const buttonRecipe: import("@vanilla-extract/recipes").RuntimeFn<
         icon: (string | {
             display: "grid";
             gridAutoFlow: "column";
+            flexShrink: "0";
         })[];
     };
 }>;

package/dist/components/actions/buttons/styles.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/buttons/styles.css.ts"],"names":[],"mappings":"AA8CA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyDvB,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;EAStB,CAAC;AAEH,eAAO,MAAM,UAAU;;;;;;;;;;EAQrB,CAAC;AAEH,eAAO,MAAM,UAAU,QAErB,CAAC;AAEH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;EA0BzB,CAAC"}
+{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/buttons/styles.css.ts"],"names":[],"mappings":"AA8CA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0DvB,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;EAStB,CAAC;AAEH,eAAO,MAAM,UAAU;;;;;;;;;;EAQrB,CAAC;AAEH,eAAO,MAAM,UAAU,QAErB,CAAC;AAEH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;EA0BzB,CAAC"}

package/dist/components/actions/buttons/styles.css.js

@@ -71,7 +71,8 @@ const buttonRecipe = recipe({
         atoms({ columnGap: "base", padding: "none" }),
         {
           display: "grid",
-          gridAutoFlow: "column"
+          gridAutoFlow: "column",
+          flexShrink: "0"
         }
       ]
     }

package/dist/components/feedback/alerts/AlertBanner.cjs

@@ -23,6 +23,6 @@ const classNames__default = /* @__PURE__ */ _interopDefaultCompat(classNames);
 const BannerHeading = componentUtils.component("BannerHeading", AlertBanner_css.bannerHeading, "h2");
 const AlertBanner = ({ type, heading, message, dismiss, action, density = "default", headingLevel = "h2", className }) => {
   const text = index.useTranslation((t) => t.components.feedback.alerts);
-  return jsxRuntime.jsxs("div", { className: classNames__default.default(className, AlertBanner_css.banner({ type, density })), children: [jsxRuntime.jsx(Icon.Icon, { type, icon: type, className: AlertBanner_css.icon({ type }) }), jsxRuntime.jsxs("div", { className: AlertBanner_css.mainContentContainer({ density }), children: [heading && jsxRuntime.jsx(BannerHeading, { "$as": headingLevel, children: heading }), dismiss && jsxRuntime.jsx(IconButton.IconButton, { className: AlertBanner_css.closeButton, icon: "close", label: text.dismissLabel, onClick: dismiss }), jsxRuntime.jsx(index$1.TextContainer, { className: AlertBanner_css.messageContainer, children: message }), action && jsxRuntime.jsx(TextButton.TextButton, { density: "compact", className: AlertBanner_css.actionButton, onClick: action.onClick, underline: true, children: action.label })] })] });
+  return jsxRuntime.jsxs("div", { className: classNames__default.default(className, AlertBanner_css.banner({ type, density })), children: [jsxRuntime.jsx(Icon.Icon, { type, icon: type, className: AlertBanner_css.icon({ type }) }), jsxRuntime.jsxs("div", { className: AlertBanner_css.mainContentContainer({ density }), children: [heading && jsxRuntime.jsx(BannerHeading, { "$as": headingLevel, children: heading }), dismiss && jsxRuntime.jsx(IconButton.IconButton, { className: AlertBanner_css.closeButton, icon: "close", label: text.dismissLabel, onClick: dismiss }), typeof message === "string" ? jsxRuntime.jsx(index$1.TextContainer, { className: AlertBanner_css.messageContainer, children: message }) : jsxRuntime.jsx("div", { className: AlertBanner_css.messageContainer, children: message }), action && jsxRuntime.jsx(TextButton.TextButton, { density: "compact", className: AlertBanner_css.actionButton, onClick: action.onClick, underline: true, children: action.label })] })] });
 };
 exports.AlertBanner = AlertBanner;

package/dist/components/feedback/alerts/AlertBanner.d.ts

@@ -1,8 +1,9 @@
 import { DensitySizes } from "../../../foundation/typography";
+import { ReactNode } from "react";
 export interface AlertBannerProps {
     type: "info" | "success" | "warning" | "error";
     heading?: string | undefined;
-    message: string;
+    message: ReactNode;
     dismiss?: () => void;
     action?: {
         label: string;
@@ -14,7 +15,7 @@ export interface AlertBannerProps {
 }
 /** An alert banner displays an important and high-signal message, and provides actions for users to address (or dismiss the banner). They’re meant to be noticed and often requires a user action to be dismissed.
 
- Text is required for all alert banners. The message should be concise and, if applicable, describe the next step that a user can take.
+ Message is required for all alert banners. The message should be concise and, if applicable, describe the next step that a user can take. The message prop can be string or other React Node.
 
  Title and button with a contextual action are optional.
 

package/dist/components/feedback/alerts/AlertBanner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AlertBanner.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/alerts/AlertBanner.tsx"],"names":[],"mappings":"AAEA,OAAO,EACH,YAAY,EAEf,uCAAmD;AAcpD,MAAM,WAAW,gBAAgB;IAC7B,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAC/C,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE;QACL,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,IAAI,CAAC;KACvB,CAAC;IACF,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,YAAY,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAChD,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAClC;AAID;;;;;;;GAOG;AAEH,eAAO,MAAM,WAAW,mFASrB,gBAAgB,4CAmClB,CAAC"}
+{"version":3,"file":"AlertBanner.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/alerts/AlertBanner.tsx"],"names":[],"mappings":"AAEA,OAAO,EACH,YAAY,EAEf,uCAAmD;AAapD,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,WAAW,gBAAgB;IAC7B,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAC/C,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,OAAO,EAAE,SAAS,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE;QACL,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,IAAI,CAAC;KACvB,CAAC;IACF,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,YAAY,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAChD,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAClC;AAID;;;;;;;GAOG;AAEH,eAAO,MAAM,WAAW,mFASrB,gBAAgB,4CAuClB,CAAC"}

package/dist/components/feedback/alerts/AlertBanner.js

@@ -19,7 +19,7 @@ import { bannerHeading, icon, mainContentContainer, closeButton, messageContaine
 const BannerHeading = component("BannerHeading", bannerHeading, "h2");
 const AlertBanner = ({ type, heading, message, dismiss, action, density = "default", headingLevel = "h2", className }) => {
   const text = useTranslation((t) => t.components.feedback.alerts);
-  return jsxs("div", { className: classNames(className, banner({ type, density })), children: [jsx(Icon, { type, icon: type, className: icon({ type }) }), jsxs("div", { className: mainContentContainer({ density }), children: [heading && jsx(BannerHeading, { "$as": headingLevel, children: heading }), dismiss && jsx(IconButton, { className: closeButton, icon: "close", label: text.dismissLabel, onClick: dismiss }), jsx(TextContainer, { className: messageContainer, children: message }), action && jsx(TextButton, { density: "compact", className: actionButton, onClick: action.onClick, underline: true, children: action.label })] })] });
+  return jsxs("div", { className: classNames(className, banner({ type, density })), children: [jsx(Icon, { type, icon: type, className: icon({ type }) }), jsxs("div", { className: mainContentContainer({ density }), children: [heading && jsx(BannerHeading, { "$as": headingLevel, children: heading }), dismiss && jsx(IconButton, { className: closeButton, icon: "close", label: text.dismissLabel, onClick: dismiss }), typeof message === "string" ? jsx(TextContainer, { className: messageContainer, children: message }) : jsx("div", { className: messageContainer, children: message }), action && jsx(TextButton, { density: "compact", className: actionButton, onClick: action.onClick, underline: true, children: action.label })] })] });
 };
 export {
   AlertBanner

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@gnist/design-system",
-    "version": "3.5.5",
+    "version": "3.6.0",
     "license": "UNLICENSED",
     "type": "module",
     "main": "dist/index.cjs",
@@ -49,7 +49,7 @@
     "dependencies": {
         "@formkit/auto-animate": "^0.8.2",
         "@gnist/component-utils": "3.0.7",
-        "@gnist/themes": "^3.10.0",
+        "@gnist/themes": "^3.10.1",
         "@mui/base": "^5.0.0-beta.70",
         "@vanilla-extract/css": "^1.17.1",
         "@vanilla-extract/css-utils": "^0.1.4",
@@ -87,7 +87,6 @@
         "semver": "^7.7.1",
         "svgo": "^3.3.2",
         "svgo-autocrop": "^1.1.2",
-        "ts-node": "^10.9.2",
         "tslib": "^2.8.1",
         "tsx": "^4.19.3",
         "typescript-transform-paths": "^3.5.5",
@@ -103,5 +102,5 @@
             "optional": true
         }
     },
-    "gitHead": "46e94a0408948829fa3184f5f7e14e1389d231d8"
+    "gitHead": "13550fb6429db09a62cbcdeb9dad1cb142bc0f49"
 }