anentrypoint-design 0.0.340 → 0.0.341

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "anentrypoint-design",
-  "version": "0.0.340",
+  "version": "0.0.341",
   "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/chat.js

@@ -97,7 +97,7 @@ function renderPart(p, key) {
     });
 }
 
-export function ChatMessage({ role, who = 'them', avatar, text, parts, time, typing, key, aicat, reactions, receipt, name, streaming, actions, incomplete, stopped, flat }) {
+export function ChatMessage({ role, who = 'them', avatar, text, parts, time, typing, key, aicat, reactions, receipt, name, streaming, actions, incomplete, stopped, flat, error, onRetry }) {
     _stats.messages += 1;
     // Support legacy 'who' prop, prefer 'role' with mapping:
     //   'user'      -> 'you'   (right-aligned, accent bubble)
@@ -144,6 +144,15 @@ export function ChatMessage({ role, who = 'them', avatar, text, parts, time, typ
         typeof stopped === 'string' ? stopped : 'stopped — this turn was cancelled before it finished')];
     if (incomplete) bodyNodes = [...bodyNodes, h('div', { key: '_incomplete', class: 'chat-msg-notice is-incomplete', role: 'status' },
         typeof incomplete === 'string' ? incomplete : 'connection dropped mid-turn — the response may be incomplete')];
+    // Inline per-turn error: unlike a global toast, this pins the failure to
+    // the specific turn that failed (docstudio pattern) with a retry action
+    // right there instead of forcing the user to hunt for what broke.
+    if (error) bodyNodes = [...bodyNodes, h('div', { key: '_error', class: 'chat-msg-notice is-error', role: 'alert' },
+        h('span', {}, typeof error === 'string' ? error : 'this turn failed'),
+        onRetry ? h('button', {
+            type: 'button', class: 'chat-msg-retry-btn',
+            onclick: (e) => { e.preventDefault(); onRetry(e); },
+        }, 'retry') : null)];
     const reactionRow = reactions && reactions.length
         ? h('div', { class: 'chat-reactions' },
             ...reactions.map((r, i) => h('span', { class: 'rxn' + (r.you ? ' you' : ''), key: 'r' + i, 'aria-label': `${r.emoji} reaction (${String(r.count)} ${String(r.count) === '1' ? 'reaction' : 'reactions'})${r.you ? ' - you reacted' : ''}` },

package/src/components/content.js

@@ -6,6 +6,18 @@ import * as webjsx from '../../vendor/webjsx/index.js';
 import { Btn, Heading, Lede, Dot, Icon } from './shell.js';
 const h = webjsx.createElement;
 
+// Avatar — generic identity disc: an image when `src` resolves, else a
+// letter fallback derived from `name`/`fallback`. Kit previously only had
+// scoped one-offs (chat.js `.chat-avatar`, community.js `.cm-user-avatar`)
+// duplicating this same letter-fallback logic; this is the reusable version.
+export function Avatar({ name, src, fallback, size = 'md', key } = {}) {
+    const letter = fallback != null ? fallback
+        : (name ? String(name).trim().charAt(0).toUpperCase() || '?' : '?');
+    const cls = 'ds-avatar ds-avatar-' + size;
+    if (src) return h('img', { key, class: cls, src, alt: name || '', loading: 'lazy' });
+    return h('span', { key, class: cls, 'aria-hidden': !!name, role: name ? 'img' : undefined, 'aria-label': name || undefined }, letter);
+}
+
 export function Panel({ title, count, right, style = '', class: className = '', children, kind, id }) {
     const cls = 'panel' + (kind ? ' panel-' + kind : '') + (className ? ' ' + className : '');
     return h('div', { class: cls, style, id: id || null },

package/src/components/files.js

@@ -147,8 +147,8 @@ export function FileRow({ name, type = 'other', size, modified, code, onOpen, on
 // grid does not flash from a bare spinner to a full list (predictable perceived
 // perf, the file-manager feel). `rows` controls how many ghost rows render.
 export function FileSkeleton({ rows = 12 } = {}) {
-    return h('div', { class: 'ds-file-grid ds-file-skeleton', 'aria-hidden': 'true' },
-        ...Array.from({ length: Math.max(1, rows) }, (_, i) => h('div', { key: 'sk' + i, class: 'ds-file-row ds-file-row-skeleton' },
+    return h('div', { class: 'ds-file-grid ds-file-skeleton', role: 'status', 'aria-busy': 'true', 'aria-label': 'loading files' },
+        ...Array.from({ length: Math.max(1, rows) }, (_, i) => h('div', { key: 'sk' + i, class: 'ds-file-row ds-file-row-skeleton', 'aria-hidden': 'true' },
             h('span', { class: 'ds-skel ds-skel-icon' }),
             h('span', { class: 'ds-skel ds-skel-title' }),
             h('span', { class: 'ds-skel ds-skel-meta' })))

package/src/components.js

@@ -16,7 +16,7 @@ export {
     WorksList, WritingList, Manifesto, Section, PageHeader,
     Kpi, Sparkline, BarChart, Table, SearchInput, TextField, Select, EventList,
     HomeView, ProjectView, Form,
-    Spinner, Skeleton, Alert, FilterPills
+    Spinner, Skeleton, Alert, FilterPills, Avatar
 } from './components/content.js';
 
 export {

package/src/css/app-shell/kits-appended.css

@@ -372,3 +372,16 @@
   .ds-chat-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; align-items: start; gap: var(--space-4); }
   .ds-chat-detail { display: block; position: sticky; top: 0; }
 }
+
+/* Avatar — generic identity disc primitive (content.js Avatar). Sized
+   variants mirror the existing chat-avatar/community-avatar footprints so
+   any consumer gets a consistent disc without duplicating the CSS. */
+.ds-avatar {
+  display: inline-flex; align-items: center; justify-content: center;
+  border-radius: 50%; background: var(--bg-3); color: var(--fg);
+  font-family: var(--ff-mono); font-weight: 600; text-transform: lowercase;
+  letter-spacing: 0.02em; user-select: none; flex-shrink: 0; object-fit: cover;
+}
+.ds-avatar-sm { width: 24px; height: 24px; font-size: 10px; }
+.ds-avatar-md { width: 36px; height: 36px; font-size: 12px; }
+.ds-avatar-lg { width: 48px; height: 48px; font-size: 15px; }