@genesislcap/foundation-react-utils 15.28.1 → 15.29.0

package/README.md

@@ -16,6 +16,37 @@ Add the package to your `package.json` dependencies. After changing dependencies
 }
 ```
 
+## flexlayout-react
+
+`flexlayout-react` is re-exported from the `./flexlayout` entry point at a version this package
+pins, so apps neither declare nor upgrade it themselves:
+
+```ts
+import { Actions, DockLocation, Layout, Model, TabNode } from '@genesislcap/foundation-react-utils/flexlayout';
+```
+
+The entry point re-exports the whole `flexlayout-react` API and installs the Rapid Design System
+theme for it into the document on import. No stylesheet import is needed, and `flexlayout-react`'s
+own stylesheets should not be imported — they are the unthemed upstream defaults. Colours resolve
+from Rapid design tokens, so render the layout under a `<rapid-design-system-provider>`.
+
+Styles adopted into the document do not cross a shadow boundary, so a layout mounted inside a
+shadow root needs the theme adopted there as well:
+
+```ts
+import { installRapidFlexLayoutReactStyles } from '@genesislcap/foundation-react-utils/flexlayout';
+
+installRapidFlexLayoutReactStyles(myShadowRoot);
+```
+
+### Migrating an app that depends on flexlayout-react directly
+
+Remove `flexlayout-react` from the app's `package.json`, drop any `flexlayout-react/style/*.css`
+import, and point the remaining imports at `./flexlayout`. Keeping the app-level dependency risks
+resolving a second copy of the library, which breaks the `instanceof` checks `flexlayout-react`
+relies on internally; the entry point logs a warning when the version it loads differs from the one
+the theme was generated against.
+
 ## License
 
 Note: this project provides front-end dependencies and uses licensed components listed in the next section; thus, licenses for those components are required during development. Contact [Genesis Global](https://genesis.global/contact-us/) for more details.

package/dist/custom-elements.json

@@ -264,6 +264,29 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/flexlayout/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "flexlayout-react"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "installRapidFlexLayoutReactStyles",
+          "declaration": {
+            "name": "installRapidFlexLayoutReactStyles",
+            "module": "src/flexlayout/index.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/router/index.ts",

package/dist/dts/flexlayout/index.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Platform-owned `flexlayout-react` entry point.
+ *
+ * Importing from here (rather than from `flexlayout-react` directly) means the app does not
+ * declare, pin or upgrade `flexlayout-react` itself, and does not have to install the theme:
+ *
+ *  - the version is pinned by this package, so every app runs the version the platform
+ *    theme was generated against;
+ *  - the Rapid Design System flexlayout theme is installed into the document on import.
+ *
+ * Colours resolve from Rapid design tokens, so render under a `<rapid-design-system-provider>`.
+ *
+ * Maintainers: the theme install below is a top-level side effect, so this module's built path
+ * must stay listed in the package's `sideEffects` array — otherwise a consumer's production
+ * bundle keeps the re-exports and silently drops the install. Moving or renaming this file means
+ * updating that array too; `side-effects.test.ts` enforces both and explains the failure mode.
+ */
+import { installRapidFlexLayoutReactStyles } from '@genesislcap/rapid-design-system';
+export * from 'flexlayout-react';
+/**
+ * Install the platform theme into a shadow root, for apps that mount flexlayout-react inside
+ * shadow DOM (styles adopted into the document do not cross a shadow boundary).
+ */
+export { installRapidFlexLayoutReactStyles };
+//# sourceMappingURL=index.d.ts.map

package/dist/dts/flexlayout/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/flexlayout/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAEL,iCAAiC,EAClC,MAAM,kCAAkC,CAAC;AAG1C,cAAc,kBAAkB,CAAC;AAEjC;;;GAGG;AACH,OAAO,EAAE,iCAAiC,EAAE,CAAC"}

package/dist/dts/index.d.ts

@@ -12,6 +12,12 @@
  *   grid's `gridComponents` property).
  * - `reactFactory` / `reactFactoryWithProvider` — mount React component trees into
  *   Genesis Foundation layout regions.
+ *
+ * Subpath entry points:
+ * - `./flexlayout` — `flexlayout-react` at the version this package pins, re-exported with the
+ *   Rapid Design System theme for it installed on import. Import from there rather than adding
+ *   `flexlayout-react` to an app's own dependencies.
+ * - `./router` — route table helpers (`renderAppRoutes` and friends).
  */
 export { reactFactory, reactFactoryWithProvider } from './react-layout-factory';
 export { createReactRenderer } from './create-react-renderer';

package/dist/dts/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAE,YAAY,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AAChF,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,yBAAyB,EAAE,MAAM,iCAAiC,CAAC;AAC5E,OAAO,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAC1E,YAAY,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACzE,YAAY,EACV,0BAA0B,EAC1B,wBAAwB,EACxB,wBAAwB,GACzB,MAAM,iCAAiC,CAAC;AACzC,YAAY,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,OAAO,EAAE,YAAY,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AAChF,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,yBAAyB,EAAE,MAAM,iCAAiC,CAAC;AAC5E,OAAO,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAC1E,YAAY,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACzE,YAAY,EACV,0BAA0B,EAC1B,wBAAwB,EACxB,wBAAwB,GACzB,MAAM,iCAAiC,CAAC;AACzC,YAAY,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAC"}

package/dist/esm/flexlayout/index.js

@@ -0,0 +1,35 @@
+/**
+ * Platform-owned `flexlayout-react` entry point.
+ *
+ * Importing from here (rather than from `flexlayout-react` directly) means the app does not
+ * declare, pin or upgrade `flexlayout-react` itself, and does not have to install the theme:
+ *
+ *  - the version is pinned by this package, so every app runs the version the platform
+ *    theme was generated against;
+ *  - the Rapid Design System flexlayout theme is installed into the document on import.
+ *
+ * Colours resolve from Rapid design tokens, so render under a `<rapid-design-system-provider>`.
+ *
+ * Maintainers: the theme install below is a top-level side effect, so this module's built path
+ * must stay listed in the package's `sideEffects` array — otherwise a consumer's production
+ * bundle keeps the re-exports and silently drops the install. Moving or renaming this file means
+ * updating that array too; `side-effects.test.ts` enforces both and explains the failure mode.
+ */
+import { RAPID_FLEXLAYOUT_REACT_VERSION, installRapidFlexLayoutReactStyles, } from '@genesislcap/rapid-design-system';
+import { FlexLayoutVersion } from 'flexlayout-react';
+export * from 'flexlayout-react';
+/**
+ * Install the platform theme into a shadow root, for apps that mount flexlayout-react inside
+ * shadow DOM (styles adopted into the document do not cross a shadow boundary).
+ */
+export { installRapidFlexLayoutReactStyles };
+// Guarded so a Node-side import (unit test, SSR, tooling) does not throw on `document`.
+if (typeof document !== 'undefined') {
+    installRapidFlexLayoutReactStyles();
+    if (FlexLayoutVersion !== RAPID_FLEXLAYOUT_REACT_VERSION) {
+        // eslint-disable-next-line no-console
+        console.warn(`[foundation-react-utils] flexlayout-react ${FlexLayoutVersion} is loaded but the theme ` +
+            `was generated against ${RAPID_FLEXLAYOUT_REACT_VERSION}. Remove any app-level ` +
+            `flexlayout-react dependency so a single copy resolves.`);
+    }
+}

package/dist/esm/index.js

@@ -12,6 +12,12 @@
  *   grid's `gridComponents` property).
  * - `reactFactory` / `reactFactoryWithProvider` — mount React component trees into
  *   Genesis Foundation layout regions.
+ *
+ * Subpath entry points:
+ * - `./flexlayout` — `flexlayout-react` at the version this package pins, re-exported with the
+ *   Rapid Design System theme for it installed on import. Import from there rather than adding
+ *   `flexlayout-react` to an app's own dependencies.
+ * - `./router` — route table helpers (`renderAppRoutes` and friends).
  */
 export { reactFactory, reactFactoryWithProvider } from './react-layout-factory';
 export { createReactRenderer } from './create-react-renderer';

package/package.json

@@ -1,8 +1,10 @@
 {
   "name": "@genesislcap/foundation-react-utils",
   "description": "Genesis Foundation React Utils",
-  "version": "15.28.1",
-  "sideEffects": false,
+  "version": "15.29.0",
+  "sideEffects": [
+    "./dist/esm/flexlayout/index.js"
+  ],
   "license": "SEE LICENSE IN license.txt",
   "main": "dist/esm/index.js",
   "types": "dist/dts/index.d.ts",
@@ -15,12 +17,19 @@
       "types": "./dist/dts/router/index.d.ts",
       "default": "./dist/esm/router/index.js"
     },
+    "./flexlayout": {
+      "types": "./dist/dts/flexlayout/index.d.ts",
+      "default": "./dist/esm/flexlayout/index.js"
+    },
     "./package.json": "./package.json"
   },
   "typesVersions": {
     "*": {
       "router": [
         "./dist/dts/router/index.d.ts"
+      ],
+      "flexlayout": [
+        "./dist/dts/flexlayout/index.d.ts"
       ]
     }
   },
@@ -47,13 +56,13 @@
     }
   },
   "devDependencies": {
-    "@genesislcap/foundation-testing": "15.28.1",
-    "@genesislcap/genx": "15.28.1",
-    "@genesislcap/rollup-builder": "15.28.1",
-    "@genesislcap/ts-builder": "15.28.1",
-    "@genesislcap/uvu-playwright-builder": "15.28.1",
-    "@genesislcap/vite-builder": "15.28.1",
-    "@genesislcap/webpack-builder": "15.28.1",
+    "@genesislcap/foundation-testing": "15.29.0",
+    "@genesislcap/genx": "15.29.0",
+    "@genesislcap/rollup-builder": "15.29.0",
+    "@genesislcap/ts-builder": "15.29.0",
+    "@genesislcap/uvu-playwright-builder": "15.29.0",
+    "@genesislcap/vite-builder": "15.29.0",
+    "@genesislcap/webpack-builder": "15.29.0",
     "react-router-dom": "^7.1.3"
   },
   "peerDependencies": {
@@ -67,12 +76,14 @@
     }
   },
   "dependencies": {
-    "@genesislcap/foundation-forms": "15.28.1",
-    "@genesislcap/foundation-layout": "15.28.1",
-    "@genesislcap/foundation-logger": "15.28.1",
-    "@genesislcap/web-core": "15.28.1",
+    "@genesislcap/foundation-forms": "15.29.0",
+    "@genesislcap/foundation-layout": "15.29.0",
+    "@genesislcap/foundation-logger": "15.29.0",
+    "@genesislcap/rapid-design-system": "15.29.0",
+    "@genesislcap/web-core": "15.29.0",
     "@jsonforms/core": "^3.2.1",
-    "@r2wc/react-to-web-component": "^2.0.2"
+    "@r2wc/react-to-web-component": "^2.0.2",
+    "flexlayout-react": "0.10.8"
   },
   "repository": {
     "type": "git",