@buoy-gg/floating-tools-core 1.7.5 → 1.7.8

package/lib/commonjs/FloatingToolsStore.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FloatingToolsStore=void 0;var _constants=require("./constants.js");class FloatingToolsStore{isDragging=!1;isHidden=!1;dragStartPos={x:0,y:0};dragStartMouse={x:0,y:0};hasMoved=!1;savedPosition=null;saveTimeout=null;isInitialized=!1;listeners=new Set;constructor(i){this.screenWidth=i.screenWidth,this.screenHeight=i.screenHeight,this.bubbleSize=i.initialBubbleSize??{width:100,height:32},this.minPosition=i.minPosition??{x:_constants.EDGE_PADDING,y:_constants.EDGE_PADDING},this.visibleHandleWidth=i.visibleHandleWidth??_constants.VISIBLE_HANDLE_WIDTH,this.dragThreshold=i.dragThreshold??_constants.DRAG_THRESHOLD,this.edgePadding=i.edgePadding??_constants.EDGE_PADDING,this.enablePositionPersistence=i.enablePositionPersistence??!0,this.storage=i.storage,this.onPositionChange=i.onPositionChange,this.onHiddenChange=i.onHiddenChange,this.onDraggingChange=i.onDraggingChange,this.position=i.initialPosition??{x:this.screenWidth-this.bubbleSize.width-20,y:Math.max(this.minPosition.y,Math.min(100,this.screenHeight-this.bubbleSize.height-this.edgePadding))},this.stateSnapshot=this.createSnapshot()}subscribe=i=>(this.listeners.add(i),()=>this.listeners.delete(i));getSnapshot=()=>this.stateSnapshot;createSnapshot(){return{position:{...this.position},isDragging:this.isDragging,isHidden:this.isHidden,bubbleSize:{...this.bubbleSize}}}notify(){this.stateSnapshot=this.createSnapshot(),this.listeners.forEach(i=>i())}async initialize(){if(!this.isInitialized&&this.enablePositionPersistence&&this.storage){try{const[i,t]=await Promise.all([this.storage.getItem(_constants.STORAGE_KEYS.POSITION_X),this.storage.getItem(_constants.STORAGE_KEYS.POSITION_Y)]);if(null!==i&&null!==t){const s=parseFloat(i),e=parseFloat(t);if(!Number.isNaN(s)&&!Number.isNaN(e)){const i={x:s,y:e},t=this.validatePosition(i);(Math.abs(i.x-t.x)>5||Math.abs(i.y-t.y)>5)&&this.savePosition(t.x,t.y),this.position=t,t.x>=this.screenWidth-this.visibleHandleWidth-5&&(this.isHidden=!0),this.notify()}}}catch{}this.isInitialized=!0}else this.isInitialized=!0}getBounds(){return{minX:this.minPosition.x,maxX:this.screenWidth-this.visibleHandleWidth,minY:this.minPosition.y,maxY:this.screenHeight-this.bubbleSize.height-this.edgePadding}}validatePosition(i){const t=this.getBounds();return{x:Math.max(t.minX,Math.min(i.x,t.maxX)),y:Math.max(t.minY,Math.min(i.y,t.maxY))}}setPosition(i){this.position=i,this.onPositionChange?.(i),this.notify()}setBubbleSize(i){this.bubbleSize.width===i.width&&this.bubbleSize.height===i.height||(this.bubbleSize=i,this.notify())}setScreenSize(i,t){this.screenWidth=i,this.screenHeight=t;const s=this.validatePosition(this.position);s.x===this.position.x&&s.y===this.position.y||(this.position=s,this.notify())}setMinPosition(i){this.minPosition=i}async savePosition(i,t){if(this.enablePositionPersistence&&this.storage)try{await Promise.all([this.storage.setItem(_constants.STORAGE_KEYS.POSITION_X,i.toString()),this.storage.setItem(_constants.STORAGE_KEYS.POSITION_Y,t.toString())])}catch{}}debouncedSavePosition(i,t){this.saveTimeout&&clearTimeout(this.saveTimeout),this.saveTimeout=setTimeout(()=>this.savePosition(i,t),_constants.SAVE_DEBOUNCE_MS)}toggleHideShow(){const i=this.position.x>this.screenWidth-this.bubbleSize.width/2;if(this.isHidden||i){let i,t;return this.savedPosition&&this.savedPosition.x<this.screenWidth-this.bubbleSize.width/2?(i=this.savedPosition.x,t=this.savedPosition.y):(i=this.screenWidth-this.bubbleSize.width-20,t=this.position.y),this.isHidden=!1,this.onHiddenChange?.(!1),this.notify(),{targetPosition:{x:i,y:t},isHiding:!1}}{this.savedPosition={...this.position};const i=this.screenWidth-this.visibleHandleWidth;return this.isHidden=!0,this.onHiddenChange?.(!0),this.notify(),{targetPosition:{x:i,y:this.position.y},isHiding:!0}}}forceHide(){if(this.isHidden)return{targetPosition:this.position};this.savedPosition={...this.position};const i=this.screenWidth-this.visibleHandleWidth;return this.isHidden=!0,this.onHiddenChange?.(!0),this.notify(),{targetPosition:{x:i,y:this.position.y}}}forceShow(){if(!this.isHidden)return{targetPosition:this.position};let i,t;return this.savedPosition?(i=this.savedPosition.x,t=this.savedPosition.y):(i=this.screenWidth-this.bubbleSize.width-20,t=this.position.y),this.isHidden=!1,this.onHiddenChange?.(!1),this.notify(),{targetPosition:{x:i,y:t}}}handleDragStart(i){this.hasMoved=!1,this.dragStartPos={...this.position},this.dragStartMouse={x:i.clientX,y:i.clientY}}handleDragMove(i){const t=i.clientX-this.dragStartMouse.x,s=i.clientY-this.dragStartMouse.y,e=Math.abs(t)+Math.abs(s);if(!this.hasMoved&&e>this.dragThreshold&&(this.hasMoved=!0,this.isDragging=!0,this.onDraggingChange?.(!0),this.notify()),this.hasMoved){const i=this.dragStartPos.x+t,e=this.dragStartPos.y+s,n=this.getBounds(),h=Math.max(n.minX,Math.min(i,this.screenWidth-this.visibleHandleWidth+this.bubbleSize.width)),o=Math.max(n.minY,Math.min(e,n.maxY));return this.position={x:h,y:o},this.onPositionChange?.(this.position),this.notify(),{position:this.position,isDragging:!0}}return{position:this.position,isDragging:!1}}handleDragEnd(i){if(!this.hasMoved)return this.isDragging=!1,this.onDraggingChange?.(!1),this.notify(),{position:this.position,shouldHide:!1,wasTap:!0};const t=i.clientX-this.dragStartMouse.x,s=i.clientY-this.dragStartMouse.y,e=this.dragStartPos.x+t,n=this.dragStartPos.y+s,h=e+this.bubbleSize.width/2>this.screenWidth,o=this.getBounds();if(h){const i=this.screenWidth-this.visibleHandleWidth,t=Math.max(o.minY,Math.min(n,o.maxY));return this.isHidden=!0,this.onHiddenChange?.(!0),this.isDragging=!1,this.onDraggingChange?.(!1),this.notify(),{position:{x:i,y:t},shouldHide:!0,wasTap:!1}}{this.isHidden&&e<this.screenWidth-this.visibleHandleWidth-10&&(this.isHidden=!1,this.onHiddenChange?.(!1));const i=Math.max(o.minX,Math.min(e,this.screenWidth-this.bubbleSize.width-this.edgePadding)),t=Math.max(o.minY,Math.min(n,o.maxY));return i<this.screenWidth-this.bubbleSize.width/2&&(this.savedPosition={x:i,y:t}),this.position={x:i,y:t},this.isDragging=!1,this.onDraggingChange?.(!1),this.debouncedSavePosition(i,t),this.notify(),{position:{x:i,y:t},shouldHide:!1,wasTap:!1}}}commitPosition(i){this.position=i,this.savePosition(i.x,i.y),this.notify()}destroy(){this.saveTimeout&&(clearTimeout(this.saveTimeout),this.saveTimeout=null),this.listeners.clear()}}exports.FloatingToolsStore=FloatingToolsStore;

package/lib/commonjs/colors.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.floatingToolsColors=void 0,exports.withAlpha=withAlpha;const floatingToolsColors=exports.floatingToolsColors={panel:"#1A1A1A",muted:"#888888",secondary:"#E0E0E0",info:"#20C997",success:"#20C997",optional:"#FFA94D",error:"#EF4444",primary:"#20C997",dragActive:"#20C997"};function withAlpha(o,t){return"number"==typeof t?`${o}${Math.round(255*t).toString(16).padStart(2,"0")}`:`${o}${t}`}

package/lib/commonjs/constants.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.VISIBLE_HANDLE_WIDTH=exports.STORAGE_KEYS=exports.SAVE_DEBOUNCE_MS=exports.EDGE_PADDING=exports.DRAG_THRESHOLD=exports.ANIMATION_DURATION=void 0;const VISIBLE_HANDLE_WIDTH=exports.VISIBLE_HANDLE_WIDTH=32,DRAG_THRESHOLD=exports.DRAG_THRESHOLD=5,ANIMATION_DURATION=exports.ANIMATION_DURATION=200,EDGE_PADDING=exports.EDGE_PADDING=10,SAVE_DEBOUNCE_MS=exports.SAVE_DEBOUNCE_MS=500,STORAGE_KEYS=exports.STORAGE_KEYS={POSITION_X:"@react_buoy_bubble_position_x",POSITION_Y:"@react_buoy_bubble_position_y"};

package/lib/commonjs/devToolsState.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.DevToolsStateManager=void 0,exports.devToolsReducer=devToolsReducer,exports.devToolsStateManager=void 0;const initialState={isDialOpen:!1,isSettingsOpen:!1,activeSettingsTab:"dial",isInitialized:!1};function devToolsReducer(t,e){switch(e.type){case"OPEN_DIAL":return{...t,isDialOpen:!0};case"CLOSE_DIAL":return{...t,isDialOpen:!1};case"TOGGLE_DIAL":return{...t,isDialOpen:!t.isDialOpen};case"OPEN_SETTINGS":return{...t,isSettingsOpen:!0,isDialOpen:!1};case"CLOSE_SETTINGS":return{...t,isSettingsOpen:!1};case"SET_SETTINGS_TAB":return{...t,activeSettingsTab:e.tab};case"INITIALIZE":return{...t,isInitialized:!0};default:return t}}class DevToolsStateManager{listeners=new Set;constructor(t){this.state={...initialState,...t}}getState=()=>this.state;getServerState=()=>initialState;isDialOpen(){return this.state.isDialOpen}isSettingsOpen(){return this.state.isSettingsOpen}isInitialized(){return this.state.isInitialized}getActiveSettingsTab(){return this.state.activeSettingsTab}dispatch(t){const e=devToolsReducer(this.state,t);e!==this.state&&(this.state=e,this.notifyListeners())}openDial(){this.dispatch({type:"OPEN_DIAL"})}closeDial(){this.dispatch({type:"CLOSE_DIAL"})}toggleDial(){this.dispatch({type:"TOGGLE_DIAL"})}openSettings(){this.dispatch({type:"OPEN_SETTINGS"})}closeSettings(){this.dispatch({type:"CLOSE_SETTINGS"})}setSettingsTab(t){this.dispatch({type:"SET_SETTINGS_TAB",tab:t})}initialize(){this.dispatch({type:"INITIALIZE"})}subscribe=t=>(this.listeners.add(t),()=>{this.listeners.delete(t)});notifyListeners(){this.listeners.forEach(t=>{try{t()}catch(t){console.error("Error in DevToolsStateManager listener:",t)}})}get listenerCount(){return this.listeners.size}reset(){this.state={...initialState},this.notifyListeners()}}exports.DevToolsStateManager=DevToolsStateManager;const devToolsStateManager=exports.devToolsStateManager=new DevToolsStateManager;

package/lib/commonjs/dial.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.dialStyles=exports.dialColors=exports.dialCSSBeziers=exports.dialAnimationConfig=exports.MAX_DIAL_SLOTS=exports.DIAL_START_ANGLE=exports.DIAL_ICON_SIZE=exports.DIAL_ICON_PADDING=exports.DIAL_GRID_LINE_COUNT=exports.DIAL_BUTTON_SIZE=void 0,exports.generateDialCSSKeyframes=generateDialCSSKeyframes,exports.getAllIconPositions=getAllIconPositions,exports.getDialCSSAnimationStyles=getDialCSSAnimationStyles,exports.getDialCSSKeyframesString=getDialCSSKeyframesString,exports.getDialLayout=getDialLayout,exports.getGridLineRotations=getGridLineRotations,exports.getIconAngle=getIconAngle,exports.getIconPosition=getIconPosition,exports.getIconStaggerInputRange=getIconStaggerInputRange,exports.getSpiralAnimationPosition=getSpiralAnimationPosition,exports.getStaggeredIconProgress=getStaggeredIconProgress;var _colors=require("./colors.js");const MAX_DIAL_SLOTS=exports.MAX_DIAL_SLOTS=6,DIAL_START_ANGLE=exports.DIAL_START_ANGLE=-1*Math.PI/2,DIAL_BUTTON_SIZE=exports.DIAL_BUTTON_SIZE=80,DIAL_ICON_SIZE=exports.DIAL_ICON_SIZE=60,DIAL_ICON_PADDING=exports.DIAL_ICON_PADDING=20,DIAL_GRID_LINE_COUNT=exports.DIAL_GRID_LINE_COUNT=6,dialColors=exports.dialColors={dialBackground:"#000000",dialGradient1:(0,_colors.withAlpha)(_colors.floatingToolsColors.info,"10"),dialGradient2:(0,_colors.withAlpha)(_colors.floatingToolsColors.info,"08"),dialGradient3:(0,_colors.withAlpha)(_colors.floatingToolsColors.info,"15"),dialBorder:(0,_colors.withAlpha)(_colors.floatingToolsColors.info,"40"),dialShadow:_colors.floatingToolsColors.info,dialGridLine:(0,_colors.withAlpha)(_colors.floatingToolsColors.info,"26"),dialBackdrop:"rgba(0, 0, 0, 0.85)",centerText:_colors.floatingToolsColors.secondary,centerTextGlow:_colors.floatingToolsColors.info,iconLabel:_colors.floatingToolsColors.secondary,emptyDotBackground:(0,_colors.withAlpha)(_colors.floatingToolsColors.muted,"15"),emptyDotBorder:(0,_colors.withAlpha)(_colors.floatingToolsColors.muted,"50")},dialStyles=exports.dialStyles={backdrop:{opacity:.85},circle:{borderWidth:1,shadowOpacity:.5,shadowRadius:20},gradientLayers:[{opacity:.6,offsetPercent:0},{opacity:.4,offsetPercent:30},{opacity:.3,offsetPercent:50}],grid:{lineCount:6,lineHeight:1,getLineRotations:()=>Array.from({length:6},(t,e)=>60*e)},centerButton:{containerRatio:1.5,borderRatio:1.2,borderRadiusRatio:.6,borderWidth:2,text:{fontSize:10,fontWeight:"900",letterSpacing:1,fontFamily:"monospace"},proText:{fontSize:8,letterSpacing:2}},icon:{gradientBgSizePercent:85,gradientBgBorderRadius:12,gradientBgOpacity:.3,innerGlowSizePercent:70,innerGlowBorderRadius:10,innerGlowOpacity:.5,label:{fontSize:8,fontWeight:"900",letterSpacing:.3,fontFamily:"monospace",marginTop:2},wrapperMarginBottom:4},emptySlot:{dotSize:12,borderWidth:1}};function getGridLineRotations(t=DIAL_GRID_LINE_COUNT){return Array.from({length:t},(e,i)=>i*(360/t))}function getDialLayout(t){const{screenWidth:e,maxCircleSize:i=320,circleSizeRatio:n=.75,iconSize:o=DIAL_ICON_SIZE,iconPadding:a=DIAL_ICON_PADDING}=t,r=Math.min(e*n,i),s=r/2;return{circleSize:r,circleRadius:s,iconRadius:s-o/2-a,iconSize:o,buttonSize:DIAL_BUTTON_SIZE}}function getIconAngle(t,e,i=DIAL_START_ANGLE){return i+2*Math.PI/e*t}function getIconPosition(t,e,i,n=DIAL_START_ANGLE){const o=getIconAngle(t,e,n);return{x:i*Math.cos(o),y:i*Math.sin(o),angle:o}}function getAllIconPositions(t,e,i=DIAL_START_ANGLE){return Array.from({length:t},(n,o)=>getIconPosition(o,t,e,i))}function getIconStaggerInputRange(t,e,i=.1){const n=t*i;return[0,n,n+(1-(e-1)*i),1]}const dialAnimationConfig=exports.dialAnimationConfig={entrance:{backdrop:{duration:400,easing:"linear"},dial:{scale:{type:"spring",damping:15,stiffness:150,mass:1},rotation:{duration:800,degrees:360,easing:"easeOutCubic"}},centerButton:{delay:300,type:"spring",damping:10,stiffness:200},icons:{delay:500,duration:600,easing:"easeOutCubic"},circuitTraces:{delay:600,duration:1e3}},exit:{icons:{duration:300,easing:"easeInCubic"},centerButton:{duration:200,easing:"easeInCubic"},dialScale:{duration:250,easing:"easeInCubic"},backdrop:{duration:200}},continuous:{glitch:{interval:3e3,offset:2,stepDuration:50},pulse:{minScale:.98,maxScale:1.02,duration:1e3,easing:"easeInOutCubic"},floating:{minY:0,maxY:-8,duration:3e3,easing:"easeInOutCubic"},breathing:{minScale:.98,maxScale:1.05,duration:2500,easing:"easeInOutCubic"}},icons:{staggerRatio:.1,spiral:{startRotation:2*Math.PI,endRotation:0},opacity:{inputRange:[0,.3,1],outputRange:[0,.3,1]},pressIn:{scale:.95,type:"spring",damping:15,stiffness:400},pressOut:{scale:1,type:"spring",damping:15,stiffness:400}},interaction:{iconSelect:{pulse:[{scale:.9,damping:15,stiffness:500},{scale:1,damping:10,stiffness:200}],actionDelay:50},centerHover:{scale:1.05,duration:150}}},dialCSSBeziers=exports.dialCSSBeziers={dialScale:"cubic-bezier(0.34, 1.56, 0.64, 1)",centerButton:"cubic-bezier(0.25, 1.7, 0.55, 1)",iconPress:"cubic-bezier(0.22, 1.2, 0.36, 1)",iconSelectPulse:"cubic-bezier(0.18, 1.15, 0.32, 1)",easeOutCubic:"cubic-bezier(0.33, 1, 0.68, 1)",easeInCubic:"cubic-bezier(0.32, 0, 0.67, 0)",easeInOutCubic:"cubic-bezier(0.65, 0, 0.35, 1)",linear:"linear"};function generateDialCSSKeyframes(){const t=dialAnimationConfig.continuous;return{dialGlitch:`@keyframes dialGlitch {\n      0%, 100% { transform: translateX(0); }\n      33% { transform: translateX(${t.glitch.offset}px); }\n      66% { transform: translateX(-${t.glitch.offset}px); }\n    }`,dialPulse:`@keyframes dialPulse {\n      0%, 100% { transform: scale(1); }\n      50% { transform: scale(${t.pulse.maxScale}); }\n    }`,dialFloating:`@keyframes dialFloating {\n      0%, 100% { transform: translateY(0); }\n      50% { transform: translateY(${t.floating.maxY}px); }\n    }`,dialBreathing:`@keyframes dialBreathing {\n      0%, 100% { transform: scale(1); }\n      50% { transform: scale(${t.breathing.maxScale}); }\n    }`,dialRotation:`@keyframes dialRotation {\n      from { transform: rotate(0deg); }\n      to { transform: rotate(${dialAnimationConfig.entrance.dial.rotation.degrees}deg); }\n    }`}}function getDialCSSAnimationStyles(){const t=dialAnimationConfig.continuous;return{glitch:`dialGlitch ${3*t.glitch.stepDuration}ms ease`,pulse:`dialPulse ${2*t.pulse.duration}ms ${dialCSSBeziers.easeInOutCubic} infinite`,floating:`dialFloating ${2*t.floating.duration}ms ${dialCSSBeziers.easeInOutCubic} infinite`,breathing:`dialBreathing ${2*t.breathing.duration}ms ${dialCSSBeziers.easeInOutCubic} infinite`,dialRotation:`dialRotation ${dialAnimationConfig.entrance.dial.rotation.duration}ms ${dialCSSBeziers.easeOutCubic}`}}function getDialCSSKeyframesString(){return Object.values(generateDialCSSKeyframes()).join("\n\n")}function getSpiralAnimationPosition(t,e,i,n,o=DIAL_START_ANGLE){const a=getIconPosition(e,i,n,o),r=dialAnimationConfig.icons.spiral,s=dialAnimationConfig.icons.opacity,l=Math.max(0,Math.min(1,t)),c=r.startRotation+(r.endRotation-r.startRotation)*l,g=n*l,u=a.angle+c,d=g*Math.cos(u),p=g*Math.sin(u),f=d+(a.x-d)*l,S=p+(a.y-p)*l;let I;if(l<=s.inputRange[0])I=s.outputRange[0];else if(l<=s.inputRange[1]){const t=(l-s.inputRange[0])/(s.inputRange[1]-s.inputRange[0]);I=s.outputRange[0]+(s.outputRange[1]-s.outputRange[0])*t}else{const t=(l-s.inputRange[1])/(s.inputRange[2]-s.inputRange[1]);I=s.outputRange[1]+(s.outputRange[2]-s.outputRange[1])*t}return{x:f,y:S,rotation:c,scale:l,opacity:I}}function getStaggeredIconProgress(t,e,i){const n=getIconStaggerInputRange(e,i,dialAnimationConfig.icons.staggerRatio);if(t<=n[0])return 0;if(t<=n[1])return 0;if(t>=n[3])return 1;if(t>=n[2])return 1;const o=(t-n[1])/(n[2]-n[1]);return Math.max(0,Math.min(1,o))}

package/lib/commonjs/easing.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.easing=void 0,exports.getEasing=getEasing,exports.interpolate=interpolate,exports.interpolatePosition=interpolatePosition;const easing=exports.easing={linear:e=>e,easeOutCubic:e=>1-Math.pow(1-e,3),easeInCubic:e=>e*e*e,easeInOutCubic:e=>e<.5?4*e*e*e:1-Math.pow(-2*e+2,3)/2,easeOutQuad:e=>1-(1-e)*(1-e),easeOutExpo:e=>1===e?1:1-Math.pow(2,-10*e)};function getEasing(e){return easing[e]}function interpolate(e,t,i,n=easing.easeOutCubic){return e+(t-e)*n(Math.max(0,Math.min(1,i)))}function interpolatePosition(e,t,i,n=easing.easeOutCubic){return{x:interpolate(e.x,t.x,i,n),y:interpolate(e.y,t.y,i,n)}}