@hanzo/rooms 0.1.72 → 0.1.74

package/dist/Profile.d.ts

@@ -1,4 +0,0 @@
-export declare function Profile({ open, onClose }: {
-    open: boolean;
-    onClose: () => void;
-}): import("react").JSX.Element;

package/dist/Profile.js

@@ -1,67 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-// The reader's own profile, in the column beside the room.
-//
-// A WORKSPACE OPENS A PROFILE IN A PANEL, not a page. The page exists — it is
-// Settings (/settings), where the whole record is edited — but reaching it from a
-// conversation costs the conversation: the room, the sidebar and the rail all
-// go, and coming back is a navigation rather than a close. Slack, Teams and
-// every app shaped like them put this in the right column for that reason, and
-// so does the thread view that will share this slot.
-//
-// EVERY CONTROL DOES ITS VERB. Slack's panel carries "Set a status" and "View
-// as" and this one does not, because IAM stores no status and there is nobody
-// to view as. What is here is what there is: the picture can be changed, the
-// record can be edited, and the rest is read.
-import { useRooms } from './host.js';
-import { site } from './where.js';
-import { useRef, useState } from 'react';
-import { Camera, Mail, Phone, X } from 'lucide-react';
-import { Box, Text, View, XStack, YStack } from '@hanzo/ui';
-import { sheet } from '@hanzo/ui/glass';
-import { pane } from './ground.js';
-import { useAccount } from './lib/account.js';
-import { reach } from './lib/reach.js';
-import { mark } from './lib/mark.js';
-import { BAD } from './lib/mix.js';
-/** Slack's is 380 and the thread panel that shares this slot is the same. */
-const WIDTH = 380;
-const ACCOUNT = '/settings';
-export function Profile({ open, onClose }) {
-    const { Link } = useRooms();
-    const { user, updateUserProfile } = useAccount();
-    const picker = useRef(null);
-    const [busy, setBusy] = useState(false);
-    const [failed, setFailed] = useState(null);
-    if (!open || !user)
-        return null;
-    const pick = async (file) => {
-        if (!file)
-            return;
-        setBusy(true);
-        setFailed(null);
-        try {
-            await updateUserProfile({ avatar: await mark(file) });
-        }
-        catch (e) {
-            // In the panel rather than a toast: the picture is here, so the reason it
-            // did not change belongs here too.
-            setFailed(reach(e));
-        }
-        finally {
-            setBusy(false);
-        }
-    };
-    return (_jsxs(YStack, { ...pane(sheet(2).backgroundColor), width: WIDTH, maxW: "100%", shrink: 0, minH: 0, 
-        // A column on a laptop. On a phone the room is already the whole screen,
-        // so this covers it rather than squeezing it to nothing.
-        position: "absolute", t: 0, r: 0, b: 0, l: 0, z: "var(--z-panel)", $lg: { position: 'relative', z: 'var(--z-base)', l: 'auto' }, children: [_jsxs(XStack, { items: "center", px: "$4", py: "$3", gap: "$2", children: [_jsx(Text, { flex: 1, fontSize: "$5", fontWeight: "600", color: "$ink", children: "Profile" }), _jsx(Box, { render: "button", onClick: onClose, "aria-label": "Close profile", p: "$2", rounded: "$2", hoverStyle: { bg: '$hover' }, children: _jsx(X, { size: 16, "aria-hidden": true }) })] }), _jsxs(YStack, { flex: 1, minH: 0, overflowY: "auto", overflowX: "hidden", px: "$4", pb: "$5", gap: "$4", children: [_jsx("input", { ref: picker, type: "file", accept: "image/png,image/jpeg,image/gif,image/webp", hidden: true, onChange: (e) => {
-                            const file = e.target.files?.[0];
-                            e.target.value = '';
-                            void pick(file);
-                        } }), _jsxs(Box, { render: "button", onClick: () => {
-                            if (busy)
-                                return;
-                            picker.current?.click();
-                        }, "aria-label": "Change your picture", "aria-disabled": busy, width: "100%", aspectRatio: 1, rounded: "$5", overflow: "hidden", borderWidth: 1, borderColor: "$borderColor", bg: "$raised", position: "relative", children: [user.avatar ? (_jsx(View, { render: _jsx("img", { src: user.avatar, alt: "" }), width: "100%", height: "100%", objectFit: "cover", display: "block" })) : (_jsx(YStack, { width: "100%", height: "100%", items: "center", justify: "center", children: _jsx(Text, { fontSize: 72, fontWeight: "600", color: "$soft", children: (user.name?.trim()[0] ?? '?').toUpperCase() }) })), _jsxs(XStack, { position: "absolute", l: 0, r: 0, b: 0, items: "center", justify: "center", gap: "$2", py: "$2", bg: "$background", opacity: 0.85, children: [_jsx(Camera, { size: 14, "aria-hidden": true }), _jsx(Text, { fontSize: "$2", color: "$ink", children: busy ? 'Saving…' : user.avatar ? 'Change picture' : 'Add a picture' })] })] }), failed ? (_jsx(Text, { fontSize: "$2", color: BAD, children: failed })) : null, _jsxs(XStack, { items: "baseline", gap: "$3", children: [_jsx(Text, { flex: 1, fontSize: "$6", fontWeight: "600", color: "$ink", numberOfLines: 2, children: user.name }), _jsx(Link, { href: site(ACCOUNT), children: _jsx(Text, { fontSize: "$2", color: "$quiet", children: "Edit" }) })] }), user.bio ? (_jsx(Text, { fontSize: "$3", color: "$soft", children: user.bio })) : null, _jsxs(YStack, { gap: "$2", pt: "$3", borderTopWidth: 1, borderColor: "$edge", children: [_jsx(Text, { fontSize: "$2", fontWeight: "600", color: "$ink", children: "Contact information" }), _jsxs(XStack, { items: "center", gap: "$2", children: [_jsx(Mail, { size: 14, "aria-hidden": true }), _jsx(Text, { fontSize: "$3", color: "$soft", children: user.email })] }), user.phone ? (_jsxs(XStack, { items: "center", gap: "$2", children: [_jsx(Phone, { size: 14, "aria-hidden": true }), _jsx(Text, { fontSize: "$3", color: "$soft", children: user.phone })] })) : null] })] })] }));
-}

package/dist/Standing.d.ts

@@ -1,4 +0,0 @@
-export declare function Standing({ onPlans, onBilling }: {
-    onPlans: () => void;
-    onBilling: () => void;
-}): import("react").JSX.Element;

package/dist/Standing.js

@@ -1,16 +0,0 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-// The plan at the head of the account menu (Account.tsx): @hanzo/build's
-// `Meter` over the organization's standing, read when the menu opens. Its own
-// module so the menu's foot row costs a room's first screen nothing: it loads
-// with the menu.
-import { useMemo } from 'react';
-import { Meter, useStanding } from '@hanzo/build';
-import { api } from './lib/api.js';
-import { bearer, org } from './lib/session.js';
-export function Standing({ onPlans, onBilling }) {
-    const scoped = org();
-    const target = useMemo(() => ({ api: api(), token: bearer, org: scoped }), [scoped]);
-    const plan = useStanding(target, true);
-    return _jsx(Meter, { read: plan, onPlans: onPlans, onBilling: onBilling });
-}