@xylabs/react-webapp 7.1.16 → 7.1.20

package/README.md

@@ -1,67 +1,27 @@
-[![logo][]](https://xylabs.com)
-
 # @xylabs/react-webapp
 
-[![npm-badge][]][npm-link]
-[![npm-downloads-badge][]][npm-link]
-[![jsdelivr-badge][]][jsdelivr-link]
-[![npm-license-badge][]](LICENSE)
-
-> XY Labs generalized React library 
-
-## Table of Contents
+[![npm][npm-badge]][npm-link]
 
--   [Description](#description)
--   [Install](#install)
--   [Maintainers](#maintainers)
--   [License](#license)
--   [Credits](#credits)
-
-## Description
-
-Common React code that is used throughout XYO projects that use React.
+> Common React library for all XY Labs projects that use React
 
 ## Install
 
-Using npm:
-
 ```sh
-npm i --save @xylabs/react-webapp
+npm install {{name}}
 ```
 
-Using yarn:
+or
 
 ```sh
-yarn add @xylabs/react-webapp
+yarn add {{name}}
 ```
 
-## Documentation
-[Developer Reference](https://xylabs.github.io/sdk-react)
-
-[Storybook](https://xylabs.github.io/sdk-react/storybook)
-
-## Maintainers
-
--   [Arie Trouw](https://github.com/arietrouw) ([arietrouw.com](https://arietrouw.com))
--   [Matt Jones](https://github.com/jonesmac)
--   [Joel Carter](https://github.com/JoelBCarter)
--   [Jordan Trouw](https://github.com/jordantrouw)
 
 ## License
 
-See the [LICENSE](LICENSE) file for license details
+See the [LICENSE](LICENSE) file for license rights and limitations (LGPL-3.0-only).
 
-## Credits
 
-[Made with 🔥and ❄️ by XY Labs](https://xylabs.com)
-
-[logo]: https://cdn.xy.company/img/brand/XYPersistentCompany_Logo_Icon_Colored.svg
 
 [npm-badge]: https://img.shields.io/npm/v/@xylabs/react-webapp.svg
 [npm-link]: https://www.npmjs.com/package/@xylabs/react-webapp
-
-[npm-downloads-badge]: https://img.shields.io/npm/dw/@xylabs/react-webapp
-[npm-license-badge]: https://img.shields.io/npm/l/@xylabs/react-webapp
-
-[jsdelivr-badge]: https://data.jsdelivr.com/v1/package/npm/@xylabs/react-webapp/badge
-[jsdelivr-link]: https://www.jsdelivr.com/package/npm/@xylabs/react-webapp

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xylabs/react-webapp",
-  "version": "7.1.16",
+  "version": "7.1.20",
   "description": "Common React library for all XY Labs projects that use React",
   "keywords": [
     "utility",
@@ -31,60 +31,69 @@
         "default": "./dist/browser/index.mjs"
       },
       "types": "./dist/browser/index.d.ts",
+      "import": "./dist/browser/index.mjs",
       "default": "./dist/browser/index.mjs"
     },
     "./package.json": "./package.json"
   },
-  "module": "dist/browser/index.mjs",
   "types": "dist/browser/index.d.ts",
   "files": [
     "dist",
-    "src"
+    "README.md"
   ],
   "dependencies": {
-    "@xylabs/react-app-settings": "~7.1.16",
-    "@xylabs/react-appbar": "~7.1.16",
-    "@xylabs/react-async-effect": "~7.1.16",
-    "@xylabs/react-button": "~7.1.16",
-    "@xylabs/react-error": "~7.1.16",
-    "@xylabs/react-flexbox": "~7.1.16",
-    "@xylabs/react-pixel": "~7.1.16",
-    "@xylabs/react-shared": "~7.1.16",
-    "@xylabs/sdk-js": "~5.0.65",
-    "react-helmet": "~6.1.0"
+    "@xylabs/sdk-js": "~5.0.95",
+    "react-router-dom": "~7.14.0",
+    "@xylabs/react-app-settings": "~7.1.20",
+    "@xylabs/react-appbar": "~7.1.20",
+    "@xylabs/react-button": "~7.1.20",
+    "@xylabs/react-error": "~7.1.20",
+    "@xylabs/react-flexbox": "~7.1.20",
+    "@xylabs/react-shared": "~7.1.20",
+    "@xylabs/react-pixel": "~7.1.20"
   },
   "devDependencies": {
-    "@mui/icons-material": "~7.3.7",
-    "@mui/material": "~7.3.7",
-    "@storybook/react-vite": "~10.2.3",
-    "@types/react": "^19.2.10",
+    "@mui/material": "~7.3.9",
+    "@opentelemetry/api": "^1.9.1",
+    "@storybook/react-vite": "~10.3.4",
+    "@types/node": "~25.5.2",
+    "@types/react": "^19.2.14",
     "@types/react-helmet": "~6.1.11",
-    "@xylabs/react-button": "~7.1.16",
-    "@xylabs/react-flexbox": "~7.1.16",
-    "@xylabs/react-link": "~7.1.16",
-    "@xylabs/react-pixel": "~7.1.16",
-    "@xylabs/ts-scripts-yarn3": "~7.3.2",
-    "@xylabs/tsconfig": "~7.3.2",
-    "@xylabs/tsconfig-dom": "~7.3.2",
-    "@xylabs/tsconfig-react": "~7.3.2",
+    "@xylabs/ts-scripts-common": "~7.8.5",
+    "@xylabs/ts-scripts-pnpm": "~7.8.5",
+    "@xylabs/tsconfig": "~7.8",
+    "@xylabs/tsconfig-dom": "~7.8.5",
+    "@xylabs/tsconfig-react": "~7.8.5",
+    "@xylabs/zod": "~5.0.95",
+    "axios": "^1.14.0",
+    "esbuild": "^0.28.0",
+    "pako": "~2.1.0",
     "react": "^19.2.4",
     "react-dom": "^19.2.4",
-    "react-router-dom": "^7.13.0",
-    "storybook": "~10.2.3",
+    "react-helmet": "~6.1.0",
+    "react-is": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+    "storybook": "~10.3.4",
     "typescript": "^5.9.3",
-    "vite": "~7.3.1",
-    "zod": "^4.3.6"
+    "vite": "~8.0.5",
+    "zod": "^4.3.6",
+    "@xylabs/react-async-effect": "~7.1.20",
+    "@xylabs/react-dialogs": "~7.1.20",
+    "@xylabs/react-link": "~7.1.20",
+    "@xylabs/react-promise": "~7.1.20",
+    "@xylabs/react-quick-tip-button": "~7.1.20"
   },
   "peerDependencies": {
-    "@mui/icons-material": ">=6 <8",
     "@mui/material": ">=6 <8",
+    "@xylabs/zod": "~5.0.95",
+    "pako": "~2.1.0",
     "react": "^19",
-    "react-dom": "^19",
-    "react-router-dom": "^7",
-    "zod": "^4"
+    "react-helmet": "~6.1.0",
+    "react-is": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+    "@xylabs/react-quick-tip-button": "~7.1.20",
+    "@xylabs/react-async-effect": "~7.1.20"
   },
   "publishConfig": {
     "access": "public"
   },
   "docs": "dist/docs.json"
-}
+}

package/dist/browser/components/Chrome.stories.d.ts

@@ -1,9 +0,0 @@
-import type { Meta } from '@storybook/react-vite';
-import { WebAppChrome } from './Chrome.tsx';
-declare const StorybookEntry: Meta<typeof WebAppChrome>;
-declare const Default: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./Chrome.tsx").WebAppChromeProps>;
-declare const DefaultSideBar: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./Chrome.tsx").WebAppChromeProps>;
-declare const WithFixedSizePage: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./Chrome.tsx").WebAppChromeProps>;
-export { Default, DefaultSideBar, WithFixedSizePage, };
-export default StorybookEntry;
-//# sourceMappingURL=Chrome.stories.d.ts.map

package/dist/browser/components/Chrome.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Chrome.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Chrome.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,uBAAuB,CAAA;AAO1D,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAA;AAI3C,QAAA,MAAM,cAAc,EAKf,IAAI,CAAC,OAAO,YAAY,CAAC,CAAA;AAwC9B,QAAA,MAAM,OAAO,uIAAoB,CAAA;AAGjC,QAAA,MAAM,cAAc,uIAAoB,CAAA;AAGxC,QAAA,MAAM,iBAAiB,uIAAoB,CAAA;AAG3C,OAAO,EACL,OAAO,EAAE,cAAc,EAAE,iBAAiB,GAC3C,CAAA;AAED,eAAe,cAAc,CAAA"}

package/dist/browser/components/NotFoundPage/Page.stories.d.ts

@@ -1,10 +0,0 @@
-import type { Meta } from '@storybook/react-vite';
-import { NotFound } from '@xylabs/react-shared';
-import React from 'react';
-declare const StorybookEntry: Meta<typeof NotFound>;
-declare const Default: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & import("@mui/material/OverridableComponent").CommonProps & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("@mui/material/OverridableComponent").CommonProps | keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & {
-    component?: React.ElementType;
-}>;
-export { Default };
-export default StorybookEntry;
-//# sourceMappingURL=Page.stories.d.ts.map

package/dist/browser/components/NotFoundPage/Page.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Page.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/NotFoundPage/Page.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,uBAAuB,CAAA;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAA;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,QAAA,MAAM,cAAc,EAKf,IAAI,CAAC,OAAO,QAAQ,CAAC,CAAA;AAM1B,QAAA,MAAM,OAAO;;EAAoB,CAAA;AAGjC,OAAO,EAAE,OAAO,EAAE,CAAA;AAElB,eAAe,cAAc,CAAA"}

package/src/components/Body.tsx

@@ -1,102 +0,0 @@
-import type { Breakpoint } from '@mui/material'
-import { styled } from '@mui/material'
-import type { FlexBoxProps } from '@xylabs/react-flexbox'
-import { FlexGrowCol, FlexRow } from '@xylabs/react-flexbox'
-import type { ReactNode } from 'react'
-import React from 'react'
-
-import { fixedContent, scrollableContent } from './lib/index.ts'
-
-const WebAppBodyName = 'WebAppBody'
-const propsNotForwarded = new Set(['mobileScrollingBreakpoint', 'variant', 'spacing', 'disableBreadcrumbGutter'])
-const defaultStyledOptions = { shouldForwardProp: (prop: string) => !propsNotForwarded.has(prop) }
-
-const WebAppBodyRoot = styled(FlexGrowCol, {
-  ...defaultStyledOptions,
-  name: WebAppBodyName,
-  slot: 'Root',
-})<WebAppBodyProps>(({
-  spacing, theme, mobileScrollingBreakpoint = 'sm', variant,
-}) => {
-  const scrollable = variant === 'scrollable'
-  return theme.unstable_sx({
-    alignItems: 'stretch',
-    gap: 1,
-    justifyContent: 'flex-start',
-    overflowX: 'visible',
-    overflowY: scrollable ? 'scroll' : 'hidden',
-    paddingY: spacing,
-    [theme.breakpoints.down(mobileScrollingBreakpoint)]: { overflowY: 'scroll' },
-  })
-})
-
-const WebAppBodyBreadcrumb = styled(FlexRow, {
-  ...defaultStyledOptions,
-  name: WebAppBodyName,
-  slot: 'Breadcrumb',
-})<WebAppBodyProps>(({
-  theme, disableBreadcrumbGutter, spacing,
-}) =>
-  theme.unstable_sx({
-    justifyContent: 'start',
-    marginX: disableBreadcrumbGutter ? 0 : spacing,
-  }))
-
-const WebAppBodyScrollableWrapper = styled(FlexGrowCol, {
-  name: WebAppBodyName,
-  slot: 'ScrollableWrapper',
-})<WebAppBodyProps>(() => ({ alignItems: 'stretch' }))
-
-const WebAppBodyScrollable = styled(FlexGrowCol, {
-  ...defaultStyledOptions,
-  name: WebAppBodyName,
-  slot: 'Scrollable',
-})<WebAppBodyProps>(({
-  theme, mobileScrollingBreakpoint = 'sm', variant,
-}) => {
-  const props = variant === 'scrollable' ? scrollableContent : fixedContent
-  return {
-    ...props,
-    alignItems: 'stretch',
-    justifyContent: 'start',
-    [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
-      inset: 'unset',
-      position: 'relative',
-    },
-  }
-})
-
-export interface WebAppBodyProps extends FlexBoxProps {
-  breadcrumbs?: ReactNode
-  disableBreadcrumbGutter?: boolean
-  mobileScrollingBreakpoint?: Breakpoint
-  spacing?: string | number
-  variant?: 'scrollable' | 'fixed'
-}
-
-export const WebAppBody: React.FC<WebAppBodyProps> = ({
-  children,
-  breadcrumbs,
-  disableBreadcrumbGutter,
-  mobileScrollingBreakpoint,
-  spacing = 1,
-  variant,
-  ...props
-}) => {
-  return (
-    <WebAppBodyRoot mobileScrollingBreakpoint={mobileScrollingBreakpoint} spacing={spacing} variant={variant} {...props}>
-      {breadcrumbs
-        ? (
-            <WebAppBodyBreadcrumb disableBreadcrumbGutter={disableBreadcrumbGutter} spacing={spacing}>
-              {breadcrumbs}
-            </WebAppBodyBreadcrumb>
-          )
-        : null}
-      <WebAppBodyScrollableWrapper>
-        <WebAppBodyScrollable mobileScrollingBreakpoint={mobileScrollingBreakpoint} variant={variant}>
-          {children}
-        </WebAppBodyScrollable>
-      </WebAppBodyScrollableWrapper>
-    </WebAppBodyRoot>
-  )
-}

package/src/components/Chrome.stories.tsx

@@ -1,71 +0,0 @@
-import { Breadcrumbs, List } from '@mui/material'
-import type { Meta, StoryFn } from '@storybook/react-vite'
-import { MenuListItemContainer } from '@xylabs/react-appbar'
-import { FlexRow } from '@xylabs/react-flexbox'
-import { LinkEx } from '@xylabs/react-link'
-import React from 'react'
-import { BrowserRouter } from 'react-router-dom'
-
-import { WebAppChrome } from './Chrome.tsx'
-import type { WebAppPageProps } from './Page.tsx'
-import { WebAppPage } from './Page.tsx'
-
-const StorybookEntry = {
-  argTypes: {},
-  component: WebAppChrome,
-  parameters: { docs: { page: null } },
-  title: 'webapp/WebAppChrome',
-} as Meta<typeof WebAppChrome>
-
-const rowArray = [32, 64, 128, 256, 512, 1024]
-
-const Children: React.FC<WebAppPageProps> = props => (
-  <WebAppPage
-    breadcrumbs={(
-      <Breadcrumbs>
-        <LinkEx>BreadCrumbs</LinkEx>
-      </Breadcrumbs>
-    )}
-    {...props}
-  >
-    {rowArray.map((height) => {
-      return (
-        <FlexRow key={height} height={height}>
-          {height}
-        </FlexRow>
-      )
-    })}
-  </WebAppPage>
-)
-
-const Template: StoryFn<typeof WebAppChrome> = (args) => {
-  return (
-    <BrowserRouter>
-      <WebAppChrome
-        menuItems={(
-          <List>
-            <MenuListItemContainer primary="Hello" />
-          </List>
-        )}
-        height="calc(100vh - 2rem)"
-        {...args}
-      >
-      </WebAppChrome>
-    </BrowserRouter>
-  )
-}
-
-const Default = Template.bind({})
-Default.args = {}
-
-const DefaultSideBar = Template.bind({})
-DefaultSideBar.args = { children: <Children />, navigationType: 'sidebar' }
-
-const WithFixedSizePage = Template.bind({})
-WithFixedSizePage.args = { children: <Children variant="fixed" />, navigationType: 'sidebar' }
-
-export {
-  Default, DefaultSideBar, WithFixedSizePage,
-}
-
-export default StorybookEntry

package/src/components/Chrome.tsx

@@ -1,67 +0,0 @@
-import { Divider, Paper } from '@mui/material'
-import type { WebAppNavigationType } from '@xylabs/react-app-settings'
-import { ApplicationAppBar, SystemToolbar } from '@xylabs/react-appbar'
-import { ErrorBoundary } from '@xylabs/react-error'
-import type { FlexBoxProps } from '@xylabs/react-flexbox'
-import {
-  FlexCol, FlexGrowCol, FlexGrowRow,
-} from '@xylabs/react-flexbox'
-import type { ReactNode } from 'react'
-import React from 'react'
-import { Helmet } from 'react-helmet'
-
-import { WebAppErrorPage } from './ErrorPage.tsx'
-
-export interface WebAppChromeProps extends FlexBoxProps {
-  appName: string
-  appbar?: ReactNode
-  errorBoundary?: boolean
-  errorPage?: ReactNode
-  footer?: ReactNode
-  footerElevation?: number
-  menuItems?: ReactNode
-  navigationType?: WebAppNavigationType
-}
-
-export const WebAppChrome = ({
-  ref, appName, appbar, children, errorBoundary, errorPage, footer, footerElevation = 4, menuItems, navigationType = 'menu', ...props
-}: WebAppChromeProps) => {
-  return (
-    <FlexCol id="web-chrome-flex" alignItems="stretch" overflow="hidden" height="100vh" ref={ref} {...props}>
-      <Helmet defaultTitle={appName} titleTemplate={`%s | ${appName}`}>
-        <meta content="website" property="og:type" />
-      </Helmet>
-      {appbar ?? <ApplicationAppBar systemToolbar={<SystemToolbar menuItems={navigationType === 'menu' ? menuItems : undefined} />} />}
-      <FlexGrowRow id="sidebar-nav-flex" overflow="hidden" alignItems="stretch">
-        {navigationType === 'menu'
-          ? null
-          : (
-              <>
-                {menuItems}
-                <Divider orientation="vertical" />
-              </>
-            )}
-        <FlexGrowCol id="main-flex" justifyContent="flex-start" alignItems="stretch">
-          {errorBoundary
-            ? (
-                <ErrorBoundary
-                  fallbackWithError={(error) => {
-                    return errorPage ?? <WebAppErrorPage error={error} />
-                  }}
-                >
-                  {children}
-                </ErrorBoundary>
-              )
-            : children}
-        </FlexGrowCol>
-      </FlexGrowRow>
-      <FlexCol id="footer-flex" alignItems="stretch">
-        <Paper elevation={footerElevation} square>
-          {footer}
-        </Paper>
-      </FlexCol>
-    </FlexCol>
-  )
-}
-
-WebAppChrome.displayName = 'WebAppChrome'

package/src/components/ErrorPage.tsx

@@ -1,22 +0,0 @@
-import { ButtonEx } from '@xylabs/react-button'
-import React from 'react'
-
-import type { WebAppPageProps } from './Page.tsx'
-import { WebAppPage } from './Page.tsx'
-
-export interface WebAppErrorPageProps extends WebAppPageProps {
-  error?: Error
-}
-
-export const WebAppErrorPage: React.FC<WebAppErrorPageProps> = ({ error, ...props }) => (
-  <WebAppPage title="Oops! Something went wrong" {...props}>
-    <h1>Oops! Something went wrong!</h1>
-    <p>{`${error}`}</p>
-    <ButtonEx href="/" variant="contained">
-      Homepage
-    </ButtonEx>
-  </WebAppPage>
-)
-
-/** @deprecated use WebAppErrorPage instead */
-export const ErrorPage = WebAppErrorPage

package/src/components/NotFoundPage/Page.stories.tsx

@@ -1,21 +0,0 @@
-import type { Meta, StoryFn } from '@storybook/react-vite'
-import { NotFound } from '@xylabs/react-shared'
-import React from 'react'
-
-const StorybookEntry = {
-  argTypes: {},
-  component: NotFound,
-  parameters: { docs: { page: null } },
-  title: 'webapp/NotFound',
-} as Meta<typeof NotFound>
-
-const Template: StoryFn<typeof NotFound> = () => {
-  return <NotFound />
-}
-
-const Default = Template.bind({})
-Default.args = {}
-
-export { Default }
-
-export default StorybookEntry

package/src/components/NotFoundPage/Page.tsx

@@ -1,14 +0,0 @@
-import { NotFound } from '@xylabs/react-shared'
-import React from 'react'
-
-import type { WebAppPageProps } from '../Page.tsx'
-import { WebAppPage } from '../Page.tsx'
-
-export const WebAppNotFoundPage: React.FC<WebAppPageProps> = ({ title, ...props }) => (
-  <WebAppPage title={title ?? 'Sorry! Page Not Found'} {...props}>
-    <NotFound />
-  </WebAppPage>
-)
-
-/** @deprecated  use WebAppNotFoundPage instead */
-export const NotFoundPage = WebAppNotFoundPage

package/src/components/NotFoundPage/index.ts

@@ -1 +0,0 @@
-export * from './Page.tsx'

package/src/components/Page.tsx

@@ -1,103 +0,0 @@
-import type { ContainerProps } from '@mui/material'
-import { Container, styled } from '@mui/material'
-import { useAsyncEffect } from '@xylabs/react-async-effect'
-import type { FlexBoxProps } from '@xylabs/react-flexbox'
-import { FlexGrowCol } from '@xylabs/react-flexbox'
-import { useUserEvents } from '@xylabs/react-pixel'
-import { isDefined } from '@xylabs/sdk-js'
-import type { PropsWithChildren } from 'react'
-import React from 'react'
-import { Helmet } from 'react-helmet'
-import { useLocation } from 'react-router-dom'
-
-import type { WebAppBodyProps } from './Body.tsx'
-import { WebAppBody } from './Body.tsx'
-import { fixedWrap, scrollableWrap } from './lib/index.ts'
-
-const WebAppPageRoot = styled(FlexGrowCol, {
-  name: 'WebAppPage',
-  shouldForwardProp: propName => propName !== 'mobileScrollingBreakpoint' && propName !== 'variant',
-  slot: 'Root',
-})<WebAppPageProps>(({
-  theme, mobileScrollingBreakpoint = 'sm', variant,
-}) => {
-  const props = variant === 'scrollable' ? scrollableWrap : fixedWrap
-  return {
-    ...props,
-    alignItems: 'stretch',
-    justifyContent: 'start',
-    maxWidth: '100vw',
-    [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
-      inset: 0,
-      position: 'absolute',
-    },
-  }
-})
-
-export interface WebAppPageProps extends WebAppBodyProps, FlexBoxProps {
-  container?: ContainerProps['maxWidth'] | 'none'
-  disableGutters?: boolean
-}
-
-export const WebAppPage: React.FC<PropsWithChildren<WebAppPageProps>> = ({
-  disableGutters,
-  disableBreadcrumbGutter,
-  title,
-  container,
-  children,
-  breadcrumbs,
-  mobileScrollingBreakpoint,
-  variant = 'scrollable',
-  ...props
-}) => {
-  const userEvents = useUserEvents()
-  const { pathname } = useLocation()
-
-  useAsyncEffect(
-    async () => {
-      await userEvents?.viewContent({ name: title ?? 'NodeBasePage', path: location.pathname })
-    },
-    [pathname, title, userEvents],
-  )
-
-  return (
-    <WebAppPageRoot mobileScrollingBreakpoint={mobileScrollingBreakpoint} variant={variant} {...props}>
-      <Helmet title={title} />
-      {isDefined(container) && container !== 'none'
-        ? (
-            <Container
-              disableGutters={disableGutters}
-              style={{
-                alignItems: 'stretch', display: 'flex', flexDirection: 'column', flexGrow: 1, justifyContent: 'flex-start',
-              }}
-              maxWidth={container}
-            >
-              <WebAppBody
-                disableBreadcrumbGutter={disableBreadcrumbGutter}
-                breadcrumbs={breadcrumbs}
-                mobileScrollingBreakpoint={mobileScrollingBreakpoint}
-                variant={variant}
-                {...props}
-              >
-                {children}
-              </WebAppBody>
-            </Container>
-          )
-        : (
-            <WebAppBody
-              disableBreadcrumbGutter={disableBreadcrumbGutter}
-              breadcrumbs={breadcrumbs}
-              mobileScrollingBreakpoint={mobileScrollingBreakpoint}
-              paddingX={disableGutters ? 0 : 1}
-              variant={variant}
-              {...props}
-            >
-              {children}
-            </WebAppBody>
-          )}
-    </WebAppPageRoot>
-  )
-}
-
-/** @deprecated use WebAppPagePage instead */
-export const FlexPage = WebAppPage

package/src/components/index.ts

@@ -1,5 +0,0 @@
-export * from './Body.tsx'
-export * from './Chrome.tsx'
-export * from './ErrorPage.tsx'
-export * from './NotFoundPage/index.ts'
-export * from './Page.tsx'

package/src/components/lib/cssValues.ts

@@ -1,16 +0,0 @@
-import type { CSSProperties } from 'react'
-
-export const scrollableWrap: CSSProperties = {
-  inset: 0,
-  position: 'absolute',
-} as const
-
-export const fixedWrap: CSSProperties = {
-  inset: 'unset',
-  position: 'relative',
-} as const
-
-// Making a scrollable vs fixed wrapper and content is an inversion of the wrap and content styles
-export const scrollableContent: CSSProperties = { ...fixedWrap } as const
-
-export const fixedContent: CSSProperties = { ...scrollableWrap } as const

package/src/components/lib/index.ts

@@ -1 +0,0 @@
-export * from './cssValues.ts'

package/src/index.ts

@@ -1 +0,0 @@
-export * from './components/index.ts'