@hashsome/ui 0.1.0

package/dist/theme/global-styles.d.ts

@@ -0,0 +1,5 @@
+import type { Interpolation, Theme } from '@emotion/react';
+/** The app-wide styles `HashsomeProvider` installs once: the page background/text/font, native
+ * controls following the theme, border-box sizing, and a low-specificity `button`/`input` reset (so a component's
+ * own class always wins over it). Global because the theme is an app property, not a per-page one. */
+export declare function globalStyles({ palette, typography }: Theme): Interpolation<Theme>;

package/dist/theme/global-styles.js

@@ -0,0 +1,44 @@
+/** The scrollbar's width (its track) and how much of that is the visible thumb. */
+const SCROLLBAR = 14;
+const THUMB = 4;
+function isDark(hex) {
+    const n = parseInt(hex.replace('#', '').slice(0, 6), 16);
+    return Number.isFinite(n) && ((n >> 16) & 255) + ((n >> 8) & 255) + (n & 255) < 384;
+}
+/** The app-wide styles `HashsomeProvider` installs once: the page background/text/font, native
+ * controls following the theme, border-box sizing, and a low-specificity `button`/`input` reset (so a component's
+ * own class always wins over it). Global because the theme is an app property, not a per-page one. */
+export function globalStyles({ palette, typography }) {
+    return {
+        ':root': {
+            // Native controls (date pickers' calendar glyph, scrollbars) follow the theme, not the OS.
+            colorScheme: isDark(palette.bg) ? 'dark' : 'light',
+        },
+        '*, *::before, *::after': { boxSizing: 'border-box' },
+        body: {
+            background: palette.bg,
+            color: palette.text,
+            fontFamily: typography.default.fontFamily,
+        },
+        button: { font: 'inherit', color: 'inherit' },
+        // Buttons and inputs start borderless; one that wants a border asks for it with the `border` prop.
+        'button, input': { border: 0 },
+        // Scrollbars: thin, no track, in the theme's colors. The track is wider than the thumb and the
+        // thumb has a transparent border around it, so there is air between the bar and the content.
+        // (Chrome and Safari take the `::-webkit-scrollbar` rules; Firefox, which has no equivalent for
+        // the gap, gets a thin bar from the standard properties. Setting those in Chrome would turn the
+        // webkit rules off, hence the `@supports`.)
+        '::-webkit-scrollbar': { width: SCROLLBAR, height: SCROLLBAR },
+        '::-webkit-scrollbar-track, ::-webkit-scrollbar-corner': { background: 'transparent' },
+        '::-webkit-scrollbar-thumb': {
+            background: palette.border,
+            backgroundClip: 'padding-box',
+            border: `${(SCROLLBAR - THUMB) / 2}px solid transparent`,
+            borderRadius: 999,
+        },
+        '::-webkit-scrollbar-thumb:hover': { background: palette.line, backgroundClip: 'padding-box' },
+        '@supports not selector(::-webkit-scrollbar)': {
+            '*': { scrollbarWidth: 'thin', scrollbarColor: `${palette.border} transparent` },
+        },
+    };
+}

package/dist/theme/global-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"global-styles.js","sourceRoot":"","sources":["../../src/theme/global-styles.ts"],"names":[],"mappings":"AAEA,mFAAmF;AACnF,MAAM,SAAS,GAAG,EAAE,CAAC;AACrB,MAAM,KAAK,GAAG,CAAC,CAAC;AAEhB,SAAS,MAAM,CAAC,GAAW;IACzB,MAAM,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IACzD,OAAO,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;AACtF,CAAC;AAED;;sGAEsG;AACtG,MAAM,UAAU,YAAY,CAAC,EAAE,OAAO,EAAE,UAAU,EAAS;IACzD,OAAO;QACL,OAAO,EAAE;YACP,2FAA2F;YAC3F,WAAW,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;SACnD;QACD,wBAAwB,EAAE,EAAE,SAAS,EAAE,YAAY,EAAE;QACrD,IAAI,EAAE;YACJ,UAAU,EAAE,OAAO,CAAC,EAAE;YACtB,KAAK,EAAE,OAAO,CAAC,IAAI;YACnB,UAAU,EAAE,UAAU,CAAC,OAAO,CAAC,UAAU;SAC1C;QACD,MAAM,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE;QAC7C,mGAAmG;QACnG,eAAe,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE;QAC9B,+FAA+F;QAC/F,6FAA6F;QAC7F,gGAAgG;QAChG,gGAAgG;QAChG,4CAA4C;QAC5C,qBAAqB,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE;QAC9D,uDAAuD,EAAE,EAAE,UAAU,EAAE,aAAa,EAAE;QACtF,2BAA2B,EAAE;YAC3B,UAAU,EAAE,OAAO,CAAC,MAAM;YAC1B,cAAc,EAAE,aAAa;YAC7B,MAAM,EAAE,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC,GAAG,CAAC,sBAAsB;YACxD,YAAY,EAAE,GAAG;SAClB;QACD,iCAAiC,EAAE,EAAE,UAAU,EAAE,OAAO,CAAC,IAAI,EAAE,cAAc,EAAE,aAAa,EAAE;QAC9F,6CAA6C,EAAE;YAC7C,GAAG,EAAE,EAAE,cAAc,EAAE,MAAM,EAAE,cAAc,EAAE,GAAG,OAAO,CAAC,MAAM,cAAc,EAAE;SACjF;KACF,CAAC;AACJ,CAAC"}

package/dist/theme/index.d.ts

@@ -0,0 +1,19 @@
+import type { ThemeConfig } from 'e-prim';
+import './tokens.ts';
+/** The Google Fonts family loaded and applied by default — see `HashsomeProviderProps.font` . Any other Google Fonts family name works the same way. */
+export declare const DEFAULT_FONT = "Inter";
+/** Builds a CSS `font-family` value for a chosen font, falling back to the system stack if it
+ * hasn't loaded yet (or fails to). */
+export declare function fontStack(family: string): string;
+/** The Google Fonts CSS endpoint for a family name, covering the weights `@hashsome/ui` actually uses
+ * (400/500/600/700). Spaces become `+` per Google Fonts' own URL convention. */
+export declare function googleFontHref(family: string): string;
+/** Returns `theme` with every `Typography` variant's font swapped to `family` (falling back to
+ * the system stack) — every variant inherits `typography.default`, so this is the one place that
+ * needs to change. Used by `HashsomeProvider` to apply `HashsomeProviderProps.font` at runtime, since the
+ * `darkTheme`/`lightTheme` exports below are built once with the compile-time default. */
+export declare function withFontFamily(theme: ThemeConfig, family: string): ThemeConfig;
+/** The converged "Ember" dark palette (default; the only theme currently wired up). */
+export declare const darkTheme: ThemeConfig;
+/** Ember's light counterpart, selected via `<HashsomeProvider theme="light">` (or `"system"`). */
+export declare const lightTheme: ThemeConfig;

package/dist/theme/index.js

@@ -0,0 +1,106 @@
+import './tokens.js';
+/** The Google Fonts family loaded and applied by default — see `HashsomeProviderProps.font` . Any other Google Fonts family name works the same way. */
+export const DEFAULT_FONT = 'Inter';
+const FALLBACK_FONTS = "system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif";
+/** Builds a CSS `font-family` value for a chosen font, falling back to the system stack if it
+ * hasn't loaded yet (or fails to). */
+export function fontStack(family) {
+    return `'${family}', ${FALLBACK_FONTS}`;
+}
+/** The Google Fonts CSS endpoint for a family name, covering the weights `@hashsome/ui` actually uses
+ * (400/500/600/700). Spaces become `+` per Google Fonts' own URL convention. */
+export function googleFontHref(family) {
+    return `https://fonts.googleapis.com/css2?family=${family.trim().replace(/\s+/g, '+')}:wght@400;500;600;700&display=swap`;
+}
+/** Returns `theme` with every `Typography` variant's font swapped to `family` (falling back to
+ * the system stack) — every variant inherits `typography.default`, so this is the one place that
+ * needs to change. Used by `HashsomeProvider` to apply `HashsomeProviderProps.font` at runtime, since the
+ * `darkTheme`/`lightTheme` exports below are built once with the compile-time default. */
+export function withFontFamily(theme, family) {
+    return {
+        ...theme,
+        typography: {
+            ...theme.typography,
+            default: { ...theme.typography.default, fontFamily: fontStack(family) },
+        },
+    };
+}
+const FONT_FAMILY = fontStack(DEFAULT_FONT);
+const shared = {
+    spacing: 4,
+    breakpoint: {},
+    zIndex: {
+        nav: 5,
+        dropdown: 10,
+        scrim: 20,
+        drawer: 21,
+        popover: 30,
+    },
+    shadow: {
+        drawer: '0 20px 48px rgba(0, 0, 0, 0.5)',
+    },
+    radius: {
+        full: '999px',
+        card: '25px',
+        drawer: '24px',
+        chrome: '14px',
+        row: '16px',
+        small: '9px',
+    },
+    border: { color: 'border', width: 1 },
+    typography: {
+        default: { fontFamily: FONT_FAMILY, fontSize: 16 },
+        label: { fontSize: 12, fontWeight: 500 },
+        secondary: { fontSize: 11 },
+        heading: { fontSize: 14, fontWeight: 600 },
+        body: { fontSize: 13, fontWeight: 400 },
+        bodyStrong: { fontSize: 13, fontWeight: 600 },
+        eyebrow: { fontSize: 11, fontWeight: 600, letterSpacing: '0.04em' },
+        stat: { fontSize: 20, fontWeight: 600 },
+        title: { fontSize: 16, fontWeight: 400 },
+        roomTitle: { fontSize: 14, fontWeight: 400 },
+        clock: { fontSize: 32, fontWeight: 400 },
+    },
+};
+// `ThemeProvider` calls e-prim's own `makeTheme()` internally on whatever it's given — passing
+// an already-`makeTheme()`-processed object here would run it twice, which silently corrupts the
+// derived `spacing()` function (every `gap`/`p`/`m`/`mb` prop then resolves to `NaN`). These stay
+// as plain `ThemeConfig` objects; `<ThemeProvider theme={darkTheme}>` does the one-time build.
+/** The converged "Ember" dark palette (default; the only theme currently wired up). */
+export const darkTheme = {
+    ...shared,
+    palette: {
+        bg: '#0B0A0D',
+        surface: '#17151A',
+        surfaceRaised: '#211E26',
+        text: '#F2EFEA',
+        textMuted: '#96908C',
+        accent: '#FF7A45',
+        accentText: '#FFFFFF',
+        onAccent: '#1B1B1F',
+        warm: '#E3B341',
+        danger: '#F2554A',
+        line: '#726C6A',
+        rail: '#141216',
+        border: 'rgba(255, 255, 255, 0.09)',
+    },
+};
+/** Ember's light counterpart, selected via `<HashsomeProvider theme="light">` (or `"system"`). */
+export const lightTheme = {
+    ...shared,
+    palette: {
+        bg: '#F4F1EB',
+        surface: '#FFFFFF',
+        surfaceRaised: '#EFEAE1',
+        text: '#211E26',
+        textMuted: '#8A8480',
+        accent: '#FF7A45',
+        accentText: '#FFFFFF',
+        onAccent: '#1B1B1F',
+        warm: '#E3B341',
+        danger: '#F2554A',
+        line: '#4A4540',
+        rail: '#EAE4DA',
+        border: 'rgba(0, 0, 0, 0.08)',
+    },
+};

package/dist/theme/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/theme/index.ts"],"names":[],"mappings":"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"}

package/dist/theme/overrides.d.ts

@@ -0,0 +1,28 @@
+import type { ThemeConfig, TypographyKey, TypographySpecs } from 'e-prim';
+import { type Density, type DensityTokens } from './density.ts';
+/** Changes to the built-in theme. Everything is optional and partial: name only what differs and
+ * the rest keeps its default. Only existing tokens can be changed. */
+export interface ThemeOverrides {
+    /** Colors for the light theme (`theme="light"`, or `"system"` while the OS is light). */
+    light?: {
+        palette?: Partial<ThemeConfig['palette']>;
+    };
+    /** Colors for the dark theme. Light and dark are separate, so one change never touches both. */
+    dark?: {
+        palette?: Partial<ThemeConfig['palette']>;
+    };
+    /** Tokens both themes share. */
+    shared?: {
+        radius?: Partial<ThemeConfig['radius']>;
+        shadow?: Partial<ThemeConfig['shadow']>;
+        zIndex?: Partial<ThemeConfig['zIndex']>;
+        /** By variant name (`label`, `body`, `stat`, ...); each takes only the fields it changes. */
+        typography?: Partial<Record<TypographyKey, TypographySpecs>>;
+    };
+    /** Sizes per density, e.g. `{ comfortable: { space: 16 } }`. */
+    density?: Partial<Record<Density, Partial<DensityTokens>>>;
+}
+/** `base` with `overrides` applied. Pure; neither argument is changed. */
+export declare function applyThemeOverrides(base: ThemeConfig, mode: 'light' | 'dark', overrides: ThemeOverrides | undefined): ThemeConfig;
+/** The density's tokens with `overrides` applied. */
+export declare function densityTokens(density: Density, overrides: ThemeOverrides | undefined): DensityTokens;

package/dist/theme/overrides.js

@@ -0,0 +1,24 @@
+import { DENSITY } from './density.js';
+/** `base` with `overrides` applied. Pure; neither argument is changed. */
+export function applyThemeOverrides(base, mode, overrides) {
+    if (!overrides) {
+        return base;
+    }
+    const shared = overrides.shared ?? {};
+    const typography = { ...base.typography };
+    for (const [variant, specs] of Object.entries(shared.typography ?? {})) {
+        typography[variant] = { ...typography[variant], ...specs };
+    }
+    return {
+        ...base,
+        radius: { ...base.radius, ...shared.radius },
+        shadow: { ...base.shadow, ...shared.shadow },
+        zIndex: { ...base.zIndex, ...shared.zIndex },
+        typography: typography,
+        palette: { ...base.palette, ...overrides[mode]?.palette },
+    };
+}
+/** The density's tokens with `overrides` applied. */
+export function densityTokens(density, overrides) {
+    return { ...DENSITY[density], ...overrides?.density?.[density] };
+}

package/dist/theme/overrides.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"overrides.js","sourceRoot":"","sources":["../../src/theme/overrides.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAoC,MAAM,cAAc,CAAC;AAyBzE,0EAA0E;AAC1E,MAAM,UAAU,mBAAmB,CACjC,IAAiB,EACjB,IAAsB,EACtB,SAAqC;IAErC,IAAI,CAAC,SAAS,EAAE,CAAC;QACf,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,MAAM,GAAG,SAAS,CAAC,MAAM,IAAI,EAAE,CAAC;IACtC,MAAM,UAAU,GAAG,EAAE,GAAG,IAAI,CAAC,UAAU,EAAqC,CAAC;IAC7E,KAAK,MAAM,CAAC,OAAO,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,UAAU,IAAI,EAAE,CAAC,EAAE,CAAC;QACvE,UAAU,CAAC,OAAO,CAAC,GAAG,EAAE,GAAG,UAAU,CAAC,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC;IAC7D,CAAC;IAED,OAAO;QACL,GAAG,IAAI;QACP,MAAM,EAAE,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE;QAC5C,MAAM,EAAE,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE;QAC5C,MAAM,EAAE,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE;QAC5C,UAAU,EAAE,UAAuC;QACnD,OAAO,EAAE,EAAE,GAAG,IAAI,CAAC,OAAO,EAAE,GAAG,SAAS,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE;KAC1D,CAAC;AACJ,CAAC;AAED,qDAAqD;AACrD,MAAM,UAAU,aAAa,CAC3B,OAAgB,EAChB,SAAqC;IAErC,OAAO,EAAE,GAAG,OAAO,CAAC,OAAO,CAAC,EAAE,GAAG,SAAS,EAAE,OAAO,EAAE,CAAC,OAAO,CAAC,EAAE,CAAC;AACnE,CAAC"}

package/dist/theme/tokens.d.ts

@@ -0,0 +1,78 @@
+import '@emotion/react';
+import type { TypographySpecs } from 'e-prim';
+import type { DensityTokens } from './density.ts';
+declare module '@emotion/react' {
+    interface Theme {
+        /** Set by `HashsomeProvider` from its `density` prop. */
+        density: DensityTokens;
+    }
+}
+declare module 'e-prim' {
+    interface TPalette {
+        bg: string;
+        surface: string;
+        surfaceRaised: string;
+        text: string;
+        textMuted: string;
+        accent: string;
+        accentText: string;
+        /** Text drawn directly on the `accent` color (a solid-accent tile, or a dimmable tile's fill) — near-black in both themes, since light text on orange is low contrast. */
+        onAccent: string;
+        warm: string;
+        danger: string;
+        line: string;
+        /** The left nav rail / bottom nav dock's background — a third near-black, distinct from
+         * `bg`/`surface`. */
+        rail: string;
+        /** A subtle 1px hairline (e.g. `EntityDrawer`'s own edge) — used via the theme's `border`
+         * config, so components say `border` (boolean) rather than carrying the color themselves. */
+        border: string;
+    }
+    interface TRadius {
+        full: string;
+        card: string;
+        drawer: string;
+        /** The nav rail/dock's rounded-square icon buttons. */
+        chrome: string;
+        /** A status/pill row inside a drawer (e.g. `LightTile`'s power row). */
+        row: string;
+        /** A small chrome control (e.g. `EntityDrawer`'s expand/close buttons). */
+        small: string;
+    }
+    interface TShadow {
+        /** `EntityDrawer`'s own drop shadow. */
+        drawer: string;
+    }
+    interface TZIndex {
+        scrim: number;
+        drawer: number;
+        /** The page navigation (`NavRail`), fixed over a dashboard. */
+        nav: number;
+        /** A menu or status panel that drops from a control (the top bar's), above the page. */
+        dropdown: number;
+        /** A floating panel anchored to a control (the date picker's calendar), above what it sits in. */
+        popover: number;
+    }
+    interface TTypography {
+        /** A tile's own name (`Tile`'s label). */
+        label: TypographySpecs;
+        /** Muted status/secondary text (a tile's status line, a drawer row's timestamp). */
+        secondary: TypographySpecs;
+        /** A drawer's header name. */
+        heading: TypographySpecs;
+        /** Regular body copy inside a drawer (e.g. a history entry's message). */
+        body: TypographySpecs;
+        /** Emphasized body copy (a history entry's actor name, a status row's own label). */
+        bodyStrong: TypographySpecs;
+        /** Small uppercase, letter-spaced section labels ("History", a chart's "Power" label). */
+        eyebrow: TypographySpecs;
+        /** A large numeric readout (the energy chart's current wattage). */
+        stat: TypographySpecs;
+        /** A prominent heading, bigger than `heading` (the `TopBar`'s own title/dashboard switcher). */
+        title: TypographySpecs;
+        /** A `RoomHeader`'s title (a room name) — quiet, muted, not a heading that competes with the tiles. */
+        roomTitle: TypographySpecs;
+        /** The `TopBar`'s own clock reading — large enough to read at a glance from across a room. */
+        clock: TypographySpecs;
+    }
+}

package/dist/theme/tokens.js

@@ -0,0 +1 @@
+import '@emotion/react';

package/dist/theme/tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.js","sourceRoot":"","sources":["../../src/theme/tokens.ts"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,CAAC"}

package/dist/theme/use-typography.d.ts

@@ -0,0 +1,4 @@
+import type { TypographyKey } from 'e-prim';
+/** A typography variant's resolved font size, for the rare consumer that can't render a
+ * `<Typography>` — e.g. an SVG chart's axis ticks. Everything else should use `<Typography>`. */
+export declare function useTypographySize(key: Exclude<TypographyKey, 'default'>): number;

package/dist/theme/use-typography.js

@@ -0,0 +1,9 @@
+import { useTheme } from '@emotion/react';
+/** A typography variant's resolved font size, for the rare consumer that can't render a
+ * `<Typography>` — e.g. an SVG chart's axis ticks. Everything else should use `<Typography>`. */
+export function useTypographySize(key) {
+    const { typography } = useTheme();
+    const specs = typography;
+    const size = specs[key]?.fontSize ?? typography.default.fontSize;
+    return typeof size === 'number' ? size : 16;
+}

package/dist/theme/use-typography.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-typography.js","sourceRoot":"","sources":["../../src/theme/use-typography.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAG1C;iGACiG;AACjG,MAAM,UAAU,iBAAiB,CAAC,GAAsC;IACtE,MAAM,EAAE,UAAU,EAAE,GAAG,QAAQ,EAAE,CAAC;IAClC,MAAM,KAAK,GAAG,UAA2E,CAAC;IAC1F,MAAM,IAAI,GAAG,KAAK,CAAC,GAAG,CAAC,EAAE,QAAQ,IAAI,UAAU,CAAC,OAAO,CAAC,QAAQ,CAAC;IACjE,OAAO,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;AAC9C,CAAC"}

package/dist/use-entity-history.d.ts

@@ -0,0 +1,12 @@
+import type { EntityRef, HistoryQuery, HistoryResult } from '@hashsome/core';
+export interface EntityHistoryState {
+    /** `undefined` until the first answer, and always for a backend that keeps no history. */
+    result: HistoryResult | undefined;
+    loading: boolean;
+}
+/**
+ * An entity's past values from the backend's own record, fetched when `ref` or `query` change and
+ * kept for a minute. A backend that keeps no history, or an error, leaves `result` undefined —
+ * history is an extra, so a component just shows nothing. Pass `undefined` to not ask at all.
+ */
+export declare function useEntityHistory(ref: EntityRef | undefined, query: HistoryQuery | undefined): EntityHistoryState;

package/dist/use-entity-history.js

@@ -0,0 +1,43 @@
+import { useEffect, useState } from 'react';
+import { useClient } from './provider.js';
+/** How long an answer is reused: opening a drawer twice, or switching a range back, does not ask again. */
+const FRESH_MS = 60_000;
+const cache = new WeakMap();
+function load(client, ref, query) {
+    const answers = cache.get(client) ?? new Map();
+    cache.set(client, answers);
+    const key = `${ref}|${query.range}|${query.bucket ?? ''}`;
+    const known = answers.get(key);
+    if (known && Date.now() - known.at < FRESH_MS) {
+        return known.result;
+    }
+    const result = client.history(ref, query);
+    answers.set(key, { at: Date.now(), result });
+    // A failed answer is not worth keeping: the next ask tries again.
+    result.catch(() => answers.delete(key));
+    return result;
+}
+/**
+ * An entity's past values from the backend's own record, fetched when `ref` or `query` change and
+ * kept for a minute. A backend that keeps no history, or an error, leaves `result` undefined —
+ * history is an extra, so a component just shows nothing. Pass `undefined` to not ask at all.
+ */
+export function useEntityHistory(ref, query) {
+    const client = useClient();
+    const range = query?.range;
+    const bucket = query?.bucket;
+    const [state, setState] = useState();
+    const key = ref && range ? `${ref}|${range}|${bucket ?? ''}` : undefined;
+    useEffect(() => {
+        if (!ref || !range || !key) {
+            return;
+        }
+        let current = true;
+        load(client, ref, { range, ...(bucket ? { bucket } : {}) }).then((result) => current && setState({ key, result }), () => current && setState({ key, result: undefined }));
+        return () => {
+            current = false;
+        };
+    }, [client, ref, range, bucket, key]);
+    const answered = state !== undefined && state.key === key;
+    return { result: answered ? state.result : undefined, loading: key !== undefined && !answered };
+}

package/dist/use-entity-history.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-entity-history.js","sourceRoot":"","sources":["../src/use-entity-history.ts"],"names":[],"mappings":"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"}

package/dist/use-media-browser.d.ts

@@ -0,0 +1,31 @@
+import type { BrowseItem, EntityRef } from '@hashsome/core';
+export interface MediaBrowserState {
+    /** What is listed now. */
+    items: BrowseItem[];
+    /** A name for the list: the opened folder's, or what was searched for. Absent on a tab. */
+    title: string | undefined;
+    loading: boolean;
+    error: string | undefined;
+    /** The top level's shelves (Playlists, Albums, ...), when it is a set of folders to switch
+     * between. They are shown as tabs instead of a list of folders to open, and stay in view while
+     * something inside a shelf is open or a search is showing. */
+    tabs: BrowseItem[] | undefined;
+    /** The open tab; none while a search is showing, since its results belong to no shelf. */
+    activeTab: string | undefined;
+    /** Goes to a shelf: leaves whatever was open inside one, and any search. */
+    selectTab(id: string): void;
+    /** Opened a folder (or searching), so there is somewhere to go back to. */
+    canGoBack: boolean;
+    searching: boolean;
+    open(item: BrowseItem): void;
+    back(): void;
+    /** What is typed in the search box. */
+    query: string;
+    /** Lists what matches `text`; an empty string goes back to where the browser was. */
+    search(text: string): void;
+}
+/** Walks a player's own media library through the runtime. The top level is read once: shelves
+ * become tabs (the first is open to begin with), anything else is a plain list. Below it, a stack
+ * of opened folders; apart from it, an optional search, and clearing the search returns to where
+ * the browser was. */
+export declare function useMediaBrowser(ref: EntityRef): MediaBrowserState;

package/dist/use-media-browser.js

@@ -0,0 +1,87 @@
+import { useCallback, useEffect, useState } from 'react';
+import { useClient } from './provider.js';
+/** A top level that is nothing but folders to look inside is a set of shelves, which read better
+ * as tabs than as a list that always looks the same. */
+const isShelves = (items) => items.length >= 2 && items.every((item) => item.expandable && !item.playable);
+const messageOf = (error) => (error instanceof Error ? error.message : String(error));
+/** Walks a player's own media library through the runtime. The top level is read once: shelves
+ * become tabs (the first is open to begin with), anything else is a plain list. Below it, a stack
+ * of opened folders; apart from it, an optional search, and clearing the search returns to where
+ * the browser was. */
+export function useMediaBrowser(ref) {
+    const client = useClient();
+    const [trail, setTrail] = useState([{}]);
+    const [text, setText] = useState('');
+    const [tab, setTab] = useState();
+    // Answers are kept with the request they answer, so a stale one is never shown for a new one.
+    const [top, setTop] = useState(null);
+    const [answer, setAnswer] = useState(null);
+    useEffect(() => {
+        let current = true;
+        client.browse(ref, {}).then((level) => current && setTop({ key: 'top', ...level }), (error) => current && setTop({ key: 'top', items: [], error: messageOf(error) }));
+        return () => {
+            current = false;
+        };
+    }, [client, ref]);
+    const needle = text.trim();
+    const searching = needle !== '';
+    const here = trail.at(-1) ?? {};
+    const atTop = trail.length === 1;
+    const tabs = top && !top.error && isShelves(top.items) ? top.items : undefined;
+    const selected = tabs ? (tabs.find((item) => item.id === tab) ?? tabs[0])?.id : undefined;
+    // What to ask for, if anything: a search, a folder, or the open tab. A top level that is not
+    // shelves is already in hand.
+    const path = atTop ? selected : here.path;
+    const key = searching ? `search:${needle}` : `path:${path ?? ''}`;
+    const result = answer?.key === key ? answer : null;
+    useEffect(() => {
+        const request = searching ? { search: needle } : path === undefined ? undefined : { path };
+        if (!request) {
+            return;
+        }
+        let current = true;
+        const timer = setTimeout(() => {
+            client.browse(ref, request).then((level) => current && setAnswer({ key, ...level }), (error) => current && setAnswer({ key, items: [], error: messageOf(error) }));
+        }, 
+        // Typing in the search box waits for a pause; opening a folder or a tab does not.
+        searching ? 300 : 0);
+        return () => {
+            current = false;
+            clearTimeout(timer);
+        };
+    }, [client, ref, key, searching, needle, path]);
+    const open = useCallback((item) => setTrail((levels) => [...levels, { path: item.id, title: item.title }]), []);
+    const selectTab = useCallback((id) => {
+        setTab(id);
+        setText('');
+        setTrail([{}]);
+    }, []);
+    const back = useCallback(() => {
+        if (text.trim() !== '') {
+            setText('');
+            return;
+        }
+        setTrail((levels) => (levels.length > 1 ? levels.slice(0, -1) : levels));
+    }, [text]);
+    // The plain top-level list, when there are no shelves to make tabs of.
+    const listing = !searching && atTop && !tabs ? top : result;
+    return {
+        items: listing?.items ?? [],
+        title: searching
+            ? (result?.title ?? `Results for “${needle}”`)
+            : atTop
+                ? undefined
+                : (result?.title ?? here.title),
+        loading: listing === null,
+        error: listing?.error,
+        tabs,
+        activeTab: searching ? undefined : selected,
+        selectTab,
+        canGoBack: searching || !atTop,
+        searching,
+        open,
+        back,
+        query: text,
+        search: setText,
+    };
+}

package/dist/use-media-browser.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-media-browser.js","sourceRoot":"","sources":["../src/use-media-browser.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,57 @@
+{
+  "name": "@hashsome/ui",
+  "version": "0.1.0",
+  "description": "Design system components and hooks",
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./package.json": "./package.json",
+    "./gallery": {
+      "types": "./dist/gallery/index.d.ts",
+      "default": "./dist/gallery/index.js"
+    }
+  },
+  "dependencies": {
+    "@emotion/react": "11.14.0",
+    "@hashsome/core": "0.1.0",
+    "e-prim": "2.0.1",
+    "motion": "13.4.5",
+    "react": "19.3.0",
+    "react-router": "8.4.0",
+    "recharts": "3.10.1"
+  },
+  "devDependencies": {
+    "@testing-library/react": "16.3.3",
+    "@testing-library/user-event": "14.6.7",
+    "@types/react": "19.3.0",
+    "@types/react-dom": "19.3.0",
+    "@vitejs/plugin-react": "6.1.1",
+    "jsdom": "30.1.1",
+    "react-dom": "19.3.0",
+    "vite": "8.3.1"
+  },
+  "license": "GPL-3.0-only",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/dstoyanoff/hashsome.git",
+    "directory": "packages/ui"
+  },
+  "homepage": "https://github.com/dstoyanoff/hashsome#readme",
+  "bugs": "https://github.com/dstoyanoff/hashsome/issues",
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "provenance": true
+  },
+  "scripts": {
+    "typecheck": "tsc --noEmit",
+    "docs": "vite",
+    "docs:build": "vite build",
+    "build": "tsc -b tsconfig.build.json"
+  }
+}