react-grab 0.1.28 → 0.1.30

package/dist/state-XYH8BGBU.cjs

@@ -0,0 +1,372 @@
+/**
+ * @license MIT
+ *
+ * Copyright (c) 2025 Aiden Bai
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+const require_freeze_updates = require('./freeze-updates-CtYFeM4D.cjs');
+
+//#region src/utils/is-element-connected.ts
+const isElementConnected = (element) => Boolean(element?.isConnected ?? element?.ownerDocument?.contains(element));
+
+//#endregion
+//#region src/utils/is-keyboard-event-triggered-by-input.ts
+const EDITABLE_TAGS_AND_ROLES = [
+	"input",
+	"textarea",
+	"select",
+	"searchbox",
+	"slider",
+	"spinbutton",
+	"menuitem",
+	"menuitemcheckbox",
+	"menuitemradio",
+	"option",
+	"radio",
+	"textbox",
+	"combobox"
+];
+const getTargetElement = (event) => {
+	if (event.composed) {
+		const firstElement = event.composedPath()[0];
+		if (firstElement instanceof HTMLElement) return firstElement;
+	} else if (event.target instanceof HTMLElement) return event.target;
+};
+const isKeyboardEventTriggeredByInput = (event) => {
+	if (document.designMode === "on") return true;
+	const targetElement = getTargetElement(event);
+	if (!targetElement) return false;
+	if (targetElement.isContentEditable) return true;
+	const tagName = require_freeze_updates.getTagName(targetElement);
+	return EDITABLE_TAGS_AND_ROLES.some((tagOrRole) => tagOrRole === tagName || tagOrRole === targetElement.role);
+};
+const hasTextSelectionInInput = (event) => {
+	const target = event.target;
+	if (target instanceof HTMLInputElement || target instanceof HTMLTextAreaElement) {
+		const selectionStart = target.selectionStart ?? 0;
+		return (target.selectionEnd ?? 0) - selectionStart > 0;
+	}
+	return false;
+};
+const hasTextSelectionOnPage = () => {
+	const selection = window.getSelection();
+	if (!selection) return false;
+	return selection.toString().length > 0;
+};
+
+//#endregion
+//#region src/utils/get-visual-viewport.ts
+const getVisualViewport = () => {
+	const visualViewport = window.visualViewport;
+	if (visualViewport) return {
+		width: visualViewport.width,
+		height: visualViewport.height,
+		offsetLeft: visualViewport.offsetLeft,
+		offsetTop: visualViewport.offsetTop
+	};
+	return {
+		width: window.innerWidth,
+		height: window.innerHeight,
+		offsetLeft: 0,
+		offsetTop: 0
+	};
+};
+
+//#endregion
+//#region src/utils/toolbar-position.ts
+const clampToRange = (value, min, max) => Math.max(min, Math.min(value, max));
+const getPositionFromEdgeAndRatio = (edge, ratio, elementWidth, elementHeight) => {
+	const viewport = getVisualViewport();
+	const viewportWidth = viewport.width;
+	const viewportHeight = viewport.height;
+	const minX = viewport.offsetLeft + 16;
+	const maxX = Math.max(minX, viewport.offsetLeft + viewportWidth - elementWidth - 16);
+	const minY = viewport.offsetTop + 16;
+	const maxY = Math.max(minY, viewport.offsetTop + viewportHeight - elementHeight - 16);
+	if (edge === "top" || edge === "bottom") {
+		const availableWidth = Math.max(0, viewportWidth - elementWidth - 16 * 2);
+		return {
+			x: Math.min(maxX, Math.max(minX, viewport.offsetLeft + 16 + availableWidth * ratio)),
+			y: edge === "top" ? minY : maxY
+		};
+	}
+	const availableHeight = Math.max(0, viewportHeight - elementHeight - 16 * 2);
+	const positionY = Math.min(maxY, Math.max(minY, viewport.offsetTop + 16 + availableHeight * ratio));
+	return {
+		x: edge === "left" ? minX : maxX,
+		y: positionY
+	};
+};
+const getRatioFromPosition = (edge, positionX, positionY, elementWidth, elementHeight) => {
+	const viewport = getVisualViewport();
+	const viewportWidth = viewport.width;
+	const viewportHeight = viewport.height;
+	if (edge === "top" || edge === "bottom") {
+		const availableWidth = viewportWidth - elementWidth - 16 * 2;
+		if (availableWidth <= 0) return require_freeze_updates.TOOLBAR_DEFAULT_POSITION_RATIO;
+		return Math.max(0, Math.min(1, (positionX - viewport.offsetLeft - 16) / availableWidth));
+	}
+	const availableHeight = viewportHeight - elementHeight - 16 * 2;
+	if (availableHeight <= 0) return require_freeze_updates.TOOLBAR_DEFAULT_POSITION_RATIO;
+	return Math.max(0, Math.min(1, (positionY - viewport.offsetTop - 16) / availableHeight));
+};
+const calculateExpandedPositionFromCollapsed = (collapsedPosition, edge, expandedDimensions, actualCollapsedWidth, actualCollapsedHeight) => {
+	const viewport = getVisualViewport();
+	const viewportWidth = viewport.width;
+	const viewportHeight = viewport.height;
+	const { width: expandedWidth, height: expandedHeight } = expandedDimensions;
+	let newPosition;
+	if (edge === "top" || edge === "bottom") {
+		const xOffset = (expandedWidth - actualCollapsedWidth) / 2;
+		newPosition = {
+			x: clampToRange(collapsedPosition.x - xOffset, viewport.offsetLeft + 16, viewport.offsetLeft + viewportWidth - expandedWidth - 16),
+			y: edge === "top" ? viewport.offsetTop + 16 : viewport.offsetTop + viewportHeight - expandedHeight - 16
+		};
+	} else {
+		const yOffset = (expandedHeight - actualCollapsedHeight) / 2;
+		const clampedY = clampToRange(collapsedPosition.y - yOffset, viewport.offsetTop + 16, viewport.offsetTop + viewportHeight - expandedHeight - 16);
+		newPosition = {
+			x: edge === "left" ? viewport.offsetLeft + 16 : viewport.offsetLeft + viewportWidth - expandedWidth - 16,
+			y: clampedY
+		};
+	}
+	const ratio = getRatioFromPosition(edge, newPosition.x, newPosition.y, expandedWidth, expandedHeight);
+	return {
+		position: newPosition,
+		ratio
+	};
+};
+const getCollapsedPosition = (edge, expandedPosition, expandedDimensions, collapsedDimensions) => {
+	const viewport = getVisualViewport();
+	const { width: expandedWidth, height: expandedHeight } = expandedDimensions;
+	const { width: collapsedWidth, height: collapsedHeight } = collapsedDimensions;
+	switch (edge) {
+		case "top":
+		case "bottom": {
+			const xOffset = (expandedWidth - collapsedWidth) / 2;
+			return {
+				x: clampToRange(expandedPosition.x + xOffset, viewport.offsetLeft, viewport.offsetLeft + viewport.width - collapsedWidth),
+				y: edge === "top" ? viewport.offsetTop : viewport.offsetTop + viewport.height - collapsedHeight
+			};
+		}
+		case "left":
+		case "right": {
+			const yOffset = (expandedHeight - collapsedHeight) / 2;
+			const clampedY = clampToRange(expandedPosition.y + yOffset, viewport.offsetTop, viewport.offsetTop + viewport.height - collapsedHeight);
+			return {
+				x: edge === "left" ? viewport.offsetLeft : viewport.offsetLeft + viewport.width - collapsedWidth,
+				y: clampedY
+			};
+		}
+	}
+};
+const getSnapPosition = (currentX, currentY, elementWidth, elementHeight, velocityX, velocityY) => {
+	const viewport = getVisualViewport();
+	const viewportWidth = viewport.width;
+	const viewportHeight = viewport.height;
+	const projectedX = currentX + velocityX * 150;
+	const projectedY = currentY + velocityY * 150;
+	const distanceToTop = projectedY - viewport.offsetTop + elementHeight / 2;
+	const distanceToBottom = viewport.offsetTop + viewportHeight - projectedY - elementHeight / 2;
+	const distanceToLeft = projectedX - viewport.offsetLeft + elementWidth / 2;
+	const distanceToRight = viewport.offsetLeft + viewportWidth - projectedX - elementWidth / 2;
+	const minDistance = Math.min(distanceToTop, distanceToBottom, distanceToLeft, distanceToRight);
+	const clampX = (rawX) => clampToRange(rawX, viewport.offsetLeft + 16, viewport.offsetLeft + viewportWidth - elementWidth - 16);
+	const clampY = (rawY) => clampToRange(rawY, viewport.offsetTop + 16, viewport.offsetTop + viewportHeight - elementHeight - 16);
+	if (minDistance === distanceToTop) return {
+		edge: "top",
+		x: clampX(projectedX),
+		y: viewport.offsetTop + 16
+	};
+	if (minDistance === distanceToLeft) return {
+		edge: "left",
+		x: viewport.offsetLeft + 16,
+		y: clampY(projectedY)
+	};
+	if (minDistance === distanceToRight) return {
+		edge: "right",
+		x: viewport.offsetLeft + viewportWidth - elementWidth - 16,
+		y: clampY(projectedY)
+	};
+	return {
+		edge: "bottom",
+		x: clampX(projectedX),
+		y: viewport.offsetTop + viewportHeight - elementHeight - 16
+	};
+};
+
+//#endregion
+//#region src/utils/is-mac.ts
+let cachedIsMac = null;
+const getPlatformFromUserAgentData = () => {
+	if (typeof navigator === "undefined") return null;
+	if (!("userAgentData" in navigator)) return null;
+	const userAgentData = navigator.userAgentData;
+	if (typeof userAgentData !== "object" || userAgentData === null) return null;
+	if (!("platform" in userAgentData)) return null;
+	const platform = userAgentData.platform;
+	if (typeof platform !== "string") return null;
+	return platform;
+};
+const isMac = () => {
+	if (cachedIsMac === null) {
+		if (typeof navigator === "undefined") {
+			cachedIsMac = false;
+			return cachedIsMac;
+		}
+		const platform = navigator.platform ?? getPlatformFromUserAgentData() ?? navigator.userAgent;
+		cachedIsMac = /Mac|iPhone|iPad|iPod/i.test(platform);
+	}
+	return cachedIsMac;
+};
+
+//#endregion
+//#region src/utils/is-event-from-overlay.ts
+const isEventFromOverlay = (event, attribute) => {
+	try {
+		return event.composedPath().some((target) => target instanceof HTMLElement && target.hasAttribute(attribute));
+	} catch {
+		return false;
+	}
+};
+
+//#endregion
+//#region src/utils/resolve-action-enabled.ts
+const resolveBooleanEnabled = (enabled) => enabled ?? true;
+const resolveActionEnabled = (action, context) => {
+	if (typeof action.enabled === "function") {
+		if (!context) return false;
+		return action.enabled(context);
+	}
+	return resolveBooleanEnabled(action.enabled);
+};
+
+//#endregion
+//#region src/components/toolbar/state.ts
+const STORAGE_KEY = "react-grab-toolbar-state";
+const loadToolbarState = () => {
+	try {
+		const serializedToolbarState = localStorage.getItem(STORAGE_KEY);
+		if (!serializedToolbarState) return null;
+		const parsed = JSON.parse(serializedToolbarState);
+		if (typeof parsed !== "object" || parsed === null) return null;
+		const record = parsed;
+		return {
+			edge: record.edge === "top" || record.edge === "bottom" || record.edge === "left" || record.edge === "right" ? record.edge : "bottom",
+			ratio: typeof record.ratio === "number" ? record.ratio : require_freeze_updates.TOOLBAR_DEFAULT_POSITION_RATIO,
+			collapsed: typeof record.collapsed === "boolean" ? record.collapsed : false,
+			enabled: typeof record.enabled === "boolean" ? record.enabled : true,
+			defaultAction: typeof record.defaultAction === "string" ? record.defaultAction : require_freeze_updates.DEFAULT_ACTION_ID
+		};
+	} catch (error) {
+		console.warn("[react-grab] Failed to load toolbar state from localStorage:", error);
+	}
+	return null;
+};
+const saveToolbarState = (state) => {
+	try {
+		localStorage.setItem(STORAGE_KEY, JSON.stringify(state));
+	} catch (error) {
+		console.warn("[react-grab] Failed to save toolbar state to localStorage:", error);
+	}
+};
+
+//#endregion
+Object.defineProperty(exports, 'calculateExpandedPositionFromCollapsed', {
+  enumerable: true,
+  get: function () {
+    return calculateExpandedPositionFromCollapsed;
+  }
+});
+Object.defineProperty(exports, 'clampToRange', {
+  enumerable: true,
+  get: function () {
+    return clampToRange;
+  }
+});
+Object.defineProperty(exports, 'getCollapsedPosition', {
+  enumerable: true,
+  get: function () {
+    return getCollapsedPosition;
+  }
+});
+Object.defineProperty(exports, 'getPositionFromEdgeAndRatio', {
+  enumerable: true,
+  get: function () {
+    return getPositionFromEdgeAndRatio;
+  }
+});
+Object.defineProperty(exports, 'getRatioFromPosition', {
+  enumerable: true,
+  get: function () {
+    return getRatioFromPosition;
+  }
+});
+Object.defineProperty(exports, 'getSnapPosition', {
+  enumerable: true,
+  get: function () {
+    return getSnapPosition;
+  }
+});
+Object.defineProperty(exports, 'getVisualViewport', {
+  enumerable: true,
+  get: function () {
+    return getVisualViewport;
+  }
+});
+Object.defineProperty(exports, 'hasTextSelectionInInput', {
+  enumerable: true,
+  get: function () {
+    return hasTextSelectionInInput;
+  }
+});
+Object.defineProperty(exports, 'hasTextSelectionOnPage', {
+  enumerable: true,
+  get: function () {
+    return hasTextSelectionOnPage;
+  }
+});
+Object.defineProperty(exports, 'isElementConnected', {
+  enumerable: true,
+  get: function () {
+    return isElementConnected;
+  }
+});
+Object.defineProperty(exports, 'isEventFromOverlay', {
+  enumerable: true,
+  get: function () {
+    return isEventFromOverlay;
+  }
+});
+Object.defineProperty(exports, 'isKeyboardEventTriggeredByInput', {
+  enumerable: true,
+  get: function () {
+    return isKeyboardEventTriggeredByInput;
+  }
+});
+Object.defineProperty(exports, 'isMac', {
+  enumerable: true,
+  get: function () {
+    return isMac;
+  }
+});
+Object.defineProperty(exports, 'loadToolbarState', {
+  enumerable: true,
+  get: function () {
+    return loadToolbarState;
+  }
+});
+Object.defineProperty(exports, 'resolveActionEnabled', {
+  enumerable: true,
+  get: function () {
+    return resolveActionEnabled;
+  }
+});
+Object.defineProperty(exports, 'saveToolbarState', {
+  enumerable: true,
+  get: function () {
+    return saveToolbarState;
+  }
+});

package/dist/state-aBiYx-N-.cjs

@@ -0,0 +1,9 @@
+/**
+ * @license MIT
+ *
+ * Copyright (c) 2025 Aiden Bai
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+const e=require(`./freeze-updates-BQjWBzy4.cjs`),t=e=>!!(e?.isConnected??e?.ownerDocument?.contains(e)),n=[`input`,`textarea`,`select`,`searchbox`,`slider`,`spinbutton`,`menuitem`,`menuitemcheckbox`,`menuitemradio`,`option`,`radio`,`textbox`,`combobox`],r=e=>{if(e.composed){let t=e.composedPath()[0];if(t instanceof HTMLElement)return t}else if(e.target instanceof HTMLElement)return e.target},i=t=>{if(document.designMode===`on`)return!0;let i=r(t);if(!i)return!1;if(i.isContentEditable)return!0;let a=e.N(i);return n.some(e=>e===a||e===i.role)},a=e=>{let t=e.target;if(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement){let e=t.selectionStart??0;return(t.selectionEnd??0)-e>0}return!1},o=()=>{let e=window.getSelection();return e?e.toString().length>0:!1},s=()=>{let e=window.visualViewport;return e?{width:e.width,height:e.height,offsetLeft:e.offsetLeft,offsetTop:e.offsetTop}:{width:window.innerWidth,height:window.innerHeight,offsetLeft:0,offsetTop:0}},c=(e,t,n)=>Math.max(t,Math.min(e,n)),l=(e,t,n,r)=>{let i=s(),a=i.width,o=i.height,c=i.offsetLeft+16,l=Math.max(c,i.offsetLeft+a-n-16),u=i.offsetTop+16,d=Math.max(u,i.offsetTop+o-r-16);if(e===`top`||e===`bottom`){let r=Math.max(0,a-n-32);return{x:Math.min(l,Math.max(c,i.offsetLeft+16+r*t)),y:e===`top`?u:d}}let f=Math.max(0,o-r-32),p=Math.min(d,Math.max(u,i.offsetTop+16+f*t));return{x:e===`left`?c:l,y:p}},u=(t,n,r,i,a)=>{let o=s(),c=o.width,l=o.height;if(t===`top`||t===`bottom`){let t=c-i-32;return t<=0?e.ct:Math.max(0,Math.min(1,(n-o.offsetLeft-16)/t))}let u=l-a-32;return u<=0?e.ct:Math.max(0,Math.min(1,(r-o.offsetTop-16)/u))},d=(e,t,n,r,i)=>{let a=s(),o=a.width,l=a.height,{width:d,height:f}=n,p;if(t===`top`||t===`bottom`){let n=(d-r)/2;p={x:c(e.x-n,a.offsetLeft+16,a.offsetLeft+o-d-16),y:t===`top`?a.offsetTop+16:a.offsetTop+l-f-16}}else{let n=(f-i)/2,r=c(e.y-n,a.offsetTop+16,a.offsetTop+l-f-16);p={x:t===`left`?a.offsetLeft+16:a.offsetLeft+o-d-16,y:r}}let m=u(t,p.x,p.y,d,f);return{position:p,ratio:m}},f=(e,t,n,r)=>{let i=s(),{width:a,height:o}=n,{width:l,height:u}=r;switch(e){case`top`:case`bottom`:{let n=(a-l)/2;return{x:c(t.x+n,i.offsetLeft,i.offsetLeft+i.width-l),y:e===`top`?i.offsetTop:i.offsetTop+i.height-u}}case`left`:case`right`:{let n=(o-u)/2,r=c(t.y+n,i.offsetTop,i.offsetTop+i.height-u);return{x:e===`left`?i.offsetLeft:i.offsetLeft+i.width-l,y:r}}}},p=(e,t,n,r,i,a)=>{let o=s(),l=o.width,u=o.height,d=e+i*150,f=t+a*150,p=f-o.offsetTop+r/2,m=o.offsetTop+u-f-r/2,h=d-o.offsetLeft+n/2,g=o.offsetLeft+l-d-n/2,_=Math.min(p,m,h,g),v=e=>c(e,o.offsetLeft+16,o.offsetLeft+l-n-16),y=e=>c(e,o.offsetTop+16,o.offsetTop+u-r-16);return _===p?{edge:`top`,x:v(d),y:o.offsetTop+16}:_===h?{edge:`left`,x:o.offsetLeft+16,y:y(f)}:_===g?{edge:`right`,x:o.offsetLeft+l-n-16,y:y(f)}:{edge:`bottom`,x:v(d),y:o.offsetTop+u-r-16}};let m=null;const h=()=>{if(typeof navigator>`u`||!(`userAgentData`in navigator))return null;let e=navigator.userAgentData;if(typeof e!=`object`||!e||!(`platform`in e))return null;let t=e.platform;return typeof t==`string`?t:null},g=()=>{if(m===null){if(typeof navigator>`u`)return m=!1,m;let e=navigator.platform??h()??navigator.userAgent;m=/Mac|iPhone|iPad|iPod/i.test(e)}return m},_=(e,t)=>{try{return e.composedPath().some(e=>e instanceof HTMLElement&&e.hasAttribute(t))}catch{return!1}},v=e=>e??!0,y=(e,t)=>typeof e.enabled==`function`?t?e.enabled(t):!1:v(e.enabled),b=`react-grab-toolbar-state`,x=()=>{try{let t=localStorage.getItem(b);if(!t)return null;let n=JSON.parse(t);if(typeof n!=`object`||!n)return null;let r=n;return{edge:r.edge===`top`||r.edge===`bottom`||r.edge===`left`||r.edge===`right`?r.edge:`bottom`,ratio:typeof r.ratio==`number`?r.ratio:e.ct,collapsed:typeof r.collapsed==`boolean`?r.collapsed:!1,enabled:typeof r.enabled==`boolean`?r.enabled:!0,defaultAction:typeof r.defaultAction==`string`?r.defaultAction:e.I}}catch(e){console.warn(`[react-grab] Failed to load toolbar state from localStorage:`,e)}return null},S=e=>{try{localStorage.setItem(b,JSON.stringify(e))}catch(e){console.warn(`[react-grab] Failed to save toolbar state to localStorage:`,e)}};Object.defineProperty(exports,`a`,{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,`c`,{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,`d`,{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,`f`,{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,`g`,{enumerable:!0,get:function(){return t}}),Object.defineProperty(exports,`h`,{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return _}}),Object.defineProperty(exports,`l`,{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,`m`,{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return S}}),Object.defineProperty(exports,`o`,{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,`p`,{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return y}}),Object.defineProperty(exports,`s`,{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return x}}),Object.defineProperty(exports,`u`,{enumerable:!0,get:function(){return u}});