anentrypoint-design 0.0.209 → 0.0.211

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "anentrypoint-design",
-  "version": "0.0.209",
+  "version": "0.0.211",
   "description": "247420 design system SDK — webjsx + modified ripple-ui, single-file ESM bundle for reproducible use of the AnEntrypoint design.",
   "type": "module",
   "main": "./dist/247420.js",

package/src/components/content.js

@@ -100,7 +100,13 @@ export function Row({ code, rank, title, sub, meta, active, state = 'default', o
                 onkeydown: (e) => { e.stopPropagation(); },
             }, a.label)))
         : null;
+    // Color is not the only status channel: emit a visually-hidden word for the
+    // meaningful rail tones (error/subagent) so AT and color-blind users get the
+    // state. green is the unremarkable default - announcing "ok" everywhere would
+    // be AT noise - so it emits nothing.
+    const railWord = rail === 'flame' ? 'error' : rail === 'purple' ? 'subagent' : null;
     return h(isLink ? 'a' : 'div', props,
+        railWord ? h('span', { class: 'sr-only' }, railWord) : null,
         leading != null ? leading : (codeVal != null ? h('span', { class: 'code' }, codeVal) : null),
         h('span', { class: 'title' }, titleNode, sub ? h('span', { class: 'sub' }, sub) : null),
         trailing != null ? trailing : (meta != null ? h('span', { class: 'meta' }, meta) : null),

package/src/components/files.js

@@ -97,7 +97,7 @@ export function FileRow({ name, type = 'other', size, modified, code, onOpen, on
         'aria-label': (marked ? 'unselect ' : 'select ') + name,
         disabled: (noAccess || busy) ? true : null,
         onclick: onMark ? (e) => onMark({ range: !!e.shiftKey }) : null,
-    }, h('span', { 'aria-hidden': 'true' }, marked ? '[x]' : '[ ]')) : null;
+    }, h('span', { class: 'ds-check-box', 'aria-hidden': 'true' })) : null;
     // A role=button row containing real <button> action controls is invalid
     // HTML (interactive nesting). Instead the row is a plain container and the
     // primary "open" affordance is itself a real <button> (native keyboard +
@@ -243,7 +243,7 @@ export function FileGrid({ files = [], onOpen, onAction, onUp, emptyText = 'No f
             'aria-checked': allState,
             'aria-label': allState === 'true' ? 'clear selection' : 'select all ' + selectableKeys.length + ' shown files',
             onclick: () => (allState === 'true' && onClearSelection) ? onClearSelection() : onSelectAll(selectableKeys) },
-            h('span', { 'aria-hidden': 'true' }, allState === 'true' ? '[x]' : allState === 'mixed' ? '[-]' : '[ ]'),
+            h('span', { class: 'ds-check-box', 'aria-hidden': 'true' }),
             h('span', {}, 'all'))
         : null;
     // Density picker — list / compact / thumbnails. A radiogroup, not tabs:
@@ -334,7 +334,7 @@ function FileCell({ key, f = {}, selectable = false, marked = false, onMark, onO
             'aria-label': (marked ? 'unselect ' : 'select ') + f.name,
             disabled: noAccess ? true : null,
             onclick: onMark ? (e) => onMark({ range: !!e.shiftKey }) : null,
-        }, h('span', { 'aria-hidden': 'true' }, marked ? '[x]' : '[ ]')) : null,
+        }, h('span', { class: 'ds-check-box', 'aria-hidden': 'true' })) : null,
         h('button', {
             key: 'open', type: 'button', class: 'ds-file-cell-open',
             onclick: canOpen ? () => onOpen(f) : null,

package/src/components/sessions.js

@@ -186,7 +186,7 @@ export function SessionCard({ session = {}, onStop, onOpen, onView, active = fal
       'aria-checked': selected ? 'true' : 'false',
       'aria-label': (selected ? 'deselect' : 'select') + ' session ' + (s.title || s.agent || s.sid),
       onclick: () => onToggleSelect && onToggleSelect(s),
-    }, selected ? '[x]' : '[ ]') : null,
+    }, h('span', { class: 'ds-check-box', 'aria-hidden': 'true' })) : null,
     h('span', { class: 'status-dot-disc ' + STATUS_DISC[st], 'aria-hidden': 'true' }),
     h('span', { class: 'ds-dash-status is-' + st }, STATUS_WORD[st]),
     s.external ? h('span', { class: 'ds-dash-external' }, 'external') : null,
@@ -310,7 +310,7 @@ export function SessionDashboard({ sessions = [], onStop, onOpen, onView, onStop
     ? h('button', { key: 'selall', type: 'button', class: 'ds-dash-selectall', role: 'checkbox',
         'aria-checked': allState, 'aria-label': allState === 'true' ? 'clear selection' : 'select all sessions',
         onclick: () => (allState === 'true' && onClearSelection) ? onClearSelection() : onSelectAll(selectableSids) },
-        h('span', { 'aria-hidden': 'true' }, allState === 'true' ? '[x]' : allState === 'mixed' ? '[-]' : '[ ]'),
+        h('span', { class: 'ds-check-box', 'aria-hidden': 'true' }),
         h('span', {}, 'all'))
     : null;
   const clearCtl = (selectable && selCount && onClearSelection)

package/src/components/shell.js

@@ -305,15 +305,60 @@ export function AppShell({ topbar, crumb, side, main, status, narrow } = {}) {
 function toggleWs(which) {
     const shell = document.querySelector('.ws-shell');
     if (!shell) return;
-    const cls = which === 'pane' ? 'ws-pane-collapsed' : 'ws-rail-collapsed';
+    const cls = which === 'pane' ? 'ws-pane-collapsed'
+        : which === 'sessions' ? 'ws-sessions-collapsed'
+        : 'ws-rail-collapsed';
     const nowCollapsed = shell.classList.toggle(cls);
-    const btn = document.querySelector('.ws-' + which + '-toggle');
-    if (btn) btn.setAttribute('aria-expanded', nowCollapsed ? 'false' : 'true');
+    document.querySelectorAll('.ws-' + which + '-toggle').forEach((btn) =>
+        btn.setAttribute('aria-expanded', nowCollapsed ? 'false' : 'true'));
     try {
         localStorage.setItem('ds.ws.' + which, nowCollapsed ? 'collapsed' : 'open');
     } catch (_) {}
 }
 
+// Column resize: read the current rendered track width and write a clamped inline
+// --ws-<col>-w on .ws-shell (inline overrides the fluid clamp base), persisted.
+const WS_RESIZE_CLAMP = { rail: [60, 360], sessions: [200, 520], pane: [240, 560] };
+function wsResize(col, dx) {
+    const shell = document.querySelector('.ws-shell');
+    if (!shell) return;
+    const track = shell.querySelector('.ws-' + col);
+    const cur = track ? track.getBoundingClientRect().width : 0;
+    const [lo, hi] = WS_RESIZE_CLAMP[col] || [120, 600];
+    const next = Math.max(lo, Math.min(hi, Math.round(cur + dx)));
+    shell.style.setProperty('--ws-' + col + '-w', next + 'px');
+    try { localStorage.setItem('ds.ws.w.' + col, String(next)); } catch (_) {}
+}
+function seedWsWidths(el) {
+    if (!el) return;
+    ['rail', 'sessions', 'pane'].forEach((col) => {
+        try {
+            const v = localStorage.getItem('ds.ws.w.' + col);
+            if (v && /^\d+$/.test(v)) el.style.setProperty('--ws-' + col + '-w', v + 'px');
+        } catch (_) {}
+    });
+}
+function WsResizer(col) {
+    const onKey = (e) => {
+        if (e.key === 'ArrowLeft') { e.preventDefault(); wsResize(col, -16); }
+        else if (e.key === 'ArrowRight') { e.preventDefault(); wsResize(col, 16); }
+    };
+    const onDown = (e) => {
+        e.preventDefault();
+        let lastX = e.clientX;
+        const move = (ev) => { const dx = ev.clientX - lastX; lastX = ev.clientX; wsResize(col, dx); };
+        const up = () => { document.removeEventListener('pointermove', move); document.removeEventListener('pointerup', up); document.body.style.cursor = ''; };
+        document.addEventListener('pointermove', move);
+        document.addEventListener('pointerup', up);
+        document.body.style.cursor = 'col-resize';
+    };
+    return h('div', {
+        class: 'ws-resizer ws-resizer-' + col, role: 'separator', tabindex: '0',
+        'aria-orientation': 'vertical', 'aria-label': 'resize ' + col + ' column (arrow keys)',
+        onpointerdown: onDown, onkeydown: onKey,
+    });
+}
+
 // Toggle a mobile WorkspaceShell DRAWER (sessions or pane). Distinct from the
 // desktop width-collapse (toggleWs): on mobile the columns are fixed overlays
 // revealed by .ws-sessions-open / .ws-pane-open. Opening one closes the other
@@ -394,7 +439,7 @@ export function WorkspaceShell({ rail, sessions, main, pane, crumb, status, narr
         + (((hasPane && paneIsCollapsed) || keepPaneTrack) ? ' ws-pane-collapsed' : '')
         + (hasSessions ? '' : ' ws-no-sessions')
         + (narrow ? ' narrow' : '');
-    return h('div', { class: shellCls },
+    return h('div', { class: shellCls, ref: seedWsWidths },
         h('a', { href: '#ws-main', class: 'skip-link' }, 'skip to main content'),
         // Left rail column. Its own toggle collapses it to icon-only.
         h('nav', { class: 'ws-rail', role: 'navigation', 'aria-label': railLabel },
@@ -430,6 +475,13 @@ export function WorkspaceShell({ rail, sessions, main, pane, crumb, status, narr
                         'aria-label': 'toggle conversations', 'aria-expanded': 'false',
                         onclick: () => toggleWsDrawer('sessions'),
                     }, Icon('thread')) : null,
+                    // Desktop-only sessions collapse (reclaims its width for a
+                    // full-width thread/grid). Hidden on mobile via CSS.
+                    hasSessions ? h('button', {
+                        class: 'ws-desktop-toggle ws-sessions-toggle', type: 'button',
+                        'aria-label': 'collapse conversations', title: 'collapse conversations',
+                        'aria-expanded': 'true', onclick: () => toggleWs('sessions'),
+                    }, Icon('chevron-left')) : null,
                     h('div', { class: 'ws-crumb-main' }, crumb),
                     hasPane ? h('button', {
                         class: 'ws-drawer-toggle ws-pane-drawer-toggle', type: 'button',
@@ -452,6 +504,10 @@ export function WorkspaceShell({ rail, sessions, main, pane, crumb, status, narr
                 }, Icon(paneIsCollapsed ? 'chevron-left' : 'chevron-right')),
                 pane)
             : null,
+        // Keyboard/pointer column resize handles (desktop only).
+        (!narrow && !railIsCollapsed) ? WsResizer('rail') : null,
+        (!narrow && hasSessions) ? WsResizer('sessions') : null,
+        (!narrow && hasPane && !paneIsCollapsed) ? WsResizer('pane') : null,
     );
 }