@allxsmith/bestax-bulma 5.67.8 → 5.67.10

package/dist/esm/components/ContextMenu.js

@@ -38,8 +38,8 @@ function chain(own, ours) {
  * Shift+F10 and the context menu key open it too, where the browser fires
  * `contextmenu` for them, which Windows and Linux do. The menu is Dropdown's
  * markup, portaled, so it never has server markup: into the
- * `portalContainer` a `ConfigProvider` sets, else the `Modal`, `Dialog` or
- * `Command.Dialog` it's in, where screen readers that honor the dialog's
+ * `portalContainer` a `ConfigProvider` sets, else the overlay it's in that
+ * takes its popups, such as a `Modal`, where screen readers that honor its
  * `aria-modal` reach it, else the end of the trigger's own document's
  * `<body>`. It opens below and to the right of the point, flips above or to
  * the left where there's no room, moves in where it fits neither way, and

package/dist/esm/components/ContextMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.js","sources":["../../../src/components/ContextMenu.tsx"],"sourcesContent":["import React, { cloneElement, useEffect, useRef, useState } from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { Portal, usePopupContainer } from '../helpers/portal';\nimport { useClientLayoutEffect } from '../helpers/useClientLayoutEffect';\nimport { getDeepestActiveElement, isEventInside } from '../helpers/shadowDom';\nimport { warnOnce } from '../helpers/devWarnings';\nimport {\n  useContextMenuTrigger,\n  type ContextMenuPoint,\n  type ContextMenuTriggerHandlers,\n} from '../helpers/useContextMenuTrigger';\nimport {\n  enabledMenuItems,\n  isEnabledMenuItem,\n  MENU_ITEM_SELECTOR,\n  useMenuKeys,\n} from '../helpers/useMenuKeys';\nimport { DropdownDivider, DropdownItem } from './Dropdown';\n\n/**\n * Props for the ContextMenu component. `className`, `id`, `aria-label`, the\n * other HTML attributes and the helper props land on the menu\n * (`role=\"menu\"`). The trigger keeps its own.\n * @extraProp {string} [aria-label] - The menu's accessible name, such as \"Actions for report.pdf\". There's no button to borrow a name from, so pass this or `aria-labelledby`, and a development build warns when the menu opens with neither.\n * @extraProp {string} [className] - Additional classes for the menu (`role=\"menu\"`). The trigger keeps its own.\n */\nexport interface ContextMenuProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'color' | 'children'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * The element a right-click, Shift+F10, the context menu key or a long\n   * press opens the menu from: a table row, a card, an image. It's cloned,\n   * not wrapped, so a row stays a row, which means it has to be a single\n   * element that passes `className` and the `onContextMenu`,\n   * `onPointerDown`, `onPointerMove`, `onPointerUp`, `onPointerCancel` and\n   * `onTouchEnd` handlers to its DOM node. Its own handlers for those run\n   * first, and one that calls `preventDefault()` on `contextmenu` keeps the\n   * menu closed. A `ContextMenu` inside it opens instead of this one.\n   *\n   * It gets no ARIA and no tab stop, since it can be any element and a\n   * right-click isn't an activation. Keyboard users reach it through\n   * something focusable inside it, such as the row's own `Dropdown` button,\n   * or a `tabIndex={0}` you give it, and press Shift+F10 or the context menu\n   * key there. It gets `-webkit-touch-callout: none`, so iOS doesn't put its\n   * own callout for a link or an image over the menu. A long press still\n   * selects text the way it does anywhere, so give a region where it\n   * shouldn't `interaction=\"unselectable\"`.\n   */\n  trigger: React.ReactElement;\n  /**\n   * The menu's items: `ContextMenu.Item` and `ContextMenu.Divider`, the same\n   * components as `Dropdown.Item` and `Dropdown.Divider`. Every action in it\n   * needs a visible way in as well, such as a `Dropdown` on the same row:\n   * nothing tells a screen reader user the menu is there, and on macOS only\n   * VoiceOver opens it from the keyboard.\n   */\n  children: React.ReactNode;\n  /**\n   * Called with `true` when the menu opens and `false` when it closes,\n   * whatever closed it, such as for highlighting the row whose menu is open.\n   * Nothing fires after ContextMenu unmounts. There's no `open` prop to go\n   * with it: a menu opened from code has no point to open at.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Close the menu when an item is clicked, or activated with Enter or\n   * Space. A click on a divider or between items leaves it open either way.\n   */\n  closeOnClick?: boolean;\n  /**\n   * Leave the trigger to the browser: a right-click shows the browser's own\n   * menu, a long press does what it does anywhere, and an open menu closes.\n   */\n  disabled?: boolean;\n}\n\n/** Where the menu goes once it's measured. */\ninterface Placement {\n  /** The box's corner in the viewport, which the menu hangs from. */\n  top: number;\n  left: number;\n  /** The menu sits above the box rather than below it. */\n  up: boolean;\n  /** The menu sits to the left of the box rather than to its right. */\n  right: boolean;\n}\n\n/** An open menu. */\ninterface OpenMenu {\n  point: ContextMenuPoint;\n  /** The trigger's document, where presses and scrolling are watched. */\n  doc: Document;\n  /** Unset until the menu is measured, which happens before it paints. */\n  placed?: Placement;\n}\n\n/**\n * Where the menu goes along one axis, from the point at `at`: after it when\n * there's room, before it when there's room there instead, and otherwise\n * moved in until it fits in `room`.\n */\nfunction placeAlong(\n  at: number,\n  size: number,\n  room: number\n): { start: number; flip: boolean } {\n  if (at + size <= room) return { start: at, flip: false };\n  if (at - size >= 0) return { start: at, flip: true };\n  return { start: Math.max(0, room - size), flip: false };\n}\n\n/** Runs the trigger's own handler, then the context menu's. */\nfunction chain<E>(\n  own: ((event: E) => void) | undefined,\n  ours: (event: E) => void\n): (event: E) => void {\n  return event => {\n    own?.(event);\n    ours(event);\n  };\n}\n\n/**\n * The `ContextMenu` component opens a menu of actions where you right-click an element, such as a table row or a card, or long press it on a touch screen.\n *\n * Shift+F10 and the context menu key open it too, where the browser fires\n * `contextmenu` for them, which Windows and Linux do. The menu is Dropdown's\n * markup, portaled, so it never has server markup: into the\n * `portalContainer` a `ConfigProvider` sets, else the `Modal`, `Dialog` or\n * `Command.Dialog` it's in, where screen readers that honor the dialog's\n * `aria-modal` reach it, else the end of the trigger's own document's\n * `<body>`. It opens below and to the right of the point, flips above or to\n * the left where there's no room, moves in where it fits neither way, and\n * scrolls inside when it's taller than the viewport. It doesn't follow the\n * trigger, since scrolling closes it. Inside a shadow root, point\n * `portalContainer` inside it, so the shadow root's styles apply.\n *\n * Opening moves focus to the first enabled item. The arrow keys, Home, End\n * and typing move between items, and Enter and Space activate one. Escape,\n * Tab, an item, a press outside, scrolling, resizing and the window losing\n * focus close it, handing focus back to what had it unless an item moved it\n * somewhere else. For a menu opened from a button use `Dropdown`.\n *\n * @function\n * @param {ContextMenuProps} props - Props for the ContextMenu component.\n * @returns {JSX.Element} The trigger, and the menu while open.\n *\n * @example\n * <ContextMenu\n *   aria-label=\"Actions for report.pdf\"\n *   trigger={<Box>report.pdf</Box>}\n * >\n *   <ContextMenu.Item as=\"button\">Rename</ContextMenu.Item>\n *   <ContextMenu.Divider />\n *   <ContextMenu.Item as=\"button\">Delete</ContextMenu.Item>\n * </ContextMenu>\n */\nconst ContextMenuComponent: React.FC<ContextMenuProps> = ({\n  trigger,\n  children,\n  onOpenChange,\n  closeOnClick = true,\n  disabled = false,\n  className,\n  onKeyDown,\n  onClick,\n  onContextMenu,\n  ...props\n}) => {\n  const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n  const popupContainer = usePopupContainer();\n  const [menu, setMenu] = useState<OpenMenu | null>(null);\n  // Turning `disabled` on closes it.\n  if (disabled && menu) setMenu(null);\n  const open = menu !== null;\n  const doc = menu?.doc;\n  const placed = menu?.placed;\n\n  const boxRef = useRef<HTMLDivElement>(null);\n  const menuRef = useRef<HTMLDivElement>(null);\n  const openerRef = useRef<Element | null>(null);\n  const reportedRef = useRef(false);\n  const menuKeys = useMenuKeys();\n  const named = Boolean(props['aria-label'] || props['aria-labelledby']);\n\n  const handlers = useContextMenuTrigger({\n    disabled,\n    onOpen: (point, triggerNode) => {\n      const ownerDoc = triggerNode.ownerDocument;\n      openerRef.current = getDeepestActiveElement(ownerDoc);\n      setMenu({ point, doc: ownerDoc });\n    },\n  });\n\n  // Measured once per opening, before it paints, against what a fixed box\n  // resolves against: the root element's client area, which leaves out a\n  // classic scrollbar. `useAnchoredPosition` and Tooltip read innerWidth and\n  // innerHeight, which count it. A menu pinned to the viewport's edge would\n  // sit under the scrollbar by that much, so this reads the narrower box.\n  useClientLayoutEffect(() => {\n    const menuNode = menuRef.current;\n    if (!menu || menu.placed || !menuNode) return;\n    const root = menuNode.ownerDocument.documentElement;\n    const { width, height } = menuNode.getBoundingClientRect();\n    const x = placeAlong(menu.point.x, width, root.clientWidth);\n    const y = placeAlong(menu.point.y, height, root.clientHeight);\n    setMenu({\n      ...menu,\n      placed: { left: x.start, top: y.start, right: x.flip, up: y.flip },\n    });\n  }, [menu]);\n  const isPlaced = Boolean(placed);\n\n  // What closes it while it's open, and focus back on closing. Nothing\n  // listens while it's closed.\n  useEffect(() => {\n    const box = boxRef.current;\n    const menuNode = menuRef.current;\n    if (!doc || !box || !menuNode) return undefined;\n    const view = doc.defaultView as Window;\n    // What had focus when it opened. This runs once per opening, so opening\n    // again at a new point while it's open keeps it.\n    const opener = openerRef.current as HTMLElement | null;\n    const close = () => setMenu(null);\n    const closeOutside = (event: Event) => {\n      if (!isEventInside(event, box)) close();\n    };\n    doc.addEventListener('pointerdown', closeOutside, true);\n    view.addEventListener('resize', close);\n    view.addEventListener('blur', close);\n    return () => {\n      doc.removeEventListener('pointerdown', closeOutside, true);\n      view.removeEventListener('resize', close);\n      view.removeEventListener('blur', close);\n      // Back to what had focus while the menu still has it, or it dropped to\n      // <body> when the menu left. An item that put it somewhere else, such\n      // as a Modal or a rename field, keeps it there.\n      const now = getDeepestActiveElement(doc);\n      if (!now || now === doc.body || menuNode.contains(now)) opener?.focus();\n    };\n  }, [doc]);\n\n  // Focus in, and closing on scroll, once it's placed. Placed, it's inside\n  // the viewport, so its first item has nothing to scroll into view, and\n  // `preventScroll` makes sure: a scroll the focus caused would close it as\n  // it opened. Opening again at a new point places it again, and leaves\n  // focus where it is in the menu.\n  useEffect(() => {\n    const box = boxRef.current;\n    const menuNode = menuRef.current;\n    if (!doc || !isPlaced || !box || !menuNode) return undefined;\n    if (!menuNode.contains(getDeepestActiveElement(doc))) {\n      menuKeys.reset();\n      (enabledMenuItems(menuNode)[0] ?? menuNode).focus({\n        preventScroll: true,\n      });\n    }\n    const closeOutside = (event: Event) => {\n      if (!isEventInside(event, box)) setMenu(null);\n    };\n    doc.addEventListener('scroll', closeOutside, true);\n    return () => doc.removeEventListener('scroll', closeOutside, true);\n  }, [doc, isPlaced, menuKeys]);\n\n  // Before paint, so what the caller does with it, such as highlighting the\n  // row, shows with the menu rather than a frame behind it.\n  useClientLayoutEffect(() => {\n    if (open === reportedRef.current) return;\n    reportedRef.current = open;\n    onOpenChange?.(open);\n  });\n\n  useEffect(() => {\n    if (open && !named) {\n      warnOnce(\n        'ContextMenu:unnamed',\n        '[bestax-bulma] <ContextMenu> opened a menu with no accessible ' +\n          'name. Pass aria-label or aria-labelledby.'\n      );\n    }\n  }, [open, named]);\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    onKeyDown?.(event);\n    // The menu has the keyboard while focus is in it. React brings its keys\n    // up the tree to wherever the ContextMenu sits, where a table that moves\n    // between rows on the arrow keys, or a Popover or a Modal waiting for\n    // Escape, would take them too.\n    event.stopPropagation();\n    if (event.key === 'Escape' || event.key === 'Tab') {\n      // Tab would go on from the end of <body>, past the rest of the page.\n      event.preventDefault();\n      setMenu(null);\n      return;\n    }\n    menuKeys.onKeyDown(event);\n  };\n\n  const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n    onClick?.(event);\n    if (!closeOnClick) return;\n    const item = (event.target as Element).closest(MENU_ITEM_SELECTOR);\n    if (item && isEnabledMenuItem(item)) setMenu(null);\n  };\n\n  const handleContextMenu = (event: React.MouseEvent<HTMLDivElement>) => {\n    onContextMenu?.(event);\n    // No other menu over this one: not the browser's, and not a trigger's\n    // that React brings the event up to.\n    event.preventDefault();\n    event.stopPropagation();\n  };\n\n  const own = trigger.props as Partial<ContextMenuTriggerHandlers> & {\n    className?: string;\n  };\n  const triggerClass = usePrefixedClassNames('context-menu');\n  const clonedTrigger = cloneElement(\n    trigger as React.ReactElement<Record<string, unknown>>,\n    {\n      className:\n        classNames(own.className, !disabled && triggerClass) || undefined,\n      onContextMenu: chain(own.onContextMenu, handlers.onContextMenu),\n      onPointerDown: chain(own.onPointerDown, handlers.onPointerDown),\n      onPointerMove: chain(own.onPointerMove, handlers.onPointerMove),\n      onPointerUp: chain(own.onPointerUp, handlers.onPointerUp),\n      onPointerCancel: chain(own.onPointerCancel, handlers.onPointerCancel),\n      onTouchEnd: chain(own.onTouchEnd, handlers.onTouchEnd),\n    }\n  );\n\n  const boxClasses = usePrefixedClassNames('context-menu-content', 'dropdown', {\n    'is-active': true,\n    'is-up': placed?.up,\n    'is-right': placed?.right,\n  });\n  const menuClasses = classNames(\n    usePrefixedClassNames('dropdown-menu'),\n    bulmaHelperClasses,\n    className\n  );\n  const contentClasses = usePrefixedClassNames('dropdown-content');\n\n  return (\n    <>\n      {clonedTrigger}\n      {menu && (\n        <Portal container={popupContainer || menu.doc.body}>\n          <div\n            ref={boxRef}\n            className={boxClasses}\n            style={{\n              top: placed?.top ?? menu.point.y,\n              left: placed?.left ?? menu.point.x,\n            }}\n          >\n            <div\n              {...rest}\n              ref={menuRef}\n              role=\"menu\"\n              tabIndex={-1}\n              className={menuClasses}\n              onKeyDown={handleKeyDown}\n              onClick={handleClick}\n              onContextMenu={handleContextMenu}\n            >\n              <div className={contentClasses}>{children}</div>\n            </div>\n          </div>\n        </Portal>\n      )}\n    </>\n  );\n};\n\n/**\n * ContextMenu with Item and Divider sub-components, which are `Dropdown.Item`\n * and `Dropdown.Divider`, so items written for a Dropdown work here\n * unchanged.\n */\nexport const ContextMenu = withSubComponents(\n  ContextMenuComponent,\n  {\n    Item: DropdownItem,\n    Divider: DropdownDivider,\n  },\n  'ContextMenu'\n);\n\nexport default ContextMenu;\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}
+{"version":3,"file":"ContextMenu.js","sources":["../../../src/components/ContextMenu.tsx"],"sourcesContent":["import React, { cloneElement, useEffect, useRef, useState } from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { Portal, usePopupContainer } from '../helpers/portal';\nimport { useClientLayoutEffect } from '../helpers/useClientLayoutEffect';\nimport { getDeepestActiveElement, isEventInside } from '../helpers/shadowDom';\nimport { warnOnce } from '../helpers/devWarnings';\nimport {\n  useContextMenuTrigger,\n  type ContextMenuPoint,\n  type ContextMenuTriggerHandlers,\n} from '../helpers/useContextMenuTrigger';\nimport {\n  enabledMenuItems,\n  isEnabledMenuItem,\n  MENU_ITEM_SELECTOR,\n  useMenuKeys,\n} from '../helpers/useMenuKeys';\nimport { DropdownDivider, DropdownItem } from './Dropdown';\n\n/**\n * Props for the ContextMenu component. `className`, `id`, `aria-label`, the\n * other HTML attributes and the helper props land on the menu\n * (`role=\"menu\"`). The trigger keeps its own.\n * @extraProp {string} [aria-label] - The menu's accessible name, such as \"Actions for report.pdf\". There's no button to borrow a name from, so pass this or `aria-labelledby`, and a development build warns when the menu opens with neither.\n * @extraProp {string} [className] - Additional classes for the menu (`role=\"menu\"`). The trigger keeps its own.\n */\nexport interface ContextMenuProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'color' | 'children'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * The element a right-click, Shift+F10, the context menu key or a long\n   * press opens the menu from: a table row, a card, an image. It's cloned,\n   * not wrapped, so a row stays a row, which means it has to be a single\n   * element that passes `className` and the `onContextMenu`,\n   * `onPointerDown`, `onPointerMove`, `onPointerUp`, `onPointerCancel` and\n   * `onTouchEnd` handlers to its DOM node. Its own handlers for those run\n   * first, and one that calls `preventDefault()` on `contextmenu` keeps the\n   * menu closed. A `ContextMenu` inside it opens instead of this one.\n   *\n   * It gets no ARIA and no tab stop, since it can be any element and a\n   * right-click isn't an activation. Keyboard users reach it through\n   * something focusable inside it, such as the row's own `Dropdown` button,\n   * or a `tabIndex={0}` you give it, and press Shift+F10 or the context menu\n   * key there. It gets `-webkit-touch-callout: none`, so iOS doesn't put its\n   * own callout for a link or an image over the menu. A long press still\n   * selects text the way it does anywhere, so give a region where it\n   * shouldn't `interaction=\"unselectable\"`.\n   */\n  trigger: React.ReactElement;\n  /**\n   * The menu's items: `ContextMenu.Item` and `ContextMenu.Divider`, the same\n   * components as `Dropdown.Item` and `Dropdown.Divider`. Every action in it\n   * needs a visible way in as well, such as a `Dropdown` on the same row:\n   * nothing tells a screen reader user the menu is there, and on macOS only\n   * VoiceOver opens it from the keyboard.\n   */\n  children: React.ReactNode;\n  /**\n   * Called with `true` when the menu opens and `false` when it closes,\n   * whatever closed it, such as for highlighting the row whose menu is open.\n   * Nothing fires after ContextMenu unmounts. There's no `open` prop to go\n   * with it: a menu opened from code has no point to open at.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Close the menu when an item is clicked, or activated with Enter or\n   * Space. A click on a divider or between items leaves it open either way.\n   */\n  closeOnClick?: boolean;\n  /**\n   * Leave the trigger to the browser: a right-click shows the browser's own\n   * menu, a long press does what it does anywhere, and an open menu closes.\n   */\n  disabled?: boolean;\n}\n\n/** Where the menu goes once it's measured. */\ninterface Placement {\n  /** The box's corner in the viewport, which the menu hangs from. */\n  top: number;\n  left: number;\n  /** The menu sits above the box rather than below it. */\n  up: boolean;\n  /** The menu sits to the left of the box rather than to its right. */\n  right: boolean;\n}\n\n/** An open menu. */\ninterface OpenMenu {\n  point: ContextMenuPoint;\n  /** The trigger's document, where presses and scrolling are watched. */\n  doc: Document;\n  /** Unset until the menu is measured, which happens before it paints. */\n  placed?: Placement;\n}\n\n/**\n * Where the menu goes along one axis, from the point at `at`: after it when\n * there's room, before it when there's room there instead, and otherwise\n * moved in until it fits in `room`.\n */\nfunction placeAlong(\n  at: number,\n  size: number,\n  room: number\n): { start: number; flip: boolean } {\n  if (at + size <= room) return { start: at, flip: false };\n  if (at - size >= 0) return { start: at, flip: true };\n  return { start: Math.max(0, room - size), flip: false };\n}\n\n/** Runs the trigger's own handler, then the context menu's. */\nfunction chain<E>(\n  own: ((event: E) => void) | undefined,\n  ours: (event: E) => void\n): (event: E) => void {\n  return event => {\n    own?.(event);\n    ours(event);\n  };\n}\n\n/**\n * The `ContextMenu` component opens a menu of actions where you right-click an element, such as a table row or a card, or long press it on a touch screen.\n *\n * Shift+F10 and the context menu key open it too, where the browser fires\n * `contextmenu` for them, which Windows and Linux do. The menu is Dropdown's\n * markup, portaled, so it never has server markup: into the\n * `portalContainer` a `ConfigProvider` sets, else the overlay it's in that\n * takes its popups, such as a `Modal`, where screen readers that honor its\n * `aria-modal` reach it, else the end of the trigger's own document's\n * `<body>`. It opens below and to the right of the point, flips above or to\n * the left where there's no room, moves in where it fits neither way, and\n * scrolls inside when it's taller than the viewport. It doesn't follow the\n * trigger, since scrolling closes it. Inside a shadow root, point\n * `portalContainer` inside it, so the shadow root's styles apply.\n *\n * Opening moves focus to the first enabled item. The arrow keys, Home, End\n * and typing move between items, and Enter and Space activate one. Escape,\n * Tab, an item, a press outside, scrolling, resizing and the window losing\n * focus close it, handing focus back to what had it unless an item moved it\n * somewhere else. For a menu opened from a button use `Dropdown`.\n *\n * @function\n * @param {ContextMenuProps} props - Props for the ContextMenu component.\n * @returns {JSX.Element} The trigger, and the menu while open.\n *\n * @example\n * <ContextMenu\n *   aria-label=\"Actions for report.pdf\"\n *   trigger={<Box>report.pdf</Box>}\n * >\n *   <ContextMenu.Item as=\"button\">Rename</ContextMenu.Item>\n *   <ContextMenu.Divider />\n *   <ContextMenu.Item as=\"button\">Delete</ContextMenu.Item>\n * </ContextMenu>\n */\nconst ContextMenuComponent: React.FC<ContextMenuProps> = ({\n  trigger,\n  children,\n  onOpenChange,\n  closeOnClick = true,\n  disabled = false,\n  className,\n  onKeyDown,\n  onClick,\n  onContextMenu,\n  ...props\n}) => {\n  const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n  const popupContainer = usePopupContainer();\n  const [menu, setMenu] = useState<OpenMenu | null>(null);\n  // Turning `disabled` on closes it.\n  if (disabled && menu) setMenu(null);\n  const open = menu !== null;\n  const doc = menu?.doc;\n  const placed = menu?.placed;\n\n  const boxRef = useRef<HTMLDivElement>(null);\n  const menuRef = useRef<HTMLDivElement>(null);\n  const openerRef = useRef<Element | null>(null);\n  const reportedRef = useRef(false);\n  const menuKeys = useMenuKeys();\n  const named = Boolean(props['aria-label'] || props['aria-labelledby']);\n\n  const handlers = useContextMenuTrigger({\n    disabled,\n    onOpen: (point, triggerNode) => {\n      const ownerDoc = triggerNode.ownerDocument;\n      openerRef.current = getDeepestActiveElement(ownerDoc);\n      setMenu({ point, doc: ownerDoc });\n    },\n  });\n\n  // Measured once per opening, before it paints, against what a fixed box\n  // resolves against: the root element's client area, which leaves out a\n  // classic scrollbar. `useAnchoredPosition` and Tooltip read innerWidth and\n  // innerHeight, which count it. A menu pinned to the viewport's edge would\n  // sit under the scrollbar by that much, so this reads the narrower box.\n  useClientLayoutEffect(() => {\n    const menuNode = menuRef.current;\n    if (!menu || menu.placed || !menuNode) return;\n    const root = menuNode.ownerDocument.documentElement;\n    const { width, height } = menuNode.getBoundingClientRect();\n    const x = placeAlong(menu.point.x, width, root.clientWidth);\n    const y = placeAlong(menu.point.y, height, root.clientHeight);\n    setMenu({\n      ...menu,\n      placed: { left: x.start, top: y.start, right: x.flip, up: y.flip },\n    });\n  }, [menu]);\n  const isPlaced = Boolean(placed);\n\n  // What closes it while it's open, and focus back on closing. Nothing\n  // listens while it's closed.\n  useEffect(() => {\n    const box = boxRef.current;\n    const menuNode = menuRef.current;\n    if (!doc || !box || !menuNode) return undefined;\n    const view = doc.defaultView as Window;\n    // What had focus when it opened. This runs once per opening, so opening\n    // again at a new point while it's open keeps it.\n    const opener = openerRef.current as HTMLElement | null;\n    const close = () => setMenu(null);\n    const closeOutside = (event: Event) => {\n      if (!isEventInside(event, box)) close();\n    };\n    doc.addEventListener('pointerdown', closeOutside, true);\n    view.addEventListener('resize', close);\n    view.addEventListener('blur', close);\n    return () => {\n      doc.removeEventListener('pointerdown', closeOutside, true);\n      view.removeEventListener('resize', close);\n      view.removeEventListener('blur', close);\n      // Back to what had focus while the menu still has it, or it dropped to\n      // <body> when the menu left. An item that put it somewhere else, such\n      // as a Modal or a rename field, keeps it there.\n      const now = getDeepestActiveElement(doc);\n      if (!now || now === doc.body || menuNode.contains(now)) opener?.focus();\n    };\n  }, [doc]);\n\n  // Focus in, and closing on scroll, once it's placed. Placed, it's inside\n  // the viewport, so its first item has nothing to scroll into view, and\n  // `preventScroll` makes sure: a scroll the focus caused would close it as\n  // it opened. Opening again at a new point places it again, and leaves\n  // focus where it is in the menu.\n  useEffect(() => {\n    const box = boxRef.current;\n    const menuNode = menuRef.current;\n    if (!doc || !isPlaced || !box || !menuNode) return undefined;\n    if (!menuNode.contains(getDeepestActiveElement(doc))) {\n      menuKeys.reset();\n      (enabledMenuItems(menuNode)[0] ?? menuNode).focus({\n        preventScroll: true,\n      });\n    }\n    const closeOutside = (event: Event) => {\n      if (!isEventInside(event, box)) setMenu(null);\n    };\n    doc.addEventListener('scroll', closeOutside, true);\n    return () => doc.removeEventListener('scroll', closeOutside, true);\n  }, [doc, isPlaced, menuKeys]);\n\n  // Before paint, so what the caller does with it, such as highlighting the\n  // row, shows with the menu rather than a frame behind it.\n  useClientLayoutEffect(() => {\n    if (open === reportedRef.current) return;\n    reportedRef.current = open;\n    onOpenChange?.(open);\n  });\n\n  useEffect(() => {\n    if (open && !named) {\n      warnOnce(\n        'ContextMenu:unnamed',\n        '[bestax-bulma] <ContextMenu> opened a menu with no accessible ' +\n          'name. Pass aria-label or aria-labelledby.'\n      );\n    }\n  }, [open, named]);\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    onKeyDown?.(event);\n    // The menu has the keyboard while focus is in it. React brings its keys\n    // up the tree to wherever the ContextMenu sits, where a table that moves\n    // between rows on the arrow keys, or a Popover or a Modal waiting for\n    // Escape, would take them too.\n    event.stopPropagation();\n    if (event.key === 'Escape' || event.key === 'Tab') {\n      // Tab would go on from the end of <body>, past the rest of the page.\n      event.preventDefault();\n      setMenu(null);\n      return;\n    }\n    menuKeys.onKeyDown(event);\n  };\n\n  const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n    onClick?.(event);\n    if (!closeOnClick) return;\n    const item = (event.target as Element).closest(MENU_ITEM_SELECTOR);\n    if (item && isEnabledMenuItem(item)) setMenu(null);\n  };\n\n  const handleContextMenu = (event: React.MouseEvent<HTMLDivElement>) => {\n    onContextMenu?.(event);\n    // No other menu over this one: not the browser's, and not a trigger's\n    // that React brings the event up to.\n    event.preventDefault();\n    event.stopPropagation();\n  };\n\n  const own = trigger.props as Partial<ContextMenuTriggerHandlers> & {\n    className?: string;\n  };\n  const triggerClass = usePrefixedClassNames('context-menu');\n  const clonedTrigger = cloneElement(\n    trigger as React.ReactElement<Record<string, unknown>>,\n    {\n      className:\n        classNames(own.className, !disabled && triggerClass) || undefined,\n      onContextMenu: chain(own.onContextMenu, handlers.onContextMenu),\n      onPointerDown: chain(own.onPointerDown, handlers.onPointerDown),\n      onPointerMove: chain(own.onPointerMove, handlers.onPointerMove),\n      onPointerUp: chain(own.onPointerUp, handlers.onPointerUp),\n      onPointerCancel: chain(own.onPointerCancel, handlers.onPointerCancel),\n      onTouchEnd: chain(own.onTouchEnd, handlers.onTouchEnd),\n    }\n  );\n\n  const boxClasses = usePrefixedClassNames('context-menu-content', 'dropdown', {\n    'is-active': true,\n    'is-up': placed?.up,\n    'is-right': placed?.right,\n  });\n  const menuClasses = classNames(\n    usePrefixedClassNames('dropdown-menu'),\n    bulmaHelperClasses,\n    className\n  );\n  const contentClasses = usePrefixedClassNames('dropdown-content');\n\n  return (\n    <>\n      {clonedTrigger}\n      {menu && (\n        <Portal container={popupContainer || menu.doc.body}>\n          <div\n            ref={boxRef}\n            className={boxClasses}\n            style={{\n              top: placed?.top ?? menu.point.y,\n              left: placed?.left ?? menu.point.x,\n            }}\n          >\n            <div\n              {...rest}\n              ref={menuRef}\n              role=\"menu\"\n              tabIndex={-1}\n              className={menuClasses}\n              onKeyDown={handleKeyDown}\n              onClick={handleClick}\n              onContextMenu={handleContextMenu}\n            >\n              <div className={contentClasses}>{children}</div>\n            </div>\n          </div>\n        </Portal>\n      )}\n    </>\n  );\n};\n\n/**\n * ContextMenu with Item and Divider sub-components, which are `Dropdown.Item`\n * and `Dropdown.Divider`, so items written for a Dropdown work here\n * unchanged.\n */\nexport const ContextMenu = withSubComponents(\n  ContextMenuComponent,\n  {\n    Item: DropdownItem,\n    Divider: DropdownDivider,\n  },\n  'ContextMenu'\n);\n\nexport default ContextMenu;\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}

package/dist/esm/components/DataTable.js

@@ -91,6 +91,7 @@ const DataTable = forwardRef(function DataTableRender({ columns, data, table: gi
     const toolbarClass = usePrefixedClassNames('data-table-toolbar');
     const actionsClass = usePrefixedClassNames('data-table-actions');
     const emptyClass = usePrefixedClassNames('data-table-empty');
+    const skeletonClass = usePrefixedClassNames('data-table-skeleton');
     const nameId = useId();
     const hasCaption = isShown(caption);
     const named = hasCaption || Boolean(ariaLabel || ariaLabelledby);
@@ -162,7 +163,7 @@ const DataTable = forwardRef(function DataTableRender({ columns, data, table: gi
                         disabled: selectAll.disabled || Boolean(loading) }) })), table.columns.map(column => (jsx(Th, { ...table.getHeaderCellProps(column), children: column.sortable ? (jsx("button", { ...table.getSortButtonProps(column), children: column.header })) : (column.header) }, column.id)))] }) }));
     let body;
     if (loading) {
-        body = Array.from({ length: size ?? 5 }, (_, index) => (jsx(Tr, { "aria-hidden": "true", children: Array.from({ length: columnCount }, (__, cell) => (jsx(Td, { children: jsx(Skeleton, { variant: "lines", lines: 1 }) }, cell))) }, index)));
+        body = Array.from({ length: size ?? 5 }, (_, index) => (jsx(Tr, { "aria-hidden": "true", children: Array.from({ length: columnCount }, (__, cell) => (jsx(Td, { children: jsx(Skeleton, { variant: "lines", lines: 1, className: skeletonClass }) }, cell))) }, index)));
     }
     else if (pageRows.length === 0) {
         // With `manual`, no rows under a search or a filter is no match: only

package/dist/esm/components/DataTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.js","sources":["../../../src/components/DataTable.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useId, useState } from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { warnOnce } from '../helpers/devWarnings';\nimport { visuallyHidden } from '../helpers/statusRegion';\nimport { Table } from '../elements/Table';\nimport { Thead } from '../elements/Thead';\nimport { Tbody } from '../elements/Tbody';\nimport { Tr, TrProps } from '../elements/Tr';\nimport { Th } from '../elements/Th';\nimport { Td } from '../elements/Td';\nimport { Skeleton } from '../elements/Skeleton';\nimport { Checkbox } from '../form/Checkbox';\nimport { Input } from '../form/Input';\nimport { EmptyState } from './EmptyState';\nimport { Pagination } from './Pagination';\nimport { ScrollArea } from './ScrollArea';\nimport {\n  isFiltering,\n  useDataTable,\n  type DataTableColumn,\n  type DataTableFilters,\n  type DataTableModel,\n  type DataTableStateOptions,\n} from './useDataTable';\n\nexport { useDataTable } from './useDataTable';\nexport type {\n  DataTableCSVOptions,\n  DataTableCellContext,\n  DataTableCellProps,\n  DataTableCheckboxProps,\n  DataTableColumn,\n  DataTableColumnMeta,\n  DataTableFilters,\n  DataTableHeaderCellProps,\n  DataTableLabels,\n  DataTableModel,\n  DataTablePaginationProps,\n  DataTableResolvedLabels,\n  DataTableRowScope,\n  DataTableSearchProps,\n  DataTableSelectionMode,\n  DataTableSort,\n  DataTableSortButtonProps,\n  DataTableSortDirection,\n  DataTableState,\n  DataTableStateOptions,\n  UseDataTableOptions,\n} from './useDataTable';\n\n/**\n * Props for the DataTable component. The helper props, `className`, the\n * `ref` and the other attributes go on the wrapper `<div>`, which holds the\n * toolbar, the table and the pager. `aria-label` and `aria-labelledby` name\n * the `<table>` itself.\n *\n * @extraProp {string} [aria-label] - Names the table, in place of a `caption`. A table needs a name, so pass a `caption`, this or `aria-labelledby`, and a development build warns when it has none.\n * @extraProp {string} [aria-labelledby] - The id of a visible heading that names the table, in place of a `caption`.\n * @extraProp {React.Ref<HTMLDivElement>} [ref] - Ref forwarded to the wrapper `<div>`.\n */\nexport interface DataTableProps<TRow>\n  extends\n    DataTableStateOptions<TRow>,\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * The columns, in the order they're shown. Required unless `table` is\n   * given. Keep the array the same from one render to the next, defined\n   * outside the component or in `useMemo`: a new one has every cell's text\n   * worked out again.\n   */\n  columns?: DataTableColumn<TRow>[];\n  /** The rows, as records of your own. Required unless `table` is given. */\n  data?: TRow[];\n  /**\n   * A table made by `useDataTable`, rendered in place of one made from\n   * `columns`, `data` and the state props, which are then left unread. Use\n   * it to put a toolbar, a count or an export button elsewhere on the page.\n   */\n  table?: DataTableModel<TRow>;\n  /**\n   * Names the table, as a visible `<caption>`. A table needs a name: this,\n   * `aria-label` or `aria-labelledby`.\n   */\n  caption?: React.ReactNode;\n  /** Adds borders to all cells. */\n  isBordered?: boolean;\n  /** Adds zebra-striping to rows. */\n  isStriped?: boolean;\n  /** Makes the table more compact by cutting cell padding in half. */\n  isNarrow?: boolean;\n  /** Adds a hover effect on rows. */\n  isHoverable?: boolean;\n  /** Makes the table span the full width of its wrapper. */\n  isFullwidth?: boolean;\n  /**\n   * Scrolls a table wider than its wrapper sideways, in a `ScrollArea`\n   * named after the table, which can be scrolled from the keyboard while it\n   * overflows.\n   */\n  isResponsive?: boolean;\n  /** Shows a search field in the toolbar, labelled by `labels.search`. */\n  hasSearch?: boolean;\n  /**\n   * More of the toolbar, after the search field: buttons for the selected\n   * rows, a filter, a download. Given the table.\n   */\n  toolbar?: (table: DataTableModel<TRow>) => React.ReactNode;\n  /**\n   * Shows a page of skeleton rows under the header in place of the rows,\n   * and marks the table busy. For data on its way, as from a server with\n   * `manual`.\n   */\n  loading?: boolean;\n  /**\n   * What the table shows when it has no rows at all, in one cell across\n   * every column. A small `EmptyState` saying `labels.empty` by default. A\n   * title of your own sits under the heading the table does, so give it the\n   * next level down with `titleAs`.\n   */\n  empty?: React.ReactNode;\n  /**\n   * What the table shows when the search and filters let no row through, in\n   * one cell across every column. A small `EmptyState` saying\n   * `labels.noResults` by default. A button that clears the search goes\n   * away with it, so send focus back to the search field when it's pressed.\n   */\n  noResults?: React.ReactNode;\n  /**\n   * Props of your own for a row's `Tr`, such as a handler or a class. The\n   * table's own (`isSelected`) win. To wrap a row in a `ContextMenu`, build\n   * the table from `useDataTable`'s props instead.\n   */\n  rowProps?: (row: TRow) => DataTableRowProps;\n  /** Additional CSS classes, on the wrapper `<div>`. */\n  className?: string;\n}\n\n/** What `rowProps` gives a row's `Tr`: any of its props but the ones the table sets. */\nexport type DataTableRowProps = Omit<TrProps, 'isSelected' | 'children'>;\n\n/** The type of `DataTable`, generic in the row. */\nexport type DataTableComponent = (<TRow>(\n  props: DataTableProps<TRow> & React.RefAttributes<HTMLDivElement>\n) => React.ReactElement | null) & { displayName?: string };\n\n/** How long the status region waits after a change before it speaks, in ms. */\nconst statusDelay = 500;\n\nconst noColumns: never[] = [];\nconst noRows: never[] = [];\n\n/** A text signature of the search and the filters, to tell when they change. */\nfunction filterSignature(search: string, filters: DataTableFilters): string {\n  try {\n    return JSON.stringify([search, Object.entries(filters).sort()]);\n  } catch {\n    return search;\n  }\n}\n\n/** Whether a node renders something. */\nconst isShown = (node: React.ReactNode) =>\n  node !== undefined && node !== null && node !== false && node !== '';\n\n/**\n * The `DataTable` component is a table of records that people can sort,\n * search, page through and select rows from, rendered with bestax's own\n * `Table` parts, `Checkbox` and `Pagination`.\n *\n * It's a native table, as in the WAI-ARIA Authoring Practices' sortable\n * table: a sortable header holds a button, the sorted one carries\n * `aria-sort`, and each row's checkbox is named for the row. It runs on\n * `useDataTable`, which custom markup can use too.\n *\n * @example\n * <DataTable\n *   caption=\"Users\"\n *   columns={[\n *     { id: 'name', header: 'Name', sortable: true, isRowHeader: true },\n *     { id: 'role', header: 'Role', sortable: true },\n *   ]}\n *   data={users}\n *   selectionMode=\"multiple\"\n *   pageSize={10}\n *   hasSearch\n * />\n */\nexport const DataTable = forwardRef(function DataTableRender<TRow>(\n  {\n    columns,\n    data,\n    table: given,\n    getRowId,\n    sort,\n    defaultSort,\n    onSortChange,\n    selectionMode,\n    selected,\n    defaultSelected,\n    onSelectedChange,\n    pageSize,\n    page,\n    defaultPage,\n    onPageChange,\n    search,\n    defaultSearch,\n    onSearchChange,\n    filters,\n    defaultFilters,\n    onFiltersChange,\n    manual,\n    rowCount,\n    labels,\n    caption,\n    isBordered,\n    isStriped,\n    isNarrow,\n    isHoverable,\n    isFullwidth,\n    isResponsive,\n    hasSearch,\n    toolbar,\n    loading,\n    empty,\n    noResults,\n    rowProps,\n    className,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledby,\n    ...props\n  }: DataTableProps<TRow>,\n  ref: React.ForwardedRef<HTMLDivElement>\n) {\n  const own = useDataTable<TRow>({\n    columns: columns ?? noColumns,\n    data: data ?? noRows,\n    getRowId,\n    sort,\n    defaultSort,\n    onSortChange,\n    selectionMode,\n    selected,\n    defaultSelected,\n    onSelectedChange,\n    pageSize,\n    page,\n    defaultPage,\n    onPageChange,\n    search,\n    defaultSearch,\n    onSearchChange,\n    filters,\n    defaultFilters,\n    onFiltersChange,\n    manual,\n    rowCount,\n    labels,\n  });\n  const table = given ?? own;\n  const { state } = table;\n\n  const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n  const rootClass = classNames(\n    usePrefixedClassNames('data-table'),\n    bulmaHelperClasses,\n    className\n  );\n  const toolbarClass = usePrefixedClassNames('data-table-toolbar');\n  const actionsClass = usePrefixedClassNames('data-table-actions');\n  const emptyClass = usePrefixedClassNames('data-table-empty');\n\n  const nameId = useId();\n  const hasCaption = isShown(caption);\n  const named = hasCaption || Boolean(ariaLabel || ariaLabelledby);\n  useEffect(() => {\n    if (!named) {\n      warnOnce(\n        'DataTable:unnamed',\n        '[bestax-bulma] <DataTable> has no accessible name. Pass a caption, ' +\n          'aria-label or aria-labelledby, so a screen reader can say which ' +\n          'table it is in.'\n      );\n    }\n  }, [named]);\n  const mixed = Boolean(given) && Boolean(columns || data);\n  const bare = !given && (!columns || !data);\n  useEffect(() => {\n    if (mixed) {\n      warnOnce(\n        'DataTable:table-and-columns',\n        '[bestax-bulma] <DataTable> was given a `table` and `columns` or ' +\n          '`data` too. It renders the `table` and leaves the rest unread, so ' +\n          'pass those to useDataTable instead.'\n      );\n    }\n    if (bare) {\n      warnOnce(\n        'DataTable:no-data',\n        '[bestax-bulma] <DataTable> needs `columns` and `data`, or a `table` ' +\n          'from useDataTable.'\n      );\n    }\n  }, [mixed, bare]);\n\n  // The status region speaks only after the search, a filter or the page\n  // changes, so nothing is read out as the page loads. `kind` is what last\n  // changed, kept beside the values it changed from.\n  const signature = filterSignature(state.search, state.filters);\n  const [last, setLast] = useState({\n    signature,\n    page: state.page,\n    kind: null as 'results' | 'page' | null,\n  });\n  if (last.signature !== signature) {\n    setLast({ signature, page: state.page, kind: 'results' });\n  } else if (last.page !== state.page) {\n    setLast({ signature, page: state.page, kind: 'page' });\n  }\n  const { labels: words, rowCount: total, pageCount } = table;\n  const size = state.pageSize;\n  let message = '';\n  if (last.kind && loading) {\n    message = words.loading;\n  } else if (last.kind === 'results' || (last.kind === 'page' && !total)) {\n    message = words.results(total);\n  } else if (last.kind === 'page') {\n    // Without a page size, as when it's just been taken away, there's one\n    // page, holding every row.\n    const per = size ?? total;\n    message = words.pageRange(\n      (state.page - 1) * per + 1,\n      Math.min(state.page * per, total),\n      total\n    );\n  }\n  // Written a moment after it changes, so typing in the search is read out\n  // once it pauses rather than at every keystroke.\n  const [said, setSaid] = useState('');\n  useEffect(() => {\n    const timer = setTimeout(() => setSaid(message), statusDelay);\n    return () => clearTimeout(timer);\n  }, [message]);\n\n  const selectable = table.selectionMode === 'multiple';\n  const sortable = table.columns.some(column => column.sortable);\n  const columnCount = table.columns.length + (selectable ? 1 : 0);\n  const pageRows = table.getRows('page');\n  const selectAll = table.getSelectAllProps();\n\n  const captionNode = hasCaption ? (\n    <caption>\n      <span id={nameId}>{caption}</span>\n      {sortable && <span style={visuallyHidden}>{`, ${words.sortHint}.`}</span>}\n    </caption>\n  ) : sortable ? (\n    <caption>\n      <span style={visuallyHidden}>{words.sortHint}</span>\n    </caption>\n  ) : null;\n\n  const header = (\n    <Thead>\n      <Tr>\n        {selectable && (\n          <Th scope=\"col\" isNarrow>\n            <Checkbox\n              {...selectAll}\n              // While loading, the rows it would select aren't on screen.\n              disabled={selectAll.disabled || Boolean(loading)}\n            />\n          </Th>\n        )}\n        {table.columns.map(column => (\n          <Th key={column.id} {...table.getHeaderCellProps(column)}>\n            {column.sortable ? (\n              <button {...table.getSortButtonProps(column)}>\n                {column.header}\n              </button>\n            ) : (\n              column.header\n            )}\n          </Th>\n        ))}\n      </Tr>\n    </Thead>\n  );\n\n  let body: React.ReactNode;\n  if (loading) {\n    body = Array.from({ length: size ?? 5 }, (_, index) => (\n      <Tr key={index} aria-hidden=\"true\">\n        {Array.from({ length: columnCount }, (__, cell) => (\n          <Td key={cell}>\n            <Skeleton variant=\"lines\" lines={1} />\n          </Td>\n        ))}\n      </Tr>\n    ));\n  } else if (pageRows.length === 0) {\n    // With `manual`, no rows under a search or a filter is no match: only\n    // the server knows whether there's anything else.\n    const nothing =\n      table.getRows('all').length === 0 &&\n      !(table.manual && isFiltering(state.search, state.filters));\n    const content = nothing\n      ? isShown(empty)\n        ? empty\n        : empty === undefined && (\n            <EmptyState size=\"small\" description={words.empty} />\n          )\n      : isShown(noResults)\n        ? noResults\n        : noResults === undefined && (\n            <EmptyState size=\"small\" description={words.noResults} />\n          );\n    body = (\n      <Tr>\n        <Td colSpan={columnCount} className={emptyClass}>\n          {content}\n        </Td>\n      </Tr>\n    );\n  } else {\n    body = pageRows.map(row => {\n      const rowId = table.getRowId(row);\n      return (\n        <Tr key={rowId} {...rowProps?.(row)} {...table.getRowProps(row)}>\n          {selectable && (\n            <Td isNarrow>\n              <Checkbox {...table.getSelectRowProps(row)} />\n            </Td>\n          )}\n          {table.columns.map(column => {\n            const text = table.getText(row, column.id);\n            const content = column.cell\n              ? column.cell(row, {\n                  value: table.getValue(row, column.id),\n                  text,\n                  rowId,\n                })\n              : text;\n            const cellProps = table.getCellProps(row, column);\n            return column.isRowHeader ? (\n              <Th key={column.id} {...cellProps}>\n                {content}\n              </Th>\n            ) : (\n              <Td key={column.id} {...cellProps}>\n                {content}\n              </Td>\n            );\n          })}\n        </Tr>\n      );\n    });\n  }\n\n  const tableElement = (\n    <Table\n      isBordered={isBordered}\n      isStriped={isStriped}\n      isNarrow={isNarrow}\n      isHoverable={isHoverable}\n      isFullwidth={isFullwidth}\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledby}\n      aria-busy={loading || undefined}\n    >\n      {captionNode}\n      {header}\n      <Tbody>{body}</Tbody>\n    </Table>\n  );\n\n  // The name the scroll area and the pager take from the table.\n  const textName =\n    ariaLabel || (typeof caption === 'string' ? caption : undefined);\n  const scrollName = ariaLabel\n    ? { 'aria-label': ariaLabel }\n    : {\n        'aria-labelledby': ariaLabelledby || (hasCaption ? nameId : undefined),\n      };\n\n  // Pagination names itself \"pagination\" unless given another name.\n  const pagerLabel =\n    words.pagination || (textName ? `${textName} pages` : undefined);\n  const pagerName = pagerLabel ? { 'aria-label': pagerLabel } : {};\n\n  const toolbarContent = toolbar?.(table);\n  const hasToolbar = hasSearch || isShown(toolbarContent);\n\n  return (\n    <div ref={ref} className={rootClass} {...rest}>\n      {hasToolbar && (\n        <div className={toolbarClass}>\n          {hasSearch && (\n            <Input label={words.search} {...table.getSearchProps()} />\n          )}\n          {isShown(toolbarContent) && (\n            <div className={actionsClass}>{toolbarContent}</div>\n          )}\n        </div>\n      )}\n      {isResponsive ? (\n        <ScrollArea orientation=\"horizontal\" {...scrollName}>\n          {tableElement}\n        </ScrollArea>\n      ) : (\n        tableElement\n      )}\n      {/* In the page from the start, so a change to it is announced. */}\n      <div role=\"status\" aria-live=\"polite\" style={visuallyHidden}>\n        {said}\n      </div>\n      {pageCount > 1 && (\n        <Pagination {...table.getPaginationProps()} {...pagerName} />\n      )}\n    </div>\n  );\n}) as DataTableComponent;\n\nDataTable.displayName = 'DataTable';\n\nexport default DataTable;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"DataTable.js","sources":["../../../src/components/DataTable.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useId, useState } from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { warnOnce } from '../helpers/devWarnings';\nimport { visuallyHidden } from '../helpers/statusRegion';\nimport { Table } from '../elements/Table';\nimport { Thead } from '../elements/Thead';\nimport { Tbody } from '../elements/Tbody';\nimport { Tr, TrProps } from '../elements/Tr';\nimport { Th } from '../elements/Th';\nimport { Td } from '../elements/Td';\nimport { Skeleton } from '../elements/Skeleton';\nimport { Checkbox } from '../form/Checkbox';\nimport { Input } from '../form/Input';\nimport { EmptyState } from './EmptyState';\nimport { Pagination } from './Pagination';\nimport { ScrollArea } from './ScrollArea';\nimport {\n  isFiltering,\n  useDataTable,\n  type DataTableColumn,\n  type DataTableFilters,\n  type DataTableModel,\n  type DataTableStateOptions,\n} from './useDataTable';\n\nexport { useDataTable } from './useDataTable';\nexport type {\n  DataTableCSVOptions,\n  DataTableCellContext,\n  DataTableCellProps,\n  DataTableCheckboxProps,\n  DataTableColumn,\n  DataTableColumnMeta,\n  DataTableFilters,\n  DataTableHeaderCellProps,\n  DataTableLabels,\n  DataTableModel,\n  DataTablePaginationProps,\n  DataTableResolvedLabels,\n  DataTableRowScope,\n  DataTableSearchProps,\n  DataTableSelectionMode,\n  DataTableSort,\n  DataTableSortButtonProps,\n  DataTableSortDirection,\n  DataTableState,\n  DataTableStateOptions,\n  UseDataTableOptions,\n} from './useDataTable';\n\n/**\n * Props for the DataTable component. The helper props, `className`, the\n * `ref` and the other attributes go on the wrapper `<div>`, which holds the\n * toolbar, the table and the pager. `aria-label` and `aria-labelledby` name\n * the `<table>` itself.\n *\n * @extraProp {string} [aria-label] - Names the table, in place of a `caption`. A table needs a name, so pass a `caption`, this or `aria-labelledby`, and a development build warns when it has none.\n * @extraProp {string} [aria-labelledby] - The id of a visible heading that names the table, in place of a `caption`.\n * @extraProp {React.Ref<HTMLDivElement>} [ref] - Ref forwarded to the wrapper `<div>`.\n */\nexport interface DataTableProps<TRow>\n  extends\n    DataTableStateOptions<TRow>,\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * The columns, in the order they're shown. Required unless `table` is\n   * given. Keep the array the same from one render to the next, defined\n   * outside the component or in `useMemo`: a new one has every cell's text\n   * worked out again.\n   */\n  columns?: DataTableColumn<TRow>[];\n  /** The rows, as records of your own. Required unless `table` is given. */\n  data?: TRow[];\n  /**\n   * A table made by `useDataTable`, rendered in place of one made from\n   * `columns`, `data` and the state props, which are then left unread. Use\n   * it to put a toolbar, a count or an export button elsewhere on the page.\n   */\n  table?: DataTableModel<TRow>;\n  /**\n   * Names the table, as a visible `<caption>`. A table needs a name: this,\n   * `aria-label` or `aria-labelledby`.\n   */\n  caption?: React.ReactNode;\n  /** Adds borders to all cells. */\n  isBordered?: boolean;\n  /** Adds zebra-striping to rows. */\n  isStriped?: boolean;\n  /** Makes the table more compact by cutting cell padding in half. */\n  isNarrow?: boolean;\n  /** Adds a hover effect on rows. */\n  isHoverable?: boolean;\n  /** Makes the table span the full width of its wrapper. */\n  isFullwidth?: boolean;\n  /**\n   * Scrolls a table wider than its wrapper sideways, in a `ScrollArea`\n   * named after the table, which can be scrolled from the keyboard while it\n   * overflows.\n   */\n  isResponsive?: boolean;\n  /** Shows a search field in the toolbar, labelled by `labels.search`. */\n  hasSearch?: boolean;\n  /**\n   * More of the toolbar, after the search field: buttons for the selected\n   * rows, a filter, a download. Given the table.\n   */\n  toolbar?: (table: DataTableModel<TRow>) => React.ReactNode;\n  /**\n   * Shows a page of skeleton rows under the header in place of the rows,\n   * and marks the table busy. For data on its way, as from a server with\n   * `manual`. A skeleton row is as tall as a row of one line of text, so rows\n   * of text replace it without the table changing height.\n   */\n  loading?: boolean;\n  /**\n   * What the table shows when it has no rows at all, in one cell across\n   * every column. A small `EmptyState` saying `labels.empty` by default. A\n   * title of your own sits under the heading the table does, so give it the\n   * next level down with `titleAs`.\n   */\n  empty?: React.ReactNode;\n  /**\n   * What the table shows when the search and filters let no row through, in\n   * one cell across every column. A small `EmptyState` saying\n   * `labels.noResults` by default. A button that clears the search goes\n   * away with it, so send focus back to the search field when it's pressed.\n   */\n  noResults?: React.ReactNode;\n  /**\n   * Props of your own for a row's `Tr`, such as a handler or a class. The\n   * table's own (`isSelected`) win. To wrap a row in a `ContextMenu`, build\n   * the table from `useDataTable`'s props instead.\n   */\n  rowProps?: (row: TRow) => DataTableRowProps;\n  /** Additional CSS classes, on the wrapper `<div>`. */\n  className?: string;\n}\n\n/** What `rowProps` gives a row's `Tr`: any of its props but the ones the table sets. */\nexport type DataTableRowProps = Omit<TrProps, 'isSelected' | 'children'>;\n\n/** The type of `DataTable`, generic in the row. */\nexport type DataTableComponent = (<TRow>(\n  props: DataTableProps<TRow> & React.RefAttributes<HTMLDivElement>\n) => React.ReactElement | null) & { displayName?: string };\n\n/** How long the status region waits after a change before it speaks, in ms. */\nconst statusDelay = 500;\n\nconst noColumns: never[] = [];\nconst noRows: never[] = [];\n\n/** A text signature of the search and the filters, to tell when they change. */\nfunction filterSignature(search: string, filters: DataTableFilters): string {\n  try {\n    return JSON.stringify([search, Object.entries(filters).sort()]);\n  } catch {\n    return search;\n  }\n}\n\n/** Whether a node renders something. */\nconst isShown = (node: React.ReactNode) =>\n  node !== undefined && node !== null && node !== false && node !== '';\n\n/**\n * The `DataTable` component is a table of records that people can sort,\n * search, page through and select rows from, rendered with bestax's own\n * `Table` parts, `Checkbox` and `Pagination`.\n *\n * It's a native table, as in the WAI-ARIA Authoring Practices' sortable\n * table: a sortable header holds a button, the sorted one carries\n * `aria-sort`, and each row's checkbox is named for the row. It runs on\n * `useDataTable`, which custom markup can use too.\n *\n * @example\n * <DataTable\n *   caption=\"Users\"\n *   columns={[\n *     { id: 'name', header: 'Name', sortable: true, isRowHeader: true },\n *     { id: 'role', header: 'Role', sortable: true },\n *   ]}\n *   data={users}\n *   selectionMode=\"multiple\"\n *   pageSize={10}\n *   hasSearch\n * />\n */\nexport const DataTable = forwardRef(function DataTableRender<TRow>(\n  {\n    columns,\n    data,\n    table: given,\n    getRowId,\n    sort,\n    defaultSort,\n    onSortChange,\n    selectionMode,\n    selected,\n    defaultSelected,\n    onSelectedChange,\n    pageSize,\n    page,\n    defaultPage,\n    onPageChange,\n    search,\n    defaultSearch,\n    onSearchChange,\n    filters,\n    defaultFilters,\n    onFiltersChange,\n    manual,\n    rowCount,\n    labels,\n    caption,\n    isBordered,\n    isStriped,\n    isNarrow,\n    isHoverable,\n    isFullwidth,\n    isResponsive,\n    hasSearch,\n    toolbar,\n    loading,\n    empty,\n    noResults,\n    rowProps,\n    className,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledby,\n    ...props\n  }: DataTableProps<TRow>,\n  ref: React.ForwardedRef<HTMLDivElement>\n) {\n  const own = useDataTable<TRow>({\n    columns: columns ?? noColumns,\n    data: data ?? noRows,\n    getRowId,\n    sort,\n    defaultSort,\n    onSortChange,\n    selectionMode,\n    selected,\n    defaultSelected,\n    onSelectedChange,\n    pageSize,\n    page,\n    defaultPage,\n    onPageChange,\n    search,\n    defaultSearch,\n    onSearchChange,\n    filters,\n    defaultFilters,\n    onFiltersChange,\n    manual,\n    rowCount,\n    labels,\n  });\n  const table = given ?? own;\n  const { state } = table;\n\n  const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n  const rootClass = classNames(\n    usePrefixedClassNames('data-table'),\n    bulmaHelperClasses,\n    className\n  );\n  const toolbarClass = usePrefixedClassNames('data-table-toolbar');\n  const actionsClass = usePrefixedClassNames('data-table-actions');\n  const emptyClass = usePrefixedClassNames('data-table-empty');\n  const skeletonClass = usePrefixedClassNames('data-table-skeleton');\n\n  const nameId = useId();\n  const hasCaption = isShown(caption);\n  const named = hasCaption || Boolean(ariaLabel || ariaLabelledby);\n  useEffect(() => {\n    if (!named) {\n      warnOnce(\n        'DataTable:unnamed',\n        '[bestax-bulma] <DataTable> has no accessible name. Pass a caption, ' +\n          'aria-label or aria-labelledby, so a screen reader can say which ' +\n          'table it is in.'\n      );\n    }\n  }, [named]);\n  const mixed = Boolean(given) && Boolean(columns || data);\n  const bare = !given && (!columns || !data);\n  useEffect(() => {\n    if (mixed) {\n      warnOnce(\n        'DataTable:table-and-columns',\n        '[bestax-bulma] <DataTable> was given a `table` and `columns` or ' +\n          '`data` too. It renders the `table` and leaves the rest unread, so ' +\n          'pass those to useDataTable instead.'\n      );\n    }\n    if (bare) {\n      warnOnce(\n        'DataTable:no-data',\n        '[bestax-bulma] <DataTable> needs `columns` and `data`, or a `table` ' +\n          'from useDataTable.'\n      );\n    }\n  }, [mixed, bare]);\n\n  // The status region speaks only after the search, a filter or the page\n  // changes, so nothing is read out as the page loads. `kind` is what last\n  // changed, kept beside the values it changed from.\n  const signature = filterSignature(state.search, state.filters);\n  const [last, setLast] = useState({\n    signature,\n    page: state.page,\n    kind: null as 'results' | 'page' | null,\n  });\n  if (last.signature !== signature) {\n    setLast({ signature, page: state.page, kind: 'results' });\n  } else if (last.page !== state.page) {\n    setLast({ signature, page: state.page, kind: 'page' });\n  }\n  const { labels: words, rowCount: total, pageCount } = table;\n  const size = state.pageSize;\n  let message = '';\n  if (last.kind && loading) {\n    message = words.loading;\n  } else if (last.kind === 'results' || (last.kind === 'page' && !total)) {\n    message = words.results(total);\n  } else if (last.kind === 'page') {\n    // Without a page size, as when it's just been taken away, there's one\n    // page, holding every row.\n    const per = size ?? total;\n    message = words.pageRange(\n      (state.page - 1) * per + 1,\n      Math.min(state.page * per, total),\n      total\n    );\n  }\n  // Written a moment after it changes, so typing in the search is read out\n  // once it pauses rather than at every keystroke.\n  const [said, setSaid] = useState('');\n  useEffect(() => {\n    const timer = setTimeout(() => setSaid(message), statusDelay);\n    return () => clearTimeout(timer);\n  }, [message]);\n\n  const selectable = table.selectionMode === 'multiple';\n  const sortable = table.columns.some(column => column.sortable);\n  const columnCount = table.columns.length + (selectable ? 1 : 0);\n  const pageRows = table.getRows('page');\n  const selectAll = table.getSelectAllProps();\n\n  const captionNode = hasCaption ? (\n    <caption>\n      <span id={nameId}>{caption}</span>\n      {sortable && <span style={visuallyHidden}>{`, ${words.sortHint}.`}</span>}\n    </caption>\n  ) : sortable ? (\n    <caption>\n      <span style={visuallyHidden}>{words.sortHint}</span>\n    </caption>\n  ) : null;\n\n  const header = (\n    <Thead>\n      <Tr>\n        {selectable && (\n          <Th scope=\"col\" isNarrow>\n            <Checkbox\n              {...selectAll}\n              // While loading, the rows it would select aren't on screen.\n              disabled={selectAll.disabled || Boolean(loading)}\n            />\n          </Th>\n        )}\n        {table.columns.map(column => (\n          <Th key={column.id} {...table.getHeaderCellProps(column)}>\n            {column.sortable ? (\n              <button {...table.getSortButtonProps(column)}>\n                {column.header}\n              </button>\n            ) : (\n              column.header\n            )}\n          </Th>\n        ))}\n      </Tr>\n    </Thead>\n  );\n\n  let body: React.ReactNode;\n  if (loading) {\n    body = Array.from({ length: size ?? 5 }, (_, index) => (\n      <Tr key={index} aria-hidden=\"true\">\n        {Array.from({ length: columnCount }, (__, cell) => (\n          <Td key={cell}>\n            <Skeleton variant=\"lines\" lines={1} className={skeletonClass} />\n          </Td>\n        ))}\n      </Tr>\n    ));\n  } else if (pageRows.length === 0) {\n    // With `manual`, no rows under a search or a filter is no match: only\n    // the server knows whether there's anything else.\n    const nothing =\n      table.getRows('all').length === 0 &&\n      !(table.manual && isFiltering(state.search, state.filters));\n    const content = nothing\n      ? isShown(empty)\n        ? empty\n        : empty === undefined && (\n            <EmptyState size=\"small\" description={words.empty} />\n          )\n      : isShown(noResults)\n        ? noResults\n        : noResults === undefined && (\n            <EmptyState size=\"small\" description={words.noResults} />\n          );\n    body = (\n      <Tr>\n        <Td colSpan={columnCount} className={emptyClass}>\n          {content}\n        </Td>\n      </Tr>\n    );\n  } else {\n    body = pageRows.map(row => {\n      const rowId = table.getRowId(row);\n      return (\n        <Tr key={rowId} {...rowProps?.(row)} {...table.getRowProps(row)}>\n          {selectable && (\n            <Td isNarrow>\n              <Checkbox {...table.getSelectRowProps(row)} />\n            </Td>\n          )}\n          {table.columns.map(column => {\n            const text = table.getText(row, column.id);\n            const content = column.cell\n              ? column.cell(row, {\n                  value: table.getValue(row, column.id),\n                  text,\n                  rowId,\n                })\n              : text;\n            const cellProps = table.getCellProps(row, column);\n            return column.isRowHeader ? (\n              <Th key={column.id} {...cellProps}>\n                {content}\n              </Th>\n            ) : (\n              <Td key={column.id} {...cellProps}>\n                {content}\n              </Td>\n            );\n          })}\n        </Tr>\n      );\n    });\n  }\n\n  const tableElement = (\n    <Table\n      isBordered={isBordered}\n      isStriped={isStriped}\n      isNarrow={isNarrow}\n      isHoverable={isHoverable}\n      isFullwidth={isFullwidth}\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledby}\n      aria-busy={loading || undefined}\n    >\n      {captionNode}\n      {header}\n      <Tbody>{body}</Tbody>\n    </Table>\n  );\n\n  // The name the scroll area and the pager take from the table.\n  const textName =\n    ariaLabel || (typeof caption === 'string' ? caption : undefined);\n  const scrollName = ariaLabel\n    ? { 'aria-label': ariaLabel }\n    : {\n        'aria-labelledby': ariaLabelledby || (hasCaption ? nameId : undefined),\n      };\n\n  // Pagination names itself \"pagination\" unless given another name.\n  const pagerLabel =\n    words.pagination || (textName ? `${textName} pages` : undefined);\n  const pagerName = pagerLabel ? { 'aria-label': pagerLabel } : {};\n\n  const toolbarContent = toolbar?.(table);\n  const hasToolbar = hasSearch || isShown(toolbarContent);\n\n  return (\n    <div ref={ref} className={rootClass} {...rest}>\n      {hasToolbar && (\n        <div className={toolbarClass}>\n          {hasSearch && (\n            <Input label={words.search} {...table.getSearchProps()} />\n          )}\n          {isShown(toolbarContent) && (\n            <div className={actionsClass}>{toolbarContent}</div>\n          )}\n        </div>\n      )}\n      {isResponsive ? (\n        <ScrollArea orientation=\"horizontal\" {...scrollName}>\n          {tableElement}\n        </ScrollArea>\n      ) : (\n        tableElement\n      )}\n      {/* In the page from the start, so a change to it is announced. */}\n      <div role=\"status\" aria-live=\"polite\" style={visuallyHidden}>\n        {said}\n      </div>\n      {pageCount > 1 && (\n        <Pagination {...table.getPaginationProps()} {...pagerName} />\n      )}\n    </div>\n  );\n}) as DataTableComponent;\n\nDataTable.displayName = 'DataTable';\n\nexport default DataTable;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAoJA;AACA,MAAM,WAAW,GAAG,GAAG;AAEvB,MAAM,SAAS,GAAY,EAAE;AAC7B,MAAM,MAAM,GAAY,EAAE;AAE1B;AACA,SAAS,eAAe,CAAC,MAAc,EAAE,OAAyB,EAAA;AAChE,IAAA,IAAI;AACF,QAAA,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;IACjE;AAAE,IAAA,MAAM;AACN,QAAA,OAAO,MAAM;IACf;AACF;AAEA;AACA,MAAM,OAAO,GAAG,CAAC,IAAqB,KACpC,IAAI,KAAK,SAAS,IAAI,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,EAAE;AAEtE;;;;;;;;;;;;;;;;;;;;;;AAsBG;MACU,SAAS,GAAG,UAAU,CAAC,SAAS,eAAe,CAC1D,EACE,OAAO,EACP,IAAI,EACJ,KAAK,EAAE,KAAK,EACZ,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,YAAY,EACZ,aAAa,EACb,QAAQ,EACR,eAAe,EACf,gBAAgB,EAChB,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,YAAY,EACZ,MAAM,EACN,aAAa,EACb,cAAc,EACd,OAAO,EACP,cAAc,EACd,eAAe,EACf,MAAM,EACN,QAAQ,EACR,MAAM,EACN,OAAO,EACP,UAAU,EACV,SAAS,EACT,QAAQ,EACR,WAAW,EACX,WAAW,EACX,YAAY,EACZ,SAAS,EACT,OAAO,EACP,OAAO,EACP,KAAK,EACL,SAAS,EACT,QAAQ,EACR,SAAS,EACT,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,GAAG,KAAK,EACa,EACvB,GAAuC,EAAA;IAEvC,MAAM,GAAG,GAAG,YAAY,CAAO;QAC7B,OAAO,EAAE,OAAO,IAAI,SAAS;QAC7B,IAAI,EAAE,IAAI,IAAI,MAAM;QACpB,QAAQ;QACR,IAAI;QACJ,WAAW;QACX,YAAY;QACZ,aAAa;QACb,QAAQ;QACR,eAAe;QACf,gBAAgB;QAChB,QAAQ;QACR,IAAI;QACJ,WAAW;QACX,YAAY;QACZ,MAAM;QACN,aAAa;QACb,cAAc;QACd,OAAO;QACP,cAAc;QACd,eAAe;QACf,MAAM;QACN,QAAQ;QACR,MAAM;AACP,KAAA,CAAC;AACF,IAAA,MAAM,KAAK,GAAG,KAAK,IAAI,GAAG;AAC1B,IAAA,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK;IAEvB,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC,KAAK,CAAC;AAC3D,IAAA,MAAM,SAAS,GAAG,UAAU,CAC1B,qBAAqB,CAAC,YAAY,CAAC,EACnC,kBAAkB,EAClB,SAAS,CACV;AACD,IAAA,MAAM,YAAY,GAAG,qBAAqB,CAAC,oBAAoB,CAAC;AAChE,IAAA,MAAM,YAAY,GAAG,qBAAqB,CAAC,oBAAoB,CAAC;AAChE,IAAA,MAAM,UAAU,GAAG,qBAAqB,CAAC,kBAAkB,CAAC;AAC5D,IAAA,MAAM,aAAa,GAAG,qBAAqB,CAAC,qBAAqB,CAAC;AAElE,IAAA,MAAM,MAAM,GAAG,KAAK,EAAE;AACtB,IAAA,MAAM,UAAU,GAAG,OAAO,CAAC,OAAO,CAAC;IACnC,MAAM,KAAK,GAAG,UAAU,IAAI,OAAO,CAAC,SAAS,IAAI,cAAc,CAAC;IAChE,SAAS,CAAC,MAAK;QACb,IAAI,CAAC,KAAK,EAAE;YACV,QAAQ,CACN,mBAAmB,EACnB,qEAAqE;gBACnE,kEAAkE;AAClE,gBAAA,iBAAiB,CACpB;QACH;AACF,IAAA,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;AACX,IAAA,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,IAAI,OAAO,CAAC,OAAO,IAAI,IAAI,CAAC;AACxD,IAAA,MAAM,IAAI,GAAG,CAAC,KAAK,KAAK,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC;IAC1C,SAAS,CAAC,MAAK;QACb,IAAI,KAAK,EAAE;YACT,QAAQ,CACN,6BAA6B,EAC7B,kEAAkE;gBAChE,oEAAoE;AACpE,gBAAA,qCAAqC,CACxC;QACH;QACA,IAAI,IAAI,EAAE;YACR,QAAQ,CACN,mBAAmB,EACnB,sEAAsE;AACpE,gBAAA,oBAAoB,CACvB;QACH;AACF,IAAA,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;;;;AAKjB,IAAA,MAAM,SAAS,GAAG,eAAe,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC;AAC9D,IAAA,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC;QAC/B,SAAS;QACT,IAAI,EAAE,KAAK,CAAC,IAAI;AAChB,QAAA,IAAI,EAAE,IAAiC;AACxC,KAAA,CAAC;AACF,IAAA,IAAI,IAAI,CAAC,SAAS,KAAK,SAAS,EAAE;AAChC,QAAA,OAAO,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;IAC3D;SAAO,IAAI,IAAI,CAAC,IAAI,KAAK,KAAK,CAAC,IAAI,EAAE;AACnC,QAAA,OAAO,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;IACxD;AACA,IAAA,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK;AAC3D,IAAA,MAAM,IAAI,GAAG,KAAK,CAAC,QAAQ;IAC3B,IAAI,OAAO,GAAG,EAAE;AAChB,IAAA,IAAI,IAAI,CAAC,IAAI,IAAI,OAAO,EAAE;AACxB,QAAA,OAAO,GAAG,KAAK,CAAC,OAAO;IACzB;AAAO,SAAA,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,KAAK,IAAI,CAAC,IAAI,KAAK,MAAM,IAAI,CAAC,KAAK,CAAC,EAAE;AACtE,QAAA,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC;IAChC;AAAO,SAAA,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,EAAE;;;AAG/B,QAAA,MAAM,GAAG,GAAG,IAAI,IAAI,KAAK;AACzB,QAAA,OAAO,GAAG,KAAK,CAAC,SAAS,CACvB,CAAC,KAAK,CAAC,IAAI,GAAG,CAAC,IAAI,GAAG,GAAG,CAAC,EAC1B,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,GAAG,GAAG,EAAE,KAAK,CAAC,EACjC,KAAK,CACN;IACH;;;IAGA,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC;IACpC,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,KAAK,GAAG,UAAU,CAAC,MAAM,OAAO,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC;AAC7D,QAAA,OAAO,MAAM,YAAY,CAAC,KAAK,CAAC;AAClC,IAAA,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;AAEb,IAAA,MAAM,UAAU,GAAG,KAAK,CAAC,aAAa,KAAK,UAAU;AACrD,IAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC;AAC9D,IAAA,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,IAAI,UAAU,GAAG,CAAC,GAAG,CAAC,CAAC;IAC/D,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC;AACtC,IAAA,MAAM,SAAS,GAAG,KAAK,CAAC,iBAAiB,EAAE;IAE3C,MAAM,WAAW,GAAG,UAAU,IAC5BA,IAAA,CAAA,SAAA,EAAA,EAAA,QAAA,EAAA,CACEC,GAAA,CAAA,MAAA,EAAA,EAAM,EAAE,EAAE,MAAM,YAAG,OAAO,EAAA,CAAQ,EACjC,QAAQ,IAAIA,GAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAE,cAAc,EAAA,QAAA,EAAG,CAAA,EAAA,EAAK,KAAK,CAAC,QAAQ,GAAG,EAAA,CAAQ,CAAA,EAAA,CACjE,IACR,QAAQ,IACVA,GAAA,CAAA,SAAA,EAAA,EAAA,QAAA,EACEA,GAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAE,cAAc,EAAA,QAAA,EAAG,KAAK,CAAC,QAAQ,EAAA,CAAQ,EAAA,CAC5C,IACR,IAAI;IAER,MAAM,MAAM,IACVA,GAAA,CAAC,KAAK,cACJD,IAAA,CAAC,EAAE,EAAA,EAAA,QAAA,EAAA,CACA,UAAU,KACTC,IAAC,EAAE,EAAA,EAAC,KAAK,EAAC,KAAK,EAAC,QAAQ,EAAA,IAAA,EAAA,QAAA,EACtBA,GAAA,CAAC,QAAQ,EAAA,EAAA,GACH,SAAS;;AAEb,wBAAA,QAAQ,EAAE,SAAS,CAAC,QAAQ,IAAI,OAAO,CAAC,OAAO,CAAC,GAChD,EAAA,CACC,CACN,EACA,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,KACvBA,GAAA,CAAC,EAAE,EAAA,EAAA,GAAqB,KAAK,CAAC,kBAAkB,CAAC,MAAM,CAAC,YACrD,MAAM,CAAC,QAAQ,IACdA,GAAA,CAAA,QAAA,EAAA,EAAA,GAAY,KAAK,CAAC,kBAAkB,CAAC,MAAM,CAAC,EAAA,QAAA,EACzC,MAAM,CAAC,MAAM,GACP,KAET,MAAM,CAAC,MAAM,CACd,EAAA,EAPM,MAAM,CAAC,EAAE,CAQb,CACN,CAAC,CAAA,EAAA,CACC,EAAA,CACC,CACT;AAED,IAAA,IAAI,IAAqB;IACzB,IAAI,OAAO,EAAE;AACX,QAAA,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,IAAI,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,MAChDA,GAAA,CAAC,EAAE,mBAAyB,MAAM,EAAA,QAAA,EAC/B,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,EAAE,CAAC,EAAE,EAAE,IAAI,MAC5CA,GAAA,CAAC,EAAE,EAAA,EAAA,QAAA,EACDA,IAAC,QAAQ,EAAA,EAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAE,CAAC,EAAE,SAAS,EAAE,aAAa,GAAI,EAAA,EADzD,IAAI,CAER,CACN,CAAC,EAAA,EALK,KAAK,CAMT,CACN,CAAC;IACJ;AAAO,SAAA,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE;;;QAGhC,MAAM,OAAO,GACX,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC;AACjC,YAAA,EAAE,KAAK,CAAC,MAAM,IAAI,WAAW,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC;QAC7D,MAAM,OAAO,GAAG;AACd,cAAE,OAAO,CAAC,KAAK;AACb,kBAAE;AACF,kBAAE,KAAK,KAAK,SAAS,KACjBA,IAAC,UAAU,EAAA,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAE,KAAK,CAAC,KAAK,GAAI;AAE3D,cAAE,OAAO,CAAC,SAAS;AACjB,kBAAE;kBACA,SAAS,KAAK,SAAS,KACrBA,GAAA,CAAC,UAAU,EAAA,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAE,KAAK,CAAC,SAAS,EAAA,CAAI,CAC1D;QACP,IAAI,IACFA,GAAA,CAAC,EAAE,cACDA,GAAA,CAAC,EAAE,IAAC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,UAAU,EAAA,QAAA,EAC5C,OAAO,EAAA,CACL,EAAA,CACF,CACN;IACH;SAAO;AACL,QAAA,IAAI,GAAG,QAAQ,CAAC,GAAG,CAAC,GAAG,IAAG;YACxB,MAAM,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC;YACjC,QACED,KAAC,EAAE,EAAA,EAAA,GAAiB,QAAQ,GAAG,GAAG,CAAC,EAAA,GAAM,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,aAC5D,UAAU,KACTC,GAAA,CAAC,EAAE,EAAA,EAAC,QAAQ,EAAA,IAAA,EAAA,QAAA,EACVA,GAAA,CAAC,QAAQ,EAAA,EAAA,GAAK,KAAK,CAAC,iBAAiB,CAAC,GAAG,CAAC,EAAA,CAAI,GAC3C,CACN,EACA,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,IAAG;AAC1B,wBAAA,MAAM,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,MAAM,CAAC,EAAE,CAAC;AAC1C,wBAAA,MAAM,OAAO,GAAG,MAAM,CAAC;AACrB,8BAAE,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE;gCACf,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC,EAAE,CAAC;gCACrC,IAAI;gCACJ,KAAK;6BACN;8BACD,IAAI;wBACR,MAAM,SAAS,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,EAAE,MAAM,CAAC;AACjD,wBAAA,OAAO,MAAM,CAAC,WAAW,IACvBA,GAAA,CAAC,EAAE,OAAqB,SAAS,EAAA,QAAA,EAC9B,OAAO,EAAA,EADD,MAAM,CAAC,EAAE,CAEb,KAELA,GAAA,CAAC,EAAE,EAAA,EAAA,GAAqB,SAAS,EAAA,QAAA,EAC9B,OAAO,IADD,MAAM,CAAC,EAAE,CAEb,CACN;AACH,oBAAA,CAAC,CAAC,CAAA,EAAA,EAzBK,KAAK,CA0BT;AAET,QAAA,CAAC,CAAC;IACJ;IAEA,MAAM,YAAY,IAChBD,IAAA,CAAC,KAAK,EAAA,EACJ,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,WAAW,gBACZ,SAAS,EAAA,iBAAA,EACJ,cAAc,EAAA,WAAA,EACpB,OAAO,IAAI,SAAS,EAAA,QAAA,EAAA,CAE9B,WAAW,EACX,MAAM,EACPC,GAAA,CAAC,KAAK,cAAE,IAAI,EAAA,CAAS,CAAA,EAAA,CACf,CACT;;AAGD,IAAA,MAAM,QAAQ,GACZ,SAAS,KAAK,OAAO,OAAO,KAAK,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;IAClE,MAAM,UAAU,GAAG;AACjB,UAAE,EAAE,YAAY,EAAE,SAAS;AAC3B,UAAE;AACE,YAAA,iBAAiB,EAAE,cAAc,KAAK,UAAU,GAAG,MAAM,GAAG,SAAS,CAAC;SACvE;;AAGL,IAAA,MAAM,UAAU,GACd,KAAK,CAAC,UAAU,KAAK,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,MAAA,CAAQ,GAAG,SAAS,CAAC;AAClE,IAAA,MAAM,SAAS,GAAG,UAAU,GAAG,EAAE,YAAY,EAAE,UAAU,EAAE,GAAG,EAAE;AAEhE,IAAA,MAAM,cAAc,GAAG,OAAO,GAAG,KAAK,CAAC;IACvC,MAAM,UAAU,GAAG,SAAS,IAAI,OAAO,CAAC,cAAc,CAAC;IAEvD,QACED,IAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EAAA,CAC1C,UAAU,KACTA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,YAAY,EAAA,QAAA,EAAA,CACzB,SAAS,KACRC,GAAA,CAAC,KAAK,EAAA,EAAC,KAAK,EAAE,KAAK,CAAC,MAAM,EAAA,GAAM,KAAK,CAAC,cAAc,EAAE,EAAA,CAAI,CAC3D,EACA,OAAO,CAAC,cAAc,CAAC,KACtBA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,YAAY,EAAA,QAAA,EAAG,cAAc,EAAA,CAAO,CACrD,CAAA,EAAA,CACG,CACP,EACA,YAAY,IACXA,GAAA,CAAC,UAAU,IAAC,WAAW,EAAC,YAAY,EAAA,GAAK,UAAU,EAAA,QAAA,EAChD,YAAY,EAAA,CACF,KAEb,YAAY,CACb,EAEDA,GAAA,CAAA,KAAA,EAAA,EAAK,IAAI,EAAC,QAAQ,EAAA,WAAA,EAAW,QAAQ,EAAC,KAAK,EAAE,cAAc,EAAA,QAAA,EACxD,IAAI,GACD,EACL,SAAS,GAAG,CAAC,KACZA,IAAC,UAAU,EAAA,EAAA,GAAK,KAAK,CAAC,kBAAkB,EAAE,EAAA,GAAM,SAAS,EAAA,CAAI,CAC9D,CAAA,EAAA,CACG;AAEV,CAAC;AAED,SAAS,CAAC,WAAW,GAAG,WAAW;;"}

package/dist/esm/components/HoverCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"HoverCard.js","sources":["../../../src/components/HoverCard.tsx"],"sourcesContent":["import React, {\n  cloneElement,\n  useCallback,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { PopupPortal } from '../helpers/portal';\nimport { useIsHydrated } from '../helpers/useIsHydrated';\nimport { marginGap, useAnchoredPosition } from '../helpers/useAnchoredPosition';\nimport { chain, useHoverOpen } from '../helpers/useHoverOpen';\nimport { isTabbableKind } from '../helpers/useFocusTrap';\nimport { isDev, warnOnce } from '../helpers/devWarnings';\nimport type { PickerPosition } from '../form/_pickerInternals/pickerTypes';\n\n/**\n * Where the card opens against its trigger: below (`bottom-*`) or above\n * (`top-*`), lined up with the trigger's left or right edge. `auto` picks the\n * one that keeps the card in the viewport, preferring below and lined up on\n * the left. The same union `Popover` and the date and time pickers take.\n */\nexport type HoverCardPosition = PickerPosition;\n\n/**\n * Props for the HoverCard component. `className`, `id`, the other HTML\n * attributes and the helper props land on the `span` around the trigger, not\n * on the card; `contentClassName` reaches the card.\n * @extraProp {string} [className] - Additional classes for the `span` around the trigger. The card takes `contentClassName`.\n */\nexport interface HoverCardProps\n  extends\n    Omit<React.HTMLAttributes<HTMLSpanElement>, 'color' | 'children'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * The element the card previews, such as a link or a `Button`. The element\n   * itself has to take focus, so keyboard users can open the card too: a\n   * link inside a `<span>` doesn't do, since focus comes back to the trigger\n   * and its ARIA is on it. HoverCard gives it no role and no tab stop, since\n   * it can't know what the element is, and a development build warns when\n   * it can't take focus: use a link or a button, or give the element\n   * `tabIndex={0}`. A disabled button can't take focus either. HoverCard adds\n   * `aria-expanded` and `aria-controls`, both naming the card only while it\n   * is on the page, so it has to be a single element that passes those to\n   * its DOM node. Its own click and keys stay its own, and the card doesn't\n   * toggle on them, except Escape while the card is open, which closes the\n   * card before the trigger sees it.\n   */\n  trigger: React.ReactElement;\n  /**\n   * The card's content: a preview whose links and buttons are fine, but not a\n   * form, which belongs in a `Popover`. The card pads itself, so content goes\n   * straight in.\n   */\n  children?: React.ReactNode;\n  /**\n   * Controlled open state. When set, hover, focus and Escape only report\n   * through `onOpenChange`, so an action inside the card can close it. While\n   * the card is open, Escape is reported, and when focus is in the card, on\n   * its trigger or nowhere, the key stops there even if you keep the card\n   * open, so a `Modal` around it doesn't close from the keyboard until the\n   * card does.\n   */\n  open?: boolean;\n  /**\n   * Initial open state when uncontrolled. A card that starts open stays open\n   * until the pointer or focus has been and gone, or Escape closes it.\n   * @defaultValue false\n   */\n  defaultOpen?: boolean;\n  /**\n   * Called with the state asked for: when `openDelay` or `closeDelay` runs\n   * out, and right away on Escape. Fires in both controlled and uncontrolled\n   * use. An Escape it reports stops at the card when focus is in the card,\n   * on its trigger or nowhere, so nothing around it sees that key. With\n   * focus anywhere else, the card still closes and the key goes on to\n   * whatever has focus.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * How long the pointer or keyboard focus waits on the trigger before the\n   * card opens, in milliseconds.\n   * @defaultValue 600\n   */\n  openDelay?: number;\n  /**\n   * How long the card stays after the pointer and focus have left the trigger\n   * and the card, in milliseconds. It is the time the pointer has to cross\n   * the gap between the trigger and the card: with `0` the card closes as the\n   * pointer leaves the trigger, before the pointer can reach it.\n   * @defaultValue 300\n   */\n  closeDelay?: number;\n  /**\n   * Where the card opens against the trigger. Left out, it opens below and\n   * lines up with the trigger's start edge, which is its right edge on a\n   * right-to-left page, so a trigger at the start of the line doesn't push\n   * the card off the screen. A corner you pass stays physical, so\n   * `bottom-left` lines up the left edges on either page.\n   * @defaultValue 'bottom-left'\n   */\n  position?: HoverCardPosition;\n  /**\n   * Render the card through `Portal`, into the `portalContainer` a\n   * `ConfigProvider` sets, else the `Modal`, `Dialog` or `Command.Dialog`\n   * it's in, else `document.body`, fixed to the viewport, so an ancestor's\n   * `overflow`, `transform` or stacking context can't clip it. A trigger in\n   * running text needs it too, since the card's block content can't sit\n   * inside a `<p>`. The card then shows from the commit after hydration,\n   * never in server markup, and it sits in the Tab order where its container\n   * is. At the end of `<body>` or of a dialog, Tab reaches it only after the\n   * rest of the page or the dialog, and focus leaving the trigger on the way\n   * closes it, so keyboard users can open it, read it and close it with\n   * Escape, and whatever it links to has to be reachable from the page as\n   * well. Theming variables set on an ancestor of the trigger reach it only\n   * when its container is inside that ancestor.\n   * @defaultValue false\n   */\n  appendToBody?: boolean;\n  /**\n   * Open the card with a tap on a touch screen. Touch has no hover, so\n   * without this a phone or tablet never opens the card. With it, a tap on\n   * the trigger opens the card at once, and it stays until a second tap on\n   * the trigger, a tap outside the trigger and the card, or Escape. The tap\n   * still does whatever the trigger does, so turn this on only for a trigger\n   * with no tap action of its own, such as a `Button` with no `onClick`: on\n   * a link, the first tap would follow the link rather than show the card.\n   * Mouse and pen work the same either way.\n   * @defaultValue false\n   */\n  openOnTap?: boolean;\n  /** Additional classes for the card (`.hover-card-content`). */\n  contentClassName?: string;\n}\n\n/**\n * The `HoverCard` component shows a card previewing what's behind a link or a button while the pointer rests on it or keyboard focus is on it.\n *\n * Nothing moves focus when the card opens, and nothing traps it. In place,\n * the card comes right after the trigger, so Tab goes from the trigger into\n * its links and tabbing past them closes it. The pointer can move onto the\n * card, Escape closes it from anywhere, and by default touch doesn't open it,\n * so tapping the trigger just does what the trigger does. `openOnTap` opens\n * it with a tap, for a trigger with no tap action of its own. For hints with nothing to\n * click use `Tooltip`, and for content opened on purpose, such as a form,\n * use `Popover`.\n *\n * @function\n * @param {HoverCardProps} props - Props for the HoverCard component.\n * @returns {JSX.Element} The trigger in its wrapper, and the card while open.\n *\n * @example\n * <HoverCard trigger={<a href=\"/people/ada\">Ada Lovelace</a>}>\n *   <Title as=\"p\" size=\"6\">Ada Lovelace</Title>\n *   <SubTitle as=\"p\" size=\"6\">Analytical Engine team</SubTitle>\n * </HoverCard>\n */\nexport const HoverCard: React.FC<HoverCardProps> = ({\n  trigger,\n  children,\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpenChange,\n  openDelay = 600,\n  closeDelay = 300,\n  position,\n  appendToBody = false,\n  openOnTap = false,\n  className,\n  contentClassName,\n  ...props\n}) => {\n  const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n  const {\n    onPointerEnter,\n    onPointerOver,\n    onPointerLeave,\n    onPointerDown,\n    onPointerUp,\n    onFocus,\n    onBlur,\n    ...attrs\n  } = rest;\n  const rootRef = useRef<HTMLSpanElement>(null);\n  const cardRef = useRef<HTMLDivElement>(null);\n  const cardId = `${useId()}-card`;\n\n  const isControlled = controlledOpen !== undefined;\n  const [internalOpen, setInternalOpen] = useState(defaultOpen);\n  const isOpen = controlledOpen ?? internalOpen;\n\n  const requestOpen = useCallback(\n    (next: boolean) => {\n      onOpenChange?.(next);\n      if (!isControlled) setInternalOpen(next);\n    },\n    [isControlled, onOpenChange]\n  );\n\n  // A portaled card has no server markup, so it only exists from the commit\n  // after hydration, and nothing measures it before then.\n  const hydrated = useIsHydrated();\n  const cardMounted = isOpen && (hydrated || !appendToBody);\n\n  const resolved = useAnchoredPosition(rootRef, cardRef, {\n    active: cardMounted,\n    position,\n    fixed: appendToBody,\n    // The gap comes from `--bulma-hover-card-offset` in the stylesheet, so\n    // the coordinates leave it out and `auto` reads it off the card.\n    offset: 0,\n    styledGap: marginGap,\n  });\n\n  // The trigger renders first inside the wrapper. Read when needed rather\n  // than held, so a trigger that remounted is still the one found.\n  const triggerRef = useMemo(\n    () => ({\n      get current() {\n        const first = (rootRef.current as HTMLSpanElement).firstElementChild;\n        return first && first !== cardRef.current\n          ? (first as HTMLElement)\n          : null;\n      },\n    }),\n    []\n  );\n\n  const hover = useHoverOpen({\n    open: isOpen,\n    onOpenChange: requestOpen,\n    openDelay,\n    closeDelay,\n    triggerRef,\n    floatingRef: cardRef,\n    openOnTap,\n  });\n\n  // A trigger that can't take focus leaves keyboard users no way to open the\n  // card. It has to be the trigger element itself, not something inside it,\n  // since focus comes back to it and its ARIA is on it. Judged by what the\n  // element is rather than by its styles, which can hide it for now. After\n  // every commit, since the trigger can change, and only in development.\n  useEffect(() => {\n    if (!isDev()) return;\n    const triggerNode = triggerRef.current;\n    if (!triggerNode) return;\n    if (!triggerNode.matches(':disabled') && isTabbableKind(triggerNode)) {\n      return;\n    }\n    warnOnce(\n      'HoverCard:unfocusable-trigger',\n      \"[bestax-bulma] <HoverCard> has a trigger that can't take focus, so \" +\n        \"keyboard users can't open the card. Use a link or a button as the \" +\n        'trigger, or give it tabIndex={0}.'\n    );\n  });\n\n  // Expanded only while the card is on the page, so a portaled card that\n  // waits for hydration isn't announced before it exists.\n  const clonedTrigger = cloneElement(\n    trigger as React.ReactElement<Record<string, unknown>>,\n    {\n      'aria-expanded': cardMounted,\n      'aria-controls': cardMounted ? cardId : undefined,\n    }\n  );\n\n  const rootClasses = classNames(\n    usePrefixedClassNames('hover-card', { 'is-active': cardMounted }),\n    bulmaHelperClasses,\n    className\n  );\n  const cardClasses = classNames(\n    usePrefixedClassNames('hover-card-content', {\n      [`is-${resolved.position}`]: true,\n      // The default lines up with the trigger's inline start, so the\n      // stylesheet moves it to the right edge on a right-to-left page.\n      'is-start-aligned': position === undefined,\n      'is-portal': appendToBody,\n    }),\n    contentClassName\n  );\n\n  return (\n    // The ref after the spread: React 19 hands a function component a `ref`\n    // prop like any other, and the wrapper has to stay ours. The card is in\n    // the wrapper's React tree even when portaled, so the hover and focus\n    // handlers here hear from both.\n    <span\n      className={rootClasses}\n      {...attrs}\n      onPointerEnter={chain(onPointerEnter, hover.onPointerEnter)}\n      onPointerOver={chain(onPointerOver, hover.onPointerOver)}\n      onPointerLeave={chain(onPointerLeave, hover.onPointerLeave)}\n      onFocus={chain(onFocus, hover.onFocus)}\n      onBlur={chain(onBlur, hover.onBlur)}\n      onPointerDown={chain(onPointerDown, hover.onPointerDown)}\n      onPointerUp={chain(onPointerUp, hover.onPointerUp)}\n      ref={rootRef}\n    >\n      {clonedTrigger}\n      {isOpen && (\n        <PopupPortal disabled={!appendToBody}>\n          <div\n            ref={cardRef}\n            id={cardId}\n            className={cardClasses}\n            style={\n              appendToBody\n                ? {\n                    position: 'fixed',\n                    top: resolved.top,\n                    left: resolved.left,\n                  }\n                : undefined\n            }\n          >\n            {children}\n          </div>\n        </PopupPortal>\n      )}\n    </span>\n  );\n};\n\nexport default HoverCard;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"HoverCard.js","sources":["../../../src/components/HoverCard.tsx"],"sourcesContent":["import React, {\n  cloneElement,\n  useCallback,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { PopupPortal } from '../helpers/portal';\nimport { useIsHydrated } from '../helpers/useIsHydrated';\nimport { marginGap, useAnchoredPosition } from '../helpers/useAnchoredPosition';\nimport { chain, useHoverOpen } from '../helpers/useHoverOpen';\nimport { isTabbableKind } from '../helpers/useFocusTrap';\nimport { isDev, warnOnce } from '../helpers/devWarnings';\nimport type { PickerPosition } from '../form/_pickerInternals/pickerTypes';\n\n/**\n * Where the card opens against its trigger: below (`bottom-*`) or above\n * (`top-*`), lined up with the trigger's left or right edge. `auto` picks the\n * one that keeps the card in the viewport, preferring below and lined up on\n * the left. The same union `Popover` and the date and time pickers take.\n */\nexport type HoverCardPosition = PickerPosition;\n\n/**\n * Props for the HoverCard component. `className`, `id`, the other HTML\n * attributes and the helper props land on the `span` around the trigger, not\n * on the card; `contentClassName` reaches the card.\n * @extraProp {string} [className] - Additional classes for the `span` around the trigger. The card takes `contentClassName`.\n */\nexport interface HoverCardProps\n  extends\n    Omit<React.HTMLAttributes<HTMLSpanElement>, 'color' | 'children'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * The element the card previews, such as a link or a `Button`. The element\n   * itself has to take focus, so keyboard users can open the card too: a\n   * link inside a `<span>` doesn't do, since focus comes back to the trigger\n   * and its ARIA is on it. HoverCard gives it no role and no tab stop, since\n   * it can't know what the element is, and a development build warns when\n   * it can't take focus: use a link or a button, or give the element\n   * `tabIndex={0}`. A disabled button can't take focus either. HoverCard adds\n   * `aria-expanded` and `aria-controls`, both naming the card only while it\n   * is on the page, so it has to be a single element that passes those to\n   * its DOM node. Its own click and keys stay its own, and the card doesn't\n   * toggle on them, except Escape while the card is open, which closes the\n   * card before the trigger sees it.\n   */\n  trigger: React.ReactElement;\n  /**\n   * The card's content: a preview whose links and buttons are fine, but not a\n   * form, which belongs in a `Popover`. The card pads itself, so content goes\n   * straight in.\n   */\n  children?: React.ReactNode;\n  /**\n   * Controlled open state. When set, hover, focus and Escape only report\n   * through `onOpenChange`, so an action inside the card can close it. While\n   * the card is open, Escape is reported, and when focus is in the card, on\n   * its trigger or nowhere, the key stops there even if you keep the card\n   * open, so a `Modal` around it doesn't close from the keyboard until the\n   * card does.\n   */\n  open?: boolean;\n  /**\n   * Initial open state when uncontrolled. A card that starts open stays open\n   * until the pointer or focus has been and gone, or Escape closes it.\n   * @defaultValue false\n   */\n  defaultOpen?: boolean;\n  /**\n   * Called with the state asked for: when `openDelay` or `closeDelay` runs\n   * out, and right away on Escape. Fires in both controlled and uncontrolled\n   * use. An Escape it reports stops at the card when focus is in the card,\n   * on its trigger or nowhere, so nothing around it sees that key. With\n   * focus anywhere else, the card still closes and the key goes on to\n   * whatever has focus.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * How long the pointer or keyboard focus waits on the trigger before the\n   * card opens, in milliseconds.\n   * @defaultValue 600\n   */\n  openDelay?: number;\n  /**\n   * How long the card stays after the pointer and focus have left the trigger\n   * and the card, in milliseconds. It is the time the pointer has to cross\n   * the gap between the trigger and the card: with `0` the card closes as the\n   * pointer leaves the trigger, before the pointer can reach it.\n   * @defaultValue 300\n   */\n  closeDelay?: number;\n  /**\n   * Where the card opens against the trigger. Left out, it opens below and\n   * lines up with the trigger's start edge, which is its right edge on a\n   * right-to-left page, so a trigger at the start of the line doesn't push\n   * the card off the screen. A corner you pass stays physical, so\n   * `bottom-left` lines up the left edges on either page.\n   * @defaultValue 'bottom-left'\n   */\n  position?: HoverCardPosition;\n  /**\n   * Render the card through `Portal`, into the `portalContainer` a\n   * `ConfigProvider` sets, else the overlay it's in that takes its popups,\n   * such as a `Modal`, else `document.body`, fixed to the viewport, so an\n   * ancestor's `overflow`, `transform` or stacking context can't clip it. A\n   * trigger in running text needs it too, since the card's block content\n   * can't sit inside a `<p>`. The card then shows from the commit after\n   * hydration, never in server markup, and it sits in the Tab order where its\n   * container is. At the end of `<body>` or of an overlay, Tab reaches it\n   * only after the rest of the page or the overlay, and focus leaving the\n   * trigger on the way closes it, so keyboard users can open it, read it and\n   * close it with Escape, and whatever it links to has to be reachable from\n   * the page as well. Theming variables set on an ancestor of the trigger reach it only\n   * when its container is inside that ancestor.\n   * @defaultValue false\n   */\n  appendToBody?: boolean;\n  /**\n   * Open the card with a tap on a touch screen. Touch has no hover, so\n   * without this a phone or tablet never opens the card. With it, a tap on\n   * the trigger opens the card at once, and it stays until a second tap on\n   * the trigger, a tap outside the trigger and the card, or Escape. The tap\n   * still does whatever the trigger does, so turn this on only for a trigger\n   * with no tap action of its own, such as a `Button` with no `onClick`: on\n   * a link, the first tap would follow the link rather than show the card.\n   * Mouse and pen work the same either way.\n   * @defaultValue false\n   */\n  openOnTap?: boolean;\n  /** Additional classes for the card (`.hover-card-content`). */\n  contentClassName?: string;\n}\n\n/**\n * The `HoverCard` component shows a card previewing what's behind a link or a button while the pointer rests on it or keyboard focus is on it.\n *\n * Nothing moves focus when the card opens, and nothing traps it. In place,\n * the card comes right after the trigger, so Tab goes from the trigger into\n * its links and tabbing past them closes it. The pointer can move onto the\n * card, Escape closes it from anywhere, and by default touch doesn't open it,\n * so tapping the trigger just does what the trigger does. `openOnTap` opens\n * it with a tap, for a trigger with no tap action of its own. For hints with nothing to\n * click use `Tooltip`, and for content opened on purpose, such as a form,\n * use `Popover`.\n *\n * @function\n * @param {HoverCardProps} props - Props for the HoverCard component.\n * @returns {JSX.Element} The trigger in its wrapper, and the card while open.\n *\n * @example\n * <HoverCard trigger={<a href=\"/people/ada\">Ada Lovelace</a>}>\n *   <Title as=\"p\" size=\"6\">Ada Lovelace</Title>\n *   <SubTitle as=\"p\" size=\"6\">Analytical Engine team</SubTitle>\n * </HoverCard>\n */\nexport const HoverCard: React.FC<HoverCardProps> = ({\n  trigger,\n  children,\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpenChange,\n  openDelay = 600,\n  closeDelay = 300,\n  position,\n  appendToBody = false,\n  openOnTap = false,\n  className,\n  contentClassName,\n  ...props\n}) => {\n  const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n  const {\n    onPointerEnter,\n    onPointerOver,\n    onPointerLeave,\n    onPointerDown,\n    onPointerUp,\n    onFocus,\n    onBlur,\n    ...attrs\n  } = rest;\n  const rootRef = useRef<HTMLSpanElement>(null);\n  const cardRef = useRef<HTMLDivElement>(null);\n  const cardId = `${useId()}-card`;\n\n  const isControlled = controlledOpen !== undefined;\n  const [internalOpen, setInternalOpen] = useState(defaultOpen);\n  const isOpen = controlledOpen ?? internalOpen;\n\n  const requestOpen = useCallback(\n    (next: boolean) => {\n      onOpenChange?.(next);\n      if (!isControlled) setInternalOpen(next);\n    },\n    [isControlled, onOpenChange]\n  );\n\n  // A portaled card has no server markup, so it only exists from the commit\n  // after hydration, and nothing measures it before then.\n  const hydrated = useIsHydrated();\n  const cardMounted = isOpen && (hydrated || !appendToBody);\n\n  const resolved = useAnchoredPosition(rootRef, cardRef, {\n    active: cardMounted,\n    position,\n    fixed: appendToBody,\n    // The gap comes from `--bulma-hover-card-offset` in the stylesheet, so\n    // the coordinates leave it out and `auto` reads it off the card.\n    offset: 0,\n    styledGap: marginGap,\n  });\n\n  // The trigger renders first inside the wrapper. Read when needed rather\n  // than held, so a trigger that remounted is still the one found.\n  const triggerRef = useMemo(\n    () => ({\n      get current() {\n        const first = (rootRef.current as HTMLSpanElement).firstElementChild;\n        return first && first !== cardRef.current\n          ? (first as HTMLElement)\n          : null;\n      },\n    }),\n    []\n  );\n\n  const hover = useHoverOpen({\n    open: isOpen,\n    onOpenChange: requestOpen,\n    openDelay,\n    closeDelay,\n    triggerRef,\n    floatingRef: cardRef,\n    openOnTap,\n  });\n\n  // A trigger that can't take focus leaves keyboard users no way to open the\n  // card. It has to be the trigger element itself, not something inside it,\n  // since focus comes back to it and its ARIA is on it. Judged by what the\n  // element is rather than by its styles, which can hide it for now. After\n  // every commit, since the trigger can change, and only in development.\n  useEffect(() => {\n    if (!isDev()) return;\n    const triggerNode = triggerRef.current;\n    if (!triggerNode) return;\n    if (!triggerNode.matches(':disabled') && isTabbableKind(triggerNode)) {\n      return;\n    }\n    warnOnce(\n      'HoverCard:unfocusable-trigger',\n      \"[bestax-bulma] <HoverCard> has a trigger that can't take focus, so \" +\n        \"keyboard users can't open the card. Use a link or a button as the \" +\n        'trigger, or give it tabIndex={0}.'\n    );\n  });\n\n  // Expanded only while the card is on the page, so a portaled card that\n  // waits for hydration isn't announced before it exists.\n  const clonedTrigger = cloneElement(\n    trigger as React.ReactElement<Record<string, unknown>>,\n    {\n      'aria-expanded': cardMounted,\n      'aria-controls': cardMounted ? cardId : undefined,\n    }\n  );\n\n  const rootClasses = classNames(\n    usePrefixedClassNames('hover-card', { 'is-active': cardMounted }),\n    bulmaHelperClasses,\n    className\n  );\n  const cardClasses = classNames(\n    usePrefixedClassNames('hover-card-content', {\n      [`is-${resolved.position}`]: true,\n      // The default lines up with the trigger's inline start, so the\n      // stylesheet moves it to the right edge on a right-to-left page.\n      'is-start-aligned': position === undefined,\n      'is-portal': appendToBody,\n    }),\n    contentClassName\n  );\n\n  return (\n    // The ref after the spread: React 19 hands a function component a `ref`\n    // prop like any other, and the wrapper has to stay ours. The card is in\n    // the wrapper's React tree even when portaled, so the hover and focus\n    // handlers here hear from both.\n    <span\n      className={rootClasses}\n      {...attrs}\n      onPointerEnter={chain(onPointerEnter, hover.onPointerEnter)}\n      onPointerOver={chain(onPointerOver, hover.onPointerOver)}\n      onPointerLeave={chain(onPointerLeave, hover.onPointerLeave)}\n      onFocus={chain(onFocus, hover.onFocus)}\n      onBlur={chain(onBlur, hover.onBlur)}\n      onPointerDown={chain(onPointerDown, hover.onPointerDown)}\n      onPointerUp={chain(onPointerUp, hover.onPointerUp)}\n      ref={rootRef}\n    >\n      {clonedTrigger}\n      {isOpen && (\n        <PopupPortal disabled={!appendToBody}>\n          <div\n            ref={cardRef}\n            id={cardId}\n            className={cardClasses}\n            style={\n              appendToBody\n                ? {\n                    position: 'fixed',\n                    top: resolved.top,\n                    left: resolved.left,\n                  }\n                : undefined\n            }\n          >\n            {children}\n          </div>\n        </PopupPortal>\n      )}\n    </span>\n  );\n};\n\nexport default HoverCard;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/components/Panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"Panel.js","sources":["../../../src/components/Panel.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport {\n  ANCHOR_ONLY_ATTRS,\n  type AnchorOnlyAttributes,\n  omitAttrs,\n} from '../helpers/anchorAttrs';\nimport type { ConstrainedPolymorphicComponentWithoutRef } from '../helpers/polymorphic';\nimport {\n  Icon,\n  IconChildrenProps,\n  IconDeprecatedProps,\n  IconNameProps,\n} from '../elements/Icon';\n\n/**\n * Props for the Panel component.\n */\nexport interface PanelProps\n  extends\n    React.HTMLAttributes<HTMLElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * HTML element to render (default: `nav`). A `nav` is a `navigation`\n   * landmark, which suits a panel of links; a panel that is not navigation\n   * takes another tag. Bulma's own colored panels use `article`. A `section`\n   * is a `region` landmark only once it has an accessible name, such as\n   * `aria-labelledby` pointing at the `id` of its `Panel.Heading`.\n   */\n  as?: 'nav' | 'article' | 'section' | 'aside' | 'div';\n  /** Bulma color modifier for the panel. */\n  color?:\n    | 'primary'\n    | 'link'\n    | 'info'\n    | 'success'\n    | 'warning'\n    | 'danger'\n    | 'black'\n    | 'dark'\n    | 'light'\n    | 'white';\n  /** Additional CSS classes. */\n  className?: string;\n  /** Panel content (usually includes subcomponents). */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for the PanelHeading component.\n */\nexport interface PanelHeadingProps extends React.HTMLAttributes<HTMLParagraphElement> {\n  /** Additional CSS classes. */\n  className?: string;\n  /** Heading content. */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for the PanelTabs component.\n */\nexport interface PanelTabsProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Additional CSS classes. */\n  className?: string;\n  /** Tabs content. */\n  children?: React.ReactNode;\n}\n\n/**\n * What `<label>` adds over the attributes every element has (`htmlFor` and\n * `form`), subtracted from React's types the way `AnchorOnlyAttributes` is, so\n * it grows when React's does.\n */\ntype LabelOnlyAttributes = Omit<\n  React.LabelHTMLAttributes<HTMLLabelElement>,\n  keyof React.HTMLAttributes<HTMLLabelElement>\n>;\n\n/**\n * The set withheld from a non-label `Panel.Block`, keyed so it stops compiling\n * until a label attribute React adds is named here.\n */\nconst STRIP_FROM_NON_LABEL: Readonly<Record<keyof LabelOnlyAttributes, true>> =\n  {\n    form: true,\n    htmlFor: true,\n  };\n\n/**\n * The set withheld from a non-anchor `Panel.Block`: the derived anchor-only\n * attributes plus `rel`, which React declares on every element, withheld the\n * way `Level.Item` and `Card.FooterItem` withhold it.\n */\nconst STRIP_FROM_NON_ANCHOR: Readonly<\n  Record<keyof AnchorOnlyAttributes | 'rel', true>\n> = { ...ANCHOR_ONLY_ATTRS, rel: true };\n\n/** A `<div>` block takes neither set. */\nconst STRIP_FROM_DIV: Readonly<\n  Record<keyof AnchorOnlyAttributes | 'rel' | keyof LabelOnlyAttributes, true>\n> = { ...STRIP_FROM_NON_ANCHOR, ...STRIP_FROM_NON_LABEL };\n\n/**\n * The elements a panel block may render as: the tags Bulma's panel markup\n * puts `.panel-block` on.\n */\nexport type PanelBlockElement = 'a' | 'div' | 'label';\n\n/**\n * The PanelBlock component's own props.\n */\nexport interface PanelBlockOwnProps {\n  /** Additional CSS classes. */\n  className?: string;\n  /** Whether the block is active. */\n  active?: boolean;\n  /** Block content. */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for the PanelBlock component. Everything the block does not own\n * follows `as`: the anchor's attributes and an `HTMLAnchorElement`\n * `currentTarget` under the default `'a'`, `htmlFor` under `'label'`, and the\n * shared HTML attributes under any of them.\n *\n * The type parameter defaults to `'a'`, the element a block renders with no\n * `as`, rather than to the whole union the way `DropdownItemProps` does. Before\n * `as` existed this type was the anchor's attributes, so bare\n * `PanelBlockProps` stays exactly that, `href` and anchor-typed handlers\n * included. Write `PanelBlockProps<'div'>` or `PanelBlockProps<'label'>` for\n * the others.\n */\nexport type PanelBlockProps<T extends PanelBlockElement = 'a'> =\n  PanelBlockOwnProps &\n    Omit<React.ComponentPropsWithoutRef<T>, keyof PanelBlockOwnProps | 'as'> & {\n      /**\n       * HTML element to render (default: `a`). Bulma styles a `label` block\n       * as clickable, like an `a`, and a `div` block as static content, such\n       * as a table. The props follow the tag, so the anchor attributes\n       * (`href`, `target`, `download` and the rest) are typed only on an `a`\n       * and `htmlFor` only on a `label`; at runtime the block also drops them,\n       * and `rel`, on the other tags. `Panel.CheckboxBlock`,\n       * `Panel.InputBlock` and `Panel.ButtonBlock` render the usual `label`\n       * and `div` blocks with their contents.\n       */\n      as?: T;\n    };\n\n/**\n * The shape the implementation destructures. The public contract is the\n * generic `PanelBlockProps<T>` above, which the body cannot see through.\n */\ntype PanelBlockImplProps = PanelBlockOwnProps & {\n  as?: PanelBlockElement;\n};\n\n/**\n * Props for the PanelIcon component.\n * Extends IconProps but uses 'panel-icon' as the container class.\n */\nexport type PanelIconProps =\n  | Omit<IconNameProps, 'containerClassName'>\n  | Omit<IconChildrenProps, 'containerClassName'>\n  // `PanelIcon` spreads straight into `<Icon>`, so every member of `IconProps`\n  // reaches it. Enumerating them by hand is what left the deprecated `icon`\n  // path compiling on `Icon` and failing here, with an error naming `children`.\n  | Omit<IconDeprecatedProps, 'containerClassName'>;\n\n/**\n * Props for the PanelInputBlock component.\n */\nexport interface PanelInputBlockProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Input value. */\n  value?: string;\n  /** Input change handler. */\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n  /** Input placeholder. */\n  placeholder?: string;\n  /** Icon class for left icon (default 'fas fa-search'). */\n  iconClassName?: string;\n}\n\n/**\n * Props for the PanelCheckboxBlock component.\n */\nexport interface PanelCheckboxBlockProps extends Omit<\n  React.LabelHTMLAttributes<HTMLLabelElement>,\n  'onChange'\n> {\n  /** Whether the checkbox is checked. */\n  checked?: boolean;\n  /** Checkbox change handler. */\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n  /** Label/content. */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for the PanelButtonBlock component.\n */\nexport interface PanelButtonBlockProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Button content. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Panel` component implements Bulma's versatile panel block for React.\n *\n * @function\n * @param {PanelProps} props - Props for the Panel component.\n * @returns {JSX.Element} The rendered panel.\n * @see {@link https://bulma.io/documentation/components/panel/ | Bulma Panel documentation}\n */\nconst PanelComponent: React.FC<PanelProps> = ({\n  as: Tag = 'nav',\n  color,\n  className,\n  children,\n  ...props\n}) => {\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color,\n    ...props,\n  });\n\n  // Generate Bulma classes with prefix\n  const bulmaClasses = usePrefixedClassNames('panel', {\n    [`is-${color}`]: color,\n  });\n\n  const panelClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  return (\n    <Tag className={panelClasses} {...rest}>\n      {children}\n    </Tag>\n  );\n};\n\n/**\n * Main heading (renders as `<p class=\"panel-heading\">`)\n *\n * @function\n * @param {PanelHeadingProps} props - Props for the PanelHeading component.\n * @returns {JSX.Element} The rendered panel heading.\n */\nexport const PanelHeading: React.FC<PanelHeadingProps> = ({\n  className,\n  children,\n  ...props\n}) => (\n  <p\n    className={classNames(usePrefixedClassNames('panel-heading'), className)}\n    {...props}\n  >\n    {children}\n  </p>\n);\n\n/**\n * Panel tabs (renders as `<p class=\"panel-tabs\">`)\n *\n * @function\n * @param {PanelTabsProps} props - Props for the PanelTabs component.\n * @returns {JSX.Element} The rendered panel tabs.\n */\nexport const PanelTabs: React.FC<PanelTabsProps> = ({\n  className,\n  children,\n  ...props\n}) => (\n  <p\n    className={classNames(usePrefixedClassNames('panel-tabs'), className)}\n    {...props}\n  >\n    {children}\n  </p>\n);\n\n/**\n * Individual panel block (renders as `<a class=\"panel-block\">` unless `as` says otherwise)\n *\n * @function\n * @param {PanelBlockProps} props - Props for the PanelBlock component.\n * @returns {JSX.Element} The rendered panel block.\n */\nexport const PanelBlock = ((blockProps: PanelBlockProps) => {\n  const {\n    as: Tag = 'a',\n    className,\n    active,\n    children,\n    ...props\n  } = blockProps as PanelBlockImplProps;\n  const blockClasses = classNames(\n    usePrefixedClassNames('panel-block', { 'is-active': active }),\n    className\n  );\n  // The anchor's own attributes reach an `<a>` and nothing else, and the\n  // label's a `<label>`; the sets above say which those are. The type already\n  // keeps them off the other tags, so this is for a plain-JS caller, a loose\n  // `{...props}` spread, and the genericity a wrapping HOC erases.\n  const forwarded =\n    Tag === 'a'\n      ? omitAttrs(props, STRIP_FROM_NON_LABEL)\n      : Tag === 'label'\n        ? omitAttrs(props, STRIP_FROM_NON_ANCHOR)\n        : omitAttrs(props, STRIP_FROM_DIV);\n  return (\n    <Tag className={blockClasses} {...forwarded}>\n      {children}\n    </Tag>\n  );\n}) as ConstrainedPolymorphicComponentWithoutRef<\n  PanelBlockOwnProps,\n  PanelBlockElement,\n  'a'\n>;\n\n/**\n * Icon wrapper with panel styling (renders as `<span class=\"panel-icon\">`, containing an\n * `<i/>` when a `name` is given, or the custom node passed as `children`).\n * Accepts all Icon props (`name`, `variant`, `features`, etc.), or `children` for a custom node.\n *\n * @function\n * @param {PanelIconProps} props - Props for the PanelIcon component.\n * @returns {JSX.Element} The rendered panel icon.\n */\nexport const PanelIcon: React.FC<PanelIconProps> = ({\n  className,\n  ...props\n}) => (\n  <Icon\n    containerClassName={classNames(\n      usePrefixedClassNames('panel-icon'),\n      className\n    )}\n    {...props}\n  />\n);\n\n/**\n * Search input with icon (renders as `<div class=\"panel-block\">`)\n *\n * @function\n * @param {PanelInputBlockProps} props - Props for the PanelInputBlock component.\n * @returns {JSX.Element} The rendered panel input block.\n */\nexport const PanelInputBlock: React.FC<PanelInputBlockProps> = ({\n  value,\n  onChange,\n  placeholder,\n  iconClassName = 'fas fa-search',\n  ...props\n}) => {\n  const inputClass = usePrefixedClassNames('input');\n\n  return (\n    <div className={usePrefixedClassNames('panel-block')} {...props}>\n      <p className={usePrefixedClassNames('control', 'has-icons-left')}>\n        <input\n          className={inputClass}\n          type=\"text\"\n          placeholder={placeholder}\n          value={value}\n          onChange={onChange}\n        />\n        <span className={usePrefixedClassNames('icon', 'is-left')}>\n          <i className={iconClassName} aria-hidden=\"true\"></i>\n        </span>\n      </p>\n    </div>\n  );\n};\n\n/**\n * Checkbox block (renders as `<label class=\"panel-block\">`)\n *\n * @function\n * @param {PanelCheckboxBlockProps} props - Props for the PanelCheckboxBlock component.\n * @returns {JSX.Element} The rendered panel checkbox block.\n */\nexport const PanelCheckboxBlock: React.FC<PanelCheckboxBlockProps> = ({\n  checked,\n  onChange,\n  children,\n  ...props\n}) => (\n  <label className={usePrefixedClassNames('panel-block')} {...props}>\n    <input type=\"checkbox\" checked={checked} onChange={onChange} />\n    {children}\n  </label>\n);\n\n/**\n * Call-to-action button (renders as `<div class=\"panel-block\"><button /></div>`)\n *\n * @function\n * @param {PanelButtonBlockProps} props - Props for the PanelButtonBlock component.\n * @returns {JSX.Element} The rendered panel button block.\n */\nexport const PanelButtonBlock: React.FC<PanelButtonBlockProps> = ({\n  children,\n  className,\n  ...props\n}) => (\n  <div className={usePrefixedClassNames('panel-block')}>\n    <button\n      className={classNames(\n        usePrefixedClassNames(\n          'button',\n          'is-link',\n          'is-outlined',\n          'is-fullwidth'\n        ),\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </button>\n  </div>\n);\n\nexport const Panel = withSubComponents(\n  PanelComponent,\n  {\n    Heading: PanelHeading,\n    Tabs: PanelTabs,\n    Block: PanelBlock,\n    Icon: PanelIcon,\n    InputBlock: PanelInputBlock,\n    CheckboxBlock: PanelCheckboxBlock,\n    ButtonBlock: PanelButtonBlock,\n  },\n  'Panel'\n);\n\nexport default Panel;\n"],"names":["STRIP_FROM_NON_ANCHOR","_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"Panel.js","sources":["../../../src/components/Panel.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport {\n  ANCHOR_ONLY_ATTRS,\n  type AnchorOnlyAttributes,\n  omitAttrs,\n} from '../helpers/anchorAttrs';\nimport type { ConstrainedPolymorphicComponentWithoutRef } from '../helpers/polymorphic';\nimport {\n  Icon,\n  IconChildrenProps,\n  IconDeprecatedProps,\n  IconNameProps,\n} from '../elements/Icon';\n\n/**\n * Props for the Panel component.\n */\nexport interface PanelProps\n  extends\n    React.HTMLAttributes<HTMLElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * HTML element to render (default: `nav`). A `nav` is a `navigation`\n   * landmark, which suits a panel of links; a panel that is not navigation\n   * takes another tag. Bulma's own colored panels use `article`. A `section`\n   * is a `region` landmark only once it has an accessible name, such as\n   * `aria-labelledby` pointing at the `id` of its `Panel.Heading`.\n   */\n  as?: 'nav' | 'article' | 'section' | 'aside' | 'div';\n  /**\n   * Bulma color modifier for the panel. With none, the heading takes the\n   * text color, with its title in the page background's color so it reads on\n   * both schemes. On the dark scheme that title color comes from bestax's\n   * stylesheets: Bulma's CSS alone writes it white on light gray there.\n   */\n  color?:\n    | 'primary'\n    | 'link'\n    | 'info'\n    | 'success'\n    | 'warning'\n    | 'danger'\n    | 'black'\n    | 'dark'\n    | 'light'\n    | 'white';\n  /** Additional CSS classes. */\n  className?: string;\n  /** Panel content (usually includes subcomponents). */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for the PanelHeading component.\n */\nexport interface PanelHeadingProps extends React.HTMLAttributes<HTMLParagraphElement> {\n  /** Additional CSS classes. */\n  className?: string;\n  /** Heading content. */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for the PanelTabs component.\n */\nexport interface PanelTabsProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Additional CSS classes. */\n  className?: string;\n  /** Tabs content. */\n  children?: React.ReactNode;\n}\n\n/**\n * What `<label>` adds over the attributes every element has (`htmlFor` and\n * `form`), subtracted from React's types the way `AnchorOnlyAttributes` is, so\n * it grows when React's does.\n */\ntype LabelOnlyAttributes = Omit<\n  React.LabelHTMLAttributes<HTMLLabelElement>,\n  keyof React.HTMLAttributes<HTMLLabelElement>\n>;\n\n/**\n * The set withheld from a non-label `Panel.Block`, keyed so it stops compiling\n * until a label attribute React adds is named here.\n */\nconst STRIP_FROM_NON_LABEL: Readonly<Record<keyof LabelOnlyAttributes, true>> =\n  {\n    form: true,\n    htmlFor: true,\n  };\n\n/**\n * The set withheld from a non-anchor `Panel.Block`: the derived anchor-only\n * attributes plus `rel`, which React declares on every element, withheld the\n * way `Level.Item` and `Card.FooterItem` withhold it.\n */\nconst STRIP_FROM_NON_ANCHOR: Readonly<\n  Record<keyof AnchorOnlyAttributes | 'rel', true>\n> = { ...ANCHOR_ONLY_ATTRS, rel: true };\n\n/** A `<div>` block takes neither set. */\nconst STRIP_FROM_DIV: Readonly<\n  Record<keyof AnchorOnlyAttributes | 'rel' | keyof LabelOnlyAttributes, true>\n> = { ...STRIP_FROM_NON_ANCHOR, ...STRIP_FROM_NON_LABEL };\n\n/**\n * The elements a panel block may render as: the tags Bulma's panel markup\n * puts `.panel-block` on.\n */\nexport type PanelBlockElement = 'a' | 'div' | 'label';\n\n/**\n * The PanelBlock component's own props.\n */\nexport interface PanelBlockOwnProps {\n  /** Additional CSS classes. */\n  className?: string;\n  /** Whether the block is active. */\n  active?: boolean;\n  /** Block content. */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for the PanelBlock component. Everything the block does not own\n * follows `as`: the anchor's attributes and an `HTMLAnchorElement`\n * `currentTarget` under the default `'a'`, `htmlFor` under `'label'`, and the\n * shared HTML attributes under any of them.\n *\n * The type parameter defaults to `'a'`, the element a block renders with no\n * `as`, rather than to the whole union the way `DropdownItemProps` does. Before\n * `as` existed this type was the anchor's attributes, so bare\n * `PanelBlockProps` stays exactly that, `href` and anchor-typed handlers\n * included. Write `PanelBlockProps<'div'>` or `PanelBlockProps<'label'>` for\n * the others.\n */\nexport type PanelBlockProps<T extends PanelBlockElement = 'a'> =\n  PanelBlockOwnProps &\n    Omit<React.ComponentPropsWithoutRef<T>, keyof PanelBlockOwnProps | 'as'> & {\n      /**\n       * HTML element to render (default: `a`). Bulma styles a `label` block\n       * as clickable, like an `a`, and a `div` block as static content, such\n       * as a table. The props follow the tag, so the anchor attributes\n       * (`href`, `target`, `download` and the rest) are typed only on an `a`\n       * and `htmlFor` only on a `label`; at runtime the block also drops them,\n       * and `rel`, on the other tags. `Panel.CheckboxBlock`,\n       * `Panel.InputBlock` and `Panel.ButtonBlock` render the usual `label`\n       * and `div` blocks with their contents.\n       */\n      as?: T;\n    };\n\n/**\n * The shape the implementation destructures. The public contract is the\n * generic `PanelBlockProps<T>` above, which the body cannot see through.\n */\ntype PanelBlockImplProps = PanelBlockOwnProps & {\n  as?: PanelBlockElement;\n};\n\n/**\n * Props for the PanelIcon component.\n * Extends IconProps but uses 'panel-icon' as the container class.\n */\nexport type PanelIconProps =\n  | Omit<IconNameProps, 'containerClassName'>\n  | Omit<IconChildrenProps, 'containerClassName'>\n  // `PanelIcon` spreads straight into `<Icon>`, so every member of `IconProps`\n  // reaches it. Enumerating them by hand is what left the deprecated `icon`\n  // path compiling on `Icon` and failing here, with an error naming `children`.\n  | Omit<IconDeprecatedProps, 'containerClassName'>;\n\n/**\n * Props for the PanelInputBlock component.\n */\nexport interface PanelInputBlockProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Input value. */\n  value?: string;\n  /** Input change handler. */\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n  /** Input placeholder. */\n  placeholder?: string;\n  /** Icon class for left icon (default 'fas fa-search'). */\n  iconClassName?: string;\n}\n\n/**\n * Props for the PanelCheckboxBlock component.\n */\nexport interface PanelCheckboxBlockProps extends Omit<\n  React.LabelHTMLAttributes<HTMLLabelElement>,\n  'onChange'\n> {\n  /** Whether the checkbox is checked. */\n  checked?: boolean;\n  /** Checkbox change handler. */\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n  /** Label/content. */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for the PanelButtonBlock component.\n */\nexport interface PanelButtonBlockProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Button content. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Panel` component implements Bulma's versatile panel block for React.\n *\n * @function\n * @param {PanelProps} props - Props for the Panel component.\n * @returns {JSX.Element} The rendered panel.\n * @see {@link https://bulma.io/documentation/components/panel/ | Bulma Panel documentation}\n */\nconst PanelComponent: React.FC<PanelProps> = ({\n  as: Tag = 'nav',\n  color,\n  className,\n  children,\n  ...props\n}) => {\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color,\n    ...props,\n  });\n\n  // Generate Bulma classes with prefix\n  const bulmaClasses = usePrefixedClassNames('panel', {\n    [`is-${color}`]: color,\n  });\n\n  const panelClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  return (\n    <Tag className={panelClasses} {...rest}>\n      {children}\n    </Tag>\n  );\n};\n\n/**\n * Main heading (renders as `<p class=\"panel-heading\">`)\n *\n * @function\n * @param {PanelHeadingProps} props - Props for the PanelHeading component.\n * @returns {JSX.Element} The rendered panel heading.\n */\nexport const PanelHeading: React.FC<PanelHeadingProps> = ({\n  className,\n  children,\n  ...props\n}) => (\n  <p\n    className={classNames(usePrefixedClassNames('panel-heading'), className)}\n    {...props}\n  >\n    {children}\n  </p>\n);\n\n/**\n * Panel tabs (renders as `<p class=\"panel-tabs\">`)\n *\n * @function\n * @param {PanelTabsProps} props - Props for the PanelTabs component.\n * @returns {JSX.Element} The rendered panel tabs.\n */\nexport const PanelTabs: React.FC<PanelTabsProps> = ({\n  className,\n  children,\n  ...props\n}) => (\n  <p\n    className={classNames(usePrefixedClassNames('panel-tabs'), className)}\n    {...props}\n  >\n    {children}\n  </p>\n);\n\n/**\n * Individual panel block (renders as `<a class=\"panel-block\">` unless `as` says otherwise)\n *\n * @function\n * @param {PanelBlockProps} props - Props for the PanelBlock component.\n * @returns {JSX.Element} The rendered panel block.\n */\nexport const PanelBlock = ((blockProps: PanelBlockProps) => {\n  const {\n    as: Tag = 'a',\n    className,\n    active,\n    children,\n    ...props\n  } = blockProps as PanelBlockImplProps;\n  const blockClasses = classNames(\n    usePrefixedClassNames('panel-block', { 'is-active': active }),\n    className\n  );\n  // The anchor's own attributes reach an `<a>` and nothing else, and the\n  // label's a `<label>`; the sets above say which those are. The type already\n  // keeps them off the other tags, so this is for a plain-JS caller, a loose\n  // `{...props}` spread, and the genericity a wrapping HOC erases.\n  const forwarded =\n    Tag === 'a'\n      ? omitAttrs(props, STRIP_FROM_NON_LABEL)\n      : Tag === 'label'\n        ? omitAttrs(props, STRIP_FROM_NON_ANCHOR)\n        : omitAttrs(props, STRIP_FROM_DIV);\n  return (\n    <Tag className={blockClasses} {...forwarded}>\n      {children}\n    </Tag>\n  );\n}) as ConstrainedPolymorphicComponentWithoutRef<\n  PanelBlockOwnProps,\n  PanelBlockElement,\n  'a'\n>;\n\n/**\n * Icon wrapper with panel styling (renders as `<span class=\"panel-icon\">`, containing an\n * `<i/>` when a `name` is given, or the custom node passed as `children`).\n * Accepts all Icon props (`name`, `variant`, `features`, etc.), or `children` for a custom node.\n *\n * @function\n * @param {PanelIconProps} props - Props for the PanelIcon component.\n * @returns {JSX.Element} The rendered panel icon.\n */\nexport const PanelIcon: React.FC<PanelIconProps> = ({\n  className,\n  ...props\n}) => (\n  <Icon\n    containerClassName={classNames(\n      usePrefixedClassNames('panel-icon'),\n      className\n    )}\n    {...props}\n  />\n);\n\n/**\n * Search input with icon (renders as `<div class=\"panel-block\">`)\n *\n * @function\n * @param {PanelInputBlockProps} props - Props for the PanelInputBlock component.\n * @returns {JSX.Element} The rendered panel input block.\n */\nexport const PanelInputBlock: React.FC<PanelInputBlockProps> = ({\n  value,\n  onChange,\n  placeholder,\n  iconClassName = 'fas fa-search',\n  ...props\n}) => {\n  const inputClass = usePrefixedClassNames('input');\n\n  return (\n    <div className={usePrefixedClassNames('panel-block')} {...props}>\n      <p className={usePrefixedClassNames('control', 'has-icons-left')}>\n        <input\n          className={inputClass}\n          type=\"text\"\n          placeholder={placeholder}\n          value={value}\n          onChange={onChange}\n        />\n        <span className={usePrefixedClassNames('icon', 'is-left')}>\n          <i className={iconClassName} aria-hidden=\"true\"></i>\n        </span>\n      </p>\n    </div>\n  );\n};\n\n/**\n * Checkbox block (renders as `<label class=\"panel-block\">`)\n *\n * @function\n * @param {PanelCheckboxBlockProps} props - Props for the PanelCheckboxBlock component.\n * @returns {JSX.Element} The rendered panel checkbox block.\n */\nexport const PanelCheckboxBlock: React.FC<PanelCheckboxBlockProps> = ({\n  checked,\n  onChange,\n  children,\n  ...props\n}) => (\n  <label className={usePrefixedClassNames('panel-block')} {...props}>\n    <input type=\"checkbox\" checked={checked} onChange={onChange} />\n    {children}\n  </label>\n);\n\n/**\n * Call-to-action button (renders as `<div class=\"panel-block\"><button /></div>`)\n *\n * @function\n * @param {PanelButtonBlockProps} props - Props for the PanelButtonBlock component.\n * @returns {JSX.Element} The rendered panel button block.\n */\nexport const PanelButtonBlock: React.FC<PanelButtonBlockProps> = ({\n  children,\n  className,\n  ...props\n}) => (\n  <div className={usePrefixedClassNames('panel-block')}>\n    <button\n      className={classNames(\n        usePrefixedClassNames(\n          'button',\n          'is-link',\n          'is-outlined',\n          'is-fullwidth'\n        ),\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </button>\n  </div>\n);\n\nexport const Panel = withSubComponents(\n  PanelComponent,\n  {\n    Heading: PanelHeading,\n    Tabs: PanelTabs,\n    Block: PanelBlock,\n    Icon: PanelIcon,\n    InputBlock: PanelInputBlock,\n    CheckboxBlock: PanelCheckboxBlock,\n    ButtonBlock: PanelButtonBlock,\n  },\n  'Panel'\n);\n\nexport default Panel;\n"],"names":["STRIP_FROM_NON_ANCHOR","_jsx","_jsxs"],"mappings":"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"}