@lobehub/ui 5.40.2 → 5.41.0

package/es/base-ui/DraggablePanel/core/controller.mjs

@@ -0,0 +1,206 @@
+import { AXES } from "./axes.mjs";
+import { isRtl, lockBody } from "./dom.mjs";
+import { timing } from "./transition.mjs";
+import { clamp, emitter } from "./utils.mjs";
+import { animate, motionValue } from "motion/react";
+//#region src/base-ui/DraggablePanel/core/controller.ts
+const KEY_STEP = 10;
+const KEY_STEP_FAST = 50;
+const SCREEN_DELTA = {
+	ArrowDown: 1,
+	ArrowLeft: -1,
+	ArrowRight: 1,
+	ArrowUp: -1
+};
+const createPanelController = (initial) => {
+	const { emit: notify, subscribe } = emitter();
+	let element = null;
+	let options = initial;
+	let target = initial.expand ? initial.size : 0;
+	let state = {
+		collapsing: false,
+		dragging: false,
+		folding: false
+	};
+	let unlock;
+	let foldTo = target;
+	const size = motionValue(target);
+	const content = motionValue(initial.size);
+	const session = {
+		collapsing: false,
+		max: 0,
+		min: 0,
+		sign: 1,
+		start: 0
+	};
+	const patch = (next) => {
+		if (Object.entries(next).some(([key, value]) => state[key] !== value)) {
+			state = {
+				...state,
+				...next
+			};
+			notify();
+		}
+	};
+	const bounds = () => {
+		const min = Math.max(0, options.min);
+		return {
+			max: options.max === void 0 ? Number.POSITIVE_INFINITY : Math.max(min, options.max),
+			min
+		};
+	};
+	const growSign = () => {
+		const axis = AXES[options.placement];
+		return axis.grow * (axis.vertical || !isRtl(element) ? 1 : -1);
+	};
+	const fold = (to) => {
+		foldTo = to;
+		patch({ folding: true });
+		if (size.get() === 0) content.jump(to || content.get());
+		else if (to > 0) animate(content, to, timing());
+		animate(size, to, timing());
+	};
+	const release = () => {
+		unlock?.();
+		unlock = void 0;
+	};
+	const stopDragging = () => {
+		release();
+		patch({
+			collapsing: false,
+			dragging: false
+		});
+	};
+	const drag = {
+		cancel: () => {
+			if (!state.dragging) return;
+			size.jump(session.start);
+			content.jump(session.start);
+			stopDragging();
+		},
+		end: () => {
+			if (!state.dragging) return;
+			const { collapsing, start } = session;
+			const committed = collapsing ? start : size.get();
+			stopDragging();
+			if (collapsing) {
+				content.jump(start);
+				options.onExpandChange?.(false);
+			}
+			options.onSizeChange?.(committed, committed - start);
+		},
+		move: (offset) => {
+			if (!state.dragging) return;
+			const axis = AXES[options.placement];
+			const pixels = session.start + offset[axis.point] * session.sign;
+			const collapsing = options.collapseThreshold !== void 0 && pixels < options.collapseThreshold;
+			const next = collapsing ? 0 : Math.round(clamp(pixels, session.min, session.max));
+			size.jump(next);
+			if (!collapsing) content.jump(next);
+			if (collapsing !== session.collapsing) {
+				session.collapsing = collapsing;
+				patch({ collapsing });
+			}
+			const reported = collapsing ? session.start : next;
+			options.onSizeDragging?.(reported, reported - session.start);
+		},
+		start: () => {
+			Object.assign(session, {
+				...bounds(),
+				collapsing: false,
+				sign: growSign(),
+				start: size.get()
+			});
+			release();
+			unlock = lockBody(AXES[options.placement].cursor, drag.cancel);
+			patch({
+				dragging: true,
+				folding: false
+			});
+		}
+	};
+	const resizeByKey = (event) => {
+		if (event.key === "Enter" || event.key === " ") {
+			if (!options.onExpandChange) return;
+			event.preventDefault();
+			options.onExpandChange(!options.expand);
+			return;
+		}
+		const { max, min } = bounds();
+		const step = (event.shiftKey || event.key === "PageUp" || event.key === "PageDown" ? KEY_STEP_FAST : KEY_STEP) * growSign();
+		const screen = (AXES[options.placement].vertical ? event.key === "ArrowUp" || event.key === "ArrowDown" : event.key === "ArrowLeft" || event.key === "ArrowRight") ? SCREEN_DELTA[event.key] : void 0;
+		const moves = {
+			End: Number.isFinite(max) ? max : target,
+			Home: min,
+			PageDown: target + step,
+			PageUp: target - step
+		};
+		const next = screen === void 0 ? moves[event.key] : target + screen * step;
+		if (next === void 0) return;
+		event.preventDefault();
+		const value = clamp(next, min, max);
+		if (!options.expand && value > 0) options.onExpandChange?.(true);
+		options.onSizeChange?.(value, value - target);
+	};
+	const sync = (next) => {
+		options = next;
+		const value = next.expand ? next.size : 0;
+		if (size.get() === 0 && value > 0) content.jump(next.size);
+		if (value !== target) {
+			target = value;
+			notify();
+		}
+		if (state.dragging) return;
+		if (size.get() === target) {
+			size.stop();
+			content.stop();
+			if (state.folding) {
+				patch({ folding: false });
+				content.jump(target || content.get());
+			}
+			foldTo = target;
+		} else if (!state.folding || foldTo !== target) fold(target);
+	};
+	return {
+		attach: (node) => {
+			element = node;
+			const stopSettle = size.on("animationComplete", () => {
+				if (size.get() === target) patch({ folding: false });
+			});
+			return () => {
+				stopSettle();
+				release();
+				element = null;
+			};
+		},
+		get axis() {
+			return AXES[options.placement];
+		},
+		bounds,
+		drag,
+		motion: {
+			content,
+			size
+		},
+		get options() {
+			return options;
+		},
+		reset: () => {
+			if (!options.expand) options.onExpandChange?.(true);
+			options.onSizeChange?.(options.defaultSize, options.defaultSize - target);
+		},
+		resizeByKey,
+		get state() {
+			return state;
+		},
+		subscribe,
+		sync,
+		get target() {
+			return target;
+		}
+	};
+};
+//#endregion
+export { createPanelController };
+
+//# sourceMappingURL=controller.mjs.map

package/es/base-ui/DraggablePanel/core/controller.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"controller.mjs","names":[],"sources":["../../../../src/base-ui/DraggablePanel/core/controller.ts"],"sourcesContent":["import { animate, type MotionValue, motionValue } from 'motion/react';\n\nimport type { Axis, Placement } from './axes';\nimport { AXES } from './axes';\nimport { isRtl, lockBody } from './dom';\nimport { timing } from './transition';\nimport { clamp, emitter } from './utils';\n\nconst KEY_STEP = 10;\nconst KEY_STEP_FAST = 50;\n\nconst SCREEN_DELTA: Record<string, number> = {\n  ArrowDown: 1,\n  ArrowLeft: -1,\n  ArrowRight: 1,\n  ArrowUp: -1,\n};\n\nexport interface PanelControllerOptions {\n  collapseThreshold?: number;\n  defaultSize: number;\n  expand: boolean;\n  max?: number;\n  min: number;\n  onExpandChange?: (expand: boolean) => void;\n  onSizeChange?: (size: number, delta: number) => void;\n  onSizeDragging?: (size: number, delta: number) => void;\n  placement: Placement;\n  size: number;\n}\n\nexport interface PanelState {\n  collapsing: boolean;\n  dragging: boolean;\n  folding: boolean;\n}\n\nexport interface PanelKeyEvent {\n  key: string;\n  preventDefault: () => void;\n  shiftKey: boolean;\n}\n\nexport interface PanelController {\n  attach: (element: HTMLElement) => () => void;\n  axis: Axis;\n  bounds: () => { max: number; min: number };\n  drag: {\n    cancel: () => void;\n    end: () => void;\n    move: (offset: { x: number; y: number }) => void;\n    start: () => void;\n  };\n  motion: { content: MotionValue<number>; size: MotionValue<number> };\n  options: PanelControllerOptions;\n  reset: () => void;\n  resizeByKey: (event: PanelKeyEvent) => void;\n  state: PanelState;\n  subscribe: (listener: () => void) => () => void;\n  sync: (options: PanelControllerOptions) => void;\n  target: number;\n}\n\nexport const createPanelController = (initial: PanelControllerOptions): PanelController => {\n  const { emit: notify, subscribe } = emitter();\n\n  let element: HTMLElement | null = null;\n  let options = initial;\n  let target = initial.expand ? initial.size : 0;\n  let state: PanelState = { collapsing: false, dragging: false, folding: false };\n  let unlock: (() => void) | undefined;\n  let foldTo = target;\n\n  const size = motionValue(target);\n  const content = motionValue(initial.size);\n\n  const session = {\n    collapsing: false,\n    max: 0,\n    min: 0,\n    sign: 1,\n    start: 0,\n  };\n\n  const patch = (next: Partial<PanelState>) => {\n    const entries = Object.entries(next) as [keyof PanelState, boolean][];\n    if (entries.some(([key, value]) => state[key] !== value)) {\n      state = { ...state, ...next };\n      notify();\n    }\n  };\n\n  const bounds = () => {\n    const min = Math.max(0, options.min);\n    const max = options.max === undefined ? Number.POSITIVE_INFINITY : Math.max(min, options.max);\n    return { max, min };\n  };\n\n  const growSign = () => {\n    const axis = AXES[options.placement];\n    return axis.grow * (axis.vertical || !isRtl(element) ? 1 : -1);\n  };\n\n  const fold = (to: number) => {\n    foldTo = to;\n    patch({ folding: true });\n    if (size.get() === 0) content.jump(to || content.get());\n    else if (to > 0) animate(content, to, timing());\n    animate(size, to, timing());\n  };\n\n  const release = () => {\n    unlock?.();\n    unlock = undefined;\n  };\n\n  const stopDragging = () => {\n    release();\n    patch({ collapsing: false, dragging: false });\n  };\n\n  const drag = {\n    cancel: () => {\n      if (!state.dragging) return;\n      size.jump(session.start);\n      content.jump(session.start);\n      stopDragging();\n    },\n    end: () => {\n      if (!state.dragging) return;\n      const { collapsing, start } = session;\n      const committed = collapsing ? start : size.get();\n      stopDragging();\n      if (collapsing) {\n        content.jump(start);\n        options.onExpandChange?.(false);\n      }\n      options.onSizeChange?.(committed, committed - start);\n    },\n    move: (offset: { x: number; y: number }) => {\n      if (!state.dragging) return;\n      const axis = AXES[options.placement];\n      const pixels = session.start + offset[axis.point] * session.sign;\n      const collapsing =\n        options.collapseThreshold !== undefined && pixels < options.collapseThreshold;\n      const next = collapsing ? 0 : Math.round(clamp(pixels, session.min, session.max));\n\n      size.jump(next);\n      if (!collapsing) content.jump(next);\n      if (collapsing !== session.collapsing) {\n        session.collapsing = collapsing;\n        patch({ collapsing });\n      }\n      const reported = collapsing ? session.start : next;\n      options.onSizeDragging?.(reported, reported - session.start);\n    },\n    start: () => {\n      Object.assign(session, {\n        ...bounds(),\n        collapsing: false,\n        sign: growSign(),\n        start: size.get(),\n      });\n      release();\n      unlock = lockBody(AXES[options.placement].cursor, drag.cancel);\n      patch({ dragging: true, folding: false });\n    },\n  };\n\n  const resizeByKey = (event: PanelKeyEvent) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      if (!options.onExpandChange) return;\n      event.preventDefault();\n      options.onExpandChange(!options.expand);\n      return;\n    }\n\n    const { max, min } = bounds();\n    const fast = event.shiftKey || event.key === 'PageUp' || event.key === 'PageDown';\n    const step = (fast ? KEY_STEP_FAST : KEY_STEP) * growSign();\n    const axis = AXES[options.placement];\n    const onAxis = axis.vertical\n      ? event.key === 'ArrowUp' || event.key === 'ArrowDown'\n      : event.key === 'ArrowLeft' || event.key === 'ArrowRight';\n    const screen = onAxis ? SCREEN_DELTA[event.key] : undefined;\n    const moves: Record<string, number> = {\n      End: Number.isFinite(max) ? max : target,\n      Home: min,\n      PageDown: target + step,\n      PageUp: target - step,\n    };\n    const next = screen === undefined ? moves[event.key] : target + screen * step;\n    if (next === undefined) return;\n\n    event.preventDefault();\n    const value = clamp(next, min, max);\n    if (!options.expand && value > 0) options.onExpandChange?.(true);\n    options.onSizeChange?.(value, value - target);\n  };\n\n  const sync = (next: PanelControllerOptions) => {\n    options = next;\n    const value = next.expand ? next.size : 0;\n    if (size.get() === 0 && value > 0) content.jump(next.size);\n    if (value !== target) {\n      target = value;\n      notify();\n    }\n    if (state.dragging) return;\n    if (size.get() === target) {\n      // A reversal can land back on the target before the outgoing animation\n      // has moved; without this it keeps running past the new target.\n      size.stop();\n      content.stop();\n      if (state.folding) {\n        patch({ folding: false });\n        content.jump(target || content.get());\n      }\n      // A settled panel still needs its content aligned after a controlled reset.\n      foldTo = target;\n    } else if (!state.folding || foldTo !== target) {\n      fold(target);\n    }\n  };\n\n  return {\n    attach: (node) => {\n      element = node;\n      const stopSettle = size.on('animationComplete', () => {\n        if (size.get() === target) patch({ folding: false });\n      });\n      return () => {\n        stopSettle();\n        release();\n        element = null;\n      };\n    },\n    get axis() {\n      return AXES[options.placement];\n    },\n    bounds,\n    drag,\n    motion: { content, size },\n    get options() {\n      return options;\n    },\n    reset: () => {\n      if (!options.expand) options.onExpandChange?.(true);\n      options.onSizeChange?.(options.defaultSize, options.defaultSize - target);\n    },\n    resizeByKey,\n    get state() {\n      return state;\n    },\n    subscribe,\n    sync,\n    get target() {\n      return target;\n    },\n  };\n};\n"],"mappings":"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"}

package/es/base-ui/DraggablePanel/core/dom.mjs

@@ -0,0 +1,34 @@
+//#region src/base-ui/DraggablePanel/core/dom.ts
+const isRtl = (element) => !!element && getComputedStyle(element).direction === "rtl";
+let locks = 0;
+let saved = {};
+const lockBody = (cursor, onEscape) => {
+	const { style } = document.body;
+	const onKeyDown = (event) => {
+		if (event.key === "Escape") {
+			event.preventDefault();
+			onEscape();
+		}
+	};
+	if (locks === 0) saved = {
+		cursor: style.cursor,
+		userSelect: style.userSelect,
+		webkitUserSelect: style.webkitUserSelect
+	};
+	locks += 1;
+	Object.assign(style, {
+		cursor,
+		userSelect: "none",
+		webkitUserSelect: "none"
+	});
+	addEventListener("keydown", onKeyDown, true);
+	return () => {
+		locks -= 1;
+		if (locks === 0) Object.assign(style, saved);
+		removeEventListener("keydown", onKeyDown, true);
+	};
+};
+//#endregion
+export { isRtl, lockBody };
+
+//# sourceMappingURL=dom.mjs.map

package/es/base-ui/DraggablePanel/core/dom.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"dom.mjs","names":[],"sources":["../../../../src/base-ui/DraggablePanel/core/dom.ts"],"sourcesContent":["export const isRtl = (element: Element | null) =>\n  !!element && getComputedStyle(element).direction === 'rtl';\n\nlet locks = 0;\nlet saved: Partial<CSSStyleDeclaration> = {};\n\nexport const lockBody = (cursor: string, onEscape: () => void) => {\n  const { style } = document.body;\n  const onKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'Escape') {\n      event.preventDefault();\n      onEscape();\n    }\n  };\n\n  if (locks === 0) {\n    saved = {\n      cursor: style.cursor,\n      userSelect: style.userSelect,\n      webkitUserSelect: style.webkitUserSelect,\n    };\n  }\n  locks += 1;\n  Object.assign(style, { cursor, userSelect: 'none', webkitUserSelect: 'none' });\n  addEventListener('keydown', onKeyDown, true);\n\n  return () => {\n    locks -= 1;\n    if (locks === 0) Object.assign(style, saved);\n    removeEventListener('keydown', onKeyDown, true);\n  };\n};\n"],"mappings":";AAAA,MAAa,SAAS,YACpB,CAAC,CAAC,WAAW,iBAAiB,OAAO,CAAC,CAAC,cAAc;AAEvD,IAAI,QAAQ;AACZ,IAAI,QAAsC,CAAC;AAE3C,MAAa,YAAY,QAAgB,aAAyB;CAChE,MAAM,EAAE,UAAU,SAAS;CAC3B,MAAM,aAAa,UAAyB;EAC1C,IAAI,MAAM,QAAQ,UAAU;GAC1B,MAAM,eAAe;GACrB,SAAS;EACX;CACF;CAEA,IAAI,UAAU,GACZ,QAAQ;EACN,QAAQ,MAAM;EACd,YAAY,MAAM;EAClB,kBAAkB,MAAM;CAC1B;CAEF,SAAS;CACT,OAAO,OAAO,OAAO;EAAE;EAAQ,YAAY;EAAQ,kBAAkB;CAAO,CAAC;CAC7E,iBAAiB,WAAW,WAAW,IAAI;CAE3C,aAAa;EACX,SAAS;EACT,IAAI,UAAU,GAAG,OAAO,OAAO,OAAO,KAAK;EAC3C,oBAAoB,WAAW,WAAW,IAAI;CAChD;AACF"}

package/es/base-ui/DraggablePanel/core/env.mjs

@@ -0,0 +1,28 @@
+//#region src/base-ui/DraggablePanel/core/env.ts
+const media = (query) => {
+	let list;
+	const get = () => {
+		list ??= typeof matchMedia === "function" ? matchMedia(query) : void 0;
+		return list;
+	};
+	return {
+		get: () => get()?.matches ?? false,
+		subscribe: (listener) => {
+			get()?.addEventListener("change", listener);
+			return () => get()?.removeEventListener("change", listener);
+		}
+	};
+};
+const coarsePointer = media("(pointer: coarse)");
+const reducedMotion = media("(prefers-reduced-motion: reduce)");
+const HANDLE_SIZE_FINE = 8;
+const HANDLE_SIZE_WIDE = 16;
+const HANDLE_SIZE_COARSE = 20;
+const handleSize = (wide = true) => {
+	if (coarsePointer.get()) return HANDLE_SIZE_COARSE;
+	return wide ? HANDLE_SIZE_WIDE : HANDLE_SIZE_FINE;
+};
+//#endregion
+export { coarsePointer, handleSize, reducedMotion };
+
+//# sourceMappingURL=env.mjs.map

package/es/base-ui/DraggablePanel/core/env.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"env.mjs","names":[],"sources":["../../../../src/base-ui/DraggablePanel/core/env.ts"],"sourcesContent":["const media = (query: string) => {\n  let list: MediaQueryList | undefined;\n  const get = () => {\n    list ??= typeof matchMedia === 'function' ? matchMedia(query) : undefined;\n    return list;\n  };\n\n  return {\n    get: () => get()?.matches ?? false,\n    subscribe: (listener: () => void) => {\n      get()?.addEventListener('change', listener);\n      return () => get()?.removeEventListener('change', listener);\n    },\n  };\n};\n\nexport const coarsePointer = media('(pointer: coarse)');\nexport const reducedMotion = media('(prefers-reduced-motion: reduce)');\n\nconst HANDLE_SIZE_FINE = 8;\nconst HANDLE_SIZE_WIDE = 16;\nconst HANDLE_SIZE_COARSE = 20;\n\nexport const handleSize = (wide = true) => {\n  if (coarsePointer.get()) return HANDLE_SIZE_COARSE;\n  return wide ? HANDLE_SIZE_WIDE : HANDLE_SIZE_FINE;\n};\n"],"mappings":";AAAA,MAAM,SAAS,UAAkB;CAC/B,IAAI;CACJ,MAAM,YAAY;EAChB,SAAS,OAAO,eAAe,aAAa,WAAW,KAAK,IAAI,KAAA;EAChE,OAAO;CACT;CAEA,OAAO;EACL,WAAW,IAAI,CAAC,EAAE,WAAW;EAC7B,YAAY,aAAyB;GACnC,IAAI,CAAC,EAAE,iBAAiB,UAAU,QAAQ;GAC1C,aAAa,IAAI,CAAC,EAAE,oBAAoB,UAAU,QAAQ;EAC5D;CACF;AACF;AAEA,MAAa,gBAAgB,MAAM,mBAAmB;AACtD,MAAa,gBAAgB,MAAM,kCAAkC;AAErE,MAAM,mBAAmB;AACzB,MAAM,mBAAmB;AACzB,MAAM,qBAAqB;AAE3B,MAAa,cAAc,OAAO,SAAS;CACzC,IAAI,cAAc,IAAI,GAAG,OAAO;CAChC,OAAO,OAAO,mBAAmB;AACnC"}

package/es/base-ui/DraggablePanel/core/internal.mjs

@@ -0,0 +1,9 @@
+"use client";
+import { useEffect, useLayoutEffect, useSyncExternalStore } from "react";
+//#region src/base-ui/DraggablePanel/core/internal.ts
+const useIsomorphicLayoutEffect = typeof window === "undefined" ? useEffect : useLayoutEffect;
+const useStore = (subscribe, get) => useSyncExternalStore(subscribe, get, get);
+//#endregion
+export { useIsomorphicLayoutEffect, useStore };
+
+//# sourceMappingURL=internal.mjs.map

package/es/base-ui/DraggablePanel/core/internal.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"internal.mjs","names":[],"sources":["../../../../src/base-ui/DraggablePanel/core/internal.ts"],"sourcesContent":["'use client';\n\nimport { useEffect, useLayoutEffect, useSyncExternalStore } from 'react';\n\nexport const useIsomorphicLayoutEffect =\n  typeof window === 'undefined' ? useEffect : useLayoutEffect;\n\nexport const useStore = <T>(subscribe: (listener: () => void) => () => void, get: () => T) =>\n  useSyncExternalStore(subscribe, get, get);\n"],"mappings":";;;AAIA,MAAa,4BACX,OAAO,WAAW,cAAc,YAAY;AAE9C,MAAa,YAAe,WAAiD,QAC3E,qBAAqB,WAAW,KAAK,GAAG"}

package/es/base-ui/DraggablePanel/core/transition.mjs

@@ -0,0 +1,17 @@
+import { reducedMotion } from "./env.mjs";
+//#region src/base-ui/DraggablePanel/core/transition.ts
+const TRANSITION = {
+	duration: .25,
+	ease: [
+		.32,
+		.72,
+		0,
+		1
+	]
+};
+const INSTANT = { duration: 0 };
+const timing = (transition) => reducedMotion.get() ? INSTANT : transition ?? TRANSITION;
+//#endregion
+export { TRANSITION, timing };
+
+//# sourceMappingURL=transition.mjs.map

package/es/base-ui/DraggablePanel/core/transition.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"transition.mjs","names":[],"sources":["../../../../src/base-ui/DraggablePanel/core/transition.ts"],"sourcesContent":["import type { Transition } from 'motion/react';\n\nimport { reducedMotion } from './env';\n\nexport const TRANSITION: Transition = {\n  duration: 0.25,\n  ease: [0.32, 0.72, 0, 1],\n};\n\nconst INSTANT: Transition = { duration: 0 };\n\nexport const timing = (transition?: Transition): Transition =>\n  reducedMotion.get() ? INSTANT : (transition ?? TRANSITION);\n"],"mappings":";;AAIA,MAAa,aAAyB;CACpC,UAAU;CACV,MAAM;EAAC;EAAM;EAAM;EAAG;CAAC;AACzB;AAEA,MAAM,UAAsB,EAAE,UAAU,EAAE;AAE1C,MAAa,UAAU,eACrB,cAAc,IAAI,IAAI,UAAW,cAAc"}

package/es/base-ui/DraggablePanel/core/utils.mjs

@@ -0,0 +1,20 @@
+//#region src/base-ui/DraggablePanel/core/utils.ts
+const clamp = (value, min, max) => Math.min(Math.max(value, min), max);
+const emitter = () => {
+	const listeners = /* @__PURE__ */ new Set();
+	return {
+		emit: () => {
+			for (const listener of listeners) listener();
+		},
+		subscribe: (listener) => {
+			listeners.add(listener);
+			return () => {
+				listeners.delete(listener);
+			};
+		}
+	};
+};
+//#endregion
+export { clamp, emitter };
+
+//# sourceMappingURL=utils.mjs.map

package/es/base-ui/DraggablePanel/core/utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.mjs","names":[],"sources":["../../../../src/base-ui/DraggablePanel/core/utils.ts"],"sourcesContent":["export const clamp = (value: number, min: number, max: number) =>\n  Math.min(Math.max(value, min), max);\n\nexport const emitter = () => {\n  const listeners = new Set<() => void>();\n\n  return {\n    emit: () => {\n      for (const listener of listeners) listener();\n    },\n    subscribe: (listener: () => void) => {\n      listeners.add(listener);\n      return () => {\n        listeners.delete(listener);\n      };\n    },\n  };\n};\n"],"mappings":";AAAA,MAAa,SAAS,OAAe,KAAa,QAChD,KAAK,IAAI,KAAK,IAAI,OAAO,GAAG,GAAG,GAAG;AAEpC,MAAa,gBAAgB;CAC3B,MAAM,4BAAY,IAAI,IAAgB;CAEtC,OAAO;EACL,YAAY;GACV,KAAK,MAAM,YAAY,WAAW,SAAS;EAC7C;EACA,YAAY,aAAyB;GACnC,UAAU,IAAI,QAAQ;GACtB,aAAa;IACX,UAAU,OAAO,QAAQ;GAC3B;EACF;CACF;AACF"}

package/es/base-ui/DraggablePanel/index.d.mts

@@ -0,0 +1,5 @@
+import { DraggablePanelBody, DraggablePanelBodyProps, DraggablePanelContainer, DraggablePanelContainerProps, DraggablePanelContent, DraggablePanelContentProps, DraggablePanelFooter, DraggablePanelFooterProps, DraggablePanelHandle, DraggablePanelHandleProps, DraggablePanelHeader, DraggablePanelHeaderProps, DraggablePanelRoot, DraggablePanelRootProps, DraggablePanelToggle, DraggablePanelToggleProps } from "./atoms.mjs";
+import { useDraggablePanelContext } from "./context.mjs";
+import { DraggablePanelPlacement, DraggablePanelProps, DraggablePanelSize } from "./type.mjs";
+import DraggablePanel from "./DraggablePanel.mjs";
+export { DraggablePanel, DraggablePanelBody, type DraggablePanelBodyProps, DraggablePanelContainer, type DraggablePanelContainerProps, DraggablePanelContent, type DraggablePanelContentProps, DraggablePanelFooter, type DraggablePanelFooterProps, DraggablePanelHandle, type DraggablePanelHandleProps, DraggablePanelHeader, type DraggablePanelHeaderProps, type DraggablePanelPlacement, type DraggablePanelProps, DraggablePanelRoot, type DraggablePanelRootProps, type DraggablePanelSize, DraggablePanelToggle, type DraggablePanelToggleProps, useDraggablePanelContext };