@dfosco/storyboard 0.9.3 → 0.9.5

package/src/internals/canvas/widgets/widgetConfig.merged.test.js

@@ -0,0 +1,144 @@
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+import {
+  registerWidget,
+  _resetWidgetRegistry,
+} from '../../../core/stores/widgetRegistry.js'
+import {
+  getWidgetMeta,
+  isResizable,
+  isExpandable,
+  isSplitScreenCapable,
+  getInteractGate,
+  getMenuWidgetTypes,
+  getChromeOptions,
+  getInteractionOptions,
+  getFeatures,
+  getConnectorConfig,
+  schemas,
+} from './widgetConfig.js'
+
+describe('widgetConfig — merged consumer + built-in registry', () => {
+  beforeEach(() => {
+    _resetWidgetRegistry()
+  })
+
+  it('falls back to built-in widgets when nothing registered', () => {
+    expect(getWidgetMeta('sticky-note')?.label).toBeTruthy()
+    expect(getChromeOptions('sticky-note').enabled).toBe(true)
+    expect(getInteractionOptions('sticky-note').selectable).toBe(true)
+    expect(getInteractionOptions('sticky-note').movable).toBe(true)
+  })
+
+  it('consumer-registered widget exposes label/icon via getWidgetMeta', () => {
+    registerWidget('my-thing', { label: 'My Thing', icon: 'sparkle-fill' })
+    expect(getWidgetMeta('my-thing')).toEqual({ label: 'My Thing', icon: 'sparkle-fill' })
+  })
+
+  it('chrome.enabled defaults to true, overrideable to false', () => {
+    registerWidget('invisible', { label: 'Invisible', chrome: { enabled: false } })
+    expect(getChromeOptions('invisible').enabled).toBe(false)
+    registerWidget('visible', { label: 'Visible', chrome: { enabled: true } })
+    expect(getChromeOptions('visible').enabled).toBe(true)
+    registerWidget('default', { label: 'Default' })
+    expect(getChromeOptions('default').enabled).toBe(true)
+  })
+
+  it('interaction.selectable/movable default to true, overrideable to false', () => {
+    registerWidget('pinned', { label: 'Pinned', interaction: { movable: false } })
+    expect(getInteractionOptions('pinned').movable).toBe(false)
+    expect(getInteractionOptions('pinned').selectable).toBe(true)
+
+    registerWidget('decorative', { label: 'Deco', interaction: { selectable: false } })
+    expect(getInteractionOptions('decorative').selectable).toBe(false)
+    expect(getInteractionOptions('decorative').movable).toBe(true)
+  })
+
+  it('interaction.resize/expandable/splitScreen flow through to legacy getters', () => {
+    registerWidget('big', {
+      label: 'Big',
+      interaction: {
+        resize: { enabled: true, prod: true },
+        expandable: true,
+        splitScreen: true,
+        interactGate: true,
+        interactGateLabel: 'Tap to interact',
+      },
+    })
+    expect(isResizable('big')).toBe(true)
+    expect(isExpandable('big')).toBe(true)
+    expect(isSplitScreenCapable('big')).toBe(true)
+    expect(getInteractGate('big')).toEqual({ enabled: true, label: 'Tap to interact' })
+  })
+
+  it('legacy top-level keys still work as back-compat (widgets.config.json shape)', () => {
+    // No nested `interaction` block — the widgets.config.json baseline
+    // should keep working when consumer omits the block.
+    registerWidget('legacy', {
+      label: 'Legacy',
+      resize: { enabled: true, prod: false },
+      expandable: true,
+      splitScreen: true,
+      interactGate: true,
+      interactGateLabel: 'Old gate',
+    })
+    expect(isResizable('legacy')).toBe(true)
+    expect(isExpandable('legacy')).toBe(true)
+    expect(isSplitScreenCapable('legacy')).toBe(true)
+    expect(getInteractGate('legacy').enabled).toBe(true)
+    expect(getInteractGate('legacy').label).toBe('Old gate')
+  })
+
+  it('getMenuWidgetTypes includes consumer entries and excludes unlisted', () => {
+    registerWidget('shown', { label: 'Shown', icon: 'star' })
+    registerWidget('hidden', { label: 'Hidden', unlisted: true })
+    const types = getMenuWidgetTypes()
+    expect(types.some((t) => t.type === 'shown')).toBe(true)
+    expect(types.some((t) => t.type === 'hidden')).toBe(false)
+  })
+
+  it('consumer features flow through getFeatures', () => {
+    registerWidget('withFeat', {
+      label: 'With',
+      features: [
+        { id: 'foo', type: 'action', action: 'foo', label: 'Foo', icon: 'star', prod: true },
+      ],
+    })
+    const feats = getFeatures('withFeat', { isLocalDev: true })
+    expect(feats.length).toBe(1)
+    expect(feats[0].action).toBe('foo')
+  })
+
+  it('consumer connector config flows through getConnectorConfig', () => {
+    registerWidget('lockedConn', {
+      label: 'Locked',
+      connectors: { anchors: { top: 'unavailable', bottom: 'disabled', left: 'available', right: 'available' }, accept: ['sticky-note'] },
+    })
+    const cfg = getConnectorConfig('lockedConn')
+    expect(cfg.anchors.top).toBe('unavailable')
+    expect(cfg.anchors.bottom).toBe('disabled')
+    expect(cfg.accept).toEqual(['sticky-note'])
+  })
+
+  it('consumer schemas are exposed via the schemas proxy', () => {
+    registerWidget('withProps', {
+      label: 'WithProps',
+      props: {
+        title: { type: 'text', label: 'Title', default: 'Hi' },
+        width: { type: 'number', label: 'Width', default: 320 },
+      },
+    })
+    expect(schemas['withProps']).toEqual({
+      title: { type: 'text', label: 'Title', category: undefined, defaultValue: 'Hi' },
+      width: { type: 'number', label: 'Width', category: undefined, defaultValue: 320 },
+    })
+  })
+
+  it('consumer registration overrides core widget for same type', () => {
+    // sticky-note is movable by default
+    expect(getInteractionOptions('sticky-note').movable).toBe(true)
+    registerWidget('sticky-note', { label: 'Sticky', interaction: { movable: false } })
+    expect(getInteractionOptions('sticky-note').movable).toBe(false)
+    // After unregister via re-init the core entry returns
+    vi.clearAllMocks()
+  })
+})

package/src/internals/context.jsx

@@ -2,7 +2,7 @@ import { useState, useEffect, useMemo, useRef, Suspense, lazy, Component } from
 import { useParams, useLocation } from 'react-router-dom'
 // Named import seeds the core data index via init() AND provides canvas/story route data
 import { canvases, stories } from 'virtual:storyboard-data-index'
-import { loadFlow, flowExists, findRecord, deepMerge, setFlowClass, installBodyClassSync, resolveFlowName, resolveRecordName, isModesEnabled, getPrototypeMetadata } from '../core/index.js'
+import { loadFlow, flowExists, findRecord, deepMerge, setFlowClass, installBodyClassSync, resolveFlowName, resolveRecordName, getPrototypeMetadata } from '../core/index.js'
 import { StoryboardContext } from './StoryboardContext.js'
 import usePrototypeReloadGuard from './hooks/usePrototypeReloadGuard.js'
 import styles from './FlowError.module.css'
@@ -336,22 +336,6 @@ function StoryboardProviderInner({ flowName, sceneName, recordName, recordParam,
     document.title = title + branchSuffix
   }, [canvasId, prototypeName])
 
-  // Mount design modes UI when enabled in storyboard.config.json
-  useEffect(() => {
-    if (!isModesEnabled()) return
-
-    let cleanup
-    import('@dfosco/storyboard/ui-runtime')
-      .then(({ mountDesignModes }) => {
-        cleanup = mountDesignModes()
-      })
-      .catch(() => {
-        // UI not available — degrade gracefully
-      })
-
-    return () => cleanup?.()
-  }, [])
-
   // Skip flow loading for canvas/story pages and flow-less pages
   const { data, error, flowTokens } = useMemo(() => {
     if (canvasId || isMissingCanvasRoute || storyName || isMissingStoryRoute) return { data: null, error: null, flowTokens: null }

package/src/core/ui/design-modes.ts

@@ -1,7 +0,0 @@
-/**
- * Design modes UI mount — stub (Svelte UI removed).
- * These functions are no-ops. Mode switching is handled by React components.
- */
-
-export function mountDesignModesUI() {}
-export function unmountDesignModesUI() {}

package/src/core/ui/viewfinder.ts

@@ -1,7 +0,0 @@
-/**
- * Viewfinder mount — stub (Svelte UI removed).
- * These functions are no-ops. The viewfinder is rendered by React.
- */
-
-export function mountViewfinder() {}
-export function unmountViewfinder() {}

package/src/core/workshop/ui/mount.ts

@@ -1,6 +0,0 @@
-/**
- * Workshop panel mount — stub (Svelte UI removed).
- */
-
-export function mountWorkshopPanel() {}
-export function unmountWorkshopPanel() {}