@cratis/scene.components 1.0.0 → 2.0.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/.storybook/main.ts +0 -6
- package/.storybook/preview.tsx +33 -8
- package/README.md +21 -11
- package/common/SceneDropdown.tsx +10 -3
- package/cratisComponentsPackage.ts +18 -14
- package/data/SceneDataTable.tsx +7 -2
- package/data/SceneObservableDataTable.tsx +5 -2
- package/dialogs/SceneCommandDialog.tsx +11 -1
- package/dialogs/SceneDialog.tsx +13 -1
- package/dist/cjs/common/SceneDropdown.js +10 -3
- package/dist/cjs/common/SceneDropdown.js.map +1 -1
- package/dist/cjs/cratisComponentsPackage.js +18 -14
- package/dist/cjs/cratisComponentsPackage.js.map +1 -1
- package/dist/cjs/data/SceneDataTable.js +6 -1
- package/dist/cjs/data/SceneDataTable.js.map +1 -1
- package/dist/cjs/data/SceneObservableDataTable.js +4 -1
- package/dist/cjs/data/SceneObservableDataTable.js.map +1 -1
- package/dist/cjs/dialogs/SceneCommandDialog.js +11 -1
- package/dist/cjs/dialogs/SceneCommandDialog.js.map +1 -1
- package/dist/cjs/dialogs/SceneDialog.js +13 -1
- package/dist/cjs/dialogs/SceneDialog.js.map +1 -1
- package/dist/cjs/forms/fields/SceneChipsField.js +6 -1
- package/dist/cjs/forms/fields/SceneChipsField.js.map +1 -1
- package/dist/cjs/forms/fields/SceneMultiSelectField.js +7 -6
- package/dist/cjs/forms/fields/SceneMultiSelectField.js.map +1 -1
- package/dist/cjs/pages/SceneDataPage.js +5 -2
- package/dist/cjs/pages/SceneDataPage.js.map +1 -1
- package/dist/esm/common/SceneDropdown.d.ts.map +1 -1
- package/dist/esm/common/SceneDropdown.js +10 -3
- package/dist/esm/common/SceneDropdown.js.map +1 -1
- package/dist/esm/cratisComponentsPackage.d.ts.map +1 -1
- package/dist/esm/cratisComponentsPackage.js +18 -14
- package/dist/esm/cratisComponentsPackage.js.map +1 -1
- package/dist/esm/data/SceneDataTable.d.ts.map +1 -1
- package/dist/esm/data/SceneDataTable.js +7 -2
- package/dist/esm/data/SceneDataTable.js.map +1 -1
- package/dist/esm/data/SceneObservableDataTable.d.ts.map +1 -1
- package/dist/esm/data/SceneObservableDataTable.js +5 -2
- package/dist/esm/data/SceneObservableDataTable.js.map +1 -1
- package/dist/esm/dialogs/SceneCommandDialog.d.ts.map +1 -1
- package/dist/esm/dialogs/SceneCommandDialog.js +11 -1
- package/dist/esm/dialogs/SceneCommandDialog.js.map +1 -1
- package/dist/esm/dialogs/SceneDialog.d.ts.map +1 -1
- package/dist/esm/dialogs/SceneDialog.js +13 -1
- package/dist/esm/dialogs/SceneDialog.js.map +1 -1
- package/dist/esm/editors/for_SceneObjectNavigationalBar/when_navigating_back_up_the_trail.js +2 -1
- package/dist/esm/editors/for_SceneObjectNavigationalBar/when_navigating_back_up_the_trail.js.map +1 -1
- package/dist/esm/for_cratisComponentsPackage/when_resolving_its_dependencies.js +5 -5
- package/dist/esm/for_cratisComponentsPackage/when_resolving_its_dependencies.js.map +1 -1
- package/dist/esm/forms/fields/SceneChipsField.d.ts.map +1 -1
- package/dist/esm/forms/fields/SceneChipsField.js +6 -1
- package/dist/esm/forms/fields/SceneChipsField.js.map +1 -1
- package/dist/esm/forms/fields/SceneMultiSelectField.d.ts.map +1 -1
- package/dist/esm/forms/fields/SceneMultiSelectField.js +8 -7
- package/dist/esm/forms/fields/SceneMultiSelectField.js.map +1 -1
- package/dist/esm/pages/SceneDataPage.d.ts.map +1 -1
- package/dist/esm/pages/SceneDataPage.js +6 -3
- package/dist/esm/pages/SceneDataPage.js.map +1 -1
- package/dist/esm/tsconfig.tsbuildinfo +1 -1
- package/editors/for_SceneObjectNavigationalBar/when_navigating_back_up_the_trail.tsx +13 -1
- package/for_cratisComponentsPackage/when_resolving_its_dependencies.ts +16 -6
- package/forms/fields/SceneChipsField.tsx +6 -1
- package/forms/fields/SceneMultiSelectField.tsx +8 -6
- package/package.json +19 -13
- package/pages/SceneDataPage.tsx +6 -3
package/.storybook/main.ts
CHANGED
|
@@ -39,12 +39,6 @@ const config: StorybookConfig = {
|
|
|
39
39
|
...(config.build.rollupOptions ?? {}),
|
|
40
40
|
external: [/^@cratis\/arc/, '@cratis/fundamentals'],
|
|
41
41
|
};
|
|
42
|
-
// Vite 8 minifies CSS with lightningcss, which rejects the whole bundle over one invalid file:
|
|
43
|
-
// `@cratis/components@2.9.0` ships `dist/esm/TimeMachine/Properties.css` with `//` line comments,
|
|
44
|
-
// which are not CSS. esbuild's minifier tolerates them. This is an upstream defect and the
|
|
45
|
-
// workaround belongs here, in preview tooling, rather than anywhere it could hide the problem -
|
|
46
|
-
// remove this line once the Components package ships that file with `/* */` comments.
|
|
47
|
-
config.build.cssMinify = 'esbuild';
|
|
48
42
|
return config;
|
|
49
43
|
},
|
|
50
44
|
};
|
package/.storybook/preview.tsx
CHANGED
|
@@ -4,26 +4,51 @@
|
|
|
4
4
|
import type { Preview } from '@storybook/react';
|
|
5
5
|
import { CratisComponentsProvider } from '@cratis/components/Common';
|
|
6
6
|
|
|
7
|
-
// The
|
|
8
|
-
//
|
|
9
|
-
//
|
|
10
|
-
//
|
|
11
|
-
//
|
|
12
|
-
|
|
13
|
-
|
|
7
|
+
// The stylesheet stack a `@cratis/components` component needs, in the order the layers resolve.
|
|
8
|
+
//
|
|
9
|
+
// PrimeReact 11 ships no CSS whatsoever - `primereact/resources/` does not exist, so the compiled theme
|
|
10
|
+
// this file used to import has nothing left to resolve to. A look is no longer a stylesheet at all: it is
|
|
11
|
+
// either a `@primeuix/themes` preset handed to the provider, which `@primeuix/styled` turns into `--p-*`
|
|
12
|
+
// custom properties at runtime, or a sheet that assigns the library's own `--cratis-*` tokens directly.
|
|
13
|
+
// This preview takes the second path - see the decorator below for why.
|
|
14
|
+
//
|
|
15
|
+
// `tokens` declares the `--cratis-*` layer every component stylesheet reads, `styles` is that component
|
|
16
|
+
// CSS plus the compiled Tailwind utilities and the vendored Allotment sheet `DataPage`'s split view needs,
|
|
17
|
+
// `theme` fills the tokens in, and this package's bridge puts Scene's `--scene-*` tokens in front of all
|
|
18
|
+
// of it wherever a Scene theme is applied. Each layer consumes the one before it, so the order is not
|
|
19
|
+
// cosmetic.
|
|
20
|
+
import '@cratis/components/tokens';
|
|
14
21
|
import '@cratis/components/styles';
|
|
22
|
+
import '@cratis/components/theme';
|
|
23
|
+
import 'primeicons/primeicons.css';
|
|
15
24
|
import '../theme/sceneTokenBridge.css';
|
|
16
25
|
|
|
26
|
+
// The baseline theme is scoped to a `cratis-theme` ancestor rather than to `:root`, so something has to
|
|
27
|
+
// carry the class. `<body>` rather than a wrapper inside each story, because PrimeReact 11 portals its
|
|
28
|
+
// overlays - dialogs, select panels, the filter panel - straight to `document.body`; a wrapper would
|
|
29
|
+
// leave every one of them outside the themed subtree and rendering unstyled.
|
|
30
|
+
document.body.classList.add('cratis-theme');
|
|
31
|
+
|
|
17
32
|
/**
|
|
18
33
|
* Every story renders inside `CratisComponentsProvider`, the library's own configuration provider over
|
|
19
34
|
* PrimeReact's. Without it the wrapped components fall back to PrimeReact's defaults rather than
|
|
20
35
|
* Cratis', so a story would be showing something subtly different from what an application renders -
|
|
21
36
|
* which defeats the point of having stories at all.
|
|
37
|
+
*
|
|
38
|
+
* `unstyled` is the posture the imported `@cratis/components/theme` is written for: it is Cratis-authored
|
|
39
|
+
* MIT CSS that assigns the `--cratis-*` tokens outright, so it needs neither a `@primeuix/themes` preset
|
|
40
|
+
* nor the PrimeUI license key a styled preset is gated behind. Choosing it over a preset also keeps this
|
|
41
|
+
* package's dependency surface honest - `@primeuix/themes` is not one of its dependencies, and a preview
|
|
42
|
+
* is the wrong place to start relying on a package nobody declared.
|
|
43
|
+
*
|
|
44
|
+
* It is the right choice for these stories on its own terms too. The `--cratis-*` token layer is exactly
|
|
45
|
+
* what `theme/sceneTokenBridge.css` overrides, so a Scene theme visibly takes over from the baseline in
|
|
46
|
+
* the `Themed` story rather than from a preset's `--p-*` values one level further down the chain.
|
|
22
47
|
*/
|
|
23
48
|
const preview: Preview = {
|
|
24
49
|
decorators: [
|
|
25
50
|
Story => (
|
|
26
|
-
<CratisComponentsProvider>
|
|
51
|
+
<CratisComponentsProvider value={{ unstyled: true }}>
|
|
27
52
|
<Story />
|
|
28
53
|
</CratisComponentsProvider>
|
|
29
54
|
),
|
package/README.md
CHANGED
|
@@ -130,8 +130,13 @@ both packages write themes in one language: `primary.color`, `primary.contrastCo
|
|
|
130
130
|
for a faceted browser that has nothing to show at design time. An application that wants it imports it
|
|
131
131
|
directly.
|
|
132
132
|
- **`card`** — see above.
|
|
133
|
-
- **`column`** —
|
|
134
|
-
|
|
133
|
+
- **`column`** — a column is a configuration element, not a rendered component: it declares `field`,
|
|
134
|
+
`header`, `sortable` and `filter`, and the table reads those off its children. Columns therefore come
|
|
135
|
+
through the `content` slot, and declaring a name here would add a registry entry for something no
|
|
136
|
+
screen resolves on its own. Note that the *ownership* of `Column` moved in PrimeReact 11 — `primereact/column`
|
|
137
|
+
was removed and `@cratis/components` now ships its own (`@cratis/components/DataTables`, re-exported from
|
|
138
|
+
`DataPage`) — so if a `column` name is ever wanted, this is the package that would have the component
|
|
139
|
+
behind it. The decision not to declare one is unchanged; only the reason for it is different.
|
|
135
140
|
- **Event handlers** — Scene has no action-binding seam yet. Where a callback drives a component's own
|
|
136
141
|
visible state the adapter holds it (`useEditableCopy`), so the breadcrumb, schema editor and time machine
|
|
137
142
|
behave like themselves; where it would reach outside, the adapter exposes nothing rather than a handler
|
|
@@ -181,12 +186,17 @@ yarn lint:ci
|
|
|
181
186
|
yarn build-storybook
|
|
182
187
|
```
|
|
183
188
|
|
|
184
|
-
Two
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
189
|
+
Two workarounds used to live in this folder for upstream problems that `@cratis/components` 3.0.0 and
|
|
190
|
+
PrimeReact 11 removed the cause of. Both are gone, and neither should come back without new evidence:
|
|
191
|
+
|
|
192
|
+
- `.storybook/main.ts` no longer forces `cssMinify: 'esbuild'`. It was there because
|
|
193
|
+
`@cratis/components@2.9.0` shipped `dist/esm/TimeMachine/Properties.css` with `//` line comments, which
|
|
194
|
+
are not CSS, and Vite's default lightningcss minifier rejects a whole bundle over one invalid file.
|
|
195
|
+
3.0.0 takes CSS out of the JavaScript module graph entirely: there are no per-component stylesheets any
|
|
196
|
+
more, only `styles.css`, `tokens.css` and `theme.css` at the package root, and all three minify cleanly
|
|
197
|
+
under lightningcss.
|
|
198
|
+
- `vite.config.mts` no longer inlines `@cratis/components` and `primereact` for Vitest. That existed
|
|
199
|
+
because both were published as ESM using directory imports (`primereact/api`), which Node's own resolver
|
|
200
|
+
rejects. `primereact/api` does not exist in version 11 at all; PrimeReact's `exports` map now resolves
|
|
201
|
+
`./*` to a concrete `./*/index.mjs`, and every `@cratis/components` subpath points at a real file, so
|
|
202
|
+
Node loads them natively and Vitest can externalize them as it does every other dependency.
|
package/common/SceneDropdown.tsx
CHANGED
|
@@ -8,9 +8,16 @@ import { booleanProperty, objectArrayProperty, stringProperty } from '../propert
|
|
|
8
8
|
/**
|
|
9
9
|
* The `Cratis.Components:dropdown` component - `Dropdown` from `@cratis/components/Dropdown`.
|
|
10
10
|
*
|
|
11
|
-
* The library's own `Dropdown` rather than PrimeReact's
|
|
12
|
-
*
|
|
13
|
-
*
|
|
11
|
+
* The library's own `Dropdown` rather than PrimeReact's `Select`, and the reason changed with PrimeReact
|
|
12
|
+
* 11. It used to be the overlay z-index fix: a version 10 dropdown panel opened inside a dialog rendered
|
|
13
|
+
* within the dialog's own subtree and could land under its mask, so the library appended every overlay to
|
|
14
|
+
* the document body and handed out z-indexes itself. Version 11 does both natively - the select panel
|
|
15
|
+
* portals to the body and the shared z-index registry puts a later overlay above whatever is already
|
|
16
|
+
* open - and `@cratis/components` 3.0.0 accordingly deleted that workaround. What the wrapper is worth
|
|
17
|
+
* now is its curated surface: a single/multi select expressed in `options` / `optionLabel` /
|
|
18
|
+
* `optionValue` terms, where version 11's `Select` is compositional (`Select.Root`, `.Trigger`,
|
|
19
|
+
* `.Portal`, `.Popup`, `.List`, `.Option`) and would have to be assembled here, in an adapter whose whole
|
|
20
|
+
* input is a property bag.
|
|
14
21
|
*
|
|
15
22
|
* This is the standalone dropdown, not the command-form one: it takes its options from the screen and is
|
|
16
23
|
* not bound to a command property. Use `dropdownField` inside a `commandForm`.
|
|
@@ -9,23 +9,27 @@ import { cratisComponents, cratisComponentsPackageName } from './cratisComponent
|
|
|
9
9
|
* The `Cratis.Components` package's declaration - what a profile gets when it lists this package.
|
|
10
10
|
*
|
|
11
11
|
* This is the concrete case the whole package-dependency mechanism exists for. `@cratis/components` is
|
|
12
|
-
* not a self-contained library: every component in it is a wrapper over a PrimeReact widget, and its
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
* Tailwind and everything renders unstyled. Both are stated as
|
|
16
|
-
* so while the profile is being configured, instead of leaving
|
|
12
|
+
* not a self-contained library: every component in it is a wrapper over a PrimeReact widget, and its own
|
|
13
|
+
* styling is a `--cratis-*` token layer (`@cratis/components/tokens`) plus the component stylesheets and
|
|
14
|
+
* compiled Tailwind utilities in `@cratis/components/styles`. Activate it in a profile without PrimeReact
|
|
15
|
+
* and nothing renders; activate it without Tailwind and everything renders unstyled. Both are stated as
|
|
16
|
+
* dependencies so a package picker can say so while the profile is being configured, instead of leaving
|
|
17
|
+
* it to be discovered when the page opens.
|
|
17
18
|
*
|
|
18
|
-
* The version ranges are the real ones the library carries
|
|
19
|
-
*
|
|
20
|
-
*
|
|
21
|
-
*
|
|
19
|
+
* The version ranges are the real ones the library carries. `>=11.0.0` for PrimeReact: version 3.0.0
|
|
20
|
+
* declares `primereact@^11` as a peer dependency and is built against version 11's component set, so the
|
|
21
|
+
* span across the major boundary that the previous `>=10.9.0` range described is over. The `--cratis-*`
|
|
22
|
+
* tokens still resolve a version 10 theme variable as their last fallback, but that is an upgrade-window
|
|
23
|
+
* courtesy for an application with a compiled version 10 stylesheet still on the page - not a version of
|
|
24
|
+
* PrimeReact this package can be activated against. `^4.0.0` for Tailwind, because the utility sheet is
|
|
25
|
+
* compiled against Tailwind 4.
|
|
22
26
|
*/
|
|
23
27
|
export const cratisComponentsPackageManifest: ScenePackage = {
|
|
24
28
|
name: cratisComponentsPackageName,
|
|
25
|
-
version: '
|
|
29
|
+
version: '3.0.0',
|
|
26
30
|
kind: PackageKind.ComponentLibrary,
|
|
27
31
|
dependencies: [
|
|
28
|
-
{ name: 'PrimeReact', versionRange: '>=
|
|
32
|
+
{ name: 'PrimeReact', versionRange: '>=11.0.0' },
|
|
29
33
|
{ name: 'Tailwind', versionRange: '^4.0.0' },
|
|
30
34
|
],
|
|
31
35
|
components: [
|
|
@@ -78,9 +82,9 @@ export const cratisComponentsPackageManifest: ScenePackage = {
|
|
|
78
82
|
dialogTemplates: [],
|
|
79
83
|
|
|
80
84
|
// No themes either, for a different reason: `@cratis/components` has no palette of its own. It reads
|
|
81
|
-
// a `--cratis-*` variable layer that resolves whatever
|
|
82
|
-
//
|
|
83
|
-
// asserting a look it was specifically built not to have.
|
|
85
|
+
// a `--cratis-*` variable layer that resolves whatever is in front of it - the `--p-*` properties a
|
|
86
|
+
// PrimeReact 11 preset emits at runtime, or a Scene theme through this package's token bridge.
|
|
87
|
+
// Shipping a theme here would be this library asserting a look it was specifically built not to have.
|
|
84
88
|
themes: [],
|
|
85
89
|
|
|
86
90
|
displayName: 'Cratis Components',
|
package/data/SceneDataTable.tsx
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
import { lazy } from 'react';
|
|
5
5
|
import { RegisteredComponentProps } from '@cratis/scene.react';
|
|
6
6
|
import { ArcRuntimeBoundary, BindingKind, MissingBinding, resolveElementBinding } from '../bindings';
|
|
7
|
-
import {
|
|
7
|
+
import { stringArrayProperty, stringProperty } from '../properties';
|
|
8
8
|
|
|
9
9
|
const DataTableForQuery = lazy(async () => ({ default: (await import('@cratis/components/DataTables')).DataTableForQuery }));
|
|
10
10
|
|
|
@@ -19,6 +19,12 @@ const DataTableForQuery = lazy(async () => ({ default: (await import('@cratis/co
|
|
|
19
19
|
* back into it, where PrimeReact's `DataTable` is handed rows and knows nothing about where they came from.
|
|
20
20
|
*
|
|
21
21
|
* The `query` property names an Arc query proxy; the columns come from the `content` slot.
|
|
22
|
+
*
|
|
23
|
+
* There is deliberately no `clientFiltering` property. `@cratis/components` 3.0.0 still accepts the prop
|
|
24
|
+
* so existing call sites compile, but it no longer does anything - filtering is always applied to the
|
|
25
|
+
* loaded page. Exposing a screen property that reads as a choice and silently is not would be worse than
|
|
26
|
+
* not offering it, so a screen that set it now gets a property-not-recognized signal rather than a
|
|
27
|
+
* setting that quietly stopped mattering.
|
|
22
28
|
*/
|
|
23
29
|
export function SceneDataTable({ element, slots }: RegisteredComponentProps) {
|
|
24
30
|
const { name, target } = resolveElementBinding(element, BindingKind.Query);
|
|
@@ -31,7 +37,6 @@ export function SceneDataTable({ element, slots }: RegisteredComponentProps) {
|
|
|
31
37
|
emptyMessage={stringProperty(element.properties, 'emptyMessage') ?? ''}
|
|
32
38
|
dataKey={stringProperty(element.properties, 'dataKey')}
|
|
33
39
|
globalFilterFields={stringArrayProperty(element.properties, 'globalFilterFields')}
|
|
34
|
-
clientFiltering={booleanProperty(element.properties, 'clientFiltering')}
|
|
35
40
|
className={stringProperty(element.properties, 'className')}
|
|
36
41
|
>
|
|
37
42
|
{slots.content}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
import { lazy } from 'react';
|
|
5
5
|
import { RegisteredComponentProps } from '@cratis/scene.react';
|
|
6
6
|
import { ArcRuntimeBoundary, BindingKind, MissingBinding, resolveElementBinding } from '../bindings';
|
|
7
|
-
import {
|
|
7
|
+
import { stringArrayProperty, stringProperty } from '../properties';
|
|
8
8
|
|
|
9
9
|
const DataTableForObservableQuery = lazy(async () => ({
|
|
10
10
|
default: (await import('@cratis/components/DataTables')).DataTableForObservableQuery,
|
|
@@ -19,6 +19,10 @@ const DataTableForObservableQuery = lazy(async () => ({
|
|
|
19
19
|
* re-renders when the server's read model changes, and a plain query does not. A screen that names an
|
|
20
20
|
* observable query here is stating that its data is live, which is a design decision worth being able to
|
|
21
21
|
* read off the screen.
|
|
22
|
+
*
|
|
23
|
+
* As with `dataTable`, no `clientFiltering` property is exposed: `@cratis/components` 3.0.0 keeps the
|
|
24
|
+
* prop for source compatibility but ignores it, and a screen property that cannot change anything is
|
|
25
|
+
* worse than an absent one.
|
|
22
26
|
*/
|
|
23
27
|
export function SceneObservableDataTable({ element, slots }: RegisteredComponentProps) {
|
|
24
28
|
const { name, target } = resolveElementBinding(element, BindingKind.Query);
|
|
@@ -31,7 +35,6 @@ export function SceneObservableDataTable({ element, slots }: RegisteredComponent
|
|
|
31
35
|
emptyMessage={stringProperty(element.properties, 'emptyMessage') ?? ''}
|
|
32
36
|
dataKey={stringProperty(element.properties, 'dataKey')}
|
|
33
37
|
globalFilterFields={stringArrayProperty(element.properties, 'globalFilterFields')}
|
|
34
|
-
clientFiltering={booleanProperty(element.properties, 'clientFiltering')}
|
|
35
38
|
className={stringProperty(element.properties, 'className')}
|
|
36
39
|
>
|
|
37
40
|
{slots.content}
|
|
@@ -18,6 +18,15 @@ const CommandDialog = lazy(async () => ({ default: (await import('@cratis/compon
|
|
|
18
18
|
* reimplementing the protocol.
|
|
19
19
|
*
|
|
20
20
|
* The `command` property names an Arc command proxy; the fields go in the `content` slot.
|
|
21
|
+
*
|
|
22
|
+
* `dismissable` and `closeAriaLabel` are here rather than on `dialog` alone because `CommandDialog`
|
|
23
|
+
* forwards both to the dialog it wraps, and in `@cratis/components` 3.0.0 that forwarding actually
|
|
24
|
+
* happens - 2.x accepted the two props and dropped them on the floor. `dismissable` matters more on a
|
|
25
|
+
* command dialog than anywhere else: it decides whether a half-filled form can be abandoned with
|
|
26
|
+
* `Escape` or a backdrop click, which is a decision about the command, not about the chrome.
|
|
27
|
+
*
|
|
28
|
+
* The `resizable` property this adapter used to carry is gone. It is still declared upstream so call
|
|
29
|
+
* sites compile, but PrimeReact 11's headless dialog has no resize handle and nothing reads the prop.
|
|
21
30
|
*/
|
|
22
31
|
export function SceneCommandDialog({ element, slots }: RegisteredComponentProps) {
|
|
23
32
|
const { name, target } = resolveElementBinding(element, BindingKind.Command);
|
|
@@ -30,9 +39,10 @@ export function SceneCommandDialog({ element, slots }: RegisteredComponentProps)
|
|
|
30
39
|
command={target}
|
|
31
40
|
visible={booleanProperty(element.properties, 'visible') ?? true}
|
|
32
41
|
width={stringProperty(element.properties, 'width')}
|
|
33
|
-
|
|
42
|
+
dismissable={booleanProperty(element.properties, 'dismissable')}
|
|
34
43
|
okLabel={stringProperty(element.properties, 'okLabel')}
|
|
35
44
|
cancelLabel={stringProperty(element.properties, 'cancelLabel')}
|
|
45
|
+
closeAriaLabel={stringProperty(element.properties, 'closeAriaLabel')}
|
|
36
46
|
className={stringProperty(element.properties, 'className')}
|
|
37
47
|
>
|
|
38
48
|
{slots.content}
|
package/dialogs/SceneDialog.tsx
CHANGED
|
@@ -19,6 +19,17 @@ const Dialog = lazy(async () => ({ default: (await import('@cratis/components/Di
|
|
|
19
19
|
*
|
|
20
20
|
* `visible` defaults to `true` because a dialog placed on a screen is being placed to be seen; a host
|
|
21
21
|
* that controls visibility sets the property explicitly.
|
|
22
|
+
*
|
|
23
|
+
* `dismissable` replaces the `resizable` property this adapter used to carry, and the swap is the whole
|
|
24
|
+
* PrimeReact 11 story in miniature. `resizable` is still declared on `DialogProps` so call sites compile,
|
|
25
|
+
* but version 11's headless dialog has no resize handle and the library never reads the prop - a screen
|
|
26
|
+
* setting it got nothing. `dismissable` is the opposite: 3.0.0 added it and honors it, and it decides
|
|
27
|
+
* whether the header close button, backdrop click and `Escape` are offered at all. Leaving it unset keeps
|
|
28
|
+
* the library's own default, so a screen opts into a dismiss affordance rather than having one imposed.
|
|
29
|
+
*
|
|
30
|
+
* `closeAriaLabel` names that close button. It is separate from every other label here because it is the
|
|
31
|
+
* only one a screen reader reads and nobody sees, which is exactly why it gets forgotten - offering it
|
|
32
|
+
* next to `okLabel` and `cancelLabel` is what makes localizing a dialog a complete job.
|
|
22
33
|
*/
|
|
23
34
|
export function SceneDialog({ element, slots }: RegisteredComponentProps) {
|
|
24
35
|
return (
|
|
@@ -27,11 +38,12 @@ export function SceneDialog({ element, slots }: RegisteredComponentProps) {
|
|
|
27
38
|
title={stringProperty(element.properties, 'title') ?? ''}
|
|
28
39
|
visible={booleanProperty(element.properties, 'visible') ?? true}
|
|
29
40
|
width={stringProperty(element.properties, 'width')}
|
|
30
|
-
|
|
41
|
+
dismissable={booleanProperty(element.properties, 'dismissable')}
|
|
31
42
|
isValid={booleanProperty(element.properties, 'isValid')}
|
|
32
43
|
isBusy={booleanProperty(element.properties, 'isBusy')}
|
|
33
44
|
okLabel={stringProperty(element.properties, 'okLabel')}
|
|
34
45
|
cancelLabel={stringProperty(element.properties, 'cancelLabel')}
|
|
46
|
+
closeAriaLabel={stringProperty(element.properties, 'closeAriaLabel')}
|
|
35
47
|
className={stringProperty(element.properties, 'className')}
|
|
36
48
|
>
|
|
37
49
|
{slots.content}
|
|
@@ -7,9 +7,16 @@ var properties = require('../properties.js');
|
|
|
7
7
|
/**
|
|
8
8
|
* The `Cratis.Components:dropdown` component - `Dropdown` from `@cratis/components/Dropdown`.
|
|
9
9
|
*
|
|
10
|
-
* The library's own `Dropdown` rather than PrimeReact's
|
|
11
|
-
*
|
|
12
|
-
*
|
|
10
|
+
* The library's own `Dropdown` rather than PrimeReact's `Select`, and the reason changed with PrimeReact
|
|
11
|
+
* 11. It used to be the overlay z-index fix: a version 10 dropdown panel opened inside a dialog rendered
|
|
12
|
+
* within the dialog's own subtree and could land under its mask, so the library appended every overlay to
|
|
13
|
+
* the document body and handed out z-indexes itself. Version 11 does both natively - the select panel
|
|
14
|
+
* portals to the body and the shared z-index registry puts a later overlay above whatever is already
|
|
15
|
+
* open - and `@cratis/components` 3.0.0 accordingly deleted that workaround. What the wrapper is worth
|
|
16
|
+
* now is its curated surface: a single/multi select expressed in `options` / `optionLabel` /
|
|
17
|
+
* `optionValue` terms, where version 11's `Select` is compositional (`Select.Root`, `.Trigger`,
|
|
18
|
+
* `.Portal`, `.Popup`, `.List`, `.Option`) and would have to be assembled here, in an adapter whose whole
|
|
19
|
+
* input is a property bag.
|
|
13
20
|
*
|
|
14
21
|
* This is the standalone dropdown, not the command-form one: it takes its options from the screen and is
|
|
15
22
|
* not bound to a command property. Use `dropdownField` inside a `commandForm`.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SceneDropdown.js","sources":["../../../common/SceneDropdown.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Dropdown } from '@cratis/components/Dropdown';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { booleanProperty, objectArrayProperty, stringProperty } from '../properties';\n\n/**\n * The `Cratis.Components:dropdown` component - `Dropdown` from `@cratis/components/Dropdown`.\n *\n * The library's own `Dropdown` rather than PrimeReact's
|
|
1
|
+
{"version":3,"file":"SceneDropdown.js","sources":["../../../common/SceneDropdown.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Dropdown } from '@cratis/components/Dropdown';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { booleanProperty, objectArrayProperty, stringProperty } from '../properties';\n\n/**\n * The `Cratis.Components:dropdown` component - `Dropdown` from `@cratis/components/Dropdown`.\n *\n * The library's own `Dropdown` rather than PrimeReact's `Select`, and the reason changed with PrimeReact\n * 11. It used to be the overlay z-index fix: a version 10 dropdown panel opened inside a dialog rendered\n * within the dialog's own subtree and could land under its mask, so the library appended every overlay to\n * the document body and handed out z-indexes itself. Version 11 does both natively - the select panel\n * portals to the body and the shared z-index registry puts a later overlay above whatever is already\n * open - and `@cratis/components` 3.0.0 accordingly deleted that workaround. What the wrapper is worth\n * now is its curated surface: a single/multi select expressed in `options` / `optionLabel` /\n * `optionValue` terms, where version 11's `Select` is compositional (`Select.Root`, `.Trigger`,\n * `.Portal`, `.Popup`, `.List`, `.Option`) and would have to be assembled here, in an adapter whose whole\n * input is a property bag.\n *\n * This is the standalone dropdown, not the command-form one: it takes its options from the screen and is\n * not bound to a command property. Use `dropdownField` inside a `commandForm`.\n */\nexport function SceneDropdown({ element }: RegisteredComponentProps) {\n return (\n <Dropdown\n options={objectArrayProperty(element.properties, 'options') ?? []}\n optionLabel={stringProperty(element.properties, 'optionLabel') ?? 'label'}\n optionValue={stringProperty(element.properties, 'optionValue') ?? 'value'}\n placeholder={stringProperty(element.properties, 'placeholder')}\n disabled={booleanProperty(element.properties, 'disabled')}\n showClear={booleanProperty(element.properties, 'showClear')}\n filter={booleanProperty(element.properties, 'filter')}\n className={stringProperty(element.properties, 'className')}\n />\n );\n}\n"],"names":["SceneDropdown","element","_jsx","Dropdown","options","objectArrayProperty","properties","optionLabel","stringProperty","optionValue","placeholder","disabled","booleanProperty","showClear","filter","className"],"mappings":";;;;;;AAOA;;;;;;;;;;;;;;;;AAgBC,IACM,SAASA,aAAAA,CAAc,EAAEC,OAAO,EAA4B,EAAA;AAC/D,IAAA,qBACIC,cAAA,CAACC,iBAAAA,EAAAA;AACGC,QAAAA,OAAAA,EAASC,8BAAAA,CAAoBJ,OAAAA,CAAQK,UAAU,EAAE,cAAc,EAAE;AACjEC,QAAAA,WAAAA,EAAaC,yBAAAA,CAAeP,OAAAA,CAAQK,UAAU,EAAE,aAAA,CAAA,IAAkB,OAAA;AAClEG,QAAAA,WAAAA,EAAaD,yBAAAA,CAAeP,OAAAA,CAAQK,UAAU,EAAE,aAAA,CAAA,IAAkB,OAAA;QAClEI,WAAAA,EAAaF,yBAAAA,CAAeP,OAAAA,CAAQK,UAAU,EAAE,aAAA,CAAA;QAChDK,QAAAA,EAAUC,0BAAAA,CAAgBX,OAAAA,CAAQK,UAAU,EAAE,UAAA,CAAA;QAC9CO,SAAAA,EAAWD,0BAAAA,CAAgBX,OAAAA,CAAQK,UAAU,EAAE,WAAA,CAAA;QAC/CQ,MAAAA,EAAQF,0BAAAA,CAAgBX,OAAAA,CAAQK,UAAU,EAAE,QAAA,CAAA;QAC5CS,SAAAA,EAAWP,yBAAAA,CAAeP,OAAAA,CAAQK,UAAU,EAAE,WAAA;;AAG1D;;;;"}
|
|
@@ -9,24 +9,28 @@ var cratisComponents = require('./cratisComponents.js');
|
|
|
9
9
|
* The `Cratis.Components` package's declaration - what a profile gets when it lists this package.
|
|
10
10
|
*
|
|
11
11
|
* This is the concrete case the whole package-dependency mechanism exists for. `@cratis/components` is
|
|
12
|
-
* not a self-contained library: every component in it is a wrapper over a PrimeReact widget, and its
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
* Tailwind and everything renders unstyled. Both are stated as
|
|
16
|
-
* so while the profile is being configured, instead of leaving
|
|
12
|
+
* not a self-contained library: every component in it is a wrapper over a PrimeReact widget, and its own
|
|
13
|
+
* styling is a `--cratis-*` token layer (`@cratis/components/tokens`) plus the component stylesheets and
|
|
14
|
+
* compiled Tailwind utilities in `@cratis/components/styles`. Activate it in a profile without PrimeReact
|
|
15
|
+
* and nothing renders; activate it without Tailwind and everything renders unstyled. Both are stated as
|
|
16
|
+
* dependencies so a package picker can say so while the profile is being configured, instead of leaving
|
|
17
|
+
* it to be discovered when the page opens.
|
|
17
18
|
*
|
|
18
|
-
* The version ranges are the real ones the library carries
|
|
19
|
-
*
|
|
20
|
-
*
|
|
21
|
-
*
|
|
19
|
+
* The version ranges are the real ones the library carries. `>=11.0.0` for PrimeReact: version 3.0.0
|
|
20
|
+
* declares `primereact@^11` as a peer dependency and is built against version 11's component set, so the
|
|
21
|
+
* span across the major boundary that the previous `>=10.9.0` range described is over. The `--cratis-*`
|
|
22
|
+
* tokens still resolve a version 10 theme variable as their last fallback, but that is an upgrade-window
|
|
23
|
+
* courtesy for an application with a compiled version 10 stylesheet still on the page - not a version of
|
|
24
|
+
* PrimeReact this package can be activated against. `^4.0.0` for Tailwind, because the utility sheet is
|
|
25
|
+
* compiled against Tailwind 4.
|
|
22
26
|
*/ const cratisComponentsPackageManifest = {
|
|
23
27
|
name: cratisComponents.cratisComponentsPackageName,
|
|
24
|
-
version: '
|
|
28
|
+
version: '3.0.0',
|
|
25
29
|
kind: scene_model.PackageKind.ComponentLibrary,
|
|
26
30
|
dependencies: [
|
|
27
31
|
{
|
|
28
32
|
name: 'PrimeReact',
|
|
29
|
-
versionRange: '>=
|
|
33
|
+
versionRange: '>=11.0.0'
|
|
30
34
|
},
|
|
31
35
|
{
|
|
32
36
|
name: 'Tailwind',
|
|
@@ -81,9 +85,9 @@ var cratisComponents = require('./cratisComponents.js');
|
|
|
81
85
|
screenTemplates: [],
|
|
82
86
|
dialogTemplates: [],
|
|
83
87
|
// No themes either, for a different reason: `@cratis/components` has no palette of its own. It reads
|
|
84
|
-
// a `--cratis-*` variable layer that resolves whatever
|
|
85
|
-
//
|
|
86
|
-
// asserting a look it was specifically built not to have.
|
|
88
|
+
// a `--cratis-*` variable layer that resolves whatever is in front of it - the `--p-*` properties a
|
|
89
|
+
// PrimeReact 11 preset emits at runtime, or a Scene theme through this package's token bridge.
|
|
90
|
+
// Shipping a theme here would be this library asserting a look it was specifically built not to have.
|
|
87
91
|
themes: [],
|
|
88
92
|
displayName: 'Cratis Components',
|
|
89
93
|
description: "Cratis' Arc-bound data, form and dialog composites, built on PrimeReact and Tailwind.",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cratisComponentsPackage.js","sources":["../../cratisComponentsPackage.ts"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { PackageKind, ScenePackage } from '@cratis/scene.model';\nimport { ScenePackageBundle } from '@cratis/scene.react';\nimport { cratisComponents, cratisComponentsPackageName } from './cratisComponents';\n\n/**\n * The `Cratis.Components` package's declaration - what a profile gets when it lists this package.\n *\n * This is the concrete case the whole package-dependency mechanism exists for. `@cratis/components` is\n * not a self-contained library: every component in it is a wrapper over a PrimeReact widget, and its\n *
|
|
1
|
+
{"version":3,"file":"cratisComponentsPackage.js","sources":["../../cratisComponentsPackage.ts"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { PackageKind, ScenePackage } from '@cratis/scene.model';\nimport { ScenePackageBundle } from '@cratis/scene.react';\nimport { cratisComponents, cratisComponentsPackageName } from './cratisComponents';\n\n/**\n * The `Cratis.Components` package's declaration - what a profile gets when it lists this package.\n *\n * This is the concrete case the whole package-dependency mechanism exists for. `@cratis/components` is\n * not a self-contained library: every component in it is a wrapper over a PrimeReact widget, and its own\n * styling is a `--cratis-*` token layer (`@cratis/components/tokens`) plus the component stylesheets and\n * compiled Tailwind utilities in `@cratis/components/styles`. Activate it in a profile without PrimeReact\n * and nothing renders; activate it without Tailwind and everything renders unstyled. Both are stated as\n * dependencies so a package picker can say so while the profile is being configured, instead of leaving\n * it to be discovered when the page opens.\n *\n * The version ranges are the real ones the library carries. `>=11.0.0` for PrimeReact: version 3.0.0\n * declares `primereact@^11` as a peer dependency and is built against version 11's component set, so the\n * span across the major boundary that the previous `>=10.9.0` range described is over. The `--cratis-*`\n * tokens still resolve a version 10 theme variable as their last fallback, but that is an upgrade-window\n * courtesy for an application with a compiled version 10 stylesheet still on the page - not a version of\n * PrimeReact this package can be activated against. `^4.0.0` for Tailwind, because the utility sheet is\n * compiled against Tailwind 4.\n */\nexport const cratisComponentsPackageManifest: ScenePackage = {\n name: cratisComponentsPackageName,\n version: '3.0.0',\n kind: PackageKind.ComponentLibrary,\n dependencies: [\n { name: 'PrimeReact', versionRange: '>=11.0.0' },\n { name: 'Tailwind', versionRange: '^4.0.0' },\n ],\n components: [\n 'page',\n 'dataPage',\n 'formElement',\n 'dataTable',\n 'table',\n 'observableDataTable',\n 'commandForm',\n 'inputTextField',\n 'numberField',\n 'checkboxField',\n 'textAreaField',\n 'dropdownField',\n 'sliderField',\n 'calendarField',\n 'colorPickerField',\n 'multiSelectField',\n 'chipsField',\n 'radioButtonField',\n 'radioGroupField',\n 'dialog',\n 'confirmationDialog',\n 'busyIndicatorDialog',\n 'commandDialog',\n 'stepperCommandDialog',\n 'icon',\n 'tooltip',\n 'dropdown',\n 'errorBoundary',\n 'objectContentEditor',\n 'objectNavigationalBar',\n 'schemaEditor',\n 'timeMachine',\n 'filterPanel',\n 'toolbar',\n 'toolbarButton',\n 'toolbarGroup',\n 'toolbarSeparator',\n ],\n\n // A component library ships components, and nothing else. Layouts, screen templates and dialog\n // templates all belong to a Blueprint: they are decisions about what an application looks like as a\n // whole, and this package deliberately makes none of them - it provides the Arc-bound composites a\n // template is *built from*, so that a blueprint can place a `dataPage` in a slot and configure it,\n // rather than shipping one opinionated data page nobody can rearrange.\n layouts: [],\n screenTemplates: [],\n dialogTemplates: [],\n\n // No themes either, for a different reason: `@cratis/components` has no palette of its own. It reads\n // a `--cratis-*` variable layer that resolves whatever is in front of it - the `--p-*` properties a\n // PrimeReact 11 preset emits at runtime, or a Scene theme through this package's token bridge.\n // Shipping a theme here would be this library asserting a look it was specifically built not to have.\n themes: [],\n\n displayName: 'Cratis Components',\n description: \"Cratis' Arc-bound data, form and dialog composites, built on PrimeReact and Tailwind.\",\n module: '@cratis/scene.components',\n};\n\n/**\n * The `Cratis.Components` package as a loadable bundle - the manifest above, plus the React components\n * behind the names it declares.\n *\n * No `layouts`, `screenTemplates`, `dialogTemplates` or `themes` are provided, matching a manifest that\n * declares none of them; `validatePackageBundle` is what proves the two halves agree.\n */\nexport const cratisComponentsPackage: ScenePackageBundle = {\n manifest: cratisComponentsPackageManifest,\n components: cratisComponents,\n};\n"],"names":["cratisComponentsPackageManifest","name","cratisComponentsPackageName","version","kind","PackageKind","ComponentLibrary","dependencies","versionRange","components","layouts","screenTemplates","dialogTemplates","themes","displayName","description","module","cratisComponentsPackage","manifest","cratisComponents"],"mappings":";;;;;AAAA;AACA;AAMA;;;;;;;;;;;;;;;;;;UAmBaA,+BAAAA,GAAgD;IACzDC,IAAAA,EAAMC,4CAAAA;IACNC,OAAAA,EAAS,OAAA;AACTC,IAAAA,IAAAA,EAAMC,wBAAYC,gBAAgB;IAClCC,YAAAA,EAAc;AACV,QAAA;YAAEN,IAAAA,EAAM,YAAA;YAAcO,YAAAA,EAAc;AAAW,SAAA;AAC/C,QAAA;YAAEP,IAAAA,EAAM,UAAA;YAAYO,YAAAA,EAAc;AAAS;AAC9C,KAAA;IACDC,UAAAA,EAAY;AACR,QAAA,MAAA;AACA,QAAA,UAAA;AACA,QAAA,aAAA;AACA,QAAA,WAAA;AACA,QAAA,OAAA;AACA,QAAA,qBAAA;AACA,QAAA,aAAA;AACA,QAAA,gBAAA;AACA,QAAA,aAAA;AACA,QAAA,eAAA;AACA,QAAA,eAAA;AACA,QAAA,eAAA;AACA,QAAA,aAAA;AACA,QAAA,eAAA;AACA,QAAA,kBAAA;AACA,QAAA,kBAAA;AACA,QAAA,YAAA;AACA,QAAA,kBAAA;AACA,QAAA,iBAAA;AACA,QAAA,QAAA;AACA,QAAA,oBAAA;AACA,QAAA,qBAAA;AACA,QAAA,eAAA;AACA,QAAA,sBAAA;AACA,QAAA,MAAA;AACA,QAAA,SAAA;AACA,QAAA,UAAA;AACA,QAAA,eAAA;AACA,QAAA,qBAAA;AACA,QAAA,uBAAA;AACA,QAAA,cAAA;AACA,QAAA,aAAA;AACA,QAAA,aAAA;AACA,QAAA,SAAA;AACA,QAAA,eAAA;AACA,QAAA,cAAA;AACA,QAAA;AACH,KAAA;;;;;;AAODC,IAAAA,OAAAA,EAAS,EAAE;AACXC,IAAAA,eAAAA,EAAiB,EAAE;AACnBC,IAAAA,eAAAA,EAAiB,EAAE;;;;;AAMnBC,IAAAA,MAAAA,EAAQ,EAAE;IAEVC,WAAAA,EAAa,mBAAA;IACbC,WAAAA,EAAa,uFAAA;IACbC,MAAAA,EAAQ;AACZ;AAEA;;;;;;UAOaC,uBAAAA,GAA8C;IACvDC,QAAAA,EAAUlB,+BAAAA;IACVS,UAAAA,EAAYU;AAChB;;;;;"}
|
|
@@ -22,6 +22,12 @@ const DataTableForQuery = /*#__PURE__*/ react.lazy(async ()=>({
|
|
|
22
22
|
* back into it, where PrimeReact's `DataTable` is handed rows and knows nothing about where they came from.
|
|
23
23
|
*
|
|
24
24
|
* The `query` property names an Arc query proxy; the columns come from the `content` slot.
|
|
25
|
+
*
|
|
26
|
+
* There is deliberately no `clientFiltering` property. `@cratis/components` 3.0.0 still accepts the prop
|
|
27
|
+
* so existing call sites compile, but it no longer does anything - filtering is always applied to the
|
|
28
|
+
* loaded page. Exposing a screen property that reads as a choice and silently is not would be worse than
|
|
29
|
+
* not offering it, so a screen that set it now gets a property-not-recognized signal rather than a
|
|
30
|
+
* setting that quietly stopped mattering.
|
|
25
31
|
*/ function SceneDataTable({ element, slots }) {
|
|
26
32
|
const { name, target } = resolveElementBinding.resolveElementBinding(element, BindingKind.BindingKind.Query);
|
|
27
33
|
if (!target) return /*#__PURE__*/ jsxRuntime.jsx(MissingBinding.MissingBinding, {
|
|
@@ -35,7 +41,6 @@ const DataTableForQuery = /*#__PURE__*/ react.lazy(async ()=>({
|
|
|
35
41
|
emptyMessage: properties.stringProperty(element.properties, 'emptyMessage') ?? '',
|
|
36
42
|
dataKey: properties.stringProperty(element.properties, 'dataKey'),
|
|
37
43
|
globalFilterFields: properties.stringArrayProperty(element.properties, 'globalFilterFields'),
|
|
38
|
-
clientFiltering: properties.booleanProperty(element.properties, 'clientFiltering'),
|
|
39
44
|
className: properties.stringProperty(element.properties, 'className'),
|
|
40
45
|
children: slots.content
|
|
41
46
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SceneDataTable.js","sources":["../../../data/SceneDataTable.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { lazy } from 'react';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { ArcRuntimeBoundary, BindingKind, MissingBinding, resolveElementBinding } from '../bindings';\nimport {
|
|
1
|
+
{"version":3,"file":"SceneDataTable.js","sources":["../../../data/SceneDataTable.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { lazy } from 'react';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { ArcRuntimeBoundary, BindingKind, MissingBinding, resolveElementBinding } from '../bindings';\nimport { stringArrayProperty, stringProperty } from '../properties';\n\nconst DataTableForQuery = lazy(async () => ({ default: (await import('@cratis/components/DataTables')).DataTableForQuery }));\n\n/**\n * The `Cratis.Components:dataTable` component, also registered as `table` - `DataTableForQuery` from\n * `@cratis/components/DataTables`.\n *\n * Registering it under the bare name `table` as well is override priority working as designed: a profile\n * listing `core`, `PrimeReact` and `Cratis.Components` in that order resolves `table` here and records\n * the other two as shadowed. That is the right outcome, because this is a strictly better `table` for a\n * Cratis application - it performs the query, pages against the server, and wires filtering and sorting\n * back into it, where PrimeReact's `DataTable` is handed rows and knows nothing about where they came from.\n *\n * The `query` property names an Arc query proxy; the columns come from the `content` slot.\n *\n * There is deliberately no `clientFiltering` property. `@cratis/components` 3.0.0 still accepts the prop\n * so existing call sites compile, but it no longer does anything - filtering is always applied to the\n * loaded page. Exposing a screen property that reads as a choice and silently is not would be worse than\n * not offering it, so a screen that set it now gets a property-not-recognized signal rather than a\n * setting that quietly stopped mattering.\n */\nexport function SceneDataTable({ element, slots }: RegisteredComponentProps) {\n const { name, target } = resolveElementBinding(element, BindingKind.Query);\n if (!target) return <MissingBinding element={element} kind={BindingKind.Query} name={name} />;\n\n return (\n <ArcRuntimeBoundary>\n <DataTableForQuery\n query={target}\n emptyMessage={stringProperty(element.properties, 'emptyMessage') ?? ''}\n dataKey={stringProperty(element.properties, 'dataKey')}\n globalFilterFields={stringArrayProperty(element.properties, 'globalFilterFields')}\n className={stringProperty(element.properties, 'className')}\n >\n {slots.content}\n </DataTableForQuery>\n </ArcRuntimeBoundary>\n );\n}\n"],"names":["DataTableForQuery","lazy","default","SceneDataTable","element","slots","name","target","resolveElementBinding","BindingKind","Query","_jsx","MissingBinding","kind","ArcRuntimeBoundary","query","emptyMessage","stringProperty","properties","dataKey","globalFilterFields","stringArrayProperty","className","content"],"mappings":";;;;;;;;;;AAQA,MAAMA,iBAAAA,iBAAoBC,UAAAA,CAAK,WAAa;AAAEC,QAAAA,OAAAA,EAAS,CAAC,MAAM,OAAO,+BAAA,CAA+B,EAAGF;KAAkB,CAAA,CAAA;AAEzH;;;;;;;;;;;;;;;;;AAiBC,IACM,SAASG,cAAAA,CAAe,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;IACvE,MAAM,EAAEC,IAAI,EAAEC,MAAM,EAAE,GAAGC,2CAAAA,CAAsBJ,OAAAA,EAASK,uBAAAA,CAAYC,KAAK,CAAA;IACzE,IAAI,CAACH,MAAAA,EAAQ,qBAAOI,cAAA,CAACC,6BAAAA,EAAAA;QAAeR,OAAAA,EAASA,OAAAA;AAASS,QAAAA,IAAAA,EAAMJ,wBAAYC,KAAK;QAAEJ,IAAAA,EAAMA;;AAErF,IAAA,qBACIK,cAAA,CAACG,qCAAAA,EAAAA;AACG,QAAA,QAAA,gBAAAH,cAAA,CAACX,iBAAAA,EAAAA;YACGe,KAAAA,EAAOR,MAAAA;AACPS,YAAAA,YAAAA,EAAcC,yBAAAA,CAAeb,OAAAA,CAAQc,UAAU,EAAE,cAAA,CAAA,IAAmB,EAAA;YACpEC,OAAAA,EAASF,yBAAAA,CAAeb,OAAAA,CAAQc,UAAU,EAAE,SAAA,CAAA;YAC5CE,kBAAAA,EAAoBC,8BAAAA,CAAoBjB,OAAAA,CAAQc,UAAU,EAAE,oBAAA,CAAA;YAC5DI,SAAAA,EAAWL,yBAAAA,CAAeb,OAAAA,CAAQc,UAAU,EAAE,WAAA,CAAA;AAE7Cb,YAAAA,QAAAA,EAAAA,KAAAA,CAAMkB;;;AAIvB;;;;"}
|
|
@@ -20,6 +20,10 @@ const DataTableForObservableQuery = /*#__PURE__*/ react.lazy(async ()=>({
|
|
|
20
20
|
* re-renders when the server's read model changes, and a plain query does not. A screen that names an
|
|
21
21
|
* observable query here is stating that its data is live, which is a design decision worth being able to
|
|
22
22
|
* read off the screen.
|
|
23
|
+
*
|
|
24
|
+
* As with `dataTable`, no `clientFiltering` property is exposed: `@cratis/components` 3.0.0 keeps the
|
|
25
|
+
* prop for source compatibility but ignores it, and a screen property that cannot change anything is
|
|
26
|
+
* worse than an absent one.
|
|
23
27
|
*/ function SceneObservableDataTable({ element, slots }) {
|
|
24
28
|
const { name, target } = resolveElementBinding.resolveElementBinding(element, BindingKind.BindingKind.Query);
|
|
25
29
|
if (!target) return /*#__PURE__*/ jsxRuntime.jsx(MissingBinding.MissingBinding, {
|
|
@@ -33,7 +37,6 @@ const DataTableForObservableQuery = /*#__PURE__*/ react.lazy(async ()=>({
|
|
|
33
37
|
emptyMessage: properties.stringProperty(element.properties, 'emptyMessage') ?? '',
|
|
34
38
|
dataKey: properties.stringProperty(element.properties, 'dataKey'),
|
|
35
39
|
globalFilterFields: properties.stringArrayProperty(element.properties, 'globalFilterFields'),
|
|
36
|
-
clientFiltering: properties.booleanProperty(element.properties, 'clientFiltering'),
|
|
37
40
|
className: properties.stringProperty(element.properties, 'className'),
|
|
38
41
|
children: slots.content
|
|
39
42
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SceneObservableDataTable.js","sources":["../../../data/SceneObservableDataTable.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { lazy } from 'react';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { ArcRuntimeBoundary, BindingKind, MissingBinding, resolveElementBinding } from '../bindings';\nimport {
|
|
1
|
+
{"version":3,"file":"SceneObservableDataTable.js","sources":["../../../data/SceneObservableDataTable.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { lazy } from 'react';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { ArcRuntimeBoundary, BindingKind, MissingBinding, resolveElementBinding } from '../bindings';\nimport { stringArrayProperty, stringProperty } from '../properties';\n\nconst DataTableForObservableQuery = lazy(async () => ({\n default: (await import('@cratis/components/DataTables')).DataTableForObservableQuery,\n}));\n\n/**\n * The `Cratis.Components:observableDataTable` component - `DataTableForObservableQuery` from\n * `@cratis/components/DataTables`.\n *\n * A separate name rather than a flag on `dataTable`, because the distinction is in the *proxy* a host\n * registers, not in how the table is configured: an observable query opens a WebSocket subscription and\n * re-renders when the server's read model changes, and a plain query does not. A screen that names an\n * observable query here is stating that its data is live, which is a design decision worth being able to\n * read off the screen.\n *\n * As with `dataTable`, no `clientFiltering` property is exposed: `@cratis/components` 3.0.0 keeps the\n * prop for source compatibility but ignores it, and a screen property that cannot change anything is\n * worse than an absent one.\n */\nexport function SceneObservableDataTable({ element, slots }: RegisteredComponentProps) {\n const { name, target } = resolveElementBinding(element, BindingKind.Query);\n if (!target) return <MissingBinding element={element} kind={BindingKind.Query} name={name} />;\n\n return (\n <ArcRuntimeBoundary>\n <DataTableForObservableQuery\n query={target}\n emptyMessage={stringProperty(element.properties, 'emptyMessage') ?? ''}\n dataKey={stringProperty(element.properties, 'dataKey')}\n globalFilterFields={stringArrayProperty(element.properties, 'globalFilterFields')}\n className={stringProperty(element.properties, 'className')}\n >\n {slots.content}\n </DataTableForObservableQuery>\n </ArcRuntimeBoundary>\n );\n}\n"],"names":["DataTableForObservableQuery","lazy","default","SceneObservableDataTable","element","slots","name","target","resolveElementBinding","BindingKind","Query","_jsx","MissingBinding","kind","ArcRuntimeBoundary","query","emptyMessage","stringProperty","properties","dataKey","globalFilterFields","stringArrayProperty","className","content"],"mappings":";;;;;;;;;;AAQA,MAAMA,2BAAAA,iBAA8BC,UAAAA,CAAK,WAAa;AAClDC,QAAAA,OAAAA,EAAS,CAAC,MAAM,OAAO,+BAAA,CAA+B,EAAGF;KAC7D,CAAA,CAAA;AAEA;;;;;;;;;;;;;AAaC,IACM,SAASG,wBAAAA,CAAyB,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;IACjF,MAAM,EAAEC,IAAI,EAAEC,MAAM,EAAE,GAAGC,2CAAAA,CAAsBJ,OAAAA,EAASK,uBAAAA,CAAYC,KAAK,CAAA;IACzE,IAAI,CAACH,MAAAA,EAAQ,qBAAOI,cAAA,CAACC,6BAAAA,EAAAA;QAAeR,OAAAA,EAASA,OAAAA;AAASS,QAAAA,IAAAA,EAAMJ,wBAAYC,KAAK;QAAEJ,IAAAA,EAAMA;;AAErF,IAAA,qBACIK,cAAA,CAACG,qCAAAA,EAAAA;AACG,QAAA,QAAA,gBAAAH,cAAA,CAACX,2BAAAA,EAAAA;YACGe,KAAAA,EAAOR,MAAAA;AACPS,YAAAA,YAAAA,EAAcC,yBAAAA,CAAeb,OAAAA,CAAQc,UAAU,EAAE,cAAA,CAAA,IAAmB,EAAA;YACpEC,OAAAA,EAASF,yBAAAA,CAAeb,OAAAA,CAAQc,UAAU,EAAE,SAAA,CAAA;YAC5CE,kBAAAA,EAAoBC,8BAAAA,CAAoBjB,OAAAA,CAAQc,UAAU,EAAE,oBAAA,CAAA;YAC5DI,SAAAA,EAAWL,yBAAAA,CAAeb,OAAAA,CAAQc,UAAU,EAAE,WAAA,CAAA;AAE7Cb,YAAAA,QAAAA,EAAAA,KAAAA,CAAMkB;;;AAIvB;;;;"}
|
|
@@ -21,6 +21,15 @@ const CommandDialog = /*#__PURE__*/ react.lazy(async ()=>({
|
|
|
21
21
|
* reimplementing the protocol.
|
|
22
22
|
*
|
|
23
23
|
* The `command` property names an Arc command proxy; the fields go in the `content` slot.
|
|
24
|
+
*
|
|
25
|
+
* `dismissable` and `closeAriaLabel` are here rather than on `dialog` alone because `CommandDialog`
|
|
26
|
+
* forwards both to the dialog it wraps, and in `@cratis/components` 3.0.0 that forwarding actually
|
|
27
|
+
* happens - 2.x accepted the two props and dropped them on the floor. `dismissable` matters more on a
|
|
28
|
+
* command dialog than anywhere else: it decides whether a half-filled form can be abandoned with
|
|
29
|
+
* `Escape` or a backdrop click, which is a decision about the command, not about the chrome.
|
|
30
|
+
*
|
|
31
|
+
* The `resizable` property this adapter used to carry is gone. It is still declared upstream so call
|
|
32
|
+
* sites compile, but PrimeReact 11's headless dialog has no resize handle and nothing reads the prop.
|
|
24
33
|
*/ function SceneCommandDialog({ element, slots }) {
|
|
25
34
|
const { name, target } = resolveElementBinding.resolveElementBinding(element, BindingKind.BindingKind.Command);
|
|
26
35
|
if (!target) return /*#__PURE__*/ jsxRuntime.jsx(MissingBinding.MissingBinding, {
|
|
@@ -34,9 +43,10 @@ const CommandDialog = /*#__PURE__*/ react.lazy(async ()=>({
|
|
|
34
43
|
command: target,
|
|
35
44
|
visible: properties.booleanProperty(element.properties, 'visible') ?? true,
|
|
36
45
|
width: properties.stringProperty(element.properties, 'width'),
|
|
37
|
-
|
|
46
|
+
dismissable: properties.booleanProperty(element.properties, 'dismissable'),
|
|
38
47
|
okLabel: properties.stringProperty(element.properties, 'okLabel'),
|
|
39
48
|
cancelLabel: properties.stringProperty(element.properties, 'cancelLabel'),
|
|
49
|
+
closeAriaLabel: properties.stringProperty(element.properties, 'closeAriaLabel'),
|
|
40
50
|
className: properties.stringProperty(element.properties, 'className'),
|
|
41
51
|
children: slots.content
|
|
42
52
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SceneCommandDialog.js","sources":["../../../dialogs/SceneCommandDialog.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { lazy } from 'react';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { ArcRuntimeBoundary, BindingKind, MissingBinding, resolveElementBinding } from '../bindings';\nimport { booleanProperty, stringProperty } from '../properties';\n\nconst CommandDialog = lazy(async () => ({ default: (await import('@cratis/components/CommandDialog')).CommandDialog }));\n\n/**\n * The `Cratis.Components:commandDialog` component - `CommandDialog` from `@cratis/components/CommandDialog`.\n *\n * A dialog whose confirm button *is* the command's execution: it binds the form to the command, submits\n * on confirm, feeds the backend's validation results back onto the fields, and only closes when the\n * command succeeded. That last part is the reason to use it rather than composing `dialog` with\n * `commandForm` - a hand-composed pair has no way to keep the dialog open on a rejected command without\n * reimplementing the protocol.\n *\n * The `command` property names an Arc command proxy; the fields go in the `content` slot.\n */\nexport function SceneCommandDialog({ element, slots }: RegisteredComponentProps) {\n const { name, target } = resolveElementBinding(element, BindingKind.Command);\n if (!target) return <MissingBinding element={element} kind={BindingKind.Command} name={name} />;\n\n return (\n <ArcRuntimeBoundary>\n <CommandDialog\n title={stringProperty(element.properties, 'title') ?? ''}\n command={target}\n visible={booleanProperty(element.properties, 'visible') ?? true}\n width={stringProperty(element.properties, 'width')}\n
|
|
1
|
+
{"version":3,"file":"SceneCommandDialog.js","sources":["../../../dialogs/SceneCommandDialog.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { lazy } from 'react';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { ArcRuntimeBoundary, BindingKind, MissingBinding, resolveElementBinding } from '../bindings';\nimport { booleanProperty, stringProperty } from '../properties';\n\nconst CommandDialog = lazy(async () => ({ default: (await import('@cratis/components/CommandDialog')).CommandDialog }));\n\n/**\n * The `Cratis.Components:commandDialog` component - `CommandDialog` from `@cratis/components/CommandDialog`.\n *\n * A dialog whose confirm button *is* the command's execution: it binds the form to the command, submits\n * on confirm, feeds the backend's validation results back onto the fields, and only closes when the\n * command succeeded. That last part is the reason to use it rather than composing `dialog` with\n * `commandForm` - a hand-composed pair has no way to keep the dialog open on a rejected command without\n * reimplementing the protocol.\n *\n * The `command` property names an Arc command proxy; the fields go in the `content` slot.\n *\n * `dismissable` and `closeAriaLabel` are here rather than on `dialog` alone because `CommandDialog`\n * forwards both to the dialog it wraps, and in `@cratis/components` 3.0.0 that forwarding actually\n * happens - 2.x accepted the two props and dropped them on the floor. `dismissable` matters more on a\n * command dialog than anywhere else: it decides whether a half-filled form can be abandoned with\n * `Escape` or a backdrop click, which is a decision about the command, not about the chrome.\n *\n * The `resizable` property this adapter used to carry is gone. It is still declared upstream so call\n * sites compile, but PrimeReact 11's headless dialog has no resize handle and nothing reads the prop.\n */\nexport function SceneCommandDialog({ element, slots }: RegisteredComponentProps) {\n const { name, target } = resolveElementBinding(element, BindingKind.Command);\n if (!target) return <MissingBinding element={element} kind={BindingKind.Command} name={name} />;\n\n return (\n <ArcRuntimeBoundary>\n <CommandDialog\n title={stringProperty(element.properties, 'title') ?? ''}\n command={target}\n visible={booleanProperty(element.properties, 'visible') ?? true}\n width={stringProperty(element.properties, 'width')}\n dismissable={booleanProperty(element.properties, 'dismissable')}\n okLabel={stringProperty(element.properties, 'okLabel')}\n cancelLabel={stringProperty(element.properties, 'cancelLabel')}\n closeAriaLabel={stringProperty(element.properties, 'closeAriaLabel')}\n className={stringProperty(element.properties, 'className')}\n >\n {slots.content}\n </CommandDialog>\n </ArcRuntimeBoundary>\n );\n}\n"],"names":["CommandDialog","lazy","default","SceneCommandDialog","element","slots","name","target","resolveElementBinding","BindingKind","Command","_jsx","MissingBinding","kind","ArcRuntimeBoundary","title","stringProperty","properties","command","visible","booleanProperty","width","dismissable","okLabel","cancelLabel","closeAriaLabel","className","content"],"mappings":";;;;;;;;;;AAQA,MAAMA,aAAAA,iBAAgBC,UAAAA,CAAK,WAAa;AAAEC,QAAAA,OAAAA,EAAS,CAAC,MAAM,OAAO,kCAAA,CAAkC,EAAGF;KAAc,CAAA,CAAA;AAEpH;;;;;;;;;;;;;;;;;;;AAmBC,IACM,SAASG,kBAAAA,CAAmB,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;IAC3E,MAAM,EAAEC,IAAI,EAAEC,MAAM,EAAE,GAAGC,2CAAAA,CAAsBJ,OAAAA,EAASK,uBAAAA,CAAYC,OAAO,CAAA;IAC3E,IAAI,CAACH,MAAAA,EAAQ,qBAAOI,cAAA,CAACC,6BAAAA,EAAAA;QAAeR,OAAAA,EAASA,OAAAA;AAASS,QAAAA,IAAAA,EAAMJ,wBAAYC,OAAO;QAAEJ,IAAAA,EAAMA;;AAEvF,IAAA,qBACIK,cAAA,CAACG,qCAAAA,EAAAA;AACG,QAAA,QAAA,gBAAAH,cAAA,CAACX,aAAAA,EAAAA;AACGe,YAAAA,KAAAA,EAAOC,yBAAAA,CAAeZ,OAAAA,CAAQa,UAAU,EAAE,OAAA,CAAA,IAAY,EAAA;YACtDC,OAAAA,EAASX,MAAAA;AACTY,YAAAA,OAAAA,EAASC,0BAAAA,CAAgBhB,OAAAA,CAAQa,UAAU,EAAE,SAAA,CAAA,IAAc,IAAA;YAC3DI,KAAAA,EAAOL,yBAAAA,CAAeZ,OAAAA,CAAQa,UAAU,EAAE,OAAA,CAAA;YAC1CK,WAAAA,EAAaF,0BAAAA,CAAgBhB,OAAAA,CAAQa,UAAU,EAAE,aAAA,CAAA;YACjDM,OAAAA,EAASP,yBAAAA,CAAeZ,OAAAA,CAAQa,UAAU,EAAE,SAAA,CAAA;YAC5CO,WAAAA,EAAaR,yBAAAA,CAAeZ,OAAAA,CAAQa,UAAU,EAAE,aAAA,CAAA;YAChDQ,cAAAA,EAAgBT,yBAAAA,CAAeZ,OAAAA,CAAQa,UAAU,EAAE,gBAAA,CAAA;YACnDS,SAAAA,EAAWV,yBAAAA,CAAeZ,OAAAA,CAAQa,UAAU,EAAE,WAAA,CAAA;AAE7CZ,YAAAA,QAAAA,EAAAA,KAAAA,CAAMsB;;;AAIvB;;;;"}
|