@ifhover/leaf-ui 0.6.0 → 0.7.0

package/dist/esm/browser/modules/image/viewer.js

@@ -8,6 +8,7 @@ import yet_another_react_lightbox, { useController, useLightboxState, useNavigat
 import plugins_fullscreen from "yet-another-react-lightbox/plugins/fullscreen";
 import plugins_zoom from "yet-another-react-lightbox/plugins/zoom";
 import { LoadingControl } from "../loading/loading.js";
+import { ScrollbarControl } from "../scrollbar/scrollbar.js";
 import { motionDuration, useMotionEnabled } from "../shared/motion.js";
 import { ScopedPortal } from "../shared/scoped-portal.js";
 import { useFormattedText } from "../shared/use-formatted-text.js";
@@ -257,9 +258,14 @@ function ViewerChrome({ items, thumbnails, downloadable, zoomControl, fullscreen
                                     size: 18
                                 })
                             }),
-                            /*#__PURE__*/ jsx("fieldset", {
-                                className: "leaf-image-viewer__thumbnails",
+                            /*#__PURE__*/ jsx(ScrollbarControl, {
+                                className: "leaf-image-viewer__strip",
+                                contentClassName: "leaf-image-viewer__thumbnails",
                                 ref: strip,
+                                orientation: "horizontal",
+                                role: "group",
+                                tabIndex: -1,
+                                scrollbarTabIndex: -1,
                                 "aria-label": t('image.imageList'),
                                 children: items.map((image, target)=>/*#__PURE__*/ jsxs("button", {
                                         type: "button",

package/dist/esm/browser/modules/image/viewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"image/viewer.js","sources":["../../../../../src/image/viewer.tsx"],"sourcesContent":["import {\n  ChevronLeft,\n  ChevronRight,\n  Download,\n  ImageOff,\n  Maximize2,\n  Minimize2,\n  PanelBottom,\n  RotateCcw,\n  X,\n  ZoomIn,\n  ZoomOut,\n} from 'lucide-react';\nimport { type ReactNode, useEffect, useRef, useState } from 'react';\nimport Lightbox, {\n  type FullscreenRef,\n  useController,\n  useLightboxState,\n  useNavigationState,\n  type ZoomRef,\n} from 'yet-another-react-lightbox';\nimport Fullscreen from 'yet-another-react-lightbox/plugins/fullscreen';\nimport Zoom from 'yet-another-react-lightbox/plugins/zoom';\nimport { LoadingControl as Loading } from '../loading/loading';\nimport { motionDuration, useMotionEnabled } from '../shared/motion';\nimport { ScopedPortal } from '../shared/scoped-portal';\nimport { useFormattedText } from '../shared/use-formatted-text';\nimport { useText } from '../shared/use-text';\nimport type { ImagePreviewItem, ImagePreviewProps } from './image';\n\nexport function ImageViewer(props: ImagePreviewProps) {\n  return (\n    <ScopedPortal>\n      <Viewer {...props} />\n    </ScopedPortal>\n  );\n}\nfunction Control({\n  label,\n  children,\n  active,\n  disabled,\n  onClick,\n  className = '',\n}: {\n  label: string;\n  children: ReactNode;\n  active?: boolean;\n  disabled?: boolean;\n  onClick: () => void;\n  className?: string;\n}) {\n  return (\n    <button\n      type=\"button\"\n      className={`leaf-image-viewer__control ${className}`}\n      aria-label={label}\n      title={label}\n      aria-pressed={active}\n      disabled={disabled}\n      onClick={onClick}\n    >\n      {children}\n    </button>\n  );\n}\nfunction ViewerChrome({\n  items,\n  thumbnails,\n  downloadable,\n  zoomControl,\n  fullscreenControl,\n}: {\n  items: readonly ImagePreviewItem[];\n  thumbnails: boolean;\n  downloadable: boolean;\n  zoomControl: ZoomRef | null;\n  fullscreenControl: FullscreenRef | null;\n}) {\n  const t = useText();\n  const format = useFormattedText();\n  const motion = useMotionEnabled();\n  const { currentIndex } = useLightboxState();\n  const { prev, next, close } = useController();\n  const { prevDisabled, nextDisabled } = useNavigationState();\n  const strip = useRef<HTMLFieldSetElement>(null);\n  const [showThumbs, setShowThumbs] = useState(thumbnails);\n  const [failedDownload, setFailedDownload] = useState(false);\n  const [downloading, setDownloading] = useState(false);\n  const item = items[currentIndex];\n  const hasThumbs = thumbnails && items.length > 1;\n  const zoom = zoomControl?.zoom ?? 1;\n  const fullscreen = fullscreenControl?.fullscreen ?? false;\n  const downloadUrl = typeof item?.download === 'string' ? item.download : item?.src;\n  useEffect(() => setShowThumbs(thumbnails), [thumbnails]);\n  useEffect(() => {\n    setFailedDownload(false);\n    if (!showThumbs) return;\n    const root = strip.current;\n    const selected = root?.querySelector<HTMLElement>(`[data-index=\"${currentIndex}\"]`);\n    if (root && selected)\n      root.scrollTo({\n        left: selected.offsetLeft - root.offsetLeft - (root.clientWidth - selected.clientWidth) / 2,\n        behavior: motion ? 'smooth' : 'auto',\n      });\n  }, [currentIndex, showThumbs, motion]);\n  const choose = (target: number) => {\n    const difference = target - currentIndex;\n    if (difference > 0) next({ count: difference });\n    else if (difference < 0) prev({ count: -difference });\n  };\n  const download = async () => {\n    if (!item || downloading) return;\n    setDownloading(true);\n    setFailedDownload(false);\n    try {\n      const address = typeof item.download === 'string' ? item.download : item.src;\n      const response = await fetch(address);\n      if (!response.ok) throw new Error('Download failed');\n      const url = URL.createObjectURL(await response.blob());\n      const anchor = document.createElement('a');\n      anchor.href = url;\n      anchor.download = item.downloadName || address.split(/[?#]/)[0]?.split('/').pop() || 'image';\n      anchor.click();\n      setTimeout(() => URL.revokeObjectURL(url), 1000);\n    } catch {\n      setFailedDownload(true);\n    } finally {\n      setDownloading(false);\n    }\n  };\n  return (\n    <div\n      className=\"leaf-image-viewer__chrome\"\n      data-thumbnails={(hasThumbs && showThumbs) || undefined}\n    >\n      <header className=\"leaf-image-viewer__header\">\n        <div className=\"leaf-image-viewer__title\">\n          <span>{item?.alt || t('image.imagePreview')}</span>\n          <span className=\"leaf-image-viewer__count\" aria-live=\"polite\">\n            {currentIndex + 1} / {items.length}\n          </span>\n        </div>\n        <div className=\"leaf-image-viewer__header-actions\">\n          {downloadable && item?.download !== false && (\n            <Control\n              label={t('image.downloadImage')}\n              onClick={() => void download()}\n              disabled={downloading}\n            >\n              {downloading ? <Loading size=\"sm\" /> : <Download size={19} />}\n            </Control>\n          )}\n          <Control\n            label={fullscreen ? t('image.exitFullscreen') : t('image.enterFullscreen')}\n            disabled={!fullscreenControl || fullscreenControl.disabled}\n            onClick={() => (fullscreen ? fullscreenControl?.exit() : fullscreenControl?.enter())}\n          >\n            {fullscreen ? <Minimize2 size={19} /> : <Maximize2 size={19} />}\n          </Control>\n          <Control label={t('image.closePreview')} onClick={close}>\n            <X size={22} />\n          </Control>\n        </div>\n      </header>\n      {items.length > 1 && (\n        <>\n          <Control\n            className=\"leaf-image-viewer__previous\"\n            label={t('image.previousImage')}\n            disabled={prevDisabled}\n            onClick={() => prev()}\n          >\n            <ChevronLeft size={26} />\n          </Control>\n          <Control\n            className=\"leaf-image-viewer__next\"\n            label={t('image.nextImage')}\n            disabled={nextDisabled}\n            onClick={() => next()}\n          >\n            <ChevronRight size={26} />\n          </Control>\n        </>\n      )}\n      <footer className=\"leaf-image-viewer__footer\">\n        {failedDownload && (\n          <p role=\"alert\" className=\"leaf-image-viewer__error\">\n            {t('image.downloadFailedOpenTheOriginalImageToSaveIt')}{' '}\n            <a href={downloadUrl} target=\"_blank\" rel=\"noopener noreferrer\">\n              {t('image.openOriginal')}\n            </a>\n          </p>\n        )}\n        <div className=\"leaf-image-viewer__tools\">\n          <Control\n            label={t('image.zoomOut')}\n            disabled={!zoomControl || zoomControl.disabled || zoom <= 1}\n            onClick={() => zoomControl?.zoomOut()}\n          >\n            <ZoomOut size={18} />\n          </Control>\n          <button\n            type=\"button\"\n            className=\"leaf-image-viewer__zoom-level\"\n            onClick={() => zoomControl?.changeZoom(1)}\n            title={t('image.resetZoom')}\n          >\n            {Math.round(zoom * 100)}%\n          </button>\n          <Control\n            label={t('image.zoomIn')}\n            disabled={!zoomControl || zoomControl.disabled || zoom >= zoomControl.maxZoom}\n            onClick={() => zoomControl?.zoomIn()}\n          >\n            <ZoomIn size={18} />\n          </Control>\n          <Control\n            label={t('image.resetZoom')}\n            disabled={zoom <= 1}\n            onClick={() => zoomControl?.changeZoom(1)}\n          >\n            <RotateCcw size={17} />\n          </Control>\n          {hasThumbs && (\n            <>\n              <span className=\"leaf-image-viewer__tool-separator\" />\n              <Control\n                label={t('image.showThumbnails')}\n                active={showThumbs}\n                onClick={() => setShowThumbs((value) => !value)}\n              >\n                <PanelBottom size={18} />\n              </Control>\n            </>\n          )}\n        </div>\n        {hasThumbs && showThumbs && (\n          <div className=\"leaf-image-viewer__gallery\">\n            <Control\n              label={t('image.scrollThumbnailsBackward')}\n              onClick={() =>\n                strip.current?.scrollBy({\n                  left: -(strip.current.clientWidth * 0.7),\n                  behavior: motion ? 'smooth' : 'auto',\n                })\n              }\n            >\n              <ChevronLeft size={18} />\n            </Control>\n            <fieldset\n              className=\"leaf-image-viewer__thumbnails\"\n              ref={strip}\n              aria-label={t('image.imageList')}\n            >\n              {items.map((image, target) => (\n                <button\n                  type=\"button\"\n                  // biome-ignore lint/suspicious/noArrayIndexKey: Stateless thumbnails may intentionally repeat the same source URL.\n                  key={`${image.src}-${target}`}\n                  className=\"leaf-image-viewer__thumbnail\"\n                  data-index={target}\n                  aria-current={currentIndex === target || undefined}\n                  aria-label={format('image.viewImage', {\n                    index: target + 1,\n                    alt: image.alt ? `: ${image.alt}` : '',\n                  })}\n                  title={image.alt || String(target + 1)}\n                  tabIndex={currentIndex === target ? 0 : -1}\n                  onClick={() => choose(target)}\n                  onKeyDown={(event) => {\n                    if (!['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) return;\n                    event.preventDefault();\n                    event.stopPropagation();\n                    const position =\n                      event.key === 'Home'\n                        ? 0\n                        : event.key === 'End'\n                          ? items.length - 1\n                          : Math.max(\n                              0,\n                              Math.min(\n                                items.length - 1,\n                                target + (event.key === 'ArrowRight' ? 1 : -1),\n                              ),\n                            );\n                    choose(position);\n                    strip.current\n                      ?.querySelector<HTMLButtonElement>(`[data-index=\"${position}\"]`)\n                      ?.focus();\n                  }}\n                >\n                  <img\n                    src={image.thumbnailSrc ?? image.src}\n                    alt=\"\"\n                    loading=\"lazy\"\n                    draggable={false}\n                  />\n                  <span>{target + 1}</span>\n                </button>\n              ))}\n            </fieldset>\n            <Control\n              label={t('image.scrollThumbnailsForward')}\n              onClick={() =>\n                strip.current?.scrollBy({\n                  left: strip.current.clientWidth * 0.7,\n                  behavior: motion ? 'smooth' : 'auto',\n                })\n              }\n            >\n              <ChevronRight size={18} />\n            </Control>\n          </div>\n        )}\n      </footer>\n    </div>\n  );\n}\nfunction Viewer({\n  items,\n  open,\n  index = 0,\n  onClose,\n  onIndexChange,\n  thumbnails = true,\n  downloadable = false,\n}: ImagePreviewProps) {\n  const [root, setRoot] = useState<HTMLDivElement | null>(null);\n  const [zoomControl, setZoomControl] = useState<ZoomRef | null>(null);\n  const [fullscreenControl, setFullscreenControl] = useState<FullscreenRef | null>(null);\n  const [slides, setSlides] = useState(() => items.map((item) => ({ ...item })));\n  // A new array with the same images must not reset the carousel's navigation animation.\n  if (\n    items.length !== slides.length ||\n    items.some((item, position) => {\n      const slide = slides[position];\n      return (\n        !slide ||\n        item.src !== slide.src ||\n        item.alt !== slide.alt ||\n        item.width !== slide.width ||\n        item.height !== slide.height ||\n        item.thumbnailSrc !== slide.thumbnailSrc ||\n        item.download !== slide.download ||\n        item.downloadName !== slide.downloadName\n      );\n    })\n  ) {\n    setSlides(items.map((item) => ({ ...item })));\n  }\n  const t = useText();\n  const format = useFormattedText();\n  const motion = useMotionEnabled();\n  const duration = root && motion ? motionDuration(root) : 0;\n  return (\n    <div ref={setRoot} className=\"leaf-image-viewer\">\n      {root && (\n        <Lightbox\n          open={open && items.length > 0}\n          close={onClose}\n          slides={slides}\n          index={Math.max(0, Math.min(index, items.length - 1))}\n          portal={{ root }}\n          plugins={[Zoom, Fullscreen]}\n          className=\"leaf-image-viewer__lightbox\"\n          carousel={{ finite: true, padding: 0, spacing: 24 }}\n          animation={{\n            fade: duration * 1.2,\n            swipe: duration * 1.6,\n            navigation: duration * 1.6,\n            zoom: duration,\n          }}\n          zoom={{ ref: setZoomControl, maxZoomPixelRatio: 3, scrollToZoom: true }}\n          fullscreen={{ ref: setFullscreenControl }}\n          controller={{ closeOnBackdropClick: true }}\n          toolbar={{ buttons: [] }}\n          render={{\n            buttonClose: () => null,\n            buttonPrev: () => null,\n            buttonNext: () => null,\n            buttonZoom: () => null,\n            buttonFullscreen: () => null,\n            iconLoading: () => <Loading />,\n            iconError: () => <ImageOff size={32} />,\n            controls: () => (\n              <ViewerChrome\n                items={items}\n                thumbnails={thumbnails}\n                downloadable={downloadable}\n                zoomControl={zoomControl}\n                fullscreenControl={fullscreenControl}\n              />\n            ),\n          }}\n          labels={{\n            Lightbox: t('image.imagePreview'),\n            'Photo gallery': t('image.imageList'),\n            Slide: t('image.image'),\n            '{index} of {total}': format('image.position', {\n              index: index + 1,\n              total: items.length,\n            }),\n            Close: t('image.closePreview'),\n          }}\n          on={{\n            view: ({ index: next }) => {\n              if (next !== index) onIndexChange?.(next);\n            },\n          }}\n          styles={{\n            root: {\n              '--yarl__color_backdrop': 'rgba(0,0,0,.92)',\n              zIndex: 'var(--leaf-z-index-modal)',\n            },\n          }}\n        />\n      )}\n    </div>\n  );\n}\n"],"names":["ImageViewer","props","ScopedPortal","Viewer","Control","label","children","active","disabled","onClick","className","ViewerChrome","items","thumbnails","downloadable","zoomControl","fullscreenControl","t","useText","format","useFormattedText","motion","useMotionEnabled","currentIndex","useLightboxState","prev","next","close","useController","prevDisabled","nextDisabled","useNavigationState","strip","useRef","showThumbs","setShowThumbs","useState","failedDownload","setFailedDownload","downloading","setDownloading","item","hasThumbs","zoom","fullscreen","downloadUrl","useEffect","root","selected","choose","target","difference","download","address","response","fetch","Error","url","URL","anchor","document","setTimeout","undefined","Loading","Download","Minimize2","Maximize2","X","ChevronLeft","ChevronRight","ZoomOut","Math","ZoomIn","RotateCcw","value","PanelBottom","image","String","event","position","open","index","onClose","onIndexChange","setRoot","setZoomControl","setFullscreenControl","slides","setSlides","slide","duration","motionDuration","Lightbox","Zoom","Fullscreen","ImageOff"],"mappings":"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"}
+{"version":3,"file":"image/viewer.js","sources":["../../../../../src/image/viewer.tsx"],"sourcesContent":["import {\n  ChevronLeft,\n  ChevronRight,\n  Download,\n  ImageOff,\n  Maximize2,\n  Minimize2,\n  PanelBottom,\n  RotateCcw,\n  X,\n  ZoomIn,\n  ZoomOut,\n} from 'lucide-react';\nimport { type ReactNode, useEffect, useRef, useState } from 'react';\nimport Lightbox, {\n  type FullscreenRef,\n  useController,\n  useLightboxState,\n  useNavigationState,\n  type ZoomRef,\n} from 'yet-another-react-lightbox';\nimport Fullscreen from 'yet-another-react-lightbox/plugins/fullscreen';\nimport Zoom from 'yet-another-react-lightbox/plugins/zoom';\nimport { LoadingControl as Loading } from '../loading/loading';\nimport { ScrollbarControl } from '../scrollbar/scrollbar';\nimport { motionDuration, useMotionEnabled } from '../shared/motion';\nimport { ScopedPortal } from '../shared/scoped-portal';\nimport { useFormattedText } from '../shared/use-formatted-text';\nimport { useText } from '../shared/use-text';\nimport type { ImagePreviewItem, ImagePreviewProps } from './image';\n\nexport function ImageViewer(props: ImagePreviewProps) {\n  return (\n    <ScopedPortal>\n      <Viewer {...props} />\n    </ScopedPortal>\n  );\n}\nfunction Control({\n  label,\n  children,\n  active,\n  disabled,\n  onClick,\n  className = '',\n}: {\n  label: string;\n  children: ReactNode;\n  active?: boolean;\n  disabled?: boolean;\n  onClick: () => void;\n  className?: string;\n}) {\n  return (\n    <button\n      type=\"button\"\n      className={`leaf-image-viewer__control ${className}`}\n      aria-label={label}\n      title={label}\n      aria-pressed={active}\n      disabled={disabled}\n      onClick={onClick}\n    >\n      {children}\n    </button>\n  );\n}\nfunction ViewerChrome({\n  items,\n  thumbnails,\n  downloadable,\n  zoomControl,\n  fullscreenControl,\n}: {\n  items: readonly ImagePreviewItem[];\n  thumbnails: boolean;\n  downloadable: boolean;\n  zoomControl: ZoomRef | null;\n  fullscreenControl: FullscreenRef | null;\n}) {\n  const t = useText();\n  const format = useFormattedText();\n  const motion = useMotionEnabled();\n  const { currentIndex } = useLightboxState();\n  const { prev, next, close } = useController();\n  const { prevDisabled, nextDisabled } = useNavigationState();\n  const strip = useRef<HTMLDivElement>(null);\n  const [showThumbs, setShowThumbs] = useState(thumbnails);\n  const [failedDownload, setFailedDownload] = useState(false);\n  const [downloading, setDownloading] = useState(false);\n  const item = items[currentIndex];\n  const hasThumbs = thumbnails && items.length > 1;\n  const zoom = zoomControl?.zoom ?? 1;\n  const fullscreen = fullscreenControl?.fullscreen ?? false;\n  const downloadUrl = typeof item?.download === 'string' ? item.download : item?.src;\n  useEffect(() => setShowThumbs(thumbnails), [thumbnails]);\n  useEffect(() => {\n    setFailedDownload(false);\n    if (!showThumbs) return;\n    const root = strip.current;\n    const selected = root?.querySelector<HTMLElement>(`[data-index=\"${currentIndex}\"]`);\n    if (root && selected)\n      root.scrollTo({\n        left: selected.offsetLeft - root.offsetLeft - (root.clientWidth - selected.clientWidth) / 2,\n        behavior: motion ? 'smooth' : 'auto',\n      });\n  }, [currentIndex, showThumbs, motion]);\n  const choose = (target: number) => {\n    const difference = target - currentIndex;\n    if (difference > 0) next({ count: difference });\n    else if (difference < 0) prev({ count: -difference });\n  };\n  const download = async () => {\n    if (!item || downloading) return;\n    setDownloading(true);\n    setFailedDownload(false);\n    try {\n      const address = typeof item.download === 'string' ? item.download : item.src;\n      const response = await fetch(address);\n      if (!response.ok) throw new Error('Download failed');\n      const url = URL.createObjectURL(await response.blob());\n      const anchor = document.createElement('a');\n      anchor.href = url;\n      anchor.download = item.downloadName || address.split(/[?#]/)[0]?.split('/').pop() || 'image';\n      anchor.click();\n      setTimeout(() => URL.revokeObjectURL(url), 1000);\n    } catch {\n      setFailedDownload(true);\n    } finally {\n      setDownloading(false);\n    }\n  };\n  return (\n    <div\n      className=\"leaf-image-viewer__chrome\"\n      data-thumbnails={(hasThumbs && showThumbs) || undefined}\n    >\n      <header className=\"leaf-image-viewer__header\">\n        <div className=\"leaf-image-viewer__title\">\n          <span>{item?.alt || t('image.imagePreview')}</span>\n          <span className=\"leaf-image-viewer__count\" aria-live=\"polite\">\n            {currentIndex + 1} / {items.length}\n          </span>\n        </div>\n        <div className=\"leaf-image-viewer__header-actions\">\n          {downloadable && item?.download !== false && (\n            <Control\n              label={t('image.downloadImage')}\n              onClick={() => void download()}\n              disabled={downloading}\n            >\n              {downloading ? <Loading size=\"sm\" /> : <Download size={19} />}\n            </Control>\n          )}\n          <Control\n            label={fullscreen ? t('image.exitFullscreen') : t('image.enterFullscreen')}\n            disabled={!fullscreenControl || fullscreenControl.disabled}\n            onClick={() => (fullscreen ? fullscreenControl?.exit() : fullscreenControl?.enter())}\n          >\n            {fullscreen ? <Minimize2 size={19} /> : <Maximize2 size={19} />}\n          </Control>\n          <Control label={t('image.closePreview')} onClick={close}>\n            <X size={22} />\n          </Control>\n        </div>\n      </header>\n      {items.length > 1 && (\n        <>\n          <Control\n            className=\"leaf-image-viewer__previous\"\n            label={t('image.previousImage')}\n            disabled={prevDisabled}\n            onClick={() => prev()}\n          >\n            <ChevronLeft size={26} />\n          </Control>\n          <Control\n            className=\"leaf-image-viewer__next\"\n            label={t('image.nextImage')}\n            disabled={nextDisabled}\n            onClick={() => next()}\n          >\n            <ChevronRight size={26} />\n          </Control>\n        </>\n      )}\n      <footer className=\"leaf-image-viewer__footer\">\n        {failedDownload && (\n          <p role=\"alert\" className=\"leaf-image-viewer__error\">\n            {t('image.downloadFailedOpenTheOriginalImageToSaveIt')}{' '}\n            <a href={downloadUrl} target=\"_blank\" rel=\"noopener noreferrer\">\n              {t('image.openOriginal')}\n            </a>\n          </p>\n        )}\n        <div className=\"leaf-image-viewer__tools\">\n          <Control\n            label={t('image.zoomOut')}\n            disabled={!zoomControl || zoomControl.disabled || zoom <= 1}\n            onClick={() => zoomControl?.zoomOut()}\n          >\n            <ZoomOut size={18} />\n          </Control>\n          <button\n            type=\"button\"\n            className=\"leaf-image-viewer__zoom-level\"\n            onClick={() => zoomControl?.changeZoom(1)}\n            title={t('image.resetZoom')}\n          >\n            {Math.round(zoom * 100)}%\n          </button>\n          <Control\n            label={t('image.zoomIn')}\n            disabled={!zoomControl || zoomControl.disabled || zoom >= zoomControl.maxZoom}\n            onClick={() => zoomControl?.zoomIn()}\n          >\n            <ZoomIn size={18} />\n          </Control>\n          <Control\n            label={t('image.resetZoom')}\n            disabled={zoom <= 1}\n            onClick={() => zoomControl?.changeZoom(1)}\n          >\n            <RotateCcw size={17} />\n          </Control>\n          {hasThumbs && (\n            <>\n              <span className=\"leaf-image-viewer__tool-separator\" />\n              <Control\n                label={t('image.showThumbnails')}\n                active={showThumbs}\n                onClick={() => setShowThumbs((value) => !value)}\n              >\n                <PanelBottom size={18} />\n              </Control>\n            </>\n          )}\n        </div>\n        {hasThumbs && showThumbs && (\n          <div className=\"leaf-image-viewer__gallery\">\n            <Control\n              label={t('image.scrollThumbnailsBackward')}\n              onClick={() =>\n                strip.current?.scrollBy({\n                  left: -(strip.current.clientWidth * 0.7),\n                  behavior: motion ? 'smooth' : 'auto',\n                })\n              }\n            >\n              <ChevronLeft size={18} />\n            </Control>\n            <ScrollbarControl\n              className=\"leaf-image-viewer__strip\"\n              contentClassName=\"leaf-image-viewer__thumbnails\"\n              ref={strip}\n              orientation=\"horizontal\"\n              role=\"group\"\n              tabIndex={-1}\n              scrollbarTabIndex={-1}\n              aria-label={t('image.imageList')}\n            >\n              {items.map((image, target) => (\n                <button\n                  type=\"button\"\n                  // biome-ignore lint/suspicious/noArrayIndexKey: Stateless thumbnails may intentionally repeat the same source URL.\n                  key={`${image.src}-${target}`}\n                  className=\"leaf-image-viewer__thumbnail\"\n                  data-index={target}\n                  aria-current={currentIndex === target || undefined}\n                  aria-label={format('image.viewImage', {\n                    index: target + 1,\n                    alt: image.alt ? `: ${image.alt}` : '',\n                  })}\n                  title={image.alt || String(target + 1)}\n                  tabIndex={currentIndex === target ? 0 : -1}\n                  onClick={() => choose(target)}\n                  onKeyDown={(event) => {\n                    if (!['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) return;\n                    event.preventDefault();\n                    event.stopPropagation();\n                    const position =\n                      event.key === 'Home'\n                        ? 0\n                        : event.key === 'End'\n                          ? items.length - 1\n                          : Math.max(\n                              0,\n                              Math.min(\n                                items.length - 1,\n                                target + (event.key === 'ArrowRight' ? 1 : -1),\n                              ),\n                            );\n                    choose(position);\n                    strip.current\n                      ?.querySelector<HTMLButtonElement>(`[data-index=\"${position}\"]`)\n                      ?.focus();\n                  }}\n                >\n                  <img\n                    src={image.thumbnailSrc ?? image.src}\n                    alt=\"\"\n                    loading=\"lazy\"\n                    draggable={false}\n                  />\n                  <span>{target + 1}</span>\n                </button>\n              ))}\n            </ScrollbarControl>\n            <Control\n              label={t('image.scrollThumbnailsForward')}\n              onClick={() =>\n                strip.current?.scrollBy({\n                  left: strip.current.clientWidth * 0.7,\n                  behavior: motion ? 'smooth' : 'auto',\n                })\n              }\n            >\n              <ChevronRight size={18} />\n            </Control>\n          </div>\n        )}\n      </footer>\n    </div>\n  );\n}\nfunction Viewer({\n  items,\n  open,\n  index = 0,\n  onClose,\n  onIndexChange,\n  thumbnails = true,\n  downloadable = false,\n}: ImagePreviewProps) {\n  const [root, setRoot] = useState<HTMLDivElement | null>(null);\n  const [zoomControl, setZoomControl] = useState<ZoomRef | null>(null);\n  const [fullscreenControl, setFullscreenControl] = useState<FullscreenRef | null>(null);\n  const [slides, setSlides] = useState(() => items.map((item) => ({ ...item })));\n  // A new array with the same images must not reset the carousel's navigation animation.\n  if (\n    items.length !== slides.length ||\n    items.some((item, position) => {\n      const slide = slides[position];\n      return (\n        !slide ||\n        item.src !== slide.src ||\n        item.alt !== slide.alt ||\n        item.width !== slide.width ||\n        item.height !== slide.height ||\n        item.thumbnailSrc !== slide.thumbnailSrc ||\n        item.download !== slide.download ||\n        item.downloadName !== slide.downloadName\n      );\n    })\n  ) {\n    setSlides(items.map((item) => ({ ...item })));\n  }\n  const t = useText();\n  const format = useFormattedText();\n  const motion = useMotionEnabled();\n  const duration = root && motion ? motionDuration(root) : 0;\n  return (\n    <div ref={setRoot} className=\"leaf-image-viewer\">\n      {root && (\n        <Lightbox\n          open={open && items.length > 0}\n          close={onClose}\n          slides={slides}\n          index={Math.max(0, Math.min(index, items.length - 1))}\n          portal={{ root }}\n          plugins={[Zoom, Fullscreen]}\n          className=\"leaf-image-viewer__lightbox\"\n          carousel={{ finite: true, padding: 0, spacing: 24 }}\n          animation={{\n            fade: duration * 1.2,\n            swipe: duration * 1.6,\n            navigation: duration * 1.6,\n            zoom: duration,\n          }}\n          zoom={{ ref: setZoomControl, maxZoomPixelRatio: 3, scrollToZoom: true }}\n          fullscreen={{ ref: setFullscreenControl }}\n          controller={{ closeOnBackdropClick: true }}\n          toolbar={{ buttons: [] }}\n          render={{\n            buttonClose: () => null,\n            buttonPrev: () => null,\n            buttonNext: () => null,\n            buttonZoom: () => null,\n            buttonFullscreen: () => null,\n            iconLoading: () => <Loading />,\n            iconError: () => <ImageOff size={32} />,\n            controls: () => (\n              <ViewerChrome\n                items={items}\n                thumbnails={thumbnails}\n                downloadable={downloadable}\n                zoomControl={zoomControl}\n                fullscreenControl={fullscreenControl}\n              />\n            ),\n          }}\n          labels={{\n            Lightbox: t('image.imagePreview'),\n            'Photo gallery': t('image.imageList'),\n            Slide: t('image.image'),\n            '{index} of {total}': format('image.position', {\n              index: index + 1,\n              total: items.length,\n            }),\n            Close: t('image.closePreview'),\n          }}\n          on={{\n            view: ({ index: next }) => {\n              if (next !== index) onIndexChange?.(next);\n            },\n          }}\n          styles={{\n            root: {\n              '--yarl__color_backdrop': 'rgba(0,0,0,.92)',\n              zIndex: 'var(--leaf-z-index-modal)',\n            },\n          }}\n        />\n      )}\n    </div>\n  );\n}\n"],"names":["ImageViewer","props","ScopedPortal","Viewer","Control","label","children","active","disabled","onClick","className","ViewerChrome","items","thumbnails","downloadable","zoomControl","fullscreenControl","t","useText","format","useFormattedText","motion","useMotionEnabled","currentIndex","useLightboxState","prev","next","close","useController","prevDisabled","nextDisabled","useNavigationState","strip","useRef","showThumbs","setShowThumbs","useState","failedDownload","setFailedDownload","downloading","setDownloading","item","hasThumbs","zoom","fullscreen","downloadUrl","useEffect","root","selected","choose","target","difference","download","address","response","fetch","Error","url","URL","anchor","document","setTimeout","undefined","Loading","Download","Minimize2","Maximize2","X","ChevronLeft","ChevronRight","ZoomOut","Math","ZoomIn","RotateCcw","value","PanelBottom","ScrollbarControl","image","String","event","position","open","index","onClose","onIndexChange","setRoot","setZoomControl","setFullscreenControl","slides","setSlides","slide","duration","motionDuration","Lightbox","Zoom","Fullscreen","ImageOff"],"mappings":"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"}

package/dist/esm/browser/modules/index.js

@@ -45,7 +45,7 @@ export { Loading } from "./loading/index.js";
 export { LoadingBar, LoadingBarProvider, useLoadingBar } from "./loadingbar/index.js";
 export { Masonry } from "./masonry/index.js";
 export { Mentions } from "./mentions/index.js";
-export { Menu } from "./menu/index.js";
+export { Menu, MenuGroup } from "./menu/index.js";
 export { Message, MessageProvider, useMessage } from "./message/index.js";
 export { Modal } from "./modal/index.js";
 export { Notification, NotificationProvider, useNotification } from "./notification/index.js";
@@ -59,7 +59,6 @@ export { Rate } from "./rate/index.js";
 export { Result } from "./result/index.js";
 export { ScrollArea } from "./scrollarea/index.js";
 export { Scrollbar } from "./scrollbar/index.js";
-export { Segmented } from "./segmented/index.js";
 export { Select } from "./select/index.js";
 export { Skeleton } from "./skeleton/index.js";
 export { Slider } from "./slider/index.js";

package/dist/esm/browser/modules/layout/layout.js

@@ -5,6 +5,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, useEffect, useState } from "react";
 import { ButtonControl } from "../button/button.js";
 import { useComponentProps } from "../config-provider/component-defaults.js";
+import { ScrollbarControl } from "../scrollbar/scrollbar.js";
 import { classes } from "../shared/classes.js";
 import { useControllable } from "../shared/use-controllable.js";
 import { useText } from "../shared/use-text.js";
@@ -42,8 +43,10 @@ const layout_LayoutSider = /*#__PURE__*/ forwardRef(function(rawProps, ref) {
             ...style
         },
         children: [
-            /*#__PURE__*/ jsx("div", {
+            /*#__PURE__*/ jsx(ScrollbarControl, {
                 className: "leaf-layout__sider-content",
+                role: "presentation",
+                tabIndex: -1,
                 children: children
             }),
             collapsible && !narrow && /*#__PURE__*/ jsx(ButtonControl, {

package/dist/esm/browser/modules/layout/layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"layout/layout.js","sources":["../../../../../src/layout/layout.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type ReactNode, useEffect, useState } from 'react';\nimport { ButtonControl } from '../button/button';\nimport { useComponentProps } from '../config-provider/component-defaults';\nimport { classes } from '../shared/classes';\nimport { useControllable } from '../shared/use-controllable';\nimport { useText } from '../shared/use-text';\n\nexport interface LayoutProps extends HTMLAttributes<HTMLDivElement> {\n  direction?: 'horizontal' | 'vertical';\n}\nconst LayoutRoot = forwardRef<HTMLDivElement, LayoutProps>(function Layout(rawProps, ref) {\n  const { direction = 'vertical', className, ...props } = useComponentProps('Layout', rawProps);\n  return (\n    <div\n      {...props}\n      ref={ref}\n      className={classes('leaf-layout', `leaf-layout--${direction}`, className)}\n    />\n  );\n});\nexport interface LayoutSiderProps extends HTMLAttributes<HTMLElement> {\n  width?: number | string;\n  collapsedWidth?: number | string;\n  collapsed?: boolean;\n  defaultCollapsed?: boolean;\n  collapsible?: boolean;\n  breakpoint?: number;\n  onCollapse?: (collapsed: boolean) => void;\n  trigger?: ReactNode;\n}\nexport const LayoutSider = forwardRef<HTMLElement, LayoutSiderProps>(function LayoutSider(\n  rawProps: LayoutSiderProps,\n  ref,\n) {\n  const {\n    width = 220,\n    collapsedWidth = 64,\n    collapsed,\n    defaultCollapsed = false,\n    collapsible = false,\n    breakpoint,\n    onCollapse,\n    trigger,\n    className,\n    children,\n    style,\n    ...props\n  } = useComponentProps('LayoutSider', rawProps);\n  const t = useText();\n  const [compact, setCompact] = useControllable(collapsed, defaultCollapsed, onCollapse);\n  const [narrow, setNarrow] = useState(false);\n  useEffect(() => {\n    if (breakpoint === undefined) return;\n    const query = matchMedia(`(max-width: ${breakpoint}px)`);\n    const update = () => setNarrow(query.matches);\n    update();\n    query.addEventListener('change', update);\n    return () => query.removeEventListener('change', update);\n  }, [breakpoint]);\n  const folded = compact || narrow;\n  return (\n    <aside\n      {...props}\n      ref={ref}\n      className={classes('leaf-layout__sider', className)}\n      data-collapsed={folded || undefined}\n      style={{ width: folded ? collapsedWidth : width, ...style }}\n    >\n      <div className=\"leaf-layout__sider-content\">{children}</div>\n      {collapsible && !narrow && (\n        <ButtonControl\n          variant=\"ghost\"\n          size=\"sm\"\n          onClick={() => setCompact(!compact)}\n          aria-expanded={!folded}\n          aria-label={folded ? t('layout.expandSidebar') : t('layout.collapseSidebar')}\n        >\n          {trigger ?? (folded ? t('layout.expandSidebar') : t('layout.collapseSidebar'))}\n        </ButtonControl>\n      )}\n    </aside>\n  );\n});\nexport const LayoutHeader = forwardRef<HTMLElement, HTMLAttributes<HTMLElement>>(\n  function LayoutHeader(rawProps: HTMLAttributes<HTMLElement>, ref) {\n    const { className, ...props } = useComponentProps('LayoutHeader', rawProps);\n    return <header {...props} ref={ref} className={classes('leaf-layout__header', className)} />;\n  },\n);\nexport const LayoutContent = forwardRef<HTMLElement, HTMLAttributes<HTMLElement>>(\n  function LayoutContent(rawProps: HTMLAttributes<HTMLElement>, ref) {\n    const { className, ...props } = useComponentProps('LayoutContent', rawProps);\n    return <main {...props} ref={ref} className={classes('leaf-layout__content', className)} />;\n  },\n);\nexport const LayoutFooter = forwardRef<HTMLElement, HTMLAttributes<HTMLElement>>(\n  function LayoutFooter(rawProps: HTMLAttributes<HTMLElement>, ref) {\n    const { className, ...props } = useComponentProps('LayoutFooter', rawProps);\n    return <footer {...props} ref={ref} className={classes('leaf-layout__footer', className)} />;\n  },\n);\nexport const Layout = Object.assign(LayoutRoot, {\n  Header: LayoutHeader,\n  Sider: LayoutSider,\n  Content: LayoutContent,\n  Footer: LayoutFooter,\n});\n"],"names":["LayoutRoot","forwardRef","rawProps","ref","direction","className","props","useComponentProps","classes","LayoutSider","width","collapsedWidth","collapsed","defaultCollapsed","collapsible","breakpoint","onCollapse","trigger","children","style","t","useText","compact","setCompact","useControllable","narrow","setNarrow","useState","useEffect","undefined","query","matchMedia","update","folded","ButtonControl","LayoutHeader","LayoutContent","LayoutFooter","Layout","Object"],"mappings":";;;;;;;;;;AAUA,MAAMA,aAAa,WAAHA,GAAGC,WAAwC,SAAgBC,QAAQ,EAAEC,GAAG;IACtF,MAAM,EAAEC,YAAY,UAAU,EAAEC,SAAS,EAAE,GAAGC,OAAO,GAAGC,kBAAkB,UAAUL;IACpF,OAAO,WAAP,GACE,IAAC;QACE,GAAGI,KAAK;QACT,KAAKH;QACL,WAAWK,QAAQ,eAAe,CAAC,aAAa,EAAEJ,WAAW,EAAEC;;AAGrE;AAWO,MAAMI,qBAAc,WAAHA,GAAGR,WAA0C,SACnEC,QAA0B,EAC1BC,GAAG;IAEH,MAAM,EACJO,QAAQ,GAAG,EACXC,iBAAiB,EAAE,EACnBC,SAAS,EACTC,mBAAmB,KAAK,EACxBC,cAAc,KAAK,EACnBC,UAAU,EACVC,UAAU,EACVC,OAAO,EACPZ,SAAS,EACTa,QAAQ,EACRC,KAAK,EACL,GAAGb,OACJ,GAAGC,kBAAkB,eAAeL;IACrC,MAAMkB,IAAIC;IACV,MAAM,CAACC,SAASC,WAAW,GAAGC,gBAAgBZ,WAAWC,kBAAkBG;IAC3E,MAAM,CAACS,QAAQC,UAAU,GAAGC,SAAS;IACrCC,UAAU;QACR,IAAIb,AAAec,WAAfd,YAA0B;QAC9B,MAAMe,QAAQC,WAAW,CAAC,YAAY,EAAEhB,WAAW,GAAG,CAAC;QACvD,MAAMiB,SAAS,IAAMN,UAAUI,MAAM,OAAO;QAC5CE;QACAF,MAAM,gBAAgB,CAAC,UAAUE;QACjC,OAAO,IAAMF,MAAM,mBAAmB,CAAC,UAAUE;IACnD,GAAG;QAACjB;KAAW;IACf,MAAMkB,SAASX,WAAWG;IAC1B,OAAO,WAAP,GACE,KAAC;QACE,GAAGnB,KAAK;QACT,KAAKH;QACL,WAAWK,QAAQ,sBAAsBH;QACzC,kBAAgB4B,UAAUJ;QAC1B,OAAO;YAAE,OAAOI,SAAStB,iBAAiBD;YAAO,GAAGS,KAAK;QAAC;;0BAE1D,IAAC;gBAAI,WAAU;0BAA8BD;;YAC5CJ,eAAe,CAACW,UAAU,WAAVA,GACf,IAACS,eAAaA;gBACZ,SAAQ;gBACR,MAAK;gBACL,SAAS,IAAMX,WAAW,CAACD;gBAC3B,iBAAe,CAACW;gBAChB,cAAYA,SAASb,EAAE,0BAA0BA,EAAE;0BAElDH,WAAYgB,CAAAA,SAASb,EAAE,0BAA0BA,EAAE,yBAAwB;;;;AAKtF;AACO,MAAMe,sBAAe,WAAHA,GAAGlC,WAC1B,SAAsBC,QAAqC,EAAEC,GAAG;IAC9D,MAAM,EAAEE,SAAS,EAAE,GAAGC,OAAO,GAAGC,kBAAkB,gBAAgBL;IAClE,OAAO,WAAP,GAAO,IAAC;QAAQ,GAAGI,KAAK;QAAE,KAAKH;QAAK,WAAWK,QAAQ,uBAAuBH;;AAChF;AAEK,MAAM+B,uBAAgB,WAAHA,GAAGnC,WAC3B,SAAuBC,QAAqC,EAAEC,GAAG;IAC/D,MAAM,EAAEE,SAAS,EAAE,GAAGC,OAAO,GAAGC,kBAAkB,iBAAiBL;IACnE,OAAO,WAAP,GAAO,IAAC;QAAM,GAAGI,KAAK;QAAE,KAAKH;QAAK,WAAWK,QAAQ,wBAAwBH;;AAC/E;AAEK,MAAMgC,sBAAe,WAAHA,GAAGpC,WAC1B,SAAsBC,QAAqC,EAAEC,GAAG;IAC9D,MAAM,EAAEE,SAAS,EAAE,GAAGC,OAAO,GAAGC,kBAAkB,gBAAgBL;IAClE,OAAO,WAAP,GAAO,IAAC;QAAQ,GAAGI,KAAK;QAAE,KAAKH;QAAK,WAAWK,QAAQ,uBAAuBH;;AAChF;AAEK,MAAMiC,gBAASC,OAAO,MAAM,CAACvC,YAAY;IAC9C,QAAQmC;IACR,OAAO1B;IACP,SAAS2B;IACT,QAAQC;AACV"}
+{"version":3,"file":"layout/layout.js","sources":["../../../../../src/layout/layout.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type ReactNode, useEffect, useState } from 'react';\nimport { ButtonControl } from '../button/button';\nimport { useComponentProps } from '../config-provider/component-defaults';\nimport { ScrollbarControl } from '../scrollbar/scrollbar';\nimport { classes } from '../shared/classes';\nimport { useControllable } from '../shared/use-controllable';\nimport { useText } from '../shared/use-text';\n\nexport interface LayoutProps extends HTMLAttributes<HTMLDivElement> {\n  direction?: 'horizontal' | 'vertical';\n}\nconst LayoutRoot = forwardRef<HTMLDivElement, LayoutProps>(function Layout(rawProps, ref) {\n  const { direction = 'vertical', className, ...props } = useComponentProps('Layout', rawProps);\n  return (\n    <div\n      {...props}\n      ref={ref}\n      className={classes('leaf-layout', `leaf-layout--${direction}`, className)}\n    />\n  );\n});\nexport interface LayoutSiderProps extends HTMLAttributes<HTMLElement> {\n  width?: number | string;\n  collapsedWidth?: number | string;\n  collapsed?: boolean;\n  defaultCollapsed?: boolean;\n  collapsible?: boolean;\n  breakpoint?: number;\n  onCollapse?: (collapsed: boolean) => void;\n  trigger?: ReactNode;\n}\nexport const LayoutSider = forwardRef<HTMLElement, LayoutSiderProps>(function LayoutSider(\n  rawProps: LayoutSiderProps,\n  ref,\n) {\n  const {\n    width = 220,\n    collapsedWidth = 64,\n    collapsed,\n    defaultCollapsed = false,\n    collapsible = false,\n    breakpoint,\n    onCollapse,\n    trigger,\n    className,\n    children,\n    style,\n    ...props\n  } = useComponentProps('LayoutSider', rawProps);\n  const t = useText();\n  const [compact, setCompact] = useControllable(collapsed, defaultCollapsed, onCollapse);\n  const [narrow, setNarrow] = useState(false);\n  useEffect(() => {\n    if (breakpoint === undefined) return;\n    const query = matchMedia(`(max-width: ${breakpoint}px)`);\n    const update = () => setNarrow(query.matches);\n    update();\n    query.addEventListener('change', update);\n    return () => query.removeEventListener('change', update);\n  }, [breakpoint]);\n  const folded = compact || narrow;\n  return (\n    <aside\n      {...props}\n      ref={ref}\n      className={classes('leaf-layout__sider', className)}\n      data-collapsed={folded || undefined}\n      style={{ width: folded ? collapsedWidth : width, ...style }}\n    >\n      <ScrollbarControl className=\"leaf-layout__sider-content\" role=\"presentation\" tabIndex={-1}>\n        {children}\n      </ScrollbarControl>\n      {collapsible && !narrow && (\n        <ButtonControl\n          variant=\"ghost\"\n          size=\"sm\"\n          onClick={() => setCompact(!compact)}\n          aria-expanded={!folded}\n          aria-label={folded ? t('layout.expandSidebar') : t('layout.collapseSidebar')}\n        >\n          {trigger ?? (folded ? t('layout.expandSidebar') : t('layout.collapseSidebar'))}\n        </ButtonControl>\n      )}\n    </aside>\n  );\n});\nexport const LayoutHeader = forwardRef<HTMLElement, HTMLAttributes<HTMLElement>>(\n  function LayoutHeader(rawProps: HTMLAttributes<HTMLElement>, ref) {\n    const { className, ...props } = useComponentProps('LayoutHeader', rawProps);\n    return <header {...props} ref={ref} className={classes('leaf-layout__header', className)} />;\n  },\n);\nexport const LayoutContent = forwardRef<HTMLElement, HTMLAttributes<HTMLElement>>(\n  function LayoutContent(rawProps: HTMLAttributes<HTMLElement>, ref) {\n    const { className, ...props } = useComponentProps('LayoutContent', rawProps);\n    return <main {...props} ref={ref} className={classes('leaf-layout__content', className)} />;\n  },\n);\nexport const LayoutFooter = forwardRef<HTMLElement, HTMLAttributes<HTMLElement>>(\n  function LayoutFooter(rawProps: HTMLAttributes<HTMLElement>, ref) {\n    const { className, ...props } = useComponentProps('LayoutFooter', rawProps);\n    return <footer {...props} ref={ref} className={classes('leaf-layout__footer', className)} />;\n  },\n);\nexport const Layout = Object.assign(LayoutRoot, {\n  Header: LayoutHeader,\n  Sider: LayoutSider,\n  Content: LayoutContent,\n  Footer: LayoutFooter,\n});\n"],"names":["LayoutRoot","forwardRef","rawProps","ref","direction","className","props","useComponentProps","classes","LayoutSider","width","collapsedWidth","collapsed","defaultCollapsed","collapsible","breakpoint","onCollapse","trigger","children","style","t","useText","compact","setCompact","useControllable","narrow","setNarrow","useState","useEffect","undefined","query","matchMedia","update","folded","ScrollbarControl","ButtonControl","LayoutHeader","LayoutContent","LayoutFooter","Layout","Object"],"mappings":"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"}

package/dist/esm/browser/modules/mentions/mentions.js

@@ -14,7 +14,7 @@ const defaultPrefixes = [
     '@'
 ];
 const mentions_Mentions = /*#__PURE__*/ forwardRef(function(rawProps, ref) {
-    const { value, defaultValue = '', onChange, onSearch, onSelect, options, prefixes = defaultPrefixes, split = ' ', loading, notFoundContent, popupPlacement, popupClassName, popupStyle, popupRender, getPopupContainer, ...props } = useComponentProps('Mentions', rawProps);
+    const { value, defaultValue = '', onChange, onSearch, onSelect, options, prefixes = defaultPrefixes, split = ' ', loading, notFoundContent, popupWidth = 'trigger', popupMaxWidth, popupPlacement, popupClassName, popupStyle, popupRender, getPopupContainer, ...props } = useComponentProps('Mentions', rawProps);
     const input = useRef(null), panel = useRef(null), merged = useMergedRef(input, ref), id = useId(), field = useFormField();
     const { messages } = useLeafConfig();
     const [text, setText] = useFieldValue(value, defaultValue, input, props.form);
@@ -115,7 +115,9 @@ const mentions_Mentions = /*#__PURE__*/ forwardRef(function(rawProps, ref) {
                 open: open,
                 triggerRef: input,
                 panelRef: panel,
-                matchWidth: true,
+                matchWidth: 'trigger' === popupWidth,
+                width: 'trigger' === popupWidth ? void 0 : 'auto' === popupWidth ? 'max-content' : popupWidth,
+                maxWidth: popupMaxWidth,
                 placement: popupPlacement,
                 style: popupStyle,
                 render: popupRender,

package/dist/esm/browser/modules/mentions/mentions.js.map

@@ -1 +1 @@
-{"version":3,"file":"mentions/mentions.js","sources":["../../../../../src/mentions/mentions.tsx"],"sourcesContent":["import { forwardRef, type ReactNode, useId, useRef, useState } from 'react';\nimport { useComponentProps } from '../config-provider/component-defaults';\nimport { useLeafConfig } from '../config-provider/context';\nimport { useFormField } from '../form/form';\nimport { classes } from '../shared/classes';\nimport { useFieldValue, useMergedRef } from '../shared/field';\nimport { FloatingPanel, type PopupOptions, useFloatingDismiss } from '../shared/floating';\nimport type { TextareaProps } from '../textarea';\nimport { TextareaControl as Textarea } from '../textarea/textarea';\nexport interface MentionOption {\n  value: string;\n  label?: ReactNode;\n  searchLabel?: string;\n  disabled?: boolean;\n}\nexport interface MentionsProps\n  extends Omit<TextareaProps, 'value' | 'defaultValue' | 'onChange' | 'onSelect'>,\n    PopupOptions {\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n  onSearch?: (query: string, prefix: string) => void;\n  onSelect?: (option: MentionOption, prefix: string) => void;\n  options: readonly MentionOption[];\n  prefixes?: readonly string[];\n  split?: string;\n  loading?: boolean;\n  notFoundContent?: ReactNode;\n}\nconst defaultPrefixes = ['@'];\nexport const Mentions = forwardRef<HTMLTextAreaElement, MentionsProps>(function Mentions(\n  rawProps: MentionsProps,\n  ref,\n) {\n  const {\n    value,\n    defaultValue = '',\n    onChange,\n    onSearch,\n    onSelect,\n    options,\n    prefixes = defaultPrefixes,\n    split = ' ',\n    loading,\n    notFoundContent,\n    popupPlacement,\n    popupClassName,\n    popupStyle,\n    popupRender,\n    getPopupContainer,\n    ...props\n  } = useComponentProps('Mentions', rawProps);\n  const input = useRef<HTMLTextAreaElement>(null),\n    panel = useRef<HTMLDivElement>(null),\n    merged = useMergedRef(input, ref),\n    id = useId(),\n    field = useFormField();\n  const { messages } = useLeafConfig();\n  const [text, setText] = useFieldValue(value, defaultValue, input, props.form);\n  const [match, setMatch] = useState<{\n      start: number;\n      end: number;\n      prefix: string;\n      query: string;\n    } | null>(null),\n    [active, setActive] = useState(0);\n  const disabled = props.disabled || field?.disabled || props.readOnly;\n  const find = (value: string, cursor: number) => {\n    const before = value.slice(0, cursor);\n    let found: typeof match = null;\n    for (const prefix of prefixes) {\n      const start = before.lastIndexOf(prefix);\n      if (start < 0 || (start > 0 && !/\\s/.test(before[start - 1] ?? ''))) continue;\n      const query = before.slice(start + prefix.length);\n      if (/\\s/.test(query)) continue;\n      if (!found || start > found.start) found = { start, end: cursor, prefix, query };\n    }\n    setMatch(found);\n    setActive(0);\n    if (found) onSearch?.(found.query, found.prefix);\n  };\n  const list = options.filter((option) =>\n    (option.searchLabel ?? (typeof option.label === 'string' ? option.label : option.value))\n      .toLocaleLowerCase()\n      .includes(match?.query.toLocaleLowerCase() ?? ''),\n  );\n  const select = (option: MentionOption) => {\n    if (!match || disabled || option.disabled) return;\n    const insertion = match.prefix + option.value + split;\n    const next = text.slice(0, match.start) + insertion + text.slice(match.end);\n    setText(next);\n    onChange?.(next);\n    onSelect?.(option, match.prefix);\n    setMatch(null);\n    requestAnimationFrame(() => {\n      input.current?.focus();\n      input.current?.setSelectionRange(\n        match.start + insertion.length,\n        match.start + insertion.length,\n      );\n    });\n  };\n  const open = !!match && !disabled;\n  useFloatingDismiss(open, () => setMatch(null), input, panel);\n  return (\n    <>\n      <Textarea\n        {...props}\n        className={classes('leaf-mentions', props.className)}\n        ref={merged}\n        value={text}\n        role=\"combobox\"\n        aria-autocomplete=\"list\"\n        aria-haspopup=\"listbox\"\n        aria-expanded={open}\n        aria-controls={open ? id : undefined}\n        aria-activedescendant={open && list[active] ? `${id}-${active}` : undefined}\n        onChange={(event) => {\n          setText(event.target.value);\n          onChange?.(event.target.value);\n          if (!(event.nativeEvent as InputEvent).isComposing)\n            find(event.target.value, event.target.selectionStart);\n        }}\n        onCompositionEnd={(event) => {\n          props.onCompositionEnd?.(event);\n          find(event.currentTarget.value, event.currentTarget.selectionStart);\n        }}\n        onClick={(event) => {\n          props.onClick?.(event);\n          find(event.currentTarget.value, event.currentTarget.selectionStart);\n        }}\n        onSelect={(event) => {\n          find(event.currentTarget.value, event.currentTarget.selectionStart);\n        }}\n        onKeyDown={(event) => {\n          props.onKeyDown?.(event);\n          if (event.defaultPrevented || event.nativeEvent.isComposing || !open) return;\n          if (['ArrowUp', 'ArrowDown'].includes(event.key)) {\n            event.preventDefault();\n            let next = active;\n            for (let i = 0; i < list.length; i++) {\n              next = (next + (event.key === 'ArrowDown' ? 1 : -1) + list.length) % list.length;\n              if (!list[next]?.disabled) break;\n            }\n            setActive(next);\n          }\n          const option = list[active];\n          if (event.key === 'Enter' && option) {\n            event.preventDefault();\n            select(option);\n          }\n          if (event.key === 'Escape') {\n            event.preventDefault();\n            setMatch(null);\n          }\n        }}\n      />\n      <FloatingPanel\n        open={open}\n        triggerRef={input}\n        panelRef={panel}\n        matchWidth\n        placement={popupPlacement}\n        style={popupStyle}\n        render={popupRender}\n        container={getPopupContainer}\n        className={classes('leaf-floating', 'leaf-mentions__panel', popupClassName)}\n        data-selection=\"candidate\"\n        role=\"listbox\"\n        id={id}\n        aria-label={messages.common.search}\n      >\n        {list.length ? (\n          list.map((option, index) => (\n            <button\n              key={option.value}\n              id={`${id}-${index}`}\n              type=\"button\"\n              role=\"option\"\n              aria-selected={active === index}\n              disabled={option.disabled}\n              tabIndex={-1}\n              className=\"leaf-floating__option\"\n              onMouseDown={(event) => event.preventDefault()}\n              onMouseEnter={() => !option.disabled && setActive(index)}\n              onClick={() => select(option)}\n            >\n              <span className=\"leaf-mentions__prefix\" aria-hidden=\"true\">\n                {match?.prefix}\n              </span>\n              {option.label ?? option.value}\n            </button>\n          ))\n        ) : (\n          <div className=\"leaf-floating__empty\">\n            {loading ? messages.common.loading : (notFoundContent ?? messages.select.empty)}\n          </div>\n        )}\n      </FloatingPanel>\n    </>\n  );\n});\n"],"names":["defaultPrefixes","Mentions","forwardRef","rawProps","ref","value","defaultValue","onChange","onSearch","onSelect","options","prefixes","split","loading","notFoundContent","popupPlacement","popupClassName","popupStyle","popupRender","getPopupContainer","props","useComponentProps","input","useRef","panel","merged","useMergedRef","id","useId","field","useFormField","messages","useLeafConfig","text","setText","useFieldValue","match","setMatch","useState","active","setActive","disabled","find","cursor","before","found","prefix","start","query","list","option","select","insertion","next","requestAnimationFrame","open","useFloatingDismiss","Textarea","classes","undefined","event","i","FloatingPanel","index"],"mappings":"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"}
+{"version":3,"file":"mentions/mentions.js","sources":["../../../../../src/mentions/mentions.tsx"],"sourcesContent":["import { forwardRef, type ReactNode, useId, useRef, useState } from 'react';\nimport { useComponentProps } from '../config-provider/component-defaults';\nimport { useLeafConfig } from '../config-provider/context';\nimport { useFormField } from '../form/form';\nimport { classes } from '../shared/classes';\nimport { useFieldValue, useMergedRef } from '../shared/field';\nimport { FloatingPanel, type PopupOptions, useFloatingDismiss } from '../shared/floating';\nimport type { TextareaProps } from '../textarea';\nimport { TextareaControl as Textarea } from '../textarea/textarea';\nexport interface MentionOption {\n  value: string;\n  label?: ReactNode;\n  searchLabel?: string;\n  disabled?: boolean;\n}\nexport interface MentionsProps\n  extends Omit<TextareaProps, 'value' | 'defaultValue' | 'onChange' | 'onSelect'>,\n    PopupOptions {\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n  onSearch?: (query: string, prefix: string) => void;\n  onSelect?: (option: MentionOption, prefix: string) => void;\n  options: readonly MentionOption[];\n  prefixes?: readonly string[];\n  split?: string;\n  loading?: boolean;\n  notFoundContent?: ReactNode;\n  popupWidth?: number | string;\n  popupMaxWidth?: number | string;\n}\nconst defaultPrefixes = ['@'];\nexport const Mentions = forwardRef<HTMLTextAreaElement, MentionsProps>(function Mentions(\n  rawProps: MentionsProps,\n  ref,\n) {\n  const {\n    value,\n    defaultValue = '',\n    onChange,\n    onSearch,\n    onSelect,\n    options,\n    prefixes = defaultPrefixes,\n    split = ' ',\n    loading,\n    notFoundContent,\n    popupWidth = 'trigger',\n    popupMaxWidth,\n    popupPlacement,\n    popupClassName,\n    popupStyle,\n    popupRender,\n    getPopupContainer,\n    ...props\n  } = useComponentProps('Mentions', rawProps);\n  const input = useRef<HTMLTextAreaElement>(null),\n    panel = useRef<HTMLDivElement>(null),\n    merged = useMergedRef(input, ref),\n    id = useId(),\n    field = useFormField();\n  const { messages } = useLeafConfig();\n  const [text, setText] = useFieldValue(value, defaultValue, input, props.form);\n  const [match, setMatch] = useState<{\n      start: number;\n      end: number;\n      prefix: string;\n      query: string;\n    } | null>(null),\n    [active, setActive] = useState(0);\n  const disabled = props.disabled || field?.disabled || props.readOnly;\n  const find = (value: string, cursor: number) => {\n    const before = value.slice(0, cursor);\n    let found: typeof match = null;\n    for (const prefix of prefixes) {\n      const start = before.lastIndexOf(prefix);\n      if (start < 0 || (start > 0 && !/\\s/.test(before[start - 1] ?? ''))) continue;\n      const query = before.slice(start + prefix.length);\n      if (/\\s/.test(query)) continue;\n      if (!found || start > found.start) found = { start, end: cursor, prefix, query };\n    }\n    setMatch(found);\n    setActive(0);\n    if (found) onSearch?.(found.query, found.prefix);\n  };\n  const list = options.filter((option) =>\n    (option.searchLabel ?? (typeof option.label === 'string' ? option.label : option.value))\n      .toLocaleLowerCase()\n      .includes(match?.query.toLocaleLowerCase() ?? ''),\n  );\n  const select = (option: MentionOption) => {\n    if (!match || disabled || option.disabled) return;\n    const insertion = match.prefix + option.value + split;\n    const next = text.slice(0, match.start) + insertion + text.slice(match.end);\n    setText(next);\n    onChange?.(next);\n    onSelect?.(option, match.prefix);\n    setMatch(null);\n    requestAnimationFrame(() => {\n      input.current?.focus();\n      input.current?.setSelectionRange(\n        match.start + insertion.length,\n        match.start + insertion.length,\n      );\n    });\n  };\n  const open = !!match && !disabled;\n  useFloatingDismiss(open, () => setMatch(null), input, panel);\n  return (\n    <>\n      <Textarea\n        {...props}\n        className={classes('leaf-mentions', props.className)}\n        ref={merged}\n        value={text}\n        role=\"combobox\"\n        aria-autocomplete=\"list\"\n        aria-haspopup=\"listbox\"\n        aria-expanded={open}\n        aria-controls={open ? id : undefined}\n        aria-activedescendant={open && list[active] ? `${id}-${active}` : undefined}\n        onChange={(event) => {\n          setText(event.target.value);\n          onChange?.(event.target.value);\n          if (!(event.nativeEvent as InputEvent).isComposing)\n            find(event.target.value, event.target.selectionStart);\n        }}\n        onCompositionEnd={(event) => {\n          props.onCompositionEnd?.(event);\n          find(event.currentTarget.value, event.currentTarget.selectionStart);\n        }}\n        onClick={(event) => {\n          props.onClick?.(event);\n          find(event.currentTarget.value, event.currentTarget.selectionStart);\n        }}\n        onSelect={(event) => {\n          find(event.currentTarget.value, event.currentTarget.selectionStart);\n        }}\n        onKeyDown={(event) => {\n          props.onKeyDown?.(event);\n          if (event.defaultPrevented || event.nativeEvent.isComposing || !open) return;\n          if (['ArrowUp', 'ArrowDown'].includes(event.key)) {\n            event.preventDefault();\n            let next = active;\n            for (let i = 0; i < list.length; i++) {\n              next = (next + (event.key === 'ArrowDown' ? 1 : -1) + list.length) % list.length;\n              if (!list[next]?.disabled) break;\n            }\n            setActive(next);\n          }\n          const option = list[active];\n          if (event.key === 'Enter' && option) {\n            event.preventDefault();\n            select(option);\n          }\n          if (event.key === 'Escape') {\n            event.preventDefault();\n            setMatch(null);\n          }\n        }}\n      />\n      <FloatingPanel\n        open={open}\n        triggerRef={input}\n        panelRef={panel}\n        matchWidth={popupWidth === 'trigger'}\n        width={\n          popupWidth === 'trigger' ? undefined : popupWidth === 'auto' ? 'max-content' : popupWidth\n        }\n        maxWidth={popupMaxWidth}\n        placement={popupPlacement}\n        style={popupStyle}\n        render={popupRender}\n        container={getPopupContainer}\n        className={classes('leaf-floating', 'leaf-mentions__panel', popupClassName)}\n        data-selection=\"candidate\"\n        role=\"listbox\"\n        id={id}\n        aria-label={messages.common.search}\n      >\n        {list.length ? (\n          list.map((option, index) => (\n            <button\n              key={option.value}\n              id={`${id}-${index}`}\n              type=\"button\"\n              role=\"option\"\n              aria-selected={active === index}\n              disabled={option.disabled}\n              tabIndex={-1}\n              className=\"leaf-floating__option\"\n              onMouseDown={(event) => event.preventDefault()}\n              onMouseEnter={() => !option.disabled && setActive(index)}\n              onClick={() => select(option)}\n            >\n              <span className=\"leaf-mentions__prefix\" aria-hidden=\"true\">\n                {match?.prefix}\n              </span>\n              {option.label ?? option.value}\n            </button>\n          ))\n        ) : (\n          <div className=\"leaf-floating__empty\">\n            {loading ? messages.common.loading : (notFoundContent ?? messages.select.empty)}\n          </div>\n        )}\n      </FloatingPanel>\n    </>\n  );\n});\n"],"names":["defaultPrefixes","Mentions","forwardRef","rawProps","ref","value","defaultValue","onChange","onSearch","onSelect","options","prefixes","split","loading","notFoundContent","popupWidth","popupMaxWidth","popupPlacement","popupClassName","popupStyle","popupRender","getPopupContainer","props","useComponentProps","input","useRef","panel","merged","useMergedRef","id","useId","field","useFormField","messages","useLeafConfig","text","setText","useFieldValue","match","setMatch","useState","active","setActive","disabled","find","cursor","before","found","prefix","start","query","list","option","select","insertion","next","requestAnimationFrame","open","useFloatingDismiss","Textarea","classes","undefined","event","i","FloatingPanel","index"],"mappings":"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"}

package/dist/esm/browser/modules/menu/index.js

@@ -1,2 +1,2 @@
 "use client";
-export { Menu } from "./menu.js";
+export { Menu, MenuGroup } from "./menu.js";

package/dist/esm/browser/modules/menu/menu.js

@@ -3,7 +3,7 @@ import '../../../styles/foundation.css';
 import '../../../styles/components/menu.css';
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { ChevronDown } from "lucide-react";
-import { useId, useRef, useState } from "react";
+import { forwardRef, useId, useRef, useState } from "react";
 import { useComponentProps } from "../config-provider/component-defaults.js";
 import { useLeafConfig } from "../config-provider/context.js";
 import { DropdownControl } from "../dropdown/dropdown.js";
@@ -12,6 +12,32 @@ import { inertProps } from "../shared/inert.js";
 import { useControllable } from "../shared/use-controllable.js";
 import { useText } from "../shared/use-text.js";
 import { useMovingIndicator } from "../tabs/use-moving-indicator.js";
+const menu_MenuGroupControl = /*#__PURE__*/ forwardRef(function({ title, children, className, ...props }, ref) {
+    const titleId = useId();
+    return /*#__PURE__*/ jsxs("div", {
+        role: "group",
+        "aria-labelledby": void 0 !== props['aria-label'] ? void 0 : titleId,
+        ...props,
+        ref: ref,
+        className: classes('leaf-menu__group', className),
+        children: [
+            /*#__PURE__*/ jsx("div", {
+                id: titleId,
+                className: "leaf-menu__group-label",
+                children: title
+            }),
+            children
+        ]
+    });
+});
+const menu_MenuGroup = /*#__PURE__*/ forwardRef(function(rawProps, ref) {
+    const props = useComponentProps('MenuGroup', rawProps);
+    return /*#__PURE__*/ jsx(menu_MenuGroupControl, {
+        ...props,
+        ref: ref,
+        className: classes('leaf-menu-group', props.className)
+    });
+});
 function MenuSubmenu({ open, id, label, children }) {
     const [visited, setVisited] = useState(open);
     if (open && !visited) setVisited(true);
@@ -74,16 +100,9 @@ function Menu(rawProps) {
             if ('divider' === item.type) return /*#__PURE__*/ jsx("hr", {
                 className: "leaf-menu__divider"
             }, item.key);
-            if ('group' === item.type) return /*#__PURE__*/ jsxs("fieldset", {
-                "aria-label": 'string' == typeof item.label ? item.label : void 0,
-                className: "leaf-menu__group",
-                children: [
-                    /*#__PURE__*/ jsx("legend", {
-                        className: "leaf-menu__group-label",
-                        children: item.label
-                    }),
-                    renderItems(item.children ?? [], depth)
-                ]
+            if ('group' === item.type) return /*#__PURE__*/ jsx(menu_MenuGroupControl, {
+                title: item.label,
+                children: renderItems(item.children ?? [], depth)
             }, item.key);
             const expanded = opened.includes(item.key);
             const hasChildren = Boolean(item.children?.length);
@@ -117,7 +136,7 @@ function Menu(rawProps) {
                 'aria-disabled': item.disabled || void 0,
                 'aria-expanded': hasChildren ? expanded : void 0,
                 'aria-controls': hasChildren ? `${id}-${item.key}` : void 0,
-                'data-selected': selected === item.key || void 0,
+                'data-selected': selected === item.key || ('horizontal' === mode || collapsed) && hasChildren && hasSelected(item) || void 0,
                 'data-active-parent': hasChildren && hasSelected(item) || void 0,
                 'data-danger': item.danger || void 0,
                 className: classes('leaf-menu__item', 'function' == typeof itemClassName ? itemClassName(item) : itemClassName),
@@ -143,6 +162,12 @@ function Menu(rawProps) {
                 className: "leaf-menu__entry",
                 children: /*#__PURE__*/ jsx(DropdownControl, {
                     items: convert(item.children ?? []),
+                    navigation: {
+                        selectedKey: selected,
+                        title: collapsed ? item.label : void 0
+                    },
+                    popupWidth: 208,
+                    popupPlacement: collapsed ? 'rtl' === direction ? 'left-start' : 'right-start' : 'bottom-start',
                     open: expanded,
                     disabled: item.disabled,
                     onOpenChange: (next)=>setOpened(next ? [
@@ -151,6 +176,14 @@ function Menu(rawProps) {
                     children: /*#__PURE__*/ jsx("button", {
                         ...common,
                         type: "button",
+                        onKeyDown: (event)=>{
+                            if (collapsed && event.key === ('rtl' === direction ? 'ArrowLeft' : 'ArrowRight')) {
+                                event.preventDefault();
+                                if (!item.disabled) setOpened([
+                                    item.key
+                                ]);
+                            }
+                        },
                         children: content
                     })
                 })
@@ -231,7 +264,13 @@ function Menu(rawProps) {
                         if (event.key === ('rtl' === direction ? 'ArrowLeft' : 'ArrowRight')) {
                             event.preventDefault();
                             if (item.children?.length) if (opened.includes(item.key)) {
-                                const child = item.children.find((entry)=>!entry.disabled && 'divider' !== entry.type);
+                                const firstEnabled = (entries)=>{
+                                    for (const entry of entries)if ('group' === entry.type) {
+                                        const child = firstEnabled(entry.children ?? []);
+                                        if (child) return child;
+                                    } else if (!entry.disabled && 'divider' !== entry.type) return entry;
+                                };
+                                const child = firstEnabled(item.children);
                                 if (child) focusItem(child.key);
                             } else setOpened([
                                 ...opened,
@@ -243,15 +282,15 @@ function Menu(rawProps) {
                             event.preventDefault();
                             if (opened.includes(item.key)) toggle(item.key);
                             else {
-                                const parentOf = (entries)=>{
+                                const parentOf = (entries, parentItem)=>{
                                     for (const entry of entries){
-                                        if (entry.children?.some((child)=>child.key === item.key)) return entry;
-                                        const parent = parentOf(entry.children ?? []);
+                                        if (entry.key === item.key) return parentItem;
+                                        const parent = parentOf(entry.children ?? [], 'group' === entry.type ? parentItem : entry);
                                         if (parent) return parent;
                                     }
                                 };
                                 const parent = parentOf(items);
-                                if (parent && 'group' !== parent.type) focusItem(parent.key);
+                                if (parent) focusItem(parent.key);
                             }
                             return;
                         }
@@ -274,6 +313,6 @@ function Menu(rawProps) {
         ]
     });
 }
-export { Menu };
+export { Menu, menu_MenuGroup as MenuGroup };
 
 //# sourceMappingURL=menu.js.map

package/dist/esm/browser/modules/menu/menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu/menu.js","sources":["../../../../../src/menu/menu.tsx"],"sourcesContent":["import { ChevronDown } from 'lucide-react';\nimport { type HTMLAttributes, type ReactNode, useId, useRef, useState } from 'react';\nimport { useComponentProps } from '../config-provider/component-defaults';\nimport { useLeafConfig } from '../config-provider/context';\nimport type { DropdownItem } from '../dropdown';\nimport { DropdownControl as Dropdown } from '../dropdown/dropdown';\nimport { classes } from '../shared/classes';\nimport { inertProps } from '../shared/inert';\nimport { useControllable } from '../shared/use-controllable';\nimport { useText } from '../shared/use-text';\nimport { useMovingIndicator } from '../tabs/use-moving-indicator';\nexport interface MenuItem {\n  key: string;\n  label: ReactNode;\n  icon?: ReactNode;\n  href?: string;\n  disabled?: boolean;\n  danger?: boolean;\n  children?: readonly MenuItem[];\n  type?: 'item' | 'group' | 'divider';\n}\nexport interface MenuProps extends Omit<HTMLAttributes<HTMLElement>, 'onSelect'> {\n  items: readonly MenuItem[];\n  mode?: 'vertical' | 'horizontal' | 'inline';\n  selectedKey?: string;\n  defaultSelectedKey?: string;\n  onSelect?: (key: string, item: MenuItem) => void;\n  openKeys?: readonly string[];\n  defaultOpenKeys?: readonly string[];\n  onOpenChange?: (keys: string[]) => void;\n  collapsed?: boolean;\n  itemRender?: (item: MenuItem, content: ReactNode) => ReactNode;\n  linkRender?: (item: MenuItem, link: ReactNode) => ReactNode;\n  itemClassName?: string | ((item: MenuItem) => string);\n}\nfunction MenuSubmenu({\n  open,\n  id,\n  label,\n  children,\n}: {\n  open: boolean;\n  id: string;\n  label?: string;\n  children: () => ReactNode;\n}) {\n  const [visited, setVisited] = useState(open);\n  if (open && !visited) setVisited(true);\n  return (\n    <div\n      id={id}\n      role=\"menu\"\n      className=\"leaf-menu__submenu\"\n      aria-label={label}\n      aria-hidden={!open || undefined}\n      {...inertProps(!open)}\n      data-open={open || undefined}\n    >\n      <div className=\"leaf-menu__submenu-inner\">\n        <div className=\"leaf-menu__submenu-content\">{visited && children()}</div>\n      </div>\n    </div>\n  );\n}\nexport function Menu(rawProps: MenuProps) {\n  const {\n    items,\n    mode = 'vertical',\n    selectedKey,\n    defaultSelectedKey = '',\n    onSelect,\n    openKeys,\n    defaultOpenKeys = [],\n    onOpenChange,\n    collapsed = false,\n    itemRender,\n    linkRender,\n    itemClassName,\n    className,\n    ...props\n  } = useComponentProps('Menu', rawProps);\n  const t = useText();\n  const { direction } = useLeafConfig();\n  const id = useId();\n  const root = useRef<HTMLElement>(null);\n  const indicator = useRef<HTMLSpanElement>(null);\n  const [selected, setSelected] = useControllable(selectedKey, defaultSelectedKey);\n  const [active, setActive] = useState<string | undefined>(undefined);\n  const [opened, setOpened] = useControllable<readonly string[]>(\n    openKeys,\n    defaultOpenKeys,\n    (keys) => onOpenChange?.([...keys]),\n  );\n  useMovingIndicator(\n    root,\n    indicator,\n    '[data-selected=\"true\"]',\n    `${selected}-${collapsed}-${mode}-${direction}-${opened.join(',')}`,\n  );\n  const toggle = (key: string) =>\n    setOpened(opened.includes(key) ? opened.filter((value) => value !== key) : [...opened, key]);\n  const hasSelected = (item: MenuItem): boolean =>\n    item.key === selected || Boolean(item.children?.some(hasSelected));\n  const visibleItems: MenuItem[] = [];\n  const collect = (entries: readonly MenuItem[]) => {\n    for (const item of entries) {\n      if (item.type === 'group') collect(item.children ?? []);\n      else if (item.type !== 'divider') {\n        if (!item.disabled) visibleItems.push(item);\n        if (opened.includes(item.key) && mode !== 'horizontal' && !collapsed)\n          collect(item.children ?? []);\n      }\n    }\n  };\n  collect(items);\n  const focusKey = visibleItems.some((item) => item.key === active)\n    ? active\n    : (visibleItems.find((item) => item.key === selected)?.key ?? visibleItems[0]?.key);\n  const convert = (entries: readonly MenuItem[]): DropdownItem[] =>\n    entries.map((item) => ({\n      ...item,\n      children: item.children ? convert(item.children) : undefined,\n      onClick: () => {\n        if (!item.children?.length) {\n          setSelected(item.key);\n          onSelect?.(item.key, item);\n        }\n      },\n    }));\n  const renderItems = (entries: readonly MenuItem[], depth: number): ReactNode =>\n    entries.map((item) => {\n      if (item.type === 'divider') return <hr className=\"leaf-menu__divider\" key={item.key} />;\n      if (item.type === 'group')\n        return (\n          <fieldset\n            aria-label={typeof item.label === 'string' ? item.label : undefined}\n            key={item.key}\n            className=\"leaf-menu__group\"\n          >\n            <legend className=\"leaf-menu__group-label\">{item.label}</legend>\n            {renderItems(item.children ?? [], depth)}\n          </fieldset>\n        );\n      const expanded = opened.includes(item.key);\n      const hasChildren = Boolean(item.children?.length);\n      const originalContent = (\n        <>\n          {item.icon && (\n            <span className=\"leaf-menu__icon\" aria-hidden=\"true\">\n              {item.icon}\n            </span>\n          )}\n          {!item.icon && collapsed && (\n            <span className=\"leaf-menu__icon\" aria-hidden=\"true\">\n              {typeof item.label === 'string' ? item.label.slice(0, 1) : '·'}\n            </span>\n          )}\n          <span className=\"leaf-menu__label\">{item.label}</span>\n          {hasChildren && <ChevronDown className=\"leaf-menu__arrow\" size={14} aria-hidden=\"true\" />}\n        </>\n      );\n      const content = itemRender?.(item, originalContent) ?? originalContent;\n      const common = {\n        role: 'menuitem',\n        'aria-current': selected === item.key ? ('page' as const) : undefined,\n        'aria-disabled': item.disabled || undefined,\n        'aria-expanded': hasChildren ? expanded : undefined,\n        'aria-controls': hasChildren ? `${id}-${item.key}` : undefined,\n        'data-selected': selected === item.key || undefined,\n        'data-active-parent': (hasChildren && hasSelected(item)) || undefined,\n        'data-danger': item.danger || undefined,\n        className: classes(\n          'leaf-menu__item',\n          typeof itemClassName === 'function' ? itemClassName(item) : itemClassName,\n        ),\n        tabIndex: !item.disabled && focusKey === item.key ? 0 : -1,\n        'data-menu-key': item.key,\n        'data-leaf-indicator-item': '',\n        'aria-label': collapsed && typeof item.label === 'string' ? item.label : undefined,\n        onFocus: () => setActive(item.key),\n        title: collapsed && typeof item.label === 'string' ? item.label : undefined,\n        style: { paddingInlineStart: 12 + depth * 16 },\n      };\n      const activate = () => {\n        if (item.disabled) return;\n        if (hasChildren) toggle(item.key);\n        else {\n          setSelected(item.key);\n          onSelect?.(item.key, item);\n        }\n      };\n      if (hasChildren && (mode === 'horizontal' || collapsed))\n        return (\n          <div key={item.key} className=\"leaf-menu__entry\">\n            <Dropdown\n              items={convert(item.children ?? [])}\n              open={expanded}\n              disabled={item.disabled}\n              onOpenChange={(next) => setOpened(next ? [item.key] : [])}\n            >\n              <button {...common} type=\"button\">\n                {content}\n              </button>\n            </Dropdown>\n          </div>\n        );\n      return (\n        <div key={item.key} className=\"leaf-menu__entry\">\n          {item.href && !hasChildren ? (\n            ((link: ReactNode) => linkRender?.(item, link) ?? link)(\n              <a\n                {...common}\n                href={item.disabled ? undefined : item.href}\n                onClick={(event) => {\n                  if (item.disabled) event.preventDefault();\n                  else activate();\n                }}\n              >\n                {content}\n              </a>,\n            )\n          ) : (\n            <button {...common} type=\"button\" disabled={item.disabled} onClick={activate}>\n              {content}\n            </button>\n          )}\n          {hasChildren && (\n            <MenuSubmenu\n              id={`${id}-${item.key}`}\n              open={expanded}\n              label={typeof item.label === 'string' ? item.label : undefined}\n            >\n              {() => renderItems(item.children ?? [], depth + 1)}\n            </MenuSubmenu>\n          )}\n        </div>\n      );\n    });\n  return (\n    <nav\n      {...props}\n      ref={root}\n      className={classes(\n        'leaf-menu',\n        `leaf-menu--${mode}`,\n        collapsed && 'leaf-menu--collapsed',\n        className,\n      )}\n      aria-label={props['aria-label'] ?? t('menu.navigationMenu')}\n    >\n      <span ref={indicator} className=\"leaf-menu__indicator\" aria-hidden=\"true\" />\n      {/* biome-ignore lint/a11y/noStaticElementInteractions: This container delegates arrow navigation for the menu or menubar role. */}\n      <div\n        role={mode === 'horizontal' ? 'menubar' : 'menu'}\n        onKeyDown={(event) => {\n          if (event.defaultPrevented) return;\n          if (\n            !['ArrowDown', 'ArrowUp', 'ArrowRight', 'ArrowLeft', 'Home', 'End', 'Escape'].includes(\n              event.key,\n            )\n          )\n            return;\n          const target = event.target as HTMLElement;\n          if (event.key === 'Escape') {\n            setOpened([]);\n            root.current?.querySelector<HTMLElement>('[role=\"menuitem\"]')?.focus();\n            return;\n          }\n          const choices = [\n            ...(root.current?.querySelectorAll<HTMLElement>(\n              '[role=\"menuitem\"]:not([aria-disabled=\"true\"])',\n            ) ?? []),\n          ].filter((node) => visibleItems.some((item) => item.key === node.dataset.menuKey));\n          const position = choices.indexOf(target.closest('[role=\"menuitem\"]') as HTMLElement);\n          const key = choices[position]?.dataset.menuKey;\n          const item = visibleItems.find((entry) => entry.key === key);\n          const focusItem = (nextKey: string) => {\n            setActive(nextKey);\n            queueMicrotask(() => {\n              const node = [\n                ...(root.current?.querySelectorAll<HTMLElement>('[data-menu-key]') ?? []),\n              ].find((entry) => entry.dataset.menuKey === nextKey);\n              node?.focus();\n            });\n          };\n          if (mode !== 'horizontal' && !collapsed && item) {\n            if (event.key === (direction === 'rtl' ? 'ArrowLeft' : 'ArrowRight')) {\n              event.preventDefault();\n              if (item.children?.length) {\n                if (!opened.includes(item.key)) setOpened([...opened, item.key]);\n                else {\n                  const child = item.children.find(\n                    (entry) => !entry.disabled && entry.type !== 'divider',\n                  );\n                  if (child) focusItem(child.key);\n                }\n              }\n              return;\n            }\n            if (event.key === (direction === 'rtl' ? 'ArrowRight' : 'ArrowLeft')) {\n              event.preventDefault();\n              if (opened.includes(item.key)) toggle(item.key);\n              else {\n                const parentOf = (entries: readonly MenuItem[]): MenuItem | undefined => {\n                  for (const entry of entries) {\n                    if (entry.children?.some((child) => child.key === item.key)) return entry;\n                    const parent = parentOf(entry.children ?? []);\n                    if (parent) return parent;\n                  }\n                  return undefined;\n                };\n                const parent = parentOf(items);\n                if (parent && parent.type !== 'group') focusItem(parent.key);\n              }\n              return;\n            }\n          }\n          if (mode === 'horizontal' && event.key === 'ArrowDown' && item?.children?.length) {\n            event.preventDefault();\n            setOpened([item.key]);\n            return;\n          }\n          const next =\n            event.key === 'Home'\n              ? 0\n              : event.key === 'End'\n                ? choices.length - 1\n                : (position +\n                    (event.key === 'ArrowUp' ||\n                    event.key === (direction === 'rtl' ? 'ArrowRight' : 'ArrowLeft')\n                      ? -1\n                      : 1) +\n                    choices.length) %\n                  choices.length;\n          event.preventDefault();\n          const nextKey = choices[next]?.dataset.menuKey;\n          if (nextKey) setActive(nextKey);\n          choices[next]?.focus();\n        }}\n      >\n        {renderItems(items, 0)}\n      </div>\n    </nav>\n  );\n}\n"],"names":["MenuSubmenu","open","id","label","children","visited","setVisited","useState","undefined","inertProps","Menu","rawProps","items","mode","selectedKey","defaultSelectedKey","onSelect","openKeys","defaultOpenKeys","onOpenChange","collapsed","itemRender","linkRender","itemClassName","className","props","useComponentProps","t","useText","direction","useLeafConfig","useId","root","useRef","indicator","selected","setSelected","useControllable","active","setActive","opened","setOpened","keys","useMovingIndicator","toggle","key","value","hasSelected","item","Boolean","visibleItems","collect","entries","focusKey","convert","renderItems","depth","expanded","hasChildren","originalContent","ChevronDown","content","common","classes","activate","Dropdown","next","link","event","target","choices","node","position","entry","focusItem","nextKey","queueMicrotask","child","parentOf","parent"],"mappings":";;;;;;;;;;;;;;AAmCA,SAASA,YAAY,EACnBC,IAAI,EACJC,EAAE,EACFC,KAAK,EACLC,QAAQ,EAMT;IACC,MAAM,CAACC,SAASC,WAAW,GAAGC,SAASN;IACvC,IAAIA,QAAQ,CAACI,SAASC,WAAW;IACjC,OAAO,WAAP,GACE,IAAC;QACC,IAAIJ;QACJ,MAAK;QACL,WAAU;QACV,cAAYC;QACZ,eAAa,CAACF,QAAQO;QACrB,GAAGC,WAAW,CAACR,KAAK;QACrB,aAAWA,QAAQO;kBAEnB,kBAAC;YAAI,WAAU;sBACb,kBAAC;gBAAI,WAAU;0BAA8BH,WAAWD;;;;AAIhE;AACO,SAASM,KAAKC,QAAmB;IACtC,MAAM,EACJC,KAAK,EACLC,OAAO,UAAU,EACjBC,WAAW,EACXC,qBAAqB,EAAE,EACvBC,QAAQ,EACRC,QAAQ,EACRC,kBAAkB,EAAE,EACpBC,YAAY,EACZC,YAAY,KAAK,EACjBC,UAAU,EACVC,UAAU,EACVC,aAAa,EACbC,SAAS,EACT,GAAGC,OACJ,GAAGC,kBAAkB,QAAQf;IAC9B,MAAMgB,IAAIC;IACV,MAAM,EAAEC,SAAS,EAAE,GAAGC;IACtB,MAAM5B,KAAK6B;IACX,MAAMC,OAAOC,OAAoB;IACjC,MAAMC,YAAYD,OAAwB;IAC1C,MAAM,CAACE,UAAUC,YAAY,GAAGC,gBAAgBvB,aAAaC;IAC7D,MAAM,CAACuB,QAAQC,UAAU,GAAGhC,SAA6BC;IACzD,MAAM,CAACgC,QAAQC,UAAU,GAAGJ,gBAC1BpB,UACAC,iBACA,CAACwB,OAASvB,eAAe;eAAIuB;SAAK;IAEpCC,mBACEX,MACAE,WACA,0BACA,GAAGC,SAAS,CAAC,EAAEf,UAAU,CAAC,EAAEP,KAAK,CAAC,EAAEgB,UAAU,CAAC,EAAEW,OAAO,IAAI,CAAC,MAAM;IAErE,MAAMI,SAAS,CAACC,MACdJ,UAAUD,OAAO,QAAQ,CAACK,OAAOL,OAAO,MAAM,CAAC,CAACM,QAAUA,UAAUD,OAAO;eAAIL;YAAQK;SAAI;IAC7F,MAAME,cAAc,CAACC,OACnBA,KAAK,GAAG,KAAKb,YAAYc,QAAQD,KAAK,QAAQ,EAAE,KAAKD;IACvD,MAAMG,eAA2B,EAAE;IACnC,MAAMC,UAAU,CAACC;QACf,KAAK,MAAMJ,QAAQI,QACjB,IAAIJ,AAAc,YAAdA,KAAK,IAAI,EAAcG,QAAQH,KAAK,QAAQ,IAAI,EAAE;aACjD,IAAIA,AAAc,cAAdA,KAAK,IAAI,EAAgB;YAChC,IAAI,CAACA,KAAK,QAAQ,EAAEE,aAAa,IAAI,CAACF;YACtC,IAAIR,OAAO,QAAQ,CAACQ,KAAK,GAAG,KAAKnC,AAAS,iBAATA,QAAyB,CAACO,WACzD+B,QAAQH,KAAK,QAAQ,IAAI,EAAE;QAC/B;IAEJ;IACAG,QAAQvC;IACR,MAAMyC,WAAWH,aAAa,IAAI,CAAC,CAACF,OAASA,KAAK,GAAG,KAAKV,UACtDA,SACCY,aAAa,IAAI,CAAC,CAACF,OAASA,KAAK,GAAG,KAAKb,WAAW,OAAOe,YAAY,CAAC,EAAE,EAAE;IACjF,MAAMI,UAAU,CAACF,UACfA,QAAQ,GAAG,CAAC,CAACJ,OAAU;gBACrB,GAAGA,IAAI;gBACP,UAAUA,KAAK,QAAQ,GAAGM,QAAQN,KAAK,QAAQ,IAAIxC;gBACnD,SAAS;oBACP,IAAI,CAACwC,KAAK,QAAQ,EAAE,QAAQ;wBAC1BZ,YAAYY,KAAK,GAAG;wBACpBhC,WAAWgC,KAAK,GAAG,EAAEA;oBACvB;gBACF;YACF;IACF,MAAMO,cAAc,CAACH,SAA8BI,QACjDJ,QAAQ,GAAG,CAAC,CAACJ;YACX,IAAIA,AAAc,cAAdA,KAAK,IAAI,EAAgB,OAAO,WAAP,GAAO,IAAC;gBAAG,WAAU;eAA0BA,KAAK,GAAG;YACpF,IAAIA,AAAc,YAAdA,KAAK,IAAI,EACX,OAAO,WAAP,GACE,KAAC;gBACC,cAAY,AAAsB,YAAtB,OAAOA,KAAK,KAAK,GAAgBA,KAAK,KAAK,GAAGxC;gBAE1D,WAAU;;kCAEV,IAAC;wBAAO,WAAU;kCAA0BwC,KAAK,KAAK;;oBACrDO,YAAYP,KAAK,QAAQ,IAAI,EAAE,EAAEQ;;eAJ7BR,KAAK,GAAG;YAOnB,MAAMS,WAAWjB,OAAO,QAAQ,CAACQ,KAAK,GAAG;YACzC,MAAMU,cAAcT,QAAQD,KAAK,QAAQ,EAAE;YAC3C,MAAMW,kBAAkB,WAAlBA,GACJ;;oBACGX,KAAK,IAAI,IAAI,WAAJ,GACR,IAAC;wBAAK,WAAU;wBAAkB,eAAY;kCAC3CA,KAAK,IAAI;;oBAGb,CAACA,KAAK,IAAI,IAAI5B,aAAa,WAAbA,GACb,IAAC;wBAAK,WAAU;wBAAkB,eAAY;kCAC3C,AAAsB,YAAtB,OAAO4B,KAAK,KAAK,GAAgBA,KAAK,KAAK,CAAC,KAAK,CAAC,GAAG,KAAK;;kCAG/D,IAAC;wBAAK,WAAU;kCAAoBA,KAAK,KAAK;;oBAC7CU,eAAe,WAAfA,GAAe,IAACE,aAAWA;wBAAC,WAAU;wBAAmB,MAAM;wBAAI,eAAY;;;;YAGpF,MAAMC,UAAUxC,aAAa2B,MAAMW,oBAAoBA;YACvD,MAAMG,SAAS;gBACb,MAAM;gBACN,gBAAgB3B,aAAaa,KAAK,GAAG,GAAI,SAAmBxC;gBAC5D,iBAAiBwC,KAAK,QAAQ,IAAIxC;gBAClC,iBAAiBkD,cAAcD,WAAWjD;gBAC1C,iBAAiBkD,cAAc,GAAGxD,GAAG,CAAC,EAAE8C,KAAK,GAAG,EAAE,GAAGxC;gBACrD,iBAAiB2B,aAAaa,KAAK,GAAG,IAAIxC;gBAC1C,sBAAuBkD,eAAeX,YAAYC,SAAUxC;gBAC5D,eAAewC,KAAK,MAAM,IAAIxC;gBAC9B,WAAWuD,QACT,mBACA,AAAyB,cAAzB,OAAOxC,gBAA+BA,cAAcyB,QAAQzB;gBAE9D,UAAU,AAACyB,KAAK,QAAQ,IAAIK,aAAaL,KAAK,GAAG,GAAO,KAAJ;gBACpD,iBAAiBA,KAAK,GAAG;gBACzB,4BAA4B;gBAC5B,cAAc5B,aAAa,AAAsB,YAAtB,OAAO4B,KAAK,KAAK,GAAgBA,KAAK,KAAK,GAAGxC;gBACzE,SAAS,IAAM+B,UAAUS,KAAK,GAAG;gBACjC,OAAO5B,aAAa,AAAsB,YAAtB,OAAO4B,KAAK,KAAK,GAAgBA,KAAK,KAAK,GAAGxC;gBAClE,OAAO;oBAAE,oBAAoB,KAAKgD,AAAQ,KAARA;gBAAW;YAC/C;YACA,MAAMQ,WAAW;gBACf,IAAIhB,KAAK,QAAQ,EAAE;gBACnB,IAAIU,aAAad,OAAOI,KAAK,GAAG;qBAC3B;oBACHZ,YAAYY,KAAK,GAAG;oBACpBhC,WAAWgC,KAAK,GAAG,EAAEA;gBACvB;YACF;YACA,IAAIU,eAAgB7C,CAAAA,AAAS,iBAATA,QAAyBO,SAAQ,GACnD,OAAO,WAAP,GACE,IAAC;gBAAmB,WAAU;0BAC5B,kBAAC6C,iBAAQA;oBACP,OAAOX,QAAQN,KAAK,QAAQ,IAAI,EAAE;oBAClC,MAAMS;oBACN,UAAUT,KAAK,QAAQ;oBACvB,cAAc,CAACkB,OAASzB,UAAUyB,OAAO;4BAAClB,KAAK,GAAG;yBAAC,GAAG,EAAE;8BAExD,kBAAC;wBAAQ,GAAGc,MAAM;wBAAE,MAAK;kCACtBD;;;eARGb,KAAK,GAAG;YAatB,OAAO,WAAP,GACE,KAAC;gBAAmB,WAAU;;oBAC3BA,KAAK,IAAI,IAAI,CAACU,cACZ,AAAC,EAAAS,OAAoB7C,aAAa0B,MAAMmB,SAASA,IAAG,gBACnD,IAAC;wBACE,GAAGL,MAAM;wBACV,MAAMd,KAAK,QAAQ,GAAGxC,SAAYwC,KAAK,IAAI;wBAC3C,SAAS,CAACoB;4BACR,IAAIpB,KAAK,QAAQ,EAAEoB,MAAM,cAAc;iCAClCJ;wBACP;kCAECH;wCAIL,IAAC;wBAAQ,GAAGC,MAAM;wBAAE,MAAK;wBAAS,UAAUd,KAAK,QAAQ;wBAAE,SAASgB;kCACjEH;;oBAGJH,eAAe,WAAfA,GACC,IAAC1D,aAAWA;wBACV,IAAI,GAAGE,GAAG,CAAC,EAAE8C,KAAK,GAAG,EAAE;wBACvB,MAAMS;wBACN,OAAO,AAAsB,YAAtB,OAAOT,KAAK,KAAK,GAAgBA,KAAK,KAAK,GAAGxC;kCAEpD,IAAM+C,YAAYP,KAAK,QAAQ,IAAI,EAAE,EAAEQ,QAAQ;;;eAzB5CR,KAAK,GAAG;QA8BtB;IACF,OAAO,WAAP,GACE,KAAC;QACE,GAAGvB,KAAK;QACT,KAAKO;QACL,WAAW+B,QACT,aACA,CAAC,WAAW,EAAElD,MAAM,EACpBO,aAAa,wBACbI;QAEF,cAAYC,KAAK,CAAC,aAAa,IAAIE,EAAE;;0BAErC,IAAC;gBAAK,KAAKO;gBAAW,WAAU;gBAAuB,eAAY;;0BAEnE,IAAC;gBACC,MAAMrB,AAAS,iBAATA,OAAwB,YAAY;gBAC1C,WAAW,CAACuD;oBACV,IAAIA,MAAM,gBAAgB,EAAE;oBAC5B,IACE,CAAC;wBAAC;wBAAa;wBAAW;wBAAc;wBAAa;wBAAQ;wBAAO;qBAAS,CAAC,QAAQ,CACpFA,MAAM,GAAG,GAGX;oBACF,MAAMC,SAASD,MAAM,MAAM;oBAC3B,IAAIA,AAAc,aAAdA,MAAM,GAAG,EAAe;wBAC1B3B,UAAU,EAAE;wBACZT,KAAK,OAAO,EAAE,cAA2B,sBAAsB;wBAC/D;oBACF;oBACA,MAAMsC,UAAU;2BACVtC,KAAK,OAAO,EAAE,iBAChB,oDACG,EAAE;qBACR,CAAC,MAAM,CAAC,CAACuC,OAASrB,aAAa,IAAI,CAAC,CAACF,OAASA,KAAK,GAAG,KAAKuB,KAAK,OAAO,CAAC,OAAO;oBAChF,MAAMC,WAAWF,QAAQ,OAAO,CAACD,OAAO,OAAO,CAAC;oBAChD,MAAMxB,MAAMyB,OAAO,CAACE,SAAS,EAAE,QAAQ;oBACvC,MAAMxB,OAAOE,aAAa,IAAI,CAAC,CAACuB,QAAUA,MAAM,GAAG,KAAK5B;oBACxD,MAAM6B,YAAY,CAACC;wBACjBpC,UAAUoC;wBACVC,eAAe;4BACb,MAAML,OAAO;mCACPvC,KAAK,OAAO,EAAE,iBAA8B,sBAAsB,EAAE;6BACzE,CAAC,IAAI,CAAC,CAACyC,QAAUA,MAAM,OAAO,CAAC,OAAO,KAAKE;4BAC5CJ,MAAM;wBACR;oBACF;oBACA,IAAI1D,AAAS,iBAATA,QAAyB,CAACO,aAAa4B,MAAM;wBAC/C,IAAIoB,MAAM,GAAG,KAAMvC,CAAAA,AAAc,UAAdA,YAAsB,cAAc,YAAW,GAAI;4BACpEuC,MAAM,cAAc;4BACpB,IAAIpB,KAAK,QAAQ,EAAE,QACjB,IAAKR,OAAO,QAAQ,CAACQ,KAAK,GAAG,GACxB;gCACH,MAAM6B,QAAQ7B,KAAK,QAAQ,CAAC,IAAI,CAC9B,CAACyB,QAAU,CAACA,MAAM,QAAQ,IAAIA,AAAe,cAAfA,MAAM,IAAI;gCAE1C,IAAII,OAAOH,UAAUG,MAAM,GAAG;4BAChC,OANgCpC,UAAU;mCAAID;gCAAQQ,KAAK,GAAG;6BAAC;4BAQjE;wBACF;wBACA,IAAIoB,MAAM,GAAG,KAAMvC,CAAAA,AAAc,UAAdA,YAAsB,eAAe,WAAU,GAAI;4BACpEuC,MAAM,cAAc;4BACpB,IAAI5B,OAAO,QAAQ,CAACQ,KAAK,GAAG,GAAGJ,OAAOI,KAAK,GAAG;iCACzC;gCACH,MAAM8B,WAAW,CAAC1B;oCAChB,KAAK,MAAMqB,SAASrB,QAAS;wCAC3B,IAAIqB,MAAM,QAAQ,EAAE,KAAK,CAACI,QAAUA,MAAM,GAAG,KAAK7B,KAAK,GAAG,GAAG,OAAOyB;wCACpE,MAAMM,SAASD,SAASL,MAAM,QAAQ,IAAI,EAAE;wCAC5C,IAAIM,QAAQ,OAAOA;oCACrB;gCAEF;gCACA,MAAMA,SAASD,SAASlE;gCACxB,IAAImE,UAAUA,AAAgB,YAAhBA,OAAO,IAAI,EAAcL,UAAUK,OAAO,GAAG;4BAC7D;4BACA;wBACF;oBACF;oBACA,IAAIlE,AAAS,iBAATA,QAAyBuD,AAAc,gBAAdA,MAAM,GAAG,IAAoBpB,MAAM,UAAU,QAAQ;wBAChFoB,MAAM,cAAc;wBACpB3B,UAAU;4BAACO,KAAK,GAAG;yBAAC;wBACpB;oBACF;oBACA,MAAMkB,OACJE,AAAc,WAAdA,MAAM,GAAG,GACL,IACAA,AAAc,UAAdA,MAAM,GAAG,GACPE,QAAQ,MAAM,GAAG,IAChBE,AAAAA,CAAAA,WACEJ,CAAAA,AAAc,cAAdA,MAAM,GAAG,IACVA,MAAM,GAAG,KAAMvC,CAAAA,AAAc,UAAdA,YAAsB,eAAe,WAAU,IAC1D,KACA,KACJyC,QAAQ,MAAK,IACfA,QAAQ,MAAM;oBACtBF,MAAM,cAAc;oBACpB,MAAMO,UAAUL,OAAO,CAACJ,KAAK,EAAE,QAAQ;oBACvC,IAAIS,SAASpC,UAAUoC;oBACvBL,OAAO,CAACJ,KAAK,EAAE;gBACjB;0BAECX,YAAY3C,OAAO;;;;AAI5B"}
+{"version":3,"file":"menu/menu.js","sources":["../../../../../src/menu/menu.tsx"],"sourcesContent":["import { ChevronDown } from 'lucide-react';\nimport { forwardRef, type HTMLAttributes, type ReactNode, useId, useRef, useState } from 'react';\nimport { useComponentProps } from '../config-provider/component-defaults';\nimport { useLeafConfig } from '../config-provider/context';\nimport type { DropdownItem } from '../dropdown';\nimport { DropdownControl as Dropdown } from '../dropdown/dropdown';\nimport { classes } from '../shared/classes';\nimport { inertProps } from '../shared/inert';\nimport { useControllable } from '../shared/use-controllable';\nimport { useText } from '../shared/use-text';\nimport { useMovingIndicator } from '../tabs/use-moving-indicator';\n\nexport interface MenuGroupProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n  title: ReactNode;\n}\n\nconst MenuGroupControl = forwardRef<HTMLDivElement, MenuGroupProps>(function MenuGroupControl(\n  { title, children, className, ...props },\n  ref,\n) {\n  const titleId = useId();\n  return (\n    // biome-ignore lint/a11y/useSemanticElements: Menu groups and arbitrary sidebar content are not form fieldsets.\n    <div\n      role=\"group\"\n      aria-labelledby={props['aria-label'] !== undefined ? undefined : titleId}\n      {...props}\n      ref={ref}\n      className={classes('leaf-menu__group', className)}\n    >\n      <div id={titleId} className=\"leaf-menu__group-label\">\n        {title}\n      </div>\n      {children}\n    </div>\n  );\n});\n\nexport const MenuGroup = forwardRef<HTMLDivElement, MenuGroupProps>(\n  function MenuGroup(rawProps, ref) {\n    const props = useComponentProps('MenuGroup', rawProps);\n    return (\n      <MenuGroupControl\n        {...props}\n        ref={ref}\n        className={classes('leaf-menu-group', props.className)}\n      />\n    );\n  },\n);\n\nexport interface MenuItem {\n  key: string;\n  label: ReactNode;\n  icon?: ReactNode;\n  href?: string;\n  disabled?: boolean;\n  danger?: boolean;\n  children?: readonly MenuItem[];\n  type?: 'item' | 'group' | 'divider';\n}\nexport interface MenuProps extends Omit<HTMLAttributes<HTMLElement>, 'onSelect'> {\n  items: readonly MenuItem[];\n  mode?: 'vertical' | 'horizontal' | 'inline';\n  selectedKey?: string;\n  defaultSelectedKey?: string;\n  onSelect?: (key: string, item: MenuItem) => void;\n  openKeys?: readonly string[];\n  defaultOpenKeys?: readonly string[];\n  onOpenChange?: (keys: string[]) => void;\n  collapsed?: boolean;\n  itemRender?: (item: MenuItem, content: ReactNode) => ReactNode;\n  linkRender?: (item: MenuItem, link: ReactNode) => ReactNode;\n  itemClassName?: string | ((item: MenuItem) => string);\n}\nfunction MenuSubmenu({\n  open,\n  id,\n  label,\n  children,\n}: {\n  open: boolean;\n  id: string;\n  label?: string;\n  children: () => ReactNode;\n}) {\n  const [visited, setVisited] = useState(open);\n  if (open && !visited) setVisited(true);\n  return (\n    <div\n      id={id}\n      role=\"menu\"\n      className=\"leaf-menu__submenu\"\n      aria-label={label}\n      aria-hidden={!open || undefined}\n      {...inertProps(!open)}\n      data-open={open || undefined}\n    >\n      <div className=\"leaf-menu__submenu-inner\">\n        <div className=\"leaf-menu__submenu-content\">{visited && children()}</div>\n      </div>\n    </div>\n  );\n}\nexport function Menu(rawProps: MenuProps) {\n  const {\n    items,\n    mode = 'vertical',\n    selectedKey,\n    defaultSelectedKey = '',\n    onSelect,\n    openKeys,\n    defaultOpenKeys = [],\n    onOpenChange,\n    collapsed = false,\n    itemRender,\n    linkRender,\n    itemClassName,\n    className,\n    ...props\n  } = useComponentProps('Menu', rawProps);\n  const t = useText();\n  const { direction } = useLeafConfig();\n  const id = useId();\n  const root = useRef<HTMLElement>(null);\n  const indicator = useRef<HTMLSpanElement>(null);\n  const [selected, setSelected] = useControllable(selectedKey, defaultSelectedKey);\n  const [active, setActive] = useState<string | undefined>(undefined);\n  const [opened, setOpened] = useControllable<readonly string[]>(\n    openKeys,\n    defaultOpenKeys,\n    (keys) => onOpenChange?.([...keys]),\n  );\n  useMovingIndicator(\n    root,\n    indicator,\n    '[data-selected=\"true\"]',\n    `${selected}-${collapsed}-${mode}-${direction}-${opened.join(',')}`,\n  );\n  const toggle = (key: string) =>\n    setOpened(opened.includes(key) ? opened.filter((value) => value !== key) : [...opened, key]);\n  const hasSelected = (item: MenuItem): boolean =>\n    item.key === selected || Boolean(item.children?.some(hasSelected));\n  const visibleItems: MenuItem[] = [];\n  const collect = (entries: readonly MenuItem[]) => {\n    for (const item of entries) {\n      if (item.type === 'group') collect(item.children ?? []);\n      else if (item.type !== 'divider') {\n        if (!item.disabled) visibleItems.push(item);\n        if (opened.includes(item.key) && mode !== 'horizontal' && !collapsed)\n          collect(item.children ?? []);\n      }\n    }\n  };\n  collect(items);\n  const focusKey = visibleItems.some((item) => item.key === active)\n    ? active\n    : (visibleItems.find((item) => item.key === selected)?.key ?? visibleItems[0]?.key);\n  const convert = (entries: readonly MenuItem[]): DropdownItem[] =>\n    entries.map((item) => ({\n      ...item,\n      children: item.children ? convert(item.children) : undefined,\n      onClick: () => {\n        if (!item.children?.length) {\n          setSelected(item.key);\n          onSelect?.(item.key, item);\n        }\n      },\n    }));\n  const renderItems = (entries: readonly MenuItem[], depth: number): ReactNode =>\n    entries.map((item) => {\n      if (item.type === 'divider') return <hr className=\"leaf-menu__divider\" key={item.key} />;\n      if (item.type === 'group')\n        return (\n          <MenuGroupControl key={item.key} title={item.label}>\n            {renderItems(item.children ?? [], depth)}\n          </MenuGroupControl>\n        );\n      const expanded = opened.includes(item.key);\n      const hasChildren = Boolean(item.children?.length);\n      const originalContent = (\n        <>\n          {item.icon && (\n            <span className=\"leaf-menu__icon\" aria-hidden=\"true\">\n              {item.icon}\n            </span>\n          )}\n          {!item.icon && collapsed && (\n            <span className=\"leaf-menu__icon\" aria-hidden=\"true\">\n              {typeof item.label === 'string' ? item.label.slice(0, 1) : '·'}\n            </span>\n          )}\n          <span className=\"leaf-menu__label\">{item.label}</span>\n          {hasChildren && <ChevronDown className=\"leaf-menu__arrow\" size={14} aria-hidden=\"true\" />}\n        </>\n      );\n      const content = itemRender?.(item, originalContent) ?? originalContent;\n      const common = {\n        role: 'menuitem',\n        'aria-current': selected === item.key ? ('page' as const) : undefined,\n        'aria-disabled': item.disabled || undefined,\n        'aria-expanded': hasChildren ? expanded : undefined,\n        'aria-controls': hasChildren ? `${id}-${item.key}` : undefined,\n        'data-selected':\n          selected === item.key ||\n          ((mode === 'horizontal' || collapsed) && hasChildren && hasSelected(item)) ||\n          undefined,\n        'data-active-parent': (hasChildren && hasSelected(item)) || undefined,\n        'data-danger': item.danger || undefined,\n        className: classes(\n          'leaf-menu__item',\n          typeof itemClassName === 'function' ? itemClassName(item) : itemClassName,\n        ),\n        tabIndex: !item.disabled && focusKey === item.key ? 0 : -1,\n        'data-menu-key': item.key,\n        'data-leaf-indicator-item': '',\n        'aria-label': collapsed && typeof item.label === 'string' ? item.label : undefined,\n        onFocus: () => setActive(item.key),\n        title: collapsed && typeof item.label === 'string' ? item.label : undefined,\n        style: { paddingInlineStart: 12 + depth * 16 },\n      };\n      const activate = () => {\n        if (item.disabled) return;\n        if (hasChildren) toggle(item.key);\n        else {\n          setSelected(item.key);\n          onSelect?.(item.key, item);\n        }\n      };\n      if (hasChildren && (mode === 'horizontal' || collapsed))\n        return (\n          <div key={item.key} className=\"leaf-menu__entry\">\n            <Dropdown\n              items={convert(item.children ?? [])}\n              navigation={{ selectedKey: selected, title: collapsed ? item.label : undefined }}\n              popupWidth={208}\n              popupPlacement={\n                collapsed ? (direction === 'rtl' ? 'left-start' : 'right-start') : 'bottom-start'\n              }\n              open={expanded}\n              disabled={item.disabled}\n              onOpenChange={(next) => setOpened(next ? [item.key] : [])}\n            >\n              <button\n                {...common}\n                type=\"button\"\n                onKeyDown={(event) => {\n                  if (\n                    collapsed &&\n                    event.key === (direction === 'rtl' ? 'ArrowLeft' : 'ArrowRight')\n                  ) {\n                    event.preventDefault();\n                    if (!item.disabled) setOpened([item.key]);\n                  }\n                }}\n              >\n                {content}\n              </button>\n            </Dropdown>\n          </div>\n        );\n      return (\n        <div key={item.key} className=\"leaf-menu__entry\">\n          {item.href && !hasChildren ? (\n            ((link: ReactNode) => linkRender?.(item, link) ?? link)(\n              <a\n                {...common}\n                href={item.disabled ? undefined : item.href}\n                onClick={(event) => {\n                  if (item.disabled) event.preventDefault();\n                  else activate();\n                }}\n              >\n                {content}\n              </a>,\n            )\n          ) : (\n            <button {...common} type=\"button\" disabled={item.disabled} onClick={activate}>\n              {content}\n            </button>\n          )}\n          {hasChildren && (\n            <MenuSubmenu\n              id={`${id}-${item.key}`}\n              open={expanded}\n              label={typeof item.label === 'string' ? item.label : undefined}\n            >\n              {() => renderItems(item.children ?? [], depth + 1)}\n            </MenuSubmenu>\n          )}\n        </div>\n      );\n    });\n  return (\n    <nav\n      {...props}\n      ref={root}\n      className={classes(\n        'leaf-menu',\n        `leaf-menu--${mode}`,\n        collapsed && 'leaf-menu--collapsed',\n        className,\n      )}\n      aria-label={props['aria-label'] ?? t('menu.navigationMenu')}\n    >\n      <span ref={indicator} className=\"leaf-menu__indicator\" aria-hidden=\"true\" />\n      {/* biome-ignore lint/a11y/noStaticElementInteractions: This container delegates arrow navigation for the menu or menubar role. */}\n      <div\n        role={mode === 'horizontal' ? 'menubar' : 'menu'}\n        onKeyDown={(event) => {\n          if (event.defaultPrevented) return;\n          if (\n            !['ArrowDown', 'ArrowUp', 'ArrowRight', 'ArrowLeft', 'Home', 'End', 'Escape'].includes(\n              event.key,\n            )\n          )\n            return;\n          const target = event.target as HTMLElement;\n          if (event.key === 'Escape') {\n            setOpened([]);\n            root.current?.querySelector<HTMLElement>('[role=\"menuitem\"]')?.focus();\n            return;\n          }\n          const choices = [\n            ...(root.current?.querySelectorAll<HTMLElement>(\n              '[role=\"menuitem\"]:not([aria-disabled=\"true\"])',\n            ) ?? []),\n          ].filter((node) => visibleItems.some((item) => item.key === node.dataset.menuKey));\n          const position = choices.indexOf(target.closest('[role=\"menuitem\"]') as HTMLElement);\n          const key = choices[position]?.dataset.menuKey;\n          const item = visibleItems.find((entry) => entry.key === key);\n          const focusItem = (nextKey: string) => {\n            setActive(nextKey);\n            queueMicrotask(() => {\n              const node = [\n                ...(root.current?.querySelectorAll<HTMLElement>('[data-menu-key]') ?? []),\n              ].find((entry) => entry.dataset.menuKey === nextKey);\n              node?.focus();\n            });\n          };\n          if (mode !== 'horizontal' && !collapsed && item) {\n            if (event.key === (direction === 'rtl' ? 'ArrowLeft' : 'ArrowRight')) {\n              event.preventDefault();\n              if (item.children?.length) {\n                if (!opened.includes(item.key)) setOpened([...opened, item.key]);\n                else {\n                  const firstEnabled = (entries: readonly MenuItem[]): MenuItem | undefined => {\n                    for (const entry of entries) {\n                      if (entry.type === 'group') {\n                        const child = firstEnabled(entry.children ?? []);\n                        if (child) return child;\n                      } else if (!entry.disabled && entry.type !== 'divider') return entry;\n                    }\n                    return undefined;\n                  };\n                  const child = firstEnabled(item.children);\n                  if (child) focusItem(child.key);\n                }\n              }\n              return;\n            }\n            if (event.key === (direction === 'rtl' ? 'ArrowRight' : 'ArrowLeft')) {\n              event.preventDefault();\n              if (opened.includes(item.key)) toggle(item.key);\n              else {\n                const parentOf = (\n                  entries: readonly MenuItem[],\n                  parentItem?: MenuItem,\n                ): MenuItem | undefined => {\n                  for (const entry of entries) {\n                    if (entry.key === item.key) return parentItem;\n                    const parent = parentOf(\n                      entry.children ?? [],\n                      entry.type === 'group' ? parentItem : entry,\n                    );\n                    if (parent) return parent;\n                  }\n                  return undefined;\n                };\n                const parent = parentOf(items);\n                if (parent) focusItem(parent.key);\n              }\n              return;\n            }\n          }\n          if (mode === 'horizontal' && event.key === 'ArrowDown' && item?.children?.length) {\n            event.preventDefault();\n            setOpened([item.key]);\n            return;\n          }\n          const next =\n            event.key === 'Home'\n              ? 0\n              : event.key === 'End'\n                ? choices.length - 1\n                : (position +\n                    (event.key === 'ArrowUp' ||\n                    event.key === (direction === 'rtl' ? 'ArrowRight' : 'ArrowLeft')\n                      ? -1\n                      : 1) +\n                    choices.length) %\n                  choices.length;\n          event.preventDefault();\n          const nextKey = choices[next]?.dataset.menuKey;\n          if (nextKey) setActive(nextKey);\n          choices[next]?.focus();\n        }}\n      >\n        {renderItems(items, 0)}\n      </div>\n    </nav>\n  );\n}\n"],"names":["MenuGroupControl","forwardRef","title","children","className","props","ref","titleId","useId","undefined","classes","MenuGroup","rawProps","useComponentProps","MenuSubmenu","open","id","label","visited","setVisited","useState","inertProps","Menu","items","mode","selectedKey","defaultSelectedKey","onSelect","openKeys","defaultOpenKeys","onOpenChange","collapsed","itemRender","linkRender","itemClassName","t","useText","direction","useLeafConfig","root","useRef","indicator","selected","setSelected","useControllable","active","setActive","opened","setOpened","keys","useMovingIndicator","toggle","key","value","hasSelected","item","Boolean","visibleItems","collect","entries","focusKey","convert","renderItems","depth","expanded","hasChildren","originalContent","ChevronDown","content","common","activate","Dropdown","next","event","link","target","choices","node","position","entry","focusItem","nextKey","queueMicrotask","firstEnabled","child","parentOf","parentItem","parent"],"mappings":"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"}