Merge pull request #280 from vimaec/sroberge/0_3_11

Sroberge/0 3 11

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vim-webgl-component",
-  "version": "0.3.11-dev.0",
+  "version": "0.3.11",
   "description": "A demonstration app built on top of the vim-webgl-viewer",
   "files": [
     "dist"
@@ -30,7 +30,6 @@
   "devDependencies": {
     "@types/react": "^17.0.39",
     "@types/react-dom": "^18.0.9",
-    "@types/three": "^0.146.0",
     "@typescript-eslint/eslint-plugin": "^5.36.2",
     "autoprefixer": "10.4.5",
     "eslint": "^8.23.1",
@@ -62,7 +61,7 @@
     "react-tooltip": "^4.2.21",
     "stats-js": "^1.0.1",
     "tailwindcss-scoped-preflight": "^3.2.8",
-    "vim-webgl-viewer": "2.0.5-dev.3"
+    "vim-webgl-viewer": "2.0.5"
   },
   "peerDependencies": {
     "react": "^18.2.0",

src/controlbar/controlBar.tsx

@@ -228,9 +228,9 @@ export function ControlBar (props: {
       },
       {
         id: elementIds.buttonSectionBoxClip,
-        tip: section.clip ? 'Clip Section Box' : 'Ignore Section Box',
+        tip: section.clip ? 'Ignore Section Box' : 'Clip Section Box',
         action: () => section.toggleClip(),
-        icon: section.clip ? Icons.sectionBoxClip : Icons.sectionBoxNoClip,
+        icon: section.clip ? Icons.sectionBoxIgnore : Icons.sectionBoxClip,
         style: buttonBlueStyle
       },
       {

src/controlbar/sectionBoxState.ts

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react'
+import { useEffect, useState, useRef } from 'react'
 import ReactTooltip from 'react-tooltip'
 import * as VIM from 'vim-webgl-viewer/'
 
@@ -10,6 +10,7 @@ export type SectionState = {
 export function getSectionBoxState (viewer: VIM.Viewer) {
   const sectionGizmo = viewer.gizmos.section
 
+  const first = useRef(true)
   const [section, setSection] = useState<SectionState>({
     clip: sectionGizmo.clip,
     active: sectionGizmo.visible && sectionGizmo.interactive
@@ -42,6 +43,11 @@ export function getSectionBoxState (viewer: VIM.Viewer) {
 
     sectionGizmo.interactive = next
     sectionGizmo.visible = next
+
+    if (next && first.current) {
+      sectionGizmo.fitBox(viewer.renderer.getBoundingBox())
+      first.current = false
+    }
   }
 
   return {

src/panels/icons.tsx

@@ -542,7 +542,7 @@ export function sectionBoxClip ({ height, width, fill, className }: IconOptions)
   )
 }
 
-export function sectionBoxNoClip ({ height, width, fill, className }: IconOptions) {
+export function sectionBoxIgnore ({ height, width, fill, className }: IconOptions) {
   return (
     <svg className={className} height={height} width={width} viewBox="0 0 256 256">
       <path fill="none" d="M0 0h256v256H0z" />

src/settings/settingsState.ts

@@ -29,7 +29,7 @@ export function useSettings (
     const next = { ...settings } // Shallow copy
     updater(next)
     validateSettings(next)
-    saveSettingsToLocal(settings)
+    saveSettingsToLocal(next)
     setSettings(next)
     onUpdate.current?.(next)
   }