@payloadcms/ui 4.0.0-internal.e7d4ebc → 4.0.0-internal.ec73d44

package/dist/widgets/Activity/Tabs/PinnedDocuments/preferences.js

@@ -0,0 +1,62 @@
+import { documentKey, getDocumentReferences } from '../../utils/documents.js';
+export async function readPinnedPreferences({
+  url
+}) {
+  const response = await fetch(url, {
+    credentials: 'include'
+  });
+  if (!response.ok) {
+    throw new Error('Unable to read pins');
+  }
+  const preference = await response.json();
+  return getDocumentReferences({
+    value: preference.value
+  });
+}
+/** Serialize the read/modify/write operation across same-origin admin tabs. */
+export async function updatePinnedPreferences({
+  document,
+  shouldPin,
+  url
+}) {
+  const update = async () => {
+    const existing = await readPinnedPreferences({
+      url
+    });
+    if (shouldPin && existing.some(item => documentKey(item) === documentKey(document))) {
+      return;
+    }
+    const remaining = existing.filter(item => documentKey(item) !== documentKey(document));
+    const items = shouldPin ? [document, ...remaining] : remaining;
+    await savePinnedPreferences({
+      items,
+      url
+    });
+  };
+  if (typeof navigator !== 'undefined' && navigator.locks) {
+    await navigator.locks.request(`payload:pinned-documents:${url}`, update);
+  } else {
+    await update();
+  }
+}
+export async function savePinnedPreferences({
+  items,
+  url
+}) {
+  const response = await fetch(url, {
+    body: JSON.stringify({
+      value: {
+        items
+      }
+    }),
+    credentials: 'include',
+    headers: {
+      'Content-Type': 'application/json'
+    },
+    method: 'POST'
+  });
+  if (!response.ok) {
+    throw new Error('Unable to save pins');
+  }
+}
+//# sourceMappingURL=preferences.js.map

package/dist/widgets/Activity/Tabs/PinnedDocuments/preferences.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preferences.js","names":["documentKey","getDocumentReferences","readPinnedPreferences","url","response","fetch","credentials","ok","Error","preference","json","value","updatePinnedPreferences","document","shouldPin","update","existing","some","item","remaining","filter","items","savePinnedPreferences","navigator","locks","request","body","JSON","stringify","headers","method"],"sources":["../../../../../src/widgets/Activity/Tabs/PinnedDocuments/preferences.ts"],"sourcesContent":["import type { PinnedDocumentsPreferences } from 'payload'\n\nimport type { DocumentReference } from '../../utils/documents.js'\n\nimport { documentKey, getDocumentReferences } from '../../utils/documents.js'\n\nexport async function readPinnedPreferences({\n  url,\n}: {\n  url: string\n}): Promise<DocumentReference[]> {\n  const response = await fetch(url, { credentials: 'include' })\n\n  if (!response.ok) {\n    throw new Error('Unable to read pins')\n  }\n  const preference: { value?: unknown } = await response.json()\n\n  return getDocumentReferences({ value: preference.value })\n}\n\n/** Serialize the read/modify/write operation across same-origin admin tabs. */\nexport async function updatePinnedPreferences({\n  document,\n  shouldPin,\n  url,\n}: {\n  document: DocumentReference\n  shouldPin: boolean\n  url: string\n}): Promise<void> {\n  const update = async () => {\n    const existing = await readPinnedPreferences({ url })\n\n    if (shouldPin && existing.some((item) => documentKey(item) === documentKey(document))) {\n      return\n    }\n    const remaining = existing.filter((item) => documentKey(item) !== documentKey(document))\n    const items = shouldPin ? [document, ...remaining] : remaining\n\n    await savePinnedPreferences({ items, url })\n  }\n\n  if (typeof navigator !== 'undefined' && navigator.locks) {\n    await navigator.locks.request(`payload:pinned-documents:${url}`, update)\n  } else {\n    await update()\n  }\n}\n\nexport async function savePinnedPreferences({\n  items,\n  url,\n}: {\n  items: DocumentReference[]\n  url: string\n}): Promise<void> {\n  const response = await fetch(url, {\n    body: JSON.stringify({ value: { items } satisfies PinnedDocumentsPreferences }),\n    credentials: 'include',\n    headers: { 'Content-Type': 'application/json' },\n    method: 'POST',\n  })\n\n  if (!response.ok) {\n    throw new Error('Unable to save pins')\n  }\n}\n"],"mappings":"AAIA,SAASA,WAAW,EAAEC,qBAAqB,QAAQ;AAEnD,OAAO,eAAeC,sBAAsB;EAC1CC;AAAG,CAGJ;EACC,MAAMC,QAAA,GAAW,MAAMC,KAAA,CAAMF,GAAA,EAAK;IAAEG,WAAA,EAAa;EAAU;EAE3D,IAAI,CAACF,QAAA,CAASG,EAAE,EAAE;IAChB,MAAM,IAAIC,KAAA,CAAM;EAClB;EACA,MAAMC,UAAA,GAAkC,MAAML,QAAA,CAASM,IAAI;EAE3D,OAAOT,qBAAA,CAAsB;IAAEU,KAAA,EAAOF,UAAA,CAAWE;EAAM;AACzD;AAEA;AACA,OAAO,eAAeC,wBAAwB;EAC5CC,QAAQ;EACRC,SAAS;EACTX;AAAG,CAKJ;EACC,MAAMY,MAAA,GAAS,MAAAA,CAAA;IACb,MAAMC,QAAA,GAAW,MAAMd,qBAAA,CAAsB;MAAEC;IAAI;IAEnD,IAAIW,SAAA,IAAaE,QAAA,CAASC,IAAI,CAAEC,IAAA,IAASlB,WAAA,CAAYkB,IAAA,MAAUlB,WAAA,CAAYa,QAAA,IAAY;MACrF;IACF;IACA,MAAMM,SAAA,GAAYH,QAAA,CAASI,MAAM,CAAEF,IAAA,IAASlB,WAAA,CAAYkB,IAAA,MAAUlB,WAAA,CAAYa,QAAA;IAC9E,MAAMQ,KAAA,GAAQP,SAAA,GAAY,CAACD,QAAA,E,GAAaM,SAAA,CAAU,GAAGA,SAAA;IAErD,MAAMG,qBAAA,CAAsB;MAAED,KAAA;MAAOlB;IAAI;EAC3C;EAEA,IAAI,OAAOoB,SAAA,KAAc,eAAeA,SAAA,CAAUC,KAAK,EAAE;IACvD,MAAMD,SAAA,CAAUC,KAAK,CAACC,OAAO,CAAC,4BAA4BtB,GAAA,EAAK,EAAEY,MAAA;EACnE,OAAO;IACL,MAAMA,MAAA;EACR;AACF;AAEA,OAAO,eAAeO,sBAAsB;EAC1CD,KAAK;EACLlB;AAAG,CAIJ;EACC,MAAMC,QAAA,GAAW,MAAMC,KAAA,CAAMF,GAAA,EAAK;IAChCuB,IAAA,EAAMC,IAAA,CAAKC,SAAS,CAAC;MAAEjB,KAAA,EAAO;QAAEU;MAAM;IAAuC;IAC7Ef,WAAA,EAAa;IACbuB,OAAA,EAAS;MAAE,gBAAgB;IAAmB;IAC9CC,MAAA,EAAQ;EACV;EAEA,IAAI,CAAC1B,QAAA,CAASG,EAAE,EAAE;IAChB,MAAM,IAAIC,KAAA,CAAM;EAClB;AACF","ignoreList":[]}

package/dist/widgets/Activity/Tabs/PinnedDocuments/usePinnedDocuments.d.ts

@@ -0,0 +1,39 @@
+import type { DocumentReference } from '../../utils/documents.js';
+import type { ActivityDocumentsPage } from '../../utils/getActivityWidgetDocs.js';
+/** Pinned documents plus saving pin changes, with optimistic removal. */
+export declare function usePinnedDocuments({ canAddPin, initialPage, isActive, offset, onFocusTab, onPinAdded, pageSize, pinsURL, }: {
+    canAddPin: boolean;
+    initialPage?: ActivityDocumentsPage;
+    isActive: boolean;
+    offset: number;
+    onFocusTab: () => void;
+    onPinAdded: () => void;
+    pageSize: number;
+    pinsURL: string;
+}): {
+    currentPage: number;
+    items: import("../../types.js").ActivityDocument[];
+    missingBatches: number[];
+    start: number;
+    totalDocs: number;
+    totalPages: number;
+    hasLoadError: boolean;
+    isBusy: boolean;
+    refresh: () => void;
+    removeDocument: ({ document }: {
+        document: DocumentReference;
+    }) => () => void;
+    retry: () => void;
+    shouldShowLoading: boolean;
+    hasSaveError: boolean;
+    isSaving: boolean;
+    onAdd: ({ document }: {
+        document: DocumentReference;
+    }) => Promise<void>;
+    onPickerError: () => void;
+    onRemove: ({ document }: {
+        document: DocumentReference;
+    }) => Promise<void>;
+};
+export type PinnedDocumentsController = ReturnType<typeof usePinnedDocuments>;
+//# sourceMappingURL=usePinnedDocuments.d.ts.map

package/dist/widgets/Activity/Tabs/PinnedDocuments/usePinnedDocuments.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePinnedDocuments.d.ts","sourceRoot":"","sources":["../../../../../src/widgets/Activity/Tabs/PinnedDocuments/usePinnedDocuments.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAA;AAKjF,yEAAyE;AACzE,wBAAgB,kBAAkB,CAAC,EACjC,SAAS,EACT,WAAW,EACX,QAAQ,EACR,MAAM,EACN,UAAU,EACV,UAAU,EACV,QAAQ,EACR,OAAO,GACR,EAAE;IACD,SAAS,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,qBAAqB,CAAA;IACnC,QAAQ,EAAE,OAAO,CAAA;IACjB,MAAM,EAAE,MAAM,CAAA;IACd,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,QAAQ,EAAE,MAAM,CAAA;IAChB,OAAO,EAAE,MAAM,CAAA;CAChB;;;;;;;;;;;;;;;;;0BAwDyB;QAAE,QAAQ,EAAE,iBAAiB,CAAA;KAAE;;6BAG5B;QAAE,QAAQ,EAAE,iBAAiB,CAAA;KAAE;EAG3D;AAED,MAAM,MAAM,yBAAyB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAA"}

package/dist/widgets/Activity/Tabs/PinnedDocuments/usePinnedDocuments.js

@@ -0,0 +1,83 @@
+import { useState } from 'react';
+import { useActivityDocuments } from '../../utils/useActivityDocuments.js';
+import { updatePinnedPreferences } from './preferences.js';
+/** Pinned documents plus saving pin changes, with optimistic removal. */
+export function usePinnedDocuments({
+  canAddPin,
+  initialPage,
+  isActive,
+  offset,
+  onFocusTab,
+  onPinAdded,
+  pageSize,
+  pinsURL
+}) {
+  const [saveStatus, setSaveStatus] = useState('idle');
+  const [previousInitialPage, setPreviousInitialPage] = useState(initialPage);
+  const isSaving = saveStatus === 'saving';
+  const documents = useActivityDocuments({
+    type: 'pinned',
+    hasPinPlaceholder: canAddPin,
+    initialPage,
+    isActive,
+    isPaused: isSaving,
+    offset,
+    pageSize
+  });
+  if (previousInitialPage !== initialPage) {
+    setPreviousInitialPage(initialPage);
+    setSaveStatus(current => current === 'error' ? 'idle' : current);
+  }
+  const savePin = async ({
+    document,
+    shouldPin
+  }) => {
+    if (isSaving || documents.isBusy) {
+      return;
+    }
+    const restore = shouldPin ? undefined : documents.removeDocument({
+      document
+    });
+    setSaveStatus('saving');
+    if (!shouldPin) {
+      // The removed card held focus.
+      onFocusTab();
+    }
+    try {
+      await updatePinnedPreferences({
+        document,
+        shouldPin,
+        url: pinsURL
+      });
+      setSaveStatus('idle');
+      documents.refresh();
+      if (shouldPin) {
+        onPinAdded();
+      }
+    } catch {
+      restore?.();
+      setSaveStatus('error');
+    } finally {
+      onFocusTab();
+    }
+  };
+  return {
+    ...documents,
+    hasSaveError: saveStatus === 'error',
+    isSaving,
+    onAdd: ({
+      document
+    }) => savePin({
+      document,
+      shouldPin: true
+    }),
+    onPickerError: () => setSaveStatus('error'),
+    onRemove: ({
+      document
+    }) => savePin({
+      document,
+      shouldPin: false
+    })
+  };
+}
+//# sourceMappingURL=usePinnedDocuments.js.map

package/dist/widgets/Activity/Tabs/PinnedDocuments/usePinnedDocuments.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePinnedDocuments.js","names":["useState","useActivityDocuments","updatePinnedPreferences","usePinnedDocuments","canAddPin","initialPage","isActive","offset","onFocusTab","onPinAdded","pageSize","pinsURL","saveStatus","setSaveStatus","previousInitialPage","setPreviousInitialPage","isSaving","documents","type","hasPinPlaceholder","isPaused","current","savePin","document","shouldPin","isBusy","restore","undefined","removeDocument","url","refresh","hasSaveError","onAdd","onPickerError","onRemove"],"sources":["../../../../../src/widgets/Activity/Tabs/PinnedDocuments/usePinnedDocuments.ts"],"sourcesContent":["import { useState } from 'react'\n\nimport type { DocumentReference } from '../../utils/documents.js'\nimport type { ActivityDocumentsPage } from '../../utils/getActivityWidgetDocs.js'\n\nimport { useActivityDocuments } from '../../utils/useActivityDocuments.js'\nimport { updatePinnedPreferences } from './preferences.js'\n\n/** Pinned documents plus saving pin changes, with optimistic removal. */\nexport function usePinnedDocuments({\n  canAddPin,\n  initialPage,\n  isActive,\n  offset,\n  onFocusTab,\n  onPinAdded,\n  pageSize,\n  pinsURL,\n}: {\n  canAddPin: boolean\n  initialPage?: ActivityDocumentsPage\n  isActive: boolean\n  offset: number\n  onFocusTab: () => void\n  onPinAdded: () => void\n  pageSize: number\n  pinsURL: string\n}) {\n  const [saveStatus, setSaveStatus] = useState<'error' | 'idle' | 'saving'>('idle')\n  const [previousInitialPage, setPreviousInitialPage] = useState(initialPage)\n  const isSaving = saveStatus === 'saving'\n  const documents = useActivityDocuments({\n    type: 'pinned',\n    hasPinPlaceholder: canAddPin,\n    initialPage,\n    isActive,\n    isPaused: isSaving,\n    offset,\n    pageSize,\n  })\n\n  if (previousInitialPage !== initialPage) {\n    setPreviousInitialPage(initialPage)\n    setSaveStatus((current) => (current === 'error' ? 'idle' : current))\n  }\n\n  const savePin = async ({\n    document,\n    shouldPin,\n  }: {\n    document: DocumentReference\n    shouldPin: boolean\n  }) => {\n    if (isSaving || documents.isBusy) {\n      return\n    }\n\n    const restore = shouldPin ? undefined : documents.removeDocument({ document })\n\n    setSaveStatus('saving')\n    if (!shouldPin) {\n      // The removed card held focus.\n      onFocusTab()\n    }\n    try {\n      await updatePinnedPreferences({ document, shouldPin, url: pinsURL })\n      setSaveStatus('idle')\n      documents.refresh()\n      if (shouldPin) {\n        onPinAdded()\n      }\n    } catch {\n      restore?.()\n      setSaveStatus('error')\n    } finally {\n      onFocusTab()\n    }\n  }\n\n  return {\n    ...documents,\n    hasSaveError: saveStatus === 'error',\n    isSaving,\n    onAdd: ({ document }: { document: DocumentReference }) =>\n      savePin({ document, shouldPin: true }),\n    onPickerError: () => setSaveStatus('error'),\n    onRemove: ({ document }: { document: DocumentReference }) =>\n      savePin({ document, shouldPin: false }),\n  }\n}\n\nexport type PinnedDocumentsController = ReturnType<typeof usePinnedDocuments>\n"],"mappings":"AAAA,SAASA,QAAQ,QAAQ;AAKzB,SAASC,oBAAoB,QAAQ;AACrC,SAASC,uBAAuB,QAAQ;AAExC;AACA,OAAO,SAASC,mBAAmB;EACjCC,SAAS;EACTC,WAAW;EACXC,QAAQ;EACRC,MAAM;EACNC,UAAU;EACVC,UAAU;EACVC,QAAQ;EACRC;AAAO,CAUR;EACC,MAAM,CAACC,UAAA,EAAYC,aAAA,CAAc,GAAGb,QAAA,CAAsC;EAC1E,MAAM,CAACc,mBAAA,EAAqBC,sBAAA,CAAuB,GAAGf,QAAA,CAASK,WAAA;EAC/D,MAAMW,QAAA,GAAWJ,UAAA,KAAe;EAChC,MAAMK,SAAA,GAAYhB,oBAAA,CAAqB;IACrCiB,IAAA,EAAM;IACNC,iBAAA,EAAmBf,SAAA;IACnBC,WAAA;IACAC,QAAA;IACAc,QAAA,EAAUJ,QAAA;IACVT,MAAA;IACAG;EACF;EAEA,IAAII,mBAAA,KAAwBT,WAAA,EAAa;IACvCU,sBAAA,CAAuBV,WAAA;IACvBQ,aAAA,CAAeQ,OAAA,IAAaA,OAAA,KAAY,UAAU,SAASA,OAAA;EAC7D;EAEA,MAAMC,OAAA,GAAU,MAAAA,CAAO;IACrBC,QAAQ;IACRC;EAAS,CAIV;IACC,IAAIR,QAAA,IAAYC,SAAA,CAAUQ,MAAM,EAAE;MAChC;IACF;IAEA,MAAMC,OAAA,GAAUF,SAAA,GAAYG,SAAA,GAAYV,SAAA,CAAUW,cAAc,CAAC;MAAEL;IAAS;IAE5EV,aAAA,CAAc;IACd,IAAI,CAACW,SAAA,EAAW;MACd;MACAhB,UAAA;IACF;IACA,IAAI;MACF,MAAMN,uBAAA,CAAwB;QAAEqB,QAAA;QAAUC,SAAA;QAAWK,GAAA,EAAKlB;MAAQ;MAClEE,aAAA,CAAc;MACdI,SAAA,CAAUa,OAAO;MACjB,IAAIN,SAAA,EAAW;QACbf,UAAA;MACF;IACF,EAAE,MAAM;MACNiB,OAAA;MACAb,aAAA,CAAc;IAChB,UAAU;MACRL,UAAA;IACF;EACF;EAEA,OAAO;IACL,GAAGS,SAAS;IACZc,YAAA,EAAcnB,UAAA,KAAe;IAC7BI,QAAA;IACAgB,KAAA,EAAOA,CAAC;MAAET;IAAQ,CAAmC,KACnDD,OAAA,CAAQ;MAAEC,QAAA;MAAUC,SAAA,EAAW;IAAK;IACtCS,aAAA,EAAeA,CAAA,KAAMpB,aAAA,CAAc;IACnCqB,QAAA,EAAUA,CAAC;MAAEX;IAAQ,CAAmC,KACtDD,OAAA,CAAQ;MAAEC,QAAA;MAAUC,SAAA,EAAW;IAAM;EACzC;AACF","ignoreList":[]}

package/dist/widgets/Activity/Tabs/RecentDocuments/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { Labels } from '../../types.js';
+import type { DocumentsController } from '../../utils/useActivityDocuments.js';
+export declare function RecentDocuments({ documents, labels, listID, }: {
+    documents: DocumentsController;
+    labels: Labels;
+    listID: string;
+}): React.JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/widgets/Activity/Tabs/RecentDocuments/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/widgets/Activity/Tabs/RecentDocuments/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qCAAqC,CAAA;AAK9E,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,MAAM,EACN,MAAM,GACP,EAAE;IACD,SAAS,EAAE,mBAAmB,CAAA;IAC9B,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,MAAM,CAAA;CACf,qBAcA"}

package/dist/widgets/Activity/Tabs/RecentDocuments/index.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { DocumentList } from '../../components/DocumentList/index.js';
+import { EmptyState } from '../../components/EmptyState/index.js';
+export function RecentDocuments({
+  documents,
+  labels,
+  listID
+}) {
+  if (!documents.items) {
+    return null;
+  }
+  return documents.items.length ? /*#__PURE__*/_jsx(DocumentList, {
+    id: listID,
+    items: documents.items,
+    label: labels.recents
+  }) : /*#__PURE__*/_jsx(EmptyState, {
+    description: labels.recentsEmptyDescription,
+    tab: "recents",
+    title: labels.recentsEmpty
+  });
+}
+//# sourceMappingURL=index.js.map

package/dist/widgets/Activity/Tabs/RecentDocuments/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["React","DocumentList","EmptyState","RecentDocuments","documents","labels","listID","items","length","_jsx","id","label","recents","description","recentsEmptyDescription","tab","title","recentsEmpty"],"sources":["../../../../../src/widgets/Activity/Tabs/RecentDocuments/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport type { Labels } from '../../types.js'\nimport type { DocumentsController } from '../../utils/useActivityDocuments.js'\n\nimport { DocumentList } from '../../components/DocumentList/index.js'\nimport { EmptyState } from '../../components/EmptyState/index.js'\n\nexport function RecentDocuments({\n  documents,\n  labels,\n  listID,\n}: {\n  documents: DocumentsController\n  labels: Labels\n  listID: string\n}) {\n  if (!documents.items) {\n    return null\n  }\n\n  return documents.items.length ? (\n    <DocumentList id={listID} items={documents.items} label={labels.recents} />\n  ) : (\n    <EmptyState\n      description={labels.recentsEmptyDescription}\n      tab=\"recents\"\n      title={labels.recentsEmpty}\n    />\n  )\n}\n"],"mappings":";AAAA,OAAOA,KAAA,MAAW;AAKlB,SAASC,YAAY,QAAQ;AAC7B,SAASC,UAAU,QAAQ;AAE3B,OAAO,SAASC,gBAAgB;EAC9BC,SAAS;EACTC,MAAM;EACNC;AAAM,CAKP;EACC,IAAI,CAACF,SAAA,CAAUG,KAAK,EAAE;IACpB,OAAO;EACT;EAEA,OAAOH,SAAA,CAAUG,KAAK,CAACC,MAAM,gBAC3BC,IAAA,CAACR,YAAA;IAAaS,EAAA,EAAIJ,MAAA;IAAQC,KAAA,EAAOH,SAAA,CAAUG,KAAK;IAAEI,KAAA,EAAON,MAAA,CAAOO;oBAEhEH,IAAA,CAACP,UAAA;IACCW,WAAA,EAAaR,MAAA,CAAOS,uBAAuB;IAC3CC,GAAA,EAAI;IACJC,KAAA,EAAOX,MAAA,CAAOY;;AAGpB","ignoreList":[]}

package/dist/widgets/Activity/components/DocumentList/index.css

@@ -0,0 +1,61 @@
+@layer payload-default {
+  .activity-widget__content {
+    display: grid;
+    grid-column: 1 / -1;
+    grid-template-columns: subgrid;
+    align-content: start;
+  }
+
+  .card-grid.activity-widget__items {
+    min-height: 0;
+    padding: 0;
+    grid-column: 1 / -1;
+    grid-template-columns: subgrid;
+  }
+
+  .activity-widget__item--empty {
+    grid-column: 1 / -1;
+  }
+
+  .activity-widget .document-card {
+    min-block-size: var(--activity-row-height);
+  }
+
+  .activity-widget .document-card__thumbnail {
+    height: var(--activity-thumbnail-height);
+    min-height: 0;
+    aspect-ratio: auto;
+  }
+
+  .activity-widget .document-card__content {
+    padding: var(--spacer-2-5) var(--spacer-3);
+    border-block-start: var(--stroke-width-small) solid var(--color-border);
+  }
+
+  .activity-widget__meta {
+    overflow: hidden;
+    color: var(--color-text-secondary);
+    font-family: var(--text-body-medium-font-family);
+    font-size: var(--text-body-medium-font-size);
+    line-height: var(--text-body-medium-line-height);
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  @container (min-width: 800px) {
+    .activity-widget .document-card {
+      display: flex;
+      flex-direction: column;
+      block-size: var(--activity-row-height);
+    }
+
+    .activity-widget .document-card__thumbnail {
+      flex: 1;
+      height: 0;
+    }
+
+    .activity-widget .document-card__content {
+      flex-shrink: 0;
+    }
+  }
+}

package/dist/widgets/Activity/components/DocumentList/index.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { ActivityDocument } from '../../types.js';
+import './index.css';
+export declare function DocumentList({ id, isEmpty, items, label, renderActions, trailingItem, }: {
+    id: string;
+    /** Whether the tab has no documents, so the trailing item spans the whole row. */
+    isEmpty?: boolean;
+    items: ActivityDocument[];
+    label: string;
+    renderActions?: (args: {
+        item: ActivityDocument;
+    }) => React.ReactNode;
+    trailingItem?: React.ReactNode;
+}): React.JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/widgets/Activity/components/DocumentList/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/widgets/Activity/components/DocumentList/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAQtD,OAAO,aAAa,CAAA;AAEpB,wBAAgB,YAAY,CAAC,EAC3B,EAAE,EACF,OAAe,EACf,KAAK,EACL,KAAK,EACL,aAAa,EACb,YAAY,GACb,EAAE;IACD,EAAE,EAAE,MAAM,CAAA;IACV,kFAAkF;IAClF,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,EAAE,gBAAgB,EAAE,CAAA;IACzB,KAAK,EAAE,MAAM,CAAA;IACb,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,IAAI,EAAE,gBAAgB,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAA;IACrE,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC/B,qBAqDA"}

package/dist/widgets/Activity/components/DocumentList/index.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from 'react';
+import { CardGrid } from '../../../../elements/CardGrid/index.js';
+import { DocumentCard } from '../../../../elements/DocumentCard/index.js';
+import { DocumentIcon } from '../../../../icons/Document/index.js';
+import { PAGE_SIZES } from '../../utils/constants.js';
+import { documentKey } from '../../utils/documents.js';
+import { StatusPill } from '../StatusPill/index.js';
+import './index.css';
+export function DocumentList({
+  id,
+  isEmpty = false,
+  items,
+  label,
+  renderActions,
+  trailingItem
+}) {
+  return /*#__PURE__*/_jsx("div", {
+    className: "activity-widget__content",
+    id: id,
+    children: /*#__PURE__*/_jsx(CardGrid, {
+      ariaLabel: label,
+      className: "activity-widget__items",
+      getItemClassName: item => item ? 'activity-widget__item' : `activity-widget__item activity-widget__item--add-pin${isEmpty ? ' activity-widget__item--empty' : ''}`,
+      getKey: item => item ? documentKey(item) : 'add-pin',
+      items: trailingItem ? [...items, null] : items,
+      renderItem: item => item ? /*#__PURE__*/_jsxs(DocumentCard, {
+        href: item.href,
+        placeholder: /*#__PURE__*/_jsx(DocumentIcon, {}),
+        thumbnail: item.thumbnailURL ? {
+          alt: '',
+          // Cards past the smallest page size are hidden by CSS in narrow tiers.
+          loading: items.indexOf(item) < PAGE_SIZES[0] ? 'eager' : 'lazy',
+          src: item.thumbnailURL
+        } : undefined,
+        title: item.title,
+        children: [/*#__PURE__*/_jsxs("div", {
+          className: "activity-widget__meta",
+          children: [item.typeLabel, item.dateTime && item.dateLabel ? /*#__PURE__*/_jsxs(_Fragment, {
+            children: [' · ', /*#__PURE__*/_jsx("time", {
+              dateTime: item.dateTime,
+              children: item.dateLabel
+            })]
+          }) : null]
+        }), /*#__PURE__*/_jsx(StatusPill, {
+          isChanged: item.isChanged,
+          isDraft: item.isDraft,
+          label: item.statusLabel
+        }), renderActions?.({
+          item
+        })]
+      }) : trailingItem
+    })
+  });
+}
+//# sourceMappingURL=index.js.map

package/dist/widgets/Activity/components/DocumentList/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["React","CardGrid","DocumentCard","DocumentIcon","PAGE_SIZES","documentKey","StatusPill","DocumentList","id","isEmpty","items","label","renderActions","trailingItem","_jsx","className","ariaLabel","getItemClassName","item","getKey","renderItem","_jsxs","href","placeholder","thumbnail","thumbnailURL","alt","loading","indexOf","src","undefined","title","typeLabel","dateTime","dateLabel","_Fragment","isChanged","isDraft","statusLabel"],"sources":["../../../../../src/widgets/Activity/components/DocumentList/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport type { ActivityDocument } from '../../types.js'\n\nimport { CardGrid } from '../../../../elements/CardGrid/index.js'\nimport { DocumentCard } from '../../../../elements/DocumentCard/index.js'\nimport { DocumentIcon } from '../../../../icons/Document/index.js'\nimport { PAGE_SIZES } from '../../utils/constants.js'\nimport { documentKey } from '../../utils/documents.js'\nimport { StatusPill } from '../StatusPill/index.js'\nimport './index.css'\n\nexport function DocumentList({\n  id,\n  isEmpty = false,\n  items,\n  label,\n  renderActions,\n  trailingItem,\n}: {\n  id: string\n  /** Whether the tab has no documents, so the trailing item spans the whole row. */\n  isEmpty?: boolean\n  items: ActivityDocument[]\n  label: string\n  renderActions?: (args: { item: ActivityDocument }) => React.ReactNode\n  trailingItem?: React.ReactNode\n}) {\n  return (\n    <div className=\"activity-widget__content\" id={id}>\n      <CardGrid<ActivityDocument | null>\n        ariaLabel={label}\n        className=\"activity-widget__items\"\n        getItemClassName={(item) =>\n          item\n            ? 'activity-widget__item'\n            : `activity-widget__item activity-widget__item--add-pin${isEmpty ? ' activity-widget__item--empty' : ''}`\n        }\n        getKey={(item) => (item ? documentKey(item) : 'add-pin')}\n        items={trailingItem ? [...items, null] : items}\n        renderItem={(item) =>\n          item ? (\n            <DocumentCard\n              href={item.href}\n              placeholder={<DocumentIcon />}\n              thumbnail={\n                item.thumbnailURL\n                  ? {\n                      alt: '',\n                      // Cards past the smallest page size are hidden by CSS in narrow tiers.\n                      loading: items.indexOf(item) < PAGE_SIZES[0] ? 'eager' : 'lazy',\n                      src: item.thumbnailURL,\n                    }\n                  : undefined\n              }\n              title={item.title}\n            >\n              <div className=\"activity-widget__meta\">\n                {item.typeLabel}\n                {item.dateTime && item.dateLabel ? (\n                  <>\n                    {' · '}\n                    <time dateTime={item.dateTime}>{item.dateLabel}</time>\n                  </>\n                ) : null}\n              </div>\n              <StatusPill\n                isChanged={item.isChanged}\n                isDraft={item.isDraft}\n                label={item.statusLabel}\n              />\n              {renderActions?.({ item })}\n            </DocumentCard>\n          ) : (\n            trailingItem\n          )\n        }\n      />\n    </div>\n  )\n}\n"],"mappings":";AAAA,OAAOA,KAAA,MAAW;AAIlB,SAASC,QAAQ,QAAQ;AACzB,SAASC,YAAY,QAAQ;AAC7B,SAASC,YAAY,QAAQ;AAC7B,SAASC,UAAU,QAAQ;AAC3B,SAASC,WAAW,QAAQ;AAC5B,SAASC,UAAU,QAAQ;AAC3B,OAAO;AAEP,OAAO,SAASC,aAAa;EAC3BC,EAAE;EACFC,OAAA,GAAU,KAAK;EACfC,KAAK;EACLC,KAAK;EACLC,aAAa;EACbC;AAAY,CASb;EACC,oBACEC,IAAA,CAAC;IAAIC,SAAA,EAAU;IAA2BP,EAAA,EAAIA,EAAA;cAC5C,aAAAM,IAAA,CAACb,QAAA;MACCe,SAAA,EAAWL,KAAA;MACXI,SAAA,EAAU;MACVE,gBAAA,EAAmBC,IAAA,IACjBA,IAAA,GACI,0BACA,uDAAuDT,OAAA,GAAU,kCAAkC,IAAI;MAE7GU,MAAA,EAASD,IAAA,IAAUA,IAAA,GAAOb,WAAA,CAAYa,IAAA,IAAQ;MAC9CR,KAAA,EAAOG,YAAA,GAAe,C,GAAIH,KAAA,EAAO,KAAK,GAAGA,KAAA;MACzCU,UAAA,EAAaF,IAAA,IACXA,IAAA,gBACEG,KAAA,CAACnB,YAAA;QACCoB,IAAA,EAAMJ,IAAA,CAAKI,IAAI;QACfC,WAAA,eAAaT,IAAA,CAACX,YAAA;QACdqB,SAAA,EACEN,IAAA,CAAKO,YAAY,GACb;UACEC,GAAA,EAAK;UACL;UACAC,OAAA,EAASjB,KAAA,CAAMkB,OAAO,CAACV,IAAA,IAAQd,UAAU,CAAC,EAAE,GAAG,UAAU;UACzDyB,GAAA,EAAKX,IAAA,CAAKO;QACZ,IACAK,SAAA;QAENC,KAAA,EAAOb,IAAA,CAAKa,KAAK;gCAEjBV,KAAA,CAAC;UAAIN,SAAA,EAAU;qBACZG,IAAA,CAAKc,SAAS,EACdd,IAAA,CAAKe,QAAQ,IAAIf,IAAA,CAAKgB,SAAS,gBAC9Bb,KAAA,CAAAc,SAAA;uBACG,O,aACDrB,IAAA,CAAC;cAAKmB,QAAA,EAAUf,IAAA,CAAKe,QAAQ;wBAAGf,IAAA,CAAKgB;;eAErC;yBAENpB,IAAA,CAACR,UAAA;UACC8B,SAAA,EAAWlB,IAAA,CAAKkB,SAAS;UACzBC,OAAA,EAASnB,IAAA,CAAKmB,OAAO;UACrB1B,KAAA,EAAOO,IAAA,CAAKoB;YAEb1B,aAAA,GAAgB;UAAEM;QAAK;WAG1BL;;;AAMZ","ignoreList":[]}

package/dist/widgets/Activity/components/EmptyState/index.css

@@ -0,0 +1,47 @@
+@layer payload-default {
+  .activity-empty-state {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: var(--spacer-2);
+    grid-column: 1 / -1;
+    min-block-size: var(--activity-content-height);
+    padding: var(--spacer-5) var(--spacer-3);
+    border: var(--stroke-width-small) dashed var(--color-border);
+    border-radius: var(--radius-large);
+    text-align: center;
+  }
+
+  .activity-empty-state__icon {
+    width: var(--spacer-6);
+    height: var(--spacer-6);
+    border-radius: var(--radius-full);
+    background-color: var(--color-bg-brand-tertiary);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--color-icon-brand);
+  }
+
+  .activity-empty-state__text {
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacer-1);
+  }
+
+  .activity-empty-state__title {
+    color: var(--color-text);
+    font-family: var(--text-body-large-strong-font-family);
+    font-size: var(--text-body-large-strong-font-size);
+    font-weight: var(--text-body-large-strong-font-weight);
+    line-height: var(--text-body-large-strong-line-height);
+  }
+
+  .activity-empty-state__description {
+    color: var(--color-text-secondary);
+    font-family: var(--text-body-medium-font-family);
+    font-size: var(--text-body-medium-font-size);
+    line-height: var(--text-body-medium-line-height);
+  }
+}

package/dist/widgets/Activity/components/EmptyState/index.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { ActivityDocumentType } from '../../utils/getActivityWidgetDocs.js';
+import './index.css';
+export declare function EmptyState({ children, description, descriptionID, tab, title, }: {
+    /** Actions shown below the text. */
+    children?: React.ReactNode;
+    description: string;
+    descriptionID?: string;
+    tab: ActivityDocumentType;
+    title: string;
+}): React.JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/widgets/Activity/components/EmptyState/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/widgets/Activity/components/EmptyState/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sCAAsC,CAAA;AAIhF,OAAO,aAAa,CAAA;AAEpB,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,WAAW,EACX,aAAa,EACb,GAAG,EACH,KAAK,GACN,EAAE;IACD,oCAAoC;IACpC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,WAAW,EAAE,MAAM,CAAA;IACnB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,GAAG,EAAE,oBAAoB,CAAA;IACzB,KAAK,EAAE,MAAM,CAAA;CACd,qBAcA"}

package/dist/widgets/Activity/components/EmptyState/index.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { ClockIcon } from '../../../../icons/Clock/index.js';
+import { PinIcon } from '../../../../icons/Pin/index.js';
+import './index.css';
+export function EmptyState({
+  children,
+  description,
+  descriptionID,
+  tab,
+  title
+}) {
+  return (
+    // A live region must not contain controls, so only announce the state when it has none.
+    /*#__PURE__*/
+    _jsxs("div", {
+      "aria-live": children ? undefined : 'polite',
+      className: "activity-empty-state",
+      children: [/*#__PURE__*/_jsx("span", {
+        "aria-hidden": "true",
+        className: "activity-empty-state__icon",
+        children: tab === 'pinned' ? /*#__PURE__*/_jsx(PinIcon, {}) : /*#__PURE__*/_jsx(ClockIcon, {})
+      }), /*#__PURE__*/_jsxs("span", {
+        className: "activity-empty-state__text",
+        id: descriptionID,
+        children: [/*#__PURE__*/_jsx("span", {
+          className: "activity-empty-state__title",
+          children: title
+        }), /*#__PURE__*/_jsx("span", {
+          className: "activity-empty-state__description",
+          children: description
+        })]
+      }), children]
+    })
+  );
+}
+//# sourceMappingURL=index.js.map

package/dist/widgets/Activity/components/EmptyState/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["React","ClockIcon","PinIcon","EmptyState","children","description","descriptionID","tab","title","_jsxs","undefined","className","_jsx","id"],"sources":["../../../../../src/widgets/Activity/components/EmptyState/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport type { ActivityDocumentType } from '../../utils/getActivityWidgetDocs.js'\n\nimport { ClockIcon } from '../../../../icons/Clock/index.js'\nimport { PinIcon } from '../../../../icons/Pin/index.js'\nimport './index.css'\n\nexport function EmptyState({\n  children,\n  description,\n  descriptionID,\n  tab,\n  title,\n}: {\n  /** Actions shown below the text. */\n  children?: React.ReactNode\n  description: string\n  descriptionID?: string\n  tab: ActivityDocumentType\n  title: string\n}) {\n  return (\n    // A live region must not contain controls, so only announce the state when it has none.\n    <div aria-live={children ? undefined : 'polite'} className=\"activity-empty-state\">\n      <span aria-hidden=\"true\" className=\"activity-empty-state__icon\">\n        {tab === 'pinned' ? <PinIcon /> : <ClockIcon />}\n      </span>\n      <span className=\"activity-empty-state__text\" id={descriptionID}>\n        <span className=\"activity-empty-state__title\">{title}</span>\n        <span className=\"activity-empty-state__description\">{description}</span>\n      </span>\n      {children}\n    </div>\n  )\n}\n"],"mappings":";AAAA,OAAOA,KAAA,MAAW;AAIlB,SAASC,SAAS,QAAQ;AAC1B,SAASC,OAAO,QAAQ;AACxB,OAAO;AAEP,OAAO,SAASC,WAAW;EACzBC,QAAQ;EACRC,WAAW;EACXC,aAAa;EACbC,GAAG;EACHC;AAAK,CAQN;EACC;IACE;;IACAC,KAAA,CAAC;MAAI,aAAWL,QAAA,GAAWM,SAAA,GAAY;MAAUC,SAAA,EAAU;8BACzDC,IAAA,CAAC;QAAK,eAAY;QAAOD,SAAA,EAAU;kBAChCJ,GAAA,KAAQ,wBAAWK,IAAA,CAACV,OAAA,qBAAaU,IAAA,CAACX,SAAA;uBAErCQ,KAAA,CAAC;QAAKE,SAAA,EAAU;QAA6BE,EAAA,EAAIP,aAAA;gCAC/CM,IAAA,CAAC;UAAKD,SAAA,EAAU;oBAA+BH;yBAC/CI,IAAA,CAAC;UAAKD,SAAA,EAAU;oBAAqCN;;UAEtDD,QAAA;;;AAGP","ignoreList":[]}

package/dist/widgets/Activity/components/Pagination/index.css

@@ -0,0 +1,42 @@
+@layer payload-default {
+  .activity-widget__pagination {
+    display: flex;
+    align-items: center;
+    gap: var(--spacer-1);
+    font-family: var(--text-body-medium-font-family);
+    font-size: var(--text-body-medium-font-size);
+    line-height: var(--text-body-medium-line-height);
+  }
+
+  .activity-widget__pagination button {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: var(--spacer-4);
+    height: var(--spacer-4);
+    padding: 0;
+    border: 0;
+    border-radius: var(--radius-medium);
+    background: transparent;
+    color: var(--color-text);
+    cursor: pointer;
+  }
+
+  .activity-widget__pagination button:hover:not(:disabled) {
+    background: var(--color-bg-secondary);
+  }
+
+  .activity-widget__pagination button:focus-visible {
+    outline: var(--accessibility-outline);
+    outline-offset: var(--accessibility-outline-offset);
+  }
+
+  [dir='rtl'] .activity-widget__pagination button > span {
+    transform: scaleX(-1);
+  }
+
+  .activity-widget__pagination button:disabled {
+    color: var(--color-text-disabled);
+    cursor: default;
+  }
+}

package/dist/widgets/Activity/components/Pagination/index.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import type { Labels } from '../../types.js';
+import './index.css';
+export declare function Pagination({ consumeFocusRequest, hasPinPlaceholder, isDisabled, labels, listID, offset, onFocusTab, onPageChange, pageSize, totalDocs, }: {
+    /** Returns whether focus should move after the page changed, and clears the request. */
+    consumeFocusRequest: () => boolean;
+    hasPinPlaceholder: boolean;
+    isDisabled: boolean;
+    labels: Labels;
+    listID: string;
+    offset: number;
+    onFocusTab: () => void;
+    onPageChange: (args: {
+        offset: number;
+    }) => void;
+    /** `null` until the CSS page size is read. */
+    pageSize: null | number;
+    totalDocs: number;
+}): React.JSX.Element[];
+//# sourceMappingURL=index.d.ts.map

package/dist/widgets/Activity/components/Pagination/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/widgets/Activity/components/Pagination/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkC,MAAM,OAAO,CAAA;AAEtD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAM5C,OAAO,aAAa,CAAA;AAEpB,wBAAgB,UAAU,CAAC,EACzB,mBAAmB,EACnB,iBAAiB,EACjB,UAAU,EACV,MAAM,EACN,MAAM,EACN,MAAM,EACN,UAAU,EACV,YAAY,EACZ,QAAQ,EACR,SAAS,GACV,EAAE;IACD,wFAAwF;IACxF,mBAAmB,EAAE,MAAM,OAAO,CAAA;IAClC,iBAAiB,EAAE,OAAO,CAAA;IAC1B,UAAU,EAAE,OAAO,CAAA;IACnB,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,MAAM,CAAA;IACd,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,YAAY,EAAE,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IAChD,8CAA8C;IAC9C,QAAQ,EAAE,IAAI,GAAG,MAAM,CAAA;IACvB,SAAS,EAAE,MAAM,CAAA;CAClB,uBA0FA"}