matterviz 0.3.7 → 0.4.0

package/dist/structure/Structure.svelte

@@ -8,6 +8,7 @@
   import Spinner from '../feedback/Spinner.svelte'
   import Icon from '../Icon.svelte'
   import { create_file_drop_handler, load_from_url } from '../io'
+  import { forward_window_keydown, handle_and_prevent } from '../keyboard'
   import { parse_volumetric_file } from '../isosurface/parse'
   import type { IsosurfaceSettings, VolumetricData } from '../isosurface/types'
   import {
@@ -56,7 +57,7 @@
   import { get_property_colors } from './atom-properties'
   import AtomLegend from './AtomLegend.svelte'
   import CellSelect from './CellSelect.svelte'
-  import { BOND_ORDER_OPTIONS, merge_bond_edits } from './bonding'
+  import { BOND_ORDER_OPTIONS, merge_bond_edits, remap_bonds_after_deletion } from './bonding'
   import type { StructureHandlerData } from './index'
   import { MAX_SELECTED_SITES } from './measure'
   import { normalize_fractional_coords, parse_any_structure } from './parse'
@@ -64,6 +65,7 @@
   import StructureExportPane from './StructureExportPane.svelte'
   import StructureInfoPane from './StructureInfoPane.svelte'
   import StructureScene from './StructureScene.svelte'
+  import { to_error } from '../utils'
 
   // Type alias for event handlers to reduce verbosity
   type EventHandler = (data: StructureHandlerData) => void
@@ -302,7 +304,7 @@
             emit_file_load_event(parsed, filename, content)
           } catch (error) {
             error_msg = `Failed to parse structure: ${
-              error instanceof Error ? error.message : String(error)
+              to_error(error).message
             }`
             on_error?.({ error_msg, filename })
           }
@@ -333,7 +335,7 @@
       }
     } catch (err) {
       error_msg = `Failed to parse structure from string: ${
-        err instanceof Error ? err.message : String(err)
+        to_error(err).message
       }`
       untrack(() => on_error?.({ error_msg, filename: `string` }))
     } finally {
@@ -467,10 +469,13 @@
   let bond_order_overrides = $state<StructureBond[]>([])
   let bond_undo_stack = $state<BondEditHistorySnapshot[]>([])
   let bond_redo_stack = $state<BondEditHistorySnapshot[]>([])
-  let bond_history_context = $state<BondEditContext>()
-  let last_bond_structure_identity = $state(structure)
+  // These hold object-identity tokens (structure_identity) compared with ===/!==,
+  // so they must stay raw — proxying them via $state would break identity comparisons
+  // (state_proxy_equality_mismatch) against the raw `structure` prop.
+  let bond_history_context = $state.raw<BondEditContext>()
+  let last_bond_structure_identity = $state.raw(structure)
   let last_emitted_bond_signature = $state<string>()
-  let bond_edit_snapshot = $state<BondEditSnapshot>()
+  let bond_edit_snapshot = $state.raw<BondEditSnapshot>()
   let has_bond_edits = $derived(
     added_bonds.length > 0 || removed_bonds.length > 0 ||
       bond_order_overrides.length > 0,
@@ -776,7 +781,13 @@
   })
 
   let controls_config = $derived(normalize_show_controls(show_controls))
-  let viewer_active = $derived(hovered || focused)
+  // $effect instead of `$derived(hovered || focused)`: the $derived reading the $bindable
+  // `hovered` prop went stale after the first hover/leave cycle, so the gizmo + mode toggle only
+  // appeared on the first mouseenter until reload.
+  let viewer_active = $state(false)
+  $effect(() => {
+    viewer_active = hovered || focused
+  })
   let scene_gizmo = $derived(viewer_active && (scene_props.gizmo ?? scene_props.show_gizmo))
   let active_scene_sites = $derived([
     ...new SvelteSet([...(scene_props.active_sites ?? []), ...highlighted_sites]),
@@ -822,7 +833,7 @@
   let supercell_structure = $state(structure)
   let supercell_loading = $state(false)
   let has_supercell = $derived(
-    !!supercell_scaling && ![``, `1x1x1`, `1`].includes(supercell_scaling),
+    Boolean(supercell_scaling) && ![``, `1x1x1`, `1`].includes(supercell_scaling),
   )
   let bond_edits_enabled = $derived(
     cell_type === `original` && !has_supercell && !supercell_loading,
@@ -865,8 +876,8 @@
       // For large supercells, show loading state and use async generation
       const sites_count = base_structure.sites?.length || 0
       const [nx_str, ny_str, nz_str] = supercell_scaling.split(/[x×]/)
-      const scaling_mult = (parseInt(nx_str) || 1) * (parseInt(ny_str) || 1) *
-        (parseInt(nz_str) || 1)
+      const scaling_mult = (parseInt(nx_str, 10) || 1) * (parseInt(ny_str, 10) || 1) *
+        (parseInt(nz_str, 10) || 1)
       const estimated_sites = sites_count * scaling_mult
 
       // Show spinner for supercells with >1000 estimated sites or scaling >8
@@ -1124,7 +1135,7 @@
         emit_file_load_event(parsed, filename, content)
       } catch (err) {
         error_msg = `Failed to parse structure: ${
-          err instanceof Error ? err.message : String(err)
+          to_error(err).message
         }`
         on_error?.({ error_msg, filename })
       }
@@ -1139,7 +1150,9 @@
     },
   })
 
-  function handle_keydown(event: KeyboardEvent) {
+  // Handle keyboard shortcuts. Returns true if the key was handled, so the caller
+  // (handle_and_prevent / forward_window_keydown) can suppress the browser default.
+  function handle_keydown(event: KeyboardEvent): boolean {
     // Don't handle shortcuts if user is typing in an input field
     const target = event.target
     const is_input_focused =
@@ -1151,45 +1164,39 @@
 
     // Allow Escape to cancel add-atom mode even when the element input is focused
     if (event.key === `Escape` && measure_mode === `edit-atoms` && add_atom_mode) {
-      event.preventDefault()
       add_atom_mode = false
-      return
+      return true
     }
 
-    if (is_input_focused) return
+    if (is_input_focused) return false
 
     if (measure_mode === `edit-bonds`) {
       const key = event.key.toLowerCase()
       const plain = !event.ctrlKey && !event.metaKey && !event.altKey
       if (event.ctrlKey || event.metaKey) {
         if (key === `z` && !event.shiftKey) {
-          if (bond_undo_stack.length === 0) return
-          event.preventDefault()
+          if (bond_undo_stack.length === 0) return false
           undo_bond_edit()
           show_toast(`Undo bond edit (${bond_undo_stack.length} left)`)
-          return
+          return true
         } else if (key === `y` || (key === `z` && event.shiftKey)) {
-          if (bond_redo_stack.length === 0) return
-          event.preventDefault()
+          if (bond_redo_stack.length === 0) return false
           redo_bond_edit()
           show_toast(`Redo bond edit (${bond_redo_stack.length} left)`)
-          return
+          return true
         }
       }
       if (key === `a` && plain) {
-        event.preventDefault()
         bond_edit_mode = `add`
-        return
+        return true
       }
       if (key === `d` && plain) {
-        event.preventDefault()
         bond_edit_mode = `delete`
-        return
+        return true
       }
       if (event.key === `Escape` && selected_sites.length > 0) {
-        event.preventDefault()
         clear_selection()
-        return
+        return true
       }
     }
 
@@ -1199,61 +1206,66 @@
       if (event.ctrlKey || event.metaKey) {
         const key = event.key.toLowerCase()
         if (key === `z` && !event.shiftKey) {
-          if (undo_stack.length === 0) return
-          event.preventDefault()
+          if (undo_stack.length === 0) return false
           undo()
           show_toast(`Undo (${undo_stack.length} left)`)
-          return
+          return true
         } else if (key === `y` || (key === `z` && event.shiftKey)) {
-          if (redo_stack.length === 0) return
-          event.preventDefault()
+          if (redo_stack.length === 0) return false
           redo()
           show_toast(`Redo (${redo_stack.length} left)`)
-          return
+          return true
         }
       }
 
       if (event.key === `Delete` || event.key === `Backspace`) {
         // Delete selected atoms
         if (selected_sites.length > 0 && structure?.sites) {
-          event.preventDefault()
           is_internal_edit = true
           push_undo()
           const to_delete = scene_to_structure_indices(selected_sites, true)
           const n_deleted = to_delete.size
           clear_selection()
+          // Remap explicit bond metadata so surviving bonds track shifted site indices.
+          // structure_with_bonds prefers the bindable `bonds` prop, so remap that too.
+          if (bonds !== undefined) bonds = remap_bonds_after_deletion(bonds, to_delete)
+          const old_bonds = structure.properties?.bonds
           structure = {
             ...structure,
             sites: structure.sites.filter((_, idx) => !to_delete.has(idx)),
+            ...(old_bonds && {
+              properties: {
+                ...structure.properties,
+                bonds: remap_bonds_after_deletion(old_bonds, to_delete),
+              },
+            }),
           }
           // Clear per-site overrides since indices shifted after deletion
           if (site_radius_overrides?.size > 0) site_radius_overrides.clear()
           clear_bond_edits()
           show_toast(`Deleted ${n_deleted} site${n_deleted > 1 ? `s` : ``}`)
+          return true
         }
-        return
+        return false
       }
       const key = event.key.toLowerCase()
       const plain = !event.ctrlKey && !event.metaKey && !event.altKey
 
       if (key === `a` && plain) {
         // Enter add-atom sub-mode (plain 'a' only, not Ctrl+A/Cmd+A/Alt+A)
-        event.preventDefault()
         add_atom_mode = !add_atom_mode
-        return
+        return true
       }
       // Change element of selected atoms
       if (key === `e` && plain && selected_sites.length > 0) {
-        event.preventDefault()
         change_element_mode = !change_element_mode
-        return
+        return true
       }
       // Duplicate selected atoms at a small offset
       if (
         key === `d` && (event.ctrlKey || event.metaKey) &&
         selected_sites.length > 0 && structure?.sites
       ) {
-        event.preventDefault()
         is_internal_edit = true
         push_undo()
         const orig_indices = scene_to_structure_indices(selected_sites)
@@ -1284,18 +1296,18 @@
         show_toast(
           `Duplicated ${new_sites.length} site${new_sites.length > 1 ? `s` : ``}`,
         )
-        return
+        return true
       }
 
       // add_atom_mode Escape is already handled above (before is_input_focused guard)
       if (event.key === `Escape`) {
         if (change_element_mode) {
           change_element_mode = false
-          return
+          return true
         }
         if (selected_sites.length > 0) {
           clear_selection()
-          return
+          return true
         }
       }
     }
@@ -1303,11 +1315,11 @@
     // Interface shortcuts (require Ctrl/Cmd modifier to avoid accidental triggers)
     const has_modifier = event.ctrlKey || event.metaKey
     if (event.key === `f` && has_modifier && fullscreen_toggle) {
-      event.preventDefault()
       toggle_fullscreen(wrapper)
+      return true
     } else if (event.key === `i` && has_modifier && enable_info_pane) {
-      event.preventDefault()
       info_pane_open = !info_pane_open
+      return true
     } else if (event.key === `Escape`) {
       // Prioritize closing panes, then exit edit modes, then exit fullscreen
       if (info_pane_open) info_pane_open = false
@@ -1315,10 +1327,19 @@
       else if (export_pane_open) export_pane_open = false
       else if (measure_mode === `edit-bonds` || measure_mode === `edit-atoms`) {
         measure_mode = `distance`
-      }
+      } else return false
+      return true
     }
+    return false
   }
 
+  // Hover (window) path: skip edit-mode mutations so destructive keys (delete/undo)
+  // require focus, not just a hovering mouse.
+  const handle_hover_keydown = (event: KeyboardEvent): boolean =>
+    measure_mode === `edit-atoms` || measure_mode === `edit-bonds`
+      ? false
+      : handle_keydown(event)
+
   // === Edit-atoms mode helpers ===
 
   // Map scene indices (into displayed_structure) back to raw structure indices.
@@ -1477,6 +1498,11 @@
   }}
 />
 
+<!-- Forward shortcuts to the hovered viewer when focus is on <body> (see
+  forward_window_keydown). Edit modes are excluded so destructive keys
+  (delete/undo) still require focus, not just a hovering mouse. -->
+<svelte:window onkeydown={forward_window_keydown(() => hovered, handle_hover_keydown)} />
+
 <!-- svelte-ignore a11y_no_noninteractive_tabindex -->
 <div
   class:dragover
@@ -1502,15 +1528,8 @@
     if (!(target instanceof HTMLElement)) return
     // Don't reset if double-click was on UI controls/panes/legend
     if (
-      target.closest(`.control-buttons`) ||
-      target.closest(`.structure-legend`) ||
-      target.closest(`.atom-legend`) ||
-      target.closest(`.info-pane`) ||
-      target.closest(`.export-pane`) ||
-      target.closest(`.controls-pane`) ||
-      target.tagName === `BUTTON` ||
-      target.tagName === `INPUT` ||
-      target.tagName === `SELECT`
+      [`.control-buttons`, `.structure-legend`, `.atom-legend`, `.info-pane`, `.export-pane`, `.controls-pane`].some((selector) => target.closest(selector))
+      || target.tagName === `BUTTON` || target.tagName === `INPUT` || target.tagName === `SELECT`
     ) return
     // Reset camera for double-clicks on the 3D scene
     reset_camera()
@@ -1525,7 +1544,7 @@
     event.preventDefault()
     dragover = false
   }}
-  onkeydown={handle_keydown}
+  onkeydown={handle_and_prevent(handle_keydown)}
   {...rest}
   class="structure {rest.class ?? ``}"
 >
@@ -1617,22 +1636,9 @@
                 {#each [
             { mode: `distance`, icon: `Ruler`, label: `Distance`, scale: 1.1 },
             { mode: `angle`, icon: `Angle`, label: `Angle`, scale: 1.3 },
-            {
-              mode: `edit-atoms`,
-              icon: `Edit`,
-              label: `Edit Atoms`,
-              scale: 1.0,
-            },
-            {
-              mode: `edit-bonds`,
-              icon: `Link`,
-              label: `Edit Bonds`,
-              scale: 1.0,
-            },
-          ] as const as
-                  { mode, icon, label, scale }
-                  (mode)
-                }
+            { mode: `edit-atoms`, icon: `Edit`, label: `Edit Atoms`, scale: 1.0 },
+            { mode: `edit-bonds`, icon: `Link`, label: `Edit Bonds`, scale: 1.0 },
+          ] as const as { mode, icon, label, scale } (mode)}
                   <button
                     class="view-mode-option"
                     class:selected={measure_mode === mode}

package/dist/structure/Structure.svelte.d.ts

@@ -84,6 +84,6 @@ type $$ComponentProps = {
     on_camera_reset?: EventHandler;
     on_bonds_change?: (bonds: StructureBond[] | undefined) => void;
 } & Omit<ComponentProps<typeof StructureControls>, `children` | `onclose`> & Omit<HTMLAttributes<HTMLDivElement>, `children`>;
-declare const Structure: import("svelte").Component<$$ComponentProps, {}, "structure" | "height" | "width" | "dragover" | "loading" | "fullscreen" | "hovered" | "controls_open" | "color_scheme" | "background_color" | "background_opacity" | "show_image_atoms" | "info_pane_open" | "wrapper" | "sym_data" | "png_dpi" | "error_msg" | "site_radius_overrides" | "atom_color_config" | "lattice_props" | "measure_mode" | "selected_sites" | "measured_sites" | "bond_edit_mode" | "bond_edit_order" | "hidden_elements" | "hidden_prop_vals" | "element_radius_overrides" | "volumetric_data" | "isosurface_settings" | "element_mapping" | "bonds" | "supercell_scaling" | "cell_type" | "active_volume_idx" | "scene_props" | "highlighted_sites" | "hovered_site_idx" | "enable_measure_mode" | "performance_mode" | "displayed_structure" | "symmetry_settings">;
+declare const Structure: import("svelte").Component<$$ComponentProps, {}, "structure" | "dragover" | "height" | "width" | "fullscreen" | "hovered" | "controls_open" | "loading" | "png_dpi" | "color_scheme" | "background_color" | "background_opacity" | "show_image_atoms" | "info_pane_open" | "wrapper" | "sym_data" | "error_msg" | "site_radius_overrides" | "atom_color_config" | "lattice_props" | "measure_mode" | "selected_sites" | "measured_sites" | "bond_edit_mode" | "bond_edit_order" | "hidden_elements" | "hidden_prop_vals" | "element_radius_overrides" | "volumetric_data" | "isosurface_settings" | "element_mapping" | "bonds" | "supercell_scaling" | "cell_type" | "active_volume_idx" | "scene_props" | "highlighted_sites" | "hovered_site_idx" | "enable_measure_mode" | "performance_mode" | "displayed_structure" | "symmetry_settings">;
 type Structure = ReturnType<typeof Structure>;
 export default Structure;

package/dist/structure/StructureInfoPane.svelte

@@ -168,12 +168,11 @@
   const get_element_name = (element: string): string =>
     element_data?.find((element_record) => element_record.symbol === element)?.name || element
 
-  function site_summary(card: SiteCard): string {
-    return [
+  const site_summary = (card: SiteCard): string =>
+    [
       card.element_name,
       ...card.details.map(({ label, value }) => `${label}: ${value}`),
     ].join(`; `)
-  }
 
   function format_site_property(prop_key: string, prop_value: unknown): SiteDetail | null {
     if (prop_value == null) return null
@@ -232,7 +231,7 @@
         // Only display scalar values (skip arrays and objects)
         if (value == null || typeof value === `object`) continue
         structure_items.push({
-          label: key.replace(/_/g, ` `).replace(/\b\w/g, (char) => char.toUpperCase()),
+          label: key.replaceAll('_', ` `).replaceAll(/\b\w/g, (char) => char.toUpperCase()),
           value: String(value),
           key: `structure-prop-${key}`,
         })
@@ -281,7 +280,7 @@
         international_short?: string
       }).international_short
       const space_group_symbol = (sym_data.hm_symbol ?? international_symbol)
-        ?.replace(
+        ?.replaceAll(
           /\s+/g,
           ``,
         )
@@ -380,7 +379,7 @@
     const selected_site_idx = selected_sites[0]
     if (!pane_open || selected_site_idx === undefined) return
     const visible_idx = visible_site_cards.findIndex(({ idx }) => idx === selected_site_idx)
-    if (visible_idx < 0) return
+    if (visible_idx === -1) return
     const selected_window_start = Math.floor(visible_idx / SITE_WINDOW_SIZE) *
       SITE_WINDOW_SIZE
     if (selected_window_start !== site_window_start) {

package/dist/structure/StructureScene.svelte

@@ -409,9 +409,8 @@
 
   // Desaturate a color by blending it toward gray (for ghosting image atoms in edit mode)
   const gray = new Color(0x999999)
-  function desaturate(hex: string | undefined, amount = 0.4): string {
-    return `#${new Color(hex ?? 0x999999).lerp(gray, amount).getHexString()}`
-  }
+  const desaturate = (hex: string | undefined, amount = 0.4): string =>
+    `#${new Color(hex ?? 0x999999).lerp(gray, amount).getHexString()}`
 
   // === Edit-atoms mode state ===
   let transform_object = $state<Mesh | undefined>(undefined)
@@ -1090,7 +1089,7 @@
 
     const bond_directions_by_site = new SvelteMap<number, Vec3[]>()
     const add_bond_direction = (site_idx: number, pos_1: Vec3, pos_2: Vec3) => {
-      const direction = math.normalize_vec3(
+      const direction = math.normalize_vec(
         math.subtract(pos_2, pos_1),
         [0, 0, 0],
       )
@@ -1253,9 +1252,9 @@
         let mean: Vec3 = [0, 0, 0]
         for (const key of site_keys) {
           const vec = vec_map.get(key)
-          if (vec) mean = math.add(mean, math.normalize_vec3(vec)) as Vec3
+          if (vec) mean = math.add(mean, math.normalize_vec(vec)) as Vec3
         }
-        const mean_dir = math.normalize_vec3(mean, [0, 1, 0] as Vec3)
+        const mean_dir = math.normalize_vec(mean, [0, 1, 0] as Vec3)
         const [u_vec, v_vec] = math.compute_in_plane_basis(mean_dir)
         const offsets = new SvelteMap<string, Vec3>()
         for (const [idx, key] of site_keys.entries()) {
@@ -1317,7 +1316,7 @@
 
           const offset = site_offsets?.[site_idx]?.get(key)
           const position = offset ? math.add(site.xyz, offset) as Vec3 : site.xyz
-          const arrow_vec = vector_normalize ? math.normalize_vec3(vec) : vec
+          const arrow_vec = vector_normalize ? math.normalize_vec(vec) : vec
 
           return {
             site_idx,
@@ -2096,7 +2095,7 @@
         ] as Vec3}
               {@const direct = math.euclidean_dist(pos_i, pos_j)}
               {@const pbc = lattice
-          ? measure.distance_pbc(pos_i, pos_j, lattice.matrix)
+          ? measure.distance_pbc(pos_i, pos_j, lattice.matrix, undefined, lattice.pbc)
           : direct}
               {@const differ = lattice ? Math.abs(pbc - direct) > 1e-6 : false}
               <extras.HTML center position={midpoint}>
@@ -2125,8 +2124,10 @@
               }
                 {@const site_a = structure.sites[idx_a]}
                 {@const site_b = structure.sites[idx_b]}
-                {@const v1 = measure.displacement_pbc(center.xyz, site_a.xyz, lattice?.matrix)}
-                {@const v2 = measure.displacement_pbc(center.xyz, site_b.xyz, lattice?.matrix)}
+                {@const disp = (to: Vec3) =>
+            measure.displacement_pbc(center.xyz, to, lattice?.matrix, undefined, lattice?.pbc)}
+                {@const v1 = disp(site_a.xyz)}
+                {@const v2 = disp(site_b.xyz)}
                 {@const n1 = Math.hypot(v1[0], v1[1], v1[2])}
                 {@const n2 = Math.hypot(v2[0], v2[1], v2[2])}
                 {@const angle_deg = measure.angle_between_vectors(v1, v2, `degrees`)}

package/dist/structure/atom-properties.js

@@ -55,7 +55,7 @@ const build_prop_colors = (vals, colors, unique_values) => {
     return { colors, values: vals, min_value, max_value, unique_values: uniq };
 };
 export function apply_color_scale(vals, scale = DEFAULT_COLOR_SCALE, type = `continuous`) {
-    if (!vals.length)
+    if (vals.length === 0)
         return { colors: [] };
     if (type === `categorical`) {
         const result = make_categorical(vals, scale, (val_a, val_b) => val_a - val_b);
@@ -74,7 +74,7 @@ export function apply_color_scale(vals, scale = DEFAULT_COLOR_SCALE, type = `con
         colors: vals.map((val) => to_hex(interp_fn, max === min ? 0.5 : (val - min) / (max - min))),
     };
 }
-export const apply_categorical_color_scale = (vals, scale = DEFAULT_COLOR_SCALE) => vals.length ? make_categorical(vals, scale) : { colors: [], unique_values: [] };
+export const apply_categorical_color_scale = (vals, scale = DEFAULT_COLOR_SCALE) => vals.length > 0 ? make_categorical(vals, scale) : { colors: [], unique_values: [] };
 // Get original site index for property color lookup.
 // Supercell atoms use orig_unit_cell_idx, image atoms use orig_site_idx, otherwise use site_idx.
 export const get_orig_site_idx = (site, site_idx) => typeof site?.properties?.orig_unit_cell_idx === `number`
@@ -84,7 +84,7 @@ export const get_orig_site_idx = (site, site_idx) => typeof site?.properties?.or
         : site_idx;
 // Expand structure with PBC images - use minimal expansion based on atom positions
 function expand_structure_for_pbc(structure) {
-    if (!(`lattice` in structure) || !structure.lattice || !structure.sites.length) {
+    if (!(`lattice` in structure) || !structure.lattice || structure.sites.length === 0) {
         return structure;
     }
     const { sites, lattice } = structure;
@@ -92,7 +92,7 @@ function expand_structure_for_pbc(structure) {
     const pbc = lattice.pbc ?? [true, true, true];
     const all_offsets = get_all_offsets(pbc);
     // Small structures: expand all atoms
-    if (sites.length < 20 || !pbc.some((periodic) => periodic)) {
+    if (sites.length < 20 || !pbc.some(Boolean)) {
         const image_sites = sites.flatMap((site, orig_idx) => all_offsets.map((offset) => build_image_site(site, frac_to_cart, offset, orig_idx)));
         return { ...structure, sites: [...sites, ...image_sites] };
     }
@@ -113,7 +113,7 @@ export function get_coordination_colors(structure, strategy = `electroneg_ratio`
     // Check if structure has periodic boundary conditions
     const has_lattice = `lattice` in structure && structure.lattice !== undefined;
     const pbc = has_lattice ? structure.lattice.pbc : undefined;
-    const has_pbc = has_lattice && (pbc === undefined || pbc.some((is_periodic) => is_periodic));
+    const has_pbc = has_lattice && (pbc === undefined || pbc.some(Boolean));
     // For PBC structures, expand with images from neighboring cells for accurate coordination
     const coord_structure = has_pbc ? expand_structure_for_pbc(structure) : structure;
     // Calculate coordination numbers on the (potentially expanded) structure
@@ -196,5 +196,5 @@ export function get_property_colors(structure, config, bonding_strategy, sym_dat
     if (!structure || config.mode === `element`)
         return null;
     const result = get_atom_colors(structure, config, bonding_strategy, sym_data);
-    return result.colors.length ? result : null;
+    return result.colors.length > 0 ? result : null;
 }

package/dist/structure/bond-order-perception.js

@@ -71,7 +71,7 @@ function split_fragments(n_atoms, edges) {
         const stack = [start];
         const frag = [];
         seen.add(start);
-        while (stack.length) {
+        while (stack.length > 0) {
             const node = stack.pop();
             if (node === undefined)
                 break;

package/dist/structure/bonding.d.ts

@@ -2,6 +2,7 @@ import type { Vec3 } from '../math';
 import type { AnyStructure, BondOrder, BondPair, Site, StructureBond } from './';
 export declare const normalize_structure_bond: (site_idx_1: number, site_idx_2: number, order: BondOrder, cell_shift?: Vec3) => StructureBond;
 export declare const get_bond_key: (idx_1: number, idx_2: number, cell_shift?: Vec3) => string;
+export declare function remap_bonds_after_deletion(bonds: readonly StructureBond[], deleted_indices: ReadonlySet<number>): StructureBond[];
 export type BondEditState = {
     added_bonds: StructureBond[];
     removed_bonds: StructureBond[];

package/dist/structure/bonding.js

@@ -45,6 +45,31 @@ export const get_bond_key = (idx_1, idx_2, cell_shift) => {
     const normalized = normalize_bond_endpoints(idx_1, idx_2, cell_shift);
     return `${normalized.site_idx_1}-${normalized.site_idx_2}${format_cell_shift(normalized.cell_shift)}`;
 };
+// Remap explicit bond metadata after site deletion: drop bonds touching deleted
+// sites and shift each surviving index down by the number of deleted indices below it.
+export function remap_bonds_after_deletion(bonds, deleted_indices) {
+    // Sort the deleted indices once; shift each surviving index down by the count of deleted
+    // indices below it via binary search (O(log m) per lookup vs re-filtering the set each call).
+    const sorted = [...deleted_indices].sort((idx_a, idx_b) => idx_a - idx_b);
+    const shift = (idx) => {
+        let [lo, hi] = [0, sorted.length];
+        while (lo < hi) {
+            const mid = (lo + hi) >> 1;
+            if (sorted[mid] < idx)
+                lo = mid + 1;
+            else
+                hi = mid;
+        }
+        return idx - lo; // lo == count of deleted indices < idx
+    };
+    return bonds
+        .filter((bond) => !deleted_indices.has(bond.site_idx_1) && !deleted_indices.has(bond.site_idx_2))
+        .map((bond) => ({
+        ...bond,
+        site_idx_1: shift(bond.site_idx_1),
+        site_idx_2: shift(bond.site_idx_2),
+    }));
+}
 export const BOND_ORDER_OPTIONS = [
     { order: 1, label: `Single` },
     { order: 1.5, label: `1.5` },
@@ -364,23 +389,26 @@ export function scale_and_offset_bond_matrix(transform_matrix, offset, radius_sc
 export function get_bond_render_matrices(bond, bond_thickness) {
     const order = bond.bond_order ?? 1;
     const gap = bond_thickness * 1.8;
-    const offsets_and_scales = order === 2
-        ? [
+    // Parallel cylinder [offset, radius_scale] pairs per bond order; empty → a single
+    // full-width bond (handled by the fallback below)
+    let offsets_and_scales = [];
+    if (order === 2)
+        offsets_and_scales = [
             [-gap / 2, 0.65],
             [gap / 2, 0.65],
-        ]
-        : order === 3
-            ? [
-                [-gap, 0.55],
-                [0, 0.55],
-                [gap, 0.55],
-            ]
-            : order === 1.5 || order === `aromatic`
-                ? [
-                    [-gap / 2, 0.75],
-                    [gap / 2, 0.4],
-                ]
-                : [];
+        ];
+    else if (order === 3)
+        offsets_and_scales = [
+            [-gap, 0.55],
+            [0, 0.55],
+            [gap, 0.55],
+        ];
+    else if (order === 1.5 || order === `aromatic`) {
+        offsets_and_scales = [
+            [-gap / 2, 0.75],
+            [gap / 2, 0.4],
+        ];
+    }
     return offsets_and_scales.length === 0
         ? [bond.transform_matrix]
         : offsets_and_scales.map(([offset, radius_scale]) => scale_and_offset_bond_matrix(bond.transform_matrix, offset, radius_scale));