anentrypoint-design 0.0.150 → 0.0.152

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "anentrypoint-design",
-  "version": "0.0.150",
+  "version": "0.0.152",
   "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/community.js

@@ -1,6 +1,7 @@
 // Community surface — matches upstream signatures.
 
 import * as webjsx from '../../vendor/webjsx/index.js';
+import { Icon } from './shell.js';
 const h = webjsx.createElement;
 
 export function ServerIcon({ id, name, icon, active, badge, onClick } = {}) {
@@ -143,9 +144,9 @@ export function UserPanel({ name, tag, color, muted, deafened, onMute, onDeafen,
             tag ? h('div', { class: 'cm-user-tag' }, tag) : null
         ),
         h('div', { class: 'cm-user-controls' },
-            h('button', { class: 'cm-user-btn' + (muted ? ' muted' : ''), onclick: onMute, 'aria-label': muted ? 'Unmute microphone' : 'Mute microphone', 'aria-pressed': muted ? 'true' : 'false' }, muted ? '🔇' : '🎤'),
-            h('button', { class: 'cm-user-btn' + (deafened ? ' deafened' : ''), onclick: onDeafen, 'aria-label': deafened ? 'Undeafen' : 'Deafen', 'aria-pressed': deafened ? 'true' : 'false' }, deafened ? '🔕' : '🎧'),
-            h('button', { class: 'cm-user-btn', onclick: handleSettings, 'aria-label': 'Audio settings', title: 'Open audio settings' }, '⚙')
+            h('button', { class: 'cm-user-btn' + (muted ? ' muted' : ''), onclick: onMute, 'aria-label': muted ? 'Unmute microphone' : 'Mute microphone', 'aria-pressed': muted ? 'true' : 'false' }, Icon(muted ? 'mic-off' : 'mic')),
+            h('button', { class: 'cm-user-btn' + (deafened ? ' deafened' : ''), onclick: onDeafen, 'aria-label': deafened ? 'Undeafen' : 'Deafen', 'aria-pressed': deafened ? 'true' : 'false' }, Icon(deafened ? 'speaker-off' : 'speaker')),
+            h('button', { class: 'cm-user-btn', onclick: handleSettings, 'aria-label': 'Audio settings', title: 'Open audio settings' }, Icon('settings'))
         )
     );
 }
@@ -215,7 +216,7 @@ export function ChatHeader({ icon = '#', name, topic, toolbar = [] } = {}) {
 export function VoiceStrip({ channelName, status, muted, deafened, onMute, onDeafen, onLeave, open } = {}) {
     return h('div', { class: 'cm-voice-strip' + (open ? ' open' : ''), role: 'region', 'aria-label': 'voice controls' },
         h('div', { class: 'cm-vs-label' },
-            h('span', { class: 'cm-vs-channel' }, '🔊 ' + (channelName || 'voice')),
+            h('span', { class: 'cm-vs-channel' }, Icon('speaker'), ' ' + (channelName || 'voice')),
             h('span', { class: 'cm-vs-status' }, status || 'connected')
         ),
         h('button', {
@@ -223,13 +224,13 @@ export function VoiceStrip({ channelName, status, muted, deafened, onMute, onDea
             title: muted ? 'Unmute' : 'Mute',
             'aria-label': muted ? 'unmute microphone' : 'mute microphone',
             'aria-pressed': muted ? 'true' : 'false'
-        }, muted ? '🔇' : '🎤'),
+        }, Icon(muted ? 'mic-off' : 'mic')),
         h('button', {
             class: 'cm-vs-btn', type: 'button', onclick: onDeafen,
             title: deafened ? 'Undeafen' : 'Deafen',
             'aria-label': deafened ? 'undeafen' : 'deafen',
             'aria-pressed': deafened ? 'true' : 'false'
-        }, deafened ? '🔕' : '🎧'),
+        }, Icon(deafened ? 'speaker-off' : 'speaker')),
         h('button', {
             class: 'cm-vs-btn danger', type: 'button', onclick: onLeave,
             title: 'Leave voice', 'aria-label': 'leave voice channel'
@@ -242,12 +243,12 @@ export function MobileHeader({ title, onMenu, onMembers } = {}) {
         h('button', {
             class: 'cm-mh-btn', type: 'button', onclick: onMenu,
             title: 'Menu', 'aria-label': 'open navigation menu'
-        }, '☰'),
+        }, Icon('menu')),
         h('span', { class: 'cm-mh-title' }, title || ''),
         h('button', {
             class: 'cm-mh-btn', type: 'button', onclick: onMembers,
             title: 'Members', 'aria-label': 'show members'
-        }, '👥')
+        }, Icon('members'))
     );
 }
 

package/src/components/shell.js

@@ -65,6 +65,32 @@ export function Glyph({ children, color, size = 'base' }) {
     return h('span', { class: 'glyph', style }, children);
 }
 
+// Monochrome inline-SVG icons (stroke=currentColor) so chrome reads as one
+// coherent line-icon set instead of multicolor OS emoji. 16px box, 1.6 stroke.
+const ICON_PATHS = {
+    mic: '<path d="M12 3a3 3 0 0 0-3 3v5a3 3 0 0 0 6 0V6a3 3 0 0 0-3-3z"/><path d="M5 11a7 7 0 0 0 14 0M12 18v3"/>',
+    'mic-off': '<path d="M9 9v2a3 3 0 0 0 4.5 2.6M15 11V6a3 3 0 0 0-5.9-.8"/><path d="M5 11a7 7 0 0 0 11.5 5.4M12 18v3"/><path d="m4 4 16 16"/>',
+    speaker: '<path d="M11 5 6 9H3v6h3l5 4z"/><path d="M15.5 8.5a5 5 0 0 1 0 7M18.5 5.5a9 9 0 0 1 0 13"/>',
+    'speaker-off': '<path d="M11 5 6 9H3v6h3l5 4z"/><path d="m17 9 4 6M21 9l-4 6"/>',
+    camera: '<rect x="3" y="6" width="13" height="12" rx="2"/><path d="m16 10 5-3v10l-5-3z"/>',
+    screen: '<rect x="3" y="4" width="18" height="13" rx="2"/><path d="M8 21h8M12 17v4"/>',
+    phone: '<path d="M5 4h3l2 5-2 1a11 11 0 0 0 5 5l1-2 5 2v3a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z"/>',
+    members: '<circle cx="9" cy="8" r="3"/><path d="M3 20a6 6 0 0 1 12 0M16 6a3 3 0 0 1 0 6M21 20a6 6 0 0 0-4-5.7"/>',
+    menu: '<path d="M4 6h16M4 12h16M4 18h16"/>',
+    settings: '<circle cx="12" cy="12" r="3"/><path d="M12 2v3M12 19v3M4.9 4.9l2.1 2.1M17 17l2.1 2.1M2 12h3M19 12h3M4.9 19.1 7 17M17 7l2.1-2.1"/>'
+};
+export function Icon(name, { size = 16 } = {}) {
+    const inner = ICON_PATHS[name];
+    if (!inner) return h('span', { class: 'glyph', 'aria-hidden': 'true' }, '');
+    return h('svg', {
+        class: 'ds-icon ds-icon-' + name,
+        width: String(size), height: String(size), viewBox: '0 0 24 24',
+        fill: 'none', stroke: 'currentColor', 'stroke-width': '1.6',
+        'stroke-linecap': 'round', 'stroke-linejoin': 'round', 'aria-hidden': 'true',
+        dangerouslySetInnerHTML: { __html: inner }
+    });
+}
+
 export function Topbar({ brand = '247420', leaf = '', items = [], active = '', onNav, search } = {}) {
     return h('header', { class: 'app-topbar', role: 'banner' },
         Brand({ name: brand, leaf }),
@@ -151,7 +177,7 @@ export function AppShell({ topbar, crumb, side, main, status, narrow } = {}) {
             class: 'app-side-toggle', type: 'button',
             'aria-label': 'toggle navigation', 'aria-expanded': 'false', 'aria-controls': 'app-main',
             onclick: () => toggleSide(),
-        }, '☰') : null,
+        }, Icon('menu')) : null,
         topbar || null,
         crumb || null,
         h('div', { class: 'app-body' + (hasSide ? '' : ' no-side') },

package/src/components/voice.js

@@ -2,6 +2,7 @@
 // Pure factories returning webjsx vnodes. Class prefix: vx-*.
 
 import * as webjsx from '../../vendor/webjsx/index.js';
+import { Icon } from './shell.js';
 const h = webjsx.createElement;
 
 function fmtDur(s) {
@@ -32,7 +33,7 @@ export function PttButton({ state = 'idle', mode = 'ptt', onHoldStart, onHoldEnd
         ontouchend: (e) => { e.preventDefault(); end(e); }
     },
         h('span', { class: 'vx-ptt-glow', 'aria-hidden': 'true' }),
-        h('span', { class: 'vx-ptt-icon', 'aria-hidden': 'true' }, state === 'idle' ? '🎙' : '●'),
+        h('span', { class: 'vx-ptt-icon', 'aria-hidden': 'true' }, state === 'idle' ? Icon('mic') : '●'),
         h('span', { class: 'vx-ptt-label' }, label)
     );
 }
@@ -74,7 +75,7 @@ export function WebcamPreview({ videoStream = null, resolution = '640x480', fps
         h('div', { class: 'vx-cam-stage' },
             enabled
                 ? h('video', { class: 'vx-cam-video', ref: videoRef, autoplay: true, muted: true, playsinline: true })
-                : h('div', { class: 'vx-cam-placeholder' }, h('span', {}, '📷'), h('span', {}, 'Camera off'))
+                : h('div', { class: 'vx-cam-placeholder' }, h('span', {}, Icon('camera')), h('span', {}, 'Camera off'))
         ),
         h('div', { class: 'vx-cam-controls' },
             h('select', {
@@ -205,15 +206,15 @@ export function VoiceControls({ muted = false, deafened = false, cameraOn = fals
         h('span', { class: 'vx-vc-glyph', 'aria-hidden': 'true' }, glyph)
     );
     return h('div', { class: 'vx-vc', role: 'toolbar', 'aria-label': 'voice controls' },
-        btn('vx-vc-mic', !muted, muted ? 'Unmute' : 'Mute', muted ? '🔇' : '🎙', onMic),
-        btn('vx-vc-deafen', !deafened, deafened ? 'Undeafen' : 'Deafen', deafened ? '🔕' : '🔊', onDeafen),
-        btn('vx-vc-camera', cameraOn, cameraOn ? 'Stop camera' : 'Start camera', '📷', onCamera),
-        btn('vx-vc-screen', screenShareOn, screenShareOn ? 'Stop sharing' : 'Share screen', '🖥', onScreenShare),
-        btn('vx-vc-settings', false, 'Voice settings', '⚙', onSettings),
+        btn('vx-vc-mic', !muted, muted ? 'Unmute' : 'Mute', Icon(muted ? 'mic-off' : 'mic'), onMic),
+        btn('vx-vc-deafen', !deafened, deafened ? 'Undeafen' : 'Deafen', Icon(deafened ? 'speaker-off' : 'speaker'), onDeafen),
+        btn('vx-vc-camera', cameraOn, cameraOn ? 'Stop camera' : 'Start camera', Icon('camera'), onCamera),
+        btn('vx-vc-screen', screenShareOn, screenShareOn ? 'Stop sharing' : 'Share screen', Icon('screen'), onScreenShare),
+        btn('vx-vc-settings', false, 'Voice settings', Icon('settings'), onSettings),
         h('button', {
             type: 'button', class: 'vx-vc-btn vx-vc-leave', 'aria-label': 'Leave voice', title: 'Leave voice',
             onclick: onLeave ? (e) => onLeave(e) : null
-        }, h('span', { class: 'vx-vc-glyph', 'aria-hidden': 'true' }, '📞'))
+        }, h('span', { class: 'vx-vc-glyph', 'aria-hidden': 'true' }, Icon('phone')))
     );
 }
 

package/src/components.js

@@ -4,7 +4,7 @@ import * as webjsx from '../vendor/webjsx/index.js';
 export const h = webjsx.createElement;
 
 export {
-    Brand, Chip, Btn, Glyph, IconButton, Badge,
+    Brand, Chip, Btn, Glyph, Icon, IconButton, Badge,
     Topbar, Crumb, Side, Status, AppShell,
     Heading, Lede, Dot, Rail
 } from './components/shell.js';

package/src/kits/os/theme.css

@@ -580,8 +580,8 @@ html.ds-247420 { touch-action: pan-x pan-y; overscroll-behavior: none; -webkit-t
 }
 
 /* ---- Session-UX surfaces: chips + modals + empty state ---- */
-.ds-247420 .os-instances { display: flex; gap: 6px; align-items: center; flex: 0 1 auto; min-width: 0; overflow-x: auto; overflow-y: hidden; padding: 0 4px; scrollbar-width: thin; }
-.ds-247420 .os-instances::-webkit-scrollbar { height: 4px; }
+.ds-247420 .os-instances { display: flex; gap: 6px; align-items: center; flex: 0 1 auto; min-width: 0; height: var(--os-bar-h, 34px); overflow-x: auto; overflow-y: hidden; padding: 0 4px; scrollbar-width: none; }
+.ds-247420 .os-instances::-webkit-scrollbar { display: none; }
 
 .ds-247420 .tb-sess-chip {
   display: inline-flex; align-items: center; gap: 6px;