@payloadcms/richtext-lexical 4.0.0-internal.a0ef1b8 → 4.0.0-internal.a2d053c

package/dist/features/toolbars/shared/ToolbarDropdown/DropDown.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropDown.js","names":["Button","$addUpdateTag","isDOMNode","React","useCallback","useEffect","useMemo","useRef","useState","createPortal","baseClass","DropDownContext","createContext","DropDownItem","active","children","editor","enabled","Icon","item","itemKey","tooltip","className","key","filter","Boolean","join","ref","dropDownContext","use","Error","registerItem","current","_jsx","buttonStyle","disabled","extraButtonProps","icon","iconPosition","onClick","focus","update","onSelect","isActive","onMouseDown","e","preventDefault","type","DropDownItems","dropdownKey","dropDownRef","itemsContainerClassNames","onClose","items","setItems","highlightedItem","setHighlightedItem","itemRef","prev","handleKeyDown","event","includes","index","indexOf","length","contextValue","value","onKeyDown","DropDown","buttonAriaLabel","buttonClassName","label","stopCloseOnClickSelf","buttonRef","showDropDown","setShowDropDown","handleClose","button","dropDown","left","top","getBoundingClientRect","scrollTopOffset","window","scrollY","document","documentElement","scrollTop","style","offsetHeight","Math","min","innerWidth","offsetWidth","handle","target","contains","addEventListener","removeEventListener","portal","body","_jsxs","Fragment"],"sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/DropDown.tsx"],"sourcesContent":["'use client'\nimport { Button } from '@payloadcms/ui'\nimport { $addUpdateTag, isDOMNode, type LexicalEditor } from 'lexical'\nimport React, { type ReactNode, useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\n\nimport type { ToolbarGroupItem } from '../../types.js'\n\nconst baseClass = 'toolbar-popup__dropdown-item'\n\ninterface DropDownContextType {\n  registerItem: (ref: React.RefObject<HTMLButtonElement | null>) => void\n}\n\nconst DropDownContext = React.createContext<DropDownContextType | null>(null)\n\nexport function DropDownItem({\n  active,\n  children,\n  editor,\n  enabled,\n  Icon,\n  item,\n  itemKey,\n  tooltip,\n}: {\n  active?: boolean\n  children: React.ReactNode\n  editor: LexicalEditor\n  enabled?: boolean\n  Icon: React.ReactNode\n  item: ToolbarGroupItem\n  itemKey: string\n  tooltip?: string\n}): React.ReactNode {\n  const className = useMemo(() => {\n    return [\n      baseClass,\n      enabled === false ? 'disabled' : '',\n      active ? 'active' : '',\n      item?.key ? `${baseClass}-${item.key}` : '',\n    ]\n      .filter(Boolean)\n      .join(' ')\n  }, [enabled, active, item.key])\n\n  const ref = useRef<HTMLButtonElement>(null)\n\n  const dropDownContext = React.use(DropDownContext)\n\n  if (dropDownContext === null) {\n    throw new Error('DropDownItem must be used within a DropDown')\n  }\n\n  const { registerItem } = dropDownContext\n\n  useEffect(() => {\n    if (ref?.current != null) {\n      registerItem(ref)\n    }\n  }, [ref, registerItem])\n\n  return (\n    <Button\n      aria-label={tooltip}\n      buttonStyle=\"ghost\"\n      className={className}\n      disabled={enabled === false}\n      extraButtonProps={{\n        'data-item-key': itemKey,\n      }}\n      icon={Icon}\n      iconPosition=\"left\"\n      onClick={() => {\n        if (enabled !== false) {\n          editor.focus(() => {\n            editor.update(() => {\n              $addUpdateTag('toolbar')\n            })\n            // We need to wrap the onSelect in the callback, so the editor is properly focused before the onSelect is called.\n            item.onSelect?.({\n              editor,\n              isActive: active!,\n            })\n          })\n        }\n      }}\n      onMouseDown={(e) => {\n        // This is required for Firefox compatibility. Without it, the dropdown will disappear without the onClick being called.\n        // This only happens in Firefox. Must be something about how Firefox handles focus events differently.\n        e.preventDefault()\n      }}\n      ref={ref}\n      tooltip={tooltip}\n      type=\"button\"\n    >\n      {children}\n    </Button>\n  )\n}\n\nfunction DropDownItems({\n  children,\n  dropdownKey,\n  dropDownRef,\n  itemsContainerClassNames,\n  onClose,\n}: {\n  children: React.ReactNode\n  dropdownKey?: string\n  dropDownRef: React.Ref<HTMLDivElement>\n  itemsContainerClassNames?: string[]\n  onClose: () => void\n}): React.ReactElement {\n  const [items, setItems] = useState<Array<React.RefObject<HTMLButtonElement | null>>>()\n  const [highlightedItem, setHighlightedItem] =\n    useState<React.RefObject<HTMLButtonElement | null>>()\n\n  const registerItem = useCallback(\n    (itemRef: React.RefObject<HTMLButtonElement | null>) => {\n      setItems((prev) => (prev != null ? [...prev, itemRef] : [itemRef]))\n    },\n    [setItems],\n  )\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>): void => {\n    if (items == null) {\n      return\n    }\n\n    const { key } = event\n\n    if (['ArrowDown', 'ArrowUp', 'Escape', 'Tab'].includes(key)) {\n      event.preventDefault()\n    }\n\n    if (key === 'Escape' || key === 'Tab') {\n      onClose()\n    } else if (key === 'ArrowUp') {\n      setHighlightedItem((prev) => {\n        if (prev == null) {\n          return items[0]\n        }\n        const index = items.indexOf(prev) - 1\n        return items[index === -1 ? items.length - 1 : index]\n      })\n    } else if (key === 'ArrowDown') {\n      setHighlightedItem((prev) => {\n        if (prev == null) {\n          return items[0]\n        }\n        return items[items.indexOf(prev) + 1]\n      })\n    }\n  }\n\n  const contextValue = useMemo(\n    () => ({\n      registerItem,\n    }),\n    [registerItem],\n  )\n\n  useEffect(() => {\n    if (items != null && highlightedItem == null) {\n      setHighlightedItem(items[0])\n    }\n\n    if (highlightedItem != null && highlightedItem?.current != null) {\n      highlightedItem.current.focus()\n    }\n  }, [items, highlightedItem])\n\n  return (\n    <DropDownContext value={contextValue}>\n      <div\n        className={(itemsContainerClassNames ?? ['toolbar-popup__dropdown-items']).join(' ')}\n        data-dropdown-key={dropdownKey}\n        data-theme=\"dark\"\n        onKeyDown={handleKeyDown}\n        ref={dropDownRef}\n      >\n        {children}\n      </div>\n    </DropDownContext>\n  )\n}\n\nexport function DropDown({\n  buttonAriaLabel,\n  buttonClassName,\n  children,\n  disabled = false,\n  dropdownKey,\n  Icon,\n  itemsContainerClassNames,\n  label,\n  stopCloseOnClickSelf,\n}: {\n  buttonAriaLabel?: string\n  buttonClassName: string\n  children: ReactNode\n  disabled?: boolean\n  dropdownKey: string\n  Icon?: React.FC\n  itemsContainerClassNames?: string[]\n  label?: string\n  stopCloseOnClickSelf?: boolean\n}): React.ReactNode {\n  const dropDownRef = useRef<HTMLDivElement>(null)\n  const buttonRef = useRef<HTMLButtonElement>(null)\n  const [showDropDown, setShowDropDown] = useState(false)\n\n  const handleClose = (): void => {\n    setShowDropDown(false)\n    if (buttonRef?.current != null) {\n      buttonRef.current.focus()\n    }\n  }\n\n  useEffect(() => {\n    const button = buttonRef.current\n    const dropDown = dropDownRef.current\n\n    if (showDropDown && button !== null && dropDown !== null) {\n      const { left, top } = button.getBoundingClientRect()\n      const scrollTopOffset = window.scrollY || document.documentElement.scrollTop\n      dropDown.style.top = `${top + scrollTopOffset + button.offsetHeight + 5}px`\n      dropDown.style.left = `${Math.min(left - 5, window.innerWidth - dropDown.offsetWidth - 20)}px`\n    }\n  }, [dropDownRef, buttonRef, showDropDown])\n\n  useEffect(() => {\n    const button = buttonRef.current\n\n    if (button !== null && showDropDown) {\n      const handle = (event: MouseEvent): void => {\n        const target = event.target\n        if (!isDOMNode(target)) {\n          return\n        }\n        if (stopCloseOnClickSelf) {\n          if (dropDownRef.current && dropDownRef.current.contains(target)) {\n            return\n          }\n        }\n        if (!button.contains(target)) {\n          setShowDropDown(false)\n        }\n      }\n      document.addEventListener('click', handle)\n\n      return () => {\n        document.removeEventListener('click', handle)\n      }\n    }\n  }, [dropDownRef, buttonRef, showDropDown, stopCloseOnClickSelf])\n\n  const portal = createPortal(\n    <DropDownItems\n      dropdownKey={dropdownKey}\n      dropDownRef={dropDownRef}\n      itemsContainerClassNames={itemsContainerClassNames}\n      onClose={handleClose}\n    >\n      {children}\n    </DropDownItems>,\n    document.body,\n  )\n\n  return (\n    <React.Fragment>\n      <button\n        aria-label={buttonAriaLabel}\n        className={buttonClassName + (showDropDown ? ' active' : '')}\n        data-dropdown-key={dropdownKey}\n        disabled={disabled}\n        onClick={(event) => {\n          event.preventDefault()\n          setShowDropDown(!showDropDown)\n        }}\n        onMouseDown={(e) => {\n          // This fixes a bug where you are unable to click the button if you are in a NESTED editor (editor in blocks field in editor).\n          // Thus only happens if you click on the SVG of the button. Clicking on the outside works. Related issue: https://github.com/payloadcms/payload/issues/4025\n          // TODO: Find out why exactly it happens and why e.preventDefault() on the mouseDown fixes it. Write that down here, or potentially fix a root cause, if there is any.\n          e.preventDefault()\n        }}\n        ref={buttonRef}\n        type=\"button\"\n      >\n        {Icon && <Icon />}\n        {label && <span className=\"toolbar-popup__dropdown-label\">{label}</span>}\n        <i className=\"toolbar-popup__dropdown-caret\" />\n      </button>\n\n      {showDropDown && <React.Fragment>{portal}</React.Fragment>}\n    </React.Fragment>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"DropDown.js","names":["c","_c","Button","$addUpdateTag","isDOMNode","React","useCallback","useEffect","useId","useMemo","useRef","useState","baseClass","DropDownContext","createContext","DropDownItem","active","children","editor","enabled","Icon","item","itemKey","tooltip","className","key","filter","Boolean","join","ref","dropDownContext","use","Error","registerItem","current","_jsx","buttonStyle","disabled","extraButtonProps","isActive","undefined","role","tabIndex","icon","iconPosition","onClick","focus","update","onSelect","onMouseDown","e","preventDefault","type","DropDownItems","t0","$","id","dropdownKey","dropDownRef","itemsContainerClassNames","onClose","shouldAutoFocus","items","setItems","highlightedItem","setHighlightedItem","t1","Symbol","for","itemRef","prev","t2","event","enabledItems","_temp","includes","setTimeout","restoreFocus","prev_0","index","indexOf","length","prev_1","index_0","handleKeyDown","t3","contextValue","t4","t5","find","_temp2","t6","value","onKeyDown","popover","item_0","DropDown","buttonAriaLabel","buttonClassName","label","stopCloseOnClickSelf","buttonRef","openedViaKeyboardRef","generatedId","menuId","showDropDown","setShowDropDown","handleClose","button","dropDown","matches","showPopover","updatePosition","bottom","left","top","getBoundingClientRect","offset","gap","below","above","offsetHeight","maxTop","Math","max","window","innerHeight","preferredTop","style","position","min","innerWidth","offsetWidth","addEventListener","capture","passive","removeEventListener","handle","target","contains","document","_jsxs","Fragment"],"sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/DropDown.tsx"],"sourcesContent":["'use client'\nimport { Button } from '@payloadcms/ui'\nimport { $addUpdateTag, isDOMNode, type LexicalEditor } from 'lexical'\nimport React, {\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\n\nimport type { ToolbarGroupItem } from '../../types.js'\n\nconst baseClass = 'toolbar-popup__dropdown-item'\n\ninterface DropDownContextType {\n  registerItem: (ref: React.RefObject<HTMLButtonElement | null>) => void\n}\n\nconst DropDownContext = React.createContext<DropDownContextType | null>(null)\n\nexport function DropDownItem({\n  active,\n  children,\n  editor,\n  enabled,\n  Icon,\n  item,\n  itemKey,\n  tooltip,\n}: {\n  active?: boolean\n  children: React.ReactNode\n  editor: LexicalEditor\n  enabled?: boolean\n  Icon: React.ReactNode\n  item: ToolbarGroupItem\n  itemKey: string\n  tooltip?: string\n}): React.ReactNode {\n  const className = useMemo(() => {\n    return [\n      baseClass,\n      enabled === false ? 'disabled' : '',\n      active ? 'active' : '',\n      item?.key ? `${baseClass}-${item.key}` : '',\n    ]\n      .filter(Boolean)\n      .join(' ')\n  }, [enabled, active, item.key])\n\n  const ref = useRef<HTMLButtonElement>(null)\n\n  const dropDownContext = React.use(DropDownContext)\n\n  if (dropDownContext === null) {\n    throw new Error('DropDownItem must be used within a DropDown')\n  }\n\n  const { registerItem } = dropDownContext\n\n  useEffect(() => {\n    if (ref?.current != null) {\n      registerItem(ref)\n    }\n  }, [ref, registerItem])\n\n  return (\n    <Button\n      aria-label={tooltip}\n      buttonStyle=\"ghost\"\n      className={className}\n      disabled={enabled === false}\n      extraButtonProps={{\n        'aria-checked': item.isActive ? Boolean(active) : undefined,\n        'data-item-key': itemKey,\n        role: item.isActive ? 'menuitemcheckbox' : 'menuitem',\n        tabIndex: -1,\n      }}\n      icon={Icon}\n      iconPosition=\"left\"\n      onClick={() => {\n        if (enabled !== false) {\n          editor.focus(() => {\n            editor.update(() => {\n              $addUpdateTag('toolbar')\n            })\n            // We need to wrap the onSelect in the callback, so the editor is properly focused before the onSelect is called.\n            item.onSelect?.({\n              editor,\n              isActive: active!,\n            })\n          })\n        }\n      }}\n      onMouseDown={(e: React.MouseEvent) => {\n        // This is required for Firefox compatibility. Without it, the dropdown will disappear without the onClick being called.\n        // This only happens in Firefox. Must be something about how Firefox handles focus events differently.\n        e.preventDefault()\n      }}\n      ref={ref}\n      tooltip={tooltip}\n      type=\"button\"\n    >\n      {children}\n    </Button>\n  )\n}\n\nfunction DropDownItems({\n  id,\n  children,\n  dropdownKey,\n  dropDownRef,\n  itemsContainerClassNames,\n  onClose,\n  shouldAutoFocus,\n}: {\n  children: React.ReactNode\n  dropdownKey?: string\n  dropDownRef: React.Ref<HTMLDivElement>\n  id: string\n  itemsContainerClassNames?: string[]\n  onClose: (options?: { restoreFocus?: boolean }) => void\n  shouldAutoFocus: boolean\n}): React.ReactElement {\n  const [items, setItems] = useState<Array<React.RefObject<HTMLButtonElement | null>>>()\n  const [highlightedItem, setHighlightedItem] =\n    useState<React.RefObject<HTMLButtonElement | null>>()\n\n  const registerItem = useCallback(\n    (itemRef: React.RefObject<HTMLButtonElement | null>) => {\n      setItems((prev) => (prev != null ? [...prev, itemRef] : [itemRef]))\n    },\n    [setItems],\n  )\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>): void => {\n    if (items == null) {\n      return\n    }\n\n    const { key } = event\n    const enabledItems = items.filter((item) => !item.current?.disabled)\n\n    if (['ArrowDown', 'ArrowUp', 'Escape'].includes(key)) {\n      event.preventDefault()\n    }\n\n    if (key === 'Escape') {\n      onClose()\n    } else if (key === 'Tab') {\n      setTimeout(() => onClose({ restoreFocus: false }))\n    } else if (key === 'ArrowUp') {\n      setHighlightedItem((prev) => {\n        if (prev == null) {\n          return enabledItems[0]\n        }\n        const index = enabledItems.indexOf(prev) - 1\n        return enabledItems[index === -1 ? enabledItems.length - 1 : index]\n      })\n    } else if (key === 'ArrowDown') {\n      setHighlightedItem((prev) => {\n        if (prev == null) {\n          return enabledItems[0]\n        }\n        const index = enabledItems.indexOf(prev)\n        return enabledItems[index === enabledItems.length - 1 ? 0 : index + 1]\n      })\n    }\n  }\n\n  const contextValue = useMemo(\n    () => ({\n      registerItem,\n    }),\n    [registerItem],\n  )\n\n  useEffect(() => {\n    if (shouldAutoFocus && items != null && highlightedItem == null) {\n      setHighlightedItem(items.find((item) => !item.current?.disabled))\n    }\n\n    if (highlightedItem != null && highlightedItem?.current != null) {\n      highlightedItem.current.focus()\n    }\n  }, [items, highlightedItem, shouldAutoFocus])\n\n  return (\n    <DropDownContext value={contextValue}>\n      <div\n        className={(itemsContainerClassNames ?? ['toolbar-popup__dropdown-items']).join(' ')}\n        data-dropdown-key={dropdownKey}\n        data-theme=\"dark\"\n        id={id}\n        onKeyDown={handleKeyDown}\n        popover=\"manual\"\n        ref={dropDownRef}\n        role=\"menu\"\n        tabIndex={-1}\n      >\n        {children}\n      </div>\n    </DropDownContext>\n  )\n}\n\nexport function DropDown({\n  buttonAriaLabel,\n  buttonClassName,\n  children,\n  disabled = false,\n  dropdownKey,\n  Icon,\n  itemsContainerClassNames,\n  label,\n  stopCloseOnClickSelf,\n}: {\n  buttonAriaLabel?: string\n  buttonClassName: string\n  children: ReactNode\n  disabled?: boolean\n  dropdownKey: string\n  Icon?: React.FC\n  itemsContainerClassNames?: string[]\n  label?: string\n  stopCloseOnClickSelf?: boolean\n}): React.ReactNode {\n  const dropDownRef = useRef<HTMLDivElement>(null)\n  const buttonRef = useRef<HTMLButtonElement>(null)\n  const openedViaKeyboardRef = useRef(false)\n  const generatedId = useId()\n  const menuId = `toolbar-dropdown-${dropdownKey}-${generatedId}`\n  const [showDropDown, setShowDropDown] = useState(false)\n\n  const handleClose = ({ restoreFocus = true }: { restoreFocus?: boolean } = {}): void => {\n    setShowDropDown(false)\n    if (restoreFocus && buttonRef?.current != null) {\n      buttonRef.current.focus()\n    }\n  }\n\n  useEffect(() => {\n    const button = buttonRef.current\n    const dropDown = dropDownRef.current\n\n    if (showDropDown && button !== null && dropDown !== null) {\n      if (!dropDown.matches(':popover-open')) {\n        dropDown.showPopover()\n      }\n\n      const updatePosition = (): void => {\n        const { bottom, left, top } = button.getBoundingClientRect()\n        const offset = 8\n        const gap = 5\n        const below = bottom + gap\n        const above = top - dropDown.offsetHeight - gap\n        const maxTop = Math.max(offset, window.innerHeight - dropDown.offsetHeight - offset)\n        const preferredTop =\n          below + dropDown.offsetHeight + offset <= window.innerHeight\n            ? below\n            : above >= offset\n              ? above\n              : below\n\n        dropDown.style.position = 'fixed'\n        dropDown.style.top = `${Math.max(offset, Math.min(preferredTop, maxTop))}px`\n        dropDown.style.left = `${Math.max(8, Math.min(left - 5, window.innerWidth - dropDown.offsetWidth - 20))}px`\n      }\n\n      updatePosition()\n      window.addEventListener('resize', updatePosition)\n      window.addEventListener('scroll', updatePosition, { capture: true, passive: true })\n\n      return () => {\n        window.removeEventListener('resize', updatePosition)\n        window.removeEventListener('scroll', updatePosition, { capture: true })\n      }\n    }\n  }, [dropDownRef, buttonRef, showDropDown])\n\n  useEffect(() => {\n    const button = buttonRef.current\n\n    if (button !== null && showDropDown) {\n      const handle = (event: MouseEvent): void => {\n        const target = event.target\n        if (!isDOMNode(target)) {\n          return\n        }\n        if (stopCloseOnClickSelf) {\n          if (dropDownRef.current && dropDownRef.current.contains(target)) {\n            return\n          }\n        }\n        if (!button.contains(target)) {\n          setShowDropDown(false)\n        }\n      }\n      document.addEventListener('click', handle)\n\n      return () => {\n        document.removeEventListener('click', handle)\n      }\n    }\n  }, [dropDownRef, buttonRef, showDropDown, stopCloseOnClickSelf])\n\n  return (\n    <React.Fragment>\n      <button\n        aria-controls={menuId}\n        aria-expanded={showDropDown}\n        aria-haspopup=\"menu\"\n        aria-label={buttonAriaLabel}\n        className={buttonClassName + (showDropDown ? ' active' : '')}\n        data-dropdown-key={dropdownKey}\n        disabled={disabled}\n        onClick={(event) => {\n          event.preventDefault()\n          openedViaKeyboardRef.current = false\n          setShowDropDown(!showDropDown)\n        }}\n        onKeyDown={(event) => {\n          if (event.key === 'Enter' || event.key === ' ') {\n            event.preventDefault()\n            openedViaKeyboardRef.current = true\n            setShowDropDown(!showDropDown)\n          }\n        }}\n        onMouseDown={(e) => {\n          // This fixes a bug where you are unable to click the button if you are in a NESTED editor (editor in blocks field in editor).\n          // Thus only happens if you click on the SVG of the button. Clicking on the outside works. Related issue: https://github.com/payloadcms/payload/issues/4025\n          // TODO: Find out why exactly it happens and why e.preventDefault() on the mouseDown fixes it. Write that down here, or potentially fix a root cause, if there is any.\n          e.preventDefault()\n        }}\n        ref={buttonRef}\n        type=\"button\"\n      >\n        {Icon && <Icon />}\n        {label && <span className=\"toolbar-popup__dropdown-label\">{label}</span>}\n        <i className=\"toolbar-popup__dropdown-caret\" />\n      </button>\n\n      {showDropDown && (\n        <DropDownItems\n          dropdownKey={dropdownKey}\n          dropDownRef={dropDownRef}\n          id={menuId}\n          itemsContainerClassNames={itemsContainerClassNames}\n          onClose={handleClose}\n          shouldAutoFocus={openedViaKeyboardRef.current}\n        >\n          {children}\n        </DropDownItems>\n      )}\n    </React.Fragment>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/toolbars/shared/ToolbarDropdown/index.css

@@ -19,7 +19,6 @@
     border-radius: var(--radius-medium);
     cursor: pointer;
     position: relative;
-    transition: background-color 0.15s cubic-bezier(0, 0.2, 0.2, 1);
     min-width: calc(var(--spacer-4) + var(--spacer-2-5));
 
     &:disabled {
@@ -60,7 +59,7 @@
     align-items: center;
     justify-content: center;
     width: 6px;
-    margin: 0 4px 0 2px;
+    margin: 0 var(--spacer-1) 0 calc(var(--spacer-1) / 2);
     height: 4px;
     background-color: var(--color-icon);
     mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='4' viewBox='0 0 6 4' fill='none'%3E%3Cpath d='M4.38921 0.146406C4.58445 -0.0488286 4.90098 -0.0487744 5.09624 0.146406C5.29151 0.341668 5.29151 0.658175 5.09624 0.853437L2.97515 2.97453C2.77987 3.16959 2.46332 3.16972 2.26812 2.97453L0.146049 0.853437C-0.0487219 0.6583 -0.0486443 0.341591 0.146049 0.146406C0.341285 -0.0488288 0.658788 -0.0487749 0.854057 0.146406L2.62164 1.91398L4.38921 0.146406Z' fill='black'/%3E%3C/svg%3E");
@@ -71,25 +70,23 @@
   .toolbar-popup__dropdown-items {
     --dropdown-min-width: 5rem;
     position: absolute;
+    inset: auto;
+    margin: 0;
     background: var(--color-bg-elevated);
     color: var(--color-text);
     border-radius: var(--radius-large);
     padding: var(--spacer-2);
     min-width: var(--dropdown-min-width);
+    max-height: calc(100vh - var(--spacer-3));
+    overflow-y: auto;
     z-index: 100;
-    box-shadow:
-      0 2px 6px 0 rgba(0, 0, 0, 0.12),
-      0 10px 16px 0 rgba(0, 0, 0, 0.08),
-      0 0 0.5px 0 rgba(0, 0, 0, 0.12),
-      0 0 0 1px rgba(0, 0, 0, 0.04);
+    box-shadow: var(--elevation-300-tooltip);
 
     .toolbar-popup__dropdown-item {
       all: unset;
       cursor: pointer;
       color: var(--color-text);
-      transition: background-color 0.15s cubic-bezier(0, 0.2, 0.2, 1);
       position: relative;
-      font-family: var(--text-body-medium-font-family);
       font-size: var(--text-body-medium-font-size);
       font-weight: var(--text-body-medium-font-weight);
       line-height: var(--text-body-medium-line-height);
@@ -101,7 +98,7 @@
       display: flex;
       align-items: center;
       gap: var(--spacer-1);
-      margin-right: -var(--spacer-3);
+      margin-inline-end: -var(--spacer-3);
 
       .text {
         overflow: hidden;
@@ -168,15 +165,15 @@
       }
 
       .btn__tooltip {
-        background-color: var(--ramp-grey-900);
-        color: var(--ramp-grey-100);
+        background-color: var(--color-bg-tooltip);
+        color: var(--color-text-ontooltip);
 
         &.tooltip--position-top::after {
-          border-top-color: var(--ramp-grey-900);
+          border-top-color: var(--color-bg-tooltip);
         }
 
         &.tooltip--position-bottom::after {
-          border-bottom-color: var(--ramp-grey-900);
+          border-bottom-color: var(--color-bg-tooltip);
         }
       }
     }
@@ -191,20 +188,21 @@
   }
 
   [data-dropdown-key='text'] {
-    & .toolbar-popup__dropdown-item {
-      padding: 0 var(--spacer-4);
+    /* Reserved on every item, not just the active one, so the checkmark never overlaps the item icon. */
+    & .toolbar-popup__dropdown-item::before {
+      content: '';
+      flex-shrink: 0;
+      width: var(--spacer-3);
+      height: var(--spacer-3);
+      background-color: currentColor;
+      mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M12.277 3.584a.5.5 0 0 1 .139.693l-5 7.5a.5.5 0 0 1-.77.077l-3-3a.5.5 0 0 1 .708-.708l2.568 2.57 4.662-6.993a.5.5 0 0 1 .693-.139' fill='black'/%3E%3C/svg%3E");
+      mask-size: contain;
+      mask-repeat: no-repeat;
+      visibility: hidden;
     }
 
     & .toolbar-popup__dropdown-item.active::before {
-      content: '';
-      position: absolute;
-      left: var(--spacer-2-5);
-      top: 50%;
-      width: var(--spacer-1);
-      height: var(--spacer-2);
-      border: solid var(--color-text-onselected-strong);
-      border-width: 0 1px 1px 0;
-      transform: translateY(-60%) rotate(45deg);
+      visibility: visible;
     }
 
     .btn__icon {

package/dist/features/toolbars/shared/ToolbarDropdown/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAkB,MAAM,OAAO,CAAA;AAItC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAI5C,OAAO,KAAK,EAAE,oBAAoB,EAAoB,MAAM,gBAAgB,CAAA;AAC5E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAG/D,OAAO,aAAa,CAAA;AAsEpB,eAAO,MAAM,eAAe,GAAI,+FAS7B;IACD,UAAU,EAAE,WAAW,CAAA;IACvB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,MAAM,EAAE,aAAa,CAAA;IACrB,KAAK,EAAE,oBAAoB,CAAA;IAC3B,UAAU,EAAE,iBAAiB,CAAA;IAC7B,IAAI,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;IACf,wBAAwB,CAAC,EAAE,MAAM,EAAE,CAAA;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,sBAmCA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAkB,MAAM,OAAO,CAAA;AAItC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAI5C,OAAO,KAAK,EAAE,oBAAoB,EAAoB,MAAM,gBAAgB,CAAA;AAC5E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAG/D,OAAO,aAAa,CAAA;AAsEpB,eAAO,MAAM,eAAe,kGASzB;IACD,UAAU,EAAE,WAAW,CAAA;IACvB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,MAAM,EAAE,aAAa,CAAA;IACrB,KAAK,EAAE,oBAAoB,CAAA;IAC3B,UAAU,EAAE,iBAAiB,CAAA;IAC7B,IAAI,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;IACf,wBAAwB,CAAC,EAAE,MAAM,EAAE,CAAA;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,sBA+CA,CAAA"}

package/dist/features/toolbars/shared/ToolbarDropdown/index.js

@@ -107,18 +107,34 @@ export const ToolbarDropdown = ({
     items,
     key: groupKey
   } = group;
+  const {
+    i18n
+  } = useTranslation();
+  const {
+    fieldProps: {
+      featureClientSchemaMap,
+      schemaPath
+    }
+  } = useEditorConfigContext();
+  const activeItemLabels = groupState.activeItems.map(item => typeof item.label === 'function' ? item.label({
+    featureClientSchemaMap,
+    i18n,
+    schemaPath
+  }) : item.label || item.key);
+  const dropdownLabel = groupKey === 'text' ? i18n.t('lexical:general:textStyle') : undefined;
+  const buttonAriaLabel = [...new Set([label, ...activeItemLabels, dropdownLabel].filter(Boolean))].join(', ') || groupKey;
   const renderedItems = useMemo(() => {
-    return items?.length ? items.map(item => /*#__PURE__*/_jsx(MemoToolbarItem, {
-      active: groupState.activeItemKeys.includes(item.key),
+    return items?.length ? items.map(item_0 => /*#__PURE__*/_jsx(MemoToolbarItem, {
+      active: groupState.activeItemKeys.includes(item_0.key),
       anchorElem: anchorElem,
       editor: editor,
-      enabled: groupState.enabledItemKeys.includes(item.key),
+      enabled: groupState.enabledItemKeys.includes(item_0.key),
       iconOnly: group.iconOnly,
-      item: item
-    }, item.key)) : null;
+      item: item_0
+    }, item_0.key)) : null;
   }, [items, groupState.activeItemKeys, groupState.enabledItemKeys, anchorElem, editor]);
   return /*#__PURE__*/_jsx(DropDown, {
-    buttonAriaLabel: `${groupKey} dropdown`,
+    buttonAriaLabel: buttonAriaLabel,
     buttonClassName: [baseClass, `${baseClass}-${groupKey}`, ...(classNames || [])].filter(Boolean).join(' '),
     disabled: !groupState.enabledGroup,
     dropdownKey: groupKey,

package/dist/features/toolbars/shared/ToolbarDropdown/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useMemo","baseClass","useTranslation","useEditorConfigContext","DropDown","DropDownItem","ToolbarItem","t0","$","active","anchorElem","editor","enabled","iconOnly","item","i18n","fieldProps","t1","featureClientSchemaMap","schemaPath","Component","t2","_jsx","key","title","croppedTitle","label","length","substring","Icon","ChildComponent","undefined","itemKey","tooltip","children","className","MemoToolbarItem","memo","ToolbarDropdown","classNames","group","groupState","itemsContainerClassNames","items","groupKey","renderedItems","map","activeItemKeys","includes","enabledItemKeys","buttonAriaLabel","buttonClassName","filter","Boolean","join","disabled","enabledGroup","dropdownKey"],"sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/index.tsx"],"sourcesContent":["'use client'\nimport React, { useMemo } from 'react'\n\nconst baseClass = 'toolbar-popup__dropdown'\n\nimport type { LexicalEditor } from 'lexical'\n\nimport { useTranslation } from '@payloadcms/ui'\n\nimport type { ToolbarDropdownGroup, ToolbarGroupItem } from '../../types.js'\nimport type { ToolbarGroupState } from '../useToolbarStates.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport './index.css'\nimport { DropDown, DropDownItem } from './DropDown.js'\n\nconst ToolbarItem = ({\n  active,\n  anchorElem,\n  editor,\n  enabled,\n  iconOnly,\n  item,\n}: {\n  active?: boolean\n  anchorElem: HTMLElement\n  editor: LexicalEditor\n  enabled?: boolean\n  iconOnly?: boolean\n  item: ToolbarGroupItem\n}) => {\n  const { i18n } = useTranslation<{}, string>()\n  const {\n    fieldProps: { featureClientSchemaMap, schemaPath },\n  } = useEditorConfigContext()\n\n  if (item.Component) {\n    return (\n      item?.Component && (\n        <item.Component\n          active={active}\n          anchorElem={anchorElem}\n          editor={editor}\n          enabled={enabled}\n          item={item}\n          key={item.key}\n        />\n      )\n    )\n  }\n\n  let title = item.key\n  let croppedTitle = item.key\n  if (item.label) {\n    title =\n      typeof item.label === 'function'\n        ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n        : item.label\n  }\n  if (title.length > 25) {\n    croppedTitle = title.substring(0, 25) + '...'\n  } else {\n    croppedTitle = title\n  }\n\n  return (\n    <DropDownItem\n      active={active}\n      editor={editor}\n      enabled={enabled}\n      Icon={item?.ChildComponent ? <item.ChildComponent /> : undefined}\n      item={item}\n      itemKey={item.key}\n      key={item.key}\n      tooltip={iconOnly ? title : undefined}\n    >\n      <span className=\"text\">{croppedTitle}</span>\n    </DropDownItem>\n  )\n}\n\nconst MemoToolbarItem = React.memo(ToolbarItem)\n\nexport const ToolbarDropdown = ({\n  anchorElem,\n  classNames,\n  editor,\n  group,\n  groupState,\n  Icon,\n  itemsContainerClassNames,\n  label,\n}: {\n  anchorElem: HTMLElement\n  classNames?: string[]\n  editor: LexicalEditor\n  group: ToolbarDropdownGroup\n  groupState: ToolbarGroupState\n  Icon?: React.FC\n  itemsContainerClassNames?: string[]\n  label?: string\n}) => {\n  const { items, key: groupKey } = group\n\n  const renderedItems = useMemo(() => {\n    return items?.length\n      ? items.map((item) => (\n          <MemoToolbarItem\n            active={groupState.activeItemKeys.includes(item.key)}\n            anchorElem={anchorElem}\n            editor={editor}\n            enabled={groupState.enabledItemKeys.includes(item.key)}\n            iconOnly={group.iconOnly}\n            item={item}\n            key={item.key}\n          />\n        ))\n      : null\n  }, [items, groupState.activeItemKeys, groupState.enabledItemKeys, anchorElem, editor])\n\n  return (\n    <DropDown\n      buttonAriaLabel={`${groupKey} dropdown`}\n      buttonClassName={[baseClass, `${baseClass}-${groupKey}`, ...(classNames || [])]\n        .filter(Boolean)\n        .join(' ')}\n      disabled={!groupState.enabledGroup}\n      dropdownKey={groupKey}\n      Icon={Icon}\n      itemsContainerClassNames={[`${baseClass}-items`, ...(itemsContainerClassNames || [])]}\n      key={groupKey}\n      label={label}\n    >\n      {renderedItems}\n    </DropDown>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useMemo","baseClass","useTranslation","useEditorConfigContext","DropDown","DropDownItem","ToolbarItem","t0","$","active","anchorElem","editor","enabled","iconOnly","item","i18n","fieldProps","t1","featureClientSchemaMap","schemaPath","Component","t2","_jsx","title","key","croppedTitle","label","length","substring","Icon","ChildComponent","undefined","itemKey","tooltip","children","className","MemoToolbarItem","memo","ToolbarDropdown","classNames","group","groupState","itemsContainerClassNames","items","groupKey","activeItemLabels","activeItems","map","dropdownLabel","t","buttonAriaLabel","Set","filter","Boolean","join","renderedItems","activeItemKeys","includes","enabledItemKeys","buttonClassName","disabled","enabledGroup","dropdownKey"],"sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/index.tsx"],"sourcesContent":["'use client'\nimport React, { useMemo } from 'react'\n\nconst baseClass = 'toolbar-popup__dropdown'\n\nimport type { LexicalEditor } from 'lexical'\n\nimport { useTranslation } from '@payloadcms/ui'\n\nimport type { ToolbarDropdownGroup, ToolbarGroupItem } from '../../types.js'\nimport type { ToolbarGroupState } from '../useToolbarStates.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport './index.css'\nimport { DropDown, DropDownItem } from './DropDown.js'\n\nconst ToolbarItem = ({\n  active,\n  anchorElem,\n  editor,\n  enabled,\n  iconOnly,\n  item,\n}: {\n  active?: boolean\n  anchorElem: HTMLElement\n  editor: LexicalEditor\n  enabled?: boolean\n  iconOnly?: boolean\n  item: ToolbarGroupItem\n}) => {\n  const { i18n } = useTranslation<{}, string>()\n  const {\n    fieldProps: { featureClientSchemaMap, schemaPath },\n  } = useEditorConfigContext()\n\n  if (item.Component) {\n    return (\n      item?.Component && (\n        <item.Component\n          active={active}\n          anchorElem={anchorElem}\n          editor={editor}\n          enabled={enabled}\n          item={item}\n          key={item.key}\n        />\n      )\n    )\n  }\n\n  let title = item.key\n  let croppedTitle = item.key\n  if (item.label) {\n    title =\n      typeof item.label === 'function'\n        ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n        : item.label\n  }\n  if (title.length > 25) {\n    croppedTitle = title.substring(0, 25) + '...'\n  } else {\n    croppedTitle = title\n  }\n\n  return (\n    <DropDownItem\n      active={active}\n      editor={editor}\n      enabled={enabled}\n      Icon={item?.ChildComponent ? <item.ChildComponent /> : undefined}\n      item={item}\n      itemKey={item.key}\n      key={item.key}\n      tooltip={iconOnly ? title : undefined}\n    >\n      <span className=\"text\">{croppedTitle}</span>\n    </DropDownItem>\n  )\n}\n\nconst MemoToolbarItem = React.memo(ToolbarItem)\n\nexport const ToolbarDropdown = ({\n  anchorElem,\n  classNames,\n  editor,\n  group,\n  groupState,\n  Icon,\n  itemsContainerClassNames,\n  label,\n}: {\n  anchorElem: HTMLElement\n  classNames?: string[]\n  editor: LexicalEditor\n  group: ToolbarDropdownGroup\n  groupState: ToolbarGroupState\n  Icon?: React.FC\n  itemsContainerClassNames?: string[]\n  label?: string\n}) => {\n  const { items, key: groupKey } = group\n  const { i18n } = useTranslation<Record<string, never>, string>()\n  const {\n    fieldProps: { featureClientSchemaMap, schemaPath },\n  } = useEditorConfigContext()\n  const activeItemLabels = groupState.activeItems.map((item) =>\n    typeof item.label === 'function'\n      ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n      : item.label || item.key,\n  )\n  const dropdownLabel = groupKey === 'text' ? i18n.t('lexical:general:textStyle') : undefined\n  const buttonAriaLabel =\n    [...new Set([label, ...activeItemLabels, dropdownLabel].filter(Boolean))].join(', ') || groupKey\n\n  const renderedItems = useMemo(() => {\n    return items?.length\n      ? items.map((item) => (\n          <MemoToolbarItem\n            active={groupState.activeItemKeys.includes(item.key)}\n            anchorElem={anchorElem}\n            editor={editor}\n            enabled={groupState.enabledItemKeys.includes(item.key)}\n            iconOnly={group.iconOnly}\n            item={item}\n            key={item.key}\n          />\n        ))\n      : null\n  }, [items, groupState.activeItemKeys, groupState.enabledItemKeys, anchorElem, editor])\n\n  return (\n    <DropDown\n      buttonAriaLabel={buttonAriaLabel}\n      buttonClassName={[baseClass, `${baseClass}-${groupKey}`, ...(classNames || [])]\n        .filter(Boolean)\n        .join(' ')}\n      disabled={!groupState.enabledGroup}\n      dropdownKey={groupKey}\n      Icon={Icon}\n      itemsContainerClassNames={[`${baseClass}-items`, ...(itemsContainerClassNames || [])]}\n      key={groupKey}\n      label={label}\n    >\n      {renderedItems}\n    </DropDown>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/toolbars/shared/useToolbarKeyboardNavigation.d.ts

@@ -0,0 +1,5 @@
+import type { RefObject } from 'react';
+export declare function useToolbarKeyboardNavigation({ toolbarRef, }: {
+    toolbarRef: RefObject<HTMLDivElement | null>;
+}): void;
+//# sourceMappingURL=useToolbarKeyboardNavigation.d.ts.map

package/dist/features/toolbars/shared/useToolbarKeyboardNavigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useToolbarKeyboardNavigation.d.ts","sourceRoot":"","sources":["../../../../src/features/toolbars/shared/useToolbarKeyboardNavigation.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAItC,wBAAgB,4BAA4B,CAAC,EAC3C,UAAU,GACX,EAAE;IACD,UAAU,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;CAC7C,QAwFA"}

package/dist/features/toolbars/shared/useToolbarKeyboardNavigation.js

@@ -0,0 +1,109 @@
+'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { useEffect } from 'react';
+export function useToolbarKeyboardNavigation(t0) {
+  const $ = _c(3);
+  const {
+    toolbarRef
+  } = t0;
+  let t1;
+  let t2;
+  if ($[0] !== toolbarRef) {
+    t1 = () => {
+      const toolbar = toolbarRef.current;
+      if (!toolbar) {
+        return;
+      }
+      let activeButton;
+      const getButtons = () => Array.from(toolbar.querySelectorAll("button")).filter(button => !button.closest("[role=\"menu\"]") && button.closest("[role=\"toolbar\"]") === toolbar);
+      const updateTabStops = () => {
+        const buttons = getButtons();
+        const enabledButtons = buttons.filter(_temp);
+        if (!activeButton || !enabledButtons.includes(activeButton)) {
+          activeButton = enabledButtons[0];
+        }
+        for (const button_1 of buttons) {
+          button_1.tabIndex = button_1 === activeButton ? 0 : -1;
+        }
+      };
+      const handleFocus = event => {
+        const button_3 = getButtons().find(button_2 => button_2 === event.target);
+        if (button_3) {
+          activeButton = button_3;
+          updateTabStops();
+        }
+      };
+      const handleKeyDown = event_0 => {
+        if (event_0.altKey || event_0.ctrlKey || event_0.metaKey || event_0.shiftKey) {
+          return;
+        }
+        const buttons_0 = getButtons().filter(_temp2);
+        const index = buttons_0.findIndex(button_5 => button_5 === event_0.target);
+        if (index === -1) {
+          return;
+        }
+        const isRTL = getComputedStyle(toolbar).direction === "rtl";
+        let nextIndex;
+        bb58: switch (event_0.key) {
+          case "ArrowLeft":
+            {
+              nextIndex = index + (isRTL ? 1 : -1);
+              break bb58;
+            }
+          case "ArrowRight":
+            {
+              nextIndex = index + (isRTL ? -1 : 1);
+              break bb58;
+            }
+          case "End":
+            {
+              nextIndex = buttons_0.length - 1;
+              break bb58;
+            }
+          case "Home":
+            {
+              nextIndex = 0;
+              break bb58;
+            }
+          default:
+            {
+              return;
+            }
+        }
+        event_0.preventDefault();
+        event_0.stopPropagation();
+        buttons_0[(nextIndex + buttons_0.length) % buttons_0.length]?.focus();
+      };
+      updateTabStops();
+      const observer = new MutationObserver(updateTabStops);
+      observer.observe(toolbar, {
+        attributeFilter: ["disabled"],
+        childList: true,
+        subtree: true
+      });
+      toolbar.addEventListener("focusin", handleFocus);
+      toolbar.addEventListener("keydown", handleKeyDown);
+      return () => {
+        observer.disconnect();
+        toolbar.removeEventListener("focusin", handleFocus);
+        toolbar.removeEventListener("keydown", handleKeyDown);
+      };
+    };
+    t2 = [toolbarRef];
+    $[0] = toolbarRef;
+    $[1] = t1;
+    $[2] = t2;
+  } else {
+    t1 = $[1];
+    t2 = $[2];
+  }
+  useEffect(t1, t2);
+}
+function _temp2(button_4) {
+  return !button_4.disabled;
+}
+function _temp(button_0) {
+  return !button_0.disabled;
+}
+//# sourceMappingURL=useToolbarKeyboardNavigation.js.map

package/dist/features/toolbars/shared/useToolbarKeyboardNavigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useToolbarKeyboardNavigation.js","names":["c","_c","useEffect","useToolbarKeyboardNavigation","t0","$","toolbarRef","t1","t2","toolbar","current","activeButton","getButtons","Array","from","querySelectorAll","filter","button","closest","updateTabStops","buttons","enabledButtons","_temp","includes","button_1","tabIndex","handleFocus","event","button_3","find","button_2","target","handleKeyDown","event_0","altKey","ctrlKey","metaKey","shiftKey","buttons_0","_temp2","index","findIndex","button_5","isRTL","getComputedStyle","direction","nextIndex","bb58","key","length","preventDefault","stopPropagation","focus","observer","MutationObserver","observe","attributeFilter","childList","subtree","addEventListener","disconnect","removeEventListener","button_4","disabled","button_0"],"sources":["../../../../src/features/toolbars/shared/useToolbarKeyboardNavigation.ts"],"sourcesContent":["'use client'\n\nimport type { RefObject } from 'react'\n\nimport { useEffect } from 'react'\n\nexport function useToolbarKeyboardNavigation({\n  toolbarRef,\n}: {\n  toolbarRef: RefObject<HTMLDivElement | null>\n}) {\n  useEffect(() => {\n    const toolbar = toolbarRef.current\n\n    if (!toolbar) {\n      return\n    }\n\n    let activeButton: HTMLButtonElement | undefined\n    const getButtons = () =>\n      Array.from(toolbar.querySelectorAll<HTMLButtonElement>('button')).filter(\n        (button) =>\n          !button.closest('[role=\"menu\"]') && button.closest('[role=\"toolbar\"]') === toolbar,\n      )\n\n    const updateTabStops = () => {\n      const buttons = getButtons()\n      const enabledButtons = buttons.filter((button) => !button.disabled)\n\n      if (!activeButton || !enabledButtons.includes(activeButton)) {\n        activeButton = enabledButtons[0]\n      }\n\n      for (const button of buttons) {\n        button.tabIndex = button === activeButton ? 0 : -1\n      }\n    }\n\n    const handleFocus = (event: FocusEvent) => {\n      const button = getButtons().find((button) => button === event.target)\n\n      if (button) {\n        activeButton = button\n        updateTabStops()\n      }\n    }\n\n    const handleKeyDown = (event: KeyboardEvent) => {\n      if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey) {\n        return\n      }\n\n      const buttons = getButtons().filter((button) => !button.disabled)\n      const index = buttons.findIndex((button) => button === event.target)\n\n      // Dropdown menus and custom inputs retain their own keyboard behavior.\n      if (index === -1) {\n        return\n      }\n\n      const isRTL = getComputedStyle(toolbar).direction === 'rtl'\n      let nextIndex: number\n\n      switch (event.key) {\n        case 'ArrowLeft':\n          nextIndex = index + (isRTL ? 1 : -1)\n          break\n        case 'ArrowRight':\n          nextIndex = index + (isRTL ? -1 : 1)\n          break\n        case 'End':\n          nextIndex = buttons.length - 1\n          break\n        case 'Home':\n          nextIndex = 0\n          break\n        default:\n          return\n      }\n\n      event.preventDefault()\n      event.stopPropagation()\n      buttons[(nextIndex + buttons.length) % buttons.length]?.focus()\n    }\n\n    updateTabStops()\n    const observer = new MutationObserver(updateTabStops)\n\n    observer.observe(toolbar, { attributeFilter: ['disabled'], childList: true, subtree: true })\n    toolbar.addEventListener('focusin', handleFocus)\n    toolbar.addEventListener('keydown', handleKeyDown)\n\n    return () => {\n      observer.disconnect()\n      toolbar.removeEventListener('focusin', handleFocus)\n      toolbar.removeEventListener('keydown', handleKeyDown)\n    }\n  }, [toolbarRef])\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/toolbars/shared/useToolbarStates.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useToolbarStates.d.ts","sourceRoot":"","sources":["../../../../src/features/toolbars/shared/useToolbarStates.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAM5C,OAAO,KAAK,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAKjE,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,OAAO,CAAA;IACf,OAAO,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,WAAW,iBAAiB;IAChC,cAAc,EAAE,MAAM,EAAE,CAAA;IACxB,WAAW,EAAE,gBAAgB,EAAE,CAAA;IAC/B,YAAY,EAAE,OAAO,CAAA;IACrB,eAAe,EAAE,MAAM,EAAE,CAAA;CAC1B;AAED,MAAM,WAAW,aAAa;IAC5B,WAAW,EAAE,GAAG,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAA;IAC3C,UAAU,EAAE,GAAG,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAA;CAC1C;AAgCD;;;GAGG;AACH,wBAAgB,gBAAgB,CAC9B,MAAM,EAAE,aAAa,EACrB,MAAM,EAAE,YAAY,EAAE,GAAG,SAAS,GACjC,aAAa,CAyFf"}
+{"version":3,"file":"useToolbarStates.d.ts","sourceRoot":"","sources":["../../../../src/features/toolbars/shared/useToolbarStates.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAM5C,OAAO,KAAK,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAKjE,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,OAAO,CAAA;IACf,OAAO,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,WAAW,iBAAiB;IAChC,cAAc,EAAE,MAAM,EAAE,CAAA;IACxB,WAAW,EAAE,gBAAgB,EAAE,CAAA;IAC/B,YAAY,EAAE,OAAO,CAAA;IACrB,eAAe,EAAE,MAAM,EAAE,CAAA;CAC1B;AAED,MAAM,WAAW,aAAa;IAC5B,WAAW,EAAE,GAAG,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAA;IAC3C,UAAU,EAAE,GAAG,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAA;CAC1C;AAgCD;;;GAGG;AACH,wBAAgB,gBAAgB,CAC9B,MAAM,EAAE,aAAa,EACrB,MAAM,EAAE,YAAY,EAAE,GAAG,SAAS,GACjC,aAAa,CA2Ff"}

package/dist/features/toolbars/shared/useToolbarStates.js

@@ -114,7 +114,9 @@ export function useToolbarStates(editor, groups) {
   }, [editor]);
   useEffect(() => {
     void runDeprioritized(updateStates);
-    const listener = () => runDeprioritized(updateStates);
+    const listener = () => {
+      void runDeprioritized(updateStates);
+    };
     const cleanup = mergeRegister(editor.registerUpdateListener(listener));
     document.addEventListener('mouseup', listener);
     return () => {

package/dist/features/toolbars/shared/useToolbarStates.js.map

@@ -1 +1 @@
-{"version":3,"file":"useToolbarStates.js","names":["mergeRegister","$getSelection","useCallback","useDeferredValue","useEffect","useRef","useState","useEditorConfigContext","useRunDeprioritized","buildDefaultStates","groups","itemStates","Map","groupStates","length","group","enabledItemKeys","item","items","set","key","active","enabled","push","activeItemKeys","activeItems","enabledGroup","useToolbarStates","editor","states","setStates","deferredStates","editorConfigContext","editorConfigContextRef","current","groupsRef","runDeprioritized","updateStates","getEditorState","read","selection","currentGroups","ctx","newItemStates","newGroupStates","maxActive","type","maxActiveItems","undefined","isActive","isEnabled","listener","cleanup","registerUpdateListener","document","addEventListener","removeEventListener"],"sources":["../../../../src/features/toolbars/shared/useToolbarStates.ts"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { mergeRegister } from '@lexical/utils'\nimport { $getSelection } from 'lexical'\nimport { useCallback, useDeferredValue, useEffect, useRef, useState } from 'react'\n\nimport type { ToolbarGroup, ToolbarGroupItem } from '../types.js'\n\nimport { useEditorConfigContext } from '../../../lexical/config/client/EditorConfigProvider.js'\nimport { useRunDeprioritized } from '../../../utilities/useRunDeprioritized.js'\n\nexport interface ToolbarItemState {\n  active: boolean\n  enabled: boolean\n}\n\nexport interface ToolbarGroupState {\n  activeItemKeys: string[]\n  activeItems: ToolbarGroupItem[]\n  enabledGroup: boolean\n  enabledItemKeys: string[]\n}\n\nexport interface ToolbarStates {\n  groupStates: Map<string, ToolbarGroupState>\n  itemStates: Map<string, ToolbarItemState>\n}\n\n/**\n * Build default states where every item is enabled and nothing is active.\n * Used as the initial value so toolbar groups render immediately on mount\n * instead of waiting for the first updateStates call.\n */\nfunction buildDefaultStates(groups: ToolbarGroup[] | undefined): ToolbarStates {\n  const itemStates = new Map<string, ToolbarItemState>()\n  const groupStates = new Map<string, ToolbarGroupState>()\n\n  if (!groups?.length) {\n    return { groupStates, itemStates }\n  }\n\n  for (const group of groups) {\n    const enabledItemKeys: string[] = []\n    for (const item of group.items) {\n      itemStates.set(item.key, { active: false, enabled: true })\n      enabledItemKeys.push(item.key)\n    }\n    groupStates.set(group.key, {\n      activeItemKeys: [],\n      activeItems: [],\n      enabledGroup: true,\n      enabledItemKeys,\n    })\n  }\n\n  return { groupStates, itemStates }\n}\n\n/**\n * Subscribes once to `editor.registerUpdateListener` and computes\n * isActive / isEnabled for every toolbar item in a read.\n */\nexport function useToolbarStates(\n  editor: LexicalEditor,\n  groups: ToolbarGroup[] | undefined,\n): ToolbarStates {\n  const [states, setStates] = useState<ToolbarStates>(() => buildDefaultStates(groups))\n  const deferredStates = useDeferredValue(states)\n\n  const editorConfigContext = useEditorConfigContext()\n  const editorConfigContextRef = useRef(editorConfigContext)\n  editorConfigContextRef.current = editorConfigContext\n\n  const groupsRef = useRef(groups)\n  groupsRef.current = groups\n\n  const runDeprioritized = useRunDeprioritized()\n\n  const updateStates = useCallback(() => {\n    editor.getEditorState().read(() => {\n      const selection = $getSelection()\n      if (!selection) {\n        return\n      }\n\n      const currentGroups = groupsRef.current\n      if (!currentGroups?.length) {\n        return\n      }\n\n      const ctx = editorConfigContextRef.current\n      const newItemStates = new Map<string, ToolbarItemState>()\n      const newGroupStates = new Map<string, ToolbarGroupState>()\n\n      for (const group of currentGroups) {\n        const activeItemKeys: string[] = []\n        const activeItems: ToolbarGroupItem[] = []\n        const enabledItemKeys: string[] = []\n\n        const maxActive = group.type === 'dropdown' ? (group.maxActiveItems ?? 1) : undefined\n\n        for (const item of group.items) {\n          const isActive = item.isActive\n            ? (!maxActive || activeItemKeys.length < maxActive) &&\n              item.isActive({ editor, editorConfigContext: ctx, selection })\n            : false\n\n          const isEnabled = item.isEnabled\n            ? item.isEnabled({ editor, editorConfigContext: ctx, selection })\n            : true\n\n          if (isActive) {\n            activeItemKeys.push(item.key)\n            activeItems.push(item)\n          }\n          if (isEnabled) {\n            enabledItemKeys.push(item.key)\n          }\n\n          newItemStates.set(item.key, { active: isActive, enabled: isEnabled })\n        }\n\n        const enabledGroup =\n          group.type === 'dropdown' && group.isEnabled\n            ? group.isEnabled({ editor, editorConfigContext: ctx, selection })\n            : true\n\n        newGroupStates.set(group.key, {\n          activeItemKeys,\n          activeItems,\n          enabledGroup,\n          enabledItemKeys,\n        })\n      }\n\n      setStates({ groupStates: newGroupStates, itemStates: newItemStates })\n    })\n  }, [editor])\n\n  useEffect(() => {\n    void runDeprioritized(updateStates)\n\n    const listener = () => runDeprioritized(updateStates)\n\n    const cleanup = mergeRegister(editor.registerUpdateListener(listener))\n    document.addEventListener('mouseup', listener)\n\n    return () => {\n      cleanup()\n      document.removeEventListener('mouseup', listener)\n    }\n  }, [editor, runDeprioritized, updateStates])\n\n  return deferredStates\n}\n"],"mappings":"AAAA;;AAGA,SAASA,aAAa,QAAQ;AAC9B,SAASC,aAAa,QAAQ;AAC9B,SAASC,WAAW,EAAEC,gBAAgB,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ;AAI3E,SAASC,sBAAsB,QAAQ;AACvC,SAASC,mBAAmB,QAAQ;AAmBpC;;;;;AAKA,SAASC,mBAAmBC,MAAkC;EAC5D,MAAMC,UAAA,GAAa,IAAIC,GAAA;EACvB,MAAMC,WAAA,GAAc,IAAID,GAAA;EAExB,IAAI,CAACF,MAAA,EAAQI,MAAA,EAAQ;IACnB,OAAO;MAAED,WAAA;MAAaF;IAAW;EACnC;EAEA,KAAK,MAAMI,KAAA,IAASL,MAAA,EAAQ;IAC1B,MAAMM,eAAA,GAA4B,EAAE;IACpC,KAAK,MAAMC,IAAA,IAAQF,KAAA,CAAMG,KAAK,EAAE;MAC9BP,UAAA,CAAWQ,GAAG,CAACF,IAAA,CAAKG,GAAG,EAAE;QAAEC,MAAA,EAAQ;QAAOC,OAAA,EAAS;MAAK;MACxDN,eAAA,CAAgBO,IAAI,CAACN,IAAA,CAAKG,GAAG;IAC/B;IACAP,WAAA,CAAYM,GAAG,CAACJ,KAAA,CAAMK,GAAG,EAAE;MACzBI,cAAA,EAAgB,EAAE;MAClBC,WAAA,EAAa,EAAE;MACfC,YAAA,EAAc;MACdV;IACF;EACF;EAEA,OAAO;IAAEH,WAAA;IAAaF;EAAW;AACnC;AAEA;;;;AAIA,OAAO,SAASgB,iBACdC,MAAqB,EACrBlB,MAAkC;EAElC,MAAM,CAACmB,MAAA,EAAQC,SAAA,CAAU,GAAGxB,QAAA,CAAwB,MAAMG,kBAAA,CAAmBC,MAAA;EAC7E,MAAMqB,cAAA,GAAiB5B,gBAAA,CAAiB0B,MAAA;EAExC,MAAMG,mBAAA,GAAsBzB,sBAAA;EAC5B,MAAM0B,sBAAA,GAAyB5B,MAAA,CAAO2B,mBAAA;EACtCC,sBAAA,CAAuBC,OAAO,GAAGF,mBAAA;EAEjC,MAAMG,SAAA,GAAY9B,MAAA,CAAOK,MAAA;EACzByB,SAAA,CAAUD,OAAO,GAAGxB,MAAA;EAEpB,MAAM0B,gBAAA,GAAmB5B,mBAAA;EAEzB,MAAM6B,YAAA,GAAenC,WAAA,CAAY;IAC/B0B,MAAA,CAAOU,cAAc,GAAGC,IAAI,CAAC;MAC3B,MAAMC,SAAA,GAAYvC,aAAA;MAClB,IAAI,CAACuC,SAAA,EAAW;QACd;MACF;MAEA,MAAMC,aAAA,GAAgBN,SAAA,CAAUD,OAAO;MACvC,IAAI,CAACO,aAAA,EAAe3B,MAAA,EAAQ;QAC1B;MACF;MAEA,MAAM4B,GAAA,GAAMT,sBAAA,CAAuBC,OAAO;MAC1C,MAAMS,aAAA,GAAgB,IAAI/B,GAAA;MAC1B,MAAMgC,cAAA,GAAiB,IAAIhC,GAAA;MAE3B,KAAK,MAAMG,KAAA,IAAS0B,aAAA,EAAe;QACjC,MAAMjB,cAAA,GAA2B,EAAE;QACnC,MAAMC,WAAA,GAAkC,EAAE;QAC1C,MAAMT,eAAA,GAA4B,EAAE;QAEpC,MAAM6B,SAAA,GAAY9B,KAAA,CAAM+B,IAAI,KAAK,aAAc/B,KAAA,CAAMgC,cAAc,IAAI,IAAKC,SAAA;QAE5E,KAAK,MAAM/B,IAAA,IAAQF,KAAA,CAAMG,KAAK,EAAE;UAC9B,MAAM+B,QAAA,GAAWhC,IAAA,CAAKgC,QAAQ,GAC1B,CAAC,CAACJ,SAAA,IAAarB,cAAA,CAAeV,MAAM,GAAG+B,SAAQ,KAC/C5B,IAAA,CAAKgC,QAAQ,CAAC;YAAErB,MAAA;YAAQI,mBAAA,EAAqBU,GAAA;YAAKF;UAAU,KAC5D;UAEJ,MAAMU,SAAA,GAAYjC,IAAA,CAAKiC,SAAS,GAC5BjC,IAAA,CAAKiC,SAAS,CAAC;YAAEtB,MAAA;YAAQI,mBAAA,EAAqBU,GAAA;YAAKF;UAAU,KAC7D;UAEJ,IAAIS,QAAA,EAAU;YACZzB,cAAA,CAAeD,IAAI,CAACN,IAAA,CAAKG,GAAG;YAC5BK,WAAA,CAAYF,IAAI,CAACN,IAAA;UACnB;UACA,IAAIiC,SAAA,EAAW;YACblC,eAAA,CAAgBO,IAAI,CAACN,IAAA,CAAKG,GAAG;UAC/B;UAEAuB,aAAA,CAAcxB,GAAG,CAACF,IAAA,CAAKG,GAAG,EAAE;YAAEC,MAAA,EAAQ4B,QAAA;YAAU3B,OAAA,EAAS4B;UAAU;QACrE;QAEA,MAAMxB,YAAA,GACJX,KAAA,CAAM+B,IAAI,KAAK,cAAc/B,KAAA,CAAMmC,SAAS,GACxCnC,KAAA,CAAMmC,SAAS,CAAC;UAAEtB,MAAA;UAAQI,mBAAA,EAAqBU,GAAA;UAAKF;QAAU,KAC9D;QAENI,cAAA,CAAezB,GAAG,CAACJ,KAAA,CAAMK,GAAG,EAAE;UAC5BI,cAAA;UACAC,WAAA;UACAC,YAAA;UACAV;QACF;MACF;MAEAc,SAAA,CAAU;QAAEjB,WAAA,EAAa+B,cAAA;QAAgBjC,UAAA,EAAYgC;MAAc;IACrE;EACF,GAAG,CAACf,MAAA,CAAO;EAEXxB,SAAA,CAAU;IACR,KAAKgC,gBAAA,CAAiBC,YAAA;IAEtB,MAAMc,QAAA,GAAWA,CAAA,KAAMf,gBAAA,CAAiBC,YAAA;IAExC,MAAMe,OAAA,GAAUpD,aAAA,CAAc4B,MAAA,CAAOyB,sBAAsB,CAACF,QAAA;IAC5DG,QAAA,CAASC,gBAAgB,CAAC,WAAWJ,QAAA;IAErC,OAAO;MACLC,OAAA;MACAE,QAAA,CAASE,mBAAmB,CAAC,WAAWL,QAAA;IAC1C;EACF,GAAG,CAACvB,MAAA,EAAQQ,gBAAA,EAAkBC,YAAA,CAAa;EAE3C,OAAON,cAAA;AACT","ignoreList":[]}
+{"version":3,"file":"useToolbarStates.js","names":["mergeRegister","$getSelection","useCallback","useDeferredValue","useEffect","useRef","useState","useEditorConfigContext","useRunDeprioritized","buildDefaultStates","groups","itemStates","Map","groupStates","length","group","enabledItemKeys","item","items","set","key","active","enabled","push","activeItemKeys","activeItems","enabledGroup","useToolbarStates","editor","states","setStates","deferredStates","editorConfigContext","editorConfigContextRef","current","groupsRef","runDeprioritized","updateStates","getEditorState","read","selection","currentGroups","ctx","newItemStates","newGroupStates","maxActive","type","maxActiveItems","undefined","isActive","isEnabled","listener","cleanup","registerUpdateListener","document","addEventListener","removeEventListener"],"sources":["../../../../src/features/toolbars/shared/useToolbarStates.ts"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { mergeRegister } from '@lexical/utils'\nimport { $getSelection } from 'lexical'\nimport { useCallback, useDeferredValue, useEffect, useRef, useState } from 'react'\n\nimport type { ToolbarGroup, ToolbarGroupItem } from '../types.js'\n\nimport { useEditorConfigContext } from '../../../lexical/config/client/EditorConfigProvider.js'\nimport { useRunDeprioritized } from '../../../utilities/useRunDeprioritized.js'\n\nexport interface ToolbarItemState {\n  active: boolean\n  enabled: boolean\n}\n\nexport interface ToolbarGroupState {\n  activeItemKeys: string[]\n  activeItems: ToolbarGroupItem[]\n  enabledGroup: boolean\n  enabledItemKeys: string[]\n}\n\nexport interface ToolbarStates {\n  groupStates: Map<string, ToolbarGroupState>\n  itemStates: Map<string, ToolbarItemState>\n}\n\n/**\n * Build default states where every item is enabled and nothing is active.\n * Used as the initial value so toolbar groups render immediately on mount\n * instead of waiting for the first updateStates call.\n */\nfunction buildDefaultStates(groups: ToolbarGroup[] | undefined): ToolbarStates {\n  const itemStates = new Map<string, ToolbarItemState>()\n  const groupStates = new Map<string, ToolbarGroupState>()\n\n  if (!groups?.length) {\n    return { groupStates, itemStates }\n  }\n\n  for (const group of groups) {\n    const enabledItemKeys: string[] = []\n    for (const item of group.items) {\n      itemStates.set(item.key, { active: false, enabled: true })\n      enabledItemKeys.push(item.key)\n    }\n    groupStates.set(group.key, {\n      activeItemKeys: [],\n      activeItems: [],\n      enabledGroup: true,\n      enabledItemKeys,\n    })\n  }\n\n  return { groupStates, itemStates }\n}\n\n/**\n * Subscribes once to `editor.registerUpdateListener` and computes\n * isActive / isEnabled for every toolbar item in a read.\n */\nexport function useToolbarStates(\n  editor: LexicalEditor,\n  groups: ToolbarGroup[] | undefined,\n): ToolbarStates {\n  const [states, setStates] = useState<ToolbarStates>(() => buildDefaultStates(groups))\n  const deferredStates = useDeferredValue(states)\n\n  const editorConfigContext = useEditorConfigContext()\n  const editorConfigContextRef = useRef(editorConfigContext)\n  editorConfigContextRef.current = editorConfigContext\n\n  const groupsRef = useRef(groups)\n  groupsRef.current = groups\n\n  const runDeprioritized = useRunDeprioritized()\n\n  const updateStates = useCallback(() => {\n    editor.getEditorState().read(() => {\n      const selection = $getSelection()\n      if (!selection) {\n        return\n      }\n\n      const currentGroups = groupsRef.current\n      if (!currentGroups?.length) {\n        return\n      }\n\n      const ctx = editorConfigContextRef.current\n      const newItemStates = new Map<string, ToolbarItemState>()\n      const newGroupStates = new Map<string, ToolbarGroupState>()\n\n      for (const group of currentGroups) {\n        const activeItemKeys: string[] = []\n        const activeItems: ToolbarGroupItem[] = []\n        const enabledItemKeys: string[] = []\n\n        const maxActive = group.type === 'dropdown' ? (group.maxActiveItems ?? 1) : undefined\n\n        for (const item of group.items) {\n          const isActive = item.isActive\n            ? (!maxActive || activeItemKeys.length < maxActive) &&\n              item.isActive({ editor, editorConfigContext: ctx, selection })\n            : false\n\n          const isEnabled = item.isEnabled\n            ? item.isEnabled({ editor, editorConfigContext: ctx, selection })\n            : true\n\n          if (isActive) {\n            activeItemKeys.push(item.key)\n            activeItems.push(item)\n          }\n          if (isEnabled) {\n            enabledItemKeys.push(item.key)\n          }\n\n          newItemStates.set(item.key, { active: isActive, enabled: isEnabled })\n        }\n\n        const enabledGroup =\n          group.type === 'dropdown' && group.isEnabled\n            ? group.isEnabled({ editor, editorConfigContext: ctx, selection })\n            : true\n\n        newGroupStates.set(group.key, {\n          activeItemKeys,\n          activeItems,\n          enabledGroup,\n          enabledItemKeys,\n        })\n      }\n\n      setStates({ groupStates: newGroupStates, itemStates: newItemStates })\n    })\n  }, [editor])\n\n  useEffect(() => {\n    void runDeprioritized(updateStates)\n\n    const listener = () => {\n      void runDeprioritized(updateStates)\n    }\n\n    const cleanup = mergeRegister(editor.registerUpdateListener(listener))\n    document.addEventListener('mouseup', listener)\n\n    return () => {\n      cleanup()\n      document.removeEventListener('mouseup', listener)\n    }\n  }, [editor, runDeprioritized, updateStates])\n\n  return deferredStates\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/typesClient.d.ts

@@ -1,10 +1,10 @@
+import type { Transformer } from '@lexical/markdown';
 import type { Klass, LexicalEditor, LexicalNode, LexicalNodeReplacement, TextFormatType } from 'lexical';
 import type { ClientConfig, RichTextFieldClient } from 'payload';
 import type React from 'react';
 import type { JSX } from 'react';
 import type { ClientEditorConfig } from '../lexical/config/types.js';
 import type { SlashMenuGroup } from '../lexical/plugins/SlashMenu/LexicalTypeaheadMenuPlugin/types.js';
-import type { Transformer } from '../packages/@lexical/markdown/index.js';
 import type { FeatureClientSchemaMap } from '../types/index.js';
 import type { ToolbarGroup } from './toolbars/types.js';
 export type FeatureProviderProviderClient<UnSanitizedClientFeatureProps = undefined, ClientFeatureProps = UnSanitizedClientFeatureProps> = (props: BaseClientFeatureProps<ClientFeatureProps>) => FeatureProviderClient<ClientFeatureProps>;

package/dist/features/typesClient.d.ts.map

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

package/dist/features/typesClient.js.map

@@ -1 +1 @@
-{"version":3,"file":"typesClient.js","names":[],"sources":["../../src/features/typesClient.ts"],"sourcesContent":["import type {\n  Klass,\n  LexicalEditor,\n  LexicalNode,\n  LexicalNodeReplacement,\n  TextFormatType,\n} from 'lexical'\nimport type { ClientConfig, RichTextFieldClient } from 'payload'\nimport type React from 'react'\nimport type { JSX } from 'react'\n\nimport type { ClientEditorConfig } from '../lexical/config/types.js'\nimport type { SlashMenuGroup } from '../lexical/plugins/SlashMenu/LexicalTypeaheadMenuPlugin/types.js'\nimport type { Transformer } from '../packages/@lexical/markdown/index.js'\nimport type { FeatureClientSchemaMap } from '../types/index.js'\nimport type { ToolbarGroup } from './toolbars/types.js'\n\nexport type FeatureProviderProviderClient<\n  UnSanitizedClientFeatureProps = undefined,\n  ClientFeatureProps = UnSanitizedClientFeatureProps,\n> = (props: BaseClientFeatureProps<ClientFeatureProps>) => FeatureProviderClient<ClientFeatureProps>\n\n/**\n * No dependencies => Features need to be sorted on the server first, then sent to client in right order\n */\nexport type FeatureProviderClient<\n  UnSanitizedClientFeatureProps = undefined,\n  ClientFeatureProps = UnSanitizedClientFeatureProps,\n> = {\n  /**\n   * Return props, to make it easy to retrieve passed in props to this Feature for the client if anyone wants to\n   */\n  clientFeatureProps: BaseClientFeatureProps<UnSanitizedClientFeatureProps>\n  feature:\n    | ((props: {\n        config: ClientConfig\n        featureClientImportMap: Record<string, any>\n        featureClientSchemaMap: FeatureClientSchemaMap\n        /** unSanitizedEditorConfig.features, but mapped */\n        featureProviderMap: ClientFeatureProviderMap\n        field?: RichTextFieldClient\n        // other resolved features, which have been loaded before this one. All features declared in 'dependencies' should be available here\n        resolvedFeatures: ResolvedClientFeatureMap\n        schemaPath: string\n        // unSanitized EditorConfig,\n        unSanitizedEditorConfig: ClientEditorConfig\n      }) => ClientFeature<ClientFeatureProps>)\n    | ClientFeature<ClientFeatureProps>\n}\n\nexport type PluginComponent<ClientFeatureProps = any> = React.FC<{\n  clientProps: ClientFeatureProps\n}>\nexport type PluginComponentWithAnchor<ClientFeatureProps = any> = React.FC<{\n  anchorElem: HTMLElement\n  clientProps: ClientFeatureProps\n}>\n\n/**\n * Plugins are react components which get added to the editor. You can use them to interact with lexical, e.g. to create a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n */\nexport type SanitizedPlugin =\n  | {\n      clientProps: any\n      // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n      Component: PluginComponent\n      key: string\n      position: 'bottom' // Determines at which position the Component will be added.\n    }\n  | {\n      clientProps: any\n      // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n      Component: PluginComponent\n      key: string\n      position: 'normal' // Determines at which position the Component will be added.\n    }\n  | {\n      clientProps: any\n      // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n      Component: PluginComponent\n      key: string\n      position: 'top' // Determines at which position the Component will be added.\n    }\n  | {\n      clientProps: any\n      // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n      Component: PluginComponentWithAnchor\n      desktopOnly?: boolean\n      key: string\n      position: 'floatingAnchorElem' // Determines at which position the Component will be added.\n    }\n  | {\n      clientProps: any\n      Component: PluginComponent\n      key: string\n      position: 'aboveContainer'\n    }\n  | {\n      clientProps: any\n      Component: PluginComponent\n      key: string\n      position: 'belowContainer'\n    }\n\nexport type ClientFeature<ClientFeatureProps> = {\n  /**\n   * The text formats which are enabled by this feature.\n   */\n  enableFormats?: TextFormatType[]\n  markdownTransformers?: (\n    | ((props: {\n        allNodes: Array<Klass<LexicalNode> | LexicalNodeReplacement>\n        allTransformers: Transformer[]\n      }) => Transformer)\n    | Transformer\n  )[]\n  nodes?: Array<Klass<LexicalNode> | LexicalNodeReplacement>\n  /**\n   * Plugins are react components which get added to the editor. You can use them to interact with lexical, e.g. to create a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n   */\n  plugins?: Array<\n    | {\n        // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n        Component: PluginComponent<ClientFeatureProps>\n        position: 'aboveContainer' // Determines at which position the Component will be added.\n      }\n    | {\n        // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n        Component: PluginComponent<ClientFeatureProps>\n        position: 'bottom' // Determines at which position the Component will be added.\n      }\n    | {\n        // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n        Component: PluginComponent<ClientFeatureProps>\n        position: 'normal' // Determines at which position the Component will be added.\n      }\n    | {\n        // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n        Component: PluginComponent<ClientFeatureProps>\n        position: 'top' // Determines at which position the Component will be added.\n      }\n    | {\n        // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n        Component: PluginComponentWithAnchor<ClientFeatureProps>\n        position: 'floatingAnchorElem' // Determines at which position the Component will be added.\n      }\n    | {\n        Component: PluginComponent<ClientFeatureProps>\n        position: 'belowContainer' // Determines at which position the Component will be added.\n      }\n  >\n  /**\n   * Client Features can register their own providers, which will be nested below the EditorConfigProvider\n   */\n  providers?: Array<React.FC<{ children: JSX.Element }>>\n  /**\n   * Return props, to make it easy to retrieve passed in props to this Feature for the client if anyone wants to\n   */\n  sanitizedClientFeatureProps?: BaseClientFeatureProps<ClientFeatureProps>\n  slashMenu?: {\n    /**\n     * Dynamic groups allow you to add different groups depending on the query string (so, the text after the slash).\n     * Thus, to re-calculate the available groups, this function will be called every time you type after the /.\n     *\n     * The groups provided by dynamicGroups will be merged with the static groups provided by the groups property.\n     */\n    dynamicGroups?: ({\n      editor,\n      queryString,\n    }: {\n      editor: LexicalEditor\n      queryString: string\n    }) => SlashMenuGroup[]\n    /**\n     * Static array of groups together with the items in them. These will always be present.\n     * While typing after the /, they will be filtered by the query string and the keywords, key and display name of the items.\n     */\n    groups?: SlashMenuGroup[]\n  }\n  /**\n   * An opt-in, classic fixed toolbar which stays at the top of the editor\n   */\n  toolbarFixed?: {\n    groups: ToolbarGroup[]\n  }\n  /**\n   * The default, floating toolbar which appears when you select text.\n   */\n  toolbarInline?: {\n    /**\n     * Array of toolbar groups / sections. Each section can contain multiple toolbar items.\n     */\n    groups: ToolbarGroup[]\n  }\n}\n\nexport type BaseClientFeatureProps<ClientFeatureProps> = ClientFeatureProps extends undefined\n  ? {\n      featureKey: string\n      order: number\n    }\n  : {\n      featureKey: string\n      order: number\n    } & ClientFeatureProps\n\nexport type ResolvedClientFeature<ClientFeatureProps> = {\n  key: string\n  order: number\n} & ClientFeature<ClientFeatureProps>\n\nexport type ResolvedClientFeatureMap = Map<string, ResolvedClientFeature<any>>\n\nexport type ClientFeatureProviderMap = Map<string, FeatureProviderClient<any, any>>\n\nexport type SanitizedClientFeatures = {\n  /** The keys of all enabled features */\n  enabledFeatures: string[]\n  enabledFormats: TextFormatType[]\n  markdownTransformers: Transformer[]\n\n  /**\n   * Plugins are react components which get added to the editor. You can use them to interact with lexical, e.g. to create a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n   */\n  plugins?: Array<SanitizedPlugin>\n  slashMenu: {\n    /**\n     * Dynamic groups allow you to add different groups depending on the query string (so, the text after the slash).\n     * Thus, to re-calculate the available groups, this function will be called every time you type after the /.\n     *\n     * The groups provided by dynamicGroups will be merged with the static groups provided by the groups property.\n     */\n    dynamicGroups: Array<\n      ({ editor, queryString }: { editor: LexicalEditor; queryString: string }) => SlashMenuGroup[]\n    >\n    /**\n     * Static array of groups together with the items in them. These will always be present.\n     * While typing after the /, they will be filtered by the query string and the keywords, key and display name of the items.\n     */\n    groups: SlashMenuGroup[]\n  }\n} & Required<\n  Pick<ResolvedClientFeature<unknown>, 'nodes' | 'providers' | 'toolbarFixed' | 'toolbarInline'>\n>\n"],"mappings":"AAuNA","ignoreList":[]}
+{"version":3,"file":"typesClient.js","names":[],"sources":["../../src/features/typesClient.ts"],"sourcesContent":["import type { Transformer } from '@lexical/markdown'\nimport type {\n  Klass,\n  LexicalEditor,\n  LexicalNode,\n  LexicalNodeReplacement,\n  TextFormatType,\n} from 'lexical'\nimport type { ClientConfig, RichTextFieldClient } from 'payload'\nimport type React from 'react'\nimport type { JSX } from 'react'\n\nimport type { ClientEditorConfig } from '../lexical/config/types.js'\nimport type { SlashMenuGroup } from '../lexical/plugins/SlashMenu/LexicalTypeaheadMenuPlugin/types.js'\nimport type { FeatureClientSchemaMap } from '../types/index.js'\nimport type { ToolbarGroup } from './toolbars/types.js'\n\nexport type FeatureProviderProviderClient<\n  UnSanitizedClientFeatureProps = undefined,\n  ClientFeatureProps = UnSanitizedClientFeatureProps,\n> = (props: BaseClientFeatureProps<ClientFeatureProps>) => FeatureProviderClient<ClientFeatureProps>\n\n/**\n * No dependencies => Features need to be sorted on the server first, then sent to client in right order\n */\nexport type FeatureProviderClient<\n  UnSanitizedClientFeatureProps = undefined,\n  ClientFeatureProps = UnSanitizedClientFeatureProps,\n> = {\n  /**\n   * Return props, to make it easy to retrieve passed in props to this Feature for the client if anyone wants to\n   */\n  clientFeatureProps: BaseClientFeatureProps<UnSanitizedClientFeatureProps>\n  feature:\n    | ((props: {\n        config: ClientConfig\n        featureClientImportMap: Record<string, any>\n        featureClientSchemaMap: FeatureClientSchemaMap\n        /** unSanitizedEditorConfig.features, but mapped */\n        featureProviderMap: ClientFeatureProviderMap\n        field?: RichTextFieldClient\n        // other resolved features, which have been loaded before this one. All features declared in 'dependencies' should be available here\n        resolvedFeatures: ResolvedClientFeatureMap\n        schemaPath: string\n        // unSanitized EditorConfig,\n        unSanitizedEditorConfig: ClientEditorConfig\n      }) => ClientFeature<ClientFeatureProps>)\n    | ClientFeature<ClientFeatureProps>\n}\n\nexport type PluginComponent<ClientFeatureProps = any> = React.FC<{\n  clientProps: ClientFeatureProps\n}>\nexport type PluginComponentWithAnchor<ClientFeatureProps = any> = React.FC<{\n  anchorElem: HTMLElement\n  clientProps: ClientFeatureProps\n}>\n\n/**\n * Plugins are react components which get added to the editor. You can use them to interact with lexical, e.g. to create a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n */\nexport type SanitizedPlugin =\n  | {\n      clientProps: any\n      // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n      Component: PluginComponent\n      key: string\n      position: 'bottom' // Determines at which position the Component will be added.\n    }\n  | {\n      clientProps: any\n      // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n      Component: PluginComponent\n      key: string\n      position: 'normal' // Determines at which position the Component will be added.\n    }\n  | {\n      clientProps: any\n      // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n      Component: PluginComponent\n      key: string\n      position: 'top' // Determines at which position the Component will be added.\n    }\n  | {\n      clientProps: any\n      // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n      Component: PluginComponentWithAnchor\n      desktopOnly?: boolean\n      key: string\n      position: 'floatingAnchorElem' // Determines at which position the Component will be added.\n    }\n  | {\n      clientProps: any\n      Component: PluginComponent\n      key: string\n      position: 'aboveContainer'\n    }\n  | {\n      clientProps: any\n      Component: PluginComponent\n      key: string\n      position: 'belowContainer'\n    }\n\nexport type ClientFeature<ClientFeatureProps> = {\n  /**\n   * The text formats which are enabled by this feature.\n   */\n  enableFormats?: TextFormatType[]\n  markdownTransformers?: (\n    | ((props: {\n        allNodes: Array<Klass<LexicalNode> | LexicalNodeReplacement>\n        allTransformers: Transformer[]\n      }) => Transformer)\n    | Transformer\n  )[]\n  nodes?: Array<Klass<LexicalNode> | LexicalNodeReplacement>\n  /**\n   * Plugins are react components which get added to the editor. You can use them to interact with lexical, e.g. to create a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n   */\n  plugins?: Array<\n    | {\n        // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n        Component: PluginComponent<ClientFeatureProps>\n        position: 'aboveContainer' // Determines at which position the Component will be added.\n      }\n    | {\n        // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n        Component: PluginComponent<ClientFeatureProps>\n        position: 'bottom' // Determines at which position the Component will be added.\n      }\n    | {\n        // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n        Component: PluginComponent<ClientFeatureProps>\n        position: 'normal' // Determines at which position the Component will be added.\n      }\n    | {\n        // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n        Component: PluginComponent<ClientFeatureProps>\n        position: 'top' // Determines at which position the Component will be added.\n      }\n    | {\n        // plugins are anything which is not directly part of the editor. Like, creating a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n        Component: PluginComponentWithAnchor<ClientFeatureProps>\n        position: 'floatingAnchorElem' // Determines at which position the Component will be added.\n      }\n    | {\n        Component: PluginComponent<ClientFeatureProps>\n        position: 'belowContainer' // Determines at which position the Component will be added.\n      }\n  >\n  /**\n   * Client Features can register their own providers, which will be nested below the EditorConfigProvider\n   */\n  providers?: Array<React.FC<{ children: JSX.Element }>>\n  /**\n   * Return props, to make it easy to retrieve passed in props to this Feature for the client if anyone wants to\n   */\n  sanitizedClientFeatureProps?: BaseClientFeatureProps<ClientFeatureProps>\n  slashMenu?: {\n    /**\n     * Dynamic groups allow you to add different groups depending on the query string (so, the text after the slash).\n     * Thus, to re-calculate the available groups, this function will be called every time you type after the /.\n     *\n     * The groups provided by dynamicGroups will be merged with the static groups provided by the groups property.\n     */\n    dynamicGroups?: ({\n      editor,\n      queryString,\n    }: {\n      editor: LexicalEditor\n      queryString: string\n    }) => SlashMenuGroup[]\n    /**\n     * Static array of groups together with the items in them. These will always be present.\n     * While typing after the /, they will be filtered by the query string and the keywords, key and display name of the items.\n     */\n    groups?: SlashMenuGroup[]\n  }\n  /**\n   * An opt-in, classic fixed toolbar which stays at the top of the editor\n   */\n  toolbarFixed?: {\n    groups: ToolbarGroup[]\n  }\n  /**\n   * The default, floating toolbar which appears when you select text.\n   */\n  toolbarInline?: {\n    /**\n     * Array of toolbar groups / sections. Each section can contain multiple toolbar items.\n     */\n    groups: ToolbarGroup[]\n  }\n}\n\nexport type BaseClientFeatureProps<ClientFeatureProps> = ClientFeatureProps extends undefined\n  ? {\n      featureKey: string\n      order: number\n    }\n  : {\n      featureKey: string\n      order: number\n    } & ClientFeatureProps\n\nexport type ResolvedClientFeature<ClientFeatureProps> = {\n  key: string\n  order: number\n} & ClientFeature<ClientFeatureProps>\n\nexport type ResolvedClientFeatureMap = Map<string, ResolvedClientFeature<any>>\n\nexport type ClientFeatureProviderMap = Map<string, FeatureProviderClient<any, any>>\n\nexport type SanitizedClientFeatures = {\n  /** The keys of all enabled features */\n  enabledFeatures: string[]\n  enabledFormats: TextFormatType[]\n  markdownTransformers: Transformer[]\n\n  /**\n   * Plugins are react components which get added to the editor. You can use them to interact with lexical, e.g. to create a command which creates a node, or opens a modal, or some other more \"outside\" functionality\n   */\n  plugins?: Array<SanitizedPlugin>\n  slashMenu: {\n    /**\n     * Dynamic groups allow you to add different groups depending on the query string (so, the text after the slash).\n     * Thus, to re-calculate the available groups, this function will be called every time you type after the /.\n     *\n     * The groups provided by dynamicGroups will be merged with the static groups provided by the groups property.\n     */\n    dynamicGroups: Array<\n      ({ editor, queryString }: { editor: LexicalEditor; queryString: string }) => SlashMenuGroup[]\n    >\n    /**\n     * Static array of groups together with the items in them. These will always be present.\n     * While typing after the /, they will be filtered by the query string and the keywords, key and display name of the items.\n     */\n    groups: SlashMenuGroup[]\n  }\n} & Required<\n  Pick<ResolvedClientFeature<unknown>, 'nodes' | 'providers' | 'toolbarFixed' | 'toolbarInline'>\n>\n"],"mappings":"AAuNA","ignoreList":[]}