@smwb/ui-react 2.6.3 → 2.8.0

package/dist/headless/components/layout/floatingWindow/floatingWindow.js.map

@@ -1 +1 @@
-{"version":3,"file":"floatingWindow.js","sources":["../../../../../src/components/layout/floatingWindow/floatingWindow.tsx"],"sourcesContent":["import React, {\n  type CSSProperties,\n  type PropsWithChildren,\n  type ReactNode,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { CSSTransition } from \"react-transition-group\";\nimport cn from \"clsx\";\nimport Icon from \"../../base/icon/icon\";\nimport { useControllableState } from \"../../../hooks/useControllableState\";\nimport { useForkRef } from \"../../../hooks/useForkRef\";\nimport { useSafeLayoutEffect } from \"../../../hooks/useSafeLayoutEffect\";\n\nexport interface FloatingWindowPosition {\n  x: number;\n  y: number;\n}\n\nexport interface FloatingWindowSize {\n  width: number;\n  height: number;\n}\n\n/** The eight edge/corner resize directions. */\nexport type FloatingWindowResizeDir = \"n\" | \"s\" | \"e\" | \"w\" | \"ne\" | \"nw\" | \"se\" | \"sw\";\n\nexport interface FloatingWindowProps extends Omit<\n  React.HTMLAttributes<HTMLDivElement>,\n  \"onResize\" | \"title\" | \"children\"\n> {\n  /** Controlled open state of the window. */\n  open: boolean;\n  /** Title bar content. When given, the window is labelled by it. */\n  title?: ReactNode;\n  /** Extra header controls, rendered before the built-in collapse/close buttons. */\n  headerActions?: ReactNode;\n\n  /** Controlled top-left position in viewport px. */\n  position?: FloatingWindowPosition;\n  /** Initial position when uncontrolled. */\n  defaultPosition?: FloatingWindowPosition;\n  /** Called on every move frame and on viewport re-clamp, with the clamped position. */\n  onPositionChange?: (position: FloatingWindowPosition) => void;\n  /** Called once when a move gesture ends — the point at which to persist. */\n  onMoveEnd?: (position: FloatingWindowPosition) => void;\n\n  /** Controlled size in px. */\n  size?: FloatingWindowSize;\n  /** Initial size when uncontrolled. */\n  defaultSize?: FloatingWindowSize;\n  /** Called on every resize frame and on viewport re-clamp, with the clamped size. */\n  onResize?: (size: FloatingWindowSize) => void;\n  /** Called once when a resize gesture ends — the point at which to persist. */\n  onResizeEnd?: (size: FloatingWindowSize) => void;\n\n  /** Minimum width in px (default 200). */\n  minWidth?: number;\n  /** Minimum height in px (default 120). */\n  minHeight?: number;\n  /** Maximum width in px (default: viewport width). */\n  maxWidth?: number;\n  /** Maximum height in px (default: viewport height). */\n  maxHeight?: number;\n  /** Px of the window that must stay inside the viewport (default 56). */\n  keepVisible?: number;\n  /** Step in px for keyboard moving (default 24). */\n  moveStep?: number;\n  /** Step in px for keyboard resizing (default 24). */\n  resizeStep?: number;\n\n  /** Inline stacking order. The host owns z-order across several windows. */\n  zIndex?: number;\n  /** Called on pointerdown anywhere in the window, so the host can raise it. */\n  onActivate?: () => void;\n\n  /** Shade the window down to its title bar. */\n  collapsed?: boolean;\n  /** Initial collapsed state when uncontrolled. */\n  defaultCollapsed?: boolean;\n  onCollapsedChange?: (collapsed: boolean) => void;\n  /** Render the built-in collapse toggle (default true). */\n  collapsible?: boolean;\n\n  /** Allow drag-to-move by the title bar (default true). */\n  movable?: boolean;\n  /** Allow drag-to-resize from the edges and corners (default true). */\n  resizable?: boolean;\n  /** Close on Escape while focus is inside the window (default false). */\n  closeOnEsc?: boolean;\n  onClose?: () => void;\n\n  /** Accessible label for the move handle. */\n  moveHandleAriaLabel?: string;\n  /** Accessible label for the resize handle. */\n  resizeHandleAriaLabel?: string;\n  /** Accessible label for the close button. */\n  closeAriaLabel?: string;\n  /** Accessible label for the collapse toggle while expanded. */\n  collapseAriaLabel?: string;\n  /** Accessible label for the collapse toggle while collapsed. */\n  expandAriaLabel?: string;\n\n  \"aria-label\"?: string;\n}\n\ninterface Rect {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\ninterface Viewport {\n  width: number;\n  height: number;\n}\n\n/** Sign vector per resize direction: how the pointer delta maps onto x/y/width/height. */\nconst RESIZE_DIRS: Record<FloatingWindowResizeDir, { dx: 0 | 1; dy: 0 | 1; dw: -1 | 0 | 1; dh: -1 | 0 | 1 }> = {\n  n: { dx: 0, dy: 1, dw: 0, dh: -1 },\n  s: { dx: 0, dy: 0, dw: 0, dh: 1 },\n  e: { dx: 0, dy: 0, dw: 1, dh: 0 },\n  w: { dx: 1, dy: 0, dw: -1, dh: 0 },\n  ne: { dx: 0, dy: 1, dw: 1, dh: -1 },\n  nw: { dx: 1, dy: 1, dw: -1, dh: -1 },\n  se: { dx: 0, dy: 0, dw: 1, dh: 1 },\n  sw: { dx: 1, dy: 0, dw: -1, dh: 1 },\n};\n\nconst RESIZE_ORDER: FloatingWindowResizeDir[] = [\"n\", \"s\", \"e\", \"w\", \"ne\", \"nw\", \"se\", \"sw\"];\n\nconst viewportOf = (): Viewport =>\n  typeof window === \"undefined\" ? { width: 0, height: 0 } : { width: window.innerWidth, height: window.innerHeight };\n\nconst DEFAULT_POSITION: FloatingWindowPosition = { x: 24, y: 24 };\nconst DEFAULT_SIZE: FloatingWindowSize = { width: 360, height: 420 };\n\n/**\n * Free-floating, non-modal window: draggable by its title bar, resizable from every\n * edge and corner, clamped so a grabbable strip always stays on screen.\n *\n * Unlike Sheet/Modal it is deliberately NOT an overlay layer: no backdrop, no focus\n * trap, no `data-smwb-overlay-layer`. Several windows are meant to be open and usable\n * at once alongside the page behind them, so it must not trap focus, swallow clicks,\n * or steal Escape from a Modal stacked above it. Stacking order is the host's job —\n * pass `zIndex` and raise the window from `onActivate`.\n */\nexport const FloatingWindow = forwardRef<HTMLDivElement, PropsWithChildren<FloatingWindowProps>>(\n  function FloatingWindow(props, ref) {\n    const {\n      open,\n      title,\n      headerActions,\n      position: positionProp,\n      defaultPosition = DEFAULT_POSITION,\n      onPositionChange,\n      onMoveEnd,\n      size: sizeProp,\n      defaultSize = DEFAULT_SIZE,\n      onResize,\n      onResizeEnd,\n      minWidth = 200,\n      minHeight = 120,\n      maxWidth,\n      maxHeight,\n      keepVisible = 56,\n      moveStep = 24,\n      resizeStep = 24,\n      zIndex,\n      onActivate,\n      collapsed: collapsedProp,\n      defaultCollapsed = false,\n      onCollapsedChange,\n      collapsible = true,\n      movable = true,\n      resizable = true,\n      closeOnEsc = false,\n      onClose,\n      moveHandleAriaLabel = \"Move window\",\n      resizeHandleAriaLabel = \"Resize window\",\n      closeAriaLabel = \"Close window\",\n      collapseAriaLabel = \"Collapse window\",\n      expandAriaLabel = \"Expand window\",\n      className,\n      style,\n      children,\n      ...rest\n    } = props;\n\n    const [domRoot, setDomRoot] = useState<HTMLElement>();\n    const rootRef = useRef<HTMLDivElement>(null);\n    const forkedRootRef = useForkRef<HTMLDivElement>(ref, rootRef);\n    const titleId = useId();\n\n    useSafeLayoutEffect(() => {\n      setDomRoot(document.body);\n    }, []);\n\n    const [position, setPosition] = useControllableState<FloatingWindowPosition>({\n      value: positionProp,\n      defaultValue: defaultPosition,\n      onChange: onPositionChange,\n    });\n    const [size, setSize] = useControllableState<FloatingWindowSize>({\n      value: sizeProp,\n      defaultValue: defaultSize,\n      onChange: onResize,\n    });\n    const [collapsed, setCollapsed] = useControllableState<boolean>({\n      value: collapsedProp,\n      defaultValue: defaultCollapsed,\n      onChange: onCollapsedChange,\n    });\n\n    /**\n     * Size first, then position against the clamped size. `y` is never negative, so the\n     * title bar can never be dragged above the top edge and become ungrabbable — the gap\n     * that makes an off-screen Sheet unrecoverable.\n     */\n    const clampRect = useCallback(\n      (rectIn: Rect, vp: Viewport): Rect => {\n        const maxW = maxWidth ?? vp.width;\n        const maxH = maxHeight ?? vp.height;\n        const width = Math.max(minWidth, Math.min(maxW, rectIn.width));\n        const height = Math.max(minHeight, Math.min(maxH, rectIn.height));\n        const keep = Math.min(keepVisible, width);\n        const x = Math.max(keep - width, Math.min(vp.width - keep, rectIn.x));\n        const y = Math.max(0, Math.min(Math.max(0, vp.height - keep), rectIn.y));\n        return { x, y, width, height };\n      },\n      [keepVisible, maxHeight, maxWidth, minHeight, minWidth]\n    );\n\n    /**\n     * Where a window is placed before anyone touches it: fully inside the viewport when\n     * it fits at all. `clampRect` alone only keeps `keepVisible` px reachable, which is\n     * right for a window the user parked at an edge but wrong on opening — a 760px\n     * default on a 375px phone opened a quarter of a screen off to the right.\n     */\n    const fitRect = useCallback(\n      (rectIn: Rect, vp: Viewport): Rect => {\n        const clamped = clampRect(rectIn, vp);\n        return {\n          ...clamped,\n          x: Math.max(0, Math.min(clamped.x, vp.width - clamped.width)),\n          y: Math.max(0, Math.min(clamped.y, vp.height - clamped.height)),\n        };\n      },\n      [clampRect]\n    );\n\n    // Set by the first move/resize: from then on the user's placement wins and only the\n    // reachability clamp applies, so a window can still be parked half off-screen.\n    const [placed, setPlaced] = useState(false);\n    useEffect(() => {\n      // A closed window forgets that it was moved: opening it again should land on\n      // screen like the first time, whatever the viewport is now.\n      if (!open) setPlaced(false);\n    }, [open]);\n\n    /** The geometry actually rendered. Clamping the CONTROLLED value (not just drag\n     *  frames) means a rect restored from a larger monitor lands on screen immediately. */\n    const current = { x: position.x, y: position.y, width: size.width, height: size.height };\n    const rect = placed ? clampRect(current, viewportOf()) : fitRect(current, viewportOf());\n\n    // The gesture handlers are attached once (pointer capture), so they must not close over a\n    // stale rect. A ref mirroring the rendered rect keeps them reading the current geometry.\n    const rectRef = useRef(rect);\n    rectRef.current = rect;\n\n    const commitRect = useCallback(\n      (next: Rect, gesture = true): void => {\n        if (gesture) setPlaced(true);\n        const clamped = clampRect(next, viewportOf());\n        if (clamped.x !== position.x || clamped.y !== position.y) setPosition({ x: clamped.x, y: clamped.y });\n        if (clamped.width !== size.width || clamped.height !== size.height) {\n          setSize({ width: clamped.width, height: clamped.height });\n        }\n      },\n      [clampRect, position.x, position.y, setPosition, setSize, size.height, size.width]\n    );\n\n    const commitRectRef = useRef(commitRect);\n    commitRectRef.current = commitRect;\n\n    // Re-clamp when the viewport shrinks, so a window parked near an edge on a large\n    // screen stays reachable on a small one. Sheet has no such listener, which is why a\n    // dragged sheet survives a viewport shrink oversized.\n    useEffect(() => {\n      if (!open) return undefined;\n      const onViewportResize = (): void => commitRectRef.current(rectRef.current, false);\n      window.addEventListener(\"resize\", onViewportResize);\n      return () => window.removeEventListener(\"resize\", onViewportResize);\n    }, [open]);\n\n    // Escape only while focus is inside this window. FloatingWindow is not an overlay\n    // layer, so `isTopOverlayLayer` (document order, not z-index) would be the wrong\n    // arbiter with several windows open.\n    useEffect(() => {\n      if (!open || !closeOnEsc || !onClose) return undefined;\n      const onKeyDown = (event: KeyboardEvent): void => {\n        if (event.key !== \"Escape\") return;\n        const root = rootRef.current;\n        if (!root || !root.contains(document.activeElement)) return;\n        onClose();\n      };\n      document.addEventListener(\"keydown\", onKeyDown);\n      return () => document.removeEventListener(\"keydown\", onKeyDown);\n    }, [closeOnEsc, onClose, open]);\n\n    const activate = useCallback((): void => {\n      onActivate?.();\n      // Only when focus is elsewhere — an unconditional focus() would steal the caret\n      // from an input inside the window on every raise.\n      const root = rootRef.current;\n      if (root && !root.contains(document.activeElement)) root.focus({ preventScroll: true });\n    }, [onActivate]);\n\n    // Pointer capture keeps `pointermove` flowing to the handle even outside it, so there\n    // are no document-level listeners to leak (Sheet's pattern, not screenDivider's).\n    const move = useRef<{ px: number; py: number; x: number; y: number } | null>(null);\n\n    const onMoveHandlePointerDown = (event: React.PointerEvent<HTMLDivElement>): void => {\n      if (!movable) return;\n      // Header buttons stay clickable.\n      if ((event.target as Element | null)?.closest(\"button,[data-no-drag]\")) return;\n      event.preventDefault();\n      const current = rectRef.current;\n      move.current = { px: event.clientX, py: event.clientY, x: current.x, y: current.y };\n      try {\n        event.currentTarget.setPointerCapture?.(event.pointerId);\n      } catch {\n        /* best-effort */\n      }\n    };\n\n    const onMoveHandlePointerMove = (event: React.PointerEvent<HTMLDivElement>): void => {\n      const start = move.current;\n      if (!start) return;\n      commitRect({\n        ...rectRef.current,\n        x: start.x + event.clientX - start.px,\n        y: start.y + event.clientY - start.py,\n      });\n    };\n\n    const endMove = (event: React.PointerEvent<HTMLDivElement>): void => {\n      if (move.current) {\n        move.current = null;\n        const current = rectRef.current;\n        onMoveEnd?.({ x: current.x, y: current.y });\n      }\n      if (event.currentTarget.hasPointerCapture?.(event.pointerId)) {\n        event.currentTarget.releasePointerCapture?.(event.pointerId);\n      }\n    };\n\n    const resize = useRef<{ dir: FloatingWindowResizeDir; px: number; py: number; rect: Rect } | null>(null);\n\n    const onResizePointerDown = (dir: FloatingWindowResizeDir, event: React.PointerEvent<HTMLDivElement>): void => {\n      event.preventDefault();\n      event.stopPropagation();\n      resize.current = { dir, px: event.clientX, py: event.clientY, rect: rectRef.current };\n      // Grabbing a resize grip is an interaction with the window, so raise it too — the\n      // root handler does not see it because this handler stops propagation.\n      activate();\n      try {\n        event.currentTarget.setPointerCapture?.(event.pointerId);\n      } catch {\n        /* best-effort */\n      }\n    };\n\n    const onResizePointerMove = (event: React.PointerEvent<HTMLDivElement>): void => {\n      const gesture = resize.current;\n      if (!gesture) return;\n      const sign = RESIZE_DIRS[gesture.dir];\n      const dx = event.clientX - gesture.px;\n      const dy = event.clientY - gesture.py;\n      const start = gesture.rect;\n      // A west/north drag moves the origin AND changes the size, so width is recomputed from\n      // the moved edge rather than from the delta alone — otherwise dragging past minWidth\n      // would keep sliding the window instead of stopping at the minimum.\n      //\n      // The size must be clamped to BOTH bounds here, before the origin is derived from it.\n      // Clamping only the minimum and leaving the maximum to commitRect's own clamp would\n      // compute the origin from a width that then gets shrunk, so the edge the user is NOT\n      // dragging would drift away under the cursor.\n      const vp = viewportOf();\n      const maxW = maxWidth ?? vp.width;\n      const maxH = maxHeight ?? vp.height;\n      const width = Math.min(maxW, Math.max(minWidth, start.width + sign.dw * dx));\n      const height = Math.min(maxH, Math.max(minHeight, start.height + sign.dh * dy));\n      commitRect({\n        x: sign.dx ? start.x + start.width - width : start.x,\n        y: sign.dy ? start.y + start.height - height : start.y,\n        width,\n        height,\n      });\n    };\n\n    const endResize = (event: React.PointerEvent<HTMLDivElement>): void => {\n      if (resize.current) {\n        resize.current = null;\n        const current = rectRef.current;\n        onResizeEnd?.({ width: current.width, height: current.height });\n      }\n      if (event.currentTarget.hasPointerCapture?.(event.pointerId)) {\n        event.currentTarget.releasePointerCapture?.(event.pointerId);\n      }\n    };\n\n    /** A keypress is a COMPLETE gesture, so it reports move/resize end as well as the\n     *  per-frame change — otherwise a consumer that persists only on `*End` (the documented\n     *  way to avoid thrashing storage during a drag) would silently never save\n     *  keyboard-driven geometry. */\n    const endKeyboardGesture = (resized: boolean, next: Rect): void => {\n      const current = clampRect(next, viewportOf());\n      if (resized) onResizeEnd?.({ width: current.width, height: current.height });\n      else onMoveEnd?.({ x: current.x, y: current.y });\n    };\n\n    /** Arrows move; Shift+Arrows resize. */\n    const onMoveHandleKeyDown = (event: React.KeyboardEvent<HTMLSpanElement>): void => {\n      const current = rectRef.current;\n      const step = event.shiftKey ? resizeStep : moveStep;\n      const delta: Record<string, [number, number]> = {\n        ArrowLeft: [-step, 0],\n        ArrowRight: [step, 0],\n        ArrowUp: [0, -step],\n        ArrowDown: [0, step],\n      };\n      const d = delta[event.key];\n      if (!d) return;\n      event.preventDefault();\n      const next = event.shiftKey\n        ? { ...current, width: current.width + d[0], height: current.height + d[1] }\n        : { ...current, x: current.x + d[0], y: current.y + d[1] };\n      commitRect(next);\n      endKeyboardGesture(event.shiftKey, next);\n    };\n\n    const onResizeHandleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>): void => {\n      const current = rectRef.current;\n      const vp = viewportOf();\n      let next: Rect;\n      if (event.key === \"ArrowLeft\" || event.key === \"ArrowRight\") {\n        event.preventDefault();\n        const dir = event.key === \"ArrowRight\" ? 1 : -1;\n        next = { ...current, width: current.width + dir * resizeStep };\n      } else if (event.key === \"ArrowUp\" || event.key === \"ArrowDown\") {\n        event.preventDefault();\n        const dir = event.key === \"ArrowDown\" ? 1 : -1;\n        next = { ...current, height: current.height + dir * resizeStep };\n      } else if (event.key === \"Home\") {\n        event.preventDefault();\n        next = { ...current, width: minWidth, height: minHeight };\n      } else if (event.key === \"End\") {\n        event.preventDefault();\n        next = { ...current, width: maxWidth ?? vp.width, height: maxHeight ?? vp.height };\n      } else {\n        return;\n      }\n      commitRect(next);\n      endKeyboardGesture(true, next);\n    };\n\n    const toggleCollapsed = (): void => setCollapsed((prev) => !prev);\n\n    if (!domRoot) {\n      return <></>;\n    }\n\n    const windowStyle: CSSProperties = {\n      left: `${rect.x}px`,\n      top: `${rect.y}px`,\n      width: `${rect.width}px`,\n      ...(collapsed ? {} : { height: `${rect.height}px` }),\n      ...(zIndex === undefined ? {} : { zIndex }),\n      ...(style ?? {}),\n    };\n\n    return createPortal(\n      <CSSTransition\n        in={open}\n        timeout={120}\n        mountOnEnter\n        unmountOnExit\n        appear\n        classNames={{ enterDone: \"smwb-floating-window_entered\" }}\n        nodeRef={rootRef}\n      >\n        <div\n          {...rest}\n          ref={forkedRootRef}\n          data-testid=\"floating-window\"\n          role=\"dialog\"\n          tabIndex={-1}\n          aria-labelledby={title ? titleId : undefined}\n          className={cn(\"smwb-floating-window\", className, { \"smwb-collapsed\": collapsed })}\n          style={windowStyle}\n          onPointerDown={activate}\n        >\n          <div\n            className=\"smwb-floating-window__header\"\n            data-testid=\"floating-window-header\"\n            onPointerDown={onMoveHandlePointerDown}\n            onPointerMove={onMoveHandlePointerMove}\n            onPointerUp={endMove}\n            onPointerCancel={endMove}\n          >\n            {/* The move affordance is the grip, not the header: the header also hosts the\n                collapse/close buttons and any consumer `headerActions`, and nesting those\n                inside a role=\"button\" is an a11y violation. Pointer drag still works\n                anywhere on the header; only the keyboard affordance lives here. */}\n            <span\n              className=\"smwb-floating-window__grip\"\n              data-testid=\"floating-window-move\"\n              role=\"button\"\n              tabIndex={0}\n              aria-label={moveHandleAriaLabel}\n              onKeyDown={onMoveHandleKeyDown}\n            >\n              <Icon name=\"drag_indicator\" />\n            </span>\n            {title ? (\n              <span className=\"smwb-floating-window__title\" id={titleId}>\n                {title}\n              </span>\n            ) : null}\n            <div className=\"smwb-floating-window__actions\" data-no-drag>\n              {headerActions}\n              {collapsible ? (\n                <button\n                  type=\"button\"\n                  className=\"smwb-floating-window__action\"\n                  data-testid=\"floating-window-collapse\"\n                  aria-label={collapsed ? expandAriaLabel : collapseAriaLabel}\n                  aria-expanded={!collapsed}\n                  onClick={toggleCollapsed}\n                >\n                  <Icon name={collapsed ? \"open_in_full\" : \"close_fullscreen\"} />\n                </button>\n              ) : null}\n              {onClose ? (\n                <button\n                  type=\"button\"\n                  className=\"smwb-floating-window__action\"\n                  data-testid=\"floating-window-close\"\n                  aria-label={closeAriaLabel}\n                  onClick={onClose}\n                >\n                  <Icon name=\"close\" />\n                </button>\n              ) : null}\n            </div>\n          </div>\n\n          {!collapsed ? (\n            <div className=\"smwb-floating-window__body\" data-testid=\"floating-window-body\">\n              {children}\n            </div>\n          ) : null}\n\n          {resizable && !collapsed\n            ? RESIZE_ORDER.map((dir) => (\n                <div\n                  key={dir}\n                  className={cn(\"smwb-floating-window__resize\", `smwb-floating-window__resize_${dir}`)}\n                  data-testid={`floating-window-resize-${dir}`}\n                  // Only the south-east grip is reachable by keyboard: eight tab stops per\n                  // window would make Tab unusable once a few windows are open.\n                  {...(dir === \"se\"\n                    ? {\n                        role: \"separator\" as const,\n                        tabIndex: 0,\n                        \"aria-label\": resizeHandleAriaLabel,\n                        \"aria-valuemin\": minWidth,\n                        \"aria-valuemax\": Math.round(maxWidth ?? viewportOf().width),\n                        \"aria-valuenow\": Math.round(rect.width),\n                        onKeyDown: onResizeHandleKeyDown,\n                      }\n                    : { \"aria-hidden\": true, tabIndex: -1 })}\n                  onPointerDown={(event) => onResizePointerDown(dir, event)}\n                  onPointerMove={onResizePointerMove}\n                  onPointerUp={endResize}\n                  onPointerCancel={endResize}\n                />\n              ))\n            : null}\n        </div>\n      </CSSTransition>,\n      domRoot\n    );\n  }\n);\n\nexport default FloatingWindow;\n"],"names":["RESIZE_DIRS","RESIZE_ORDER","viewportOf","DEFAULT_POSITION","DEFAULT_SIZE","FloatingWindow","forwardRef","props","ref","open","title","headerActions","positionProp","defaultPosition","onPositionChange","onMoveEnd","sizeProp","defaultSize","onResize","onResizeEnd","minWidth","minHeight","maxWidth","maxHeight","keepVisible","moveStep","resizeStep","zIndex","onActivate","collapsedProp","defaultCollapsed","onCollapsedChange","collapsible","movable","resizable","closeOnEsc","onClose","moveHandleAriaLabel","resizeHandleAriaLabel","closeAriaLabel","collapseAriaLabel","expandAriaLabel","className","style","children","rest","domRoot","setDomRoot","useState","rootRef","useRef","forkedRootRef","useForkRef","titleId","useId","useSafeLayoutEffect","position","setPosition","useControllableState","size","setSize","collapsed","setCollapsed","clampRect","useCallback","rectIn","vp","maxW","maxH","width","height","keep","x","y","fitRect","clamped","placed","setPlaced","useEffect","current","rect","rectRef","commitRect","next","gesture","commitRectRef","onViewportResize","onKeyDown","event","root","activate","move","onMoveHandlePointerDown","_a","_c","_b","onMoveHandlePointerMove","start","endMove","_d","resize","onResizePointerDown","dir","onResizePointerMove","sign","dx","dy","endResize","endKeyboardGesture","resized","onMoveHandleKeyDown","step","d","onResizeHandleKeyDown","toggleCollapsed","prev","jsx","Fragment","windowStyle","createPortal","CSSTransition","jsxs","cn","Icon"],"mappings":"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"}
+{"version":3,"file":"floatingWindow.js","sources":["../../../../../src/components/layout/floatingWindow/floatingWindow.tsx"],"sourcesContent":["import React, {\n  type CSSProperties,\n  type PropsWithChildren,\n  type ReactNode,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { CSSTransition } from \"react-transition-group\";\nimport cn from \"clsx\";\nimport Icon from \"../../base/icon/icon\";\nimport { useControllableState } from \"../../../hooks/useControllableState\";\nimport { useForkRef } from \"../../../hooks/useForkRef\";\nimport { useSafeLayoutEffect } from \"../../../hooks/useSafeLayoutEffect\";\nimport { hasOverlayLayerAbove } from \"../../../utils/overlayLayer\";\n\nexport interface FloatingWindowPosition {\n  x: number;\n  y: number;\n}\n\nexport interface FloatingWindowSize {\n  width: number;\n  height: number;\n}\n\n/** The eight edge/corner resize directions. */\nexport type FloatingWindowResizeDir = \"n\" | \"s\" | \"e\" | \"w\" | \"ne\" | \"nw\" | \"se\" | \"sw\";\n\nexport interface FloatingWindowProps extends Omit<\n  React.HTMLAttributes<HTMLDivElement>,\n  \"onResize\" | \"title\" | \"children\"\n> {\n  /** Controlled open state of the window. */\n  open: boolean;\n  /** Title bar content. When given, the window is labelled by it. */\n  title?: ReactNode;\n  /** Extra header controls, rendered before the built-in collapse/close buttons. */\n  headerActions?: ReactNode;\n\n  /** Controlled top-left position in viewport px. */\n  position?: FloatingWindowPosition;\n  /** Initial position when uncontrolled. */\n  defaultPosition?: FloatingWindowPosition;\n  /** Called on every move frame and on viewport re-clamp, with the clamped position. */\n  onPositionChange?: (position: FloatingWindowPosition) => void;\n  /** Called once when a move gesture ends — the point at which to persist. */\n  onMoveEnd?: (position: FloatingWindowPosition) => void;\n\n  /** Controlled size in px. */\n  size?: FloatingWindowSize;\n  /** Initial size when uncontrolled. */\n  defaultSize?: FloatingWindowSize;\n  /** Called on every resize frame and on viewport re-clamp, with the clamped size. */\n  onResize?: (size: FloatingWindowSize) => void;\n  /** Called once when a resize gesture ends — the point at which to persist. */\n  onResizeEnd?: (size: FloatingWindowSize) => void;\n\n  /** Minimum width in px (default 200). */\n  minWidth?: number;\n  /** Minimum height in px (default 120). */\n  minHeight?: number;\n  /** Maximum width in px (default: viewport width). */\n  maxWidth?: number;\n  /** Maximum height in px (default: viewport height). */\n  maxHeight?: number;\n  /** Px of the window that must stay inside the viewport (default 56). */\n  keepVisible?: number;\n  /** Step in px for keyboard moving (default 24). */\n  moveStep?: number;\n  /** Step in px for keyboard resizing (default 24). */\n  resizeStep?: number;\n\n  /** Inline stacking order. The host owns z-order across several windows. */\n  zIndex?: number;\n  /** Called on pointerdown anywhere in the window, so the host can raise it. */\n  onActivate?: () => void;\n\n  /** Shade the window down to its title bar. */\n  collapsed?: boolean;\n  /** Initial collapsed state when uncontrolled. */\n  defaultCollapsed?: boolean;\n  onCollapsedChange?: (collapsed: boolean) => void;\n  /** Render the built-in collapse toggle (default true). */\n  collapsible?: boolean;\n\n  /** Allow drag-to-move by the title bar (default true). */\n  movable?: boolean;\n  /** Allow drag-to-resize from the edges and corners (default true). */\n  resizable?: boolean;\n  /** Close on Escape while focus is inside the window (default false). */\n  closeOnEsc?: boolean;\n  onClose?: () => void;\n\n  /** Accessible label for the move handle. */\n  moveHandleAriaLabel?: string;\n  /** Accessible label for the resize handle. */\n  resizeHandleAriaLabel?: string;\n  /** Accessible label for the close button. */\n  closeAriaLabel?: string;\n  /** Accessible label for the collapse toggle while expanded. */\n  collapseAriaLabel?: string;\n  /** Accessible label for the collapse toggle while collapsed. */\n  expandAriaLabel?: string;\n\n  \"aria-label\"?: string;\n  /** Test id of the window's root `<div>`; `floating-window` unless given. */\n  \"data-testid\"?: string;\n}\n\ninterface Rect {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\ninterface Viewport {\n  width: number;\n  height: number;\n}\n\n/** Sign vector per resize direction: how the pointer delta maps onto x/y/width/height. */\nconst RESIZE_DIRS: Record<FloatingWindowResizeDir, { dx: 0 | 1; dy: 0 | 1; dw: -1 | 0 | 1; dh: -1 | 0 | 1 }> = {\n  n: { dx: 0, dy: 1, dw: 0, dh: -1 },\n  s: { dx: 0, dy: 0, dw: 0, dh: 1 },\n  e: { dx: 0, dy: 0, dw: 1, dh: 0 },\n  w: { dx: 1, dy: 0, dw: -1, dh: 0 },\n  ne: { dx: 0, dy: 1, dw: 1, dh: -1 },\n  nw: { dx: 1, dy: 1, dw: -1, dh: -1 },\n  se: { dx: 0, dy: 0, dw: 1, dh: 1 },\n  sw: { dx: 1, dy: 0, dw: -1, dh: 1 },\n};\n\nconst RESIZE_ORDER: FloatingWindowResizeDir[] = [\"n\", \"s\", \"e\", \"w\", \"ne\", \"nw\", \"se\", \"sw\"];\n\nconst viewportOf = (): Viewport =>\n  typeof window === \"undefined\" ? { width: 0, height: 0 } : { width: window.innerWidth, height: window.innerHeight };\n\nconst DEFAULT_POSITION: FloatingWindowPosition = { x: 24, y: 24 };\nconst DEFAULT_SIZE: FloatingWindowSize = { width: 360, height: 420 };\n\n/**\n * Free-floating, non-modal window: draggable by its title bar, resizable from every\n * edge and corner, clamped so a grabbable strip always stays on screen.\n *\n * Unlike Sheet/Modal it is deliberately NOT an overlay layer: no backdrop, no focus\n * trap, no `data-smwb-overlay-layer`. Several windows are meant to be open and usable\n * at once alongside the page behind them, so it must not trap focus, swallow clicks,\n * or steal Escape from a Modal stacked above it. Stacking order is the host's job —\n * pass `zIndex` and raise the window from `onActivate`.\n */\nexport const FloatingWindow = forwardRef<HTMLDivElement, PropsWithChildren<FloatingWindowProps>>(\n  function FloatingWindow(props, ref) {\n    const {\n      open,\n      title,\n      headerActions,\n      position: positionProp,\n      defaultPosition = DEFAULT_POSITION,\n      onPositionChange,\n      onMoveEnd,\n      size: sizeProp,\n      defaultSize = DEFAULT_SIZE,\n      onResize,\n      onResizeEnd,\n      minWidth = 200,\n      minHeight = 120,\n      maxWidth,\n      maxHeight,\n      keepVisible = 56,\n      moveStep = 24,\n      resizeStep = 24,\n      zIndex,\n      onActivate,\n      collapsed: collapsedProp,\n      defaultCollapsed = false,\n      onCollapsedChange,\n      collapsible = true,\n      movable = true,\n      resizable = true,\n      closeOnEsc = false,\n      onClose,\n      moveHandleAriaLabel = \"Move window\",\n      resizeHandleAriaLabel = \"Resize window\",\n      closeAriaLabel = \"Close window\",\n      collapseAriaLabel = \"Collapse window\",\n      expandAriaLabel = \"Expand window\",\n      // The window sets this on its root too; its own handler calls the caller's first.\n      onPointerDown: onPointerDownProp,\n      className,\n      style,\n      children,\n      \"data-testid\": dataTestId = \"floating-window\",\n      ...rest\n    } = props;\n\n    const [domRoot, setDomRoot] = useState<HTMLElement>();\n    const rootRef = useRef<HTMLDivElement>(null);\n    const forkedRootRef = useForkRef<HTMLDivElement>(ref, rootRef);\n    const titleId = useId();\n\n    useSafeLayoutEffect(() => {\n      setDomRoot(document.body);\n    }, []);\n\n    const [position, setPosition] = useControllableState<FloatingWindowPosition>({\n      value: positionProp,\n      defaultValue: defaultPosition,\n      onChange: onPositionChange,\n    });\n    const [size, setSize] = useControllableState<FloatingWindowSize>({\n      value: sizeProp,\n      defaultValue: defaultSize,\n      onChange: onResize,\n    });\n    const [collapsed, setCollapsed] = useControllableState<boolean>({\n      value: collapsedProp,\n      defaultValue: defaultCollapsed,\n      onChange: onCollapsedChange,\n    });\n\n    /**\n     * Size first, then position against the clamped size. `y` is never negative, so the\n     * title bar can never be dragged above the top edge and become ungrabbable — the gap\n     * that makes an off-screen Sheet unrecoverable.\n     */\n    const clampRect = useCallback(\n      (rectIn: Rect, vp: Viewport): Rect => {\n        const maxW = maxWidth ?? vp.width;\n        const maxH = maxHeight ?? vp.height;\n        const width = Math.max(minWidth, Math.min(maxW, rectIn.width));\n        const height = Math.max(minHeight, Math.min(maxH, rectIn.height));\n        const keep = Math.min(keepVisible, width);\n        const x = Math.max(keep - width, Math.min(vp.width - keep, rectIn.x));\n        const y = Math.max(0, Math.min(Math.max(0, vp.height - keep), rectIn.y));\n        return { x, y, width, height };\n      },\n      [keepVisible, maxHeight, maxWidth, minHeight, minWidth]\n    );\n\n    /**\n     * Where a window is placed before anyone touches it: fully inside the viewport when\n     * it fits at all. `clampRect` alone only keeps `keepVisible` px reachable, which is\n     * right for a window the user parked at an edge but wrong on opening — a 760px\n     * default on a 375px phone opened a quarter of a screen off to the right.\n     */\n    const fitRect = useCallback(\n      (rectIn: Rect, vp: Viewport): Rect => {\n        const clamped = clampRect(rectIn, vp);\n        return {\n          ...clamped,\n          x: Math.max(0, Math.min(clamped.x, vp.width - clamped.width)),\n          y: Math.max(0, Math.min(clamped.y, vp.height - clamped.height)),\n        };\n      },\n      [clampRect]\n    );\n\n    // Set by the first move/resize: from then on the user's placement wins and only the\n    // reachability clamp applies, so a window can still be parked half off-screen.\n    const [placed, setPlaced] = useState(false);\n    useEffect(() => {\n      // A closed window forgets that it was moved: opening it again should land on\n      // screen like the first time, whatever the viewport is now.\n      if (!open) setPlaced(false);\n    }, [open]);\n\n    /** The geometry actually rendered. Clamping the CONTROLLED value (not just drag\n     *  frames) means a rect restored from a larger monitor lands on screen immediately. */\n    const current = { x: position.x, y: position.y, width: size.width, height: size.height };\n    const rect = placed ? clampRect(current, viewportOf()) : fitRect(current, viewportOf());\n\n    // The gesture handlers are attached once (pointer capture), so they must not close over a\n    // stale rect. A ref mirroring the rendered rect keeps them reading the current geometry.\n    const rectRef = useRef(rect);\n    rectRef.current = rect;\n\n    const commitRect = useCallback(\n      (next: Rect, gesture = true): void => {\n        if (gesture) setPlaced(true);\n        const clamped = clampRect(next, viewportOf());\n        if (clamped.x !== position.x || clamped.y !== position.y) setPosition({ x: clamped.x, y: clamped.y });\n        if (clamped.width !== size.width || clamped.height !== size.height) {\n          setSize({ width: clamped.width, height: clamped.height });\n        }\n      },\n      [clampRect, position.x, position.y, setPosition, setSize, size.height, size.width]\n    );\n\n    const commitRectRef = useRef(commitRect);\n    commitRectRef.current = commitRect;\n\n    // Re-clamp when the viewport shrinks, so a window parked near an edge on a large\n    // screen stays reachable on a small one. Sheet has no such listener, which is why a\n    // dragged sheet survives a viewport shrink oversized.\n    useEffect(() => {\n      if (!open) return undefined;\n      const onViewportResize = (): void => commitRectRef.current(rectRef.current, false);\n      window.addEventListener(\"resize\", onViewportResize);\n      return () => window.removeEventListener(\"resize\", onViewportResize);\n    }, [open]);\n\n    // Escape only while focus is inside this window. FloatingWindow is not an overlay\n    // layer, so `isTopOverlayLayer` (document order, not z-index) would be the wrong\n    // arbiter with several windows open. An open layer above it, such as a select menu\n    // opened from inside it, takes the Escape first; other windows never do.\n    useEffect(() => {\n      if (!open || !closeOnEsc || !onClose) return undefined;\n      const onKeyDown = (event: KeyboardEvent): void => {\n        // An Escape handled inside the window, e.g. by a menu closing on it, is not the window's.\n        if (event.defaultPrevented) return;\n        if (event.key !== \"Escape\") return;\n        const root = rootRef.current;\n        if (!root || !root.contains(document.activeElement) || hasOverlayLayerAbove(root)) return;\n        onClose();\n      };\n      document.addEventListener(\"keydown\", onKeyDown);\n      return () => document.removeEventListener(\"keydown\", onKeyDown);\n    }, [closeOnEsc, onClose, open]);\n\n    const activate = useCallback((): void => {\n      onActivate?.();\n      // Only when focus is elsewhere — an unconditional focus() would steal the caret\n      // from an input inside the window on every raise.\n      const root = rootRef.current;\n      if (root && !root.contains(document.activeElement)) root.focus({ preventScroll: true });\n    }, [onActivate]);\n\n    const onRootPointerDown = (event: React.PointerEvent<HTMLDivElement>): void => {\n      onPointerDownProp?.(event);\n      activate();\n    };\n\n    // Pointer capture keeps `pointermove` flowing to the handle even outside it, so there\n    // are no document-level listeners to leak (Sheet's pattern, not screenDivider's).\n    const move = useRef<{ px: number; py: number; x: number; y: number } | null>(null);\n\n    const onMoveHandlePointerDown = (event: React.PointerEvent<HTMLDivElement>): void => {\n      if (!movable) return;\n      // Header buttons stay clickable.\n      if ((event.target as Element | null)?.closest(\"button,[data-no-drag]\")) return;\n      event.preventDefault();\n      const current = rectRef.current;\n      move.current = { px: event.clientX, py: event.clientY, x: current.x, y: current.y };\n      try {\n        event.currentTarget.setPointerCapture?.(event.pointerId);\n      } catch {\n        /* best-effort */\n      }\n    };\n\n    const onMoveHandlePointerMove = (event: React.PointerEvent<HTMLDivElement>): void => {\n      const start = move.current;\n      if (!start) return;\n      commitRect({\n        ...rectRef.current,\n        x: start.x + event.clientX - start.px,\n        y: start.y + event.clientY - start.py,\n      });\n    };\n\n    const endMove = (event: React.PointerEvent<HTMLDivElement>): void => {\n      if (move.current) {\n        move.current = null;\n        const current = rectRef.current;\n        onMoveEnd?.({ x: current.x, y: current.y });\n      }\n      if (event.currentTarget.hasPointerCapture?.(event.pointerId)) {\n        event.currentTarget.releasePointerCapture?.(event.pointerId);\n      }\n    };\n\n    const resize = useRef<{ dir: FloatingWindowResizeDir; px: number; py: number; rect: Rect } | null>(null);\n\n    const onResizePointerDown = (dir: FloatingWindowResizeDir, event: React.PointerEvent<HTMLDivElement>): void => {\n      event.preventDefault();\n      event.stopPropagation();\n      resize.current = { dir, px: event.clientX, py: event.clientY, rect: rectRef.current };\n      // Grabbing a resize grip is an interaction with the window, so raise it too — the\n      // root handler does not see it because this handler stops propagation.\n      activate();\n      try {\n        event.currentTarget.setPointerCapture?.(event.pointerId);\n      } catch {\n        /* best-effort */\n      }\n    };\n\n    const onResizePointerMove = (event: React.PointerEvent<HTMLDivElement>): void => {\n      const gesture = resize.current;\n      if (!gesture) return;\n      const sign = RESIZE_DIRS[gesture.dir];\n      const dx = event.clientX - gesture.px;\n      const dy = event.clientY - gesture.py;\n      const start = gesture.rect;\n      // A west/north drag moves the origin AND changes the size, so width is recomputed from\n      // the moved edge rather than from the delta alone — otherwise dragging past minWidth\n      // would keep sliding the window instead of stopping at the minimum.\n      //\n      // The size must be clamped to BOTH bounds here, before the origin is derived from it.\n      // Clamping only the minimum and leaving the maximum to commitRect's own clamp would\n      // compute the origin from a width that then gets shrunk, so the edge the user is NOT\n      // dragging would drift away under the cursor.\n      const vp = viewportOf();\n      const maxW = maxWidth ?? vp.width;\n      const maxH = maxHeight ?? vp.height;\n      const width = Math.min(maxW, Math.max(minWidth, start.width + sign.dw * dx));\n      const height = Math.min(maxH, Math.max(minHeight, start.height + sign.dh * dy));\n      commitRect({\n        x: sign.dx ? start.x + start.width - width : start.x,\n        y: sign.dy ? start.y + start.height - height : start.y,\n        width,\n        height,\n      });\n    };\n\n    const endResize = (event: React.PointerEvent<HTMLDivElement>): void => {\n      if (resize.current) {\n        resize.current = null;\n        const current = rectRef.current;\n        onResizeEnd?.({ width: current.width, height: current.height });\n      }\n      if (event.currentTarget.hasPointerCapture?.(event.pointerId)) {\n        event.currentTarget.releasePointerCapture?.(event.pointerId);\n      }\n    };\n\n    /** A keypress is a COMPLETE gesture, so it reports move/resize end as well as the\n     *  per-frame change — otherwise a consumer that persists only on `*End` (the documented\n     *  way to avoid thrashing storage during a drag) would silently never save\n     *  keyboard-driven geometry. */\n    const endKeyboardGesture = (resized: boolean, next: Rect): void => {\n      const current = clampRect(next, viewportOf());\n      if (resized) onResizeEnd?.({ width: current.width, height: current.height });\n      else onMoveEnd?.({ x: current.x, y: current.y });\n    };\n\n    /** Arrows move; Shift+Arrows resize. */\n    const onMoveHandleKeyDown = (event: React.KeyboardEvent<HTMLSpanElement>): void => {\n      const current = rectRef.current;\n      const step = event.shiftKey ? resizeStep : moveStep;\n      const delta: Record<string, [number, number]> = {\n        ArrowLeft: [-step, 0],\n        ArrowRight: [step, 0],\n        ArrowUp: [0, -step],\n        ArrowDown: [0, step],\n      };\n      const d = delta[event.key];\n      if (!d) return;\n      event.preventDefault();\n      const next = event.shiftKey\n        ? { ...current, width: current.width + d[0], height: current.height + d[1] }\n        : { ...current, x: current.x + d[0], y: current.y + d[1] };\n      commitRect(next);\n      endKeyboardGesture(event.shiftKey, next);\n    };\n\n    const onResizeHandleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>): void => {\n      const current = rectRef.current;\n      const vp = viewportOf();\n      let next: Rect;\n      if (event.key === \"ArrowLeft\" || event.key === \"ArrowRight\") {\n        event.preventDefault();\n        const dir = event.key === \"ArrowRight\" ? 1 : -1;\n        next = { ...current, width: current.width + dir * resizeStep };\n      } else if (event.key === \"ArrowUp\" || event.key === \"ArrowDown\") {\n        event.preventDefault();\n        const dir = event.key === \"ArrowDown\" ? 1 : -1;\n        next = { ...current, height: current.height + dir * resizeStep };\n      } else if (event.key === \"Home\") {\n        event.preventDefault();\n        next = { ...current, width: minWidth, height: minHeight };\n      } else if (event.key === \"End\") {\n        event.preventDefault();\n        next = { ...current, width: maxWidth ?? vp.width, height: maxHeight ?? vp.height };\n      } else {\n        return;\n      }\n      commitRect(next);\n      endKeyboardGesture(true, next);\n    };\n\n    const toggleCollapsed = (): void => setCollapsed((prev) => !prev);\n\n    if (!domRoot) {\n      return <></>;\n    }\n\n    const windowStyle: CSSProperties = {\n      left: `${rect.x}px`,\n      top: `${rect.y}px`,\n      width: `${rect.width}px`,\n      ...(collapsed ? {} : { height: `${rect.height}px` }),\n      ...(zIndex === undefined ? {} : { zIndex }),\n      ...(style ?? {}),\n    };\n\n    return createPortal(\n      <CSSTransition\n        in={open}\n        timeout={120}\n        mountOnEnter\n        unmountOnExit\n        appear\n        classNames={{ enterDone: \"smwb-floating-window_entered\" }}\n        nodeRef={rootRef}\n      >\n        <div\n          {...rest}\n          ref={forkedRootRef}\n          data-testid={dataTestId}\n          role=\"dialog\"\n          tabIndex={-1}\n          // Labelled by its title when it has one; without, the caller's own stays.\n          aria-labelledby={title ? titleId : rest[\"aria-labelledby\"]}\n          className={cn(\"smwb-floating-window\", className, { \"smwb-collapsed\": collapsed })}\n          style={windowStyle}\n          onPointerDown={onRootPointerDown}\n        >\n          <div\n            className=\"smwb-floating-window__header\"\n            data-testid=\"floating-window-header\"\n            onPointerDown={onMoveHandlePointerDown}\n            onPointerMove={onMoveHandlePointerMove}\n            onPointerUp={endMove}\n            onPointerCancel={endMove}\n          >\n            {/* The move affordance is the grip, not the header: the header also hosts the\n                collapse/close buttons and any consumer `headerActions`, and nesting those\n                inside a role=\"button\" is an a11y violation. Pointer drag still works\n                anywhere on the header; only the keyboard affordance lives here. */}\n            <span\n              className=\"smwb-floating-window__grip\"\n              data-testid=\"floating-window-move\"\n              role=\"button\"\n              tabIndex={0}\n              aria-label={moveHandleAriaLabel}\n              onKeyDown={onMoveHandleKeyDown}\n            >\n              <Icon name=\"drag_indicator\" />\n            </span>\n            {title ? (\n              <span className=\"smwb-floating-window__title\" id={titleId}>\n                {title}\n              </span>\n            ) : null}\n            <div className=\"smwb-floating-window__actions\" data-no-drag>\n              {headerActions}\n              {collapsible ? (\n                <button\n                  type=\"button\"\n                  className=\"smwb-floating-window__action\"\n                  data-testid=\"floating-window-collapse\"\n                  aria-label={collapsed ? expandAriaLabel : collapseAriaLabel}\n                  aria-expanded={!collapsed}\n                  onClick={toggleCollapsed}\n                >\n                  <Icon name={collapsed ? \"open_in_full\" : \"close_fullscreen\"} />\n                </button>\n              ) : null}\n              {onClose ? (\n                <button\n                  type=\"button\"\n                  className=\"smwb-floating-window__action\"\n                  data-testid=\"floating-window-close\"\n                  aria-label={closeAriaLabel}\n                  onClick={onClose}\n                >\n                  <Icon name=\"close\" />\n                </button>\n              ) : null}\n            </div>\n          </div>\n\n          {!collapsed ? (\n            <div className=\"smwb-floating-window__body\" data-testid=\"floating-window-body\">\n              {children}\n            </div>\n          ) : null}\n\n          {resizable && !collapsed\n            ? RESIZE_ORDER.map((dir) => (\n                <div\n                  key={dir}\n                  className={cn(\"smwb-floating-window__resize\", `smwb-floating-window__resize_${dir}`)}\n                  data-testid={`floating-window-resize-${dir}`}\n                  // Only the south-east grip is reachable by keyboard: eight tab stops per\n                  // window would make Tab unusable once a few windows are open.\n                  {...(dir === \"se\"\n                    ? {\n                        role: \"separator\" as const,\n                        tabIndex: 0,\n                        \"aria-label\": resizeHandleAriaLabel,\n                        \"aria-valuemin\": minWidth,\n                        \"aria-valuemax\": Math.round(maxWidth ?? viewportOf().width),\n                        \"aria-valuenow\": Math.round(rect.width),\n                        onKeyDown: onResizeHandleKeyDown,\n                      }\n                    : { \"aria-hidden\": true, tabIndex: -1 })}\n                  onPointerDown={(event) => onResizePointerDown(dir, event)}\n                  onPointerMove={onResizePointerMove}\n                  onPointerUp={endResize}\n                  onPointerCancel={endResize}\n                />\n              ))\n            : null}\n        </div>\n      </CSSTransition>,\n      domRoot\n    );\n  }\n);\n\nexport default FloatingWindow;\n"],"names":["RESIZE_DIRS","RESIZE_ORDER","viewportOf","DEFAULT_POSITION","DEFAULT_SIZE","FloatingWindow","forwardRef","props","ref","open","title","headerActions","positionProp","defaultPosition","onPositionChange","onMoveEnd","sizeProp","defaultSize","onResize","onResizeEnd","minWidth","minHeight","maxWidth","maxHeight","keepVisible","moveStep","resizeStep","zIndex","onActivate","collapsedProp","defaultCollapsed","onCollapsedChange","collapsible","movable","resizable","closeOnEsc","onClose","moveHandleAriaLabel","resizeHandleAriaLabel","closeAriaLabel","collapseAriaLabel","expandAriaLabel","onPointerDownProp","className","style","children","dataTestId","rest","domRoot","setDomRoot","useState","rootRef","useRef","forkedRootRef","useForkRef","titleId","useId","useSafeLayoutEffect","position","setPosition","useControllableState","size","setSize","collapsed","setCollapsed","clampRect","useCallback","rectIn","vp","maxW","maxH","width","height","keep","x","y","fitRect","clamped","placed","setPlaced","useEffect","current","rect","rectRef","commitRect","next","gesture","commitRectRef","onViewportResize","onKeyDown","event","root","hasOverlayLayerAbove","activate","onRootPointerDown","move","onMoveHandlePointerDown","_a","_c","_b","onMoveHandlePointerMove","start","endMove","_d","resize","onResizePointerDown","dir","onResizePointerMove","sign","dx","dy","endResize","endKeyboardGesture","resized","onMoveHandleKeyDown","step","d","onResizeHandleKeyDown","toggleCollapsed","prev","jsx","Fragment","windowStyle","createPortal","CSSTransition","jsxs","cn","Icon"],"mappings":"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"}

package/dist/headless/components/layout/grid/grid.js

@@ -1,58 +1,73 @@
 import { jsx as w } from "react/jsx-runtime";
 import _ from "react";
 import u from "clsx";
-const j = _.forwardRef(function({ className: r, ...s }, o) {
-  return /* @__PURE__ */ w("div", { ref: o, "data-testid": "grid", className: u("smwb-grid", r), ...s });
-}), p = ["wrap", "nowrap", "wrap-reverse"], v = [
+const k = _.forwardRef(function({ className: r, "data-testid": s = "grid", ...e }, t) {
+  return /* @__PURE__ */ w("div", { ref: t, "data-testid": s, className: u("smwb-grid", r), ...e });
+}), v = ["wrap", "nowrap", "wrap-reverse"], x = [
   "flex-start",
   "center",
   "flex-end",
   "space-between",
   "space-around",
   "space-evenly"
-], x = ["flex-start", "center", "flex-end", "stretch", "baseline"], R = ["row", "row-reverse", "column", "column-reverse"], k = _.forwardRef(function({ className: r, justifyContent: s, alignItems: o, direction: n, wrap: t, spacing: i, ...c }, m) {
-  const l = s && v.includes(s) && s !== "flex-start", d = o && x.includes(o) && o !== "flex-start", a = n && R.includes(n) && n !== "row", f = t && p.includes(t) && t !== "wrap", g = u("smwb-grid__row", r, {
+], R = ["flex-start", "center", "flex-end", "stretch", "baseline"], C = ["row", "row-reverse", "column", "column-reverse"], A = _.forwardRef(function({ className: r, justifyContent: s, alignItems: e, direction: t, wrap: n, spacing: i, "data-testid": c = "grid-row", ...d }, a) {
+  const m = s && x.includes(s) && s !== "flex-start", l = e && R.includes(e) && e !== "flex-start", f = t && C.includes(t) && t !== "row", g = n && v.includes(n) && n !== "wrap", b = u("smwb-grid__row", r, {
     [`smwb-grid__row--spacing-${i}`]: i,
-    [`smwb-grid__row--justifyContent-${s}`]: l,
-    [`smwb-grid__row--alignItems-${o}`]: d,
-    [`smwb-grid__row--direction-${n}`]: a,
-    [`smwb-grid__row--${t}`]: f
+    [`smwb-grid__row--justifyContent-${s}`]: m,
+    [`smwb-grid__row--alignItems-${e}`]: l,
+    [`smwb-grid__row--direction-${t}`]: f,
+    [`smwb-grid__row--${n}`]: g
   });
-  return /* @__PURE__ */ w("div", { ref: m, "data-testid": "grid-row", className: g, ...c });
-}), C = (e) => e === void 0 ? {} : typeof e == "boolean" ? { "smwb-grid__column--hidden": e } : Object.keys(e).reduce((r, s) => (r[`smwb-grid__column--hidden-${s}`] = e[s] === !0, r[`smwb-grid__column--visible-${s}`] = e[s] === !1, r), {}), A = _.forwardRef(function({ className: r, xs: s, sm: o, md: n, lg: t, xl: i, xsOffset: c, smOffset: m, mdOffset: l, lgOffset: d, xlOffset: a, hidden: f, ...g }, b) {
-  const $ = u("smwb-grid__column", r, {
+  return /* @__PURE__ */ w("div", { ref: a, "data-testid": c, className: b, ...d });
+}), N = (o) => o === void 0 ? {} : typeof o == "boolean" ? { "smwb-grid__column--hidden": o } : Object.keys(o).reduce((r, s) => (r[`smwb-grid__column--hidden-${s}`] = o[s] === !0, r[`smwb-grid__column--visible-${s}`] = o[s] === !1, r), {}), D = _.forwardRef(function({
+  className: r,
+  xs: s,
+  sm: e,
+  md: t,
+  lg: n,
+  xl: i,
+  xsOffset: c,
+  smOffset: d,
+  mdOffset: a,
+  lgOffset: m,
+  xlOffset: l,
+  hidden: f,
+  "data-testid": g = "grid-col",
+  ...b
+}, $) {
+  const p = u("smwb-grid__column", r, {
     [`smwb-grid__column--xs-${s}`]: s,
-    [`smwb-grid__column--sm-${o}`]: o,
-    [`smwb-grid__column--md-${n}`]: n,
-    [`smwb-grid__column--lg-${t}`]: t,
+    [`smwb-grid__column--sm-${e}`]: e,
+    [`smwb-grid__column--md-${t}`]: t,
+    [`smwb-grid__column--lg-${n}`]: n,
     [`smwb-grid__column--xl-${i}`]: i,
     [`smwb-grid__column--xs-offset-${c}`]: c,
-    [`smwb-grid__column--sm-offset-${m}`]: m,
-    [`smwb-grid__column--md-offset-${l}`]: l,
-    [`smwb-grid__column--lg-offset-${d}`]: d,
-    [`smwb-grid__column--xl-offset-${a}`]: a,
-    ...C(f)
+    [`smwb-grid__column--sm-offset-${d}`]: d,
+    [`smwb-grid__column--md-offset-${a}`]: a,
+    [`smwb-grid__column--lg-offset-${m}`]: m,
+    [`smwb-grid__column--xl-offset-${l}`]: l,
+    ...N(f)
   });
-  return /* @__PURE__ */ w("div", { ref: b, className: $, "data-testid": "grid-col", ...g });
-}), D = _.forwardRef(function({ className: r, maxWidth: s = "lg", disableGutters: o = !1, ...n }, t) {
-  const i = u(
+  return /* @__PURE__ */ w("div", { ref: $, className: p, "data-testid": g, ...b });
+}), F = _.forwardRef(function({ className: r, maxWidth: s = "lg", disableGutters: e = !1, "data-testid": t = "grid-container", ...n }, i) {
+  const c = u(
     "smwb-container",
     {
       [`smwb-container--${s}`]: s !== !1,
-      "smwb-container--gutterless": o
+      "smwb-container--gutterless": e
     },
     r
   );
-  return /* @__PURE__ */ w("div", { ref: t, "data-testid": "grid-container", className: i, ...n });
+  return /* @__PURE__ */ w("div", { ref: i, "data-testid": t, className: c, ...n });
 });
 export {
-  A as Column,
-  D as Container,
-  j as Grid,
-  k as Row,
-  x as alignItemsOptions,
-  R as directionOptions,
-  v as justifyContentOptions,
-  p as wrapOptions
+  D as Column,
+  F as Container,
+  k as Grid,
+  A as Row,
+  R as alignItemsOptions,
+  C as directionOptions,
+  x as justifyContentOptions,
+  v as wrapOptions
 };
 //# sourceMappingURL=grid.js.map

package/dist/headless/components/layout/grid/grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid.js","sources":["../../../../../src/components/layout/grid/grid.tsx"],"sourcesContent":["import React from \"react\";\nimport cn from \"clsx\";\n\nexport const Grid = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(function Grid(\n  { className, ...rest },\n  ref\n) {\n  return <div ref={ref} data-testid=\"grid\" className={cn(\"smwb-grid\", className)} {...rest} />;\n});\n\nexport type ColumnSpan = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;\n/** Column width per breakpoint: 1–12 grid units, `\"auto\"` (fit content) or `true` (fill remaining). */\nexport type BreakpointType = ColumnSpan | \"auto\" | true;\n/** Column offset (empty leading columns) per breakpoint: 0–11. */\nexport type OffsetType = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11;\nexport type Breakpoint = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type ResponsiveBool = boolean | Partial<Record<Breakpoint, boolean>>;\n\nexport const wrapOptions = [\"wrap\", \"nowrap\", \"wrap-reverse\"] as const;\nexport const justifyContentOptions = [\n  \"flex-start\",\n  \"center\",\n  \"flex-end\",\n  \"space-between\",\n  \"space-around\",\n  \"space-evenly\",\n] as const;\nexport const alignItemsOptions = [\"flex-start\", \"center\", \"flex-end\", \"stretch\", \"baseline\"] as const;\nexport const directionOptions = [\"row\", \"row-reverse\", \"column\", \"column-reverse\"] as const;\n\nexport interface RowProps extends React.HTMLAttributes<HTMLDivElement> {\n  wrap?: (typeof wrapOptions)[number];\n  justifyContent?: (typeof justifyContentOptions)[number];\n  alignItems?: (typeof alignItemsOptions)[number];\n  direction?: (typeof directionOptions)[number];\n  spacing?: number;\n}\n\nexport const Row = React.forwardRef<HTMLDivElement, RowProps>(function Row(\n  { className, justifyContent, alignItems, direction, wrap, spacing, ...rest },\n  ref\n) {\n  const isJustifyContent =\n    justifyContent && justifyContentOptions.includes(justifyContent) && justifyContent !== \"flex-start\";\n  const isAlignItems = alignItems && alignItemsOptions.includes(alignItems) && alignItems !== \"flex-start\";\n  const isDirection = direction && directionOptions.includes(direction) && direction !== \"row\";\n  const isFlexWrap = wrap && wrapOptions.includes(wrap) && wrap !== \"wrap\";\n\n  const classes = cn(\"smwb-grid__row\", className, {\n    [`smwb-grid__row--spacing-${spacing}`]: spacing,\n    [`smwb-grid__row--justifyContent-${justifyContent}`]: isJustifyContent,\n    [`smwb-grid__row--alignItems-${alignItems}`]: isAlignItems,\n    [`smwb-grid__row--direction-${direction}`]: isDirection,\n    [`smwb-grid__row--${wrap}`]: isFlexWrap,\n  });\n\n  return <div ref={ref} data-testid=\"grid-row\" className={classes} {...rest} />;\n});\n\nexport type ColumnProps = React.HTMLAttributes<HTMLDivElement> & {\n  /** Ширина на точке остановы: 1–12 из 12, `\"auto\"` (по контенту) или `true` (заполнить). */\n  xs?: BreakpointType;\n  sm?: BreakpointType;\n  md?: BreakpointType;\n  lg?: BreakpointType;\n  xl?: BreakpointType;\n  /** Сдвиг (пустые ведущие колонки) на точке остановы, 0–11. */\n  xsOffset?: OffsetType;\n  smOffset?: OffsetType;\n  mdOffset?: OffsetType;\n  lgOffset?: OffsetType;\n  xlOffset?: OffsetType;\n  /** Скрыть колонку: булево (всегда) или по точкам остановы `{ xs:true, md:false }`. */\n  hidden?: ResponsiveBool;\n};\n\nconst hiddenClasses = (hidden?: ResponsiveBool) => {\n  if (hidden === undefined) {\n    return {};\n  }\n  if (typeof hidden === \"boolean\") {\n    return { \"smwb-grid__column--hidden\": hidden };\n  }\n  return (Object.keys(hidden) as Breakpoint[]).reduce<Record<string, boolean>>((acc, bp) => {\n    acc[`smwb-grid__column--hidden-${bp}`] = hidden[bp] === true;\n    acc[`smwb-grid__column--visible-${bp}`] = hidden[bp] === false;\n    return acc;\n  }, {});\n};\n\nexport const Column = React.forwardRef<HTMLDivElement, ColumnProps>(function Column(\n  { className, xs, sm, md, lg, xl, xsOffset, smOffset, mdOffset, lgOffset, xlOffset, hidden, ...rest },\n  ref\n) {\n  const classes = cn(\"smwb-grid__column\", className, {\n    [`smwb-grid__column--xs-${xs}`]: xs,\n    [`smwb-grid__column--sm-${sm}`]: sm,\n    [`smwb-grid__column--md-${md}`]: md,\n    [`smwb-grid__column--lg-${lg}`]: lg,\n    [`smwb-grid__column--xl-${xl}`]: xl,\n    [`smwb-grid__column--xs-offset-${xsOffset}`]: xsOffset,\n    [`smwb-grid__column--sm-offset-${smOffset}`]: smOffset,\n    [`smwb-grid__column--md-offset-${mdOffset}`]: mdOffset,\n    [`smwb-grid__column--lg-offset-${lgOffset}`]: lgOffset,\n    [`smwb-grid__column--xl-offset-${xlOffset}`]: xlOffset,\n    ...hiddenClasses(hidden),\n  });\n\n  return <div ref={ref} className={classes} data-testid=\"grid-col\" {...rest} />;\n});\n\nexport type ContainerMaxWidth = \"sm\" | \"md\" | \"lg\" | \"xl\" | false;\nexport interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Max-width breakpoint cap; `false` = fluid full width. */\n  maxWidth?: ContainerMaxWidth;\n  /** Remove horizontal gutters. */\n  disableGutters?: boolean;\n}\n\nexport const Container = React.forwardRef<HTMLDivElement, ContainerProps>(function Container(\n  { className, maxWidth = \"lg\", disableGutters = false, ...rest },\n  ref\n) {\n  const classes = cn(\n    \"smwb-container\",\n    {\n      [`smwb-container--${maxWidth}`]: maxWidth !== false,\n      \"smwb-container--gutterless\": disableGutters,\n    },\n    className\n  );\n  return <div ref={ref} data-testid=\"grid-container\" className={classes} {...rest} />;\n});\n"],"names":["Grid","React","className","rest","ref","jsx","cn","wrapOptions","justifyContentOptions","alignItemsOptions","directionOptions","Row","justifyContent","alignItems","direction","wrap","spacing","isJustifyContent","isAlignItems","isDirection","isFlexWrap","classes","hiddenClasses","hidden","acc","bp","Column","xs","sm","md","lg","xl","xsOffset","smOffset","mdOffset","lgOffset","xlOffset","Container","maxWidth","disableGutters"],"mappings":";;;AAGO,MAAMA,IAAOC,EAAM,WAAiE,SACzF,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAChBC,GACA;AACA,SAAO,gBAAAC,EAAC,OAAA,EAAI,KAAAD,GAAU,eAAY,QAAO,WAAWE,EAAG,aAAaJ,CAAS,GAAI,GAAGC,EAAA,CAAM;AAC5F,CAAC,GAUYI,IAAc,CAAC,QAAQ,UAAU,cAAc,GAC/CC,IAAwB;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GACaC,IAAoB,CAAC,cAAc,UAAU,YAAY,WAAW,UAAU,GAC9EC,IAAmB,CAAC,OAAO,eAAe,UAAU,gBAAgB,GAUpEC,IAAMV,EAAM,WAAqC,SAC5D,EAAE,WAAAC,GAAW,gBAAAU,GAAgB,YAAAC,GAAY,WAAAC,GAAW,MAAAC,GAAM,SAAAC,GAAS,GAAGb,EAAA,GACtEC,GACA;AACA,QAAMa,IACJL,KAAkBJ,EAAsB,SAASI,CAAc,KAAKA,MAAmB,cACnFM,IAAeL,KAAcJ,EAAkB,SAASI,CAAU,KAAKA,MAAe,cACtFM,IAAcL,KAAaJ,EAAiB,SAASI,CAAS,KAAKA,MAAc,OACjFM,IAAaL,KAAQR,EAAY,SAASQ,CAAI,KAAKA,MAAS,QAE5DM,IAAUf,EAAG,kBAAkBJ,GAAW;AAAA,IAC9C,CAAC,2BAA2Bc,CAAO,EAAE,GAAGA;AAAA,IACxC,CAAC,kCAAkCJ,CAAc,EAAE,GAAGK;AAAA,IACtD,CAAC,8BAA8BJ,CAAU,EAAE,GAAGK;AAAA,IAC9C,CAAC,6BAA6BJ,CAAS,EAAE,GAAGK;AAAA,IAC5C,CAAC,mBAAmBJ,CAAI,EAAE,GAAGK;AAAA,EAAA,CAC9B;AAED,SAAO,gBAAAf,EAAC,SAAI,KAAAD,GAAU,eAAY,YAAW,WAAWiB,GAAU,GAAGlB,GAAM;AAC7E,CAAC,GAmBKmB,IAAgB,CAACC,MACjBA,MAAW,SACN,CAAA,IAEL,OAAOA,KAAW,YACb,EAAE,6BAA6BA,EAAA,IAEhC,OAAO,KAAKA,CAAM,EAAmB,OAAgC,CAACC,GAAKC,OACjFD,EAAI,6BAA6BC,CAAE,EAAE,IAAIF,EAAOE,CAAE,MAAM,IACxDD,EAAI,8BAA8BC,CAAE,EAAE,IAAIF,EAAOE,CAAE,MAAM,IAClDD,IACN,CAAA,CAAE,GAGME,IAASzB,EAAM,WAAwC,SAClE,EAAE,WAAAC,GAAW,IAAAyB,GAAI,IAAAC,GAAI,IAAAC,GAAI,IAAAC,GAAI,IAAAC,GAAI,UAAAC,GAAU,UAAAC,GAAU,UAAAC,GAAU,UAAAC,GAAU,UAAAC,GAAU,QAAAb,GAAQ,GAAGpB,EAAA,GAC9FC,GACA;AACA,QAAMiB,IAAUf,EAAG,qBAAqBJ,GAAW;AAAA,IACjD,CAAC,yBAAyByB,CAAE,EAAE,GAAGA;AAAA,IACjC,CAAC,yBAAyBC,CAAE,EAAE,GAAGA;AAAA,IACjC,CAAC,yBAAyBC,CAAE,EAAE,GAAGA;AAAA,IACjC,CAAC,yBAAyBC,CAAE,EAAE,GAAGA;AAAA,IACjC,CAAC,yBAAyBC,CAAE,EAAE,GAAGA;AAAA,IACjC,CAAC,gCAAgCC,CAAQ,EAAE,GAAGA;AAAA,IAC9C,CAAC,gCAAgCC,CAAQ,EAAE,GAAGA;AAAA,IAC9C,CAAC,gCAAgCC,CAAQ,EAAE,GAAGA;AAAA,IAC9C,CAAC,gCAAgCC,CAAQ,EAAE,GAAGA;AAAA,IAC9C,CAAC,gCAAgCC,CAAQ,EAAE,GAAGA;AAAA,IAC9C,GAAGd,EAAcC,CAAM;AAAA,EAAA,CACxB;AAED,SAAO,gBAAAlB,EAAC,SAAI,KAAAD,GAAU,WAAWiB,GAAS,eAAY,YAAY,GAAGlB,GAAM;AAC7E,CAAC,GAUYkC,IAAYpC,EAAM,WAA2C,SACxE,EAAE,WAAAC,GAAW,UAAAoC,IAAW,MAAM,gBAAAC,IAAiB,IAAO,GAAGpC,EAAA,GACzDC,GACA;AACA,QAAMiB,IAAUf;AAAA,IACd;AAAA,IACA;AAAA,MACE,CAAC,mBAAmBgC,CAAQ,EAAE,GAAGA,MAAa;AAAA,MAC9C,8BAA8BC;AAAA,IAAA;AAAA,IAEhCrC;AAAA,EAAA;AAEF,SAAO,gBAAAG,EAAC,SAAI,KAAAD,GAAU,eAAY,kBAAiB,WAAWiB,GAAU,GAAGlB,GAAM;AACnF,CAAC;"}
+{"version":3,"file":"grid.js","sources":["../../../../../src/components/layout/grid/grid.tsx"],"sourcesContent":["import React from \"react\";\nimport cn from \"clsx\";\n\ntype DivProps = React.HTMLAttributes<HTMLDivElement> & {\n  /** Test id of the root `<div>`; `grid` unless given. */\n  \"data-testid\"?: string;\n};\n\nexport const Grid = React.forwardRef<HTMLDivElement, DivProps>(function Grid(\n  { className, \"data-testid\": dataTestId = \"grid\", ...rest },\n  ref\n) {\n  return <div ref={ref} data-testid={dataTestId} className={cn(\"smwb-grid\", className)} {...rest} />;\n});\n\nexport type ColumnSpan = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;\n/** Column width per breakpoint: 1–12 grid units, `\"auto\"` (fit content) or `true` (fill remaining). */\nexport type BreakpointType = ColumnSpan | \"auto\" | true;\n/** Column offset (empty leading columns) per breakpoint: 0–11. */\nexport type OffsetType = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11;\nexport type Breakpoint = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type ResponsiveBool = boolean | Partial<Record<Breakpoint, boolean>>;\n\nexport const wrapOptions = [\"wrap\", \"nowrap\", \"wrap-reverse\"] as const;\nexport const justifyContentOptions = [\n  \"flex-start\",\n  \"center\",\n  \"flex-end\",\n  \"space-between\",\n  \"space-around\",\n  \"space-evenly\",\n] as const;\nexport const alignItemsOptions = [\"flex-start\", \"center\", \"flex-end\", \"stretch\", \"baseline\"] as const;\nexport const directionOptions = [\"row\", \"row-reverse\", \"column\", \"column-reverse\"] as const;\n\nexport interface RowProps extends React.HTMLAttributes<HTMLDivElement> {\n  wrap?: (typeof wrapOptions)[number];\n  justifyContent?: (typeof justifyContentOptions)[number];\n  alignItems?: (typeof alignItemsOptions)[number];\n  direction?: (typeof directionOptions)[number];\n  spacing?: number;\n  /** Test id of the root `<div>`; `grid-row` unless given. */\n  \"data-testid\"?: string;\n}\n\nexport const Row = React.forwardRef<HTMLDivElement, RowProps>(function Row(\n  { className, justifyContent, alignItems, direction, wrap, spacing, \"data-testid\": dataTestId = \"grid-row\", ...rest },\n  ref\n) {\n  const isJustifyContent =\n    justifyContent && justifyContentOptions.includes(justifyContent) && justifyContent !== \"flex-start\";\n  const isAlignItems = alignItems && alignItemsOptions.includes(alignItems) && alignItems !== \"flex-start\";\n  const isDirection = direction && directionOptions.includes(direction) && direction !== \"row\";\n  const isFlexWrap = wrap && wrapOptions.includes(wrap) && wrap !== \"wrap\";\n\n  const classes = cn(\"smwb-grid__row\", className, {\n    [`smwb-grid__row--spacing-${spacing}`]: spacing,\n    [`smwb-grid__row--justifyContent-${justifyContent}`]: isJustifyContent,\n    [`smwb-grid__row--alignItems-${alignItems}`]: isAlignItems,\n    [`smwb-grid__row--direction-${direction}`]: isDirection,\n    [`smwb-grid__row--${wrap}`]: isFlexWrap,\n  });\n\n  return <div ref={ref} data-testid={dataTestId} className={classes} {...rest} />;\n});\n\nexport type ColumnProps = React.HTMLAttributes<HTMLDivElement> & {\n  /** Ширина на точке остановы: 1–12 из 12, `\"auto\"` (по контенту) или `true` (заполнить). */\n  xs?: BreakpointType;\n  sm?: BreakpointType;\n  md?: BreakpointType;\n  lg?: BreakpointType;\n  xl?: BreakpointType;\n  /** Сдвиг (пустые ведущие колонки) на точке остановы, 0–11. */\n  xsOffset?: OffsetType;\n  smOffset?: OffsetType;\n  mdOffset?: OffsetType;\n  lgOffset?: OffsetType;\n  xlOffset?: OffsetType;\n  /** Скрыть колонку: булево (всегда) или по точкам остановы `{ xs:true, md:false }`. */\n  hidden?: ResponsiveBool;\n  /** Test id of the root `<div>`; `grid-col` unless given. */\n  \"data-testid\"?: string;\n};\n\nconst hiddenClasses = (hidden?: ResponsiveBool) => {\n  if (hidden === undefined) {\n    return {};\n  }\n  if (typeof hidden === \"boolean\") {\n    return { \"smwb-grid__column--hidden\": hidden };\n  }\n  return (Object.keys(hidden) as Breakpoint[]).reduce<Record<string, boolean>>((acc, bp) => {\n    acc[`smwb-grid__column--hidden-${bp}`] = hidden[bp] === true;\n    acc[`smwb-grid__column--visible-${bp}`] = hidden[bp] === false;\n    return acc;\n  }, {});\n};\n\nexport const Column = React.forwardRef<HTMLDivElement, ColumnProps>(function Column(\n  {\n    className,\n    xs,\n    sm,\n    md,\n    lg,\n    xl,\n    xsOffset,\n    smOffset,\n    mdOffset,\n    lgOffset,\n    xlOffset,\n    hidden,\n    \"data-testid\": dataTestId = \"grid-col\",\n    ...rest\n  },\n  ref\n) {\n  const classes = cn(\"smwb-grid__column\", className, {\n    [`smwb-grid__column--xs-${xs}`]: xs,\n    [`smwb-grid__column--sm-${sm}`]: sm,\n    [`smwb-grid__column--md-${md}`]: md,\n    [`smwb-grid__column--lg-${lg}`]: lg,\n    [`smwb-grid__column--xl-${xl}`]: xl,\n    [`smwb-grid__column--xs-offset-${xsOffset}`]: xsOffset,\n    [`smwb-grid__column--sm-offset-${smOffset}`]: smOffset,\n    [`smwb-grid__column--md-offset-${mdOffset}`]: mdOffset,\n    [`smwb-grid__column--lg-offset-${lgOffset}`]: lgOffset,\n    [`smwb-grid__column--xl-offset-${xlOffset}`]: xlOffset,\n    ...hiddenClasses(hidden),\n  });\n\n  return <div ref={ref} className={classes} data-testid={dataTestId} {...rest} />;\n});\n\nexport type ContainerMaxWidth = \"sm\" | \"md\" | \"lg\" | \"xl\" | false;\nexport interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Max-width breakpoint cap; `false` = fluid full width. */\n  maxWidth?: ContainerMaxWidth;\n  /** Remove horizontal gutters. */\n  disableGutters?: boolean;\n  /** Test id of the root `<div>`; `grid-container` unless given. */\n  \"data-testid\"?: string;\n}\n\nexport const Container = React.forwardRef<HTMLDivElement, ContainerProps>(function Container(\n  { className, maxWidth = \"lg\", disableGutters = false, \"data-testid\": dataTestId = \"grid-container\", ...rest },\n  ref\n) {\n  const classes = cn(\n    \"smwb-container\",\n    {\n      [`smwb-container--${maxWidth}`]: maxWidth !== false,\n      \"smwb-container--gutterless\": disableGutters,\n    },\n    className\n  );\n  return <div ref={ref} data-testid={dataTestId} className={classes} {...rest} />;\n});\n"],"names":["Grid","React","className","dataTestId","rest","ref","jsx","cn","wrapOptions","justifyContentOptions","alignItemsOptions","directionOptions","Row","justifyContent","alignItems","direction","wrap","spacing","isJustifyContent","isAlignItems","isDirection","isFlexWrap","classes","hiddenClasses","hidden","acc","bp","Column","xs","sm","md","lg","xl","xsOffset","smOffset","mdOffset","lgOffset","xlOffset","Container","maxWidth","disableGutters"],"mappings":"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"}

package/dist/headless/components/layout/page/page.js

@@ -1,21 +1,29 @@
 import { jsx as e } from "react/jsx-runtime";
 import l from "react";
-import d from "clsx";
-const u = l.forwardRef(function({ maxWidth: s = "lg", disableGutters: r = !1, component: a, className: t, children: g, ...m }, i) {
+import p from "clsx";
+const _ = l.forwardRef(function({
+  maxWidth: s = "lg",
+  disableGutters: r = !1,
+  component: a,
+  className: t,
+  children: g,
+  "data-testid": i = "page",
+  ...m
+}, d) {
   const f = a != null ? a : "main";
   return /* @__PURE__ */ e(
     f,
     {
-      ref: i,
-      "data-testid": "page",
-      className: d("smwb-page", `smwb-page_max-${s}`, { "smwb-page_gutterless": r }, t),
+      ref: d,
+      "data-testid": i,
+      className: p("smwb-page", `smwb-page_max-${s}`, { "smwb-page_gutterless": r }, t),
       ...m,
       children: /* @__PURE__ */ e("div", { className: "smwb-page__inner", children: g })
     }
   );
 });
 export {
-  u as Page,
-  u as default
+  _ as Page,
+  _ as default
 };
 //# sourceMappingURL=page.js.map

package/dist/headless/components/layout/page/page.js.map

@@ -1 +1 @@
-{"version":3,"file":"page.js","sources":["../../../../../src/components/layout/page/page.tsx"],"sourcesContent":["import React, { HTMLAttributes, PropsWithChildren } from \"react\";\nimport cn from \"clsx\";\n\nexport type PageMaxWidth = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"full\";\n\nexport interface PageProps extends HTMLAttributes<HTMLElement> {\n  /** Content max-width cap; `full` = fluid. */\n  maxWidth?: PageMaxWidth;\n  /** Remove the page padding. */\n  disableGutters?: boolean;\n  /** Render as a different element (default `main`). */\n  component?: keyof JSX.IntrinsicElements;\n  className?: string;\n}\n\nexport const Page = React.forwardRef<HTMLElement, PropsWithChildren<PageProps>>(function Page(\n  { maxWidth = \"lg\", disableGutters = false, component, className, children, ...rest },\n  ref\n) {\n  const Tag = (component ?? \"main\") as \"main\";\n  return (\n    <Tag\n      ref={ref}\n      data-testid=\"page\"\n      className={cn(\"smwb-page\", `smwb-page_max-${maxWidth}`, { \"smwb-page_gutterless\": disableGutters }, className)}\n      {...rest}\n    >\n      <div className=\"smwb-page__inner\">{children}</div>\n    </Tag>\n  );\n});\n\nexport default Page;\n"],"names":["Page","React","maxWidth","disableGutters","component","className","children","rest","ref","Tag","jsx","cn"],"mappings":";;;AAeO,MAAMA,IAAOC,EAAM,WAAsD,SAC9E,EAAE,UAAAC,IAAW,MAAM,gBAAAC,IAAiB,IAAO,WAAAC,GAAW,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAC9EC,GACA;AACA,QAAMC,IAAOL,KAAA,OAAAA,IAAa;AAC1B,SACE,gBAAAM;AAAA,IAACD;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,eAAY;AAAA,MACZ,WAAWG,EAAG,aAAa,iBAAiBT,CAAQ,IAAI,EAAE,wBAAwBC,EAAA,GAAkBE,CAAS;AAAA,MAC5G,GAAGE;AAAA,MAEJ,UAAA,gBAAAG,EAAC,OAAA,EAAI,WAAU,oBAAoB,UAAAJ,EAAA,CAAS;AAAA,IAAA;AAAA,EAAA;AAGlD,CAAC;"}
+{"version":3,"file":"page.js","sources":["../../../../../src/components/layout/page/page.tsx"],"sourcesContent":["import React, { HTMLAttributes, PropsWithChildren } from \"react\";\nimport cn from \"clsx\";\n\nexport type PageMaxWidth = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"full\";\n\nexport interface PageProps extends HTMLAttributes<HTMLElement> {\n  /** Content max-width cap; `full` = fluid. */\n  maxWidth?: PageMaxWidth;\n  /** Remove the page padding. */\n  disableGutters?: boolean;\n  /** Render as a different element (default `main`). */\n  component?: keyof JSX.IntrinsicElements;\n  className?: string;\n  /** Test id of the root element; `page` unless given. */\n  \"data-testid\"?: string;\n}\n\nexport const Page = React.forwardRef<HTMLElement, PropsWithChildren<PageProps>>(function Page(\n  {\n    maxWidth = \"lg\",\n    disableGutters = false,\n    component,\n    className,\n    children,\n    \"data-testid\": dataTestId = \"page\",\n    ...rest\n  },\n  ref\n) {\n  const Tag = (component ?? \"main\") as \"main\";\n  return (\n    <Tag\n      ref={ref}\n      data-testid={dataTestId}\n      className={cn(\"smwb-page\", `smwb-page_max-${maxWidth}`, { \"smwb-page_gutterless\": disableGutters }, className)}\n      {...rest}\n    >\n      <div className=\"smwb-page__inner\">{children}</div>\n    </Tag>\n  );\n});\n\nexport default Page;\n"],"names":["Page","React","maxWidth","disableGutters","component","className","children","dataTestId","rest","ref","Tag","jsx","cn"],"mappings":";;;AAiBO,MAAMA,IAAOC,EAAM,WAAsD,SAC9E;AAAA,EACE,UAAAC,IAAW;AAAA,EACX,gBAAAC,IAAiB;AAAA,EACjB,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,eAAeC,IAAa;AAAA,EAC5B,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAON,KAAA,OAAAA,IAAa;AAC1B,SACE,gBAAAO;AAAA,IAACD;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,eAAaF;AAAA,MACb,WAAWK,EAAG,aAAa,iBAAiBV,CAAQ,IAAI,EAAE,wBAAwBC,EAAA,GAAkBE,CAAS;AAAA,MAC5G,GAAGG;AAAA,MAEJ,UAAA,gBAAAG,EAAC,OAAA,EAAI,WAAU,oBAAoB,UAAAL,EAAA,CAAS;AAAA,IAAA;AAAA,EAAA;AAGlD,CAAC;"}

package/dist/headless/components/layout/pageHeader/pageHeader.js

@@ -1,30 +1,39 @@
 import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import t from "react";
-import o from "clsx";
-import { Typography as m } from "../../dataDisplay/typography/typography.js";
-const f = t.forwardRef(function({ title: a, subtitle: d, breadcrumbs: s, actions: l, divider: i = !1, className: c, ...h }, n) {
+import o from "react";
+import p from "clsx";
+import { Typography as l } from "../../dataDisplay/typography/typography.js";
+const v = o.forwardRef(function({
+  title: a,
+  subtitle: d,
+  breadcrumbs: s,
+  actions: i,
+  divider: m = !1,
+  className: t,
+  "data-testid": c = "page-header",
+  ...h
+}, n) {
   return /* @__PURE__ */ r(
     "header",
     {
       ref: n,
-      "data-testid": "page-header",
-      className: o("smwb-page-header", { "smwb-page-header_divider": i }, c),
+      "data-testid": c,
+      className: p("smwb-page-header", { "smwb-page-header_divider": m }, t),
       ...h,
       children: [
         s ? /* @__PURE__ */ e("div", { className: "smwb-page-header__breadcrumbs", children: s }) : null,
         /* @__PURE__ */ r("div", { className: "smwb-page-header__row", children: [
           /* @__PURE__ */ r("div", { className: "smwb-page-header__titles", children: [
-            typeof a == "string" ? /* @__PURE__ */ e(m, { variant: "h4", component: "h1", className: "smwb-page-header__title", children: a }) : /* @__PURE__ */ e("div", { className: "smwb-page-header__title", children: a }),
-            d ? /* @__PURE__ */ e(m, { variant: "body2", color: "textSecondary", className: "smwb-page-header__subtitle", children: d }) : null
+            typeof a == "string" ? /* @__PURE__ */ e(l, { variant: "h4", component: "h1", className: "smwb-page-header__title", children: a }) : /* @__PURE__ */ e("div", { className: "smwb-page-header__title", children: a }),
+            d ? /* @__PURE__ */ e(l, { variant: "body2", color: "textSecondary", className: "smwb-page-header__subtitle", children: d }) : null
           ] }),
-          l ? /* @__PURE__ */ e("div", { className: "smwb-page-header__actions", children: l }) : null
+          i ? /* @__PURE__ */ e("div", { className: "smwb-page-header__actions", children: i }) : null
         ] })
       ]
     }
   );
 });
 export {
-  f as PageHeader,
-  f as default
+  v as PageHeader,
+  v as default
 };
 //# sourceMappingURL=pageHeader.js.map

package/dist/headless/components/layout/pageHeader/pageHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"pageHeader.js","sources":["../../../../../src/components/layout/pageHeader/pageHeader.tsx"],"sourcesContent":["import React, { HTMLAttributes, ReactNode } from \"react\";\nimport cn from \"clsx\";\nimport Typography from \"../../dataDisplay/typography/typography\";\n\nexport interface PageHeaderProps extends Omit<HTMLAttributes<HTMLElement>, \"title\"> {\n  title: ReactNode;\n  subtitle?: ReactNode;\n  /** Slot above the title (e.g. <Breadcrumbs />). */\n  breadcrumbs?: ReactNode;\n  /** Slot on the trailing side (e.g. action buttons). */\n  actions?: ReactNode;\n  /** Render a divider below the header. */\n  divider?: boolean;\n  className?: string;\n}\n\nexport const PageHeader = React.forwardRef<HTMLElement, PageHeaderProps>(function PageHeader(\n  { title, subtitle, breadcrumbs, actions, divider = false, className, ...rest },\n  ref\n) {\n  return (\n    <header\n      ref={ref}\n      data-testid=\"page-header\"\n      className={cn(\"smwb-page-header\", { \"smwb-page-header_divider\": divider }, className)}\n      {...rest}\n    >\n      {breadcrumbs ? <div className=\"smwb-page-header__breadcrumbs\">{breadcrumbs}</div> : null}\n      <div className=\"smwb-page-header__row\">\n        <div className=\"smwb-page-header__titles\">\n          {typeof title === \"string\" ? (\n            <Typography variant=\"h4\" component=\"h1\" className=\"smwb-page-header__title\">\n              {title}\n            </Typography>\n          ) : (\n            <div className=\"smwb-page-header__title\">{title}</div>\n          )}\n          {subtitle ? (\n            <Typography variant=\"body2\" color=\"textSecondary\" className=\"smwb-page-header__subtitle\">\n              {subtitle}\n            </Typography>\n          ) : null}\n        </div>\n        {actions ? <div className=\"smwb-page-header__actions\">{actions}</div> : null}\n      </div>\n    </header>\n  );\n});\n\nexport default PageHeader;\n"],"names":["PageHeader","React","title","subtitle","breadcrumbs","actions","divider","className","rest","ref","jsxs","cn","jsx","Typography"],"mappings":";;;;AAgBO,MAAMA,IAAaC,EAAM,WAAyC,SACvE,EAAE,OAAAC,GAAO,UAAAC,GAAU,aAAAC,GAAa,SAAAC,GAAS,SAAAC,IAAU,IAAO,WAAAC,GAAW,GAAGC,EAAA,GACxEC,GACA;AACA,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,eAAY;AAAA,MACZ,WAAWE,EAAG,oBAAoB,EAAE,4BAA4BL,EAAA,GAAWC,CAAS;AAAA,MACnF,GAAGC;AAAA,MAEH,UAAA;AAAA,QAAAJ,IAAc,gBAAAQ,EAAC,OAAA,EAAI,WAAU,iCAAiC,aAAY,IAAS;AAAA,QACpF,gBAAAF,EAAC,OAAA,EAAI,WAAU,yBACb,UAAA;AAAA,UAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,4BACZ,UAAA;AAAA,YAAA,OAAOR,KAAU,WAChB,gBAAAU,EAACC,GAAA,EAAW,SAAQ,MAAK,WAAU,MAAK,WAAU,2BAC/C,aACH,IAEA,gBAAAD,EAAC,OAAA,EAAI,WAAU,2BAA2B,UAAAV,GAAM;AAAA,YAEjDC,IACC,gBAAAS,EAACC,GAAA,EAAW,SAAQ,SAAQ,OAAM,iBAAgB,WAAU,8BACzD,UAAAV,EAAA,CACH,IACE;AAAA,UAAA,GACN;AAAA,UACCE,IAAU,gBAAAO,EAAC,OAAA,EAAI,WAAU,6BAA6B,aAAQ,IAAS;AAAA,QAAA,EAAA,CAC1E;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"pageHeader.js","sources":["../../../../../src/components/layout/pageHeader/pageHeader.tsx"],"sourcesContent":["import React, { HTMLAttributes, ReactNode } from \"react\";\nimport cn from \"clsx\";\nimport Typography from \"../../dataDisplay/typography/typography\";\n\nexport interface PageHeaderProps extends Omit<HTMLAttributes<HTMLElement>, \"title\"> {\n  title: ReactNode;\n  subtitle?: ReactNode;\n  /** Slot above the title (e.g. <Breadcrumbs />). */\n  breadcrumbs?: ReactNode;\n  /** Slot on the trailing side (e.g. action buttons). */\n  actions?: ReactNode;\n  /** Render a divider below the header. */\n  divider?: boolean;\n  className?: string;\n  /** Test id of the root `<header>`; `page-header` unless given. */\n  \"data-testid\"?: string;\n}\n\nexport const PageHeader = React.forwardRef<HTMLElement, PageHeaderProps>(function PageHeader(\n  {\n    title,\n    subtitle,\n    breadcrumbs,\n    actions,\n    divider = false,\n    className,\n    \"data-testid\": dataTestId = \"page-header\",\n    ...rest\n  },\n  ref\n) {\n  return (\n    <header\n      ref={ref}\n      data-testid={dataTestId}\n      className={cn(\"smwb-page-header\", { \"smwb-page-header_divider\": divider }, className)}\n      {...rest}\n    >\n      {breadcrumbs ? <div className=\"smwb-page-header__breadcrumbs\">{breadcrumbs}</div> : null}\n      <div className=\"smwb-page-header__row\">\n        <div className=\"smwb-page-header__titles\">\n          {typeof title === \"string\" ? (\n            <Typography variant=\"h4\" component=\"h1\" className=\"smwb-page-header__title\">\n              {title}\n            </Typography>\n          ) : (\n            <div className=\"smwb-page-header__title\">{title}</div>\n          )}\n          {subtitle ? (\n            <Typography variant=\"body2\" color=\"textSecondary\" className=\"smwb-page-header__subtitle\">\n              {subtitle}\n            </Typography>\n          ) : null}\n        </div>\n        {actions ? <div className=\"smwb-page-header__actions\">{actions}</div> : null}\n      </div>\n    </header>\n  );\n});\n\nexport default PageHeader;\n"],"names":["PageHeader","React","title","subtitle","breadcrumbs","actions","divider","className","dataTestId","rest","ref","jsxs","cn","jsx","Typography"],"mappings":";;;;AAkBO,MAAMA,IAAaC,EAAM,WAAyC,SACvE;AAAA,EACE,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,SAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,eAAeC,IAAa;AAAA,EAC5B,GAAGC;AACL,GACAC,GACA;AACA,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,eAAaF;AAAA,MACb,WAAWI,EAAG,oBAAoB,EAAE,4BAA4BN,EAAA,GAAWC,CAAS;AAAA,MACnF,GAAGE;AAAA,MAEH,UAAA;AAAA,QAAAL,IAAc,gBAAAS,EAAC,OAAA,EAAI,WAAU,iCAAiC,aAAY,IAAS;AAAA,QACpF,gBAAAF,EAAC,OAAA,EAAI,WAAU,yBACb,UAAA;AAAA,UAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,4BACZ,UAAA;AAAA,YAAA,OAAOT,KAAU,WAChB,gBAAAW,EAACC,GAAA,EAAW,SAAQ,MAAK,WAAU,MAAK,WAAU,2BAC/C,aACH,IAEA,gBAAAD,EAAC,OAAA,EAAI,WAAU,2BAA2B,UAAAX,GAAM;AAAA,YAEjDC,IACC,gBAAAU,EAACC,GAAA,EAAW,SAAQ,SAAQ,OAAM,iBAAgB,WAAU,8BACzD,UAAAX,EAAA,CACH,IACE;AAAA,UAAA,GACN;AAAA,UACCE,IAAU,gBAAAQ,EAAC,OAAA,EAAI,WAAU,6BAA6B,aAAQ,IAAS;AAAA,QAAA,EAAA,CAC1E;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}

package/dist/headless/components/layout/sectionHeader/sectionHeader.js

@@ -0,0 +1,75 @@
+import { jsxs as o, jsx as s } from "react/jsx-runtime";
+import u, { useState as w } from "react";
+import b from "clsx";
+import { Icon as N } from "../../base/icon/icon.js";
+import { useDismissOnEscape as v } from "../../../hooks/useDismissOnEscape.js";
+import { Tooltip as g } from "../../feedBack/tooltip/tooltip.js";
+function H({ text: n, label: t }) {
+  const [a, e] = w(!1);
+  return v(a, () => e(!1)), /* @__PURE__ */ s(
+    g,
+    {
+      className: "smwb-section-header__tooltip",
+      message: n,
+      trigger: "manual",
+      open: a,
+      placement: "top",
+      offset: { offsetY: 6 },
+      children: /* @__PURE__ */ s(
+        "span",
+        {
+          className: "smwb-section-header__help",
+          role: "img",
+          "aria-label": t != null ? t : n,
+          tabIndex: 0,
+          onPointerEnter: () => e(!0),
+          onPointerLeave: () => e(!1),
+          onFocus: () => e(!0),
+          onBlur: () => e(!1),
+          children: /* @__PURE__ */ s(N, { name: "help", size: 16 })
+        }
+      )
+    }
+  );
+}
+const P = u.forwardRef(
+  function({
+    className: t,
+    title: a,
+    level: e = 2,
+    count: i,
+    help: r,
+    helpLabel: m,
+    titleId: d,
+    subtitle: c,
+    children: l,
+    "data-testid": h = "section-header",
+    ...f
+  }, p) {
+    const _ = `h${e}`;
+    return /* @__PURE__ */ o(
+      "header",
+      {
+        "data-testid": h,
+        ...f,
+        ref: p,
+        className: b("smwb-section-header", `smwb-section-header_level-${e}`, t),
+        children: [
+          /* @__PURE__ */ o("div", { className: "smwb-section-header__titles", children: [
+            /* @__PURE__ */ o("div", { className: "smwb-section-header__title-line", children: [
+              /* @__PURE__ */ s(_, { id: d, className: "smwb-section-header__title", children: a }),
+              i != null ? /* @__PURE__ */ s("span", { className: "smwb-section-header__count", children: i }) : null,
+              r ? /* @__PURE__ */ s(H, { text: r, label: m }) : null
+            ] }),
+            c ? /* @__PURE__ */ s("div", { className: "smwb-section-header__subtitle", children: c }) : null
+          ] }),
+          l ? /* @__PURE__ */ s("div", { className: "smwb-section-header__actions", children: l }) : null
+        ]
+      }
+    );
+  }
+);
+export {
+  P as SectionHeader
+};
+//# sourceMappingURL=sectionHeader.js.map

package/dist/headless/components/layout/sectionHeader/sectionHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sectionHeader.js","sources":["../../../../../src/components/layout/sectionHeader/sectionHeader.tsx"],"sourcesContent":["import React, { HTMLAttributes, PropsWithChildren, ReactNode, useState } from \"react\";\nimport cn from \"clsx\";\nimport Icon from \"../../base/icon/icon\";\nimport { Tooltip } from \"../../feedBack/tooltip\";\nimport { useDismissOnEscape } from \"../../../hooks/useDismissOnEscape\";\n\nexport interface SectionHeaderProps extends Omit<HTMLAttributes<HTMLElement>, \"title\"> {\n  className?: string;\n  /** The section's name. */\n  title: ReactNode;\n  /** Heading level of the title: 2 by default. */\n  level?: 2 | 3 | 4 | 5 | 6;\n  /** How many items the section holds, beside the title. Nothing is shown for null. */\n  count?: number | string | null;\n  /**\n   * How to read the section, behind a \"?\" icon: shown on hover and on keyboard\n   * focus, and the icon's accessible name. Text only — the tooltip renders in\n   * the browser.\n   */\n  help?: string;\n  /** The \"?\" icon's accessible name, e.g. \"Explanation: …\"; the help text by default. */\n  helpLabel?: string;\n  /** Id of the heading, for anchors and aria-labelledby. */\n  titleId?: string;\n  /** A line under the title. */\n  subtitle?: ReactNode;\n  /** Test id of the root `<header>`; `section-header` unless given. */\n  \"data-testid\"?: string;\n}\n\n/** The \"?\" icon with its tooltip, open on hover and on keyboard focus. */\nfunction HelpHint({ text, label }: { text: string; label?: string }) {\n  const [open, setOpen] = useState(false);\n  // Escape hides the tooltip wherever focus is, shown by hover or by focus (WCAG 1.4.13),\n  // and is marked as handled, so a window, panel, Modal or Sheet around the hint stays\n  // open; with the tooltip hidden, the key is theirs.\n  useDismissOnEscape(open, () => setOpen(false));\n  return (\n    <Tooltip\n      className=\"smwb-section-header__tooltip\"\n      message={text}\n      trigger=\"manual\"\n      open={open}\n      placement=\"top\"\n      offset={{ offsetY: 6 }}\n    >\n      <span\n        className=\"smwb-section-header__help\"\n        role=\"img\"\n        aria-label={label ?? text}\n        tabIndex={0}\n        onPointerEnter={() => setOpen(true)}\n        onPointerLeave={() => setOpen(false)}\n        onFocus={() => setOpen(true)}\n        onBlur={() => setOpen(false)}\n      >\n        <Icon name=\"help\" size={16} />\n      </span>\n    </Tooltip>\n  );\n}\n\n/**\n * A section's heading row: the title with a count and a help hint, a subtitle\n * under them, and the section's actions (the children) at the end. On a narrow\n * screen the actions wrap under the title.\n */\nexport const SectionHeader = React.forwardRef<HTMLElement, PropsWithChildren<SectionHeaderProps>>(\n  function SectionHeader(\n    {\n      className,\n      title,\n      level = 2,\n      count,\n      help,\n      helpLabel,\n      titleId,\n      subtitle,\n      children,\n      \"data-testid\": dataTestId = \"section-header\",\n      ...rest\n    },\n    ref\n  ) {\n    const Heading = `h${level}` as \"h2\";\n    return (\n      <header\n        data-testid={dataTestId}\n        {...rest}\n        ref={ref}\n        className={cn(\"smwb-section-header\", `smwb-section-header_level-${level}`, className)}\n      >\n        <div className=\"smwb-section-header__titles\">\n          <div className=\"smwb-section-header__title-line\">\n            <Heading id={titleId} className=\"smwb-section-header__title\">\n              {title}\n            </Heading>\n            {count !== undefined && count !== null ? <span className=\"smwb-section-header__count\">{count}</span> : null}\n            {help ? <HelpHint text={help} label={helpLabel} /> : null}\n          </div>\n          {subtitle ? <div className=\"smwb-section-header__subtitle\">{subtitle}</div> : null}\n        </div>\n        {children ? <div className=\"smwb-section-header__actions\">{children}</div> : null}\n      </header>\n    );\n  }\n);\n\nexport default SectionHeader;\n"],"names":["HelpHint","text","label","open","setOpen","useState","useDismissOnEscape","jsx","Tooltip","Icon","SectionHeader","React","className","title","level","count","help","helpLabel","titleId","subtitle","children","dataTestId","rest","ref","Heading","jsxs","cn"],"mappings":";;;;;;AA+BA,SAASA,EAAS,EAAE,MAAAC,GAAM,OAAAC,KAA2C;AACnE,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAS,EAAK;AAItC,SAAAC,EAAmBH,GAAM,MAAMC,EAAQ,EAAK,CAAC,GAE3C,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,SAASP;AAAA,MACT,SAAQ;AAAA,MACR,MAAAE;AAAA,MACA,WAAU;AAAA,MACV,QAAQ,EAAE,SAAS,EAAA;AAAA,MAEnB,UAAA,gBAAAI;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,MAAK;AAAA,UACL,cAAYL,KAAA,OAAAA,IAASD;AAAA,UACrB,UAAU;AAAA,UACV,gBAAgB,MAAMG,EAAQ,EAAI;AAAA,UAClC,gBAAgB,MAAMA,EAAQ,EAAK;AAAA,UACnC,SAAS,MAAMA,EAAQ,EAAI;AAAA,UAC3B,QAAQ,MAAMA,EAAQ,EAAK;AAAA,UAE3B,UAAA,gBAAAG,EAACE,GAAA,EAAK,MAAK,QAAO,MAAM,GAAA,CAAI;AAAA,QAAA;AAAA,MAAA;AAAA,IAC9B;AAAA,EAAA;AAGN;AAOO,MAAMC,IAAgBC,EAAM;AAAA,EACjC,SACE;AAAA,IACE,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,OAAAC;AAAA,IACA,MAAAC;AAAA,IACA,WAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,eAAeC,IAAa;AAAA,IAC5B,GAAGC;AAAA,EAAA,GAELC,GACA;AACA,UAAMC,IAAU,IAAIV,CAAK;AACzB,WACE,gBAAAW;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,eAAaJ;AAAA,QACZ,GAAGC;AAAA,QACJ,KAAAC;AAAA,QACA,WAAWG,EAAG,uBAAuB,6BAA6BZ,CAAK,IAAIF,CAAS;AAAA,QAEpF,UAAA;AAAA,UAAA,gBAAAa,EAAC,OAAA,EAAI,WAAU,+BACb,UAAA;AAAA,YAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,mCACb,UAAA;AAAA,cAAA,gBAAAlB,EAACiB,GAAA,EAAQ,IAAIN,GAAS,WAAU,8BAC7B,UAAAL,GACH;AAAA,cACwBE,KAAU,yBAAQ,QAAA,EAAK,WAAU,8BAA8B,UAAAA,EAAA,CAAM,IAAU;AAAA,cACtGC,IAAO,gBAAAT,EAACP,GAAA,EAAS,MAAMgB,GAAM,OAAOC,GAAW,IAAK;AAAA,YAAA,GACvD;AAAA,YACCE,IAAW,gBAAAZ,EAAC,OAAA,EAAI,WAAU,iCAAiC,aAAS,IAAS;AAAA,UAAA,GAChF;AAAA,UACCa,IAAW,gBAAAb,EAAC,OAAA,EAAI,WAAU,gCAAgC,UAAAa,GAAS,IAAS;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGnF;AACF;"}