@alfadocs/ui-kit-debug 0.70.0 → 0.71.0

package/dist/_chunks/use-edge-resize-ZnGG7gyO.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-edge-resize-ZnGG7gyO.js","sources":["../../src/hooks/use-edge-resize.ts"],"sourcesContent":["/**\n * Pixel-based edge-resize for fixed-width chrome surfaces (the Sidebar's\n * inline-end edge, the AiToolsRail panel's inner edge). Mirrors the\n * separator semantics of `Resizable`'s Handle — `role=\"separator\"`,\n * arrow keys with RTL flip, Shift for coarse steps, Home/End to the\n * extremes, Enter or double-click to reset — but sizes a single target\n * element in pixels instead of distributing percentages across a panel\n * group.\n *\n * The hook owns the interaction and writes the resolved width to a CSS\n * custom property on the target element (the same property the\n * component's width classes already read), so the component keeps its\n * `var(--…)`-driven classes and no inline `width` ever appears. Reset\n * removes the override entirely, returning the surface to its\n * token-driven default.\n */\nimport {\n  useCallback,\n  useRef,\n  useState,\n  type KeyboardEvent,\n  type PointerEvent as ReactPointerEvent,\n  type RefObject,\n} from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useIsomorphicLayoutEffect } from './use-isomorphic-layout-effect';\n\n/** Fine / coarse keyboard steps, in px (coarse = Shift held). */\nconst KEY_STEP = 16;\nconst KEY_STEP_COARSE = 64;\n\nexport interface UseEdgeResizeOptions {\n  /**\n   * Which logical edge of the target carries the handle. `inline-end`\n   * for a start-docked surface (Sidebar); `inline-start` for an\n   * end-docked one (AiToolsRail panel with `side=\"end\"`).\n   */\n  edge: 'inline-start' | 'inline-end';\n  /** The element being resized. The width override lands on its style. */\n  targetRef: RefObject<HTMLElement | null>;\n  /**\n   * CSS custom property the target's width classes read\n   * (e.g. `--sidebar-modern-expanded-size`). Written as `<px>px` on\n   * resize, removed on reset.\n   */\n  cssProperty: string;\n  /** Clamp floor, px. */\n  minSize: number;\n  /** Clamp ceiling, px. */\n  maxSize: number;\n  /**\n   * Nominal default width, px — used for `aria-valuenow` before the\n   * element has been measured (SSR / jsdom) and as the reset target.\n   */\n  defaultSize: number;\n  /** Disables the interaction (handlers no-op, `aria-disabled` set). */\n  disabled?: boolean;\n  /** Fired with the committed px width; `null` means reset-to-default. */\n  onResize?: (size: number | null) => void;\n}\n\nexport interface EdgeResizeSeparatorProps {\n  role: 'separator';\n  tabIndex: number;\n  'aria-orientation': 'vertical';\n  'aria-valuemin': number;\n  'aria-valuemax': number;\n  'aria-valuenow': number;\n  'aria-valuetext': string;\n  'aria-disabled': boolean | undefined;\n  onPointerDown: (event: ReactPointerEvent<HTMLElement>) => void;\n  onPointerMove: (event: ReactPointerEvent<HTMLElement>) => void;\n  onPointerUp: (event: ReactPointerEvent<HTMLElement>) => void;\n  onPointerCancel: (event: ReactPointerEvent<HTMLElement>) => void;\n  onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;\n  onDoubleClick: () => void;\n}\n\nexport interface UseEdgeResizeReturn {\n  /**\n   * Spread onto the handle element (a plain `<div>`). Add `aria-label`,\n   * and give the handle a `ds:touch-none` class — touch browsers decide\n   * scroll-vs-drag at gesture start, before any pointer handler runs.\n   */\n  separatorProps: EdgeResizeSeparatorProps;\n  /** True while a pointer drag is in flight — suppress width transitions. */\n  isResizing: boolean;\n  /** True once the user has overridden the token-driven default. */\n  isResized: boolean;\n  /** Programmatic reset to the token-driven default width. */\n  reset: () => void;\n}\n\nexport function useEdgeResize({\n  edge,\n  targetRef,\n  cssProperty,\n  minSize,\n  maxSize,\n  defaultSize,\n  disabled = false,\n  onResize,\n}: UseEdgeResizeOptions): UseEdgeResizeReturn {\n  const { t } = useTranslation();\n  const [size, setSize] = useState<number | null>(null);\n  const [isResizing, setIsResizing] = useState(false);\n  const measuredRef = useRef<number | null>(null);\n  const dragRef = useRef<{\n    pointerId: number;\n    startX: number;\n    startSize: number;\n    sign: number;\n  } | null>(null);\n\n  useIsomorphicLayoutEffect(() => {\n    const el = targetRef.current;\n    if (!el) return;\n    const width = el.getBoundingClientRect().width;\n    if (width > 0) measuredRef.current = width;\n  });\n\n  const clamp = useCallback(\n    (px: number) => Math.min(maxSize, Math.max(minSize, px)),\n    [minSize, maxSize],\n  );\n\n  // Live read at interaction time: the mount-time measure can catch the\n  // target mid-animation (e.g. a panel still opening at width 0), so a\n  // resize must start from the width the element actually has NOW.\n  const currentSize = useCallback(() => {\n    if (size !== null) return size;\n    const el = targetRef.current;\n    if (el) {\n      const width = el.getBoundingClientRect().width;\n      if (width > 0) {\n        measuredRef.current = width;\n        return width;\n      }\n    }\n    return measuredRef.current ?? defaultSize;\n  }, [size, defaultSize, targetRef]);\n\n  const apply = useCallback(\n    (px: number) => {\n      const next = clamp(px);\n      setSize(next);\n      targetRef.current?.style.setProperty(cssProperty, `${next}px`);\n      return next;\n    },\n    [clamp, cssProperty, targetRef],\n  );\n\n  const reset = useCallback(() => {\n    setSize(null);\n    targetRef.current?.style.removeProperty(cssProperty);\n    measuredRef.current = null;\n    onResize?.(null);\n  }, [cssProperty, onResize, targetRef]);\n\n  // Pointer-drag delta → width delta. The boundary the handle moves is\n  // physical, so the logical edge and the writing direction both flip\n  // the sign: dragging right grows a start-docked surface in LTR but\n  // shrinks it in RTL, and vice versa for an end-docked one. Direction\n  // is resolved at INTERACTION time from the target's computed style —\n  // a mount-time read can be stale (the target may be unmounted while a\n  // panel is closed, and `dir` lives on a subtree wrapper, not <html>).\n  const resolveSign = useCallback(() => {\n    const el = targetRef.current;\n    const rtl = el ? getComputedStyle(el).direction === 'rtl' : false;\n    return (edge === 'inline-end' ? 1 : -1) * (rtl ? -1 : 1);\n  }, [edge, targetRef]);\n\n  const onPointerDown = useCallback(\n    (event: ReactPointerEvent<HTMLElement>) => {\n      if (disabled || !event.isPrimary) return;\n      event.currentTarget.setPointerCapture(event.pointerId);\n      dragRef.current = {\n        pointerId: event.pointerId,\n        startX: event.clientX,\n        startSize: currentSize(),\n        sign: resolveSign(),\n      };\n      setIsResizing(true);\n    },\n    [disabled, currentSize, resolveSign],\n  );\n\n  const onPointerMove = useCallback(\n    (event: ReactPointerEvent<HTMLElement>) => {\n      const drag = dragRef.current;\n      if (!drag || event.pointerId !== drag.pointerId) return;\n      apply(drag.startSize + drag.sign * (event.clientX - drag.startX));\n    },\n    [apply],\n  );\n\n  const endDrag = useCallback(\n    (event: ReactPointerEvent<HTMLElement>) => {\n      const drag = dragRef.current;\n      if (!drag || event.pointerId !== drag.pointerId) return;\n      event.currentTarget.releasePointerCapture(event.pointerId);\n      dragRef.current = null;\n      setIsResizing(false);\n      // Re-apply from the up-event coordinates so the committed width,\n      // the rendered width, and aria-valuenow all agree even when the\n      // pointer-up lands at a different X than the last move.\n      const committed = apply(\n        drag.startSize + drag.sign * (event.clientX - drag.startX),\n      );\n      onResize?.(committed);\n    },\n    [apply, onResize],\n  );\n\n  const onKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLElement>) => {\n      if (disabled) return;\n      const step = event.shiftKey ? KEY_STEP_COARSE : KEY_STEP;\n      const sign = resolveSign();\n      let next: number | null = null;\n      switch (event.key) {\n        case 'ArrowRight':\n          next = currentSize() + sign * step;\n          break;\n        case 'ArrowLeft':\n          next = currentSize() - sign * step;\n          break;\n        case 'Home':\n          next = minSize;\n          break;\n        case 'End':\n          next = maxSize;\n          break;\n        case 'Enter':\n          event.preventDefault();\n          reset();\n          return;\n        default:\n          return;\n      }\n      if (next === null) return;\n      event.preventDefault();\n      // Evaluate apply() unconditionally — `onResize?.(apply(next))`\n      // would short-circuit the argument away when no callback is set.\n      const committed = apply(next);\n      onResize?.(committed);\n    },\n    [\n      apply,\n      currentSize,\n      disabled,\n      maxSize,\n      minSize,\n      onResize,\n      reset,\n      resolveSign,\n    ],\n  );\n\n  const valueNow = Math.round(currentSize());\n\n  return {\n    separatorProps: {\n      role: 'separator',\n      tabIndex: disabled ? -1 : 0,\n      'aria-orientation': 'vertical',\n      'aria-valuemin': minSize,\n      'aria-valuemax': maxSize,\n      'aria-valuenow': valueNow,\n      'aria-valuetext': t('resizable.widthAnnounce', { width: valueNow }),\n      'aria-disabled': disabled || undefined,\n      onPointerDown,\n      onPointerMove,\n      onPointerUp: endDrag,\n      onPointerCancel: endDrag,\n      onKeyDown,\n      onDoubleClick: reset,\n    },\n    isResizing,\n    isResized: size !== null,\n    reset,\n  };\n}\n"],"names":["KEY_STEP","KEY_STEP_COARSE","useEdgeResize","edge","targetRef","cssProperty","minSize","maxSize","defaultSize","disabled","onResize","t","useTranslation","size","setSize","useState","isResizing","setIsResizing","measuredRef","useRef","dragRef","useIsomorphicLayoutEffect","el","width","clamp","useCallback","px","currentSize","apply","next","_a","reset","resolveSign","rtl","onPointerDown","event","onPointerMove","drag","endDrag","committed","onKeyDown","step","sign","valueNow"],"mappings":"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"}
+{"version":3,"file":"use-edge-resize-ZnGG7gyO.js","sources":["../../src/hooks/use-edge-resize.ts"],"sourcesContent":["/**\n * Pixel-based edge-resize for fixed-width chrome surfaces (the Sidebar's\n * inline-end edge, the ToolRail panel's inner edge). Mirrors the\n * separator semantics of `Resizable`'s Handle — `role=\"separator\"`,\n * arrow keys with RTL flip, Shift for coarse steps, Home/End to the\n * extremes, Enter or double-click to reset — but sizes a single target\n * element in pixels instead of distributing percentages across a panel\n * group.\n *\n * The hook owns the interaction and writes the resolved width to a CSS\n * custom property on the target element (the same property the\n * component's width classes already read), so the component keeps its\n * `var(--…)`-driven classes and no inline `width` ever appears. Reset\n * removes the override entirely, returning the surface to its\n * token-driven default.\n */\nimport {\n  useCallback,\n  useRef,\n  useState,\n  type KeyboardEvent,\n  type PointerEvent as ReactPointerEvent,\n  type RefObject,\n} from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useIsomorphicLayoutEffect } from './use-isomorphic-layout-effect';\n\n/** Fine / coarse keyboard steps, in px (coarse = Shift held). */\nconst KEY_STEP = 16;\nconst KEY_STEP_COARSE = 64;\n\nexport interface UseEdgeResizeOptions {\n  /**\n   * Which logical edge of the target carries the handle. `inline-end`\n   * for a start-docked surface (Sidebar); `inline-start` for an\n   * end-docked one (ToolRail panel with `side=\"end\"`).\n   */\n  edge: 'inline-start' | 'inline-end';\n  /** The element being resized. The width override lands on its style. */\n  targetRef: RefObject<HTMLElement | null>;\n  /**\n   * CSS custom property the target's width classes read\n   * (e.g. `--sidebar-modern-expanded-size`). Written as `<px>px` on\n   * resize, removed on reset.\n   */\n  cssProperty: string;\n  /** Clamp floor, px. */\n  minSize: number;\n  /** Clamp ceiling, px. */\n  maxSize: number;\n  /**\n   * Nominal default width, px — used for `aria-valuenow` before the\n   * element has been measured (SSR / jsdom) and as the reset target.\n   */\n  defaultSize: number;\n  /** Disables the interaction (handlers no-op, `aria-disabled` set). */\n  disabled?: boolean;\n  /** Fired with the committed px width; `null` means reset-to-default. */\n  onResize?: (size: number | null) => void;\n}\n\nexport interface EdgeResizeSeparatorProps {\n  role: 'separator';\n  tabIndex: number;\n  'aria-orientation': 'vertical';\n  'aria-valuemin': number;\n  'aria-valuemax': number;\n  'aria-valuenow': number;\n  'aria-valuetext': string;\n  'aria-disabled': boolean | undefined;\n  onPointerDown: (event: ReactPointerEvent<HTMLElement>) => void;\n  onPointerMove: (event: ReactPointerEvent<HTMLElement>) => void;\n  onPointerUp: (event: ReactPointerEvent<HTMLElement>) => void;\n  onPointerCancel: (event: ReactPointerEvent<HTMLElement>) => void;\n  onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;\n  onDoubleClick: () => void;\n}\n\nexport interface UseEdgeResizeReturn {\n  /**\n   * Spread onto the handle element (a plain `<div>`). Add `aria-label`,\n   * and give the handle a `ds:touch-none` class — touch browsers decide\n   * scroll-vs-drag at gesture start, before any pointer handler runs.\n   */\n  separatorProps: EdgeResizeSeparatorProps;\n  /** True while a pointer drag is in flight — suppress width transitions. */\n  isResizing: boolean;\n  /** True once the user has overridden the token-driven default. */\n  isResized: boolean;\n  /** Programmatic reset to the token-driven default width. */\n  reset: () => void;\n}\n\nexport function useEdgeResize({\n  edge,\n  targetRef,\n  cssProperty,\n  minSize,\n  maxSize,\n  defaultSize,\n  disabled = false,\n  onResize,\n}: UseEdgeResizeOptions): UseEdgeResizeReturn {\n  const { t } = useTranslation();\n  const [size, setSize] = useState<number | null>(null);\n  const [isResizing, setIsResizing] = useState(false);\n  const measuredRef = useRef<number | null>(null);\n  const dragRef = useRef<{\n    pointerId: number;\n    startX: number;\n    startSize: number;\n    sign: number;\n  } | null>(null);\n\n  useIsomorphicLayoutEffect(() => {\n    const el = targetRef.current;\n    if (!el) return;\n    const width = el.getBoundingClientRect().width;\n    if (width > 0) measuredRef.current = width;\n  });\n\n  const clamp = useCallback(\n    (px: number) => Math.min(maxSize, Math.max(minSize, px)),\n    [minSize, maxSize],\n  );\n\n  // Live read at interaction time: the mount-time measure can catch the\n  // target mid-animation (e.g. a panel still opening at width 0), so a\n  // resize must start from the width the element actually has NOW.\n  const currentSize = useCallback(() => {\n    if (size !== null) return size;\n    const el = targetRef.current;\n    if (el) {\n      const width = el.getBoundingClientRect().width;\n      if (width > 0) {\n        measuredRef.current = width;\n        return width;\n      }\n    }\n    return measuredRef.current ?? defaultSize;\n  }, [size, defaultSize, targetRef]);\n\n  const apply = useCallback(\n    (px: number) => {\n      const next = clamp(px);\n      setSize(next);\n      targetRef.current?.style.setProperty(cssProperty, `${next}px`);\n      return next;\n    },\n    [clamp, cssProperty, targetRef],\n  );\n\n  const reset = useCallback(() => {\n    setSize(null);\n    targetRef.current?.style.removeProperty(cssProperty);\n    measuredRef.current = null;\n    onResize?.(null);\n  }, [cssProperty, onResize, targetRef]);\n\n  // Pointer-drag delta → width delta. The boundary the handle moves is\n  // physical, so the logical edge and the writing direction both flip\n  // the sign: dragging right grows a start-docked surface in LTR but\n  // shrinks it in RTL, and vice versa for an end-docked one. Direction\n  // is resolved at INTERACTION time from the target's computed style —\n  // a mount-time read can be stale (the target may be unmounted while a\n  // panel is closed, and `dir` lives on a subtree wrapper, not <html>).\n  const resolveSign = useCallback(() => {\n    const el = targetRef.current;\n    const rtl = el ? getComputedStyle(el).direction === 'rtl' : false;\n    return (edge === 'inline-end' ? 1 : -1) * (rtl ? -1 : 1);\n  }, [edge, targetRef]);\n\n  const onPointerDown = useCallback(\n    (event: ReactPointerEvent<HTMLElement>) => {\n      if (disabled || !event.isPrimary) return;\n      event.currentTarget.setPointerCapture(event.pointerId);\n      dragRef.current = {\n        pointerId: event.pointerId,\n        startX: event.clientX,\n        startSize: currentSize(),\n        sign: resolveSign(),\n      };\n      setIsResizing(true);\n    },\n    [disabled, currentSize, resolveSign],\n  );\n\n  const onPointerMove = useCallback(\n    (event: ReactPointerEvent<HTMLElement>) => {\n      const drag = dragRef.current;\n      if (!drag || event.pointerId !== drag.pointerId) return;\n      apply(drag.startSize + drag.sign * (event.clientX - drag.startX));\n    },\n    [apply],\n  );\n\n  const endDrag = useCallback(\n    (event: ReactPointerEvent<HTMLElement>) => {\n      const drag = dragRef.current;\n      if (!drag || event.pointerId !== drag.pointerId) return;\n      event.currentTarget.releasePointerCapture(event.pointerId);\n      dragRef.current = null;\n      setIsResizing(false);\n      // Re-apply from the up-event coordinates so the committed width,\n      // the rendered width, and aria-valuenow all agree even when the\n      // pointer-up lands at a different X than the last move.\n      const committed = apply(\n        drag.startSize + drag.sign * (event.clientX - drag.startX),\n      );\n      onResize?.(committed);\n    },\n    [apply, onResize],\n  );\n\n  const onKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLElement>) => {\n      if (disabled) return;\n      const step = event.shiftKey ? KEY_STEP_COARSE : KEY_STEP;\n      const sign = resolveSign();\n      let next: number | null = null;\n      switch (event.key) {\n        case 'ArrowRight':\n          next = currentSize() + sign * step;\n          break;\n        case 'ArrowLeft':\n          next = currentSize() - sign * step;\n          break;\n        case 'Home':\n          next = minSize;\n          break;\n        case 'End':\n          next = maxSize;\n          break;\n        case 'Enter':\n          event.preventDefault();\n          reset();\n          return;\n        default:\n          return;\n      }\n      if (next === null) return;\n      event.preventDefault();\n      // Evaluate apply() unconditionally — `onResize?.(apply(next))`\n      // would short-circuit the argument away when no callback is set.\n      const committed = apply(next);\n      onResize?.(committed);\n    },\n    [\n      apply,\n      currentSize,\n      disabled,\n      maxSize,\n      minSize,\n      onResize,\n      reset,\n      resolveSign,\n    ],\n  );\n\n  const valueNow = Math.round(currentSize());\n\n  return {\n    separatorProps: {\n      role: 'separator',\n      tabIndex: disabled ? -1 : 0,\n      'aria-orientation': 'vertical',\n      'aria-valuemin': minSize,\n      'aria-valuemax': maxSize,\n      'aria-valuenow': valueNow,\n      'aria-valuetext': t('resizable.widthAnnounce', { width: valueNow }),\n      'aria-disabled': disabled || undefined,\n      onPointerDown,\n      onPointerMove,\n      onPointerUp: endDrag,\n      onPointerCancel: endDrag,\n      onKeyDown,\n      onDoubleClick: reset,\n    },\n    isResizing,\n    isResized: size !== null,\n    reset,\n  };\n}\n"],"names":["KEY_STEP","KEY_STEP_COARSE","useEdgeResize","edge","targetRef","cssProperty","minSize","maxSize","defaultSize","disabled","onResize","t","useTranslation","size","setSize","useState","isResizing","setIsResizing","measuredRef","useRef","dragRef","useIsomorphicLayoutEffect","el","width","clamp","useCallback","px","currentSize","apply","next","_a","reset","resolveSign","rtl","onPointerDown","event","onPointerMove","drag","endDrag","committed","onKeyDown","step","sign","valueNow"],"mappings":"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"}