@aehrc/smart-forms-renderer 1.0.0-alpha.92 → 1.0.0-alpha.93

package/lib/theme/RendererThemeProvider.js

@@ -1,8 +1,8 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { createTheme, StyledEngineProvider, ThemeProvider as MUIThemeProvider } from '@mui/material/styles';
-import CustomGlobalStyles from './customGlobalStyles';
 import { rendererThemeComponentOverrides } from './overrides/rendererThemeComponentOverrides';
 import { rendererThemeOptions } from './rendererThemeOptions';
+import { ScopedCssBaseline } from '@mui/material';
 /**
  * Default theme used by the renderer using Material UI. You can customise your own theme by defining a new ThemeProvider.
  * @see {@link https://mui.com/material-ui/customization/theming/}
@@ -12,7 +12,7 @@ import { rendererThemeOptions } from './rendererThemeOptions';
 export function RendererThemeProvider({ children }) {
     const theme = createTheme(rendererThemeOptions);
     theme.components = rendererThemeComponentOverrides(theme);
-    return (_jsx(StyledEngineProvider, { injectFirst: true, children: _jsxs(MUIThemeProvider, { theme: theme, children: [_jsx(CustomGlobalStyles, {}), _jsx(_Fragment, { children: children })] }) }));
+    return (_jsx(StyledEngineProvider, { injectFirst: true, children: _jsx(MUIThemeProvider, { theme: theme, children: _jsx(ScopedCssBaseline, { children: children }) }) }));
 }
 export default RendererThemeProvider;
 //# sourceMappingURL=RendererThemeProvider.js.map

package/lib/theme/RendererThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"RendererThemeProvider.js","sourceRoot":"","sources":["../../src/theme/RendererThemeProvider.tsx"],"names":[],"mappings":";AAmBA,OAAO,EACL,WAAW,EACX,oBAAoB,EACpB,aAAa,IAAI,gBAAgB,EAClC,MAAM,sBAAsB,CAAC;AAC9B,OAAO,kBAAkB,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,+BAA+B,EAAE,MAAM,6CAA6C,CAAC;AAC9F,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAE9D;;;;;GAKG;AACH,MAAM,UAAU,qBAAqB,CAAC,EAAE,QAAQ,EAA2B;IACzE,MAAM,KAAK,GAAG,WAAW,CAAC,oBAAoB,CAAC,CAAC;IAChD,KAAK,CAAC,UAAU,GAAG,+BAA+B,CAAC,KAAK,CAAC,CAAC;IAE1D,OAAO,CACL,KAAC,oBAAoB,IAAC,WAAW,kBAC/B,MAAC,gBAAgB,IAAC,KAAK,EAAE,KAAK,aAC5B,KAAC,kBAAkB,KAAG,EACtB,4BAAG,QAAQ,GAAI,IACE,GACE,CACxB,CAAC;AACJ,CAAC;AAED,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"RendererThemeProvider.js","sourceRoot":"","sources":["../../src/theme/RendererThemeProvider.tsx"],"names":[],"mappings":";AAmBA,OAAO,EACL,WAAW,EACX,oBAAoB,EACpB,aAAa,IAAI,gBAAgB,EAClC,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,+BAA+B,EAAE,MAAM,6CAA6C,CAAC;AAC9F,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAElD;;;;;GAKG;AACH,MAAM,UAAU,qBAAqB,CAAC,EAAE,QAAQ,EAA2B;IACzE,MAAM,KAAK,GAAG,WAAW,CAAC,oBAAoB,CAAC,CAAC;IAChD,KAAK,CAAC,UAAU,GAAG,+BAA+B,CAAC,KAAK,CAAC,CAAC;IAE1D,OAAO,CACL,KAAC,oBAAoB,IAAC,WAAW,kBAC/B,KAAC,gBAAgB,IAAC,KAAK,EAAE,KAAK,YAC5B,KAAC,iBAAiB,cAAE,QAAQ,GAAqB,GAChC,GACE,CACxB,CAAC;AACJ,CAAC;AAED,eAAe,qBAAqB,CAAC"}

package/lib/theme/customGlobalStyles.js

@@ -2,27 +2,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import GlobalStyles from '@mui/material/GlobalStyles';
 export default function CustomGlobalStyles() {
     return (_jsx(GlobalStyles, { styles: {
-            '*': {
-                boxSizing: 'border-box'
-            },
-            html: {
-                margin: 0,
-                padding: 0,
-                width: '100%',
-                height: '100%',
-                WebkitOverflowScrolling: 'touch'
-            },
-            body: {
-                margin: 0,
-                padding: 0,
-                width: '100%',
-                height: '100%'
-            },
-            '#root': {
-                width: '100%',
-                height: '100%',
-                textAlign: 'left'
-            },
             input: {
                 '&[type=number]': {
                     MozAppearance: 'textfield',
@@ -35,10 +14,6 @@ export default function CustomGlobalStyles() {
                         WebkitAppearance: 'none'
                     }
                 }
-            },
-            img: {
-                display: 'block',
-                maxWidth: '100%'
             }
         } }));
 }

package/lib/theme/customGlobalStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"customGlobalStyles.js","sourceRoot":"","sources":["../../src/theme/customGlobalStyles.tsx"],"names":[],"mappings":";AAiBA,OAAO,YAAY,MAAM,4BAA4B,CAAC;AAEtD,MAAM,CAAC,OAAO,UAAU,kBAAkB;IACxC,OAAO,CACL,KAAC,YAAY,IACX,MAAM,EAAE;YACN,GAAG,EAAE;gBACH,SAAS,EAAE,YAAY;aACxB;YACD,IAAI,EAAE;gBACJ,MAAM,EAAE,CAAC;gBACT,OAAO,EAAE,CAAC;gBACV,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;gBACd,uBAAuB,EAAE,OAAO;aACjC;YACD,IAAI,EAAE;gBACJ,MAAM,EAAE,CAAC;gBACT,OAAO,EAAE,CAAC;gBACV,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;aACf;YACD,OAAO,EAAE;gBACP,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;gBACd,SAAS,EAAE,MAAM;aAClB;YACD,KAAK,EAAE;gBACL,gBAAgB,EAAE;oBAChB,aAAa,EAAE,WAAW;oBAC1B,8BAA8B,EAAE;wBAC9B,MAAM,EAAE,CAAC;wBACT,gBAAgB,EAAE,MAAM;qBACzB;oBACD,8BAA8B,EAAE;wBAC9B,MAAM,EAAE,CAAC;wBACT,gBAAgB,EAAE,MAAM;qBACzB;iBACF;aACF;YACD,GAAG,EAAE;gBACH,OAAO,EAAE,OAAO;gBAChB,QAAQ,EAAE,MAAM;aACjB;SACF,GACD,CACH,CAAC;AACJ,CAAC"}
+{"version":3,"file":"customGlobalStyles.js","sourceRoot":"","sources":["../../src/theme/customGlobalStyles.tsx"],"names":[],"mappings":";AAiBA,OAAO,YAAY,MAAM,4BAA4B,CAAC;AAEtD,MAAM,CAAC,OAAO,UAAU,kBAAkB;IACxC,OAAO,CACL,KAAC,YAAY,IACX,MAAM,EAAE;YACN,KAAK,EAAE;gBACL,gBAAgB,EAAE;oBAChB,aAAa,EAAE,WAAW;oBAC1B,8BAA8B,EAAE;wBAC9B,MAAM,EAAE,CAAC;wBACT,gBAAgB,EAAE,MAAM;qBACzB;oBACD,8BAA8B,EAAE;wBAC9B,MAAM,EAAE,CAAC;wBACT,gBAAgB,EAAE,MAAM;qBACzB;iBACF;aACF;SACF,GACD,CACH,CAAC;AACJ,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aehrc/smart-forms-renderer",
-  "version": "1.0.0-alpha.92",
+  "version": "1.0.0-alpha.93",
   "description": "FHIR Structured Data Captured (SDC) rendering engine for Smart Forms",
   "main": "lib/index.js",
   "scripts": {

package/src/theme/RendererThemeProvider.tsx

@@ -22,9 +22,9 @@ import {
   StyledEngineProvider,
   ThemeProvider as MUIThemeProvider
 } from '@mui/material/styles';
-import CustomGlobalStyles from './customGlobalStyles';
 import { rendererThemeComponentOverrides } from './overrides/rendererThemeComponentOverrides';
 import { rendererThemeOptions } from './rendererThemeOptions';
+import { ScopedCssBaseline } from '@mui/material';
 
 /**
  * Default theme used by the renderer using Material UI. You can customise your own theme by defining a new ThemeProvider.
@@ -39,8 +39,7 @@ export function RendererThemeProvider({ children }: { children: ReactNode }) {
   return (
     <StyledEngineProvider injectFirst>
       <MUIThemeProvider theme={theme}>
-        <CustomGlobalStyles />
-        <>{children}</>
+        <ScopedCssBaseline>{children}</ScopedCssBaseline>
       </MUIThemeProvider>
     </StyledEngineProvider>
   );

package/src/theme/customGlobalStyles.tsx

@@ -1,65 +0,0 @@
-/*
- * Copyright 2025 Commonwealth Scientific and Industrial Research
- * Organisation (CSIRO) ABN 41 687 119 230.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-import React from 'react';
-import GlobalStyles from '@mui/material/GlobalStyles';
-
-export default function CustomGlobalStyles() {
-  return (
-    <GlobalStyles
-      styles={{
-        '*': {
-          boxSizing: 'border-box'
-        },
-        html: {
-          margin: 0,
-          padding: 0,
-          width: '100%',
-          height: '100%',
-          WebkitOverflowScrolling: 'touch'
-        },
-        body: {
-          margin: 0,
-          padding: 0,
-          width: '100%',
-          height: '100%'
-        },
-        '#root': {
-          width: '100%',
-          height: '100%',
-          textAlign: 'left'
-        },
-        input: {
-          '&[type=number]': {
-            MozAppearance: 'textfield',
-            '&::-webkit-outer-spin-button': {
-              margin: 0,
-              WebkitAppearance: 'none'
-            },
-            '&::-webkit-inner-spin-button': {
-              margin: 0,
-              WebkitAppearance: 'none'
-            }
-          }
-        },
-        img: {
-          display: 'block',
-          maxWidth: '100%'
-        }
-      }}
-    />
-  );
-}