@equinor/fusion-react-layout 0.1.1 → 0.1.2

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @equinor/fusion-react-layout
 
+## 0.1.2
+
+### Patch Changes
+
+- 934e52c: Forward props from `Page` and its compound slot components to their underlying elements.
+  
+  Update the underlying layout and page web components to constrain content to the available height, preventing nested content from expanding the viewport and allowing main content to scroll correctly.
+
 ## 0.1.1
 
 ### Patch Changes

package/dist/components/page/index.d.ts

@@ -1,9 +1,11 @@
 import type { PropsWithChildren, ReactNode } from 'react';
+import type { ComponentProps } from '@equinor/fusion-react-utils';
 import '@equinor/fusion-wc-page';
-type PageComponent = ((props: PropsWithChildren) => ReactNode) & {
-    Header: (props: PropsWithChildren) => ReactNode;
-    Main: (props: PropsWithChildren) => ReactNode;
-    Footer: (props: PropsWithChildren) => ReactNode;
+export type PageProps = ComponentProps<HTMLDivElement, PropsWithChildren>;
+type PageComponent = ((props: PageProps) => ReactNode) & {
+    Header: (props: PageProps) => ReactNode;
+    Main: (props: PageProps) => ReactNode;
+    Footer: (props: PageProps) => ReactNode;
     displayName?: string;
 };
 /**

package/dist/components/page/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/page/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE1D,OAAO,yBAAyB,CAAC;AAEjC,KAAK,aAAa,GAAG,CAAC,CAAC,KAAK,EAAE,iBAAiB,KAAK,SAAS,CAAC,GAAG;IAC/D,MAAM,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,SAAS,CAAC;IAChD,IAAI,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,SAAS,CAAC;IAC9C,MAAM,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,SAAS,CAAC;IAChD,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,IAAI,EAAE,aAGlB,CAAC;eA0Ba,IAAI"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/page/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAElE,OAAO,yBAAyB,CAAC;AAEjC,MAAM,MAAM,SAAS,GAAG,cAAc,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAE1E,KAAK,aAAa,GAAG,CAAC,CAAC,KAAK,EAAE,SAAS,KAAK,SAAS,CAAC,GAAG;IACvD,MAAM,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,SAAS,CAAC;IACxC,IAAI,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,SAAS,CAAC;IACtC,MAAM,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,SAAS,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,IAAI,EAAE,aAGlB,CAAC;eAsCa,IAAI"}

package/dist/components/page/index.js

@@ -4,24 +4,24 @@ import '@equinor/fusion-wc-page';
  * Wraps the Fusion page web component and exposes compound components for
  * assigning children to the page header, main, and footer slots.
  */
-export const Page = ({ children }) => {
+export const Page = ({ children, ...props }) => {
     /* @ts-expect-error fwc-page is a web component */
-    return _jsx("fwc-page", { children: children });
+    return _jsx("fwc-page", { ...props, children: children });
 };
 Page.displayName = 'Page';
-const Header = ({ children }) => {
+const Header = ({ children, ...props }) => {
     // The underlying web component projects this content into its header slot.
-    return _jsx("div", { slot: "header", children: children });
+    return (_jsx("div", { slot: "header", ...props, children: children }));
 };
 Header.displayName = 'Page.Header';
-const Main = ({ children }) => {
+const Main = ({ children, ...props }) => {
     // The underlying web component projects this content into its main slot.
-    return _jsx("div", { slot: "main", children: children });
+    return (_jsx("div", { slot: "main", style: { height: '100%' }, ...props, children: children }));
 };
 Main.displayName = 'Page.Main';
-const Footer = ({ children }) => {
+const Footer = ({ children, ...props }) => {
     // The underlying web component projects this content into its footer slot.
-    return _jsx("div", { slot: "footer", children: children });
+    return (_jsx("div", { slot: "footer", ...props, children: children }));
 };
 Footer.displayName = 'Page.Footer';
 // Compound components mirror the slots supported by the underlying web component.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/fusion-react-layout",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "Fusion React Layout Component.",
   "keywords": [
     "react",
@@ -57,11 +57,11 @@
     "url": "https://github.com/equinor/fusion-react-components/issues"
   },
   "dependencies": {
-    "@equinor/fusion-wc-layout": "^0.0.0",
-    "@equinor/fusion-wc-page": "^0.0.0"
+    "@equinor/fusion-wc-layout": "^0.1.2",
+    "@equinor/fusion-wc-page": "^0.1.2"
   },
   "devDependencies": {
-    "@types/react": "^19.2.14",
+    "@types/react": "^19.2.18",
     "react": "^19.2.8"
   },
   "peerDependencies": {