@cratis/scene.react 4.15.0 → 4.16.0

package/core/ScreenplayCoreComponents.tsx

@@ -1,7 +1,8 @@
 // Copyright (c) Cratis. All rights reserved.
 // Licensed under the MIT license. See LICENSE file in the project root for full license information.
 
-import { RegisteredComponentProps } from '../renderer';
+import { resolveArgumentSource } from '@cratis/scene.engine';
+import { RegisteredComponentProps, useRenderBindingScope } from '../renderer';
 
 function textProperty(properties: Record<string, unknown>, name: string, fallback = ''): string {
     return typeof properties[name] === 'string' ? properties[name] : fallback;
@@ -12,11 +13,31 @@ export function CoreData({ element }: RegisteredComponentProps) {
     return <span hidden data-scene-id={element.id} data-scene-data={textProperty(element.properties, 'typeName')} />;
 }
 
-/** Renders a modeled command action and emits a host-neutral command event when invoked. */
+/** One entry of a command action's argument mapping. */
+interface ArgumentMapping {
+    name?: unknown;
+    source?: unknown;
+}
+
+/**
+ * Renders a modeled command action and emits a host-neutral command event when invoked.
+ *
+ * The event carries the resolved `arguments`, by name, read when the action is invoked: a
+ * `component.<id>.<output>` source reads what another element publishes - such as what the user typed into
+ * an input - and any other source is a data-context path. Hosts that read the mapping from `element`
+ * themselves keep working.
+ */
 export function CoreAction({ element }: RegisteredComponentProps) {
     const command = textProperty(element.properties, 'command');
     const label = textProperty(element.properties, 'label', command);
-    const invoke = () => globalThis.dispatchEvent(new CustomEvent('cratis.scene.command', { detail: { command, element } }));
+    const scope = useRenderBindingScope();
+    const invoke = () => {
+        const mapping = Array.isArray(element.properties.arguments) ? element.properties.arguments as ArgumentMapping[] : [];
+        const args = Object.fromEntries(mapping
+            .filter((argument): argument is { name: string; source: string } => typeof argument.name === 'string' && typeof argument.source === 'string')
+            .map(argument => [argument.name, resolveArgumentSource(argument.source, scope)]));
+        globalThis.dispatchEvent(new CustomEvent('cratis.scene.command', { detail: { command, element, arguments: args } }));
+    };
     return <button type='button' data-scene-id={element.id} onClick={invoke}>{label}</button>;
 }
 

package/dist/cjs/SceneElementView.js

@@ -4,6 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var react = require('react');
 var scene_engine = require('@cratis/scene.engine');
 var RenderBindingScopeContext = require('./renderer/RenderBindingScopeContext.js');
+require('@cratis/scene.model');
 var createReactRenderer = require('./renderer/createReactRenderer.js');
 require('./interactions/useInteractions.js');
 require('./interactions/NotificationHost.js');

package/dist/cjs/SceneElementView.js.map

@@ -1 +1 @@
-{"version":3,"file":"SceneElementView.js","sources":["../../SceneElementView.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 { useMemo } from 'react';\nimport { applyEffectiveConfiguration, renderElement, BindingResolver } from '@cratis/scene.engine';\nimport { EffectiveConfiguration, SceneElement } from '@cratis/scene.model';\nimport { ComponentRegistry, RenderBindingScopeProvider, createReactRenderer, useRenderBindingResolver } from './renderer';\n\nexport interface SceneElementViewProps {\n    element: SceneElement;\n    registry: ComponentRegistry;\n    resolveBinding?: BindingResolver;\n    dataContext?: unknown;\n    queryResults?: Record<string, unknown>;\n    componentOutputs?: Record<string, Record<string, unknown>>;\n\n    /**\n     * The resolved configuration of the template chain the element sits in, from `resolveEffectiveConfiguration`.\n     * When given, each configurable component renders with its resolved properties - what a screen's own values add\n     * to an inherited template. It is the same data the editor shows, and the same code path whether the screen is\n     * being edited or played: there is no design-time mode.\n     */\n    configuration?: EffectiveConfiguration;\n\n    /** Called when rendered components publish or clear output properties for typed bindings. */\n    onComponentOutputsChanged?: (outputs: Record<string, Record<string, unknown>>) => void;\n}\n\n/**\n * Renders a Scene element tree with the real `Scene.React` renderer - the WYSIWYG building block Studio's\n * preview surface and Stage's shipped web bundle both consume unmodified.\n */\nexport function SceneElementView({\n    element,\n    registry,\n    resolveBinding,\n    configuration,\n    onComponentOutputsChanged,\n    dataContext,\n    queryResults,\n    componentOutputs,\n}: SceneElementViewProps) {\n    const configured = useMemo(() => configuration ? applyEffectiveConfiguration(element, configuration) : element, [element, configuration]);\n    return (\n        <RenderBindingScopeProvider\n            dataContext={dataContext}\n            queryResults={queryResults}\n            componentOutputs={componentOutputs}\n            resolveBinding={resolveBinding}\n            onComponentOutputsChanged={onComponentOutputsChanged}>\n            <RenderedElement element={configured} registry={registry} />\n        </RenderBindingScopeProvider>\n    );\n}\n\nfunction RenderedElement({ element, registry }: { element: SceneElement; registry: ComponentRegistry }) {\n    const renderer = useMemo(() => createReactRenderer(registry), [registry]);\n    const resolveBinding = useRenderBindingResolver();\n    return <>{renderElement(element, renderer, resolveBinding)}</>;\n}\n"],"names":["SceneElementView","element","registry","resolveBinding","configuration","onComponentOutputsChanged","dataContext","queryResults","componentOutputs","configured","useMemo","applyEffectiveConfiguration","_jsx","RenderBindingScopeProvider","RenderedElement","renderer","createReactRenderer","useRenderBindingResolver","_Fragment","renderElement"],"mappings":";;;;;;;;;;AA4BA;;;AAGC,IACM,SAASA,gBAAAA,CAAiB,EAC7BC,OAAO,EACPC,QAAQ,EACRC,cAAc,EACdC,aAAa,EACbC,yBAAyB,EACzBC,WAAW,EACXC,YAAY,EACZC,gBAAgB,EACI,EAAA;AACpB,IAAA,MAAMC,aAAaC,aAAAA,CAAQ,IAAMN,gBAAgBO,wCAAAA,CAA4BV,OAAAA,EAASG,iBAAiBH,OAAAA,EAAS;AAACA,QAAAA,OAAAA;AAASG,QAAAA;AAAc,KAAA,CAAA;AACxI,IAAA,qBACIQ,cAAA,CAACC,oDAAAA,EAAAA;QACGP,WAAAA,EAAaA,WAAAA;QACbC,YAAAA,EAAcA,YAAAA;QACdC,gBAAAA,EAAkBA,gBAAAA;QAClBL,cAAAA,EAAgBA,cAAAA;QAChBE,yBAAAA,EAA2BA,yBAAAA;AAC3B,QAAA,QAAA,gBAAAO,cAAA,CAACE,eAAAA,EAAAA;YAAgBb,OAAAA,EAASQ,UAAAA;YAAYP,QAAAA,EAAUA;;;AAG5D;AAEA,SAASY,eAAAA,CAAgB,EAAEb,OAAO,EAAEC,QAAQ,EAA0D,EAAA;AAClG,IAAA,MAAMa,QAAAA,GAAWL,aAAAA,CAAQ,IAAMM,uCAAAA,CAAoBd,QAAAA,CAAAA,EAAW;AAACA,QAAAA;AAAS,KAAA,CAAA;AACxE,IAAA,MAAMC,cAAAA,GAAiBc,kDAAAA,EAAAA;IACvB,qBAAOL,cAAA,CAAAM,mBAAA,EAAA;AAAGC,QAAAA,QAAAA,EAAAA,0BAAAA,CAAclB,SAASc,QAAAA,EAAUZ,cAAAA;;AAC/C;;"}
+{"version":3,"file":"SceneElementView.js","sources":["../../SceneElementView.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 { useMemo } from 'react';\nimport { applyEffectiveConfiguration, renderElement, BindingResolver } from '@cratis/scene.engine';\nimport { EffectiveConfiguration, SceneElement } from '@cratis/scene.model';\nimport { ComponentRegistry, RenderBindingScopeProvider, createReactRenderer, useRenderBindingResolver } from './renderer';\n\nexport interface SceneElementViewProps {\n    element: SceneElement;\n    registry: ComponentRegistry;\n    resolveBinding?: BindingResolver;\n    dataContext?: unknown;\n    queryResults?: Record<string, unknown>;\n    componentOutputs?: Record<string, Record<string, unknown>>;\n\n    /**\n     * The resolved configuration of the template chain the element sits in, from `resolveEffectiveConfiguration`.\n     * When given, each configurable component renders with its resolved properties - what a screen's own values add\n     * to an inherited template. It is the same data the editor shows, and the same code path whether the screen is\n     * being edited or played: there is no design-time mode.\n     */\n    configuration?: EffectiveConfiguration;\n\n    /** Called when rendered components publish or clear output properties for typed bindings. */\n    onComponentOutputsChanged?: (outputs: Record<string, Record<string, unknown>>) => void;\n}\n\n/**\n * Renders a Scene element tree with the real `Scene.React` renderer - the WYSIWYG building block Studio's\n * preview surface and Stage's shipped web bundle both consume unmodified.\n */\nexport function SceneElementView({\n    element,\n    registry,\n    resolveBinding,\n    configuration,\n    onComponentOutputsChanged,\n    dataContext,\n    queryResults,\n    componentOutputs,\n}: SceneElementViewProps) {\n    const configured = useMemo(() => configuration ? applyEffectiveConfiguration(element, configuration) : element, [element, configuration]);\n    return (\n        <RenderBindingScopeProvider\n            dataContext={dataContext}\n            queryResults={queryResults}\n            componentOutputs={componentOutputs}\n            resolveBinding={resolveBinding}\n            onComponentOutputsChanged={onComponentOutputsChanged}>\n            <RenderedElement element={configured} registry={registry} />\n        </RenderBindingScopeProvider>\n    );\n}\n\nfunction RenderedElement({ element, registry }: { element: SceneElement; registry: ComponentRegistry }) {\n    const renderer = useMemo(() => createReactRenderer(registry), [registry]);\n    const resolveBinding = useRenderBindingResolver();\n    return <>{renderElement(element, renderer, resolveBinding)}</>;\n}\n"],"names":["SceneElementView","element","registry","resolveBinding","configuration","onComponentOutputsChanged","dataContext","queryResults","componentOutputs","configured","useMemo","applyEffectiveConfiguration","_jsx","RenderBindingScopeProvider","RenderedElement","renderer","createReactRenderer","useRenderBindingResolver","_Fragment","renderElement"],"mappings":";;;;;;;;;;;AA4BA;;;AAGC,IACM,SAASA,gBAAAA,CAAiB,EAC7BC,OAAO,EACPC,QAAQ,EACRC,cAAc,EACdC,aAAa,EACbC,yBAAyB,EACzBC,WAAW,EACXC,YAAY,EACZC,gBAAgB,EACI,EAAA;AACpB,IAAA,MAAMC,aAAaC,aAAAA,CAAQ,IAAMN,gBAAgBO,wCAAAA,CAA4BV,OAAAA,EAASG,iBAAiBH,OAAAA,EAAS;AAACA,QAAAA,OAAAA;AAASG,QAAAA;AAAc,KAAA,CAAA;AACxI,IAAA,qBACIQ,cAAA,CAACC,oDAAAA,EAAAA;QACGP,WAAAA,EAAaA,WAAAA;QACbC,YAAAA,EAAcA,YAAAA;QACdC,gBAAAA,EAAkBA,gBAAAA;QAClBL,cAAAA,EAAgBA,cAAAA;QAChBE,yBAAAA,EAA2BA,yBAAAA;AAC3B,QAAA,QAAA,gBAAAO,cAAA,CAACE,eAAAA,EAAAA;YAAgBb,OAAAA,EAASQ,UAAAA;YAAYP,QAAAA,EAAUA;;;AAG5D;AAEA,SAASY,eAAAA,CAAgB,EAAEb,OAAO,EAAEC,QAAQ,EAA0D,EAAA;AAClG,IAAA,MAAMa,QAAAA,GAAWL,aAAAA,CAAQ,IAAMM,uCAAAA,CAAoBd,QAAAA,CAAAA,EAAW;AAACA,QAAAA;AAAS,KAAA,CAAA;AACxE,IAAA,MAAMC,cAAAA,GAAiBc,kDAAAA,EAAAA;IACvB,qBAAOL,cAAA,CAAAM,mBAAA,EAAA;AAAGC,QAAAA,QAAAA,EAAAA,0BAAAA,CAAclB,SAASc,QAAAA,EAAUZ,cAAAA;;AAC/C;;"}

package/dist/cjs/core/ScreenplayCoreComponents.js

@@ -1,9 +1,13 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
+var scene_engine = require('@cratis/scene.engine');
+require('react');
+var RenderBindingScopeContext = require('../renderer/RenderBindingScopeContext.js');
+require('@cratis/scene.model');
+require('../interactions/useInteractions.js');
+require('../interactions/NotificationHost.js');
 
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
 function textProperty(properties, name, fallback = '') {
     return typeof properties[name] === 'string' ? properties[name] : fallback;
 }
@@ -14,15 +18,31 @@ function textProperty(properties, name, fallback = '') {
         "data-scene-data": textProperty(element.properties, 'typeName')
     });
 }
-/** Renders a modeled command action and emits a host-neutral command event when invoked. */ function CoreAction({ element }) {
+/**
+ * Renders a modeled command action and emits a host-neutral command event when invoked.
+ *
+ * The event carries the resolved `arguments`, by name, read when the action is invoked: a
+ * `component.<id>.<output>` source reads what another element publishes - such as what the user typed into
+ * an input - and any other source is a data-context path. Hosts that read the mapping from `element`
+ * themselves keep working.
+ */ function CoreAction({ element }) {
     const command = textProperty(element.properties, 'command');
     const label = textProperty(element.properties, 'label', command);
-    const invoke = ()=>globalThis.dispatchEvent(new CustomEvent('cratis.scene.command', {
+    const scope = RenderBindingScopeContext.useRenderBindingScope();
+    const invoke = ()=>{
+        const mapping = Array.isArray(element.properties.arguments) ? element.properties.arguments : [];
+        const args = Object.fromEntries(mapping.filter((argument)=>typeof argument.name === 'string' && typeof argument.source === 'string').map((argument)=>[
+                argument.name,
+                scene_engine.resolveArgumentSource(argument.source, scope)
+            ]));
+        globalThis.dispatchEvent(new CustomEvent('cratis.scene.command', {
             detail: {
                 command,
-                element
+                element,
+                arguments: args
             }
         }));
+    };
     return /*#__PURE__*/ jsxRuntime.jsx("button", {
         type: "button",
         "data-scene-id": element.id,

package/dist/cjs/core/ScreenplayCoreComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScreenplayCoreComponents.js","sources":["../../../core/ScreenplayCoreComponents.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 { RegisteredComponentProps } from '../renderer';\n\nfunction textProperty(properties: Record<string, unknown>, name: string, fallback = ''): string {\n    return typeof properties[name] === 'string' ? properties[name] : fallback;\n}\n\n/** Carries a Screenplay data declaration without adding visual chrome. */\nexport function CoreData({ element }: RegisteredComponentProps) {\n    return <span hidden data-scene-id={element.id} data-scene-data={textProperty(element.properties, 'typeName')} />;\n}\n\n/** Renders a modeled command action and emits a host-neutral command event when invoked. */\nexport function CoreAction({ element }: RegisteredComponentProps) {\n    const command = textProperty(element.properties, 'command');\n    const label = textProperty(element.properties, 'label', command);\n    const invoke = () => globalThis.dispatchEvent(new CustomEvent('cratis.scene.command', { detail: { command, element } }));\n    return <button type='button' data-scene-id={element.id} onClick={invoke}>{label}</button>;\n}\n\n/** Groups the nested content of a Screenplay section. */\nexport function CoreSection({ element, slots }: RegisteredComponentProps) {\n    const name = textProperty(element.properties, 'name');\n    return <section data-scene-id={element.id}>{name && <h2>{name}</h2>}{slots.content}</section>;\n}\n\n/** Renders navigation intent and emits a host-neutral navigation event. */\nexport function CoreNavigate({ element }: RegisteredComponentProps) {\n    const targetScreen = textProperty(element.properties, 'targetScreen');\n    const navigate = () => globalThis.dispatchEvent(new CustomEvent('cratis.scene.navigate', { detail: { targetScreen, element } }));\n    return <button type='button' data-scene-id={element.id} onClick={navigate}>{targetScreen}</button>;\n}\n\n/** Renders a Screenplay title directive. */\nexport function CoreTitle({ element }: RegisteredComponentProps) {\n    return <h1 data-scene-id={element.id}>{textProperty(element.properties, 'text')}</h1>;\n}\n\n/** Renders the structural shell of a Screenplay table. Query data is supplied by the host. */\nexport function CoreTable({ element, slots }: RegisteredComponentProps) {\n    return <section data-scene-id={element.id} role='table'><header role='row'>{slots.columns}</header></section>;\n}\n\n/** Renders a Screenplay table-column heading. */\nexport function CoreColumn({ element }: RegisteredComponentProps) {\n    const property = textProperty(element.properties, 'property');\n    return <span data-scene-id={element.id} role='columnheader'>{textProperty(element.properties, 'label', property)}</span>;\n}\n\n/** Renders the structural shell of a Screenplay summary. Query data is supplied by the host. */\nexport function CoreSummary({ element, slots }: RegisteredComponentProps) {\n    return <dl data-scene-id={element.id}>{slots.fields}</dl>;\n}\n\n/** Renders a Screenplay summary field label. */\nexport function CoreField({ element }: RegisteredComponentProps) {\n    const property = textProperty(element.properties, 'property');\n    return <dt data-scene-id={element.id}>{textProperty(element.properties, 'label', property)}</dt>;\n}\n\n/** Renders a Screenplay code block. */\nexport function CoreCode({ element }: RegisteredComponentProps) {\n    const language = textProperty(element.properties, 'language');\n    return <pre data-scene-id={element.id}><code data-language={language}>{textProperty(element.properties, 'code')}</code></pre>;\n}\n\n/** Makes an external screen-file reference visible until a host supplies that file. */\nexport function CoreFile({ element }: RegisteredComponentProps) {\n    return <p data-scene-id={element.id}>Screen source: {textProperty(element.properties, 'path')}</p>;\n}\n"],"names":["textProperty","properties","name","fallback","CoreData","element","_jsx","span","hidden","data-scene-id","id","data-scene-data","CoreAction","command","label","invoke","globalThis","dispatchEvent","CustomEvent","detail","button","type","onClick","CoreSection","slots","_jsxs","section","h2","content","CoreNavigate","targetScreen","navigate","CoreTitle","h1","CoreTable","role","header","columns","CoreColumn","property","CoreSummary","dl","fields","CoreField","dt","CoreCode","language","pre","code","data-language","CoreFile","p"],"mappings":"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"}
+{"version":3,"file":"ScreenplayCoreComponents.js","sources":["../../../core/ScreenplayCoreComponents.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 { resolveArgumentSource } from '@cratis/scene.engine';\nimport { RegisteredComponentProps, useRenderBindingScope } from '../renderer';\n\nfunction textProperty(properties: Record<string, unknown>, name: string, fallback = ''): string {\n    return typeof properties[name] === 'string' ? properties[name] : fallback;\n}\n\n/** Carries a Screenplay data declaration without adding visual chrome. */\nexport function CoreData({ element }: RegisteredComponentProps) {\n    return <span hidden data-scene-id={element.id} data-scene-data={textProperty(element.properties, 'typeName')} />;\n}\n\n/** One entry of a command action's argument mapping. */\ninterface ArgumentMapping {\n    name?: unknown;\n    source?: unknown;\n}\n\n/**\n * Renders a modeled command action and emits a host-neutral command event when invoked.\n *\n * The event carries the resolved `arguments`, by name, read when the action is invoked: a\n * `component.<id>.<output>` source reads what another element publishes - such as what the user typed into\n * an input - and any other source is a data-context path. Hosts that read the mapping from `element`\n * themselves keep working.\n */\nexport function CoreAction({ element }: RegisteredComponentProps) {\n    const command = textProperty(element.properties, 'command');\n    const label = textProperty(element.properties, 'label', command);\n    const scope = useRenderBindingScope();\n    const invoke = () => {\n        const mapping = Array.isArray(element.properties.arguments) ? element.properties.arguments as ArgumentMapping[] : [];\n        const args = Object.fromEntries(mapping\n            .filter((argument): argument is { name: string; source: string } => typeof argument.name === 'string' && typeof argument.source === 'string')\n            .map(argument => [argument.name, resolveArgumentSource(argument.source, scope)]));\n        globalThis.dispatchEvent(new CustomEvent('cratis.scene.command', { detail: { command, element, arguments: args } }));\n    };\n    return <button type='button' data-scene-id={element.id} onClick={invoke}>{label}</button>;\n}\n\n/** Groups the nested content of a Screenplay section. */\nexport function CoreSection({ element, slots }: RegisteredComponentProps) {\n    const name = textProperty(element.properties, 'name');\n    return <section data-scene-id={element.id}>{name && <h2>{name}</h2>}{slots.content}</section>;\n}\n\n/** Renders navigation intent and emits a host-neutral navigation event. */\nexport function CoreNavigate({ element }: RegisteredComponentProps) {\n    const targetScreen = textProperty(element.properties, 'targetScreen');\n    const navigate = () => globalThis.dispatchEvent(new CustomEvent('cratis.scene.navigate', { detail: { targetScreen, element } }));\n    return <button type='button' data-scene-id={element.id} onClick={navigate}>{targetScreen}</button>;\n}\n\n/** Renders a Screenplay title directive. */\nexport function CoreTitle({ element }: RegisteredComponentProps) {\n    return <h1 data-scene-id={element.id}>{textProperty(element.properties, 'text')}</h1>;\n}\n\n/** Renders the structural shell of a Screenplay table. Query data is supplied by the host. */\nexport function CoreTable({ element, slots }: RegisteredComponentProps) {\n    return <section data-scene-id={element.id} role='table'><header role='row'>{slots.columns}</header></section>;\n}\n\n/** Renders a Screenplay table-column heading. */\nexport function CoreColumn({ element }: RegisteredComponentProps) {\n    const property = textProperty(element.properties, 'property');\n    return <span data-scene-id={element.id} role='columnheader'>{textProperty(element.properties, 'label', property)}</span>;\n}\n\n/** Renders the structural shell of a Screenplay summary. Query data is supplied by the host. */\nexport function CoreSummary({ element, slots }: RegisteredComponentProps) {\n    return <dl data-scene-id={element.id}>{slots.fields}</dl>;\n}\n\n/** Renders a Screenplay summary field label. */\nexport function CoreField({ element }: RegisteredComponentProps) {\n    const property = textProperty(element.properties, 'property');\n    return <dt data-scene-id={element.id}>{textProperty(element.properties, 'label', property)}</dt>;\n}\n\n/** Renders a Screenplay code block. */\nexport function CoreCode({ element }: RegisteredComponentProps) {\n    const language = textProperty(element.properties, 'language');\n    return <pre data-scene-id={element.id}><code data-language={language}>{textProperty(element.properties, 'code')}</code></pre>;\n}\n\n/** Makes an external screen-file reference visible until a host supplies that file. */\nexport function CoreFile({ element }: RegisteredComponentProps) {\n    return <p data-scene-id={element.id}>Screen source: {textProperty(element.properties, 'path')}</p>;\n}\n"],"names":["textProperty","properties","name","fallback","CoreData","element","_jsx","span","hidden","data-scene-id","id","data-scene-data","CoreAction","command","label","scope","useRenderBindingScope","invoke","mapping","Array","isArray","arguments","args","Object","fromEntries","filter","argument","source","map","resolveArgumentSource","globalThis","dispatchEvent","CustomEvent","detail","button","type","onClick","CoreSection","slots","_jsxs","section","h2","content","CoreNavigate","targetScreen","navigate","CoreTitle","h1","CoreTable","role","header","columns","CoreColumn","property","CoreSummary","dl","fields","CoreField","dt","CoreCode","language","pre","code","data-language","CoreFile","p"],"mappings":"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"}

package/dist/cjs/index.js

@@ -6,6 +6,8 @@ var BindingOutputContext = require('./renderer/BindingOutputContext.js');
 var RenderBindingScopeContext = require('./renderer/RenderBindingScopeContext.js');
 var UnresolvedComponent = require('./renderer/UnresolvedComponent.js');
 var useBoundQuery = require('./renderer/useBoundQuery.js');
+var useValueOutput = require('./renderer/useValueOutput.js');
+var valueOutputProperty = require('./renderer/valueOutputProperty.js');
 var createReactRenderer = require('./renderer/createReactRenderer.js');
 var InteractiveComponent = require('./renderer/InteractiveComponent.js');
 var CoreText = require('./core/CoreText.js');
@@ -21,6 +23,7 @@ var extractNavigationItem = require('./NavBar/extractNavigationItem.js');
 var SceneNavigationContext = require('./navigation/SceneNavigationContext.js');
 var SceneNavigationHost = require('./navigation/SceneNavigationHost.js');
 var createBrowserSceneHistory = require('./navigation/createBrowserSceneHistory.js');
+var createHashSceneHistory = require('./navigation/createHashSceneHistory.js');
 var createMemorySceneHistory = require('./navigation/createMemorySceneHistory.js');
 var diagnoseRenderedNavigation = require('./navigation/diagnoseRenderedNavigation.js');
 var identityRoute = require('./navigation/identityRoute.js');
@@ -72,6 +75,9 @@ exports.useRenderBindingResolver = RenderBindingScopeContext.useRenderBindingRes
 exports.useRenderBindingScope = RenderBindingScopeContext.useRenderBindingScope;
 exports.UnresolvedComponent = UnresolvedComponent.UnresolvedComponent;
 exports.useBoundQuery = useBoundQuery.useBoundQuery;
+exports.useValueOutput = useValueOutput.useValueOutput;
+exports.valueOutputName = useValueOutput.valueOutputName;
+exports.valueOutputProperty = valueOutputProperty.valueOutputProperty;
 exports.createReactRenderer = createReactRenderer.createReactRenderer;
 exports.InteractiveComponent = InteractiveComponent.InteractiveComponent;
 exports.CoreText = CoreText.CoreText;
@@ -99,6 +105,7 @@ exports.SceneNavigationProvider = SceneNavigationContext.SceneNavigationProvider
 exports.useSceneNavigation = SceneNavigationContext.useSceneNavigation;
 exports.SceneNavigationHost = SceneNavigationHost.SceneNavigationHost;
 exports.createBrowserSceneHistory = createBrowserSceneHistory.createBrowserSceneHistory;
+exports.createHashSceneHistory = createHashSceneHistory.createHashSceneHistory;
 exports.createMemorySceneHistory = createMemorySceneHistory.createMemorySceneHistory;
 exports.diagnoseRenderedNavigation = diagnoseRenderedNavigation.diagnoseRenderedNavigation;
 exports.identityRoute = identityRoute.identityRoute;

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/navigation/createHashSceneHistory.js

@@ -0,0 +1,43 @@
+'use strict';
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+const stateKey = 'sceneNavigation';
+/**
+ * A history kept in the URL fragment - `index.html#/WorkItemDetails?workItemId=B` - for hosts that are served
+ * as a single file or from a path they do not control, such as a generated runtime or a webview. It behaves
+ * like `createBrowserSceneHistory`: entries are pushed with their navigation state, back and forward restore
+ * them, and a typed or bookmarked fragment is matched by URL alone. A fragment changed by hand, which fires
+ * `hashchange` rather than `popstate`, is reported the same way.
+ */ function createHashSceneHistory(browser = window) {
+    const location = ()=>{
+        const fragment = browser.location.hash.replace(/^#\/?/, '');
+        return fragment.length ? fragment : undefined;
+    };
+    const href = (url)=>`${browser.location.pathname}${browser.location.search}#/${url ?? ''}`;
+    const stored = (value)=>value?.[stateKey];
+    return {
+        location,
+        state: ()=>stored(browser.history.state),
+        push: (state)=>browser.history.pushState({
+                [stateKey]: state
+            }, '', href(state.url)),
+        replace: (state)=>browser.history.replaceState({
+                [stateKey]: state
+            }, '', href(state.url)),
+        back: ()=>browser.history.back(),
+        listen: (listener)=>{
+            const onPopState = (event)=>listener(location(), stored(event.state));
+            const onHashChange = ()=>listener(location(), stored(browser.history.state));
+            browser.addEventListener('popstate', onPopState);
+            browser.addEventListener('hashchange', onHashChange);
+            return ()=>{
+                browser.removeEventListener('popstate', onPopState);
+                browser.removeEventListener('hashchange', onHashChange);
+            };
+        }
+    };
+}
+
+exports.createHashSceneHistory = createHashSceneHistory;
+//# sourceMappingURL=createHashSceneHistory.js.map

package/dist/cjs/navigation/createHashSceneHistory.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createHashSceneHistory.js","sources":["../../../navigation/createHashSceneHistory.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 { SceneBrowserWindow } from './createBrowserSceneHistory';\nimport { SceneHistory } from './SceneHistory';\nimport { SceneNavigationState } from './SceneNavigationState';\n\nconst stateKey = 'sceneNavigation';\n\n/**\n * A history kept in the URL fragment - `index.html#/WorkItemDetails?workItemId=B` - for hosts that are served\n * as a single file or from a path they do not control, such as a generated runtime or a webview. It behaves\n * like `createBrowserSceneHistory`: entries are pushed with their navigation state, back and forward restore\n * them, and a typed or bookmarked fragment is matched by URL alone. A fragment changed by hand, which fires\n * `hashchange` rather than `popstate`, is reported the same way.\n */\nexport function createHashSceneHistory(browser: SceneBrowserWindow = window): SceneHistory {\n    const location = () => {\n        const fragment = browser.location.hash.replace(/^#\\/?/, '');\n        return fragment.length ? fragment : undefined;\n    };\n    const href = (url: string | undefined) => `${browser.location.pathname}${browser.location.search}#/${url ?? ''}`;\n    const stored = (value: unknown) => (value as Record<string, SceneNavigationState> | null)?.[stateKey];\n\n    return {\n        location,\n        state: () => stored(browser.history.state),\n        push: state => browser.history.pushState({ [stateKey]: state }, '', href(state.url)),\n        replace: state => browser.history.replaceState({ [stateKey]: state }, '', href(state.url)),\n        back: () => browser.history.back(),\n        listen: listener => {\n            const onPopState = (event: PopStateEvent) => listener(location(), stored(event.state));\n            const onHashChange = () => listener(location(), stored(browser.history.state));\n            browser.addEventListener('popstate', onPopState);\n            browser.addEventListener('hashchange', onHashChange);\n            return () => {\n                browser.removeEventListener('popstate', onPopState);\n                browser.removeEventListener('hashchange', onHashChange);\n            };\n        },\n    };\n}\n"],"names":["stateKey","createHashSceneHistory","browser","window","location","fragment","hash","replace","length","undefined","href","url","pathname","search","stored","value","state","history","push","pushState","replaceState","back","listen","listener","onPopState","event","onHashChange","addEventListener","removeEventListener"],"mappings":";;AAAA;AACA;AAMA,MAAMA,QAAAA,GAAW,iBAAA;AAEjB;;;;;;AAMC,IACM,SAASC,sBAAAA,CAAuBC,OAAAA,GAA8BC,MAAM,EAAA;AACvE,IAAA,MAAMC,QAAAA,GAAW,IAAA;QACb,MAAMC,QAAAA,GAAWH,QAAQE,QAAQ,CAACE,IAAI,CAACC,OAAO,CAAC,OAAA,EAAS,EAAA,CAAA;QACxD,OAAOF,QAAAA,CAASG,MAAM,GAAGH,QAAAA,GAAWI,SAAAA;AACxC,IAAA,CAAA;AACA,IAAA,MAAMC,OAAO,CAACC,GAAAA,GAA4B,CAAA,EAAGT,OAAAA,CAAQE,QAAQ,CAACQ,QAAQ,CAAA,EAAGV,OAAAA,CAAQE,QAAQ,CAACS,MAAM,CAAC,EAAE,EAAEF,OAAO,EAAA,CAAA,CAAI;AAChH,IAAA,MAAMG,MAAAA,GAAS,CAACC,KAAAA,GAAoBA,KAAAA,GAAwDf,QAAAA,CAAS;IAErG,OAAO;AACHI,QAAAA,QAAAA;AACAY,QAAAA,KAAAA,EAAO,IAAMF,MAAAA,CAAOZ,OAAAA,CAAQe,OAAO,CAACD,KAAK,CAAA;AACzCE,QAAAA,IAAAA,EAAMF,CAAAA,KAAAA,GAASd,OAAAA,CAAQe,OAAO,CAACE,SAAS,CAAC;AAAE,gBAAA,CAACnB,WAAWgB;aAAM,EAAG,EAAA,EAAIN,IAAAA,CAAKM,KAAAA,CAAML,GAAG,CAAA,CAAA;AAClFJ,QAAAA,OAAAA,EAASS,CAAAA,KAAAA,GAASd,OAAAA,CAAQe,OAAO,CAACG,YAAY,CAAC;AAAE,gBAAA,CAACpB,WAAWgB;aAAM,EAAG,EAAA,EAAIN,IAAAA,CAAKM,KAAAA,CAAML,GAAG,CAAA,CAAA;AACxFU,QAAAA,IAAAA,EAAM,IAAMnB,OAAAA,CAAQe,OAAO,CAACI,IAAI,EAAA;AAChCC,QAAAA,MAAAA,EAAQC,CAAAA,QAAAA,GAAAA;AACJ,YAAA,MAAMC,aAAa,CAACC,KAAAA,GAAyBF,SAASnB,QAAAA,EAAAA,EAAYU,MAAAA,CAAOW,MAAMT,KAAK,CAAA,CAAA;YACpF,MAAMU,YAAAA,GAAe,IAAMH,QAAAA,CAASnB,QAAAA,EAAAA,EAAYU,OAAOZ,OAAAA,CAAQe,OAAO,CAACD,KAAK,CAAA,CAAA;YAC5Ed,OAAAA,CAAQyB,gBAAgB,CAAC,UAAA,EAAYH,UAAAA,CAAAA;YACrCtB,OAAAA,CAAQyB,gBAAgB,CAAC,YAAA,EAAcD,YAAAA,CAAAA;YACvC,OAAO,IAAA;gBACHxB,OAAAA,CAAQ0B,mBAAmB,CAAC,UAAA,EAAYJ,UAAAA,CAAAA;gBACxCtB,OAAAA,CAAQ0B,mBAAmB,CAAC,YAAA,EAAcF,YAAAA,CAAAA;AAC9C,YAAA,CAAA;AACJ,QAAA;AACJ,KAAA;AACJ;;"}

package/dist/cjs/renderer/useValueOutput.js

@@ -0,0 +1,31 @@
+'use strict';
+
+var react = require('react');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/** The output property an input widget publishes its current value under. */ const valueOutputName = 'value';
+/**
+ * Publishes an input widget's current value as its `value` output: once when it mounts, with the initial
+ * value, and again on every change. Other elements bind to it with a `componentProperty` binding, and a
+ * command action maps it as `component.<id>.value`. The renderer clears the output when the widget unmounts.
+ *
+ * Values are published as JSON-compatible data so both engines read the same thing: a `Date` is published
+ * as its ISO 8601 string, and `undefined` as `null`.
+ */ function useValueOutput(bindingOutputs, value) {
+    const published = value instanceof Date ? value.toISOString() : value ?? null;
+    const key = JSON.stringify(published);
+    const latest = react.useRef(published);
+    latest.current = published;
+    // Published by value through `key`: a new array or object with the same content is not a change.
+    react.useEffect(()=>{
+        bindingOutputs?.setOutput(valueOutputName, latest.current);
+    }, [
+        bindingOutputs,
+        key
+    ]);
+}
+
+exports.useValueOutput = useValueOutput;
+exports.valueOutputName = valueOutputName;
+//# sourceMappingURL=useValueOutput.js.map

package/dist/cjs/renderer/useValueOutput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useValueOutput.js","sources":["../../../renderer/useValueOutput.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 { useEffect, useRef } from 'react';\nimport { ComponentBindingOutputs } from './BindingOutputContext';\n\n/** The output property an input widget publishes its current value under. */\nexport const valueOutputName = 'value';\n\n/**\n * Publishes an input widget's current value as its `value` output: once when it mounts, with the initial\n * value, and again on every change. Other elements bind to it with a `componentProperty` binding, and a\n * command action maps it as `component.<id>.value`. The renderer clears the output when the widget unmounts.\n *\n * Values are published as JSON-compatible data so both engines read the same thing: a `Date` is published\n * as its ISO 8601 string, and `undefined` as `null`.\n */\nexport function useValueOutput(bindingOutputs: ComponentBindingOutputs | undefined, value: unknown): void {\n    const published = value instanceof Date ? value.toISOString() : value ?? null;\n    const key = JSON.stringify(published);\n    const latest = useRef(published);\n    latest.current = published;\n\n    // Published by value through `key`: a new array or object with the same content is not a change.\n    useEffect(() => {\n        bindingOutputs?.setOutput(valueOutputName, latest.current);\n    }, [bindingOutputs, key]);\n}\n"],"names":["valueOutputName","useValueOutput","bindingOutputs","value","published","Date","toISOString","key","JSON","stringify","latest","useRef","current","useEffect","setOutput"],"mappings":";;;;AAAA;AACA;AAKA,8EACO,MAAMA,eAAAA,GAAkB;AAE/B;;;;;;;AAOC,IACM,SAASC,cAAAA,CAAeC,cAAmD,EAAEC,KAAc,EAAA;AAC9F,IAAA,MAAMC,YAAYD,KAAAA,YAAiBE,IAAAA,GAAOF,KAAAA,CAAMG,WAAW,KAAKH,KAAAA,IAAS,IAAA;IACzE,MAAMI,GAAAA,GAAMC,IAAAA,CAAKC,SAAS,CAACL,SAAAA,CAAAA;AAC3B,IAAA,MAAMM,SAASC,YAAAA,CAAOP,SAAAA,CAAAA;AACtBM,IAAAA,MAAAA,CAAOE,OAAO,GAAGR,SAAAA;;IAGjBS,eAAAA,CAAU,IAAA;QACNX,cAAAA,EAAgBY,SAAAA,CAAUd,eAAAA,EAAiBU,MAAAA,CAAOE,OAAO,CAAA;IAC7D,CAAA,EAAG;AAACV,QAAAA,cAAAA;AAAgBK,QAAAA;AAAI,KAAA,CAAA;AAC5B;;;"}

package/dist/cjs/renderer/valueOutputProperty.js

@@ -0,0 +1,28 @@
+'use strict';
+
+var scene_model = require('@cratis/scene.model');
+var useValueOutput = require('./useValueOutput.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * The descriptor entry an input widget declares for the value it publishes with `useValueOutput`, so a
+ * designer can offer it as a binding source - for a detail component, a query argument or a command input.
+ *
+ * @param valueType The type of value the widget publishes.
+ * @param description What the value is, when the default sentence does not say enough.
+ */ function valueOutputProperty(valueType, description = 'What the user has entered, published as the input changes.') {
+    return {
+        path: useValueOutput.valueOutputName,
+        label: 'Value',
+        group: 'Outputs',
+        valueType,
+        readOnly: true,
+        output: true,
+        bindingMode: scene_model.BindingMode.OneWay,
+        description
+    };
+}
+
+exports.valueOutputProperty = valueOutputProperty;
+//# sourceMappingURL=valueOutputProperty.js.map

package/dist/cjs/renderer/valueOutputProperty.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"valueOutputProperty.js","sources":["../../../renderer/valueOutputProperty.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 { BindingMode, PropertyDescriptor, PropertyValueType } from '@cratis/scene.model';\nimport { valueOutputName } from './useValueOutput';\n\n/**\n * The descriptor entry an input widget declares for the value it publishes with `useValueOutput`, so a\n * designer can offer it as a binding source - for a detail component, a query argument or a command input.\n *\n * @param valueType The type of value the widget publishes.\n * @param description What the value is, when the default sentence does not say enough.\n */\nexport function valueOutputProperty(valueType: PropertyValueType, description = 'What the user has entered, published as the input changes.'): PropertyDescriptor {\n    return {\n        path: valueOutputName,\n        label: 'Value',\n        group: 'Outputs',\n        valueType,\n        readOnly: true,\n        output: true,\n        bindingMode: BindingMode.OneWay,\n        description,\n    };\n}\n"],"names":["valueOutputProperty","valueType","description","path","valueOutputName","label","group","readOnly","output","bindingMode","BindingMode","OneWay"],"mappings":";;;;;AAAA;AACA;AAKA;;;;;;AAMC,IACM,SAASA,mBAAAA,CAAoBC,SAA4B,EAAEC,cAAc,4DAA4D,EAAA;IACxI,OAAO;QACHC,IAAAA,EAAMC,8BAAAA;QACNC,KAAAA,EAAO,OAAA;QACPC,KAAAA,EAAO,SAAA;AACPL,QAAAA,SAAAA;QACAM,QAAAA,EAAU,IAAA;QACVC,MAAAA,EAAQ,IAAA;AACRC,QAAAA,WAAAA,EAAaC,wBAAYC,MAAM;AAC/BT,QAAAA;AACJ,KAAA;AACJ;;"}

package/dist/esm/SceneElementView.js

@@ -2,6 +2,7 @@ import { jsx, Fragment } from 'react/jsx-runtime';
 import { useMemo } from 'react';
 import { applyEffectiveConfiguration, renderElement } from '@cratis/scene.engine';
 import { RenderBindingScopeProvider, useRenderBindingResolver } from './renderer/RenderBindingScopeContext.js';
+import '@cratis/scene.model';
 import { createReactRenderer } from './renderer/createReactRenderer.js';
 import './interactions/useInteractions.js';
 import './interactions/NotificationHost.js';

package/dist/esm/SceneElementView.js.map

@@ -1 +1 @@
-{"version":3,"file":"SceneElementView.js","sources":["../../SceneElementView.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 { useMemo } from 'react';\nimport { applyEffectiveConfiguration, renderElement, BindingResolver } from '@cratis/scene.engine';\nimport { EffectiveConfiguration, SceneElement } from '@cratis/scene.model';\nimport { ComponentRegistry, RenderBindingScopeProvider, createReactRenderer, useRenderBindingResolver } from './renderer';\n\nexport interface SceneElementViewProps {\n    element: SceneElement;\n    registry: ComponentRegistry;\n    resolveBinding?: BindingResolver;\n    dataContext?: unknown;\n    queryResults?: Record<string, unknown>;\n    componentOutputs?: Record<string, Record<string, unknown>>;\n\n    /**\n     * The resolved configuration of the template chain the element sits in, from `resolveEffectiveConfiguration`.\n     * When given, each configurable component renders with its resolved properties - what a screen's own values add\n     * to an inherited template. It is the same data the editor shows, and the same code path whether the screen is\n     * being edited or played: there is no design-time mode.\n     */\n    configuration?: EffectiveConfiguration;\n\n    /** Called when rendered components publish or clear output properties for typed bindings. */\n    onComponentOutputsChanged?: (outputs: Record<string, Record<string, unknown>>) => void;\n}\n\n/**\n * Renders a Scene element tree with the real `Scene.React` renderer - the WYSIWYG building block Studio's\n * preview surface and Stage's shipped web bundle both consume unmodified.\n */\nexport function SceneElementView({\n    element,\n    registry,\n    resolveBinding,\n    configuration,\n    onComponentOutputsChanged,\n    dataContext,\n    queryResults,\n    componentOutputs,\n}: SceneElementViewProps) {\n    const configured = useMemo(() => configuration ? applyEffectiveConfiguration(element, configuration) : element, [element, configuration]);\n    return (\n        <RenderBindingScopeProvider\n            dataContext={dataContext}\n            queryResults={queryResults}\n            componentOutputs={componentOutputs}\n            resolveBinding={resolveBinding}\n            onComponentOutputsChanged={onComponentOutputsChanged}>\n            <RenderedElement element={configured} registry={registry} />\n        </RenderBindingScopeProvider>\n    );\n}\n\nfunction RenderedElement({ element, registry }: { element: SceneElement; registry: ComponentRegistry }) {\n    const renderer = useMemo(() => createReactRenderer(registry), [registry]);\n    const resolveBinding = useRenderBindingResolver();\n    return <>{renderElement(element, renderer, resolveBinding)}</>;\n}\n"],"names":["SceneElementView","element","registry","resolveBinding","configuration","onComponentOutputsChanged","dataContext","queryResults","componentOutputs","configured","useMemo","applyEffectiveConfiguration","_jsx","RenderBindingScopeProvider","RenderedElement","renderer","createReactRenderer","useRenderBindingResolver","_Fragment","renderElement"],"mappings":";;;;;;;;AA4BA;;;AAGC,IACM,SAASA,gBAAAA,CAAiB,EAC7BC,OAAO,EACPC,QAAQ,EACRC,cAAc,EACdC,aAAa,EACbC,yBAAyB,EACzBC,WAAW,EACXC,YAAY,EACZC,gBAAgB,EACI,EAAA;AACpB,IAAA,MAAMC,aAAaC,OAAAA,CAAQ,IAAMN,gBAAgBO,2BAAAA,CAA4BV,OAAAA,EAASG,iBAAiBH,OAAAA,EAAS;AAACA,QAAAA,OAAAA;AAASG,QAAAA;AAAc,KAAA,CAAA;AACxI,IAAA,qBACIQ,GAAA,CAACC,0BAAAA,EAAAA;QACGP,WAAAA,EAAaA,WAAAA;QACbC,YAAAA,EAAcA,YAAAA;QACdC,gBAAAA,EAAkBA,gBAAAA;QAClBL,cAAAA,EAAgBA,cAAAA;QAChBE,yBAAAA,EAA2BA,yBAAAA;AAC3B,QAAA,QAAA,gBAAAO,GAAA,CAACE,eAAAA,EAAAA;YAAgBb,OAAAA,EAASQ,UAAAA;YAAYP,QAAAA,EAAUA;;;AAG5D;AAEA,SAASY,eAAAA,CAAgB,EAAEb,OAAO,EAAEC,QAAQ,EAA0D,EAAA;AAClG,IAAA,MAAMa,QAAAA,GAAWL,OAAAA,CAAQ,IAAMM,mBAAAA,CAAoBd,QAAAA,CAAAA,EAAW;AAACA,QAAAA;AAAS,KAAA,CAAA;AACxE,IAAA,MAAMC,cAAAA,GAAiBc,wBAAAA,EAAAA;IACvB,qBAAOL,GAAA,CAAAM,QAAA,EAAA;AAAGC,QAAAA,QAAAA,EAAAA,aAAAA,CAAclB,SAASc,QAAAA,EAAUZ,cAAAA;;AAC/C;;"}
+{"version":3,"file":"SceneElementView.js","sources":["../../SceneElementView.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 { useMemo } from 'react';\nimport { applyEffectiveConfiguration, renderElement, BindingResolver } from '@cratis/scene.engine';\nimport { EffectiveConfiguration, SceneElement } from '@cratis/scene.model';\nimport { ComponentRegistry, RenderBindingScopeProvider, createReactRenderer, useRenderBindingResolver } from './renderer';\n\nexport interface SceneElementViewProps {\n    element: SceneElement;\n    registry: ComponentRegistry;\n    resolveBinding?: BindingResolver;\n    dataContext?: unknown;\n    queryResults?: Record<string, unknown>;\n    componentOutputs?: Record<string, Record<string, unknown>>;\n\n    /**\n     * The resolved configuration of the template chain the element sits in, from `resolveEffectiveConfiguration`.\n     * When given, each configurable component renders with its resolved properties - what a screen's own values add\n     * to an inherited template. It is the same data the editor shows, and the same code path whether the screen is\n     * being edited or played: there is no design-time mode.\n     */\n    configuration?: EffectiveConfiguration;\n\n    /** Called when rendered components publish or clear output properties for typed bindings. */\n    onComponentOutputsChanged?: (outputs: Record<string, Record<string, unknown>>) => void;\n}\n\n/**\n * Renders a Scene element tree with the real `Scene.React` renderer - the WYSIWYG building block Studio's\n * preview surface and Stage's shipped web bundle both consume unmodified.\n */\nexport function SceneElementView({\n    element,\n    registry,\n    resolveBinding,\n    configuration,\n    onComponentOutputsChanged,\n    dataContext,\n    queryResults,\n    componentOutputs,\n}: SceneElementViewProps) {\n    const configured = useMemo(() => configuration ? applyEffectiveConfiguration(element, configuration) : element, [element, configuration]);\n    return (\n        <RenderBindingScopeProvider\n            dataContext={dataContext}\n            queryResults={queryResults}\n            componentOutputs={componentOutputs}\n            resolveBinding={resolveBinding}\n            onComponentOutputsChanged={onComponentOutputsChanged}>\n            <RenderedElement element={configured} registry={registry} />\n        </RenderBindingScopeProvider>\n    );\n}\n\nfunction RenderedElement({ element, registry }: { element: SceneElement; registry: ComponentRegistry }) {\n    const renderer = useMemo(() => createReactRenderer(registry), [registry]);\n    const resolveBinding = useRenderBindingResolver();\n    return <>{renderElement(element, renderer, resolveBinding)}</>;\n}\n"],"names":["SceneElementView","element","registry","resolveBinding","configuration","onComponentOutputsChanged","dataContext","queryResults","componentOutputs","configured","useMemo","applyEffectiveConfiguration","_jsx","RenderBindingScopeProvider","RenderedElement","renderer","createReactRenderer","useRenderBindingResolver","_Fragment","renderElement"],"mappings":";;;;;;;;;AA4BA;;;AAGC,IACM,SAASA,gBAAAA,CAAiB,EAC7BC,OAAO,EACPC,QAAQ,EACRC,cAAc,EACdC,aAAa,EACbC,yBAAyB,EACzBC,WAAW,EACXC,YAAY,EACZC,gBAAgB,EACI,EAAA;AACpB,IAAA,MAAMC,aAAaC,OAAAA,CAAQ,IAAMN,gBAAgBO,2BAAAA,CAA4BV,OAAAA,EAASG,iBAAiBH,OAAAA,EAAS;AAACA,QAAAA,OAAAA;AAASG,QAAAA;AAAc,KAAA,CAAA;AACxI,IAAA,qBACIQ,GAAA,CAACC,0BAAAA,EAAAA;QACGP,WAAAA,EAAaA,WAAAA;QACbC,YAAAA,EAAcA,YAAAA;QACdC,gBAAAA,EAAkBA,gBAAAA;QAClBL,cAAAA,EAAgBA,cAAAA;QAChBE,yBAAAA,EAA2BA,yBAAAA;AAC3B,QAAA,QAAA,gBAAAO,GAAA,CAACE,eAAAA,EAAAA;YAAgBb,OAAAA,EAASQ,UAAAA;YAAYP,QAAAA,EAAUA;;;AAG5D;AAEA,SAASY,eAAAA,CAAgB,EAAEb,OAAO,EAAEC,QAAQ,EAA0D,EAAA;AAClG,IAAA,MAAMa,QAAAA,GAAWL,OAAAA,CAAQ,IAAMM,mBAAAA,CAAoBd,QAAAA,CAAAA,EAAW;AAACA,QAAAA;AAAS,KAAA,CAAA;AACxE,IAAA,MAAMC,cAAAA,GAAiBc,wBAAAA,EAAAA;IACvB,qBAAOL,GAAA,CAAAM,QAAA,EAAA;AAAGC,QAAAA,QAAAA,EAAAA,aAAAA,CAAclB,SAASc,QAAAA,EAAUZ,cAAAA;;AAC/C;;"}

package/dist/esm/core/ScreenplayCoreComponents.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScreenplayCoreComponents.d.ts","sourceRoot":"","sources":["../../../core/ScreenplayCoreComponents.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,wBAAwB,EAAE,MAAM,aAAa,CAAC;AAOvD,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAE7D;AAGD,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAK/D;AAGD,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAGvE;AAGD,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAIjE;AAGD,wBAAgB,SAAS,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAE9D;AAGD,wBAAgB,SAAS,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAErE;AAGD,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAG/D;AAGD,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAEvE;AAGD,wBAAgB,SAAS,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAG9D;AAGD,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAG7D;AAGD,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAE7D"}
+{"version":3,"file":"ScreenplayCoreComponents.d.ts","sourceRoot":"","sources":["../../../core/ScreenplayCoreComponents.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAyB,MAAM,aAAa,CAAC;AAO9E,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAE7D;AAgBD,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAY/D;AAGD,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAGvE;AAGD,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAIjE;AAGD,wBAAgB,SAAS,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAE9D;AAGD,wBAAgB,SAAS,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAErE;AAGD,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAG/D;AAGD,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAEvE;AAGD,wBAAgB,SAAS,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAG9D;AAGD,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAG7D;AAGD,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAE7D"}

package/dist/esm/core/ScreenplayCoreComponents.js

@@ -1,7 +1,11 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
+import { resolveArgumentSource } from '@cratis/scene.engine';
+import 'react';
+import { useRenderBindingScope } from '../renderer/RenderBindingScopeContext.js';
+import '@cratis/scene.model';
+import '../interactions/useInteractions.js';
+import '../interactions/NotificationHost.js';
 
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
 function textProperty(properties, name, fallback = '') {
     return typeof properties[name] === 'string' ? properties[name] : fallback;
 }
@@ -12,15 +16,31 @@ function textProperty(properties, name, fallback = '') {
         "data-scene-data": textProperty(element.properties, 'typeName')
     });
 }
-/** Renders a modeled command action and emits a host-neutral command event when invoked. */ function CoreAction({ element }) {
+/**
+ * Renders a modeled command action and emits a host-neutral command event when invoked.
+ *
+ * The event carries the resolved `arguments`, by name, read when the action is invoked: a
+ * `component.<id>.<output>` source reads what another element publishes - such as what the user typed into
+ * an input - and any other source is a data-context path. Hosts that read the mapping from `element`
+ * themselves keep working.
+ */ function CoreAction({ element }) {
     const command = textProperty(element.properties, 'command');
     const label = textProperty(element.properties, 'label', command);
-    const invoke = ()=>globalThis.dispatchEvent(new CustomEvent('cratis.scene.command', {
+    const scope = useRenderBindingScope();
+    const invoke = ()=>{
+        const mapping = Array.isArray(element.properties.arguments) ? element.properties.arguments : [];
+        const args = Object.fromEntries(mapping.filter((argument)=>typeof argument.name === 'string' && typeof argument.source === 'string').map((argument)=>[
+                argument.name,
+                resolveArgumentSource(argument.source, scope)
+            ]));
+        globalThis.dispatchEvent(new CustomEvent('cratis.scene.command', {
             detail: {
                 command,
-                element
+                element,
+                arguments: args
             }
         }));
+    };
     return /*#__PURE__*/ jsx("button", {
         type: "button",
         "data-scene-id": element.id,

package/dist/esm/core/ScreenplayCoreComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScreenplayCoreComponents.js","sources":["../../../core/ScreenplayCoreComponents.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 { RegisteredComponentProps } from '../renderer';\n\nfunction textProperty(properties: Record<string, unknown>, name: string, fallback = ''): string {\n    return typeof properties[name] === 'string' ? properties[name] : fallback;\n}\n\n/** Carries a Screenplay data declaration without adding visual chrome. */\nexport function CoreData({ element }: RegisteredComponentProps) {\n    return <span hidden data-scene-id={element.id} data-scene-data={textProperty(element.properties, 'typeName')} />;\n}\n\n/** Renders a modeled command action and emits a host-neutral command event when invoked. */\nexport function CoreAction({ element }: RegisteredComponentProps) {\n    const command = textProperty(element.properties, 'command');\n    const label = textProperty(element.properties, 'label', command);\n    const invoke = () => globalThis.dispatchEvent(new CustomEvent('cratis.scene.command', { detail: { command, element } }));\n    return <button type='button' data-scene-id={element.id} onClick={invoke}>{label}</button>;\n}\n\n/** Groups the nested content of a Screenplay section. */\nexport function CoreSection({ element, slots }: RegisteredComponentProps) {\n    const name = textProperty(element.properties, 'name');\n    return <section data-scene-id={element.id}>{name && <h2>{name}</h2>}{slots.content}</section>;\n}\n\n/** Renders navigation intent and emits a host-neutral navigation event. */\nexport function CoreNavigate({ element }: RegisteredComponentProps) {\n    const targetScreen = textProperty(element.properties, 'targetScreen');\n    const navigate = () => globalThis.dispatchEvent(new CustomEvent('cratis.scene.navigate', { detail: { targetScreen, element } }));\n    return <button type='button' data-scene-id={element.id} onClick={navigate}>{targetScreen}</button>;\n}\n\n/** Renders a Screenplay title directive. */\nexport function CoreTitle({ element }: RegisteredComponentProps) {\n    return <h1 data-scene-id={element.id}>{textProperty(element.properties, 'text')}</h1>;\n}\n\n/** Renders the structural shell of a Screenplay table. Query data is supplied by the host. */\nexport function CoreTable({ element, slots }: RegisteredComponentProps) {\n    return <section data-scene-id={element.id} role='table'><header role='row'>{slots.columns}</header></section>;\n}\n\n/** Renders a Screenplay table-column heading. */\nexport function CoreColumn({ element }: RegisteredComponentProps) {\n    const property = textProperty(element.properties, 'property');\n    return <span data-scene-id={element.id} role='columnheader'>{textProperty(element.properties, 'label', property)}</span>;\n}\n\n/** Renders the structural shell of a Screenplay summary. Query data is supplied by the host. */\nexport function CoreSummary({ element, slots }: RegisteredComponentProps) {\n    return <dl data-scene-id={element.id}>{slots.fields}</dl>;\n}\n\n/** Renders a Screenplay summary field label. */\nexport function CoreField({ element }: RegisteredComponentProps) {\n    const property = textProperty(element.properties, 'property');\n    return <dt data-scene-id={element.id}>{textProperty(element.properties, 'label', property)}</dt>;\n}\n\n/** Renders a Screenplay code block. */\nexport function CoreCode({ element }: RegisteredComponentProps) {\n    const language = textProperty(element.properties, 'language');\n    return <pre data-scene-id={element.id}><code data-language={language}>{textProperty(element.properties, 'code')}</code></pre>;\n}\n\n/** Makes an external screen-file reference visible until a host supplies that file. */\nexport function CoreFile({ element }: RegisteredComponentProps) {\n    return <p data-scene-id={element.id}>Screen source: {textProperty(element.properties, 'path')}</p>;\n}\n"],"names":["textProperty","properties","name","fallback","CoreData","element","_jsx","span","hidden","data-scene-id","id","data-scene-data","CoreAction","command","label","invoke","globalThis","dispatchEvent","CustomEvent","detail","button","type","onClick","CoreSection","slots","_jsxs","section","h2","content","CoreNavigate","targetScreen","navigate","CoreTitle","h1","CoreTable","role","header","columns","CoreColumn","property","CoreSummary","dl","fields","CoreField","dt","CoreCode","language","pre","code","data-language","CoreFile","p"],"mappings":"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"}
+{"version":3,"file":"ScreenplayCoreComponents.js","sources":["../../../core/ScreenplayCoreComponents.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 { resolveArgumentSource } from '@cratis/scene.engine';\nimport { RegisteredComponentProps, useRenderBindingScope } from '../renderer';\n\nfunction textProperty(properties: Record<string, unknown>, name: string, fallback = ''): string {\n    return typeof properties[name] === 'string' ? properties[name] : fallback;\n}\n\n/** Carries a Screenplay data declaration without adding visual chrome. */\nexport function CoreData({ element }: RegisteredComponentProps) {\n    return <span hidden data-scene-id={element.id} data-scene-data={textProperty(element.properties, 'typeName')} />;\n}\n\n/** One entry of a command action's argument mapping. */\ninterface ArgumentMapping {\n    name?: unknown;\n    source?: unknown;\n}\n\n/**\n * Renders a modeled command action and emits a host-neutral command event when invoked.\n *\n * The event carries the resolved `arguments`, by name, read when the action is invoked: a\n * `component.<id>.<output>` source reads what another element publishes - such as what the user typed into\n * an input - and any other source is a data-context path. Hosts that read the mapping from `element`\n * themselves keep working.\n */\nexport function CoreAction({ element }: RegisteredComponentProps) {\n    const command = textProperty(element.properties, 'command');\n    const label = textProperty(element.properties, 'label', command);\n    const scope = useRenderBindingScope();\n    const invoke = () => {\n        const mapping = Array.isArray(element.properties.arguments) ? element.properties.arguments as ArgumentMapping[] : [];\n        const args = Object.fromEntries(mapping\n            .filter((argument): argument is { name: string; source: string } => typeof argument.name === 'string' && typeof argument.source === 'string')\n            .map(argument => [argument.name, resolveArgumentSource(argument.source, scope)]));\n        globalThis.dispatchEvent(new CustomEvent('cratis.scene.command', { detail: { command, element, arguments: args } }));\n    };\n    return <button type='button' data-scene-id={element.id} onClick={invoke}>{label}</button>;\n}\n\n/** Groups the nested content of a Screenplay section. */\nexport function CoreSection({ element, slots }: RegisteredComponentProps) {\n    const name = textProperty(element.properties, 'name');\n    return <section data-scene-id={element.id}>{name && <h2>{name}</h2>}{slots.content}</section>;\n}\n\n/** Renders navigation intent and emits a host-neutral navigation event. */\nexport function CoreNavigate({ element }: RegisteredComponentProps) {\n    const targetScreen = textProperty(element.properties, 'targetScreen');\n    const navigate = () => globalThis.dispatchEvent(new CustomEvent('cratis.scene.navigate', { detail: { targetScreen, element } }));\n    return <button type='button' data-scene-id={element.id} onClick={navigate}>{targetScreen}</button>;\n}\n\n/** Renders a Screenplay title directive. */\nexport function CoreTitle({ element }: RegisteredComponentProps) {\n    return <h1 data-scene-id={element.id}>{textProperty(element.properties, 'text')}</h1>;\n}\n\n/** Renders the structural shell of a Screenplay table. Query data is supplied by the host. */\nexport function CoreTable({ element, slots }: RegisteredComponentProps) {\n    return <section data-scene-id={element.id} role='table'><header role='row'>{slots.columns}</header></section>;\n}\n\n/** Renders a Screenplay table-column heading. */\nexport function CoreColumn({ element }: RegisteredComponentProps) {\n    const property = textProperty(element.properties, 'property');\n    return <span data-scene-id={element.id} role='columnheader'>{textProperty(element.properties, 'label', property)}</span>;\n}\n\n/** Renders the structural shell of a Screenplay summary. Query data is supplied by the host. */\nexport function CoreSummary({ element, slots }: RegisteredComponentProps) {\n    return <dl data-scene-id={element.id}>{slots.fields}</dl>;\n}\n\n/** Renders a Screenplay summary field label. */\nexport function CoreField({ element }: RegisteredComponentProps) {\n    const property = textProperty(element.properties, 'property');\n    return <dt data-scene-id={element.id}>{textProperty(element.properties, 'label', property)}</dt>;\n}\n\n/** Renders a Screenplay code block. */\nexport function CoreCode({ element }: RegisteredComponentProps) {\n    const language = textProperty(element.properties, 'language');\n    return <pre data-scene-id={element.id}><code data-language={language}>{textProperty(element.properties, 'code')}</code></pre>;\n}\n\n/** Makes an external screen-file reference visible until a host supplies that file. */\nexport function CoreFile({ element }: RegisteredComponentProps) {\n    return <p data-scene-id={element.id}>Screen source: {textProperty(element.properties, 'path')}</p>;\n}\n"],"names":["textProperty","properties","name","fallback","CoreData","element","_jsx","span","hidden","data-scene-id","id","data-scene-data","CoreAction","command","label","scope","useRenderBindingScope","invoke","mapping","Array","isArray","arguments","args","Object","fromEntries","filter","argument","source","map","resolveArgumentSource","globalThis","dispatchEvent","CustomEvent","detail","button","type","onClick","CoreSection","slots","_jsxs","section","h2","content","CoreNavigate","targetScreen","navigate","CoreTitle","h1","CoreTable","role","header","columns","CoreColumn","property","CoreSummary","dl","fields","CoreField","dt","CoreCode","language","pre","code","data-language","CoreFile","p"],"mappings":"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"}

package/dist/esm/index.js

@@ -4,6 +4,8 @@ export { BindingOutputProvider, useBindingOutputScope, useBindingOutputs } from
 export { RenderBindingScopeProvider, useRenderBindingResolver, useRenderBindingScope } from './renderer/RenderBindingScopeContext.js';
 export { UnresolvedComponent } from './renderer/UnresolvedComponent.js';
 export { useBoundQuery } from './renderer/useBoundQuery.js';
+export { useValueOutput, valueOutputName } from './renderer/useValueOutput.js';
+export { valueOutputProperty } from './renderer/valueOutputProperty.js';
 export { createReactRenderer } from './renderer/createReactRenderer.js';
 export { InteractiveComponent } from './renderer/InteractiveComponent.js';
 export { CoreText } from './core/CoreText.js';
@@ -19,6 +21,7 @@ export { extractNavigationItem } from './NavBar/extractNavigationItem.js';
 export { SceneNavigationProvider, useSceneNavigation } from './navigation/SceneNavigationContext.js';
 export { SceneNavigationHost } from './navigation/SceneNavigationHost.js';
 export { createBrowserSceneHistory } from './navigation/createBrowserSceneHistory.js';
+export { createHashSceneHistory } from './navigation/createHashSceneHistory.js';
 export { createMemorySceneHistory } from './navigation/createMemorySceneHistory.js';
 export { diagnoseRenderedNavigation } from './navigation/diagnoseRenderedNavigation.js';
 export { identityRoute } from './navigation/identityRoute.js';

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/navigation/createHashSceneHistory.d.ts

@@ -0,0 +1,4 @@
+import { SceneBrowserWindow } from './createBrowserSceneHistory';
+import { SceneHistory } from './SceneHistory';
+export declare function createHashSceneHistory(browser?: SceneBrowserWindow): SceneHistory;
+//# sourceMappingURL=createHashSceneHistory.d.ts.map

package/dist/esm/navigation/createHashSceneHistory.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createHashSceneHistory.d.ts","sourceRoot":"","sources":["../../../navigation/createHashSceneHistory.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAY9C,wBAAgB,sBAAsB,CAAC,OAAO,GAAE,kBAA2B,GAAG,YAAY,CAyBzF"}

package/dist/esm/navigation/createHashSceneHistory.js

@@ -0,0 +1,41 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+const stateKey = 'sceneNavigation';
+/**
+ * A history kept in the URL fragment - `index.html#/WorkItemDetails?workItemId=B` - for hosts that are served
+ * as a single file or from a path they do not control, such as a generated runtime or a webview. It behaves
+ * like `createBrowserSceneHistory`: entries are pushed with their navigation state, back and forward restore
+ * them, and a typed or bookmarked fragment is matched by URL alone. A fragment changed by hand, which fires
+ * `hashchange` rather than `popstate`, is reported the same way.
+ */ function createHashSceneHistory(browser = window) {
+    const location = ()=>{
+        const fragment = browser.location.hash.replace(/^#\/?/, '');
+        return fragment.length ? fragment : undefined;
+    };
+    const href = (url)=>`${browser.location.pathname}${browser.location.search}#/${url ?? ''}`;
+    const stored = (value)=>value?.[stateKey];
+    return {
+        location,
+        state: ()=>stored(browser.history.state),
+        push: (state)=>browser.history.pushState({
+                [stateKey]: state
+            }, '', href(state.url)),
+        replace: (state)=>browser.history.replaceState({
+                [stateKey]: state
+            }, '', href(state.url)),
+        back: ()=>browser.history.back(),
+        listen: (listener)=>{
+            const onPopState = (event)=>listener(location(), stored(event.state));
+            const onHashChange = ()=>listener(location(), stored(browser.history.state));
+            browser.addEventListener('popstate', onPopState);
+            browser.addEventListener('hashchange', onHashChange);
+            return ()=>{
+                browser.removeEventListener('popstate', onPopState);
+                browser.removeEventListener('hashchange', onHashChange);
+            };
+        }
+    };
+}
+
+export { createHashSceneHistory };
+//# sourceMappingURL=createHashSceneHistory.js.map

package/dist/esm/navigation/createHashSceneHistory.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createHashSceneHistory.js","sources":["../../../navigation/createHashSceneHistory.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 { SceneBrowserWindow } from './createBrowserSceneHistory';\nimport { SceneHistory } from './SceneHistory';\nimport { SceneNavigationState } from './SceneNavigationState';\n\nconst stateKey = 'sceneNavigation';\n\n/**\n * A history kept in the URL fragment - `index.html#/WorkItemDetails?workItemId=B` - for hosts that are served\n * as a single file or from a path they do not control, such as a generated runtime or a webview. It behaves\n * like `createBrowserSceneHistory`: entries are pushed with their navigation state, back and forward restore\n * them, and a typed or bookmarked fragment is matched by URL alone. A fragment changed by hand, which fires\n * `hashchange` rather than `popstate`, is reported the same way.\n */\nexport function createHashSceneHistory(browser: SceneBrowserWindow = window): SceneHistory {\n    const location = () => {\n        const fragment = browser.location.hash.replace(/^#\\/?/, '');\n        return fragment.length ? fragment : undefined;\n    };\n    const href = (url: string | undefined) => `${browser.location.pathname}${browser.location.search}#/${url ?? ''}`;\n    const stored = (value: unknown) => (value as Record<string, SceneNavigationState> | null)?.[stateKey];\n\n    return {\n        location,\n        state: () => stored(browser.history.state),\n        push: state => browser.history.pushState({ [stateKey]: state }, '', href(state.url)),\n        replace: state => browser.history.replaceState({ [stateKey]: state }, '', href(state.url)),\n        back: () => browser.history.back(),\n        listen: listener => {\n            const onPopState = (event: PopStateEvent) => listener(location(), stored(event.state));\n            const onHashChange = () => listener(location(), stored(browser.history.state));\n            browser.addEventListener('popstate', onPopState);\n            browser.addEventListener('hashchange', onHashChange);\n            return () => {\n                browser.removeEventListener('popstate', onPopState);\n                browser.removeEventListener('hashchange', onHashChange);\n            };\n        },\n    };\n}\n"],"names":["stateKey","createHashSceneHistory","browser","window","location","fragment","hash","replace","length","undefined","href","url","pathname","search","stored","value","state","history","push","pushState","replaceState","back","listen","listener","onPopState","event","onHashChange","addEventListener","removeEventListener"],"mappings":"AAAA;AACA;AAMA,MAAMA,QAAAA,GAAW,iBAAA;AAEjB;;;;;;AAMC,IACM,SAASC,sBAAAA,CAAuBC,OAAAA,GAA8BC,MAAM,EAAA;AACvE,IAAA,MAAMC,QAAAA,GAAW,IAAA;QACb,MAAMC,QAAAA,GAAWH,QAAQE,QAAQ,CAACE,IAAI,CAACC,OAAO,CAAC,OAAA,EAAS,EAAA,CAAA;QACxD,OAAOF,QAAAA,CAASG,MAAM,GAAGH,QAAAA,GAAWI,SAAAA;AACxC,IAAA,CAAA;AACA,IAAA,MAAMC,OAAO,CAACC,GAAAA,GAA4B,CAAA,EAAGT,OAAAA,CAAQE,QAAQ,CAACQ,QAAQ,CAAA,EAAGV,OAAAA,CAAQE,QAAQ,CAACS,MAAM,CAAC,EAAE,EAAEF,OAAO,EAAA,CAAA,CAAI;AAChH,IAAA,MAAMG,MAAAA,GAAS,CAACC,KAAAA,GAAoBA,KAAAA,GAAwDf,QAAAA,CAAS;IAErG,OAAO;AACHI,QAAAA,QAAAA;AACAY,QAAAA,KAAAA,EAAO,IAAMF,MAAAA,CAAOZ,OAAAA,CAAQe,OAAO,CAACD,KAAK,CAAA;AACzCE,QAAAA,IAAAA,EAAMF,CAAAA,KAAAA,GAASd,OAAAA,CAAQe,OAAO,CAACE,SAAS,CAAC;AAAE,gBAAA,CAACnB,WAAWgB;aAAM,EAAG,EAAA,EAAIN,IAAAA,CAAKM,KAAAA,CAAML,GAAG,CAAA,CAAA;AAClFJ,QAAAA,OAAAA,EAASS,CAAAA,KAAAA,GAASd,OAAAA,CAAQe,OAAO,CAACG,YAAY,CAAC;AAAE,gBAAA,CAACpB,WAAWgB;aAAM,EAAG,EAAA,EAAIN,IAAAA,CAAKM,KAAAA,CAAML,GAAG,CAAA,CAAA;AACxFU,QAAAA,IAAAA,EAAM,IAAMnB,OAAAA,CAAQe,OAAO,CAACI,IAAI,EAAA;AAChCC,QAAAA,MAAAA,EAAQC,CAAAA,QAAAA,GAAAA;AACJ,YAAA,MAAMC,aAAa,CAACC,KAAAA,GAAyBF,SAASnB,QAAAA,EAAAA,EAAYU,MAAAA,CAAOW,MAAMT,KAAK,CAAA,CAAA;YACpF,MAAMU,YAAAA,GAAe,IAAMH,QAAAA,CAASnB,QAAAA,EAAAA,EAAYU,OAAOZ,OAAAA,CAAQe,OAAO,CAACD,KAAK,CAAA,CAAA;YAC5Ed,OAAAA,CAAQyB,gBAAgB,CAAC,UAAA,EAAYH,UAAAA,CAAAA;YACrCtB,OAAAA,CAAQyB,gBAAgB,CAAC,YAAA,EAAcD,YAAAA,CAAAA;YACvC,OAAO,IAAA;gBACHxB,OAAAA,CAAQ0B,mBAAmB,CAAC,UAAA,EAAYJ,UAAAA,CAAAA;gBACxCtB,OAAAA,CAAQ0B,mBAAmB,CAAC,YAAA,EAAcF,YAAAA,CAAAA;AAC9C,YAAA,CAAA;AACJ,QAAA;AACJ,KAAA;AACJ;;"}

package/dist/esm/navigation/index.d.ts

@@ -6,6 +6,7 @@ export * from './SceneNavigationHost';
 export * from './SceneNavigationState';
 export * from './SceneRoute';
 export * from './createBrowserSceneHistory';
+export * from './createHashSceneHistory';
 export * from './createMemorySceneHistory';
 export * from './diagnoseRenderedNavigation';
 export * from './identityRoute';

package/dist/esm/navigation/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../navigation/index.ts"],"names":[],"mappings":"AAGA,cAAc,yBAAyB,CAAC;AACxC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC;AAC7B,cAAc,6BAA6B,CAAC;AAC5C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,6BAA6B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../navigation/index.ts"],"names":[],"mappings":"AAGA,cAAc,yBAAyB,CAAC;AACxC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC;AAC7B,cAAc,6BAA6B,CAAC;AAC5C,cAAc,0BAA0B,CAAC;AACzC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,6BAA6B,CAAC"}