@guardian/stand 0.0.16 → 0.0.18

package/dist/types/styleD/build/typescript/component/button.d.ts

@@ -19,7 +19,7 @@ export declare const componentButton: {
             'outline-offset': string;
         };
     };
-    'emphasised-primary': {
+    primary: {
         shared: {
             color: string;
             backgroundColor: string;
@@ -144,7 +144,7 @@ export declare const componentButton: {
             };
         };
     };
-    'emphasised-secondary': {
+    secondary: {
         shared: {
             color: string;
             backgroundColor: string;
@@ -269,132 +269,7 @@ export declare const componentButton: {
             };
         };
     };
-    'neutral-primary': {
-        shared: {
-            color: string;
-            backgroundColor: string;
-            borderRadius: string;
-            border: string;
-            ':hover': {
-                backgroundColor: string;
-                border: string;
-            };
-            ':active': {
-                backgroundColor: string;
-                border: string;
-            };
-            ':disabled': {
-                color: string;
-                backgroundColor: string;
-                border: string;
-            };
-        };
-        xs: {
-            height: string;
-            padding: {
-                top: string;
-                right: string;
-                bottom: string;
-                left: string;
-                withIcon: {
-                    iconLeft: {
-                        left: string;
-                    };
-                };
-            };
-            typography: {
-                font: string;
-                letterSpacing: string;
-                fontWidth: number;
-            };
-            icon: {
-                size: string;
-                gap: string;
-            };
-            iconButton: {
-                width: string;
-            };
-        };
-        sm: {
-            height: string;
-            padding: {
-                top: string;
-                right: string;
-                bottom: string;
-                left: string;
-                withIcon: {
-                    iconLeft: {
-                        left: string;
-                    };
-                };
-            };
-            typography: {
-                font: string;
-                letterSpacing: string;
-                fontWidth: number;
-            };
-            icon: {
-                size: string;
-                gap: string;
-            };
-            iconButton: {
-                width: string;
-            };
-        };
-        md: {
-            height: string;
-            padding: {
-                top: string;
-                right: string;
-                bottom: string;
-                left: string;
-                withIcon: {
-                    iconLeft: {
-                        left: string;
-                    };
-                };
-            };
-            typography: {
-                font: string;
-                letterSpacing: string;
-                fontWidth: number;
-            };
-            icon: {
-                size: string;
-                gap: string;
-            };
-            iconButton: {
-                width: string;
-            };
-        };
-        lg: {
-            height: string;
-            padding: {
-                top: string;
-                right: string;
-                bottom: string;
-                left: string;
-                withIcon: {
-                    iconLeft: {
-                        left: string;
-                    };
-                };
-            };
-            typography: {
-                font: string;
-                letterSpacing: string;
-                fontWidth: number;
-            };
-            icon: {
-                size: string;
-                gap: string;
-            };
-            iconButton: {
-                width: string;
-            };
-        };
-    };
-    'neutral-secondary': {
+    tertiary: {
         shared: {
             color: string;
             backgroundColor: string;

package/dist/types/styleD/build/typescript/component/inlineMessage.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+export declare const componentInlineMessage: {
+    shared: {
+        display: string;
+        gap: string;
+        'align-items': string;
+        icon: {
+            size: string;
+        };
+        typography: {
+            font: string;
+            letterSpacing: string;
+            fontWidth: number;
+        };
+    };
+    error: {
+        color: string;
+    };
+    success: {
+        color: string;
+    };
+    information: {
+        color: string;
+    };
+};
+export type ComponentInlineMessage = typeof componentInlineMessage;

package/dist/types/styleD/build/typescript/component/menu.d.ts

@@ -57,6 +57,7 @@ export declare const componentMenu: {
                 left: string;
             };
             'border-bottom': string;
+            'background-color': string;
             icon: {
                 'grid-area': string;
                 'align-self': string;

package/dist/types/styleD/build/typescript/semantic/colors.d.ts

@@ -3,11 +3,11 @@
  */
 export declare const semanticColors: {
     text: {
-        default: string;
-        subdued: string;
-        'inverse-default': string;
-        'inverse-subdued': string;
-        'inverse-strong': string;
+        strong: string;
+        weak: string;
+        'strong-inverse': string;
+        'weak-inverse': string;
+        'stronger-inverse': string;
         error: string;
         warning: string;
         success: string;
@@ -23,59 +23,54 @@ export declare const semanticColors: {
         magenta: string;
         orange: string;
         yellow: string;
-        'interactive-disabled': string;
     };
     bg: {
         base: string;
-        'raised-1': string;
-        'raised-2': string;
-    };
-    surface: {
-        'light-1': string;
-        'light-2': string;
-        'dark-1': string;
+        'raised-level-1': string;
+        'raised-level-2': string;
     };
     border: {
-        default: string;
-        secondary: string;
-        tertiary: string;
+        stronger: string;
         strong: string;
-        'inverse-strong': string;
-        'interactive-emphasised': string;
-        'interactive-neutral': string;
-        'interactive-disabled': string;
-        'interactive-focused': string;
-        'interactive-selected': string;
-    };
-    status: {
-        'status-draft': string;
-        'status-live': string;
-        'status-selected': string;
-        'status-focused': string;
+        weak: string;
+        weaker: string;
+        'strong-inverse': string;
+        disabled: string;
+        accent: string;
+        error: string;
+        focused: string;
+        selected: string;
+        'selected-inverse': string;
     };
     fill: {
-        'interactive-primary-emphasised': string;
-        'interactive-primary-emphasised-hover': string;
-        'interactive-primary-emphasised-pressed': string;
-        'interactive-secondary-emphasised-hover': string;
-        'interactive-secondary-emphasised-pressed': string;
-        'interactive-primary-neutral': string;
-        'interactive-primary-neutral-hover': string;
-        'interactive-primary-neutral-pressed': string;
-        'interactive-secondary-neutral-hover': string;
-        'interactive-secondary-neutral-pressed': string;
-        'interactive-disabled': string;
-        'green-subtle': string;
-        'blue-subtle': string;
-        'red-subtle': string;
-        'cyan-subtle': string;
-        'teal-subtle': string;
-        'cool-purple-subtle': string;
-        'warm-purple-subtle': string;
-        'magenta-subtle': string;
-        'orange-subtle': string;
-        'yellow-subtle': string;
+        'accent-strong': string;
+        'accent-strong-hover': string;
+        'accent-strong-pressed': string;
+        strong: string;
+        'strong-hover': string;
+        'strong-pressed': string;
+        weak: string;
+        'weak-hover': string;
+        'weak-pressed': string;
+        disabled: string;
+        'green-weak': string;
+        'blue-weak': string;
+        'red-weak': string;
+        'cyan-weak': string;
+        'teal-weak': string;
+        'cool-purple-weak': string;
+        'warm-purple-weak': string;
+        'magenta-weak': string;
+        'orange-weak': string;
+        'yellow-weak': string;
         selected: string;
+        'draft-strong': string;
+        'live-weak': string;
+        'warning-weak': string;
+        'information-weak': string;
+        'error-weak': string;
+        'error-strong': string;
+        'success-weak': string;
     };
 };
 export type SemanticColors = typeof semanticColors;

package/dist/types/styleD/build/typescript/semantic/sizing.d.ts

@@ -3,6 +3,7 @@
  */
 export declare const semanticSizing: {
     height: {
+        xxs: string;
         xs: string;
         sm: string;
         md: string;

package/dist/types/styleD/build/typescript/semantic/typography.d.ts

@@ -207,5 +207,55 @@ export declare const semanticTypography: {
         letterSpacing: string;
         fontWidth: number;
     };
+    'label-form-sm': {
+        font: string;
+        letterSpacing: string;
+        fontWidth: number;
+    };
+    'label-form-md': {
+        font: string;
+        letterSpacing: string;
+        fontWidth: number;
+    };
+    'label-form-inline-sm': {
+        font: string;
+        letterSpacing: string;
+        fontWidth: number;
+    };
+    'label-form-inline-md': {
+        font: string;
+        letterSpacing: string;
+        fontWidth: number;
+    };
+    'label-form-compact-sm': {
+        font: string;
+        letterSpacing: string;
+        fontWidth: number;
+    };
+    'label-form-compact-md': {
+        font: string;
+        letterSpacing: string;
+        fontWidth: number;
+    };
+    'label-form-inline-compact-sm': {
+        font: string;
+        letterSpacing: string;
+        fontWidth: number;
+    };
+    'label-form-inline-compact-md': {
+        font: string;
+        letterSpacing: string;
+        fontWidth: number;
+    };
+    'help-text-form-md': {
+        font: string;
+        letterSpacing: string;
+        fontWidth: number;
+    };
+    'help-text-form-compact-md': {
+        font: string;
+        letterSpacing: string;
+        fontWidth: number;
+    };
 };
 export type SemanticTypography = typeof semanticTypography;

package/dist/util/css/reset.css

@@ -122,3 +122,13 @@ video {
 body {
 	min-height: 100svh;
 }
+
+.focus-ring {
+	outline: 0.125rem solid blue;
+	outline-offset: -1px;
+}
+
+.focus-focus {
+	outline: 0.125rem solid red;
+	outline-offset: -1px;
+}

package/dist/util/reset.css.cjs

@@ -1,5 +1,5 @@
 'use strict';
 
-var reset = "/*\nSelect CSS resets for use with the stand design system.\nModified from https://github.com/guardian/csnx/blob/0f68024f6f3bee003b5f95e66d29fb74987a8dec/libs/%40guardian/source/src/foundations/utils/resets.ts\n*/\n*,\n*::after,\n*::before {\n\tbox-sizing: border-box;\n}\n\nhtml {\n\ttext-size-adjust: none;\n\t-webkit-text-size-adjust: none;\n\t-webkit-tap-highlight-color: transparent;\n\t-webkit-font-smoothing: antialiased;\n\t-moz-osx-font-smoothing: grayscale;\n}\n\nhtml,\nbody {\n\ttext-rendering: optimizeLegibility;\n\tfont-feature-settings: 'kern';\n\tfont-kerning: normal; /* Safari 7+, Firefox 24+, Chrome 33(?)+, Opera 21 */\n\tfont-variant-ligatures: common-ligatures;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nmenu,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmain,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n\tmargin: 0;\n\tpadding: 0;\n\tborder: 0;\n\tfont-size: 100%;\n\tfont: inherit;\n\tvertical-align: baseline;\n}\n\n*[hidden] {\n\tdisplay: none;\n}\n\nbody {\n\tmin-height: 100svh;\n}\n";
+var reset = "/*\nSelect CSS resets for use with the stand design system.\nModified from https://github.com/guardian/csnx/blob/0f68024f6f3bee003b5f95e66d29fb74987a8dec/libs/%40guardian/source/src/foundations/utils/resets.ts\n*/\n*,\n*::after,\n*::before {\n\tbox-sizing: border-box;\n}\n\nhtml {\n\ttext-size-adjust: none;\n\t-webkit-text-size-adjust: none;\n\t-webkit-tap-highlight-color: transparent;\n\t-webkit-font-smoothing: antialiased;\n\t-moz-osx-font-smoothing: grayscale;\n}\n\nhtml,\nbody {\n\ttext-rendering: optimizeLegibility;\n\tfont-feature-settings: 'kern';\n\tfont-kerning: normal; /* Safari 7+, Firefox 24+, Chrome 33(?)+, Opera 21 */\n\tfont-variant-ligatures: common-ligatures;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nmenu,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmain,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n\tmargin: 0;\n\tpadding: 0;\n\tborder: 0;\n\tfont-size: 100%;\n\tfont: inherit;\n\tvertical-align: baseline;\n}\n\n*[hidden] {\n\tdisplay: none;\n}\n\nbody {\n\tmin-height: 100svh;\n}\n\n.focus-ring {\n\toutline: 0.125rem solid blue;\n\toutline-offset: -1px;\n}\n\n.focus-focus {\n\toutline: 0.125rem solid red;\n\toutline-offset: -1px;\n}\n";
 
 module.exports = reset;

package/dist/util/reset.css.js

@@ -1,3 +1,3 @@
-var reset = "/*\nSelect CSS resets for use with the stand design system.\nModified from https://github.com/guardian/csnx/blob/0f68024f6f3bee003b5f95e66d29fb74987a8dec/libs/%40guardian/source/src/foundations/utils/resets.ts\n*/\n*,\n*::after,\n*::before {\n\tbox-sizing: border-box;\n}\n\nhtml {\n\ttext-size-adjust: none;\n\t-webkit-text-size-adjust: none;\n\t-webkit-tap-highlight-color: transparent;\n\t-webkit-font-smoothing: antialiased;\n\t-moz-osx-font-smoothing: grayscale;\n}\n\nhtml,\nbody {\n\ttext-rendering: optimizeLegibility;\n\tfont-feature-settings: 'kern';\n\tfont-kerning: normal; /* Safari 7+, Firefox 24+, Chrome 33(?)+, Opera 21 */\n\tfont-variant-ligatures: common-ligatures;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nmenu,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmain,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n\tmargin: 0;\n\tpadding: 0;\n\tborder: 0;\n\tfont-size: 100%;\n\tfont: inherit;\n\tvertical-align: baseline;\n}\n\n*[hidden] {\n\tdisplay: none;\n}\n\nbody {\n\tmin-height: 100svh;\n}\n";
+var reset = "/*\nSelect CSS resets for use with the stand design system.\nModified from https://github.com/guardian/csnx/blob/0f68024f6f3bee003b5f95e66d29fb74987a8dec/libs/%40guardian/source/src/foundations/utils/resets.ts\n*/\n*,\n*::after,\n*::before {\n\tbox-sizing: border-box;\n}\n\nhtml {\n\ttext-size-adjust: none;\n\t-webkit-text-size-adjust: none;\n\t-webkit-tap-highlight-color: transparent;\n\t-webkit-font-smoothing: antialiased;\n\t-moz-osx-font-smoothing: grayscale;\n}\n\nhtml,\nbody {\n\ttext-rendering: optimizeLegibility;\n\tfont-feature-settings: 'kern';\n\tfont-kerning: normal; /* Safari 7+, Firefox 24+, Chrome 33(?)+, Opera 21 */\n\tfont-variant-ligatures: common-ligatures;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nmenu,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmain,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n\tmargin: 0;\n\tpadding: 0;\n\tborder: 0;\n\tfont-size: 100%;\n\tfont: inherit;\n\tvertical-align: baseline;\n}\n\n*[hidden] {\n\tdisplay: none;\n}\n\nbody {\n\tmin-height: 100svh;\n}\n\n.focus-ring {\n\toutline: 0.125rem solid blue;\n\toutline-offset: -1px;\n}\n\n.focus-focus {\n\toutline: 0.125rem solid red;\n\toutline-offset: -1px;\n}\n";
 
 export { reset as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@guardian/stand",
-  "version": "0.0.16",
+  "version": "0.0.18",
   "type": "module",
   "//exports": "Each component has its own entry point for optimal tree-shaking. Main entry point only includes design tokens and utilities. New components/foundations should follow the same pattern.",
   "exports": {
@@ -14,6 +14,16 @@
       "import": "./dist/avatar.js",
       "require": "./dist/avatar.cjs"
     },
+    "./avatar-link": {
+      "types": "./dist/types/avatar-link.d.ts",
+      "import": "./dist/avatar-link.js",
+      "require": "./dist/avatar-link.cjs"
+    },
+    "./avatar-button": {
+      "types": "./dist/types/avatar-button.d.ts",
+      "import": "./dist/avatar-button.js",
+      "require": "./dist/avatar-button.cjs"
+    },
     "./button": {
       "types": "./dist/types/button.d.ts",
       "import": "./dist/button.js",
@@ -59,6 +69,11 @@
       "import": "./dist/TopBar.js",
       "require": "./dist/TopBar.cjs"
     },
+    "./inline-message": {
+      "types": "./dist/types/inline-message.d.ts",
+      "import": "./dist/inline-message.js",
+      "require": "./dist/inline-message.cjs"
+    },
     "./byline": {
       "types": "./dist/types/byline.d.ts",
       "import": "./dist/byline.js",
@@ -103,7 +118,8 @@
     "./component/icon.css": "./dist/styleD/build/css/component/icon.css",
     "./component/favicon.css": "./dist/styleD/build/css/component/favicon.css",
     "./component/menu.css": "./dist/styleD/build/css/component/menu.css",
-    "./component/TopBar.css": "./dist/styleD/build/css/component/TopBar.css"
+    "./component/TopBar.css": "./dist/styleD/build/css/component/TopBar.css",
+    "./component/inlineMessage.css": "./dist/styleD/build/css/component/inlineMessage.css"
   },
   "//typesVersions": "Provides backward compatibility for TypeScript moduleResolution: node - maps subpath imports to correct type definition files. When adding new components with their own entry points, ensure to add them here.",
   "typesVersions": {
@@ -149,6 +165,9 @@
       ],
       "menu": [
         "./dist/types/menu.d.ts"
+      ],
+      "inline-message": [
+        "./dist/types/inline-message.d.ts"
       ]
     }
   },
@@ -163,24 +182,23 @@
   "types": "./dist/types/index.d.ts",
   "sideEffects": false,
   "devDependencies": {
-    "@changesets/cli": "^2.29.8",
+    "@changesets/cli": "^2.30.0",
     "@codesandbox/sandpack-react": "^2.20.0",
     "@emotion/react": "11.11.4",
     "@figma/rest-api-spec": "^0.36.0",
-    "@guardian/eslint-config": "14.0.0",
+    "@guardian/eslint-config": "14.0.1",
     "@guardian/prettier": "10.0.0",
     "@guardian/prosemirror-invisibles": "3.1.1",
     "@guardian/tsconfig": "1.0.1",
     "@material-design-icons/svg": "^0.14.15",
     "@playwright/experimental-ct-react17": "^1.58.2",
     "@react-aria/focus": "3.21.5",
-    "@rollup/plugin-commonjs": "29.0.0",
+    "@rollup/plugin-commonjs": "29.0.2",
     "@rollup/plugin-node-resolve": "16.0.3",
     "@rollup/plugin-typescript": "12.3.0",
-    "@storybook/addon-docs": "^10.2.14",
-    "@storybook/addon-themes": "^10.2.14",
-    "@storybook/react-vite": "^10.2.14",
-    "@terrazzo/cli": "^0.10.5",
+    "@storybook/addon-docs": "^10.3.3",
+    "@storybook/addon-themes": "^10.3.3",
+    "@storybook/react-vite": "^10.3.3",
     "@testing-library/jest-dom": "^6.9.1",
     "@types/jest": "30.0.0",
     "@types/node": "^24.10.1",
@@ -188,10 +206,10 @@
     "@types/react-dom": "17.0.25",
     "change-case": "^5.4.4",
     "eslint": "9.39.3",
-    "eslint-plugin-storybook": "^10.2.14",
+    "eslint-plugin-storybook": "^10.3.3",
     "husky": "^9.1.7",
-    "jest": "30.2.0",
-    "jest-environment-jsdom": "^30.1.2",
+    "jest": "30.3.0",
+    "jest-environment-jsdom": "^30.3.0",
     "prettier": "3.8.1",
     "prosemirror-dropcursor": "1.8.2",
     "prosemirror-history": "1.4.1",
@@ -204,18 +222,18 @@
     "react-dom": "17.0.2",
     "remark-gfm": "^4.0.1",
     "rimraf": "6.1.3",
-    "rollup": "4.59.0",
+    "rollup": "4.60.1",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-esbuild": "6.2.1",
     "rollup-plugin-import-css": "^4.2.0",
     "rollup-plugin-node-externals": "8.1.2",
-    "storybook": "^10.2.14",
-    "style-dictionary": "^5.3.2",
+    "storybook": "^10.3.3",
+    "style-dictionary": "^5.4.0",
     "ts-jest": "29.4.6",
     "tslib": "2.8.1",
     "typescript": "5.1.3",
-    "vite": "^7.3.1",
-    "vite-plugin-svgr": "^4.5.0"
+    "vite": "^8.0.3",
+    "vite-plugin-svgr": "^5.0.0"
   },
   "peerDependencies": {
     "@emotion/react": ">=11.11.4 <=11.14.0",
@@ -280,7 +298,6 @@
     "build-storybook": "storybook build",
     "lint": "eslint . --ext .ts,.tsx",
     "lint:fix": "eslint --fix . --ext .ts,.tsx",
-    "lint:tokens": "tz check",
     "format:check": "prettier --check .",
     "format:fix": "prettier --write .",
     "tsc": "tsc",

package/dist/components/topbar/toolName/TopBarToolName.js

@@ -1,12 +0,0 @@
-import { jsxs, jsx, Fragment } from '@emotion/react/jsx-runtime';
-import { mergeDeep } from '../../../util/mergeDeep.js';
-import { Favicon } from '../../favicon/Favicon.js';
-import { Icon } from '../../icon/Icon.js';
-import { toolNameTypography, dividerStyles, subsectionTypography, subsectionStyles, toolNameStyles, defaultToolNameTheme } from './styles.js';
-
-const TopBarToolName = ({ name, favicon, subsection, subsectionIcon, theme = {}, cssOverrides }) => {
-  const mergedTheme = mergeDeep(defaultToolNameTheme, theme);
-  return jsxs("div", { css: [toolNameStyles(mergedTheme), cssOverrides], children: [jsx(Favicon, { ...favicon }), jsx("div", { css: [toolNameTypography(mergedTheme)], children: name }), subsection && jsxs(Fragment, { children: [jsx("div", { css: dividerStyles(mergedTheme), children: "\xA0" }), jsxs("div", { css: subsectionStyles(mergedTheme), children: [subsectionIcon && jsx(Icon, { size: "sm", children: subsectionIcon }), jsx("div", { css: subsectionTypography(mergedTheme), children: subsection })] })] })] });
-};
-
-export { TopBarToolName };