@withpotter/components 0.13.0-next.101

package/dist/shared/storage-meter.d.ts

@@ -0,0 +1,43 @@
+/**
+ * How much of this workspace's image storage is gone, shown where it is spent.
+ *
+ * It used to exist only on the billing page, which is the one place a merchant
+ * can do nothing about it.
+ *
+ * WHAT ACTUALLY COUNTS, read off `StorageMeterRepository`: storage is
+ * `SUM(file_size)` over exactly two tables — `gallery_items` and
+ * `digital_files`. Nothing else. The logo, product images, blog covers, the bio
+ * canvas, profile photos and OG images all upload through the media service,
+ * which increments `billing_usage.storage_bytes` — a column the read path
+ * deliberately ignores, with a comment saying it was initialised to zero and
+ * written by nothing.
+ *
+ * So the meter has exactly two homes, and they are the two tables: the gallery,
+ * and the digital files attached to a product. It is a cumulative footprint
+ * rather than a per-period counter, which is what makes deleting worth
+ * suggesting.
+ *
+ * Billing keeps storage only as MONEY — the overage line on the bill — because
+ * that is the form in which it is a billing question.
+ *
+ * Same query key as the billing page, so moving between the two hits the cache
+ * rather than asking twice.
+ */
+/**
+ * The numbers behind the meter, for anything that wants to show them in a
+ * smaller form (the Gallery's Storage button draws a ring). `ready` is false
+ * until the first reading arrives; no reading is not an empty one.
+ */
+export declare function useStorageUsage(): {
+    ready: boolean;
+    used: number;
+    limit: number;
+    pct: number;
+};
+export declare function StorageMeter({ className, showNote, stacked, }: {
+    className?: string;
+    /** Buy more under the meter at full width, for a narrow panel. */
+    stacked?: boolean;
+    /** The line saying what counts toward storage. Off where the surroundings say it. */
+    showNote?: boolean;
+}): import("react").JSX.Element | null;

package/dist/shared/storage-meter.js

@@ -0,0 +1,129 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { useMutation, useQuery } from "@tanstack/react-query";
+import { AllowanceMeter } from "@withpotter/ui-kit";
+import { Button } from "@withpotter/ui-kit/button";
+import { TOOLBAR_H } from "@withpotter/ui-kit/toolbar-parts";
+import { useToast } from "@withpotter/ui-kit/use-toast";
+import { formatBytes, asList } from "@withpotter/lib/utils";
+import { useAuth } from "@withpotter/lib/auth-context";
+import { useFormatCurrency } from "@withpotter/hooks/use-format-currency";
+import { useTenantCurrency } from "@withpotter/hooks/use-tenant-currency";
+import {
+  StoragePurchaseModal,
+  createBillingApi,
+  fetchStoragePacks,
+  STORAGE_BASELINE_BYTES
+} from "@withpotter/pages-core/dashboard/settings/billing/_components";
+function useStorageUsage() {
+  const { tenant } = useAuth();
+  const slug = tenant?.slug;
+  const { data: usage } = useQuery({
+    queryKey: ["billing-usage", slug],
+    queryFn: () => createBillingApi(slug).fetchCurrentUsage(),
+    enabled: !!slug
+  });
+  const { data: addOn } = useQuery({
+    queryKey: ["storage-add-on", slug],
+    queryFn: () => createBillingApi(slug).fetchStorageAddOn(),
+    enabled: !!slug
+  });
+  const used = usage?.storage?.usedBytes ?? 0;
+  const limit = STORAGE_BASELINE_BYTES + (addOn?.additionalBytes ?? 0);
+  const pct = limit > 0 ? Math.min(100, Math.round(used / limit * 100)) : 0;
+  return { ready: !!usage, used, limit, pct };
+}
+function StorageMeter({
+  className,
+  showNote = true,
+  stacked = false
+}) {
+  const { tenant } = useAuth();
+  const { toast } = useToast();
+  const formatCurrency = useFormatCurrency();
+  const currency = useTenantCurrency();
+  const slug = tenant?.slug;
+  const [buyOpen, setBuyOpen] = useState(false);
+  const { data: usage } = useQuery({
+    queryKey: ["billing-usage", slug],
+    queryFn: () => createBillingApi(slug).fetchCurrentUsage(),
+    enabled: !!slug
+  });
+  const { data: addOn } = useQuery({
+    queryKey: ["storage-add-on", slug],
+    queryFn: () => createBillingApi(slug).fetchStorageAddOn(),
+    enabled: !!slug
+  });
+  const { data: packsRaw } = useQuery({
+    queryKey: ["storage-packs"],
+    queryFn: fetchStoragePacks,
+    staleTime: 1e3 * 60 * 60
+    // packs rarely change
+  });
+  const purchase = useMutation({
+    mutationFn: ({ gb, currency: c }) => createBillingApi(slug).purchaseStorage(gb, c),
+    onSuccess: (data) => {
+      if (data.paymentUrl) window.location.href = data.paymentUrl;
+    },
+    onError: () => toast({
+      title: "Could not start the storage purchase",
+      variant: "destructive"
+    })
+  });
+  if (!usage) return null;
+  const used = usage.storage?.usedBytes ?? 0;
+  const limit = STORAGE_BASELINE_BYTES + (addOn?.additionalBytes ?? 0);
+  return /* @__PURE__ */ jsxs("div", { className, children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: stacked ? "flex flex-col gap-3" : "flex items-end justify-between gap-4",
+        children: [
+          /* @__PURE__ */ jsx(
+            AllowanceMeter,
+            {
+              className: "min-w-0 flex-1",
+              label: "Image storage",
+              used,
+              limit,
+              format: formatBytes,
+              overageNote: `Over by ${formatBytes(Math.max(0, used - limit))}, charged at the end of the month.`
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "secondary",
+              size: stacked ? "md" : "sm",
+              className: stacked ? `w-full ${TOOLBAR_H}` : "shrink-0",
+              onClick: () => setBuyOpen(true),
+              children: "Buy more"
+            }
+          )
+        ]
+      }
+    ),
+    showNote && /* @__PURE__ */ jsx("p", { className: "mt-2 text-xs text-[var(--text-muted)]", children: "Counts gallery photos and the files attached to digital products." }),
+    /* @__PURE__ */ jsx(
+      StoragePurchaseModal,
+      {
+        open: buyOpen,
+        onOpenChange: setBuyOpen,
+        packs: asList(packsRaw),
+        usedBytes: used,
+        addOnBytes: addOn?.additionalBytes ?? 0,
+        baselineBytes: STORAGE_BASELINE_BYTES,
+        isPending: purchase.isPending,
+        onPurchase: (gb, c) => purchase.mutate({ gb, currency: c }),
+        formatCurrency,
+        currency
+      }
+    )
+  ] });
+}
+export {
+  StorageMeter,
+  useStorageUsage
+};
+//# sourceMappingURL=storage-meter.js.map

package/dist/shared/storage-meter.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/shared/storage-meter.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { useMutation, useQuery } from '@tanstack/react-query';\nimport { AllowanceMeter } from '@withpotter/ui-kit';\nimport { Button } from '@withpotter/ui-kit/button';\nimport { TOOLBAR_H } from '@withpotter/ui-kit/toolbar-parts';\nimport { useToast } from '@withpotter/ui-kit/use-toast';\nimport { formatBytes, asList } from '@withpotter/lib/utils';\nimport { useAuth } from '@withpotter/lib/auth-context';\nimport { useFormatCurrency } from '@withpotter/hooks/use-format-currency';\nimport { useTenantCurrency } from '@withpotter/hooks/use-tenant-currency';\nimport {\n  StoragePurchaseModal,\n  createBillingApi,\n  fetchStoragePacks,\n  STORAGE_BASELINE_BYTES,\n  type StoragePack,\n} from '@withpotter/pages-core/dashboard/settings/billing/_components';\n\n/**\n * How much of this workspace's image storage is gone, shown where it is spent.\n *\n * It used to exist only on the billing page, which is the one place a merchant\n * can do nothing about it.\n *\n * WHAT ACTUALLY COUNTS, read off `StorageMeterRepository`: storage is\n * `SUM(file_size)` over exactly two tables — `gallery_items` and\n * `digital_files`. Nothing else. The logo, product images, blog covers, the bio\n * canvas, profile photos and OG images all upload through the media service,\n * which increments `billing_usage.storage_bytes` — a column the read path\n * deliberately ignores, with a comment saying it was initialised to zero and\n * written by nothing.\n *\n * So the meter has exactly two homes, and they are the two tables: the gallery,\n * and the digital files attached to a product. It is a cumulative footprint\n * rather than a per-period counter, which is what makes deleting worth\n * suggesting.\n *\n * Billing keeps storage only as MONEY — the overage line on the bill — because\n * that is the form in which it is a billing question.\n *\n * Same query key as the billing page, so moving between the two hits the cache\n * rather than asking twice.\n */\n/**\n * The numbers behind the meter, for anything that wants to show them in a\n * smaller form (the Gallery's Storage button draws a ring). `ready` is false\n * until the first reading arrives; no reading is not an empty one.\n */\nexport function useStorageUsage() {\n  const { tenant } = useAuth();\n  const slug = tenant?.slug;\n  const { data: usage } = useQuery({\n    queryKey: ['billing-usage', slug],\n    queryFn: () => createBillingApi(slug!).fetchCurrentUsage(),\n    enabled: !!slug,\n  });\n  const { data: addOn } = useQuery({\n    queryKey: ['storage-add-on', slug],\n    queryFn: () => createBillingApi(slug!).fetchStorageAddOn(),\n    enabled: !!slug,\n  });\n  const used = usage?.storage?.usedBytes ?? 0;\n  const limit = STORAGE_BASELINE_BYTES + (addOn?.additionalBytes ?? 0);\n  const pct = limit > 0 ? Math.min(100, Math.round((used / limit) * 100)) : 0;\n  return { ready: !!usage, used, limit, pct };\n}\n\nexport function StorageMeter({\n  className,\n  showNote = true,\n  stacked = false,\n}: {\n  className?: string;\n  /** Buy more under the meter at full width, for a narrow panel. */\n  stacked?: boolean;\n  /** The line saying what counts toward storage. Off where the surroundings say it. */\n  showNote?: boolean;\n}) {\n  const { tenant } = useAuth();\n  const { toast } = useToast();\n  const formatCurrency = useFormatCurrency();\n  const currency = useTenantCurrency();\n  const slug = tenant?.slug;\n  const [buyOpen, setBuyOpen] = useState(false);\n\n  const { data: usage } = useQuery({\n    queryKey: ['billing-usage', slug],\n    queryFn: () => createBillingApi(slug!).fetchCurrentUsage(),\n    enabled: !!slug,\n  });\n\n  const { data: addOn } = useQuery({\n    queryKey: ['storage-add-on', slug],\n    queryFn: () => createBillingApi(slug!).fetchStorageAddOn(),\n    enabled: !!slug,\n  });\n\n  const { data: packsRaw } = useQuery<StoragePack[]>({\n    queryKey: ['storage-packs'],\n    queryFn: fetchStoragePacks,\n    staleTime: 1000 * 60 * 60, // packs rarely change\n  });\n\n  /**\n   * Buying moved here with the meter.\n   *\n   * Leaving the purchase on the billing page would have made the meter a\n   * read-only complaint: see that you are nearly full on the screen where the\n   * images are, then go somewhere else to do anything about it. The mutation is\n   * three lines and it belongs beside the number it changes.\n   */\n  const purchase = useMutation({\n    mutationFn: ({ gb, currency: c }: { gb: number; currency: string }) =>\n      createBillingApi(slug!).purchaseStorage(gb, c),\n    onSuccess: (data) => {\n      if (data.paymentUrl) window.location.href = data.paymentUrl;\n    },\n    onError: () =>\n      toast({\n        title: 'Could not start the storage purchase',\n        variant: 'destructive',\n      }),\n  });\n\n  // No reading is not the same as an empty one. A meter that renders 0 of 500MB\n  // while the request is still out tells the merchant they have used nothing,\n  // which is the reassuring answer and not necessarily the true one.\n  if (!usage) return null;\n\n  const used = usage.storage?.usedBytes ?? 0;\n  const limit = STORAGE_BASELINE_BYTES + (addOn?.additionalBytes ?? 0);\n\n  return (\n    <div className={className}>\n      <div\n        className={\n          stacked\n            ? 'flex flex-col gap-3'\n            : 'flex items-end justify-between gap-4'\n        }\n      >\n        <AllowanceMeter\n          className=\"min-w-0 flex-1\"\n          label=\"Image storage\"\n          used={used}\n          limit={limit}\n          format={formatBytes}\n          overageNote={`Over by ${formatBytes(Math.max(0, used - limit))}, charged at the end of the month.`}\n        />\n        <Button\n          variant=\"secondary\"\n          size={stacked ? 'md' : 'sm'}\n          className={stacked ? `w-full ${TOOLBAR_H}` : 'shrink-0'}\n          onClick={() => setBuyOpen(true)}\n        >\n          Buy more\n        </Button>\n      </div>\n      {showNote && (\n        <p className=\"mt-2 text-xs text-[var(--text-muted)]\">\n          Counts gallery photos and the files attached to digital products.\n        </p>\n      )}\n\n      <StoragePurchaseModal\n        open={buyOpen}\n        onOpenChange={setBuyOpen}\n        packs={asList<StoragePack>(packsRaw)}\n        usedBytes={used}\n        addOnBytes={addOn?.additionalBytes ?? 0}\n        baselineBytes={STORAGE_BASELINE_BYTES}\n        isPending={purchase.isPending}\n        onPurchase={(gb, c) => purchase.mutate({ gb, currency: c })}\n        formatCurrency={formatCurrency}\n        currency={currency}\n      />\n    </div>\n  );\n}\n"],"mappings":";AAwIM,SAOE,KAPF;AAtIN,SAAS,gBAAgB;AACzB,SAAS,aAAa,gBAAgB;AACtC,SAAS,sBAAsB;AAC/B,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,gBAAgB;AACzB,SAAS,aAAa,cAAc;AACpC,SAAS,eAAe;AACxB,SAAS,yBAAyB;AAClC,SAAS,yBAAyB;AAClC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AAgCA,SAAS,kBAAkB;AAChC,QAAM,EAAE,OAAO,IAAI,QAAQ;AAC3B,QAAM,OAAO,QAAQ;AACrB,QAAM,EAAE,MAAM,MAAM,IAAI,SAAS;AAAA,IAC/B,UAAU,CAAC,iBAAiB,IAAI;AAAA,IAChC,SAAS,MAAM,iBAAiB,IAAK,EAAE,kBAAkB;AAAA,IACzD,SAAS,CAAC,CAAC;AAAA,EACb,CAAC;AACD,QAAM,EAAE,MAAM,MAAM,IAAI,SAAS;AAAA,IAC/B,UAAU,CAAC,kBAAkB,IAAI;AAAA,IACjC,SAAS,MAAM,iBAAiB,IAAK,EAAE,kBAAkB;AAAA,IACzD,SAAS,CAAC,CAAC;AAAA,EACb,CAAC;AACD,QAAM,OAAO,OAAO,SAAS,aAAa;AAC1C,QAAM,QAAQ,0BAA0B,OAAO,mBAAmB;AAClE,QAAM,MAAM,QAAQ,IAAI,KAAK,IAAI,KAAK,KAAK,MAAO,OAAO,QAAS,GAAG,CAAC,IAAI;AAC1E,SAAO,EAAE,OAAO,CAAC,CAAC,OAAO,MAAM,OAAO,IAAI;AAC5C;AAEO,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA,WAAW;AAAA,EACX,UAAU;AACZ,GAMG;AACD,QAAM,EAAE,OAAO,IAAI,QAAQ;AAC3B,QAAM,EAAE,MAAM,IAAI,SAAS;AAC3B,QAAM,iBAAiB,kBAAkB;AACzC,QAAM,WAAW,kBAAkB;AACnC,QAAM,OAAO,QAAQ;AACrB,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAE5C,QAAM,EAAE,MAAM,MAAM,IAAI,SAAS;AAAA,IAC/B,UAAU,CAAC,iBAAiB,IAAI;AAAA,IAChC,SAAS,MAAM,iBAAiB,IAAK,EAAE,kBAAkB;AAAA,IACzD,SAAS,CAAC,CAAC;AAAA,EACb,CAAC;AAED,QAAM,EAAE,MAAM,MAAM,IAAI,SAAS;AAAA,IAC/B,UAAU,CAAC,kBAAkB,IAAI;AAAA,IACjC,SAAS,MAAM,iBAAiB,IAAK,EAAE,kBAAkB;AAAA,IACzD,SAAS,CAAC,CAAC;AAAA,EACb,CAAC;AAED,QAAM,EAAE,MAAM,SAAS,IAAI,SAAwB;AAAA,IACjD,UAAU,CAAC,eAAe;AAAA,IAC1B,SAAS;AAAA,IACT,WAAW,MAAO,KAAK;AAAA;AAAA,EACzB,CAAC;AAUD,QAAM,WAAW,YAAY;AAAA,IAC3B,YAAY,CAAC,EAAE,IAAI,UAAU,EAAE,MAC7B,iBAAiB,IAAK,EAAE,gBAAgB,IAAI,CAAC;AAAA,IAC/C,WAAW,CAAC,SAAS;AACnB,UAAI,KAAK,WAAY,QAAO,SAAS,OAAO,KAAK;AAAA,IACnD;AAAA,IACA,SAAS,MACP,MAAM;AAAA,MACJ,OAAO;AAAA,MACP,SAAS;AAAA,IACX,CAAC;AAAA,EACL,CAAC;AAKD,MAAI,CAAC,MAAO,QAAO;AAEnB,QAAM,OAAO,MAAM,SAAS,aAAa;AACzC,QAAM,QAAQ,0BAA0B,OAAO,mBAAmB;AAElE,SACE,qBAAC,SAAI,WACH;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,WACE,UACI,wBACA;AAAA,QAGN;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAM;AAAA,cACN;AAAA,cACA;AAAA,cACA,QAAQ;AAAA,cACR,aAAa,WAAW,YAAY,KAAK,IAAI,GAAG,OAAO,KAAK,CAAC,CAAC;AAAA;AAAA,UAChE;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,MAAM,UAAU,OAAO;AAAA,cACvB,WAAW,UAAU,UAAU,SAAS,KAAK;AAAA,cAC7C,SAAS,MAAM,WAAW,IAAI;AAAA,cAC/B;AAAA;AAAA,UAED;AAAA;AAAA;AAAA,IACF;AAAA,IACC,YACC,oBAAC,OAAE,WAAU,yCAAwC,+EAErD;AAAA,IAGF;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN,cAAc;AAAA,QACd,OAAO,OAAoB,QAAQ;AAAA,QACnC,WAAW;AAAA,QACX,YAAY,OAAO,mBAAmB;AAAA,QACtC,eAAe;AAAA,QACf,WAAW,SAAS;AAAA,QACpB,YAAY,CAAC,IAAI,MAAM,SAAS,OAAO,EAAE,IAAI,UAAU,EAAE,CAAC;AAAA,QAC1D;AAAA,QACA;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/shell/account-menu-rows.d.ts

@@ -0,0 +1,33 @@
+import { type ComponentType, type ReactNode } from 'react';
+/**
+ * A row a host box adds to the person's account: in the Profile section of the
+ * settings window's Account panel (and the /dashboard/settings/profile page,
+ * which is how a phone reaches it). It is not listed in the account menu.
+ *
+ * In the Profile section it reads like the Authenticator app row: an icon,
+ * the label, the description under it, and a button saying `actionLabel`
+ * (or the label). With `doneLabel` set the row is finished: it shows that word
+ * as a quiet tag, with no button.
+ *
+ * The label is what the row opens, word for word.
+ */
+export type AccountMenuRow = {
+    id: string;
+    label: string;
+    description?: string;
+    actionLabel?: string;
+    doneLabel?: string;
+    icon?: ComponentType<{
+        width?: number;
+        height?: number;
+        className?: string;
+    }>;
+    onSelect: () => void;
+};
+/** Wrap the dashboard layout with this to add rows. Rows can change as the host learns more. */
+export declare function AccountMenuRowsProvider({ rows, children, }: {
+    rows: AccountMenuRow[];
+    children: ReactNode;
+}): import("react").JSX.Element;
+/** The host's rows, or none outside a provider (Boxspace itself adds none). */
+export declare function useAccountMenuRows(): AccountMenuRow[];

package/dist/shell/account-menu-rows.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import {
+  createContext,
+  useContext
+} from "react";
+const NONE = [];
+const Context = createContext(NONE);
+function AccountMenuRowsProvider({
+  rows,
+  children
+}) {
+  return /* @__PURE__ */ jsx(Context.Provider, { value: rows, children });
+}
+function useAccountMenuRows() {
+  return useContext(Context);
+}
+export {
+  AccountMenuRowsProvider,
+  useAccountMenuRows
+};
+//# sourceMappingURL=account-menu-rows.js.map

package/dist/shell/account-menu-rows.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/shell/account-menu-rows.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  useContext,\n  type ComponentType,\n  type ReactNode,\n} from 'react';\n\n/**\n * A row a host box adds to the person's account: in the Profile section of the\n * settings window's Account panel (and the /dashboard/settings/profile page,\n * which is how a phone reaches it). It is not listed in the account menu.\n *\n * In the Profile section it reads like the Authenticator app row: an icon,\n * the label, the description under it, and a button saying `actionLabel`\n * (or the label). With `doneLabel` set the row is finished: it shows that word\n * as a quiet tag, with no button.\n *\n * The label is what the row opens, word for word.\n */\nexport type AccountMenuRow = {\n  id: string;\n  label: string;\n  description?: string;\n  actionLabel?: string;\n  doneLabel?: string;\n  icon?: ComponentType<{ width?: number; height?: number; className?: string }>;\n  onSelect: () => void;\n};\n\nconst NONE: AccountMenuRow[] = [];\n\nconst Context = createContext<AccountMenuRow[]>(NONE);\n\n/** Wrap the dashboard layout with this to add rows. Rows can change as the host learns more. */\nexport function AccountMenuRowsProvider({\n  rows,\n  children,\n}: {\n  rows: AccountMenuRow[];\n  children: ReactNode;\n}) {\n  return <Context.Provider value={rows}>{children}</Context.Provider>;\n}\n\n/** The host's rows, or none outside a provider (Boxspace itself adds none). */\nexport function useAccountMenuRows(): AccountMenuRow[] {\n  return useContext(Context);\n}\n"],"mappings":";AA2CS;AAzCT;AAAA,EACE;AAAA,EACA;AAAA,OAGK;AAwBP,MAAM,OAAyB,CAAC;AAEhC,MAAM,UAAU,cAAgC,IAAI;AAG7C,SAAS,wBAAwB;AAAA,EACtC;AAAA,EACA;AACF,GAGG;AACD,SAAO,oBAAC,QAAQ,UAAR,EAAiB,OAAO,MAAO,UAAS;AAClD;AAGO,SAAS,qBAAuC;AACrD,SAAO,WAAW,OAAO;AAC3B;","names":[]}

package/dist/shell/bell-mark.d.ts

@@ -0,0 +1,14 @@
+/**
+ * The bell and its unread mark, as the Boxspace rail draws them: the icon
+ * always in view, and a small brand-coloured dot on its top-right corner when
+ * anything is unread. The parent button must be `relative`.
+ *
+ * No count on the bell: the pill it used to carry covered a 16px icon in a 28px
+ * button. The number goes in the button's label instead.
+ */
+/** The bell's accessible name, carrying the count the dot leaves out. */
+export declare function bellLabel(unreadCount: number): string;
+/** The bell icon and, when anything is unread, the dot on its corner. */
+export declare function BellMark({ unreadCount }: {
+    unreadCount: number;
+}): import("react").JSX.Element;

package/dist/shell/bell-mark.js

@@ -0,0 +1,22 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Bell } from "lucide-react";
+function bellLabel(unreadCount) {
+  return unreadCount > 0 ? `Notifications, ${unreadCount} unread` : "Notifications";
+}
+function BellMark({ unreadCount }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Bell, { width: 16, height: 16 }),
+    unreadCount > 0 && /* @__PURE__ */ jsx(
+      "span",
+      {
+        "aria-hidden": true,
+        className: "absolute right-0.5 top-0.5 size-2 rounded-full bg-[var(--brand-500)] ring-2 ring-[var(--bg-base)]"
+      }
+    )
+  ] });
+}
+export {
+  BellMark,
+  bellLabel
+};
+//# sourceMappingURL=bell-mark.js.map

package/dist/shell/bell-mark.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/shell/bell-mark.tsx"],"sourcesContent":["import { Bell } from 'lucide-react';\n\n/**\n * The bell and its unread mark, as the Boxspace rail draws them: the icon\n * always in view, and a small brand-coloured dot on its top-right corner when\n * anything is unread. The parent button must be `relative`.\n *\n * No count on the bell: the pill it used to carry covered a 16px icon in a 28px\n * button. The number goes in the button's label instead.\n */\n\n/** The bell's accessible name, carrying the count the dot leaves out. */\nexport function bellLabel(unreadCount: number): string {\n  return unreadCount > 0\n    ? `Notifications, ${unreadCount} unread`\n    : 'Notifications';\n}\n\n/** The bell icon and, when anything is unread, the dot on its corner. */\nexport function BellMark({ unreadCount }: { unreadCount: number }) {\n  return (\n    <>\n      <Bell width={16} height={16} />\n      {unreadCount > 0 && (\n        <span\n          aria-hidden\n          className=\"absolute right-0.5 top-0.5 size-2 rounded-full bg-[var(--brand-500)] ring-2 ring-[var(--bg-base)]\"\n        />\n      )}\n    </>\n  );\n}\n"],"mappings":"AAqBI,mBACE,KADF;AArBJ,SAAS,YAAY;AAYd,SAAS,UAAU,aAA6B;AACrD,SAAO,cAAc,IACjB,kBAAkB,WAAW,YAC7B;AACN;AAGO,SAAS,SAAS,EAAE,YAAY,GAA4B;AACjE,SACE,iCACE;AAAA,wBAAC,QAAK,OAAO,IAAI,QAAQ,IAAI;AAAA,IAC5B,cAAc,KACb;AAAA,MAAC;AAAA;AAAA,QACC,eAAW;AAAA,QACX,WAAU;AAAA;AAAA,IACZ;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/shell/foot-resources-menu.d.ts

@@ -0,0 +1,18 @@
+/**
+ * The Support button at the foot of the rail (a question mark with its name
+ * beside it; it was a bare grid icon), and the menu it opens: help, and what
+ * has changed in the app.
+ *
+ * Help and feedback are the two doors the account section of the workspace menu
+ * also carries. They are repeated here because a merchant who is stuck looks for
+ * help where the other utilities are, and one more route to the same room is
+ * cheap. Below them, the two newest release notes on a timeline and a way to
+ * the rest. Customize is not here: it has its own row in the nav.
+ *
+ * It opens upward from the button, since the button is the last thing in the
+ * rail, and takes the same skin, rows and arrow-key walk as the workspace menu
+ * (`.pv-psw-menu`, `.pv-psw-row`).
+ */
+export declare function FootResourcesMenu({ className }: {
+    className: string;
+}): import("react").JSX.Element;

package/dist/shell/foot-resources-menu.js

@@ -0,0 +1,215 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import Link from "next/link";
+import { AnimatePresence, motion } from "motion/react";
+import {
+  BookOpen,
+  CircleHelp,
+  Keyboard,
+  MessageSquarePlus,
+  PackageOpen
+} from "lucide-react";
+import { durations, eases, springs } from "@withpotter/lib/motion";
+import { RELEASES } from "@withpotter/lib/whats-new";
+import { openFeedback } from "@withpotter/components/feedback-widget";
+import { SwitcherScrim } from "./switcher-scrim";
+import { KeyboardShortcutsDialog } from "./keyboard-shortcuts-dialog";
+const RECENT = 2;
+const HIDE_WHATS_NEW = process.env.NEXT_PUBLIC_BOX_HIDE_WHATS_NEW === "true";
+function FootResourcesMenu({ className }) {
+  const [open, setOpen] = useState(false);
+  const [shortcutsOpen, setShortcutsOpen] = useState(false);
+  const [pos, setPos] = useState({ bottom: 0, left: 0 });
+  const btnRef = useRef(null);
+  const popRef = useRef(null);
+  const toggle = () => {
+    if (!open) {
+      const b = btnRef.current?.getBoundingClientRect();
+      if (b) setPos({ bottom: window.innerHeight - b.top + 6, left: b.left });
+    }
+    setOpen((v) => !v);
+  };
+  useEffect(() => {
+    if (!open) return;
+    const onDoc = (e) => {
+      if (popRef.current?.contains(e.target) || btnRef.current?.contains(e.target))
+        return;
+      setOpen(false);
+    };
+    const onKey = (e) => {
+      if (e.key !== "Escape") return;
+      setOpen(false);
+      btnRef.current?.focus();
+    };
+    const dismiss = () => setOpen(false);
+    document.addEventListener("mousedown", onDoc);
+    window.addEventListener("keydown", onKey);
+    window.addEventListener("resize", dismiss);
+    popRef.current?.focus();
+    return () => {
+      document.removeEventListener("mousedown", onDoc);
+      window.removeEventListener("keydown", onKey);
+      window.removeEventListener("resize", dismiss);
+    };
+  }, [open]);
+  const onMenuKey = (e) => {
+    if (e.key === "Tab") {
+      setOpen(false);
+      return;
+    }
+    if (e.key !== "ArrowDown" && e.key !== "ArrowUp") return;
+    e.preventDefault();
+    const items = Array.from(
+      popRef.current?.querySelectorAll("button, a[href]") ?? []
+    );
+    if (!items.length) return;
+    const at = items.indexOf(document.activeElement);
+    const step = e.key === "ArrowDown" ? 1 : -1;
+    items[(at + step + items.length) % items.length].focus();
+  };
+  const close = () => setOpen(false);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        ref: btnRef,
+        className,
+        title: "Support",
+        "aria-label": "Support",
+        "aria-haspopup": "menu",
+        "aria-expanded": open,
+        onClick: toggle,
+        children: [
+          /* @__PURE__ */ jsx(CircleHelp, { width: 15, height: 15, className: "shrink-0" }),
+          /* @__PURE__ */ jsx("span", { className: "lbl", children: "Support" })
+        ]
+      }
+    ),
+    typeof document !== "undefined" && createPortal(
+      /* @__PURE__ */ jsxs(AnimatePresence, { children: [
+        open && /* @__PURE__ */ jsx(SwitcherScrim, {}, "scrim"),
+        open && /* @__PURE__ */ jsxs(
+          motion.div,
+          {
+            ref: popRef,
+            className: "pv-psw-menu",
+            tabIndex: -1,
+            role: "menu",
+            "aria-label": "Support",
+            onKeyDown: onMenuKey,
+            initial: { opacity: 0, scale: 0.96, y: 4 },
+            animate: { opacity: 1, scale: 1, y: 0 },
+            transition: springs.gentle,
+            exit: {
+              opacity: 0,
+              scale: 0.98,
+              y: 2,
+              transition: { duration: durations.fast, ease: eases.out }
+            },
+            style: {
+              bottom: pos.bottom,
+              left: pos.left,
+              minWidth: 260,
+              transformOrigin: "bottom left"
+            },
+            children: [
+              /* @__PURE__ */ jsxs(
+                Link,
+                {
+                  href: "/dashboard/help",
+                  className: "pv-psw-row",
+                  role: "menuitem",
+                  onClick: close,
+                  children: [
+                    /* @__PURE__ */ jsx(BookOpen, { width: 15, height: 15 }),
+                    "Help centre"
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  className: "pv-psw-row",
+                  role: "menuitem",
+                  onClick: () => {
+                    close();
+                    openFeedback({ category: "suggestion" });
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(MessageSquarePlus, { width: 15, height: 15 }),
+                    "Send feedback"
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  className: "pv-psw-row",
+                  role: "menuitem",
+                  onClick: () => {
+                    close();
+                    setShortcutsOpen(true);
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(Keyboard, { width: 15, height: 15 }),
+                    "Keyboard shortcuts"
+                  ]
+                }
+              ),
+              !HIDE_WHATS_NEW && RELEASES.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx("div", { className: "pv-psw-sep" }),
+                /* @__PURE__ */ jsx("div", { className: "pv-psw-heading", children: "What\u2019s new" }),
+                /* @__PURE__ */ jsxs("div", { className: "pv-psw-tl", children: [
+                  RELEASES.slice(0, RECENT).map((r) => /* @__PURE__ */ jsxs(
+                    Link,
+                    {
+                      href: "/release-notes",
+                      className: "pv-psw-row",
+                      role: "menuitem",
+                      onClick: close,
+                      children: [
+                        /* @__PURE__ */ jsx("span", { className: "pv-psw-tl-slot", "aria-hidden": true, children: /* @__PURE__ */ jsx("span", { className: "pv-psw-tl-dot" }) }),
+                        /* @__PURE__ */ jsx("span", { className: "truncate", children: r.title })
+                      ]
+                    },
+                    r.id
+                  )),
+                  /* @__PURE__ */ jsxs(
+                    Link,
+                    {
+                      href: "/release-notes",
+                      className: "pv-psw-row",
+                      role: "menuitem",
+                      onClick: close,
+                      children: [
+                        /* @__PURE__ */ jsx("span", { className: "pv-psw-tl-slot", "aria-hidden": true, children: /* @__PURE__ */ jsx(PackageOpen, { width: 15, height: 15 }) }),
+                        "View all releases"
+                      ]
+                    }
+                  )
+                ] })
+              ] })
+            ]
+          }
+        )
+      ] }),
+      document.body
+    ),
+    /* @__PURE__ */ jsx(
+      KeyboardShortcutsDialog,
+      {
+        open: shortcutsOpen,
+        onClose: () => setShortcutsOpen(false)
+      }
+    )
+  ] });
+}
+export {
+  FootResourcesMenu
+};
+//# sourceMappingURL=foot-resources-menu.js.map

package/dist/shell/foot-resources-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/shell/foot-resources-menu.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport Link from 'next/link';\nimport { AnimatePresence, motion } from 'motion/react';\nimport {\n  BookOpen,\n  CircleHelp,\n  Keyboard,\n  MessageSquarePlus,\n  PackageOpen,\n} from 'lucide-react';\nimport { durations, eases, springs } from '@withpotter/lib/motion';\nimport { RELEASES } from '@withpotter/lib/whats-new';\nimport { openFeedback } from '@withpotter/components/feedback-widget';\nimport { SwitcherScrim } from './switcher-scrim';\nimport { KeyboardShortcutsDialog } from './keyboard-shortcuts-dialog';\n\n/** How many releases the menu names before it defers to the page. */\nconst RECENT = 2;\n\n/** Box switch: leaves the What's new section out of the Support menu. */\nconst HIDE_WHATS_NEW = process.env.NEXT_PUBLIC_BOX_HIDE_WHATS_NEW === 'true';\n\n/**\n * The Support button at the foot of the rail (a question mark with its name\n * beside it; it was a bare grid icon), and the menu it opens: help, and what\n * has changed in the app.\n *\n * Help and feedback are the two doors the account section of the workspace menu\n * also carries. They are repeated here because a merchant who is stuck looks for\n * help where the other utilities are, and one more route to the same room is\n * cheap. Below them, the two newest release notes on a timeline and a way to\n * the rest. Customize is not here: it has its own row in the nav.\n *\n * It opens upward from the button, since the button is the last thing in the\n * rail, and takes the same skin, rows and arrow-key walk as the workspace menu\n * (`.pv-psw-menu`, `.pv-psw-row`).\n */\nexport function FootResourcesMenu({ className }: { className: string }) {\n  const [open, setOpen] = useState(false);\n  const [shortcutsOpen, setShortcutsOpen] = useState(false);\n  const [pos, setPos] = useState({ bottom: 0, left: 0 });\n  const btnRef = useRef<HTMLButtonElement>(null);\n  const popRef = useRef<HTMLDivElement>(null);\n\n  const toggle = () => {\n    if (!open) {\n      const b = btnRef.current?.getBoundingClientRect();\n      if (b) setPos({ bottom: window.innerHeight - b.top + 6, left: b.left });\n    }\n    setOpen((v) => !v);\n  };\n\n  useEffect(() => {\n    if (!open) return;\n    const onDoc = (e: MouseEvent) => {\n      if (\n        popRef.current?.contains(e.target as Node) ||\n        btnRef.current?.contains(e.target as Node)\n      )\n        return;\n      setOpen(false);\n    };\n    const onKey = (e: KeyboardEvent) => {\n      if (e.key !== 'Escape') return;\n      setOpen(false);\n      btnRef.current?.focus();\n    };\n    const dismiss = () => setOpen(false);\n    document.addEventListener('mousedown', onDoc);\n    window.addEventListener('keydown', onKey);\n    window.addEventListener('resize', dismiss);\n    popRef.current?.focus();\n    return () => {\n      document.removeEventListener('mousedown', onDoc);\n      window.removeEventListener('keydown', onKey);\n      window.removeEventListener('resize', dismiss);\n    };\n  }, [open]);\n\n  const onMenuKey = (e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === 'Tab') {\n      setOpen(false);\n      return;\n    }\n    if (e.key !== 'ArrowDown' && e.key !== 'ArrowUp') return;\n    e.preventDefault();\n    const items = Array.from(\n      popRef.current?.querySelectorAll<HTMLElement>('button, a[href]') ?? [],\n    );\n    if (!items.length) return;\n    const at = items.indexOf(document.activeElement as HTMLElement);\n    const step = e.key === 'ArrowDown' ? 1 : -1;\n    items[(at + step + items.length) % items.length].focus();\n  };\n\n  const close = () => setOpen(false);\n\n  return (\n    <>\n      <button\n        type=\"button\"\n        ref={btnRef}\n        className={className}\n        title=\"Support\"\n        aria-label=\"Support\"\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        onClick={toggle}\n      >\n        <CircleHelp width={15} height={15} className=\"shrink-0\" />\n        <span className=\"lbl\">Support</span>\n      </button>\n\n      {typeof document !== 'undefined' &&\n        createPortal(\n          <AnimatePresence>\n            {open && <SwitcherScrim key=\"scrim\" />}\n            {open && (\n              <motion.div\n                ref={popRef}\n                className=\"pv-psw-menu\"\n                tabIndex={-1}\n                role=\"menu\"\n                aria-label=\"Support\"\n                onKeyDown={onMenuKey}\n                initial={{ opacity: 0, scale: 0.96, y: 4 }}\n                animate={{ opacity: 1, scale: 1, y: 0 }}\n                transition={springs.gentle}\n                exit={{\n                  opacity: 0,\n                  scale: 0.98,\n                  y: 2,\n                  transition: { duration: durations.fast, ease: eases.out },\n                }}\n                style={{\n                  bottom: pos.bottom,\n                  left: pos.left,\n                  minWidth: 260,\n                  transformOrigin: 'bottom left',\n                }}\n              >\n                <Link\n                  href=\"/dashboard/help\"\n                  className=\"pv-psw-row\"\n                  role=\"menuitem\"\n                  onClick={close}\n                >\n                  <BookOpen width={15} height={15} />\n                  Help centre\n                </Link>\n                <button\n                  type=\"button\"\n                  className=\"pv-psw-row\"\n                  role=\"menuitem\"\n                  onClick={() => {\n                    close();\n                    openFeedback({ category: 'suggestion' });\n                  }}\n                >\n                  <MessageSquarePlus width={15} height={15} />\n                  Send feedback\n                </button>\n                <button\n                  type=\"button\"\n                  className=\"pv-psw-row\"\n                  role=\"menuitem\"\n                  onClick={() => {\n                    close();\n                    setShortcutsOpen(true);\n                  }}\n                >\n                  <Keyboard width={15} height={15} />\n                  Keyboard shortcuts\n                </button>\n\n                {!HIDE_WHATS_NEW && RELEASES.length > 0 && (\n                  <>\n                    <div className=\"pv-psw-sep\" />\n                    <div className=\"pv-psw-heading\">What&rsquo;s new</div>\n                    {/* A timeline: a hairline runs through a dot per release\n                        and ends at the box that opens the rest. */}\n                    <div className=\"pv-psw-tl\">\n                      {RELEASES.slice(0, RECENT).map((r) => (\n                        <Link\n                          key={r.id}\n                          href=\"/release-notes\"\n                          className=\"pv-psw-row\"\n                          role=\"menuitem\"\n                          onClick={close}\n                        >\n                          <span className=\"pv-psw-tl-slot\" aria-hidden>\n                            <span className=\"pv-psw-tl-dot\" />\n                          </span>\n                          <span className=\"truncate\">{r.title}</span>\n                        </Link>\n                      ))}\n                      <Link\n                        href=\"/release-notes\"\n                        className=\"pv-psw-row\"\n                        role=\"menuitem\"\n                        onClick={close}\n                      >\n                        <span className=\"pv-psw-tl-slot\" aria-hidden>\n                          <PackageOpen width={15} height={15} />\n                        </span>\n                        View all releases\n                      </Link>\n                    </div>\n                  </>\n                )}\n              </motion.div>\n            )}\n          </AnimatePresence>,\n          document.body,\n        )}\n\n      <KeyboardShortcutsDialog\n        open={shortcutsOpen}\n        onClose={() => setShortcutsOpen(false)}\n      />\n    </>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/shell/foot-theme-menu.d.ts

@@ -0,0 +1,10 @@
+/**
+ * The look switch at the foot of the rail. One button showing the current look;
+ * pressing it opens the three looks beside it, in the same row, like an
+ * accordion, and choosing one closes it again. (It was a button that stepped
+ * through three looks without saying which came next.) System is not here: it
+ * lives in Settings → Preferences.
+ */
+export declare function FootThemeMenu({ className }: {
+    className: string;
+}): import("react").JSX.Element;