@genesislcap/foundation-react-utils 15.28.2-alpha-43a95ab92.0 → 15.30.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +31 -0
- package/dist/custom-elements.json +23 -0
- package/dist/dts/flexlayout/index.d.ts +25 -0
- package/dist/dts/flexlayout/index.d.ts.map +1 -0
- package/dist/dts/index.d.ts +6 -0
- package/dist/dts/index.d.ts.map +1 -1
- package/dist/esm/flexlayout/index.js +35 -0
- package/dist/esm/index.js +6 -0
- package/package.json +26 -15
package/README.md
CHANGED
|
@@ -16,6 +16,37 @@ Add the package to your `package.json` dependencies. After changing dependencies
|
|
|
16
16
|
}
|
|
17
17
|
```
|
|
18
18
|
|
|
19
|
+
## flexlayout-react
|
|
20
|
+
|
|
21
|
+
`flexlayout-react` is re-exported from the `./flexlayout` entry point at a version this package
|
|
22
|
+
pins, so apps neither declare nor upgrade it themselves:
|
|
23
|
+
|
|
24
|
+
```ts
|
|
25
|
+
import { Actions, DockLocation, Layout, Model, TabNode } from '@genesislcap/foundation-react-utils/flexlayout';
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
The entry point re-exports the whole `flexlayout-react` API and installs the Rapid Design System
|
|
29
|
+
theme for it into the document on import. No stylesheet import is needed, and `flexlayout-react`'s
|
|
30
|
+
own stylesheets should not be imported — they are the unthemed upstream defaults. Colours resolve
|
|
31
|
+
from Rapid design tokens, so render the layout under a `<rapid-design-system-provider>`.
|
|
32
|
+
|
|
33
|
+
Styles adopted into the document do not cross a shadow boundary, so a layout mounted inside a
|
|
34
|
+
shadow root needs the theme adopted there as well:
|
|
35
|
+
|
|
36
|
+
```ts
|
|
37
|
+
import { installRapidFlexLayoutReactStyles } from '@genesislcap/foundation-react-utils/flexlayout';
|
|
38
|
+
|
|
39
|
+
installRapidFlexLayoutReactStyles(myShadowRoot);
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
### Migrating an app that depends on flexlayout-react directly
|
|
43
|
+
|
|
44
|
+
Remove `flexlayout-react` from the app's `package.json`, drop any `flexlayout-react/style/*.css`
|
|
45
|
+
import, and point the remaining imports at `./flexlayout`. Keeping the app-level dependency risks
|
|
46
|
+
resolving a second copy of the library, which breaks the `instanceof` checks `flexlayout-react`
|
|
47
|
+
relies on internally; the entry point logs a warning when the version it loads differs from the one
|
|
48
|
+
the theme was generated against.
|
|
49
|
+
|
|
19
50
|
## License
|
|
20
51
|
|
|
21
52
|
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.
|
|
@@ -264,6 +264,29 @@
|
|
|
264
264
|
}
|
|
265
265
|
]
|
|
266
266
|
},
|
|
267
|
+
{
|
|
268
|
+
"kind": "javascript-module",
|
|
269
|
+
"path": "src/flexlayout/index.ts",
|
|
270
|
+
"declarations": [],
|
|
271
|
+
"exports": [
|
|
272
|
+
{
|
|
273
|
+
"kind": "js",
|
|
274
|
+
"name": "*",
|
|
275
|
+
"declaration": {
|
|
276
|
+
"name": "*",
|
|
277
|
+
"package": "flexlayout-react"
|
|
278
|
+
}
|
|
279
|
+
},
|
|
280
|
+
{
|
|
281
|
+
"kind": "js",
|
|
282
|
+
"name": "installRapidFlexLayoutReactStyles",
|
|
283
|
+
"declaration": {
|
|
284
|
+
"name": "installRapidFlexLayoutReactStyles",
|
|
285
|
+
"module": "src/flexlayout/index.ts"
|
|
286
|
+
}
|
|
287
|
+
}
|
|
288
|
+
]
|
|
289
|
+
},
|
|
267
290
|
{
|
|
268
291
|
"kind": "javascript-module",
|
|
269
292
|
"path": "src/router/index.ts",
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Platform-owned `flexlayout-react` entry point.
|
|
3
|
+
*
|
|
4
|
+
* Importing from here (rather than from `flexlayout-react` directly) means the app does not
|
|
5
|
+
* declare, pin or upgrade `flexlayout-react` itself, and does not have to install the theme:
|
|
6
|
+
*
|
|
7
|
+
* - the version is pinned by this package, so every app runs the version the platform
|
|
8
|
+
* theme was generated against;
|
|
9
|
+
* - the Rapid Design System flexlayout theme is installed into the document on import.
|
|
10
|
+
*
|
|
11
|
+
* Colours resolve from Rapid design tokens, so render under a `<rapid-design-system-provider>`.
|
|
12
|
+
*
|
|
13
|
+
* Maintainers: the theme install below is a top-level side effect, so this module's built path
|
|
14
|
+
* must stay listed in the package's `sideEffects` array — otherwise a consumer's production
|
|
15
|
+
* bundle keeps the re-exports and silently drops the install. Moving or renaming this file means
|
|
16
|
+
* updating that array too; `side-effects.test.ts` enforces both and explains the failure mode.
|
|
17
|
+
*/
|
|
18
|
+
import { installRapidFlexLayoutReactStyles } from '@genesislcap/rapid-design-system';
|
|
19
|
+
export * from 'flexlayout-react';
|
|
20
|
+
/**
|
|
21
|
+
* Install the platform theme into a shadow root, for apps that mount flexlayout-react inside
|
|
22
|
+
* shadow DOM (styles adopted into the document do not cross a shadow boundary).
|
|
23
|
+
*/
|
|
24
|
+
export { installRapidFlexLayoutReactStyles };
|
|
25
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
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
CHANGED
|
@@ -12,6 +12,12 @@
|
|
|
12
12
|
* grid's `gridComponents` property).
|
|
13
13
|
* - `reactFactory` / `reactFactoryWithProvider` — mount React component trees into
|
|
14
14
|
* Genesis Foundation layout regions.
|
|
15
|
+
*
|
|
16
|
+
* Subpath entry points:
|
|
17
|
+
* - `./flexlayout` — `flexlayout-react` at the version this package pins, re-exported with the
|
|
18
|
+
* Rapid Design System theme for it installed on import. Import from there rather than adding
|
|
19
|
+
* `flexlayout-react` to an app's own dependencies.
|
|
20
|
+
* - `./router` — route table helpers (`renderAppRoutes` and friends).
|
|
15
21
|
*/
|
|
16
22
|
export { reactFactory, reactFactoryWithProvider } from './react-layout-factory';
|
|
17
23
|
export { createReactRenderer } from './create-react-renderer';
|
package/dist/dts/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"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"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Platform-owned `flexlayout-react` entry point.
|
|
3
|
+
*
|
|
4
|
+
* Importing from here (rather than from `flexlayout-react` directly) means the app does not
|
|
5
|
+
* declare, pin or upgrade `flexlayout-react` itself, and does not have to install the theme:
|
|
6
|
+
*
|
|
7
|
+
* - the version is pinned by this package, so every app runs the version the platform
|
|
8
|
+
* theme was generated against;
|
|
9
|
+
* - the Rapid Design System flexlayout theme is installed into the document on import.
|
|
10
|
+
*
|
|
11
|
+
* Colours resolve from Rapid design tokens, so render under a `<rapid-design-system-provider>`.
|
|
12
|
+
*
|
|
13
|
+
* Maintainers: the theme install below is a top-level side effect, so this module's built path
|
|
14
|
+
* must stay listed in the package's `sideEffects` array — otherwise a consumer's production
|
|
15
|
+
* bundle keeps the re-exports and silently drops the install. Moving or renaming this file means
|
|
16
|
+
* updating that array too; `side-effects.test.ts` enforces both and explains the failure mode.
|
|
17
|
+
*/
|
|
18
|
+
import { RAPID_FLEXLAYOUT_REACT_VERSION, installRapidFlexLayoutReactStyles, } from '@genesislcap/rapid-design-system';
|
|
19
|
+
import { FlexLayoutVersion } from 'flexlayout-react';
|
|
20
|
+
export * from 'flexlayout-react';
|
|
21
|
+
/**
|
|
22
|
+
* Install the platform theme into a shadow root, for apps that mount flexlayout-react inside
|
|
23
|
+
* shadow DOM (styles adopted into the document do not cross a shadow boundary).
|
|
24
|
+
*/
|
|
25
|
+
export { installRapidFlexLayoutReactStyles };
|
|
26
|
+
// Guarded so a Node-side import (unit test, SSR, tooling) does not throw on `document`.
|
|
27
|
+
if (typeof document !== 'undefined') {
|
|
28
|
+
installRapidFlexLayoutReactStyles();
|
|
29
|
+
if (FlexLayoutVersion !== RAPID_FLEXLAYOUT_REACT_VERSION) {
|
|
30
|
+
// eslint-disable-next-line no-console
|
|
31
|
+
console.warn(`[foundation-react-utils] flexlayout-react ${FlexLayoutVersion} is loaded but the theme ` +
|
|
32
|
+
`was generated against ${RAPID_FLEXLAYOUT_REACT_VERSION}. Remove any app-level ` +
|
|
33
|
+
`flexlayout-react dependency so a single copy resolves.`);
|
|
34
|
+
}
|
|
35
|
+
}
|
package/dist/esm/index.js
CHANGED
|
@@ -12,6 +12,12 @@
|
|
|
12
12
|
* grid's `gridComponents` property).
|
|
13
13
|
* - `reactFactory` / `reactFactoryWithProvider` — mount React component trees into
|
|
14
14
|
* Genesis Foundation layout regions.
|
|
15
|
+
*
|
|
16
|
+
* Subpath entry points:
|
|
17
|
+
* - `./flexlayout` — `flexlayout-react` at the version this package pins, re-exported with the
|
|
18
|
+
* Rapid Design System theme for it installed on import. Import from there rather than adding
|
|
19
|
+
* `flexlayout-react` to an app's own dependencies.
|
|
20
|
+
* - `./router` — route table helpers (`renderAppRoutes` and friends).
|
|
15
21
|
*/
|
|
16
22
|
export { reactFactory, reactFactoryWithProvider } from './react-layout-factory';
|
|
17
23
|
export { createReactRenderer } from './create-react-renderer';
|
package/package.json
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@genesislcap/foundation-react-utils",
|
|
3
3
|
"description": "Genesis Foundation React Utils",
|
|
4
|
-
"version": "15.
|
|
5
|
-
"sideEffects":
|
|
4
|
+
"version": "15.30.0",
|
|
5
|
+
"sideEffects": [
|
|
6
|
+
"./dist/esm/flexlayout/index.js"
|
|
7
|
+
],
|
|
6
8
|
"license": "SEE LICENSE IN license.txt",
|
|
7
9
|
"main": "dist/esm/index.js",
|
|
8
10
|
"types": "dist/dts/index.d.ts",
|
|
@@ -15,12 +17,19 @@
|
|
|
15
17
|
"types": "./dist/dts/router/index.d.ts",
|
|
16
18
|
"default": "./dist/esm/router/index.js"
|
|
17
19
|
},
|
|
20
|
+
"./flexlayout": {
|
|
21
|
+
"types": "./dist/dts/flexlayout/index.d.ts",
|
|
22
|
+
"default": "./dist/esm/flexlayout/index.js"
|
|
23
|
+
},
|
|
18
24
|
"./package.json": "./package.json"
|
|
19
25
|
},
|
|
20
26
|
"typesVersions": {
|
|
21
27
|
"*": {
|
|
22
28
|
"router": [
|
|
23
29
|
"./dist/dts/router/index.d.ts"
|
|
30
|
+
],
|
|
31
|
+
"flexlayout": [
|
|
32
|
+
"./dist/dts/flexlayout/index.d.ts"
|
|
24
33
|
]
|
|
25
34
|
}
|
|
26
35
|
},
|
|
@@ -47,13 +56,13 @@
|
|
|
47
56
|
}
|
|
48
57
|
},
|
|
49
58
|
"devDependencies": {
|
|
50
|
-
"@genesislcap/foundation-testing": "15.
|
|
51
|
-
"@genesislcap/genx": "15.
|
|
52
|
-
"@genesislcap/rollup-builder": "15.
|
|
53
|
-
"@genesislcap/ts-builder": "15.
|
|
54
|
-
"@genesislcap/uvu-playwright-builder": "15.
|
|
55
|
-
"@genesislcap/vite-builder": "15.
|
|
56
|
-
"@genesislcap/webpack-builder": "15.
|
|
59
|
+
"@genesislcap/foundation-testing": "15.30.0",
|
|
60
|
+
"@genesislcap/genx": "15.30.0",
|
|
61
|
+
"@genesislcap/rollup-builder": "15.30.0",
|
|
62
|
+
"@genesislcap/ts-builder": "15.30.0",
|
|
63
|
+
"@genesislcap/uvu-playwright-builder": "15.30.0",
|
|
64
|
+
"@genesislcap/vite-builder": "15.30.0",
|
|
65
|
+
"@genesislcap/webpack-builder": "15.30.0",
|
|
57
66
|
"react-router-dom": "^7.1.3"
|
|
58
67
|
},
|
|
59
68
|
"peerDependencies": {
|
|
@@ -67,12 +76,14 @@
|
|
|
67
76
|
}
|
|
68
77
|
},
|
|
69
78
|
"dependencies": {
|
|
70
|
-
"@genesislcap/foundation-forms": "15.
|
|
71
|
-
"@genesislcap/foundation-layout": "15.
|
|
72
|
-
"@genesislcap/foundation-logger": "15.
|
|
73
|
-
"@genesislcap/
|
|
74
|
-
"@
|
|
75
|
-
"@
|
|
79
|
+
"@genesislcap/foundation-forms": "15.30.0",
|
|
80
|
+
"@genesislcap/foundation-layout": "15.30.0",
|
|
81
|
+
"@genesislcap/foundation-logger": "15.30.0",
|
|
82
|
+
"@genesislcap/rapid-design-system": "15.30.0",
|
|
83
|
+
"@genesislcap/web-core": "15.30.0",
|
|
84
|
+
"@jsonforms/core": "^3.2.1",
|
|
85
|
+
"@r2wc/react-to-web-component": "^2.0.2",
|
|
86
|
+
"flexlayout-react": "0.10.8"
|
|
76
87
|
},
|
|
77
88
|
"repository": {
|
|
78
89
|
"type": "git",
|