payload-better-editor 1.0.4 → 1.2.0

package/dist/admin/sidebar/Sidebar.js

@@ -4,6 +4,7 @@ import React, { useEffect, useState } from 'react';
 import { DocumentSettingsTab } from './DocumentSettingsTab';
 import { DocumentMetaTab } from './DocumentMetaTab';
 import { BlockSettingsTab } from './BlockSettingsTab';
+import { ValidationSummary } from './ValidationSummary';
 const TABS = [
     {
         key: 'page',
@@ -33,7 +34,8 @@ const SidebarTab = ({ tabKey, label, active, onSelect })=>/*#__PURE__*/ _jsx("bu
         onClick: ()=>onSelect(tabKey),
         children: label
     });
-export const Sidebar = ({ selectedBlockPath, onClearSelection, onSelectPath, forceFullWidthFields, blocksField, addBelowRequestId = 0 })=>{
+// Memoized so resize-drag re-renders of the overlay skip the field tree.
+export const Sidebar = /*#__PURE__*/ React.memo(function Sidebar({ selectedBlockPath, onClearSelection, onSelectPath, forceFullWidthFields, blocksField, addBelowRequestId = 0 }) {
     const [tab, setTab] = useState('page');
     // Auto-jump to the block tab when the iframe selects a new block.
     useEffect(()=>{
@@ -55,6 +57,10 @@ export const Sidebar = ({ selectedBlockPath, onClearSelection, onSelectPath, for
                         onSelect: setTab
                     }, t.key))
             }),
+            /*#__PURE__*/ _jsx(ValidationSummary, {
+                blocksField: blocksField,
+                onSelectPath: onSelectPath
+            }),
             /*#__PURE__*/ _jsxs("div", {
                 className: `${ROOT_CLASS}__content`,
                 role: "tabpanel",
@@ -78,7 +84,7 @@ export const Sidebar = ({ selectedBlockPath, onClearSelection, onSelectPath, for
             })
         ]
     });
-};
+});
 // Off-screen live region announces block-selection changes to screen
 // readers; visible UI updates handle sighted users via the tab switch.
 const SelectionAnnouncer = ({ selectedBlockPath })=>/*#__PURE__*/ _jsx("div", {

package/dist/admin/sidebar/Sidebar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/admin/sidebar/Sidebar.tsx"],"sourcesContent":["'use client'\n\nimport React, { useEffect, useState } from 'react'\nimport { DocumentSettingsTab } from './DocumentSettingsTab'\nimport { DocumentMetaTab } from './DocumentMetaTab'\nimport { BlockSettingsTab } from './BlockSettingsTab'\n\nexport type SidebarProps = {\n  selectedBlockPath: string | null\n  onClearSelection: () => void\n  onSelectPath: (path: string | null) => void\n  forceFullWidthFields: boolean\n  blocksField: string\n  addBelowRequestId?: number\n}\n\ntype TabKey = 'page' | 'block' | 'settings'\n\nconst TABS: ReadonlyArray<{ key: TabKey; label: string }> = [\n  { key: 'page', label: 'Page' },\n  { key: 'block', label: 'Blocks' },\n  { key: 'settings', label: 'Settings' },\n]\n\nconst ROOT_CLASS = 'better-editor-sidebar'\nconst TAB_CLASS = `${ROOT_CLASS}__tab`\n\nconst tabId = (key: TabKey) => `better-editor-tab-${key}`\nconst panelId = (key: TabKey) => `better-editor-panel-${key}`\n\ntype SidebarTabProps = {\n  tabKey: TabKey\n  label: string\n  active: boolean\n  onSelect: (key: TabKey) => void\n}\n\nconst SidebarTab: React.FC<SidebarTabProps> = ({ tabKey, label, active, onSelect }) => (\n  <button\n    type=\"button\"\n    role=\"tab\"\n    id={tabId(tabKey)}\n    aria-selected={active}\n    aria-controls={panelId(tabKey)}\n    tabIndex={active ? 0 : -1}\n    className={active ? `${TAB_CLASS} ${TAB_CLASS}--active` : TAB_CLASS}\n    onClick={() => onSelect(tabKey)}\n  >\n    {label}\n  </button>\n)\n\nexport const Sidebar: React.FC<SidebarProps> = ({\n  selectedBlockPath,\n  onClearSelection,\n  onSelectPath,\n  forceFullWidthFields,\n  blocksField,\n  addBelowRequestId = 0,\n}) => {\n  const [tab, setTab] = useState<TabKey>('page')\n\n  // Auto-jump to the block tab when the iframe selects a new block.\n  useEffect(() => {\n    if (selectedBlockPath) setTab('block')\n  }, [selectedBlockPath])\n\n  const className = forceFullWidthFields\n    ? `${ROOT_CLASS} ${ROOT_CLASS}--force-full-width`\n    : ROOT_CLASS\n\n  return (\n    <div className={className}>\n      <div role=\"tablist\" className={`${ROOT_CLASS}__tabs`}>\n        {TABS.map((t) => (\n          <SidebarTab\n            key={t.key}\n            tabKey={t.key}\n            label={t.label}\n            active={tab === t.key}\n            onSelect={setTab}\n          />\n        ))}\n      </div>\n\n      <div\n        className={`${ROOT_CLASS}__content`}\n        role=\"tabpanel\"\n        id={panelId(tab)}\n        aria-labelledby={tabId(tab)}\n        tabIndex={0}\n      >\n        {tab === 'page' && <DocumentSettingsTab />}\n        {tab === 'block' && (\n          <BlockSettingsTab\n            selectedBlockPath={selectedBlockPath}\n            onClearSelection={onClearSelection}\n            onSelectPath={onSelectPath}\n            blocksField={blocksField}\n            addBelowRequestId={addBelowRequestId}\n          />\n        )}\n        {tab === 'settings' && <DocumentMetaTab />}\n      </div>\n\n      <SelectionAnnouncer selectedBlockPath={selectedBlockPath} />\n    </div>\n  )\n}\n\n// Off-screen live region announces block-selection changes to screen\n// readers; visible UI updates handle sighted users via the tab switch.\nconst SelectionAnnouncer: React.FC<{ selectedBlockPath: string | null }> = ({\n  selectedBlockPath,\n}) => (\n  <div role=\"status\" aria-live=\"polite\" aria-atomic=\"true\" className=\"better-editor-sr-only\">\n    {selectedBlockPath ? `Block selected: ${selectedBlockPath}` : 'No block selected'}\n  </div>\n)\n"],"names":["React","useEffect","useState","DocumentSettingsTab","DocumentMetaTab","BlockSettingsTab","TABS","key","label","ROOT_CLASS","TAB_CLASS","tabId","panelId","SidebarTab","tabKey","active","onSelect","button","type","role","id","aria-selected","aria-controls","tabIndex","className","onClick","Sidebar","selectedBlockPath","onClearSelection","onSelectPath","forceFullWidthFields","blocksField","addBelowRequestId","tab","setTab","div","map","t","aria-labelledby","SelectionAnnouncer","aria-live","aria-atomic"],"mappings":"AAAA;;AAEA,OAAOA,SAASC,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AAClD,SAASC,mBAAmB,QAAQ,wBAAuB;AAC3D,SAASC,eAAe,QAAQ,oBAAmB;AACnD,SAASC,gBAAgB,QAAQ,qBAAoB;AAarD,MAAMC,OAAsD;IAC1D;QAAEC,KAAK;QAAQC,OAAO;IAAO;IAC7B;QAAED,KAAK;QAASC,OAAO;IAAS;IAChC;QAAED,KAAK;QAAYC,OAAO;IAAW;CACtC;AAED,MAAMC,aAAa;AACnB,MAAMC,YAAY,GAAGD,WAAW,KAAK,CAAC;AAEtC,MAAME,QAAQ,CAACJ,MAAgB,CAAC,kBAAkB,EAAEA,KAAK;AACzD,MAAMK,UAAU,CAACL,MAAgB,CAAC,oBAAoB,EAAEA,KAAK;AAS7D,MAAMM,aAAwC,CAAC,EAAEC,MAAM,EAAEN,KAAK,EAAEO,MAAM,EAAEC,QAAQ,EAAE,iBAChF,KAACC;QACCC,MAAK;QACLC,MAAK;QACLC,IAAIT,MAAMG;QACVO,iBAAeN;QACfO,iBAAeV,QAAQE;QACvBS,UAAUR,SAAS,IAAI,CAAC;QACxBS,WAAWT,SAAS,GAAGL,UAAU,CAAC,EAAEA,UAAU,QAAQ,CAAC,GAAGA;QAC1De,SAAS,IAAMT,SAASF;kBAEvBN;;AAIL,OAAO,MAAMkB,UAAkC,CAAC,EAC9CC,iBAAiB,EACjBC,gBAAgB,EAChBC,YAAY,EACZC,oBAAoB,EACpBC,WAAW,EACXC,oBAAoB,CAAC,EACtB;IACC,MAAM,CAACC,KAAKC,OAAO,GAAGhC,SAAiB;IAEvC,kEAAkE;IAClED,UAAU;QACR,IAAI0B,mBAAmBO,OAAO;IAChC,GAAG;QAACP;KAAkB;IAEtB,MAAMH,YAAYM,uBACd,GAAGrB,WAAW,CAAC,EAAEA,WAAW,kBAAkB,CAAC,GAC/CA;IAEJ,qBACE,MAAC0B;QAAIX,WAAWA;;0BACd,KAACW;gBAAIhB,MAAK;gBAAUK,WAAW,GAAGf,WAAW,MAAM,CAAC;0BACjDH,KAAK8B,GAAG,CAAC,CAACC,kBACT,KAACxB;wBAECC,QAAQuB,EAAE9B,GAAG;wBACbC,OAAO6B,EAAE7B,KAAK;wBACdO,QAAQkB,QAAQI,EAAE9B,GAAG;wBACrBS,UAAUkB;uBAJLG,EAAE9B,GAAG;;0BAShB,MAAC4B;gBACCX,WAAW,GAAGf,WAAW,SAAS,CAAC;gBACnCU,MAAK;gBACLC,IAAIR,QAAQqB;gBACZK,mBAAiB3B,MAAMsB;gBACvBV,UAAU;;oBAETU,QAAQ,wBAAU,KAAC9B;oBACnB8B,QAAQ,yBACP,KAAC5B;wBACCsB,mBAAmBA;wBACnBC,kBAAkBA;wBAClBC,cAAcA;wBACdE,aAAaA;wBACbC,mBAAmBA;;oBAGtBC,QAAQ,4BAAc,KAAC7B;;;0BAG1B,KAACmC;gBAAmBZ,mBAAmBA;;;;AAG7C,EAAC;AAED,qEAAqE;AACrE,uEAAuE;AACvE,MAAMY,qBAAqE,CAAC,EAC1EZ,iBAAiB,EAClB,iBACC,KAACQ;QAAIhB,MAAK;QAASqB,aAAU;QAASC,eAAY;QAAOjB,WAAU;kBAChEG,oBAAoB,CAAC,gBAAgB,EAAEA,mBAAmB,GAAG"}
+{"version":3,"sources":["../../../src/admin/sidebar/Sidebar.tsx"],"sourcesContent":["'use client'\n\nimport React, { useEffect, useState } from 'react'\nimport { DocumentSettingsTab } from './DocumentSettingsTab'\nimport { DocumentMetaTab } from './DocumentMetaTab'\nimport { BlockSettingsTab } from './BlockSettingsTab'\nimport { ValidationSummary } from './ValidationSummary'\n\nexport type SidebarProps = {\n  selectedBlockPath: string | null\n  onClearSelection: () => void\n  onSelectPath: (path: string | null) => void\n  forceFullWidthFields: boolean\n  blocksField: string\n  addBelowRequestId?: number\n}\n\ntype TabKey = 'page' | 'block' | 'settings'\n\nconst TABS: ReadonlyArray<{ key: TabKey; label: string }> = [\n  { key: 'page', label: 'Page' },\n  { key: 'block', label: 'Blocks' },\n  { key: 'settings', label: 'Settings' },\n]\n\nconst ROOT_CLASS = 'better-editor-sidebar'\nconst TAB_CLASS = `${ROOT_CLASS}__tab`\n\nconst tabId = (key: TabKey) => `better-editor-tab-${key}`\nconst panelId = (key: TabKey) => `better-editor-panel-${key}`\n\ntype SidebarTabProps = {\n  tabKey: TabKey\n  label: string\n  active: boolean\n  onSelect: (key: TabKey) => void\n}\n\nconst SidebarTab: React.FC<SidebarTabProps> = ({ tabKey, label, active, onSelect }) => (\n  <button\n    type=\"button\"\n    role=\"tab\"\n    id={tabId(tabKey)}\n    aria-selected={active}\n    aria-controls={panelId(tabKey)}\n    tabIndex={active ? 0 : -1}\n    className={active ? `${TAB_CLASS} ${TAB_CLASS}--active` : TAB_CLASS}\n    onClick={() => onSelect(tabKey)}\n  >\n    {label}\n  </button>\n)\n\n// Memoized so resize-drag re-renders of the overlay skip the field tree.\nexport const Sidebar = React.memo(function Sidebar({\n  selectedBlockPath,\n  onClearSelection,\n  onSelectPath,\n  forceFullWidthFields,\n  blocksField,\n  addBelowRequestId = 0,\n}: SidebarProps) {\n  const [tab, setTab] = useState<TabKey>('page')\n\n  // Auto-jump to the block tab when the iframe selects a new block.\n  useEffect(() => {\n    if (selectedBlockPath) setTab('block')\n  }, [selectedBlockPath])\n\n  const className = forceFullWidthFields\n    ? `${ROOT_CLASS} ${ROOT_CLASS}--force-full-width`\n    : ROOT_CLASS\n\n  return (\n    <div className={className}>\n      <div role=\"tablist\" className={`${ROOT_CLASS}__tabs`}>\n        {TABS.map((t) => (\n          <SidebarTab\n            key={t.key}\n            tabKey={t.key}\n            label={t.label}\n            active={tab === t.key}\n            onSelect={setTab}\n          />\n        ))}\n      </div>\n\n      <ValidationSummary blocksField={blocksField} onSelectPath={onSelectPath} />\n\n      <div\n        className={`${ROOT_CLASS}__content`}\n        role=\"tabpanel\"\n        id={panelId(tab)}\n        aria-labelledby={tabId(tab)}\n        tabIndex={0}\n      >\n        {tab === 'page' && <DocumentSettingsTab />}\n        {tab === 'block' && (\n          <BlockSettingsTab\n            selectedBlockPath={selectedBlockPath}\n            onClearSelection={onClearSelection}\n            onSelectPath={onSelectPath}\n            blocksField={blocksField}\n            addBelowRequestId={addBelowRequestId}\n          />\n        )}\n        {tab === 'settings' && <DocumentMetaTab />}\n      </div>\n\n      <SelectionAnnouncer selectedBlockPath={selectedBlockPath} />\n    </div>\n  )\n})\n\n// Off-screen live region announces block-selection changes to screen\n// readers; visible UI updates handle sighted users via the tab switch.\nconst SelectionAnnouncer: React.FC<{ selectedBlockPath: string | null }> = ({\n  selectedBlockPath,\n}) => (\n  <div role=\"status\" aria-live=\"polite\" aria-atomic=\"true\" className=\"better-editor-sr-only\">\n    {selectedBlockPath ? `Block selected: ${selectedBlockPath}` : 'No block selected'}\n  </div>\n)\n"],"names":["React","useEffect","useState","DocumentSettingsTab","DocumentMetaTab","BlockSettingsTab","ValidationSummary","TABS","key","label","ROOT_CLASS","TAB_CLASS","tabId","panelId","SidebarTab","tabKey","active","onSelect","button","type","role","id","aria-selected","aria-controls","tabIndex","className","onClick","Sidebar","memo","selectedBlockPath","onClearSelection","onSelectPath","forceFullWidthFields","blocksField","addBelowRequestId","tab","setTab","div","map","t","aria-labelledby","SelectionAnnouncer","aria-live","aria-atomic"],"mappings":"AAAA;;AAEA,OAAOA,SAASC,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AAClD,SAASC,mBAAmB,QAAQ,wBAAuB;AAC3D,SAASC,eAAe,QAAQ,oBAAmB;AACnD,SAASC,gBAAgB,QAAQ,qBAAoB;AACrD,SAASC,iBAAiB,QAAQ,sBAAqB;AAavD,MAAMC,OAAsD;IAC1D;QAAEC,KAAK;QAAQC,OAAO;IAAO;IAC7B;QAAED,KAAK;QAASC,OAAO;IAAS;IAChC;QAAED,KAAK;QAAYC,OAAO;IAAW;CACtC;AAED,MAAMC,aAAa;AACnB,MAAMC,YAAY,GAAGD,WAAW,KAAK,CAAC;AAEtC,MAAME,QAAQ,CAACJ,MAAgB,CAAC,kBAAkB,EAAEA,KAAK;AACzD,MAAMK,UAAU,CAACL,MAAgB,CAAC,oBAAoB,EAAEA,KAAK;AAS7D,MAAMM,aAAwC,CAAC,EAAEC,MAAM,EAAEN,KAAK,EAAEO,MAAM,EAAEC,QAAQ,EAAE,iBAChF,KAACC;QACCC,MAAK;QACLC,MAAK;QACLC,IAAIT,MAAMG;QACVO,iBAAeN;QACfO,iBAAeV,QAAQE;QACvBS,UAAUR,SAAS,IAAI,CAAC;QACxBS,WAAWT,SAAS,GAAGL,UAAU,CAAC,EAAEA,UAAU,QAAQ,CAAC,GAAGA;QAC1De,SAAS,IAAMT,SAASF;kBAEvBN;;AAIL,yEAAyE;AACzE,OAAO,MAAMkB,wBAAU3B,MAAM4B,IAAI,CAAC,SAASD,QAAQ,EACjDE,iBAAiB,EACjBC,gBAAgB,EAChBC,YAAY,EACZC,oBAAoB,EACpBC,WAAW,EACXC,oBAAoB,CAAC,EACR;IACb,MAAM,CAACC,KAAKC,OAAO,GAAGlC,SAAiB;IAEvC,kEAAkE;IAClED,UAAU;QACR,IAAI4B,mBAAmBO,OAAO;IAChC,GAAG;QAACP;KAAkB;IAEtB,MAAMJ,YAAYO,uBACd,GAAGtB,WAAW,CAAC,EAAEA,WAAW,kBAAkB,CAAC,GAC/CA;IAEJ,qBACE,MAAC2B;QAAIZ,WAAWA;;0BACd,KAACY;gBAAIjB,MAAK;gBAAUK,WAAW,GAAGf,WAAW,MAAM,CAAC;0BACjDH,KAAK+B,GAAG,CAAC,CAACC,kBACT,KAACzB;wBAECC,QAAQwB,EAAE/B,GAAG;wBACbC,OAAO8B,EAAE9B,KAAK;wBACdO,QAAQmB,QAAQI,EAAE/B,GAAG;wBACrBS,UAAUmB;uBAJLG,EAAE/B,GAAG;;0BAShB,KAACF;gBAAkB2B,aAAaA;gBAAaF,cAAcA;;0BAE3D,MAACM;gBACCZ,WAAW,GAAGf,WAAW,SAAS,CAAC;gBACnCU,MAAK;gBACLC,IAAIR,QAAQsB;gBACZK,mBAAiB5B,MAAMuB;gBACvBX,UAAU;;oBAETW,QAAQ,wBAAU,KAAChC;oBACnBgC,QAAQ,yBACP,KAAC9B;wBACCwB,mBAAmBA;wBACnBC,kBAAkBA;wBAClBC,cAAcA;wBACdE,aAAaA;wBACbC,mBAAmBA;;oBAGtBC,QAAQ,4BAAc,KAAC/B;;;0BAG1B,KAACqC;gBAAmBZ,mBAAmBA;;;;AAG7C,GAAE;AAEF,qEAAqE;AACrE,uEAAuE;AACvE,MAAMY,qBAAqE,CAAC,EAC1EZ,iBAAiB,EAClB,iBACC,KAACQ;QAAIjB,MAAK;QAASsB,aAAU;QAASC,eAAY;QAAOlB,WAAU;kBAChEI,oBAAoB,CAAC,gBAAgB,EAAEA,mBAAmB,GAAG"}

package/dist/admin/sidebar/ValidationSummary.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export type ValidationSummaryProps = {
+    blocksField: string;
+    onSelectPath: (path: string | null) => void;
+};
+export declare const ValidationSummary: React.FC<ValidationSummaryProps>;

package/dist/admin/sidebar/ValidationSummary.js

@@ -0,0 +1,48 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useMemo } from 'react';
+import { useAllFormFields } from '@payloadcms/ui';
+import { collectFieldErrors } from './validation';
+// Sidebar banner listing invalid fields across all blocks.
+export const ValidationSummary = ({ blocksField, onSelectPath })=>{
+    const [fields] = useAllFormFields();
+    const errors = useMemo(()=>collectFieldErrors(fields, blocksField), [
+        fields,
+        blocksField
+    ]);
+    if (errors.length === 0) return null;
+    return /*#__PURE__*/ _jsxs("div", {
+        className: "better-editor-sidebar__errors",
+        role: "region",
+        "aria-label": "Validation errors",
+        children: [
+            /*#__PURE__*/ _jsx("p", {
+                className: "better-editor-sidebar__errors-title",
+                children: errors.length === 1 ? '1 field needs attention' : `${errors.length} fields need attention`
+            }),
+            /*#__PURE__*/ _jsx("ul", {
+                className: "better-editor-sidebar__errors-list",
+                children: errors.map((error)=>/*#__PURE__*/ _jsxs("li", {
+                        className: "better-editor-sidebar__errors-item",
+                        children: [
+                            error.blockPath ? /*#__PURE__*/ _jsx("button", {
+                                type: "button",
+                                className: "better-editor-sidebar__errors-jump",
+                                onClick: ()=>onSelectPath(error.blockPath),
+                                children: error.label
+                            }) : /*#__PURE__*/ _jsx("span", {
+                                className: "better-editor-sidebar__errors-label",
+                                children: error.label
+                            }),
+                            /*#__PURE__*/ _jsx("span", {
+                                className: "better-editor-sidebar__errors-message",
+                                children: error.message
+                            })
+                        ]
+                    }, error.path))
+            })
+        ]
+    });
+};
+
+//# sourceMappingURL=ValidationSummary.js.map

package/dist/admin/sidebar/ValidationSummary.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/sidebar/ValidationSummary.tsx"],"sourcesContent":["'use client'\n\nimport React, { useMemo } from 'react'\nimport { useAllFormFields } from '@payloadcms/ui'\nimport type { FormState } from 'payload'\nimport { collectFieldErrors } from './validation'\n\nexport type ValidationSummaryProps = {\n  blocksField: string\n  onSelectPath: (path: string | null) => void\n}\n\n// Sidebar banner listing invalid fields across all blocks.\nexport const ValidationSummary: React.FC<ValidationSummaryProps> = ({\n  blocksField,\n  onSelectPath,\n}) => {\n  const [fields] = useAllFormFields()\n  const errors = useMemo(\n    () => collectFieldErrors(fields as FormState, blocksField),\n    [fields, blocksField],\n  )\n\n  if (errors.length === 0) return null\n\n  return (\n    <div className=\"better-editor-sidebar__errors\" role=\"region\" aria-label=\"Validation errors\">\n      <p className=\"better-editor-sidebar__errors-title\">\n        {errors.length === 1 ? '1 field needs attention' : `${errors.length} fields need attention`}\n      </p>\n      <ul className=\"better-editor-sidebar__errors-list\">\n        {errors.map((error) => (\n          <li key={error.path} className=\"better-editor-sidebar__errors-item\">\n            {error.blockPath ? (\n              <button\n                type=\"button\"\n                className=\"better-editor-sidebar__errors-jump\"\n                onClick={() => onSelectPath(error.blockPath)}\n              >\n                {error.label}\n              </button>\n            ) : (\n              <span className=\"better-editor-sidebar__errors-label\">{error.label}</span>\n            )}\n            <span className=\"better-editor-sidebar__errors-message\">{error.message}</span>\n          </li>\n        ))}\n      </ul>\n    </div>\n  )\n}\n"],"names":["React","useMemo","useAllFormFields","collectFieldErrors","ValidationSummary","blocksField","onSelectPath","fields","errors","length","div","className","role","aria-label","p","ul","map","error","li","blockPath","button","type","onClick","label","span","message","path"],"mappings":"AAAA;;AAEA,OAAOA,SAASC,OAAO,QAAQ,QAAO;AACtC,SAASC,gBAAgB,QAAQ,iBAAgB;AAEjD,SAASC,kBAAkB,QAAQ,eAAc;AAOjD,2DAA2D;AAC3D,OAAO,MAAMC,oBAAsD,CAAC,EAClEC,WAAW,EACXC,YAAY,EACb;IACC,MAAM,CAACC,OAAO,GAAGL;IACjB,MAAMM,SAASP,QACb,IAAME,mBAAmBI,QAAqBF,cAC9C;QAACE;QAAQF;KAAY;IAGvB,IAAIG,OAAOC,MAAM,KAAK,GAAG,OAAO;IAEhC,qBACE,MAACC;QAAIC,WAAU;QAAgCC,MAAK;QAASC,cAAW;;0BACtE,KAACC;gBAAEH,WAAU;0BACVH,OAAOC,MAAM,KAAK,IAAI,4BAA4B,GAAGD,OAAOC,MAAM,CAAC,sBAAsB,CAAC;;0BAE7F,KAACM;gBAAGJ,WAAU;0BACXH,OAAOQ,GAAG,CAAC,CAACC,sBACX,MAACC;wBAAoBP,WAAU;;4BAC5BM,MAAME,SAAS,iBACd,KAACC;gCACCC,MAAK;gCACLV,WAAU;gCACVW,SAAS,IAAMhB,aAAaW,MAAME,SAAS;0CAE1CF,MAAMM,KAAK;+CAGd,KAACC;gCAAKb,WAAU;0CAAuCM,MAAMM,KAAK;;0CAEpE,KAACC;gCAAKb,WAAU;0CAAyCM,MAAMQ,OAAO;;;uBAZ/DR,MAAMS,IAAI;;;;AAkB7B,EAAC"}

package/dist/admin/sidebar/validation.d.ts

@@ -0,0 +1,10 @@
+import type { FormState } from 'payload';
+export type FieldError = {
+    path: string;
+    label: string;
+    message: string;
+    /** Top-level block path to select on click, or null for non-block fields. */
+    blockPath: string | null;
+};
+export declare const toBlockPath: (fieldPath: string, blocksField: string) => string | null;
+export declare const collectFieldErrors: (fields: FormState, blocksField: string) => FieldError[];

package/dist/admin/sidebar/validation.js

@@ -0,0 +1,28 @@
+const lastSegment = (path)=>{
+    const parts = path.split('.');
+    return parts[parts.length - 1] || path;
+};
+// Top-level block (`layout.2`) a field path belongs to, or null if outside the blocks field.
+export const toBlockPath = (fieldPath, blocksField)=>{
+    if (!fieldPath.startsWith(`${blocksField}.`)) return null;
+    const index = fieldPath.slice(blocksField.length + 1).split('.')[0];
+    return /^\d+$/.test(index) ? `${blocksField}.${index}` : null;
+};
+// Require a message: leaf errors carry one, containers/groups don't — keeps
+// spurious parent rows out.
+export const collectFieldErrors = (fields, blocksField)=>{
+    const out = [];
+    for (const [path, field] of Object.entries(fields)){
+        if (field.valid === false && typeof field.errorMessage === 'string') {
+            out.push({
+                path,
+                label: lastSegment(path),
+                message: field.errorMessage,
+                blockPath: toBlockPath(path, blocksField)
+            });
+        }
+    }
+    return out;
+};
+
+//# sourceMappingURL=validation.js.map

package/dist/admin/sidebar/validation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/sidebar/validation.ts"],"sourcesContent":["import type { FormState } from 'payload'\n\nexport type FieldError = {\n  path: string\n  label: string\n  message: string\n  /** Top-level block path to select on click, or null for non-block fields. */\n  blockPath: string | null\n}\n\nconst lastSegment = (path: string): string => {\n  const parts = path.split('.')\n  return parts[parts.length - 1] || path\n}\n\n// Top-level block (`layout.2`) a field path belongs to, or null if outside the blocks field.\nexport const toBlockPath = (fieldPath: string, blocksField: string): string | null => {\n  if (!fieldPath.startsWith(`${blocksField}.`)) return null\n  const index = fieldPath.slice(blocksField.length + 1).split('.')[0]\n  return /^\\d+$/.test(index) ? `${blocksField}.${index}` : null\n}\n\n// Require a message: leaf errors carry one, containers/groups don't — keeps\n// spurious parent rows out.\nexport const collectFieldErrors = (fields: FormState, blocksField: string): FieldError[] => {\n  const out: FieldError[] = []\n  for (const [path, field] of Object.entries(fields)) {\n    if (field.valid === false && typeof field.errorMessage === 'string') {\n      out.push({\n        path,\n        label: lastSegment(path),\n        message: field.errorMessage,\n        blockPath: toBlockPath(path, blocksField),\n      })\n    }\n  }\n  return out\n}\n"],"names":["lastSegment","path","parts","split","length","toBlockPath","fieldPath","blocksField","startsWith","index","slice","test","collectFieldErrors","fields","out","field","Object","entries","valid","errorMessage","push","label","message","blockPath"],"mappings":"AAUA,MAAMA,cAAc,CAACC;IACnB,MAAMC,QAAQD,KAAKE,KAAK,CAAC;IACzB,OAAOD,KAAK,CAACA,MAAME,MAAM,GAAG,EAAE,IAAIH;AACpC;AAEA,6FAA6F;AAC7F,OAAO,MAAMI,cAAc,CAACC,WAAmBC;IAC7C,IAAI,CAACD,UAAUE,UAAU,CAAC,GAAGD,YAAY,CAAC,CAAC,GAAG,OAAO;IACrD,MAAME,QAAQH,UAAUI,KAAK,CAACH,YAAYH,MAAM,GAAG,GAAGD,KAAK,CAAC,IAAI,CAAC,EAAE;IACnE,OAAO,QAAQQ,IAAI,CAACF,SAAS,GAAGF,YAAY,CAAC,EAAEE,OAAO,GAAG;AAC3D,EAAC;AAED,4EAA4E;AAC5E,4BAA4B;AAC5B,OAAO,MAAMG,qBAAqB,CAACC,QAAmBN;IACpD,MAAMO,MAAoB,EAAE;IAC5B,KAAK,MAAM,CAACb,MAAMc,MAAM,IAAIC,OAAOC,OAAO,CAACJ,QAAS;QAClD,IAAIE,MAAMG,KAAK,KAAK,SAAS,OAAOH,MAAMI,YAAY,KAAK,UAAU;YACnEL,IAAIM,IAAI,CAAC;gBACPnB;gBACAoB,OAAOrB,YAAYC;gBACnBqB,SAASP,MAAMI,YAAY;gBAC3BI,WAAWlB,YAAYJ,MAAMM;YAC/B;QACF;IACF;IACA,OAAOO;AACT,EAAC"}

package/dist/hooks/usePreviewHandleDrag.js

@@ -1,9 +1,9 @@
 'use client';
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { clampViewport } from '../internal/limits';
+import { startHorizontalDrag } from '../internal/drag';
 export const usePreviewHandleDrag = ({ resizable, viewportWidth, onResize })=>{
     const [isResizing, setIsResizing] = useState(false);
-    // Track in-flight drag so unmount mid-drag can release body styles + listeners.
     const dragCleanupRef = useRef(null);
     const isMountedRef = useRef(true);
     useEffect(()=>{
@@ -18,27 +18,16 @@ export const usePreviewHandleDrag = ({ resizable, viewportWidth, onResize })=>{
             e.preventDefault();
             const startX = e.clientX;
             const startWidth = viewportWidth;
-            // Iframe is centered; dragging either edge by N px symmetrically grows
-            // the width by 2N. Right handle: positive delta increases width.
+            // Centered iframe grows by 2px per dragged edge px.
             const dir = side === 'right' ? 2 : -2;
             setIsResizing(true);
-            const onMove = (ev)=>{
-                onResize(clampViewport(startWidth + (ev.clientX - startX) * dir));
-            };
-            const cleanup = ()=>{
-                window.removeEventListener('mousemove', onMove);
-                window.removeEventListener('mouseup', onUp);
-                document.body.style.cursor = '';
-                document.body.style.userSelect = '';
-                if (isMountedRef.current) setIsResizing(false);
-                dragCleanupRef.current = null;
-            };
-            const onUp = ()=>cleanup();
-            dragCleanupRef.current = cleanup;
-            document.body.style.cursor = 'ew-resize';
-            document.body.style.userSelect = 'none';
-            window.addEventListener('mousemove', onMove);
-            window.addEventListener('mouseup', onUp);
+            dragCleanupRef.current = startHorizontalDrag('ew-resize', {
+                onUpdate: (clientX)=>onResize(clampViewport(startWidth + (clientX - startX) * dir)),
+                onEnd: ()=>{
+                    if (isMountedRef.current) setIsResizing(false);
+                    dragCleanupRef.current = null;
+                }
+            });
         }, [
         resizable,
         onResize,

package/dist/hooks/usePreviewHandleDrag.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/usePreviewHandleDrag.ts"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\nimport { clampViewport } from '../internal/limits'\n\nexport type UsePreviewHandleDragOptions = {\n  resizable: boolean\n  viewportWidth?: number | null\n  onResize?: (next: number) => void\n}\n\nexport type UsePreviewHandleDragReturn = {\n  isResizing: boolean\n  onHandleMouseDown: (side: 'left' | 'right') => (e: React.MouseEvent) => void\n}\n\nexport const usePreviewHandleDrag = ({\n  resizable,\n  viewportWidth,\n  onResize,\n}: UsePreviewHandleDragOptions): UsePreviewHandleDragReturn => {\n  const [isResizing, setIsResizing] = useState(false)\n\n  // Track in-flight drag so unmount mid-drag can release body styles + listeners.\n  const dragCleanupRef = useRef<(() => void) | null>(null)\n  const isMountedRef = useRef(true)\n  useEffect(() => {\n    isMountedRef.current = true\n    return () => {\n      isMountedRef.current = false\n      dragCleanupRef.current?.()\n    }\n  }, [])\n\n  const onHandleMouseDown = useCallback(\n    (side: 'left' | 'right') => (e: React.MouseEvent) => {\n      if (!resizable || !onResize || !viewportWidth) return\n      e.preventDefault()\n      const startX = e.clientX\n      const startWidth = viewportWidth\n      // Iframe is centered; dragging either edge by N px symmetrically grows\n      // the width by 2N. Right handle: positive delta increases width.\n      const dir = side === 'right' ? 2 : -2\n      setIsResizing(true)\n      const onMove = (ev: MouseEvent) => {\n        onResize(clampViewport(startWidth + (ev.clientX - startX) * dir))\n      }\n      const cleanup = () => {\n        window.removeEventListener('mousemove', onMove)\n        window.removeEventListener('mouseup', onUp)\n        document.body.style.cursor = ''\n        document.body.style.userSelect = ''\n        if (isMountedRef.current) setIsResizing(false)\n        dragCleanupRef.current = null\n      }\n      const onUp = () => cleanup()\n      dragCleanupRef.current = cleanup\n      document.body.style.cursor = 'ew-resize'\n      document.body.style.userSelect = 'none'\n      window.addEventListener('mousemove', onMove)\n      window.addEventListener('mouseup', onUp)\n    },\n    [resizable, onResize, viewportWidth],\n  )\n\n  return { isResizing, onHandleMouseDown }\n}\n"],"names":["React","useCallback","useEffect","useRef","useState","clampViewport","usePreviewHandleDrag","resizable","viewportWidth","onResize","isResizing","setIsResizing","dragCleanupRef","isMountedRef","current","onHandleMouseDown","side","e","preventDefault","startX","clientX","startWidth","dir","onMove","ev","cleanup","window","removeEventListener","onUp","document","body","style","cursor","userSelect","addEventListener"],"mappings":"AAAA;AAEA,OAAOA,SAASC,WAAW,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,QAAO;AACvE,SAASC,aAAa,QAAQ,qBAAoB;AAalD,OAAO,MAAMC,uBAAuB,CAAC,EACnCC,SAAS,EACTC,aAAa,EACbC,QAAQ,EACoB;IAC5B,MAAM,CAACC,YAAYC,cAAc,GAAGP,SAAS;IAE7C,gFAAgF;IAChF,MAAMQ,iBAAiBT,OAA4B;IACnD,MAAMU,eAAeV,OAAO;IAC5BD,UAAU;QACRW,aAAaC,OAAO,GAAG;QACvB,OAAO;YACLD,aAAaC,OAAO,GAAG;YACvBF,eAAeE,OAAO;QACxB;IACF,GAAG,EAAE;IAEL,MAAMC,oBAAoBd,YACxB,CAACe,OAA2B,CAACC;YAC3B,IAAI,CAACV,aAAa,CAACE,YAAY,CAACD,eAAe;YAC/CS,EAAEC,cAAc;YAChB,MAAMC,SAASF,EAAEG,OAAO;YACxB,MAAMC,aAAab;YACnB,uEAAuE;YACvE,iEAAiE;YACjE,MAAMc,MAAMN,SAAS,UAAU,IAAI,CAAC;YACpCL,cAAc;YACd,MAAMY,SAAS,CAACC;gBACdf,SAASJ,cAAcgB,aAAa,AAACG,CAAAA,GAAGJ,OAAO,GAAGD,MAAK,IAAKG;YAC9D;YACA,MAAMG,UAAU;gBACdC,OAAOC,mBAAmB,CAAC,aAAaJ;gBACxCG,OAAOC,mBAAmB,CAAC,WAAWC;gBACtCC,SAASC,IAAI,CAACC,KAAK,CAACC,MAAM,GAAG;gBAC7BH,SAASC,IAAI,CAACC,KAAK,CAACE,UAAU,GAAG;gBACjC,IAAIpB,aAAaC,OAAO,EAAEH,cAAc;gBACxCC,eAAeE,OAAO,GAAG;YAC3B;YACA,MAAMc,OAAO,IAAMH;YACnBb,eAAeE,OAAO,GAAGW;YACzBI,SAASC,IAAI,CAACC,KAAK,CAACC,MAAM,GAAG;YAC7BH,SAASC,IAAI,CAACC,KAAK,CAACE,UAAU,GAAG;YACjCP,OAAOQ,gBAAgB,CAAC,aAAaX;YACrCG,OAAOQ,gBAAgB,CAAC,WAAWN;QACrC,GACA;QAACrB;QAAWE;QAAUD;KAAc;IAGtC,OAAO;QAAEE;QAAYK;IAAkB;AACzC,EAAC"}
+{"version":3,"sources":["../../src/hooks/usePreviewHandleDrag.ts"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\nimport { clampViewport } from '../internal/limits'\nimport { startHorizontalDrag } from '../internal/drag'\n\nexport type UsePreviewHandleDragOptions = {\n  resizable: boolean\n  viewportWidth?: number | null\n  onResize?: (next: number) => void\n}\n\nexport type UsePreviewHandleDragReturn = {\n  isResizing: boolean\n  onHandleMouseDown: (side: 'left' | 'right') => (e: React.MouseEvent) => void\n}\n\nexport const usePreviewHandleDrag = ({\n  resizable,\n  viewportWidth,\n  onResize,\n}: UsePreviewHandleDragOptions): UsePreviewHandleDragReturn => {\n  const [isResizing, setIsResizing] = useState(false)\n\n  const dragCleanupRef = useRef<(() => void) | null>(null)\n  const isMountedRef = useRef(true)\n  useEffect(() => {\n    isMountedRef.current = true\n    return () => {\n      isMountedRef.current = false\n      dragCleanupRef.current?.()\n    }\n  }, [])\n\n  const onHandleMouseDown = useCallback(\n    (side: 'left' | 'right') => (e: React.MouseEvent) => {\n      if (!resizable || !onResize || !viewportWidth) return\n      e.preventDefault()\n      const startX = e.clientX\n      const startWidth = viewportWidth\n      // Centered iframe grows by 2px per dragged edge px.\n      const dir = side === 'right' ? 2 : -2\n      setIsResizing(true)\n      dragCleanupRef.current = startHorizontalDrag('ew-resize', {\n        onUpdate: (clientX) => onResize(clampViewport(startWidth + (clientX - startX) * dir)),\n        onEnd: () => {\n          if (isMountedRef.current) setIsResizing(false)\n          dragCleanupRef.current = null\n        },\n      })\n    },\n    [resizable, onResize, viewportWidth],\n  )\n\n  return { isResizing, onHandleMouseDown }\n}\n"],"names":["React","useCallback","useEffect","useRef","useState","clampViewport","startHorizontalDrag","usePreviewHandleDrag","resizable","viewportWidth","onResize","isResizing","setIsResizing","dragCleanupRef","isMountedRef","current","onHandleMouseDown","side","e","preventDefault","startX","clientX","startWidth","dir","onUpdate","onEnd"],"mappings":"AAAA;AAEA,OAAOA,SAASC,WAAW,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,QAAO;AACvE,SAASC,aAAa,QAAQ,qBAAoB;AAClD,SAASC,mBAAmB,QAAQ,mBAAkB;AAatD,OAAO,MAAMC,uBAAuB,CAAC,EACnCC,SAAS,EACTC,aAAa,EACbC,QAAQ,EACoB;IAC5B,MAAM,CAACC,YAAYC,cAAc,GAAGR,SAAS;IAE7C,MAAMS,iBAAiBV,OAA4B;IACnD,MAAMW,eAAeX,OAAO;IAC5BD,UAAU;QACRY,aAAaC,OAAO,GAAG;QACvB,OAAO;YACLD,aAAaC,OAAO,GAAG;YACvBF,eAAeE,OAAO;QACxB;IACF,GAAG,EAAE;IAEL,MAAMC,oBAAoBf,YACxB,CAACgB,OAA2B,CAACC;YAC3B,IAAI,CAACV,aAAa,CAACE,YAAY,CAACD,eAAe;YAC/CS,EAAEC,cAAc;YAChB,MAAMC,SAASF,EAAEG,OAAO;YACxB,MAAMC,aAAab;YACnB,oDAAoD;YACpD,MAAMc,MAAMN,SAAS,UAAU,IAAI,CAAC;YACpCL,cAAc;YACdC,eAAeE,OAAO,GAAGT,oBAAoB,aAAa;gBACxDkB,UAAU,CAACH,UAAYX,SAASL,cAAciB,aAAa,AAACD,CAAAA,UAAUD,MAAK,IAAKG;gBAChFE,OAAO;oBACL,IAAIX,aAAaC,OAAO,EAAEH,cAAc;oBACxCC,eAAeE,OAAO,GAAG;gBAC3B;YACF;QACF,GACA;QAACP;QAAWE;QAAUD;KAAc;IAGtC,OAAO;QAAEE;QAAYK;IAAkB;AACzC,EAAC"}

package/dist/hooks/useSidebarResize.js

@@ -3,6 +3,7 @@ import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { DEFAULT_SIDEBAR_WIDTH, MAX_SIDEBAR_WIDTH, MIN_SIDEBAR_WIDTH, SIDEBAR_KEYBOARD_STEP_PX, SIDEBAR_KEYBOARD_STEP_LARGE_PX, STORAGE_DEBOUNCE_MS } from '../internal/constants';
 import { useBetterEditorConfig } from '../providers/BetterEditorConfigProvider';
 import { readNumber, writeString } from '../internal/storage';
+import { startHorizontalDrag } from '../internal/drag';
 const clampSidebar = (n)=>Math.min(MAX_SIDEBAR_WIDTH, Math.max(MIN_SIDEBAR_WIDTH, n));
 export const useSidebarResize = (sidebarPosition)=>{
     const { storageKeys } = useBetterEditorConfig();
@@ -50,22 +51,13 @@ export const useSidebarResize = (sidebarPosition)=>{
         const startWidth = widthRef.current;
         const direction = positionRef.current === 'right' ? -1 : 1;
         setIsResizing(true);
-        document.body.style.cursor = 'col-resize';
-        document.body.style.userSelect = 'none';
-        const onMove = (ev)=>{
-            setSidebarWidth(clampSidebar(startWidth + (ev.clientX - startX) * direction));
-        };
-        const cleanup = ()=>{
-            window.removeEventListener('mousemove', onMove);
-            window.removeEventListener('mouseup', cleanup);
-            document.body.style.cursor = '';
-            document.body.style.userSelect = '';
-            setIsResizing(false);
-            dragCleanupRef.current = null;
-        };
-        dragCleanupRef.current = cleanup;
-        window.addEventListener('mousemove', onMove);
-        window.addEventListener('mouseup', cleanup);
+        dragCleanupRef.current = startHorizontalDrag('col-resize', {
+            onUpdate: (clientX)=>setSidebarWidth(clampSidebar(startWidth + (clientX - startX) * direction)),
+            onEnd: ()=>{
+                setIsResizing(false);
+                dragCleanupRef.current = null;
+            }
+        });
     }, []);
     // Arrow keys nudge the handle for keyboard users (WCAG 2.1 separator
     // semantics). Direction matches the mouse drag — Right when the sidebar

package/dist/hooks/useSidebarResize.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/useSidebarResize.ts"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\nimport {\n  DEFAULT_SIDEBAR_WIDTH,\n  MAX_SIDEBAR_WIDTH,\n  MIN_SIDEBAR_WIDTH,\n  SIDEBAR_KEYBOARD_STEP_PX,\n  SIDEBAR_KEYBOARD_STEP_LARGE_PX,\n  STORAGE_DEBOUNCE_MS,\n} from '../internal/constants'\nimport { useBetterEditorConfig } from '../providers/BetterEditorConfigProvider'\nimport { readNumber, writeString } from '../internal/storage'\n\nconst clampSidebar = (n: number): number =>\n  Math.min(MAX_SIDEBAR_WIDTH, Math.max(MIN_SIDEBAR_WIDTH, n))\n\nexport type UseSidebarResizeReturn = {\n  sidebarWidth: number\n  isResizing: boolean\n  onResizeStart: (e: React.MouseEvent<HTMLDivElement>) => void\n  onResizeKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => void\n}\n\nexport const useSidebarResize = (\n  sidebarPosition: 'left' | 'right',\n): UseSidebarResizeReturn => {\n  const { storageKeys } = useBetterEditorConfig()\n  const [sidebarWidth, setSidebarWidth] = useState<number>(() =>\n    readNumber(storageKeys.sidebarWidth, DEFAULT_SIDEBAR_WIDTH, clampSidebar),\n  )\n  const [isResizing, setIsResizing] = useState(false)\n\n  const widthRef = useRef(sidebarWidth)\n  widthRef.current = sidebarWidth\n\n  const positionRef = useRef(sidebarPosition)\n  positionRef.current = sidebarPosition\n\n  const dragCleanupRef = useRef<(() => void) | null>(null)\n  const writeTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n\n  // Debounce storage writes — drag fires 60×/s while keyboard nudges fire\n  // per keystroke. Either way we only want the final value persisted.\n  const hydratedRef = useRef(false)\n  useEffect(() => {\n    if (!hydratedRef.current) {\n      hydratedRef.current = true\n      return\n    }\n    if (writeTimerRef.current) clearTimeout(writeTimerRef.current)\n    writeTimerRef.current = setTimeout(() => {\n      writeString(storageKeys.sidebarWidth, String(sidebarWidth))\n      writeTimerRef.current = null\n    }, STORAGE_DEBOUNCE_MS)\n    return () => {\n      if (writeTimerRef.current) clearTimeout(writeTimerRef.current)\n    }\n  }, [sidebarWidth, storageKeys.sidebarWidth])\n\n  // Release listeners + body styles + flush pending storage write on unmount.\n  useEffect(\n    () => () => {\n      dragCleanupRef.current?.()\n      if (writeTimerRef.current) {\n        clearTimeout(writeTimerRef.current)\n        writeString(storageKeys.sidebarWidth, String(widthRef.current))\n      }\n    },\n    [storageKeys.sidebarWidth],\n  )\n\n  const onResizeStart = useCallback((e: React.MouseEvent<HTMLDivElement>) => {\n    e.preventDefault()\n    const startX = e.clientX\n    const startWidth = widthRef.current\n    const direction = positionRef.current === 'right' ? -1 : 1\n\n    setIsResizing(true)\n    document.body.style.cursor = 'col-resize'\n    document.body.style.userSelect = 'none'\n\n    const onMove = (ev: MouseEvent) => {\n      setSidebarWidth(clampSidebar(startWidth + (ev.clientX - startX) * direction))\n    }\n    const cleanup = () => {\n      window.removeEventListener('mousemove', onMove)\n      window.removeEventListener('mouseup', cleanup)\n      document.body.style.cursor = ''\n      document.body.style.userSelect = ''\n      setIsResizing(false)\n      dragCleanupRef.current = null\n    }\n    dragCleanupRef.current = cleanup\n    window.addEventListener('mousemove', onMove)\n    window.addEventListener('mouseup', cleanup)\n  }, [])\n\n  // Arrow keys nudge the handle for keyboard users (WCAG 2.1 separator\n  // semantics). Direction matches the mouse drag — Right when the sidebar\n  // sits on the right grows the sidebar inward.\n  const onResizeKeyDown = useCallback((e: React.KeyboardEvent<HTMLDivElement>) => {\n    const direction = positionRef.current === 'right' ? -1 : 1\n    let delta = 0\n    if (e.key === 'ArrowLeft') delta = -SIDEBAR_KEYBOARD_STEP_PX * direction\n    else if (e.key === 'ArrowRight') delta = SIDEBAR_KEYBOARD_STEP_PX * direction\n    else if (e.key === 'PageUp') delta = -SIDEBAR_KEYBOARD_STEP_LARGE_PX * direction\n    else if (e.key === 'PageDown') delta = SIDEBAR_KEYBOARD_STEP_LARGE_PX * direction\n    else if (e.key === 'Home') {\n      e.preventDefault()\n      setSidebarWidth(MIN_SIDEBAR_WIDTH)\n      return\n    } else if (e.key === 'End') {\n      e.preventDefault()\n      setSidebarWidth(MAX_SIDEBAR_WIDTH)\n      return\n    }\n    if (delta === 0) return\n    e.preventDefault()\n    setSidebarWidth((w) => clampSidebar(w + delta))\n  }, [])\n\n  return { sidebarWidth, isResizing, onResizeStart, onResizeKeyDown }\n}\n"],"names":["React","useCallback","useEffect","useRef","useState","DEFAULT_SIDEBAR_WIDTH","MAX_SIDEBAR_WIDTH","MIN_SIDEBAR_WIDTH","SIDEBAR_KEYBOARD_STEP_PX","SIDEBAR_KEYBOARD_STEP_LARGE_PX","STORAGE_DEBOUNCE_MS","useBetterEditorConfig","readNumber","writeString","clampSidebar","n","Math","min","max","useSidebarResize","sidebarPosition","storageKeys","sidebarWidth","setSidebarWidth","isResizing","setIsResizing","widthRef","current","positionRef","dragCleanupRef","writeTimerRef","hydratedRef","clearTimeout","setTimeout","String","onResizeStart","e","preventDefault","startX","clientX","startWidth","direction","document","body","style","cursor","userSelect","onMove","ev","cleanup","window","removeEventListener","addEventListener","onResizeKeyDown","delta","key","w"],"mappings":"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"}
+{"version":3,"sources":["../../src/hooks/useSidebarResize.ts"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\nimport {\n  DEFAULT_SIDEBAR_WIDTH,\n  MAX_SIDEBAR_WIDTH,\n  MIN_SIDEBAR_WIDTH,\n  SIDEBAR_KEYBOARD_STEP_PX,\n  SIDEBAR_KEYBOARD_STEP_LARGE_PX,\n  STORAGE_DEBOUNCE_MS,\n} from '../internal/constants'\nimport { useBetterEditorConfig } from '../providers/BetterEditorConfigProvider'\nimport { readNumber, writeString } from '../internal/storage'\nimport { startHorizontalDrag } from '../internal/drag'\n\nconst clampSidebar = (n: number): number =>\n  Math.min(MAX_SIDEBAR_WIDTH, Math.max(MIN_SIDEBAR_WIDTH, n))\n\nexport type UseSidebarResizeReturn = {\n  sidebarWidth: number\n  isResizing: boolean\n  onResizeStart: (e: React.MouseEvent<HTMLDivElement>) => void\n  onResizeKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => void\n}\n\nexport const useSidebarResize = (\n  sidebarPosition: 'left' | 'right',\n): UseSidebarResizeReturn => {\n  const { storageKeys } = useBetterEditorConfig()\n  const [sidebarWidth, setSidebarWidth] = useState<number>(() =>\n    readNumber(storageKeys.sidebarWidth, DEFAULT_SIDEBAR_WIDTH, clampSidebar),\n  )\n  const [isResizing, setIsResizing] = useState(false)\n\n  const widthRef = useRef(sidebarWidth)\n  widthRef.current = sidebarWidth\n\n  const positionRef = useRef(sidebarPosition)\n  positionRef.current = sidebarPosition\n\n  const dragCleanupRef = useRef<(() => void) | null>(null)\n  const writeTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n\n  // Debounce storage writes — drag fires 60×/s while keyboard nudges fire\n  // per keystroke. Either way we only want the final value persisted.\n  const hydratedRef = useRef(false)\n  useEffect(() => {\n    if (!hydratedRef.current) {\n      hydratedRef.current = true\n      return\n    }\n    if (writeTimerRef.current) clearTimeout(writeTimerRef.current)\n    writeTimerRef.current = setTimeout(() => {\n      writeString(storageKeys.sidebarWidth, String(sidebarWidth))\n      writeTimerRef.current = null\n    }, STORAGE_DEBOUNCE_MS)\n    return () => {\n      if (writeTimerRef.current) clearTimeout(writeTimerRef.current)\n    }\n  }, [sidebarWidth, storageKeys.sidebarWidth])\n\n  // Release listeners + body styles + flush pending storage write on unmount.\n  useEffect(\n    () => () => {\n      dragCleanupRef.current?.()\n      if (writeTimerRef.current) {\n        clearTimeout(writeTimerRef.current)\n        writeString(storageKeys.sidebarWidth, String(widthRef.current))\n      }\n    },\n    [storageKeys.sidebarWidth],\n  )\n\n  const onResizeStart = useCallback((e: React.MouseEvent<HTMLDivElement>) => {\n    e.preventDefault()\n    const startX = e.clientX\n    const startWidth = widthRef.current\n    const direction = positionRef.current === 'right' ? -1 : 1\n    setIsResizing(true)\n    dragCleanupRef.current = startHorizontalDrag('col-resize', {\n      onUpdate: (clientX) => setSidebarWidth(clampSidebar(startWidth + (clientX - startX) * direction)),\n      onEnd: () => {\n        setIsResizing(false)\n        dragCleanupRef.current = null\n      },\n    })\n  }, [])\n\n  // Arrow keys nudge the handle for keyboard users (WCAG 2.1 separator\n  // semantics). Direction matches the mouse drag — Right when the sidebar\n  // sits on the right grows the sidebar inward.\n  const onResizeKeyDown = useCallback((e: React.KeyboardEvent<HTMLDivElement>) => {\n    const direction = positionRef.current === 'right' ? -1 : 1\n    let delta = 0\n    if (e.key === 'ArrowLeft') delta = -SIDEBAR_KEYBOARD_STEP_PX * direction\n    else if (e.key === 'ArrowRight') delta = SIDEBAR_KEYBOARD_STEP_PX * direction\n    else if (e.key === 'PageUp') delta = -SIDEBAR_KEYBOARD_STEP_LARGE_PX * direction\n    else if (e.key === 'PageDown') delta = SIDEBAR_KEYBOARD_STEP_LARGE_PX * direction\n    else if (e.key === 'Home') {\n      e.preventDefault()\n      setSidebarWidth(MIN_SIDEBAR_WIDTH)\n      return\n    } else if (e.key === 'End') {\n      e.preventDefault()\n      setSidebarWidth(MAX_SIDEBAR_WIDTH)\n      return\n    }\n    if (delta === 0) return\n    e.preventDefault()\n    setSidebarWidth((w) => clampSidebar(w + delta))\n  }, [])\n\n  return { sidebarWidth, isResizing, onResizeStart, onResizeKeyDown }\n}\n"],"names":["React","useCallback","useEffect","useRef","useState","DEFAULT_SIDEBAR_WIDTH","MAX_SIDEBAR_WIDTH","MIN_SIDEBAR_WIDTH","SIDEBAR_KEYBOARD_STEP_PX","SIDEBAR_KEYBOARD_STEP_LARGE_PX","STORAGE_DEBOUNCE_MS","useBetterEditorConfig","readNumber","writeString","startHorizontalDrag","clampSidebar","n","Math","min","max","useSidebarResize","sidebarPosition","storageKeys","sidebarWidth","setSidebarWidth","isResizing","setIsResizing","widthRef","current","positionRef","dragCleanupRef","writeTimerRef","hydratedRef","clearTimeout","setTimeout","String","onResizeStart","e","preventDefault","startX","clientX","startWidth","direction","onUpdate","onEnd","onResizeKeyDown","delta","key","w"],"mappings":"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"}

package/dist/index.js

@@ -1,4 +1,5 @@
 import { BETTER_EDITOR_SETTINGS_BANNER_FIELD, betterEditorSettingsGlobal } from './global';
+import { normalizeEntities } from './internal/entities';
 export { BETTER_EDITOR_SETTINGS_SLUG } from './global';
 export { VERSION } from './version';
 const DEFAULT_BLOCKS_FIELD = 'layout';
@@ -72,14 +73,14 @@ const warnMissingBlocksField = (kind, slug, blocksField)=>{
  * @see {@link BetterEditorConfig} for all options.
  */ export const betterEditor = (pluginOptions)=>(config)=>{
         if (pluginOptions?.disabled) return config;
-        const collectionSlugs = new Set(pluginOptions?.collections ?? []);
-        const globalSlugs = new Set(pluginOptions?.globals ?? []);
-        const blocksField = pluginOptions?.blocksField || DEFAULT_BLOCKS_FIELD;
-        const clientProps = {
-            blocksField,
-            adminPortalSelector: pluginOptions?.adminPortalSelector,
-            storageNamespace: pluginOptions?.storageNamespace
-        };
+        const defaultBlocksField = pluginOptions?.blocksField || DEFAULT_BLOCKS_FIELD;
+        const collectionMap = normalizeEntities(pluginOptions?.collections, defaultBlocksField);
+        const globalMap = normalizeEntities(pluginOptions?.globals, defaultBlocksField);
+        const toggleClientProps = (blocksField)=>({
+                blocksField,
+                adminPortalSelector: pluginOptions?.adminPortalSelector,
+                storageNamespace: pluginOptions?.storageNamespace
+            });
         const showBanner = pluginOptions?.showSettingsBanner !== false;
         const settingsGlobal = showBanner ? betterEditorSettingsGlobal : {
             ...betterEditorSettingsGlobal,
@@ -91,28 +92,30 @@ const warnMissingBlocksField = (kind, slug, blocksField)=>{
             ...existingGlobals,
             settingsGlobal
         ];
-        if (collectionSlugs.size === 0 && globalSlugs.size === 0) {
+        if (collectionMap.size === 0 && globalMap.size === 0) {
             if (isDev) {
                 console.warn('[better-editor] plugin loaded with empty `collections` and `globals` — toggle button will not appear anywhere. Pass `collections: ["pages"]` (or similar) to BetterEditorConfig.');
             }
             return config;
         }
-        if (collectionSlugs.size > 0 && config.collections) {
+        if (collectionMap.size > 0 && config.collections) {
             config.collections = config.collections.map((collection)=>{
-                if (!collectionSlugs.has(collection.slug)) return collection;
+                const blocksField = collectionMap.get(collection.slug);
+                if (blocksField === undefined) return collection;
                 if (isDev && !hasBlocksField(collection.fields, blocksField)) {
                     warnMissingBlocksField('collection', collection.slug, blocksField);
                 }
-                return withToggleInjected(collection, 'edit', clientProps);
+                return withToggleInjected(collection, 'edit', toggleClientProps(blocksField));
             });
         }
-        if (globalSlugs.size > 0) {
+        if (globalMap.size > 0) {
             config.globals = (config.globals ?? []).map((global)=>{
-                if (!globalSlugs.has(global.slug)) return global;
+                const blocksField = globalMap.get(global.slug);
+                if (blocksField === undefined) return global;
                 if (isDev && !hasBlocksField(global.fields, blocksField)) {
                     warnMissingBlocksField('global', global.slug, blocksField);
                 }
-                return withToggleInjected(global, 'elements', clientProps);
+                return withToggleInjected(global, 'elements', toggleClientProps(blocksField));
             });
         }
         return config;

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["import type { CollectionConfig, Config, Field, GlobalConfig } from 'payload'\nimport type { BetterEditorConfig } from './types'\nimport { BETTER_EDITOR_SETTINGS_BANNER_FIELD, betterEditorSettingsGlobal } from './global'\n\nexport type { BetterEditorConfig }\nexport type { BetterEditorSettings, HoverToolbarPosition } from './state/useBetterEditorSettings'\nexport type { SidebarPosition } from './internal/constants'\nexport { BETTER_EDITOR_SETTINGS_SLUG } from './global'\n\n/** Plugin signature — handy for typing plugin lists in consumer code. */\nexport type BetterEditorPlugin = (config: Config) => Config\n\nexport { VERSION } from './version'\n\nconst DEFAULT_BLOCKS_FIELD = 'layout'\nconst TOGGLE_COMPONENT_PATH = 'payload-better-editor/client#LiveEditorToggle'\nconst isDev = process.env.NODE_ENV !== 'production'\n\n/**\n * Checks whether a field with the given `name` exists at the document's\n * top-level data path. Recurses into presentational containers that do\n * not introduce a path segment (`tabs` without a name, `row`, `collapsible`)\n * but stops at `group` and named tabs, since those namespace their children.\n */\nconst hasBlocksField = (fields: Field[] | undefined, name: string): boolean => {\n  if (!Array.isArray(fields)) return false\n  return fields.some((field) => {\n    if ('name' in field && field.name === name) return true\n    if (field.type === 'row' || field.type === 'collapsible') {\n      return hasBlocksField(field.fields, name)\n    }\n    if (field.type === 'tabs') {\n      return field.tabs.some((tab) =>\n        'name' in tab && tab.name ? false : hasBlocksField(tab.fields, name),\n      )\n    }\n    return false\n  })\n}\n\ntype ToggleSlot = 'edit' | 'elements'\n\ntype ToggleClientProps = {\n  blocksField: string\n  adminPortalSelector?: string\n  storageNamespace?: string\n}\n\nconst withToggleInjected = <T extends CollectionConfig | GlobalConfig>(\n  entity: T,\n  slot: ToggleSlot,\n  clientProps: ToggleClientProps,\n): T => {\n  const admin = { ...(entity.admin ?? {}) } as NonNullable<T['admin']>\n  const components = { ...(admin.components ?? {}) } as Record<string, unknown>\n  const target = { ...((components[slot] as Record<string, unknown>) ?? {}) }\n  const before = (target.beforeDocumentControls as unknown[]) ?? []\n  return {\n    ...entity,\n    admin: {\n      ...admin,\n      components: {\n        ...components,\n        [slot]: {\n          ...target,\n          beforeDocumentControls: [\n            ...before,\n            { path: TOGGLE_COMPONENT_PATH, clientProps },\n          ],\n        },\n      },\n    },\n  }\n}\n\nconst warnMissingBlocksField = (kind: 'collection' | 'global', slug: string, blocksField: string) => {\n\n  console.warn(\n    `[better-editor] ${kind} \"${slug}\" has no top-level field named \"${blocksField}\" — the sidebar Blocks tab will be empty. Set \\`blocksField\\` to the actual blocks field name.`,\n  )\n}\n\n/**\n * Payload CMS plugin factory for the Better Editor overlay. Adds an\n * \"Open Better Editor\" toggle to the configured collections / globals\n * and registers a `BetterEditorSettings` global with editor-wide options.\n *\n * @example\n *   import { betterEditor } from 'payload-better-editor'\n *\n *   export default buildConfig({\n *     plugins: [betterEditor({ collections: ['pages'] })],\n *     // ...\n *   })\n *\n * @see {@link BetterEditorConfig} for all options.\n */\nexport const betterEditor =\n  (pluginOptions?: BetterEditorConfig): BetterEditorPlugin =>\n  (config: Config): Config => {\n    if (pluginOptions?.disabled) return config\n\n    const collectionSlugs = new Set(pluginOptions?.collections ?? [])\n    const globalSlugs = new Set(pluginOptions?.globals ?? [])\n    const blocksField = pluginOptions?.blocksField || DEFAULT_BLOCKS_FIELD\n    const clientProps: ToggleClientProps = {\n      blocksField,\n      adminPortalSelector: pluginOptions?.adminPortalSelector,\n      storageNamespace: pluginOptions?.storageNamespace,\n    }\n\n    const showBanner = pluginOptions?.showSettingsBanner !== false\n    const settingsGlobal: GlobalConfig = showBanner\n      ? betterEditorSettingsGlobal\n      : {\n          ...betterEditorSettingsGlobal,\n          fields: betterEditorSettingsGlobal.fields.filter(\n            (f) => !('name' in f && f.name === BETTER_EDITOR_SETTINGS_BANNER_FIELD),\n          ),\n        }\n\n    const existingGlobals = config.globals ?? []\n    const hasSettingsGlobal = existingGlobals.some((g) => g.slug === settingsGlobal.slug)\n    config.globals = hasSettingsGlobal\n      ? existingGlobals\n      : [...existingGlobals, settingsGlobal]\n\n    if (collectionSlugs.size === 0 && globalSlugs.size === 0) {\n      if (isDev) {\n\n        console.warn(\n          '[better-editor] plugin loaded with empty `collections` and `globals` — toggle button will not appear anywhere. Pass `collections: [\"pages\"]` (or similar) to BetterEditorConfig.',\n        )\n      }\n      return config\n    }\n\n    if (collectionSlugs.size > 0 && config.collections) {\n      config.collections = config.collections.map((collection) => {\n        if (!collectionSlugs.has(collection.slug)) return collection\n        if (isDev && !hasBlocksField(collection.fields, blocksField)) {\n          warnMissingBlocksField('collection', collection.slug, blocksField)\n        }\n        return withToggleInjected(collection, 'edit', clientProps)\n      })\n    }\n\n    if (globalSlugs.size > 0) {\n      config.globals = (config.globals ?? []).map((global) => {\n        if (!globalSlugs.has(global.slug)) return global\n        if (isDev && !hasBlocksField(global.fields, blocksField)) {\n          warnMissingBlocksField('global', global.slug, blocksField)\n        }\n        return withToggleInjected(global, 'elements', clientProps)\n      })\n    }\n\n    return config\n  }\n"],"names":["BETTER_EDITOR_SETTINGS_BANNER_FIELD","betterEditorSettingsGlobal","BETTER_EDITOR_SETTINGS_SLUG","VERSION","DEFAULT_BLOCKS_FIELD","TOGGLE_COMPONENT_PATH","isDev","process","env","NODE_ENV","hasBlocksField","fields","name","Array","isArray","some","field","type","tabs","tab","withToggleInjected","entity","slot","clientProps","admin","components","target","before","beforeDocumentControls","path","warnMissingBlocksField","kind","slug","blocksField","console","warn","betterEditor","pluginOptions","config","disabled","collectionSlugs","Set","collections","globalSlugs","globals","adminPortalSelector","storageNamespace","showBanner","showSettingsBanner","settingsGlobal","filter","f","existingGlobals","hasSettingsGlobal","g","size","map","collection","has","global"],"mappings":"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"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["import type { CollectionConfig, Config, Field, GlobalConfig } from 'payload'\nimport type { BetterEditorConfig } from './types'\nimport { BETTER_EDITOR_SETTINGS_BANNER_FIELD, betterEditorSettingsGlobal } from './global'\nimport { normalizeEntities } from './internal/entities'\n\nexport type { BetterEditorConfig }\nexport type { BetterEditorSettings, HoverToolbarPosition } from './state/useBetterEditorSettings'\nexport type { SidebarPosition } from './internal/constants'\nexport { BETTER_EDITOR_SETTINGS_SLUG } from './global'\n\n/** Plugin signature — handy for typing plugin lists in consumer code. */\nexport type BetterEditorPlugin = (config: Config) => Config\n\nexport { VERSION } from './version'\n\nconst DEFAULT_BLOCKS_FIELD = 'layout'\nconst TOGGLE_COMPONENT_PATH = 'payload-better-editor/client#LiveEditorToggle'\nconst isDev = process.env.NODE_ENV !== 'production'\n\n/**\n * Checks whether a field with the given `name` exists at the document's\n * top-level data path. Recurses into presentational containers that do\n * not introduce a path segment (`tabs` without a name, `row`, `collapsible`)\n * but stops at `group` and named tabs, since those namespace their children.\n */\nconst hasBlocksField = (fields: Field[] | undefined, name: string): boolean => {\n  if (!Array.isArray(fields)) return false\n  return fields.some((field) => {\n    if ('name' in field && field.name === name) return true\n    if (field.type === 'row' || field.type === 'collapsible') {\n      return hasBlocksField(field.fields, name)\n    }\n    if (field.type === 'tabs') {\n      return field.tabs.some((tab) =>\n        'name' in tab && tab.name ? false : hasBlocksField(tab.fields, name),\n      )\n    }\n    return false\n  })\n}\n\ntype ToggleSlot = 'edit' | 'elements'\n\ntype ToggleClientProps = {\n  blocksField: string\n  adminPortalSelector?: string\n  storageNamespace?: string\n}\n\nconst withToggleInjected = <T extends CollectionConfig | GlobalConfig>(\n  entity: T,\n  slot: ToggleSlot,\n  clientProps: ToggleClientProps,\n): T => {\n  const admin = { ...(entity.admin ?? {}) } as NonNullable<T['admin']>\n  const components = { ...(admin.components ?? {}) } as Record<string, unknown>\n  const target = { ...((components[slot] as Record<string, unknown>) ?? {}) }\n  const before = (target.beforeDocumentControls as unknown[]) ?? []\n  return {\n    ...entity,\n    admin: {\n      ...admin,\n      components: {\n        ...components,\n        [slot]: {\n          ...target,\n          beforeDocumentControls: [\n            ...before,\n            { path: TOGGLE_COMPONENT_PATH, clientProps },\n          ],\n        },\n      },\n    },\n  }\n}\n\nconst warnMissingBlocksField = (kind: 'collection' | 'global', slug: string, blocksField: string) => {\n\n  console.warn(\n    `[better-editor] ${kind} \"${slug}\" has no top-level field named \"${blocksField}\" — the sidebar Blocks tab will be empty. Set \\`blocksField\\` to the actual blocks field name.`,\n  )\n}\n\n/**\n * Payload CMS plugin factory for the Better Editor overlay. Adds an\n * \"Open Better Editor\" toggle to the configured collections / globals\n * and registers a `BetterEditorSettings` global with editor-wide options.\n *\n * @example\n *   import { betterEditor } from 'payload-better-editor'\n *\n *   export default buildConfig({\n *     plugins: [betterEditor({ collections: ['pages'] })],\n *     // ...\n *   })\n *\n * @see {@link BetterEditorConfig} for all options.\n */\nexport const betterEditor =\n  (pluginOptions?: BetterEditorConfig): BetterEditorPlugin =>\n  (config: Config): Config => {\n    if (pluginOptions?.disabled) return config\n\n    const defaultBlocksField = pluginOptions?.blocksField || DEFAULT_BLOCKS_FIELD\n    const collectionMap = normalizeEntities(pluginOptions?.collections, defaultBlocksField)\n    const globalMap = normalizeEntities(pluginOptions?.globals, defaultBlocksField)\n    const toggleClientProps = (blocksField: string): ToggleClientProps => ({\n      blocksField,\n      adminPortalSelector: pluginOptions?.adminPortalSelector,\n      storageNamespace: pluginOptions?.storageNamespace,\n    })\n\n    const showBanner = pluginOptions?.showSettingsBanner !== false\n    const settingsGlobal: GlobalConfig = showBanner\n      ? betterEditorSettingsGlobal\n      : {\n          ...betterEditorSettingsGlobal,\n          fields: betterEditorSettingsGlobal.fields.filter(\n            (f) => !('name' in f && f.name === BETTER_EDITOR_SETTINGS_BANNER_FIELD),\n          ),\n        }\n\n    const existingGlobals = config.globals ?? []\n    const hasSettingsGlobal = existingGlobals.some((g) => g.slug === settingsGlobal.slug)\n    config.globals = hasSettingsGlobal\n      ? existingGlobals\n      : [...existingGlobals, settingsGlobal]\n\n    if (collectionMap.size === 0 && globalMap.size === 0) {\n      if (isDev) {\n\n        console.warn(\n          '[better-editor] plugin loaded with empty `collections` and `globals` — toggle button will not appear anywhere. Pass `collections: [\"pages\"]` (or similar) to BetterEditorConfig.',\n        )\n      }\n      return config\n    }\n\n    if (collectionMap.size > 0 && config.collections) {\n      config.collections = config.collections.map((collection) => {\n        const blocksField = collectionMap.get(collection.slug)\n        if (blocksField === undefined) return collection\n        if (isDev && !hasBlocksField(collection.fields, blocksField)) {\n          warnMissingBlocksField('collection', collection.slug, blocksField)\n        }\n        return withToggleInjected(collection, 'edit', toggleClientProps(blocksField))\n      })\n    }\n\n    if (globalMap.size > 0) {\n      config.globals = (config.globals ?? []).map((global) => {\n        const blocksField = globalMap.get(global.slug)\n        if (blocksField === undefined) return global\n        if (isDev && !hasBlocksField(global.fields, blocksField)) {\n          warnMissingBlocksField('global', global.slug, blocksField)\n        }\n        return withToggleInjected(global, 'elements', toggleClientProps(blocksField))\n      })\n    }\n\n    return config\n  }\n"],"names":["BETTER_EDITOR_SETTINGS_BANNER_FIELD","betterEditorSettingsGlobal","normalizeEntities","BETTER_EDITOR_SETTINGS_SLUG","VERSION","DEFAULT_BLOCKS_FIELD","TOGGLE_COMPONENT_PATH","isDev","process","env","NODE_ENV","hasBlocksField","fields","name","Array","isArray","some","field","type","tabs","tab","withToggleInjected","entity","slot","clientProps","admin","components","target","before","beforeDocumentControls","path","warnMissingBlocksField","kind","slug","blocksField","console","warn","betterEditor","pluginOptions","config","disabled","defaultBlocksField","collectionMap","collections","globalMap","globals","toggleClientProps","adminPortalSelector","storageNamespace","showBanner","showSettingsBanner","settingsGlobal","filter","f","existingGlobals","hasSettingsGlobal","g","size","map","collection","get","undefined","global"],"mappings":"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"}

package/dist/internal/drag.d.ts

@@ -0,0 +1,12 @@
+export type CoalescedDragHandlers = {
+    /** Runs at most once per animation frame with the latest pointer clientX. */
+    onUpdate: (clientX: number) => void;
+    /** Runs once when the drag ends or is torn down, after the final flush. */
+    onEnd?: () => void;
+};
+/**
+ * Horizontal pointer drag: window mousemove/mouseup listeners that coalesce
+ * moves into one onUpdate per frame and flush the final position on release.
+ * Sets the body cursor + disables text selection. Returns a function to end it.
+ */
+export declare const startHorizontalDrag: (cursor: string, { onUpdate, onEnd }: CoalescedDragHandlers) => (() => void);

package/dist/internal/drag.js

@@ -0,0 +1,46 @@
+/**
+ * Horizontal pointer drag: window mousemove/mouseup listeners that coalesce
+ * moves into one onUpdate per frame and flush the final position on release.
+ * Sets the body cursor + disables text selection. Returns a function to end it.
+ */ export const startHorizontalDrag = (cursor, { onUpdate, onEnd })=>{
+    let rafId = 0;
+    let pendingX = 0;
+    let hasPending = false;
+    const flush = ()=>{
+        if (!hasPending) return;
+        hasPending = false;
+        onUpdate(pendingX);
+    };
+    const onMove = (e)=>{
+        pendingX = e.clientX;
+        hasPending = true;
+        if (!rafId) {
+            rafId = window.requestAnimationFrame(()=>{
+                rafId = 0;
+                flush();
+            });
+        }
+    };
+    let ended = false;
+    const end = ()=>{
+        if (ended) return;
+        ended = true;
+        window.removeEventListener('mousemove', onMove);
+        window.removeEventListener('mouseup', end);
+        if (rafId) {
+            window.cancelAnimationFrame(rafId);
+            rafId = 0;
+        }
+        flush();
+        document.body.style.cursor = '';
+        document.body.style.userSelect = '';
+        onEnd?.();
+    };
+    document.body.style.cursor = cursor;
+    document.body.style.userSelect = 'none';
+    window.addEventListener('mousemove', onMove);
+    window.addEventListener('mouseup', end);
+    return end;
+};
+
+//# sourceMappingURL=drag.js.map

package/dist/internal/drag.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/internal/drag.ts"],"sourcesContent":["export type CoalescedDragHandlers = {\n  /** Runs at most once per animation frame with the latest pointer clientX. */\n  onUpdate: (clientX: number) => void\n  /** Runs once when the drag ends or is torn down, after the final flush. */\n  onEnd?: () => void\n}\n\n/**\n * Horizontal pointer drag: window mousemove/mouseup listeners that coalesce\n * moves into one onUpdate per frame and flush the final position on release.\n * Sets the body cursor + disables text selection. Returns a function to end it.\n */\nexport const startHorizontalDrag = (\n  cursor: string,\n  { onUpdate, onEnd }: CoalescedDragHandlers,\n): (() => void) => {\n  let rafId = 0\n  let pendingX = 0\n  let hasPending = false\n\n  const flush = (): void => {\n    if (!hasPending) return\n    hasPending = false\n    onUpdate(pendingX)\n  }\n\n  const onMove = (e: MouseEvent): void => {\n    pendingX = e.clientX\n    hasPending = true\n    if (!rafId) {\n      rafId = window.requestAnimationFrame(() => {\n        rafId = 0\n        flush()\n      })\n    }\n  }\n\n  let ended = false\n  const end = (): void => {\n    if (ended) return\n    ended = true\n    window.removeEventListener('mousemove', onMove)\n    window.removeEventListener('mouseup', end)\n    if (rafId) {\n      window.cancelAnimationFrame(rafId)\n      rafId = 0\n    }\n    flush()\n    document.body.style.cursor = ''\n    document.body.style.userSelect = ''\n    onEnd?.()\n  }\n\n  document.body.style.cursor = cursor\n  document.body.style.userSelect = 'none'\n  window.addEventListener('mousemove', onMove)\n  window.addEventListener('mouseup', end)\n\n  return end\n}\n"],"names":["startHorizontalDrag","cursor","onUpdate","onEnd","rafId","pendingX","hasPending","flush","onMove","e","clientX","window","requestAnimationFrame","ended","end","removeEventListener","cancelAnimationFrame","document","body","style","userSelect","addEventListener"],"mappings":"AAOA;;;;CAIC,GACD,OAAO,MAAMA,sBAAsB,CACjCC,QACA,EAAEC,QAAQ,EAAEC,KAAK,EAAyB;IAE1C,IAAIC,QAAQ;IACZ,IAAIC,WAAW;IACf,IAAIC,aAAa;IAEjB,MAAMC,QAAQ;QACZ,IAAI,CAACD,YAAY;QACjBA,aAAa;QACbJ,SAASG;IACX;IAEA,MAAMG,SAAS,CAACC;QACdJ,WAAWI,EAAEC,OAAO;QACpBJ,aAAa;QACb,IAAI,CAACF,OAAO;YACVA,QAAQO,OAAOC,qBAAqB,CAAC;gBACnCR,QAAQ;gBACRG;YACF;QACF;IACF;IAEA,IAAIM,QAAQ;IACZ,MAAMC,MAAM;QACV,IAAID,OAAO;QACXA,QAAQ;QACRF,OAAOI,mBAAmB,CAAC,aAAaP;QACxCG,OAAOI,mBAAmB,CAAC,WAAWD;QACtC,IAAIV,OAAO;YACTO,OAAOK,oBAAoB,CAACZ;YAC5BA,QAAQ;QACV;QACAG;QACAU,SAASC,IAAI,CAACC,KAAK,CAAClB,MAAM,GAAG;QAC7BgB,SAASC,IAAI,CAACC,KAAK,CAACC,UAAU,GAAG;QACjCjB;IACF;IAEAc,SAASC,IAAI,CAACC,KAAK,CAAClB,MAAM,GAAGA;IAC7BgB,SAASC,IAAI,CAACC,KAAK,CAACC,UAAU,GAAG;IACjCT,OAAOU,gBAAgB,CAAC,aAAab;IACrCG,OAAOU,gBAAgB,CAAC,WAAWP;IAEnC,OAAOA;AACT,EAAC"}

package/dist/internal/entities.d.ts

@@ -0,0 +1,6 @@
+/** Normalizes the `collections`/`globals` plugin option (a slug list OR a
+ * slug → options record) into a slug → blocksField map, applying the default
+ * where unset. */
+export declare const normalizeEntities: (option: string[] | Partial<Record<string, {
+    blocksField?: string;
+}>> | undefined, defaultBlocksField: string) => Map<string, string>;

package/dist/internal/entities.js

@@ -0,0 +1,15 @@
+/** Normalizes the `collections`/`globals` plugin option (a slug list OR a
+ * slug → options record) into a slug → blocksField map, applying the default
+ * where unset. */ export const normalizeEntities = (option, defaultBlocksField)=>{
+    const map = new Map();
+    if (Array.isArray(option)) {
+        for (const slug of option)map.set(slug, defaultBlocksField);
+    } else if (option) {
+        for (const [slug, cfg] of Object.entries(option)){
+            map.set(slug, cfg?.blocksField || defaultBlocksField);
+        }
+    }
+    return map;
+};
+
+//# sourceMappingURL=entities.js.map

package/dist/internal/entities.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/internal/entities.ts"],"sourcesContent":["/** Normalizes the `collections`/`globals` plugin option (a slug list OR a\n * slug → options record) into a slug → blocksField map, applying the default\n * where unset. */\nexport const normalizeEntities = (\n  option: string[] | Partial<Record<string, { blocksField?: string }>> | undefined,\n  defaultBlocksField: string,\n): Map<string, string> => {\n  const map = new Map<string, string>()\n  if (Array.isArray(option)) {\n    for (const slug of option) map.set(slug, defaultBlocksField)\n  } else if (option) {\n    for (const [slug, cfg] of Object.entries(option)) {\n      map.set(slug, cfg?.blocksField || defaultBlocksField)\n    }\n  }\n  return map\n}\n"],"names":["normalizeEntities","option","defaultBlocksField","map","Map","Array","isArray","slug","set","cfg","Object","entries","blocksField"],"mappings":"AAAA;;gBAEgB,GAChB,OAAO,MAAMA,oBAAoB,CAC/BC,QACAC;IAEA,MAAMC,MAAM,IAAIC;IAChB,IAAIC,MAAMC,OAAO,CAACL,SAAS;QACzB,KAAK,MAAMM,QAAQN,OAAQE,IAAIK,GAAG,CAACD,MAAML;IAC3C,OAAO,IAAID,QAAQ;QACjB,KAAK,MAAM,CAACM,MAAME,IAAI,IAAIC,OAAOC,OAAO,CAACV,QAAS;YAChDE,IAAIK,GAAG,CAACD,MAAME,KAAKG,eAAeV;QACpC;IACF;IACA,OAAOC;AACT,EAAC"}

package/dist/preview/hover-css.d.ts

@@ -1,7 +1,7 @@
 export declare const HOVER_STYLE_ID = "better-editor-hover-style";
 export declare const TOOLBAR_ID = "better-editor-block-toolbar";
 export declare const INTERACT_BODY_ATTR = "data-bee-interact";
-export declare const HOVER_CSS = "\n  body:not([data-bee-interact]) [data-better-editor-id] { cursor: pointer; }\n  body:not([data-bee-interact]) [data-better-editor-id]:hover,\n  body:not([data-bee-interact]) [data-better-editor-id].better-editor-active {\n    outline: var(--bee-outline-width) solid var(--bee-top);\n    outline-offset: calc(-1 * var(--bee-outline-width) - 1px);\n    background-color: color-mix(in srgb, var(--bee-top) 10%, transparent);\n  }\n  body:not([data-bee-interact]) [data-better-editor-id] [data-better-editor-id]:hover,\n  body:not([data-bee-interact]) [data-better-editor-id] [data-better-editor-id].better-editor-active {\n    outline-color: var(--bee-nested);\n    background-color: color-mix(in srgb, var(--bee-nested) 10%, transparent);\n  }\n  body[data-bee-interact] #better-editor-block-toolbar { display: none; }\n\n  #better-editor-block-toolbar {\n    position: absolute;\n    z-index: var(--better-editor-z-toolbar, 2147483647);\n    display: none;\n    gap: 2px;\n    padding: 3px;\n    border-radius: 4px;\n    background: var(--bee-top);\n    color: #fff;\n    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);\n    font-family: system-ui, sans-serif;\n  }\n  #better-editor-block-toolbar[data-nested=\"1\"] { background: var(--bee-nested); }\n  #better-editor-block-toolbar.is-visible { display: inline-flex; }\n  #better-editor-block-toolbar button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 26px;\n    height: 26px;\n    padding: 0;\n    border: 0;\n    border-radius: 3px;\n    background: transparent;\n    color: inherit;\n    cursor: pointer;\n  }\n  #better-editor-block-toolbar button:hover { background: rgba(255, 255, 255, 0.18); }\n  #better-editor-block-toolbar button[data-action=\"delete\"]:hover { background: rgba(0, 0, 0, 0.25); }\n";
+export declare const HOVER_CSS = "\n  body:not([data-bee-interact]) [data-better-editor-id] { cursor: pointer; }\n  body:not([data-bee-interact]) [data-better-editor-id]:hover,\n  body:not([data-bee-interact]) [data-better-editor-id].better-editor-active {\n    outline: var(--bee-outline-width) solid var(--bee-top);\n    outline-offset: calc(-1 * var(--bee-outline-width) - 1px);\n    box-shadow: inset 0 0 0 100vmax color-mix(in srgb, var(--bee-top) 10%, transparent);\n  }\n  body:not([data-bee-interact]) [data-better-editor-id] [data-better-editor-id]:hover,\n  body:not([data-bee-interact]) [data-better-editor-id] [data-better-editor-id].better-editor-active {\n    outline-color: var(--bee-nested);\n    box-shadow: inset 0 0 0 100vmax color-mix(in srgb, var(--bee-nested) 10%, transparent);\n  }\n  body[data-bee-interact] #better-editor-block-toolbar { display: none; }\n\n  #better-editor-block-toolbar {\n    position: absolute;\n    z-index: var(--better-editor-z-toolbar, 2147483647);\n    display: none;\n    gap: 2px;\n    padding: 3px;\n    border-radius: 4px;\n    background: var(--bee-top);\n    color: #fff;\n    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);\n    font-family: system-ui, sans-serif;\n  }\n  #better-editor-block-toolbar[data-nested=\"1\"] { background: var(--bee-nested); }\n  #better-editor-block-toolbar.is-visible { display: inline-flex; }\n  #better-editor-block-toolbar button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 26px;\n    height: 26px;\n    padding: 0;\n    border: 0;\n    border-radius: 3px;\n    background: transparent;\n    color: inherit;\n    cursor: pointer;\n  }\n  #better-editor-block-toolbar button:hover { background: rgba(255, 255, 255, 0.18); }\n  #better-editor-block-toolbar button[data-action=\"delete\"]:hover { background: rgba(0, 0, 0, 0.25); }\n";
 export type HoverVars = {
     topColor: string;
     nestedColor: string;

package/dist/preview/hover-css.js

@@ -14,12 +14,12 @@ export const HOVER_CSS = `
   body:not([${INTERACT_BODY_ATTR}]) [${BLOCK_ID_ATTR}].${ACTIVE_CLASS} {
     outline: var(${VAR_OUTLINE_WIDTH}) solid var(${VAR_TOP});
     outline-offset: calc(-1 * var(${VAR_OUTLINE_WIDTH}) - 1px);
-    background-color: color-mix(in srgb, var(${VAR_TOP}) 10%, transparent);
+    box-shadow: inset 0 0 0 100vmax color-mix(in srgb, var(${VAR_TOP}) 10%, transparent);
   }
   body:not([${INTERACT_BODY_ATTR}]) [${BLOCK_ID_ATTR}] [${BLOCK_ID_ATTR}]:hover,
   body:not([${INTERACT_BODY_ATTR}]) [${BLOCK_ID_ATTR}] [${BLOCK_ID_ATTR}].${ACTIVE_CLASS} {
     outline-color: var(${VAR_NESTED});
-    background-color: color-mix(in srgb, var(${VAR_NESTED}) 10%, transparent);
+    box-shadow: inset 0 0 0 100vmax color-mix(in srgb, var(${VAR_NESTED}) 10%, transparent);
   }
   body[${INTERACT_BODY_ATTR}] #${TOOLBAR_ID} { display: none; }