matterviz 0.3.3 → 0.3.5

package/dist/plot/ScatterPoint.svelte

@@ -1,13 +1,13 @@
 <script lang="ts">
   import { type D3SymbolName, symbol_map } from '../labels'
   import type { HoverStyle, LabelStyle, Point } from './'
-  import type { PointStyle, TweenedOptions, XyObj } from './types'
+  import type { PointStyle, XyObj } from './types'
   import { DEFAULTS } from '../settings'
   import * as d3_symbols from 'd3-shape'
   import { symbol } from 'd3-shape'
   import { cubicOut } from 'svelte/easing'
   import type { SVGAttributes } from 'svelte/elements'
-  import { Tween } from 'svelte/motion'
+  import { Tween, type TweenOptions } from 'svelte/motion'
 
   let {
     x,
@@ -20,6 +20,7 @@
     origin = $bindable({ x: 0, y: 0 }),
     is_hovered = false,
     is_selected = false,
+    is_dimmed = false,
     leader_line_threshold = 15,
     ...rest
   }: Omit<SVGAttributes<SVGGElement>, `style` | `offset` | `origin` | `transform`> & {
@@ -29,10 +30,11 @@
     hover?: HoverStyle
     label?: LabelStyle
     offset?: Point[`offset`]
-    point_tween?: TweenedOptions<XyObj>
+    point_tween?: TweenOptions<XyObj>
     origin?: XyObj
     is_hovered?: boolean
     is_selected?: boolean
+    is_dimmed?: boolean
     leader_line_threshold?: number
   } = $props()
 
@@ -46,7 +48,7 @@
 
   let marker_path = $derived.by(get_symbol_path)
 
-  const default_tween_props: TweenedOptions<XyObj> = {
+  const default_tween_props: TweenOptions<XyObj> = {
     duration: 600,
     easing: cubicOut,
   }
@@ -92,6 +94,7 @@
     fill="var(--point-fill-color, {style.fill ?? `black`})"
     class="marker"
     class:is-hovered={is_hovered && (hover.enabled ?? true)}
+    class:is-dimmed={is_dimmed}
     style:cursor={style.cursor}
   />
   {#if label.text}
@@ -154,6 +157,9 @@
     stroke-width: var(--hover-stroke-width);
     filter: brightness(var(--hover-brightness));
   }
+  .marker.is-dimmed {
+    opacity: var(--scatter-point-dimmed-opacity, 0.25);
+  }
   .effect-ring {
     pointer-events: none;
     animation: ring-pulse var(--effect-ring-duration, 1s) ease-in-out

package/dist/plot/ScatterPoint.svelte.d.ts

@@ -1,6 +1,7 @@
 import type { HoverStyle, LabelStyle, Point } from './';
-import type { PointStyle, TweenedOptions, XyObj } from './types';
+import type { PointStyle, XyObj } from './types';
 import type { SVGAttributes } from 'svelte/elements';
+import { type TweenOptions } from 'svelte/motion';
 type $$ComponentProps = Omit<SVGAttributes<SVGGElement>, `style` | `offset` | `origin` | `transform`> & {
     x: number;
     y: number;
@@ -8,10 +9,11 @@ type $$ComponentProps = Omit<SVGAttributes<SVGGElement>, `style` | `offset` | `o
     hover?: HoverStyle;
     label?: LabelStyle;
     offset?: Point[`offset`];
-    point_tween?: TweenedOptions<XyObj>;
+    point_tween?: TweenOptions<XyObj>;
     origin?: XyObj;
     is_hovered?: boolean;
     is_selected?: boolean;
+    is_dimmed?: boolean;
     leader_line_threshold?: number;
 };
 declare const ScatterPoint: import("svelte").Component<$$ComponentProps, {}, "origin" | "point_tween">;

package/dist/plot/SpacegroupBarPlot.svelte

@@ -21,6 +21,7 @@
   let {
     data,
     show_counts = true,
+    show_legend = false,
     orientation = `vertical`,
     x_axis = {},
     y_axis = {},
@@ -111,9 +112,9 @@
     // Convert to BarSeries array, maintaining order of crystal systems
     const result: BarSeries[] = []
     for (const system of symmetry.CRYSTAL_SYSTEMS) {
-      const data = series_by_system.get(system)
-      if (data) {
-        const { x, y } = data
+      const system_data = series_by_system.get(system)
+      if (system_data) {
+        const { x, y } = system_data
         const color = symmetry.CRYSTAL_SYSTEM_COLORS[system]
         result.push({ x, y, color, label: system, bar_width: 0.9, visible: true })
       }
@@ -285,7 +286,7 @@
   mode="overlay"
   x_axis={x_axis_config}
   y_axis={y_axis_config}
-  show_legend={false}
+  {show_legend}
   show_controls={false}
   {tooltip}
   {user_content}

package/dist/plot/data-cleaning.js

@@ -15,7 +15,7 @@ export function compute_local_variance(values, window_size) {
     if (len === 1)
         return [0];
     const half_window = Math.floor(window_size / 2);
-    const result = new Array(len);
+    const result = Array(len);
     // Single pass for each index, no slice allocation (avoids O(n × window) allocations)
     for (let idx = 0; idx < len; idx++) {
         const start = Math.max(0, idx - half_window);
@@ -40,7 +40,7 @@ export function compute_local_variance(values, window_size) {
 function compute_derivatives(values) {
     if (values.length < 2)
         return [];
-    const derivs = new Array(values.length - 1);
+    const derivs = Array(values.length - 1);
     for (let idx = 0; idx < values.length - 1; idx++) {
         derivs[idx] = values[idx + 1] - values[idx];
     }
@@ -216,7 +216,7 @@ export function detect_instability(x_values, y_values, config = {}) {
 export function smooth_moving_average(values, window) {
     if (values.length === 0 || window <= 1)
         return [...values];
-    const result = new Array(values.length);
+    const result = Array(values.length);
     const half_window = Math.floor(window / 2);
     for (let idx = 0; idx < values.length; idx++) {
         const start = Math.max(0, idx - half_window);
@@ -253,7 +253,7 @@ function compute_savgol_coefficients(window, order) {
     const vtv_inv = invert_matrix(vtv);
     if (!vtv_inv) {
         // Fallback to uniform weights
-        return new Array(size).fill(1 / size);
+        return Array(size).fill(1 / size);
     }
     const vt = transpose(vandermonde);
     const coeffs_matrix = multiply_matrices(vtv_inv, vt);
@@ -272,7 +272,7 @@ export function smooth_savitzky_golay(values, window, polynomial_order = DEFAULT
         return [...values];
     const coeffs = compute_savgol_coefficients(actual_window, polynomial_order);
     const half = Math.floor(actual_window / 2);
-    const result = new Array(values.length);
+    const result = Array(values.length);
     // Cache coefficient sum to avoid O(n × window) redundant reductions in loop
     const coeffs_sum = coeffs.reduce((a, b) => a + b, 0);
     for (let idx = 0; idx < values.length; idx++) {
@@ -355,7 +355,7 @@ export function remove_local_outliers(y_values, config = {}) {
             iterations_used: 0,
         };
     }
-    let kept_mask = new Array(len).fill(true);
+    let kept_mask = Array(len).fill(true);
     let iterations_used = 0;
     for (let iter = 0; iter < max_iterations; iter++) {
         let removed_any = false;
@@ -592,7 +592,7 @@ export function clean_series(series, config = {}) {
         }
     }
     // Build result series
-    const result_series = (in_place ? series : { ...series });
+    const result_series = in_place ? series : { ...series };
     result_series.x = x_arr;
     result_series.y = y_arr;
     if (metadata !== undefined)
@@ -791,7 +791,7 @@ function transpose(matrix) {
         return [];
     const rows = matrix.length;
     const cols = matrix[0].length;
-    const result = Array.from({ length: cols }, () => new Array(rows));
+    const result = Array.from({ length: cols }, () => Array(rows).fill(0));
     for (let row = 0; row < rows; row++) {
         for (let col = 0; col < cols; col++) {
             result[col][row] = matrix[row][col];
@@ -803,7 +803,7 @@ function multiply_matrices(a, b) {
     const rows_a = a.length;
     const cols_a = a[0]?.length ?? 0;
     const cols_b = b[0]?.length ?? 0;
-    const result = Array.from({ length: rows_a }, () => new Array(cols_b).fill(0));
+    const result = Array.from({ length: rows_a }, () => Array(cols_b).fill(0));
     for (let row = 0; row < rows_a; row++) {
         for (let col = 0; col < cols_b; col++) {
             for (let k = 0; k < cols_a; k++) {

package/dist/plot/index.d.ts

@@ -1,9 +1,3 @@
-export interface TweenedOptions<T> {
-    delay?: number;
-    duration?: number | ((from: T, to: T) => number);
-    easing?: (t: number) => number;
-    interpolate?: (a: T, b: T) => (t: number) => T;
-}
 export { default as AxisLabel } from './AxisLabel.svelte';
 export { default as BarPlot } from './BarPlot.svelte';
 export { default as BarPlotControls } from './BarPlotControls.svelte';

package/dist/plot/scales.d.ts

@@ -16,8 +16,8 @@ export interface ArcsinhScale {
 export type PlotScaleFn = ScaleContinuousNumeric<number, number> | ScaleTime<number, number> | ArcsinhScale;
 export declare function scale_arcsinh(threshold?: number): ArcsinhScale;
 export declare function generate_arcsinh_ticks(min: number, max: number, threshold?: number, count?: number): number[];
-export declare function create_scale(scale_type: ScaleType, domain: [number, number], range: [number, number]): ScaleContinuousNumeric<number, number> | ArcsinhScale;
-export declare function create_time_scale(domain: [number, number], range: [number, number]): ScaleTime<number, number, never>;
+export declare function create_scale(scale_type: ScaleType, domain: [number, number], output_range: [number, number]): ScaleContinuousNumeric<number, number> | ArcsinhScale;
+export declare function create_time_scale(domain: [number, number], output_range: [number, number]): ScaleTime<number, number, never>;
 export declare function generate_ticks(domain: [number, number], scale_type: ScaleType, ticks_option: TicksOption | undefined, scale_fn: PlotScaleFn, // D3 scale function with .ticks() method
 options?: {
     format?: string;
@@ -25,7 +25,7 @@ options?: {
     interval_padding?: number;
 }): number[];
 export declare function calculate_domain(values: number[], scale_type?: ScaleType): [number, number];
-export declare function get_nice_data_range(points: Point[], get_value: (p: Point) => number, range: [number | null, number | null], scale_type: ScaleType, padding_factor: number, is_time?: boolean): [number, number];
+export declare function get_nice_data_range(points: Point[], get_value: (p: Point) => number, limits: [number | null, number | null], scale_type: ScaleType, padding_factor: number, is_time?: boolean): [number, number];
 export declare function generate_log_ticks(min: number, max: number, ticks_option?: TicksOption): number[];
 export declare function get_tick_label(tick_value: number, ticks_option: TicksOption | undefined): string | null;
 export declare function create_color_scale(color_scale_config: {

package/dist/plot/scales.js

@@ -10,8 +10,8 @@ export function scale_arcsinh(threshold = 1) {
     if (!Number.isFinite(threshold) || threshold <= 0) {
         throw new Error(`arcsinh threshold must be a positive finite number, got ${threshold}`);
     }
-    let _domain = [0, 1];
-    let _range = [0, 1];
+    let current_domain = [0, 1];
+    let current_range = [0, 1];
     // Forward transform: data value → arcsinh-space
     const arcsinh_transform = (x) => Math.asinh(x / threshold);
     // Inverse transform: arcsinh-space → data value
@@ -20,8 +20,8 @@ export function scale_arcsinh(threshold = 1) {
     // Accepts Date for compatibility with D3 time scales
     const scale = ((value) => {
         const num_value = value instanceof Date ? value.getTime() : value;
-        const [d_min, d_max] = _domain;
-        const [r_min, r_max] = _range;
+        const [d_min, d_max] = current_domain;
+        const [r_min, r_max] = current_range;
         // Handle identical domain endpoints (degenerate case)
         if (d_max === d_min)
             return (r_min + r_max) / 2;
@@ -39,21 +39,21 @@ export function scale_arcsinh(threshold = 1) {
     // Domain getter/setter
     scale.domain = function (domain) {
         if (domain === undefined)
-            return _domain;
-        _domain = domain;
+            return current_domain;
+        current_domain = domain;
         return scale;
     };
     // Range getter/setter
-    scale.range = function (range) {
-        if (range === undefined)
-            return _range;
-        _range = range;
+    scale.range = function (output_range) {
+        if (output_range === undefined)
+            return current_range;
+        current_range = output_range;
         return scale;
     };
     // Invert: screen position → data value
     scale.invert = (value) => {
-        const [d_min, d_max] = _domain;
-        const [r_min, r_max] = _range;
+        const [d_min, d_max] = current_domain;
+        const [r_min, r_max] = current_range;
         // Handle identical domain endpoints (degenerate case)
         if (d_max === d_min)
             return (d_min + d_max) / 2;
@@ -71,13 +71,13 @@ export function scale_arcsinh(threshold = 1) {
     // Copy the scale
     scale.copy = () => {
         const copy = scale_arcsinh(threshold);
-        copy.domain(_domain);
-        copy.range(_range);
+        copy.domain(current_domain);
+        copy.range(current_range);
         return copy;
     };
     // Generate nice ticks for arcsinh scale
     scale.ticks = (count = 10) => {
-        return generate_arcsinh_ticks(_domain[0], _domain[1], threshold, count);
+        return generate_arcsinh_ticks(current_domain[0], current_domain[1], threshold, count);
     };
     scale.threshold = threshold;
     return scale;
@@ -181,26 +181,26 @@ function generate_positive_arcsinh_ticks(min, max, threshold, count) {
 // Note: Time scales are handled separately via create_time_scale() since ScaleTime
 // has incompatible types (invert returns Date, not number). Use is_time_scale()
 // to detect time mode and call create_time_scale() directly when needed.
-export function create_scale(scale_type, domain, range) {
+export function create_scale(scale_type, domain, output_range) {
     const [min_val, max_val] = domain;
     const type_name = get_scale_type_name(scale_type);
     if (type_name === `log`) {
         return scaleLog()
             .domain([Math.max(min_val, math.LOG_EPS), max_val])
-            .range(range);
+            .range(output_range);
     }
     if (type_name === `arcsinh`) {
         const threshold = get_arcsinh_threshold(scale_type);
-        return scale_arcsinh(threshold).domain(domain).range(range);
+        return scale_arcsinh(threshold).domain(domain).range(output_range);
     }
     // For 'time' or 'linear', return linear scale (time scales need create_time_scale())
-    return scaleLinear().domain(domain).range(range);
+    return scaleLinear().domain(domain).range(output_range);
 }
 // Create a time scale for time-based data
-export function create_time_scale(domain, range) {
+export function create_time_scale(domain, output_range) {
     return scaleTime()
         .domain([new Date(domain[0]), new Date(domain[1])])
-        .range(range);
+        .range(output_range);
 }
 // Unified tick generation function
 export function generate_ticks(domain, scale_type, ticks_option, scale_fn, // D3 scale function with .ticks() method
@@ -276,8 +276,8 @@ export function calculate_domain(values, scale_type = `linear`) {
     return type_name === `log` ? [Math.max(min_val, math.LOG_EPS), max_val] : [min_val, max_val];
 }
 // Advanced domain calculation with padding and nice boundaries (from ScatterPlot)
-export function get_nice_data_range(points, get_value, range, scale_type, padding_factor, is_time = false) {
-    const [min, max] = range;
+export function get_nice_data_range(points, get_value, limits, scale_type, padding_factor, is_time = false) {
+    const [min, max] = limits;
     const [min_ext, max_ext] = extent(points, get_value);
     let data_min = min ?? min_ext ?? 0;
     let data_max = max ?? max_ext ?? 1;
@@ -422,14 +422,14 @@ export function create_color_scale(color_scale_config, auto_color_range) {
 }
 // Create an arcsinh-based color scale (custom sequential scale)
 // Returns a D3-compatible scale with both getter and setter for domain
-// Scale function reads from _domain closure on each call for stable identity
+// Scale function reads from closure state on each call for stable identity
 function create_arcsinh_color_scale(interpolator, initial_domain, threshold) {
     // Guard against extremely small thresholds that could cause precision issues
     const safe_threshold = Math.max(threshold, Number.EPSILON);
-    let _domain = initial_domain;
-    // Single scale function that reads current _domain on each call
+    let current_domain = initial_domain;
+    // Single scale function that reads current domain on each call
     const scale = ((value) => {
-        const [d_min, d_max] = _domain;
+        const [d_min, d_max] = current_domain;
         // Handle identical domain endpoints - return middle of color range
         if (d_max === d_min)
             return interpolator(0.5);
@@ -443,8 +443,8 @@ function create_arcsinh_color_scale(interpolator, initial_domain, threshold) {
     // Domain getter/setter for D3 compatibility - returns same scale instance
     scale.domain = function (new_domain) {
         if (new_domain === undefined)
-            return _domain;
-        _domain = new_domain;
+            return current_domain;
+        current_domain = new_domain;
         return scale;
     };
     return scale;

package/dist/plot/types.d.ts

@@ -3,14 +3,10 @@ import type { Vec2, Vec3 } from '../math';
 import type DraggablePane from '../overlays/DraggablePane.svelte';
 import type { ComponentProps, Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
+import type { TweenOptions } from 'svelte/motion';
+export type { TweenOptions } from 'svelte/motion';
 import type PlotLegend from './PlotLegend.svelte';
 import type { TicksOption } from './scales';
-export interface TweenedOptions<T> {
-    delay?: number;
-    duration?: number | ((from: T, to: T) => number);
-    easing?: (t: number) => number;
-    interpolate?: (a: T, b: T) => (t: number) => T;
-}
 export type XyObj = {
     x: number;
     y: number;
@@ -89,7 +85,7 @@ export interface PlotPoint<Metadata = Record<string, unknown>> extends Point<Met
     point_hover?: HoverStyle;
     point_label?: LabelStyle;
     point_offset?: XyObj;
-    point_tween?: TweenedOptions<XyObj>;
+    point_tween?: TweenOptions<XyObj>;
 }
 export type Markers = `line` | `points` | `line+points` | `none`;
 export interface DataSeries<Metadata = Record<string, unknown>> {
@@ -106,7 +102,7 @@ export interface DataSeries<Metadata = Record<string, unknown>> {
     point_hover?: HoverStyle[] | HoverStyle;
     point_label?: LabelStyle[] | LabelStyle;
     point_offset?: XyObj[] | XyObj;
-    point_tween?: TweenedOptions<XyObj>;
+    point_tween?: TweenOptions<XyObj>;
     visible?: boolean;
     label?: string;
     legend_group?: string;
@@ -217,7 +213,7 @@ export type HoverConfig = {
 };
 export type LegendConfig = Omit<ComponentProps<typeof PlotLegend>, `series_data` | `on_drag_start` | `on_drag` | `on_drag_end`> & {
     margin?: number | Sides;
-    tween?: TweenedOptions<XyObj>;
+    tween?: TweenOptions<XyObj>;
     responsive?: boolean;
     draggable?: boolean;
     axis_clearance?: number;

package/dist/rdf/calc-rdf.js

@@ -29,7 +29,7 @@ export function calculate_rdf(structure, options = {}) {
     }
     const bin_size = cutoff / n_bins;
     const r = Array.from({ length: n_bins }, (_, idx) => (idx + 0.5) * bin_size);
-    const g_r = new Array(n_bins).fill(0);
+    const g_r = Array(n_bins).fill(0);
     if (sites.length === 0)
         return { r, g_r };
     // Get occupancy weight for a site-species pair (supports mixed occupancy)

package/dist/sanitize.js

@@ -1,16 +1,5 @@
 import DOMPurify from 'dompurify';
 import { format_formula_html } from './phase-diagram/utils';
-// SSR: provide a DOM for DOMPurify when no browser window exists (e.g. during vite build)
-let ssr_window;
-if (typeof globalThis.window === `undefined`) {
-    try {
-        const { Window } = await import(`happy-dom`);
-        ssr_window = new Window();
-    }
-    catch {
-        // happy-dom not available at runtime — get_purify() will fall back to pass-through
-    }
-}
 const SAFE_TAGS = [`a`, `b`, `i`, `em`, `strong`, `sub`, `sup`, `br`, `span`, `code`, `small`];
 const SAFE_ATTRS = [`style`, `class`, `title`, `href`, `target`, `rel`];
 // only allow safe CSS properties for text formatting
@@ -26,9 +15,9 @@ let purify;
 function get_purify() {
     if (purify !== undefined)
         return purify;
-    const instance = ssr_window
-        ? DOMPurify(ssr_window)
-        : DOMPurify();
+    if (typeof globalThis.window === `undefined`)
+        return (purify = null);
+    const instance = DOMPurify();
     if (typeof instance.sanitize !== `function`) {
         purify = null;
         return null;
@@ -68,12 +57,30 @@ function sanitize_svg_content(html, allowed_tags, allowed_attrs) {
         return wrapped;
     return wrapped.slice(open_end + 1, close_start);
 }
+const stringify_html_input = (html) => {
+    if (html == null)
+        return ``;
+    if (typeof html === `string`)
+        return html;
+    if (typeof html === `number`)
+        return Number.isNaN(html) ? `NaN` : `${html}`;
+    if (typeof html === `boolean` || typeof html === `bigint`)
+        return `${html}`;
+    if (typeof html !== `object`)
+        return ``;
+    try {
+        return JSON.stringify(html) ?? ``;
+    }
+    catch {
+        return ``;
+    }
+};
 // Sanitize HTML string, allowing only safe formatting tags and links.
 // Two-pass: happy-dom promotes dangerous children when a non-allowed parent is
 // stripped (e.g. <div><script>…</script></div> → <script>…</script>). The first
 // pass explicitly removes dangerous tags so they can't survive promotion.
 export function sanitize_html(html) {
-    const str = html == null ? `` : String(html);
+    const str = stringify_html_input(html);
     const dp = get_purify();
     if (!dp)
         return str;

package/dist/settings.d.ts

@@ -100,6 +100,8 @@ export interface SettingsConfig {
         show_image_atoms: SettingType<boolean>;
         sphere_segments: SettingType<number>;
         bond_thickness: SettingType<number>;
+        auto_bond_order: SettingType<boolean>;
+        aromatic_display: SettingType<`aromatic` | `kekule`>;
         show_bonds: SettingType<ShowBonds>;
         bond_color: SettingType<string>;
         bonding_strategy: SettingType<BondingStrategy>;

package/dist/settings.js

@@ -110,6 +110,15 @@ export const SETTINGS_CONFIG = {
             minimum: 0.01,
             maximum: 1.0,
         },
+        auto_bond_order: {
+            value: false,
+            description: `Automatically perceive double/triple/aromatic bonds from geometry (main-group/organic; metals fall back to single)`,
+        },
+        aromatic_display: {
+            value: `aromatic`,
+            description: `How to render perceived aromatic rings`,
+            enum: { aromatic: `Aromatic (1.5)`, kekule: `Kekulé (alternating)` },
+        },
         show_bonds: {
             value: `always`,
             description: `When to display bonds between atoms`,
@@ -243,11 +252,11 @@ export const SETTINGS_CONFIG = {
             maximum: 5,
         },
         site_label_color: {
-            value: `#ffffff`,
+            value: `#111111`,
             description: `Text color for atom labels`,
         },
         site_label_bg_color: {
-            value: `#000000`,
+            value: `color-mix(in srgb, #000000 0%, transparent)`,
             description: `Background color for atom labels`,
         },
         site_label_padding: {
@@ -1111,7 +1120,7 @@ export const DEFAULTS = extract_values(SETTINGS_CONFIG);
 // Helper to merge with defaults - handles nested structure
 export const merge = (user) => ({
     ...DEFAULTS,
-    ...(user || {}),
+    ...user,
     structure: merge_nested(DEFAULTS.structure, user?.structure),
     trajectory: merge_nested(DEFAULTS.trajectory, user?.trajectory),
     composition: merge_nested(DEFAULTS.composition, user?.composition),

package/dist/spectral/Bands.svelte

@@ -234,17 +234,17 @@
 
   // Collect all path segments across structures once (shared by strict checks and plotting)
   let all_segments = $derived.by(() => {
-    const all_segments: Record<string, [string, BaseBandStructure][]> = {}
+    const collected_segments: Record<string, [string, BaseBandStructure][]> = {}
     for (const [label, bs] of Object.entries(band_structs_dict)) {
       for (const branch of bs.branches) {
         const start_label = bs.qpoints[branch.start_index]?.label ?? undefined
         const end_label = bs.qpoints[branch.end_index]?.label ?? undefined
         const segment_key = helpers.get_segment_key(start_label, end_label)
-        all_segments[segment_key] ??= []
-        all_segments[segment_key].push([label, bs])
+        collected_segments[segment_key] ??= []
+        collected_segments[segment_key].push([label, bs])
       }
     }
-    return all_segments
+    return collected_segments
   })
 
   let num_structures = $derived(Object.keys(band_structs_dict).length)
@@ -626,8 +626,8 @@
     }
     // Range became invalid - clear parent's range to propagate reset
     if (`range` in y_axis) {
-      const { range: _omit, ...rest } = y_axis
-      y_axis = rest
+      const { range: _omit, ...axis_without_range } = y_axis
+      y_axis = axis_without_range
     }
   })
 

package/dist/spectral/BandsAndDos.svelte

@@ -69,10 +69,10 @@
     // Only include range if it's valid (don't override child's auto-range with undefined)
     bands_y_axis = shared_y_axis
       ? {
-        ...(bands_props.y_axis ?? {}),
+        ...bands_props.y_axis,
         ...(is_valid_range(base_range) && { range: base_range }),
       }
-      : { ...(bands_props.y_axis ?? {}) }
+      : { ...bands_props.y_axis }
   })
 
   // Propagate synced range to DOS y-axis (untrack current to avoid overwriting child zoom)
@@ -88,10 +88,10 @@
     dos_y_axis = shared_y_axis
       ? {
         label: ``,
-        ...(dos_props.y_axis ?? {}),
+        ...dos_props.y_axis,
         ...(is_valid_range(base_range) && { range: base_range }),
       }
-      : { label: ``, ...(dos_props.y_axis ?? {}) }
+      : { label: ``, ...dos_props.y_axis }
   })
 
   let hovered_frequency = $state<number | null>(null)

package/dist/spectral/BrillouinBandsDos.svelte

@@ -131,7 +131,7 @@
     ) return
     // Only include range if it's valid (don't override child's auto-range with undefined)
     bands_y_axis = {
-      ...(bands_props.y_axis ?? {}),
+      ...bands_props.y_axis,
       ...(helpers.is_valid_range(base_range) && { range: base_range }),
     }
   })
@@ -150,10 +150,10 @@
     dos_y_axis = is_desktop
       ? {
         label: ``,
-        ...(dos_props.y_axis ?? {}),
+        ...dos_props.y_axis,
         ...(helpers.is_valid_range(base_range) && { range: base_range }),
       }
-      : { ...(dos_props.y_axis ?? {}) }
+      : { ...dos_props.y_axis }
   })
 
   let hovered_frequency = $state<number | null>(null)

package/dist/spectral/Dos.svelte

@@ -370,8 +370,8 @@
     }
     // Range became invalid - clear parent's range to propagate reset
     if (`range` in y_axis) {
-      const { range: _omit, ...rest } = y_axis
-      y_axis = rest
+      const { range: _omit, ...axis_without_range } = y_axis
+      y_axis = axis_without_range
     }
   })
 

package/dist/spectral/helpers.js

@@ -224,7 +224,7 @@ function apply_gaussian_smearing_core(freqs_or_energies, densities, sigma) {
     const orig_sum = densities.reduce((acc, d) => acc + d, 0);
     if (sigma <= 0 || orig_sum === 0)
         return densities;
-    const smeared = new Array(densities.length).fill(0);
+    const smeared = Array(densities.length).fill(0);
     const truncation_width = 4; // Truncate Gaussian at ±4σ (contribution < 0.01%)
     for (let idx = 0; idx < freqs_or_energies.length; idx++) {
         const energy = freqs_or_energies[idx];

package/dist/structure/AtomLegend.svelte

@@ -176,8 +176,8 @@
   function remap_element(from: ElementSymbol, to: ElementSymbol) {
     if (from === to && element_mapping?.[from]) {
       // Remove mapping if mapping back to original element
-      const { [from]: _, ...rest } = element_mapping
-      element_mapping = Object.keys(rest).length > 0 ? rest : undefined
+      const { [from]: _removed_mapping, ...mapping } = element_mapping
+      element_mapping = Object.keys(mapping).length > 0 ? mapping : undefined
     } else if (from !== to) {
       element_mapping = { ...element_mapping, [from]: to }
     }
@@ -202,8 +202,8 @@
   }
 
   function clear_element_radius(elem: ElementSymbol) {
-    const { [elem]: _, ...rest } = element_radius_overrides ?? {}
-    element_radius_overrides = rest
+    const { [elem]: _removed_radius, ...radii } = element_radius_overrides ?? {}
+    element_radius_overrides = radii
   }
 
   const get_element_radius = (elem: ElementSymbol): number =>