@dfosco/storyboard-react 4.2.0-beta.25 → 4.2.0-beta.26

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@dfosco/storyboard-react",
-  "version": "4.2.0-beta.25",
+  "version": "4.2.0-beta.26",
   "type": "module",
   "dependencies": {
     "@base-ui/react": "^1.4.0",
-    "@dfosco/storyboard-core": "4.2.0-beta.25",
-    "@dfosco/tiny-canvas": "4.2.0-beta.25",
+    "@dfosco/storyboard-core": "4.2.0-beta.26",
+    "@dfosco/tiny-canvas": "4.2.0-beta.26",
     "@neodrag/react": "^2.3.1",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-visually-hidden": "^1.2.4",

package/src/AuthModal/AuthModal.jsx

@@ -6,7 +6,6 @@
  */
 import { useState, useEffect, useCallback } from 'react'
 import { Dialog } from '@base-ui/react/dialog'
-import { Button } from '@base-ui/react/button'
 import css from './AuthModal.module.css'
 
 const COMMENTS_TOKEN_KEY = 'sb-comments-token'
@@ -31,7 +30,7 @@ export default function AuthModal() {
     return () => document.removeEventListener('storyboard:open-auth-modal', handleOpen)
   }, [])
 
-  const handleClose = useCallback(() => {
+  const _handleClose = useCallback(() => {
     setOpen(false)
     setTokenValue('')
   }, [])

package/src/CommandPalette/CommandPalette.jsx

@@ -86,6 +86,7 @@ function isHiddenInPalette(tool, basePath) {
 function buildConfigSections(prefix, onNavigateToPage, onCreateAction) {
   const config = getCommandPaletteConfig()
   const sections = config?.sections || []
+  console.log('[devlog] CommandPalette buildConfigSections:', { sectionsCount: sections.length, providers: config?.providers, configKeys: Object.keys(config || {}) })
   const groups = []
   const toolMenus = []
   const usedToolIds = new Set()
@@ -417,7 +418,7 @@ function buildDynamicSection(section, prefix, onNavigateToPage, onCreateAction)
   if (section.source === 'starred') {
     const STARRED_KEY = 'sb-workspace-starred'
     let starredIds = []
-    try { starredIds = JSON.parse(localStorage.getItem(STARRED_KEY)) || [] } catch {}
+    try { starredIds = JSON.parse(localStorage.getItem(STARRED_KEY)) || [] } catch { /* empty */ }
     if (starredIds.length === 0) return null
 
     const index = buildPrototypeIndex()
@@ -639,7 +640,7 @@ function buildToolsSection(section, prefix, onNavigateToPage) {
   const items = []
   const subPages = []
 
-  for (const { toolId, tool, label, toolIcon, toolMeta, closeOnSelect: entryCloseOnSelect } of entries) {
+  for (const { toolId, tool, label, closeOnSelect: entryCloseOnSelect } of entries) {
     // Inline actions
     if (tool.inlineAction === 'toggle-chrome') {
       const isHidden = document.documentElement.classList.contains('storyboard-chrome-hidden')
@@ -994,6 +995,7 @@ export default function StoryboardCommandPalette({ basePath }) {
   useEffect(() => {
     if (refreshKey === 0) return
     const built = buildPaletteItems(basePath, handleCreateAction, handleNavigateToPage)
+    // eslint-disable-next-line react-hooks/set-state-in-effect
     setItems(built.groups)
     setToolMenus(built.toolMenus)
   }, [refreshKey, basePath])
@@ -1196,7 +1198,7 @@ export default function StoryboardCommandPalette({ basePath }) {
                 !search && <Command.Separator key={list.id} />
               ) : (
                 <Command.Group key={list.id} heading={list.heading}>
-                  {list.items.map(({ id, children, keywords, onClick, itemType, toolIcon, toolMeta, closeOnSelect, hideFromSearch, url, ...rest }) => {
+                  {list.items.map(({ id, children, keywords, onClick, itemType, toolIcon, toolMeta, closeOnSelect, hideFromSearch, url, ..._rest }) => {
                     if (search && hideFromSearch) return null
                     if (hiddenFromSearchIds.size > 0) {
                       for (const toolId of hiddenFromSearchIds) {

package/src/Viewfinder.jsx

@@ -5,8 +5,8 @@
  * Formerly known as Viewfinder — renamed to match the /workspace route.
  */
 import { useState, useEffect, useRef, useMemo, useCallback, useSyncExternalStore } from 'react'
-import { buildPrototypeIndex, listStories, getStoryData, getLocal, setLocal, BranchSelect } from '@dfosco/storyboard-core'
-import { MarkGithubIcon, GitBranchIcon, ChevronDownIcon, ChevronRightIcon, FileDirectoryFillIcon, PlusIcon, StarIcon, StarFillIcon, ThreeBarsIcon, XIcon, StackIcon, TrashIcon, ShieldLockIcon, KebabHorizontalIcon, PencilIcon } from '@primer/octicons-react'
+import { buildPrototypeIndex, listStories, getStoryData, BranchSelect } from '@dfosco/storyboard-core'
+import { MarkGithubIcon, GitBranchIcon, ChevronDownIcon, ChevronRightIcon, PlusIcon, StarIcon, StarFillIcon, ThreeBarsIcon, XIcon, StackIcon, TrashIcon, ShieldLockIcon, KebabHorizontalIcon, PencilIcon } from '@primer/octicons-react'
 import { Menu } from '@base-ui/react/menu'
 import { Dialog } from '@base-ui/react/dialog'
 import Icon from './Icon.jsx'
@@ -56,7 +56,7 @@ const COMMENTS_TOKEN_KEY = 'sb-comments-token'
  * Resolve the current GitHub user for display in the sidebar.
  * Priority: 1) PAT-cached user (from comments auth), 2) gh CLI login via git-user endpoint.
  */
-function useGitHubUser(basePath) {
+function useGitHubUser(_basePath) {
   const [user, setUser] = useState(() => {
     try {
       const raw = localStorage.getItem(COMMENTS_USER_KEY)
@@ -158,7 +158,7 @@ function withBase(basePath, route) {
 
 const THUMB_CLASSES = ['thumbBlue', 'thumbAmber', 'thumbGreen', 'thumbPurple', 'thumbRose', 'thumbSlate']
 
-function thumbClass(name) {
+function _thumbClass(name) {
   let h = 0
   for (let i = 0; i < name.length; i++) h = ((h << 5) - h + name.charCodeAt(i)) | 0
   return css[THUMB_CLASSES[Math.abs(h) % THUMB_CLASSES.length]]
@@ -1081,7 +1081,7 @@ export default function Workspace({
   hideDefaultFlow,
   hideDefaultScene = false,
 }) {
-  const shouldHideDefault = hideDefaultFlow ?? hideDefaultScene
+  const _shouldHideDefault = hideDefaultFlow ?? hideDefaultScene
   const themeAttrs = useToolbarTheme()
   const ghUser = useGitHubUser(basePath)
   const [settingsOpen, setSettingsOpen] = useState(false)
@@ -1258,7 +1258,7 @@ export default function Workspace({
   const toggleGrouping = useCallback(() => {
     setGroupByFolders(prev => {
       const next = !prev
-      try { localStorage.setItem(GROUP_BY_FOLDERS_KEY, String(next)) } catch {}
+      try { localStorage.setItem(GROUP_BY_FOLDERS_KEY, String(next)) } catch { /* empty */ }
       return next
     })
   }, [])
@@ -1291,7 +1291,7 @@ export default function Workspace({
   // Starred items for sidebar
   const starredItems = useMemo(() => visibleItems.filter(i => starred.has(i.id)), [visibleItems, starred])
 
-  const pageTitle = NAV_ITEMS.find(n => n.id === activeNav)?.label || 'All artifacts'
+  const _pageTitle = NAV_ITEMS.find(n => n.id === activeNav)?.label || 'All artifacts'
 
   return (
     <div className={css.layout} {...themeAttrs}>

package/src/canvas/CanvasPage.jsx

@@ -58,7 +58,7 @@ registerSmoothCorners()
 registerHotPoolDevLogs()
 
 /** Matches branch-deploy base path prefixes like /branch--my-feature/ */
-const BRANCH_PREFIX_RE = /^\/branch--[^/]+/
+const _BRANCH_PREFIX_RE = /^\/branch--[^/]+/
 
 // Build a reverse map from story route paths → { storyId, route }
 const storyRouteIndex = new Map()

package/src/canvas/ConnectorLayer.jsx

@@ -21,7 +21,7 @@ function getEndpointStyle(widgetType, side) {
 
 const DOT_OUTSET = 8
 
-function getDotOffset(anchor) {
+function _getDotOffset(anchor) {
   switch (anchor) {
     case 'top':    return { dx: 0, dy: -DOT_OUTSET }
     case 'bottom': return { dx: 0, dy: DOT_OUTSET }

package/src/canvas/PageSelector.test.jsx

@@ -1,4 +1,4 @@
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
+import { describe, it, expect, beforeEach } from 'vitest'
 import { render, screen, fireEvent, waitFor } from '@testing-library/react'
 import PageSelector from './PageSelector.jsx'
 

package/src/canvas/widgets/ExpandedPane.jsx

@@ -66,6 +66,7 @@ export default function ExpandedPane({ initialPanes, initialLayout, variant = 'm
 
   // Sync layout when initialLayout changes (preserves column/row sizes)
   useEffect(() => {
+    // eslint-disable-next-line react-hooks/set-state-in-effect
     if (initialLayout) setLayout(initialLayout)
   }, [initialLayout])
 
@@ -113,7 +114,9 @@ export default function ExpandedPane({ initialPanes, initialLayout, variant = 'm
       }
       detachRefs.current.clear()
     }
-  }, []) // eslint-disable-line react-hooks/exhaustive-deps — intentional mount-only
+    // intentional mount-only
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [])
 
   // Handle pane list changes: attach new external panes, detach removed ones
   useLayoutEffect(() => {

package/src/canvas/widgets/MarkdownBlock.jsx

@@ -105,6 +105,7 @@ export default forwardRef(function MarkdownBlock({ id, props, onUpdate, resizabl
 
   // Async-highlight code blocks after initial render or theme change
   useEffect(() => {
+    // eslint-disable-next-line react-hooks/set-state-in-effect
     setRenderedHtml(rawHtml)
     if (!rawHtml.includes('<code class="language-')) return
     let cancelled = false
@@ -149,6 +150,7 @@ export default forwardRef(function MarkdownBlock({ id, props, onUpdate, resizabl
         }
       }
     } else {
+      // eslint-disable-next-line react-hooks/set-state-in-effect
       setEditHeight(null)
     }
   }, [editingActive])

package/src/canvas/widgets/WidgetChrome.jsx

@@ -451,6 +451,7 @@ export default function WidgetChrome({
         <div className={`${styles.toolbarContent} ${showToolbar ? styles.toolbarContentVisible : ''}`}>
           {showFeatures && (
           <div className={styles.featureButtons}>
+            {/* eslint-disable-next-line react-hooks/refs */}
             {features.map((feature) => {
               // Menu features are rendered in WidgetOverflowMenu
               if (feature.menu) return null

package/src/canvas/widgets/expandUtils.js

@@ -22,7 +22,9 @@ export { isSplitScreenCapable }
  */
 function MarkdownSecondaryPane({ widget, editingRef, onUpdate }) {
   const [editing, setEditing] = useState(false)
+  // eslint-disable-next-line react-hooks/refs
   editingRef.current = editing
+  // eslint-disable-next-line react-hooks/refs
   editingRef.setter = (v) => {
     setEditing(v)
     // Notify ExpandedPane to re-render so titlebar features resolve updated toggle state
@@ -31,6 +33,7 @@ function MarkdownSecondaryPane({ widget, editingRef, onUpdate }) {
 
   const content = widget.props?.content || ''
 
+  // eslint-disable-next-line react-hooks/refs
   return createElement(ExpandedMarkdownEditor, {
     content,
     onUpdate,