Bundling (#373)

* try some things

* package

* imports

* tidy

* breadcrumb fix

Author: lewisrenfrew

CHANGELOG.md

@@ -1,4 +1,8 @@
 # Changelog
+## [31.1.2] - 2025-07-10
+- Fix breadcrumbs layout bug
+## [31.1.1] - 2025-07-09
+- Slight changes to rollup bundle config
 ## [31.1.0] - 2025-07-07
 - Remove redundant Fragment
 ## [31.1.0] - 2025-07-07

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@linn-it/linn-form-components-library",
-  "version": "31.1.2-alpha",
+  "version": "31.1.2",
   "private": false,
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",

src/components/Breadcrumbs.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import Typography from '@mui/material/Typography';
 import Link from '@mui/material/Link';
-import Box from '@mui/material/Box';
 
 function Breadcrumbs({
     navigate,
@@ -40,7 +39,7 @@ function Breadcrumbs({
         }, []);
 
     return (
-        <Box style={{ marginLeft: '20px' }}>
+        <span style={{ marginLeft: '20px' }}>
             <Link
                 key="home"
                 href={homeUrl}
@@ -57,7 +56,7 @@ function Breadcrumbs({
             {crumbs.map((crumb, index) => {
                 if (index < crumbs.length - 1) {
                     return (
-                        <Box key={index}>
+                        <span key={index}>
                             <Link
                                 key={crumb.href}
                                 href={crumb.href}
@@ -72,7 +71,7 @@ function Breadcrumbs({
                                 {crumb.caption}
                             </Link>
                             <> {' / '} </>
-                        </Box>
+                        </span>
                     );
                 }
                 return (
@@ -81,7 +80,7 @@ function Breadcrumbs({
                     </Typography>
                 );
             })}
-        </Box>
+        </span>
     );
 }
 

src/components/Page.js

@@ -1,6 +1,6 @@
 import React, { useEffect } from 'react';
 import { useSnackbar } from 'notistack';
-import { Paper, Typography } from '@mui/material';
+import { Paper } from '@mui/material';
 import Grid from '@mui/material/Grid';
 import Breadcrumbs from './Breadcrumbs.js';
 

src/stories/Page.stories.js

@@ -0,0 +1,29 @@
+import Page from '../components/Page';
+
+export default {
+    title: 'Page',
+    component: Page,
+    tags: ['autodocs'],
+    argTypes: {
+        backgroundColor: { control: 'color' }
+    },
+    args: {
+        children: <div />,
+        navigate: () => {},
+        location: { pathname: 'a/test/path' },
+        width: 'l',
+        requestErrors: [],
+        showRequestErrors: false,
+        homeUrl: null,
+        showBreadcrumbs: true,
+        title: null,
+        defaultAppTitle: null
+    }
+};
+
+export const Default = {
+    args: {
+        primary: true,
+        label: 'Page'
+    }
+};