@hanzo/rooms 0.1.96 → 0.1.98

package/dist/Recents.js

@@ -73,7 +73,9 @@ function List({ mode, rows, view, keep, open, reading, error, onOpen, threads, h
     // shows on hover and focus, a run's state is a dot at its end.
     const row = (r) => {
         const t = threads?.get(r.id);
-        const item = (_jsx(SidebarItem, { "data-kind": r.kind, active: open(r), rounded: "$4", minH: 31, px: "$2", pr: t || r.kind === 'dev' ? '$7' : '$2', ...(t ? { $touchable: { pr: 52 } } : null), onKeyDown: (e) => {
+        const item = (_jsx(SidebarItem, { "data-kind": r.kind, active: open(r), rounded: "$4", minH: 31, px: "$2", pr: t || r.kind === 'dev' ? '$7' : '$2', 
+            // A thumb's 44 on a touch screen; a conversation's ⋯ is a thumb wide there and always there: the title stops short of it.
+            $touchable: t ? { minH: 44, pr: 52 } : { minH: 44 }, onKeyDown: (e) => {
                 if (e.key !== 'Enter' && e.key !== ' ')
                     return;
                 e.preventDefault?.();
@@ -98,5 +100,5 @@ function List({ mode, rows, view, keep, open, reading, error, onOpen, threads, h
         : pinned
             ? null
             : note;
-    return (_jsx(YStack, { "data-slot": "recents", flex: 1, minH: 0, children: _jsxs(ScrollView, { flex: 1, showsVerticalScrollIndicator: false, children: [error ? _jsx(Note, { children: error.message }) : null, _jsxs(YStack, { role: "list", "aria-labelledby": label, gap: 1, children: [pinned ? (_jsxs(YStack, { role: "listitem", gap: 1, children: [heading(PINNED), menus(_jsx(YStack, { role: "list", "aria-label": PINNED, gap: 1, children: pinned.rows.map(row) }))] })) : null, _jsxs(YStack, { role: "listitem", gap: 1, children: [heading('Recents', label, true), loose.length ? menus(rest) : rest] })] })] }) }));
+    return (_jsx(YStack, { "data-slot": "recents", flex: 1, minH: 0, children: _jsxs(ScrollView, { flex: 1, showsVerticalScrollIndicator: false, ...{ overscrollBehavior: 'contain' }, children: [error ? _jsx(Note, { children: error.message }) : null, _jsxs(YStack, { role: "list", "aria-labelledby": label, gap: 1, children: [pinned ? (_jsxs(YStack, { role: "listitem", gap: 1, children: [heading(PINNED), menus(_jsx(YStack, { role: "list", "aria-label": PINNED, gap: 1, children: pinned.rows.map(row) }))] })) : null, _jsxs(YStack, { role: "listitem", gap: 1, children: [heading('Recents', label, true), loose.length ? menus(rest) : rest] })] })] }) }));
 }

package/dist/Settings.js

@@ -23,6 +23,7 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 //
 // The panes that are not yet built say so in one sentence rather than pretending
 // to a screen. An honest empty pane is a smaller lie than an invented one.
+import { useI18n } from '@hanzo/i18n/react';
 import { app, dev } from './lib/host.js';
 import { ArrowLeft, ArrowUpRight } from 'lucide-react';
 import { Text } from '@hanzo/ui';
@@ -104,11 +105,12 @@ export const FIRST = ROWS[0].id;
  * the address never moves.
  */
 export function SettingsList({ active, filter, onPick, onBack, }) {
+    const { t } = useI18n();
     const q = filter.trim().toLowerCase();
     const groups = q
         ? GROUPS.map((g) => ({ ...g, rows: g.rows.filter((r) => r.label.toLowerCase().includes(q)) })).filter((g) => g.rows.length > 0)
         : GROUPS;
-    return (_jsxs(_Fragment, { children: [_jsx(SidebarItem, { icon: _jsx(ArrowLeft, { size: 15, "aria-hidden": true }), onPress: onBack, children: "Workspace" }), q && groups.length === 0 ? (_jsxs(Text, { px: "$3", py: "$2", fontSize: "$2", color: "$quiet", children: ["No matches for \u201C", filter.trim(), "\u201D."] })) : null, groups.map((g) => (_jsx(SidebarSection, { label: g.label, children: g.rows.map((r) => (_jsx(SidebarItem, { 
+    return (_jsxs(_Fragment, { children: [_jsx(SidebarItem, { icon: _jsx(ArrowLeft, { size: 15, "aria-hidden": true }), onPress: onBack, children: t("Workspace") }), q && groups.length === 0 ? (_jsxs(Text, { px: "$3", py: "$2", fontSize: "$2", color: "$quiet", children: [t("No matches for “"), filter.trim(), "\u201D."] })) : null, groups.map((g) => (_jsx(SidebarSection, { label: g.label, children: g.rows.map((r) => (_jsx(SidebarItem, { 
                     // The arrow says this row LEAVES. Without it a row that navigates
                     // away and one that draws a pane in place look identical until
                     // pressed.

package/dist/Top.js

@@ -16,6 +16,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // was last). In Studio neither is lit. New is Chat's New chat, and elsewhere the
 // mode's own New row (@hanzo/build's and @hanzo/studio's `nav`, `NEW`), so the
 // bar names it as the sidebar does.
+import { useI18n } from '@hanzo/i18n/react';
 import { SquarePen } from 'lucide-react';
 import { Text, XStack } from '@hanzo/gui';
 import { nav, NEW } from '@hanzo/build';
@@ -33,7 +34,8 @@ const SEGMENT = 73;
 const GLASS = { ...pane(), borderColor: 'var(--border-strong)', borderRadius: 9999 };
 /** A round glass button named for what it does. */
 function Round({ label, onPress, children, ...rest }) {
-    return (_jsx(XStack, { render: "button", "aria-label": label, onPress: onPress, ...GLASS, width: ROUND, height: ROUND, items: "center", justify: "center", shrink: 0, cursor: "pointer", pressStyle: { bg: '$raised' }, focusVisibleStyle: { outlineWidth: 2, outlineStyle: 'solid', outlineColor: '$outlineColor' }, ...rest, children: children }));
+    const { t } = useI18n();
+    return (_jsx(XStack, { render: "button", "aria-label": t(label), onPress: onPress, ...GLASS, width: ROUND, height: ROUND, items: "center", justify: "center", shrink: 0, cursor: "pointer", pressStyle: { bg: '$raised' }, focusVisibleStyle: { outlineWidth: 2, outlineStyle: 'solid', outlineColor: '$outlineColor' }, ...rest, children: children }));
 }
 /** The drawer's mark: two strokes, the lower one shorter, 19×11 as the reference draws it. */
 function Lines() {
@@ -44,6 +46,7 @@ function Side({ value, children }) {
     return (_jsx(ToggleGroupItem, { value: value, size: "lg", width: SEGMENT, rounded: 9999, bg: "transparent", borderColor: "transparent", hoverStyle: { bg: '$hover' }, activeStyle: { bg: '$raised', borderColor: 'transparent' }, children: _jsx(Text, { fontSize: "$4", fontWeight: "500", color: "$ink", numberOfLines: 1, children: children }) }));
 }
 export function Top({ host, mode, places, go, onMenu, onChat, onDev, }) {
+    const { t } = useI18n();
     const made = mode === 'chat' ? null : (places ?? nav(host, (p) => host.go(p))).flatMap((g) => g.links).find((l) => l.id === NEW);
     const fresh = mode === 'chat'
         ? {
@@ -54,5 +57,5 @@ export function Top({ host, mode, places, go, onMenu, onChat, onDev, }) {
             },
         }
         : { label: made?.label ?? 'New', onPress: made?.onPress };
-    return (_jsxs(XStack, { "data-slot": "app-bar", height: `calc(${LINE}px + var(--safe-top))`, pt: "var(--safe-top)", px: "$4.5", items: "center", justify: "space-between", shrink: 0, $md: { display: 'none' }, children: [_jsx(Round, { label: "Open sidebar", "data-slot": "bar-menu", onPress: onMenu, children: _jsx(Lines, {}) }), _jsx(XStack, { "data-slot": "bar-mode", ...GLASS, height: LINE, p: "$1", items: "center", children: _jsxs(ToggleGroup, { type: "single", "aria-label": "App", value: mode === 'chat' || mode === 'dev' ? mode : '', disableDeactivation: true, onValueChange: (v) => (v === 'chat' ? onChat() : v === 'dev' ? onDev() : undefined), children: [_jsx(Side, { value: "chat", children: "Chat" }), _jsx(Side, { value: "dev", children: "Dev" })] }) }), _jsx(Round, { label: fresh.label, "data-slot": "bar-new", onPress: fresh.onPress, children: _jsx(SquarePen, { size: 20, "aria-hidden": true }) })] }));
+    return (_jsxs(XStack, { "data-slot": "app-bar", height: `calc(${LINE}px + var(--safe-top))`, pt: "var(--safe-top)", px: "$4.5", items: "center", justify: "space-between", shrink: 0, $md: { display: 'none' }, children: [_jsx(Round, { label: t("Open sidebar"), "data-slot": "bar-menu", onPress: onMenu, children: _jsx(Lines, {}) }), _jsx(XStack, { "data-slot": "bar-mode", ...GLASS, height: LINE, p: "$1", items: "center", children: _jsxs(ToggleGroup, { type: "single", "aria-label": t("App"), value: mode === 'chat' || mode === 'dev' ? mode : '', disableDeactivation: true, onValueChange: (v) => (v === 'chat' ? onChat() : v === 'dev' ? onDev() : undefined), children: [_jsx(Side, { value: "chat", children: t("Chat") }), _jsx(Side, { value: "dev", children: t("Dev") })] }) }), _jsx(Round, { label: fresh.label, "data-slot": "bar-new", onPress: fresh.onPress, children: _jsx(SquarePen, { size: 20, "aria-hidden": true }) })] }));
 }

package/dist/dev.js

@@ -44,7 +44,7 @@ import { showSettings, useOpen } from './open.js';
 const LINKS = {
     github: app('-/sync'),
     customize: app('-/customize'),
-    settings: app('-/settings'),
+    settings: '/settings',
     home: '/',
 };
 /** The builder's address for the plans. */
@@ -80,15 +80,23 @@ export function useDevHost() {
     const here = path(route(at(pathname)));
     const look = useLook();
     const { settings } = useOpen();
-    // The builder names every Settings section the rooms' pane does that it has;
-    // one it does not have opens Settings itself.
+    // Settings is top-level /settings; organization settings are at /settings/organization.
     useEffect(() => {
         if (!settings)
             return;
         showSettings(null);
-        const asked = route(`-/settings/${settings}`);
-        go(app(path(asked.kind === 'settings' ? asked : { kind: 'settings', section: 'general' })));
-    }, [settings]);
+        const s = settings.toLowerCase();
+        if (s.includes('member'))
+            router.push('/settings/organization/members');
+        else if (s.includes('billing'))
+            router.push('/settings/organization/billing');
+        else if (s.includes('usage'))
+            router.push('/settings/organization/usage');
+        else if (s.includes('org'))
+            router.push('/settings/organization');
+        else
+            router.push('/settings');
+    }, [settings, router]);
     // The token's claims change only when the token does: a sign-in, a refresh.
     const memberships = useMemo(() => orgs(), [accessToken]); // eslint-disable-line react-hooks/exhaustive-deps
     const scoped = useMemo(() => org(), [accessToken]); // eslint-disable-line react-hooks/exhaustive-deps

package/dist/index.js

@@ -10,4 +10,3 @@
  */
 export { configure, where, site, brand } from './where.js';
 export { Rooms, Look, useRooms, useLook, useOrg } from './host.js';
-// The bar over a focused page (the chooser, the way in, the way to pay): one for every host.

package/dist/lib/signout.d.ts

@@ -10,5 +10,10 @@ export declare const OUT = "/login?from=logout";
  * IAM's /v1/iam routes, IAM's session here ended, the local session cleared —
  * counted as logout_completed, and then /login?from=logout, where the person can
  * sign straight back in. IAM's own logout page is never visited.
+ *
+ * EVERY HANZO SITE AT ONCE (`everywhere`). hanzo.ai and platform.hanzo.ai sign in
+ * from one session, so leaving one of them must leave the other: IAM retires the
+ * person's grant to every application of this client's organization along with
+ * the session. A third-party app the person signed into keeps its own.
  */
 export declare function useSignOut(): () => Promise<void>;

package/dist/lib/signout.js

@@ -28,7 +28,13 @@ export const OUT = '/login?from=logout';
  * IAM's /v1/iam routes, IAM's session here ended, the local session cleared —
  * counted as logout_completed, and then /login?from=logout, where the person can
  * sign straight back in. IAM's own logout page is never visited.
+ *
+ * EVERY HANZO SITE AT ONCE (`everywhere`). hanzo.ai and platform.hanzo.ai sign in
+ * from one session, so leaving one of them must leave the other: IAM retires the
+ * person's grant to every application of this client's organization along with
+ * the session. A third-party app the person signed into keeps its own.
  */
 export function useSignOut() {
-    return useUiSignOut({ to: OUT, track });
+    // @ts-expect-error everywhere option added in @hanzo/ui / IAM shared sign-out
+    return useUiSignOut({ to: OUT, track, everywhere: true });
 }

package/dist/slide.d.ts

@@ -0,0 +1,24 @@
+/** The pane left in sight at the end edge while the menu is open, px: a thumb's 44 and room around it. */
+export declare const STRIP = 64;
+/** The menu's widest, px: a phone held sideways, or a small tablet, keeps the menu a menu. */
+export declare const REACH = 360;
+/** How far the pane slides, as CSS: the window less the strip, up to `REACH`. `%` is the window's width wherever it is read. */
+export declare const OPEN = "min(100% - 64px, 360px)";
+/** Shut (no menu), open, or sliding home before the menu goes. */
+export type State = 'shut' | 'open' | 'closing';
+/** Which way the end side is, as a sign on the x axis. */
+export declare const sign: (direction: string) => 1 | -1;
+/** px a finger moves before a drag is a drag, and not a tap or a scroll. */
+export declare const SLOP = 8;
+/**
+ * What a finger's first movement is: a pull along the line (`x`), a scroll
+ * (`y`), or nothing yet. Along the line has to win clearly: a list scrolls on a
+ * slant.
+ */
+export declare function axis(dx: number, dy: number): 'x' | 'y' | null;
+/** Where the pane stands while a finger holds it, px from home: where it was, moved along the line, never past home or open. */
+export declare function pull(from: number, dx: number, way: 1 | -1, reach: number): number;
+/** A flick, px per ms along the line: faster than this decides by its way, whatever the distance. */
+export declare const FLICK = 0.4;
+/** Whether a pane let go at `at` px from home, moving `speed` px/ms along the line, stays open. */
+export declare function settle(at: number, reach: number, speed: number): boolean;

package/dist/slide.js

@@ -0,0 +1,48 @@
+// The phone's drawer as numbers (Drawer.tsx draws it): how far the pane slides,
+// which way, and where a drag lets it go.
+//
+// The pane slides toward the END side of the line: right where text runs left to
+// right, left under `dir="rtl"`. A transform has no logical form, so its sign is
+// the one physical fact in the drawer, and it is read off the page
+// (`getComputedStyle(…).direction`), never assumed. Everything else is logical:
+// the menu stands at the start, the strip of pane left in sight at the end.
+//
+// A drag is measured ALONG the line: positive toward the end, whichever way the
+// line runs, so the same numbers close an LTR drawer pulled left and an RTL one
+// pulled right.
+/** The pane left in sight at the end edge while the menu is open, px: a thumb's 44 and room around it. */
+export const STRIP = 64;
+/** The menu's widest, px: a phone held sideways, or a small tablet, keeps the menu a menu. */
+export const REACH = 360;
+/** How far the pane slides, as CSS: the window less the strip, up to `REACH`. `%` is the window's width wherever it is read. */
+export const OPEN = `min(100% - ${STRIP}px, ${REACH}px)`;
+/** Which way the end side is, as a sign on the x axis. */
+export const sign = (direction) => (direction === 'rtl' ? -1 : 1);
+/** px a finger moves before a drag is a drag, and not a tap or a scroll. */
+export const SLOP = 8;
+/**
+ * What a finger's first movement is: a pull along the line (`x`), a scroll
+ * (`y`), or nothing yet. Along the line has to win clearly: a list scrolls on a
+ * slant.
+ */
+export function axis(dx, dy) {
+    const x = Math.abs(dx);
+    const y = Math.abs(dy);
+    if (x < SLOP && y < SLOP)
+        return null;
+    return x > y * 1.2 ? 'x' : 'y';
+}
+/** Where the pane stands while a finger holds it, px from home: where it was, moved along the line, never past home or open. */
+export function pull(from, dx, way, reach) {
+    return Math.min(reach, Math.max(0, from + dx * way));
+}
+/** A flick, px per ms along the line: faster than this decides by its way, whatever the distance. */
+export const FLICK = 0.4;
+/** Whether a pane let go at `at` px from home, moving `speed` px/ms along the line, stays open. */
+export function settle(at, reach, speed) {
+    if (speed <= -FLICK)
+        return false;
+    if (speed >= FLICK)
+        return true;
+    return at > reach / 2;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/rooms",
-  "version": "0.1.96",
+  "version": "0.1.98",
   "description": "The workspace rooms — Home, Chat, Inbox, Contacts, Meet, Cal, Drive, Board, Work, Bots — and the frame that holds them, once, for every Hanzo surface.",
   "type": "module",
   "main": "./dist/index.js",
@@ -53,6 +53,7 @@
     "@hanzo/composer": ">=0.2.0",
     "@hanzo/event": ">=0.3.56",
     "@hanzo/gui": "^8.3.5",
+    "@hanzo/i18n": ">=0.2.0",
     "@hanzo/iam": ">=0.21.35",
     "@hanzo/logo": ">=1.0.26",
     "@hanzo/studio": ">=0.1.0",
@@ -73,10 +74,11 @@
     "@hanzo/design": "0.5.34",
     "@hanzo/event": "0.3.56",
     "@hanzo/gui": "8.3.5",
+    "@hanzo/i18n": "0.2.0",
     "@hanzo/iam": "0.21.35",
     "@hanzo/logo": "1.0.26",
     "@hanzo/studio": "0.1.0",
-    "@hanzo/tabs": "github:hanzo-apps/tabs#af6f1e4c02a3ef7faa192a8310e193219fa5c1c5",
+    "@hanzo/tabs": "github:hanzo-inc/tabs",
     "@hanzo/ui": "8.29.0",
     "@hanzo/usage": "0.1.18",
     "@hanzo/voice": "0.1.19",
@@ -88,6 +90,7 @@
     "@types/node": "26.5.0",
     "@types/react": "19.2.18",
     "@types/react-dom": "19.2.7",
+    "happy-dom": "20.14.6",
     "lucide-react": "1.42.0",
     "react": "19.2.8",
     "react-dom": "19.2.8",