matterviz 0.3.0 → 0.3.2

package/dist/convex-hull/ConvexHullStats.svelte.d.ts

@@ -4,7 +4,12 @@ type $$ComponentProps = HTMLAttributes<HTMLDivElement> & {
     phase_stats: PhaseStats | null;
     stable_entries: ConvexHullEntry[];
     unstable_entries: ConvexHullEntry[];
+    layout?: `toggle` | `side-by-side`;
+    on_entry_click?: (entry: ConvexHullEntry) => void;
+    highlighted_entry_id?: string;
+    min_n_elements?: number;
+    entry_href?: (entry: ConvexHullEntry) => string | null;
 };
-declare const ConvexHullStats: import("svelte").Component<$$ComponentProps, {}, "">;
+declare const ConvexHullStats: import("svelte").Component<$$ComponentProps, {}, "min_n_elements">;
 type ConvexHullStats = ReturnType<typeof ConvexHullStats>;
 export default ConvexHullStats;

package/dist/convex-hull/ConvexHullTooltip.svelte

@@ -84,6 +84,7 @@ const polymorph_stats = $derived(entry.entry_id && polymorph_stats_map
 <style>
   .tooltip-content {
     max-width: var(--tooltip-max-width, 200px);
+    text-align: left;
   }
   .tooltip-content > div {
     overflow: hidden;

package/dist/convex-hull/GasPressureControls.svelte

@@ -1,55 +1,70 @@
 <script lang="ts">import { tooltip } from 'svelte-multiselect';
 import { compute_gas_chemical_potential, format_chemical_potential, get_default_gas_provider, get_effective_pressures, } from './gas-thermodynamics';
-let { config, pressures = $bindable({}), temperature, position = `top-right`, } = $props();
+let { config, pressures = $bindable({}), temperature, position = `top-right`, ...rest } = $props();
 // Log scale range for pressure slider: 10^-10 to 10^2 bar
 const LOG_P_MIN = -10;
 const LOG_P_MAX = 2;
 const LOG_P_RANGE = LOG_P_MAX - LOG_P_MIN;
 const MIN_PRESSURE = 1e-15; // Safe minimum to avoid log(0) or NaN
+const THROTTLE_MS = 100;
+// Local preview state for smooth slider interaction without causing full hull re-renders
+let preview_pressures = $state({});
+let last_update_time = 0;
 // Get provider for chemical potential calculations
 const provider = $derived(config.provider ?? get_default_gas_provider());
 // Get enabled gases from config
 const enabled_gases = $derived(config.enabled_gases ?? []);
 // Effective pressures including defaults
 const effective_pressures = $derived(get_effective_pressures(config));
-// Get current pressure for a gas (user-set or default), clamped to safe value
+// Get current pressure for a gas (preview during drag, committed, or default)
 function get_pressure(gas) {
-    const P = pressures[gas] ?? effective_pressures[gas];
+    const P = preview_pressures[gas] ?? pressures[gas] ?? effective_pressures[gas];
     return Number.isFinite(P) && P > 0 ? P : MIN_PRESSURE;
 }
 // Compute chemical potential μ(T,P) for a gas at current temperature and pressure
-function get_mu(gas) {
-    return compute_gas_chemical_potential(provider, gas, temperature, get_pressure(gas));
-}
+const get_mu = (gas) => compute_gas_chemical_potential(provider, gas, temperature, get_pressure(gas));
 // Convert pressure to log scale slider position (0-100)
-function pressure_to_slider(P) {
-    const log_P = Math.log10(P); // P is already normalized from get_pressure
-    return ((Math.max(LOG_P_MIN, Math.min(LOG_P_MAX, log_P)) - LOG_P_MIN) /
-        LOG_P_RANGE) * 100;
-}
+const pressure_to_slider = (P) => ((Math.max(LOG_P_MIN, Math.min(LOG_P_MAX, Math.log10(P))) - LOG_P_MIN) /
+    LOG_P_RANGE) * 100;
 // Convert slider position (0-100) to pressure
-function slider_to_pressure(value) {
-    const log_P = LOG_P_MIN + (value / 100) * LOG_P_RANGE;
-    return Math.pow(10, log_P);
-}
+const slider_to_pressure = (value) => Math.pow(10, LOG_P_MIN + (value / 100) * LOG_P_RANGE);
 // Format gas name for display (subscript numbers)
-function format_gas_name(gas) {
-    return gas.replace(/(\d+)/g, `<sub>$1</sub>`);
-}
-// Format pressure with HTML - exponent notation for powers of 10, decimal otherwise
-function format_pressure_html(P) {
-    const log_P = Math.log10(P), exp = Math.round(log_P); // P already normalized
+const format_gas_name = (gas) => gas.replace(/(\d+)/g, `<sub>$1</sub>`);
+// Format pressure as plain text (no HTML) for the number input
+function format_pressure(P) {
+    const log_P = Math.log10(P);
+    const exp = Math.round(log_P);
     if (Math.abs(log_P - exp) < 0.1)
-        return `10<sup>${exp}</sup>`;
-    return P >= 0.01 && P < 100 ? `${P.toPrecision(2)}` : `${P.toExponential(1)}`;
+        return `1e${exp}`;
+    if (P >= 0.01 && P < 100)
+        return P.toPrecision(2);
+    return P.toExponential(1);
 }
 function set_pressure(gas, value) {
-    pressures = { ...pressures, [gas]: slider_to_pressure(value) };
+    const P = slider_to_pressure(value);
+    preview_pressures = { ...preview_pressures, [gas]: P };
+    // Throttle parent updates during drag to prevent hull recomputation on every pixel
+    const now = Date.now();
+    if (now - last_update_time >= THROTTLE_MS) {
+        last_update_time = now;
+        pressures = { ...pressures, [gas]: P };
+    }
+}
+function handle_slider_end(gas, event) {
+    const P = slider_to_pressure(+event.currentTarget.value);
+    pressures = { ...pressures, [gas]: P };
+    // Clear only this gas's preview (don't reset other sliders being dragged simultaneously)
+    const { [gas]: _, ...rest } = preview_pressures;
+    preview_pressures = rest;
+}
+function set_pressure_direct(gas, value) {
+    const clamped = Math.max(Math.pow(10, LOG_P_MIN), Math.min(Math.pow(10, LOG_P_MAX), value));
+    pressures = { ...pressures, [gas]: clamped };
 }
 </script>
 
 {#if enabled_gases.length > 0}
-  <div class="pressure-controls {position}">
+  <div {...rest} class="pressure-controls {position} {rest.class ?? ``}">
     {#each enabled_gases as gas (gas)}
       {@const P = get_pressure(gas)}
       {@const mu = get_mu(gas)}
@@ -61,12 +76,21 @@ function set_pressure(gas, value) {
           }`,
         })}
       >
-        <div class="pressure-label">
-          <!-- eslint-disable-next-line svelte/no-at-html-tags -->
-          <span class="pressure-value">{@html format_pressure_html(P)}</span>
+        <label class="pressure-label">
+          <input
+            type="text"
+            class="pressure-input"
+            value={format_pressure(P)}
+            onchange={(evt) => {
+              const val = Number(evt.currentTarget.value)
+              if (Number.isFinite(val) && val > 0) set_pressure_direct(gas, val)
+              else evt.currentTarget.value = format_pressure(P)
+            }}
+            aria-label="{gas} pressure (bar)"
+          />
           <!-- eslint-disable-next-line svelte/no-at-html-tags -->
           <span class="gas-name">{@html format_gas_name(gas)}</span>
-        </div>
+        </label>
         <div class="slider-wrapper">
           <span class="pressure-range">
             10<sup>{LOG_P_MIN}</sup>–10<sup>{LOG_P_MAX}</sup>
@@ -78,6 +102,9 @@ function set_pressure(gas, value) {
             step="0.5"
             value={pressure_to_slider(P)}
             oninput={(evt) => set_pressure(gas, +evt.currentTarget.value)}
+            onchange={(evt) => handle_slider_end(gas, evt)}
+            onmouseup={(evt) => handle_slider_end(gas, evt)}
+            ontouchend={(evt) => handle_slider_end(gas, evt)}
             aria-label="{gas} partial pressure"
           />
         </div>
@@ -126,16 +153,17 @@ function set_pressure(gas, value) {
   .pressure-slider {
     display: flex;
     flex-direction: column;
-    align-items: center;
+    align-items: var(--pressure-slider-align, center);
     gap: 4px;
     background: color-mix(in srgb, var(--hull-bg, transparent) 80%, transparent);
-    padding: 6px 8px;
-    border-radius: var(--border-radius, 3pt);
-    backdrop-filter: blur(4px);
+    padding: 3px 5px;
+    border-radius: var(--border-radius, 6pt);
+    backdrop-filter: blur(2px);
   }
   .slider-wrapper {
     display: flex;
     place-items: center;
+    justify-content: var(--slider-justify, center);
     line-height: 1;
   }
   .pressure-slider input[type='range'] {
@@ -145,13 +173,19 @@ function set_pressure(gas, value) {
   .pressure-label {
     display: flex;
     align-items: center;
-    gap: 4px;
+    gap: 2px;
   }
-  .pressure-value {
-    font-size: 0.95em;
+  .pressure-input {
+    width: 5.5ch;
+    border: 1px solid color-mix(in srgb, currentColor 5%, transparent);
+    border-radius: 3px;
+    background: transparent;
+    text-align: center;
   }
-  .pressure-value :global(sup) {
-    font-size: 0.75em;
+  .pressure-input::-webkit-outer-spin-button,
+  .pressure-input::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
   }
   .gas-name {
     font-size: 0.9em;

package/dist/convex-hull/GasPressureControls.svelte.d.ts

@@ -1,5 +1,6 @@
 import type { GasControlPosition, GasSpecies, GasThermodynamicsConfig } from './types';
-type $$ComponentProps = {
+import type { HTMLAttributes } from 'svelte/elements';
+type $$ComponentProps = HTMLAttributes<HTMLDivElement> & {
     config: GasThermodynamicsConfig;
     pressures: Partial<Record<GasSpecies, number>>;
     temperature: number;

package/dist/convex-hull/TemperatureSlider.svelte

@@ -1,15 +1,36 @@
 <script lang="ts">import { tooltip } from 'svelte-multiselect';
-let { available_temperatures, temperature = $bindable(), } = $props();
+let { available_temperatures, temperature = $bindable(), ...rest } = $props();
+// Local preview state for smooth slider interaction without causing full re-renders
+let preview_index = $state(null);
+let last_update_time = 0;
+const THROTTLE_MS = 100;
 const temp_index = $derived(Math.max(0, available_temperatures.indexOf(temperature)));
-const display_temp = $derived(available_temperatures[temp_index] ?? temperature);
-// Find closest available temperature to input value
+const display_index = $derived(preview_index ?? temp_index);
+const display_temp = $derived(available_temperatures[display_index] ?? temperature);
+function handle_slider_input(event) {
+    const new_index = +event.currentTarget.value;
+    preview_index = new_index;
+    // Throttle parent updates during drag to prevent scene flashing
+    const now = Date.now();
+    if (now - last_update_time >= THROTTLE_MS) {
+        last_update_time = now;
+        temperature = available_temperatures[new_index] ?? temperature;
+    }
+}
+function handle_slider_end(event) {
+    const new_temp = available_temperatures[+event.currentTarget.value];
+    if (new_temp !== undefined)
+        temperature = new_temp;
+    preview_index = null;
+}
 function set_closest_temp(value) {
     temperature = available_temperatures.reduce((prev, curr) => (Math.abs(curr - value) < Math.abs(prev - value) ? curr : prev), temperature);
 }
 </script>
 
 <div
-  class="temperature-slider"
+  {...rest}
+  class="temperature-slider {rest.class ?? ``}"
   {@attach tooltip({ content: `Temperature for G(T) free energies` })}
 >
   <label class="temp-label">
@@ -24,21 +45,24 @@ function set_closest_temp(value) {
     />
     <span>K</span>
   </label>
-  <div class="slider-wrapper">
-    {#if available_temperatures.length > 0}
+  {#if available_temperatures.length > 0}
+    <div class="slider-wrapper">
       <span class="temp-range">
         {available_temperatures[0]}–{available_temperatures.at(-1)} K
       </span>
-    {/if}
-    <input
-      type="range"
-      min="0"
-      max={available_temperatures.length - 1}
-      value={temp_index}
-      oninput={(evt) => temperature = available_temperatures[+evt.currentTarget.value]}
-      aria-label="Temperature (Kelvin)"
-    />
-  </div>
+      <input
+        type="range"
+        min="0"
+        max={available_temperatures.length - 1}
+        value={display_index}
+        oninput={handle_slider_input}
+        onchange={handle_slider_end}
+        onmouseup={handle_slider_end}
+        ontouchend={handle_slider_end}
+        aria-label="Temperature (Kelvin)"
+      />
+    </div>
+  {/if}
 </div>
 
 <style>
@@ -46,18 +70,21 @@ function set_closest_temp(value) {
     position: absolute;
     top: calc(1ex + 50px);
     right: 1ex;
+    z-index: 2;
+    pointer-events: auto;
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 4px;
     background: color-mix(in srgb, var(--hull-bg, transparent) 80%, transparent);
-    padding: 6px 8px;
-    border-radius: var(--border-radius, 3pt);
-    backdrop-filter: blur(4px);
+    padding: 3px 5px;
+    border-radius: var(--border-radius, 6pt);
+    backdrop-filter: blur(2px);
   }
   .slider-wrapper {
     display: flex;
     place-items: center;
+    justify-content: var(--slider-justify, center);
     line-height: 1;
   }
   .temperature-slider input[type='range'] {

package/dist/convex-hull/TemperatureSlider.svelte.d.ts

@@ -1,4 +1,5 @@
-type $$ComponentProps = {
+import type { HTMLAttributes } from 'svelte/elements';
+type $$ComponentProps = HTMLAttributes<HTMLDivElement> & {
     available_temperatures: number[];
     temperature: number;
 };

package/dist/convex-hull/demo-temperature.d.ts

@@ -0,0 +1,6 @@
+import type { PhaseData } from './types';
+export declare const demo_temperatures: number[];
+type Composition = Record<string, number>;
+export declare function make_demo_phase(composition: Composition, seed: number, entropy_boost?: number): PhaseData;
+export declare function create_temp_ternary_entries_li_fe_o(): PhaseData[];
+export {};

package/dist/convex-hull/demo-temperature.js

@@ -0,0 +1,36 @@
+export const demo_temperatures = Array.from({ length: 13 }, (_, idx) => 300 + idx * 100);
+function seeded_random(seed) {
+    const x_val = Math.sin(seed * 9999) * 10000;
+    return x_val - Math.floor(x_val);
+}
+export function make_demo_phase(composition, seed, entropy_boost = 0) {
+    const n_elements = Object.keys(composition).length;
+    const energy = -0.3 * n_elements - seeded_random(seed) * 0.5;
+    const entropy_coef = 0.5 + n_elements * 0.3 + seeded_random(seed + 1) * 2 +
+        entropy_boost;
+    return {
+        composition,
+        energy,
+        temperatures: demo_temperatures,
+        free_energies: demo_temperatures.map((temp_kelvin) => energy + entropy_coef * temp_kelvin * 0.0001 -
+            0.00005 * temp_kelvin * Math.log(temp_kelvin)),
+    };
+}
+export function create_temp_ternary_entries_li_fe_o() {
+    return [
+        ...[`Li`, `Fe`, `O`].map((element, idx) => make_demo_phase({ [element]: 1 }, idx)),
+        ...[[`Li`, `Fe`], [`Li`, `O`], [`Fe`, `O`]].flatMap(([element_a, element_b], idx) => [0.33, 0.5, 0.67].flatMap((fraction, jdx) => [
+            make_demo_phase({ [element_a]: fraction, [element_b]: 1 - fraction }, 100 + idx * 10 + jdx),
+            make_demo_phase({ [element_a]: fraction, [element_b]: 1 - fraction }, 200 + idx * 10 + jdx, 3),
+        ])),
+        ...[
+            { Li: 0.33, Fe: 0.33, O: 0.34 },
+            { Li: 0.5, Fe: 0.25, O: 0.25 },
+            { Li: 0.25, Fe: 0.5, O: 0.25 },
+            { Li: 0.25, Fe: 0.25, O: 0.5 },
+        ].flatMap((composition, idx) => [
+            make_demo_phase(composition, 300 + idx),
+            make_demo_phase(composition, 400 + idx, 4),
+        ]),
+    ];
+}

package/dist/convex-hull/gas-thermodynamics.js

@@ -146,7 +146,8 @@ export function compute_gas_chemical_potential(provider, gas, T, P) {
     // μ_per_atom(T, P) = μ°_per_atom(T) + k_B·T·ln(P/P₀) / num_atoms
     // The RT·ln(P) term must be divided by num_atoms to match PIRO's per-atom convention
     const num_atoms = GAS_NUM_ATOMS[gas];
-    return mu_standard + (R_EV_PER_K * T * Math.log(effective_P / P_REF)) / num_atoms;
+    return mu_standard +
+        (R_EV_PER_K * T * Math.log(effective_P / P_REF)) / num_atoms;
 }
 // Compute chemical potential per atom of a specific element from a gas
 // Since compute_gas_chemical_potential returns per-atom of gas molecule,
@@ -178,7 +179,10 @@ export function analyze_gas_data(entries, config) {
         };
     }
     // Get element-to-gas mapping
-    const element_to_gas = { ...DEFAULT_ELEMENT_TO_GAS, ...config.element_to_gas };
+    const element_to_gas = {
+        ...DEFAULT_ELEMENT_TO_GAS,
+        ...config.element_to_gas,
+    };
     // Find all elements in the chemical system
     const all_elements = new Set();
     for (const entry of entries) {
@@ -226,7 +230,10 @@ export function get_effective_pressures(config) {
 // This shifts the formation energy based on the gas atmosphere.
 export function compute_gas_correction(entry, config, T, pressures) {
     const provider = config.provider ?? get_default_gas_provider();
-    const element_to_gas = { ...DEFAULT_ELEMENT_TO_GAS, ...config.element_to_gas };
+    const element_to_gas = {
+        ...DEFAULT_ELEMENT_TO_GAS,
+        ...config.element_to_gas,
+    };
     const enabled_gases = new Set(config.enabled_gases ?? []);
     let correction = 0;
     const n_atoms = count_atoms_in_composition(entry.composition);
@@ -280,10 +287,14 @@ export function apply_gas_corrections(entries, config, T) {
         // If no correction needed, return entry unchanged
         if (Math.abs(correction) < 1e-12)
             return entry;
-        // Apply correction to energy
+        // Apply correction to energy (update both energy and energy_per_atom
+        // so downstream formation energy calculations use the corrected value)
+        // Both fields store per-atom values, and correction is also per-atom
+        const corrected_energy = entry.energy + correction;
         return {
             ...entry,
-            energy: entry.energy + correction,
+            energy: corrected_energy,
+            energy_per_atom: corrected_energy,
         };
     });
 }

package/dist/convex-hull/helpers.d.ts

@@ -1,5 +1,6 @@
-import type { D3InterpolateName } from '../colors';
+import { type D3InterpolateName } from '../colors';
 import type { EnergyModeInfo } from './';
+import type { ElementSymbol } from '../element';
 import type { ConvexHullConfig, GasAnalysis, GasThermodynamicsConfig, HighlightStyle, MarkerSymbol, PhaseData } from './types';
 import { DEFAULT_GAS_TEMP } from './types';
 export { DEFAULT_GAS_TEMP };
@@ -86,3 +87,8 @@ export declare function get_gas_corrected_entries(entries: PhaseData[], gas_conf
     analysis: GasAnalysis;
     merged_config: GasThermodynamicsConfig | undefined;
 };
+export declare function get_entry_label(entry: {
+    reduced_formula?: string;
+    name?: string;
+    composition: Record<string, number>;
+}, elements?: ElementSymbol[]): string;

package/dist/convex-hull/helpers.js

@@ -1,7 +1,7 @@
+import { get_d3_interpolator } from '../colors';
 import { ELEM_SYMBOL_TO_NAME } from '../composition';
 import { format_fractional, format_num, symbol_map } from '../labels';
 import { scaleSequential } from 'd3-scale';
-import * as d3_sc from 'd3-scale-chromatic';
 import { symbol } from 'd3-shape';
 import { analyze_gas_data as _analyze_gas_data, apply_gas_corrections as _apply_gas_corrections, } from './gas-thermodynamics';
 import { DEFAULT_GAS_TEMP, is_unary_entry } from './types';
@@ -18,9 +18,7 @@ export function get_energy_color_scale(color_mode, color_scale, plot_entries) {
     const lo = Math.min(...hull_distances);
     const hi_raw = Math.max(...hull_distances, 0.1);
     const hi = Math.max(hi_raw, lo + 1e-6);
-    // Cast needed: d3-scale-chromatic module has non-interpolator exports (e.g. `default`)
-    const interpolator = d3_sc[color_scale] ||
-        d3_sc.interpolateViridis;
+    const interpolator = get_d3_interpolator(color_scale);
     return scaleSequential(interpolator).domain([lo, hi]);
 }
 // Point color resolver (shared)
@@ -59,7 +57,8 @@ export function calc_max_hull_dist_in_data(processed_entries) {
     const hull_distances = processed_entries
         .map((e) => e.e_above_hull)
         .filter((v) => typeof v === `number` && Number.isFinite(v));
-    const max_val = (hull_distances.length ? Math.max(...hull_distances) : 0) + 0.001;
+    const max_val = (hull_distances.length ? Math.max(...hull_distances) : 0) +
+        0.001;
     return Math.max(0.1, max_val);
 }
 // Smart threshold for showing unstable entries based on entry count.
@@ -89,8 +88,9 @@ export function build_entry_tooltip_text(entry) {
             const fractions = Object.entries(entry.composition)
                 .filter(([, amt]) => amt > 0)
                 .map(([el, amt]) => `${el}: ${format_fractional(amt / total)}`);
-            if (fractions.length > 1)
+            if (fractions.length > 1) {
                 text += `Composition: ${fractions.join(`, `)}\n`;
+            }
         }
     }
     if (entry.e_above_hull !== undefined) {
@@ -122,7 +122,8 @@ export function find_hull_entry_at_mouse(canvas, event, plot_entries, project_po
             continue;
         const projected = project_point(entry.x, entry.y, entry.z);
         const distance = Math.hypot(mouse_x - projected.x, mouse_y - projected.y);
-        const base = entry.size ?? ((entry.is_stable || entry.e_above_hull === 0) ? 6 : 4);
+        const base = entry.size ??
+            ((entry.is_stable || entry.e_above_hull === 0) ? 6 : 4);
         if (distance < base * container_scale + 5)
             return entry;
     }
@@ -266,11 +267,13 @@ function select_group_energy_metric(polymorphs) {
         return `e_form_per_atom`;
     }
     // Try energy_per_atom (either direct field or computed from total energy)
-    if (polymorphs.every((entry) => is_finite(entry.energy_per_atom) || compute_energy_per_atom(entry) !== null))
+    if (polymorphs.every((entry) => is_finite(entry.energy_per_atom) ||
+        compute_energy_per_atom(entry) !== null))
         return `energy_per_atom`;
     // Last resort: e_above_hull (will fail to differentiate stable polymorphs with e_above_hull=0)
-    if (polymorphs.every((entry) => is_finite(entry.e_above_hull)))
+    if (polymorphs.every((entry) => is_finite(entry.e_above_hull))) {
         return `e_above_hull`;
+    }
     return null; // No valid metric available for this group
 }
 // Pre-compute polymorph statistics for all entries at once (O(n²) but done once)
@@ -444,7 +447,10 @@ export function analyze_temperature_data(entries) {
         .filter(entry_has_temp_data)
         .flatMap((entry) => entry.temperatures ?? []);
     const available_temperatures = [...new Set(valid_temps)].sort((a, b) => a - b);
-    return { has_temp_data: available_temperatures.length > 0, available_temperatures };
+    return {
+        has_temp_data: available_temperatures.length > 0,
+        available_temperatures,
+    };
 }
 // Check if an entry has valid temperature-dependent data (matching array lengths, non-empty)
 function entry_has_temp_data(entry) {
@@ -455,15 +461,17 @@ function entry_has_temp_data(entry) {
 }
 // Check if entry has data at exact temperature T
 export function entry_has_temperature(entry, T) {
-    return entry_has_temp_data(entry) && (entry.temperatures?.includes(T) ?? false);
+    return entry_has_temp_data(entry) &&
+        (entry.temperatures?.includes(T) ?? false);
 }
 // Get energy at temperature T (throws if T not found - validate with entry_has_temperature first)
 export function get_energy_at_temperature(entry, T) {
     const temps = entry.temperatures ?? [];
     const energies = entry.free_energies ?? [];
     const idx = temps.indexOf(T);
-    if (idx === -1)
+    if (idx === -1) {
         throw new Error(`Temperature ${T}K not found in entry temperatures`);
+    }
     return energies[idx];
 }
 // Find bracketing temperatures for interpolation (T_low < T < T_high)
@@ -532,14 +540,21 @@ export function filter_entries_at_temperature(entries, T, options = {}) {
         if (!entry_has_temp_data(entry))
             return [entry];
         // Exact temperature match - use G(T)
+        // Set both energy and energy_per_atom so downstream formation energy
+        // calculations use the temperature-dependent value (not stale 0K energy_per_atom)
         if (entry_has_temperature(entry, T)) {
-            return [{ ...entry, energy: get_energy_at_temperature(entry, T) }];
+            // free_energies stores per-atom values (E_0K/atom + F_vib/atom),
+            // so energy is already per-atom — set both fields to the same value
+            const energy = get_energy_at_temperature(entry, T);
+            return [{ ...entry, energy, energy_per_atom: energy }];
         }
         // Try interpolation if enabled
         if (interpolate) {
             const energy = interpolate_energy_at_temperature(entry, T, max_interpolation_gap);
-            if (energy !== null)
-                return [{ ...entry, energy }];
+            if (energy !== null) {
+                // interpolated energy is also per-atom (interpolated from per-atom free_energies)
+                return [{ ...entry, energy, energy_per_atom: energy }];
+            }
         }
         // Exclude entry (has temp data but can't get energy at T)
         return [];
@@ -596,3 +611,18 @@ export function get_gas_corrected_entries(entries, gas_config, gas_pressures, te
         merged_config,
     };
 }
+// Derive a display label for a convex hull entry, falling back to composition
+// when reduced_formula and name are both missing.
+export function get_entry_label(entry, elements) {
+    if (entry.reduced_formula)
+        return entry.reduced_formula;
+    if (entry.name)
+        return entry.name;
+    let pairs = Object.entries(entry.composition).filter(([, amt]) => amt > 0);
+    if (elements) {
+        pairs = pairs.sort(([el1], [el2]) => elements.indexOf(el1) - elements.indexOf(el2));
+    }
+    return pairs
+        .map(([el, amt]) => Math.abs(amt - 1) < 1e-6 ? el : `${el}${format_num(amt, `.2~`)}`)
+        .join(``);
+}

package/dist/convex-hull/index.d.ts

@@ -1,7 +1,7 @@
 import type { D3InterpolateName } from '../colors';
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
-import type { ConvexHullConfig, ConvexHullControlsType, GasSpecies, GasThermodynamicsConfig, HighlightStyle, HoverData3D, PhaseData, PhaseStats } from './types';
+import type { ConvexHullConfig, ConvexHullControlsType, GasSpecies, GasThermodynamicsConfig, HighlightStyle, HoverData3D, HullFaceColorMode, PhaseData, PhaseStats } from './types';
 export * from './barycentric-coords';
 export { default as ConvexHull } from './ConvexHull.svelte';
 export { default as ConvexHull2D } from './ConvexHull2D.svelte';
@@ -11,6 +11,7 @@ export { default as ConvexHullControls } from './ConvexHullControls.svelte';
 export { default as ConvexHullInfoPane } from './ConvexHullInfoPane.svelte';
 export { default as ConvexHullStats } from './ConvexHullStats.svelte';
 export { default as ConvexHullTooltip } from './ConvexHullTooltip.svelte';
+export * from './demo-temperature';
 export * from './gas-thermodynamics';
 export { default as GasPressureControls } from './GasPressureControls.svelte';
 export * from './helpers';
@@ -76,7 +77,20 @@ export interface BaseConvexHullProps<AnyDimEntry = PhaseData> extends Omit<HTMLA
 export interface Hull3DProps {
     show_hull_faces?: boolean;
     hull_face_opacity?: number;
+    hull_face_color_mode?: HullFaceColorMode;
+    element_colors?: Record<string, string>;
+    gizmo?: boolean | ConvexHullGizmoOptions;
 }
+export type GizmoPlacement = `top-right` | `bottom-right` | `top-left` | `bottom-left`;
+export type ConvexHullGizmoOptions = Record<string, unknown> & {
+    placement?: GizmoPlacement;
+    size?: number;
+    background?: {
+        enabled?: boolean;
+        color?: number;
+        opacity?: number;
+    };
+};
 export interface MergedCHConfig {
     controls: ConvexHullControlsType;
     config: ConvexHullConfig;

package/dist/convex-hull/index.js

@@ -7,6 +7,7 @@ export { default as ConvexHullControls } from './ConvexHullControls.svelte';
 export { default as ConvexHullInfoPane } from './ConvexHullInfoPane.svelte';
 export { default as ConvexHullStats } from './ConvexHullStats.svelte';
 export { default as ConvexHullTooltip } from './ConvexHullTooltip.svelte';
+export * from './demo-temperature';
 export * from './gas-thermodynamics';
 export { default as GasPressureControls } from './GasPressureControls.svelte';
 export * from './helpers';