@jjlmoya/utils-science 1.33.0 → 1.35.0

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jjlmoya/utils-science",
-    "version": "1.33.0",
+    "version": "1.35.0",
     "type": "module",
     "main": "./src/index.ts",
     "types": "./src/index.ts",

package/src/category/index.ts

@@ -15,10 +15,12 @@ import { phaseDiagramCriticalPoints } from '../tool/phase-diagram-critical-point
 import { twinParadoxVisualizer } from '../tool/twin-paradox-visualizer/index';
 import { mandelbrotFractal } from '../tool/mandelbrot-fractal/index';
 import { planetAtmosphereSurvival } from '../tool/planet-atmosphere-survival/index';
+import { threeBodyProblem } from '../tool/three-body-problem/index';
+import { rocheLimitSatelliteDisruption } from '../tool/roche-limit-satellite-disruption/index';
 
 export const scienceCategory: ScienceCategoryEntry = {
   icon: 'mdi:flask',
-  tools: [colonyCounter, asteroidImpact, microwaveDetector, simulationProbability, cellularRenewal, cosmicInflation, temperatureTimeline, lorenzAttractor, stellarHabitabilityZone, radioactiveDecay, naturalSelectionDrift, entropySecondLaw, phaseDiagramCriticalPoints, twinParadoxVisualizer, mandelbrotFractal, planetAtmosphereSurvival],
+  tools: [colonyCounter, asteroidImpact, microwaveDetector, simulationProbability, cellularRenewal, cosmicInflation, temperatureTimeline, lorenzAttractor, stellarHabitabilityZone, radioactiveDecay, naturalSelectionDrift, entropySecondLaw, phaseDiagramCriticalPoints, twinParadoxVisualizer, mandelbrotFractal, planetAtmosphereSurvival, threeBodyProblem, rocheLimitSatelliteDisruption],
   i18n: {
     es: () => import('./i18n/es').then((m) => m.content),
     en: () => import('./i18n/en').then((m) => m.content),

package/src/entries.ts

@@ -15,6 +15,8 @@ export { phaseDiagramCriticalPoints } from './tool/phase-diagram-critical-points
 export { twinParadoxVisualizer } from './tool/twin-paradox-visualizer/entry';
 export { mandelbrotFractal } from './tool/mandelbrot-fractal/entry';
 export { planetAtmosphereSurvival } from './tool/planet-atmosphere-survival/entry';
+export { threeBodyProblem } from './tool/three-body-problem/entry';
+export { rocheLimitSatelliteDisruption } from './tool/roche-limit-satellite-disruption/entry';
 export { scienceCategory } from './category';
 import { asteroidImpact } from './tool/asteroid-impact/entry';
 import { cellularRenewal } from './tool/cellular-renewal/entry';
@@ -32,4 +34,6 @@ import { phaseDiagramCriticalPoints } from './tool/phase-diagram-critical-points
 import { twinParadoxVisualizer } from './tool/twin-paradox-visualizer/entry';
 import { mandelbrotFractal } from './tool/mandelbrot-fractal/entry';
 import { planetAtmosphereSurvival } from './tool/planet-atmosphere-survival/entry';
-export const ALL_ENTRIES = [asteroidImpact, cellularRenewal, colonyCounter, microwaveDetector, simulationProbability, cosmicInflation, temperatureTimeline, lorenzAttractor, stellarHabitabilityZone, radioactiveDecay, naturalSelectionDrift, entropySecondLaw, phaseDiagramCriticalPoints, twinParadoxVisualizer, mandelbrotFractal, planetAtmosphereSurvival];
+import { threeBodyProblem } from './tool/three-body-problem/entry';
+import { rocheLimitSatelliteDisruption } from './tool/roche-limit-satellite-disruption/entry';
+export const ALL_ENTRIES = [asteroidImpact, cellularRenewal, colonyCounter, microwaveDetector, simulationProbability, cosmicInflation, temperatureTimeline, lorenzAttractor, stellarHabitabilityZone, radioactiveDecay, naturalSelectionDrift, entropySecondLaw, phaseDiagramCriticalPoints, twinParadoxVisualizer, mandelbrotFractal, planetAtmosphereSurvival, threeBodyProblem, rocheLimitSatelliteDisruption];

package/src/index.ts

@@ -16,6 +16,8 @@ export { PHASE_DIAGRAM_CRITICAL_POINTS_TOOL } from './tool/phase-diagram-critica
 export { TWIN_PARADOX_VISUALIZER_TOOL } from './tool/twin-paradox-visualizer/index';
 export { MANDELBROT_FRACTAL_TOOL } from './tool/mandelbrot-fractal/index';
 export { PLANET_ATMOSPHERE_SURVIVAL_TOOL } from './tool/planet-atmosphere-survival/index';
+export { THREE_BODY_PROBLEM_TOOL } from './tool/three-body-problem/index';
+export { ROCHE_LIMIT_SATELLITE_DISRUPTION_TOOL } from './tool/roche-limit-satellite-disruption/index';
 
 export type {
   KnownLocale,

package/src/tests/locale_completeness.test.ts

@@ -18,7 +18,7 @@ describe('Locale Completeness Validation', () => {
     });
   });
 
-  it('all 16 tools registered', () => {
-    expect(ALL_TOOLS.length).toBe(16);
+  it('all 18 tools registered', () => {
+    expect(ALL_TOOLS.length).toBe(18);
   });
 });

package/src/tests/tool_validation.test.ts

@@ -4,8 +4,8 @@ import { scienceCategory } from '../data';
 
 describe('Tool Validation Suite', () => {
   describe('Library Registration', () => {
-    it('should have 16 tools in ALL_TOOLS', () => {
-      expect(ALL_TOOLS.length).toBe(16);
+    it('should have 18 tools in ALL_TOOLS', () => {
+      expect(ALL_TOOLS.length).toBe(18);
     });
 
     it('scienceCategory should be defined', () => {

package/src/tool/natural-selection-drift/component.astro

@@ -8,7 +8,7 @@ interface Props {
 const { ui } = Astro.props;
 ---
 
-<div class="ns-app">
+<div class="ns-app" data-alive-label={ui.aliveLabel} data-allele-default={ui.alleleDefault}>
   <section class="ns-card">
     <canvas id="simulation-canvas" class="ns-canvas"></canvas>
     <div class="ns-canvas-badge" id="alive-badge">0 {ui.aliveLabel}</div>
@@ -25,9 +25,19 @@ const { ui } = Astro.props;
 
     <section class="ns-alleles" id="allele-ranking" aria-label={ui.alleleCountsLabel}></section>
 
-    <aside class="ns-console" aria-label="Simulation controls">
+    <button class="ns-console-trigger" id="ns-console-trigger" aria-label={ui.controls} aria-expanded="false">
+      <svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M2 4h12M2 8h8M2 12h10" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>
+      {ui.controls}
+    </button>
+
+    <aside class="ns-console" id="ns-console" aria-label="Simulation controls">
       <div class="ns-console-header">
-        <span class="ns-console-kicker">{ui.evolutionConsole}</span>
+        <div class="ns-console-header-row">
+          <span class="ns-console-kicker">{ui.evolutionConsole}</span>
+          <button class="ns-console-close" id="ns-console-close" aria-label="Close controls">
+            <svg width="14" height="14" viewBox="0 0 14 14" fill="none" aria-hidden="true"><path d="M1 1l12 12M13 1L1 13" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>
+          </button>
+        </div>
         <h3>{ui.title}</h3>
       </div>
 
@@ -74,9 +84,10 @@ const { ui } = Astro.props;
   </section>
 </div>
 
-<script type="module" define:vars={{ ui }}>
-  import { createNaturalSelectionRuntime } from '/src/tool/natural-selection-drift/runtime';
+<script>
+  import { createNaturalSelectionRuntime } from './runtime';
 
+  const root = document.querySelector('.ns-app');
   createNaturalSelectionRuntime({
     populationInput: document.getElementById('population'),
     generationsInput: document.getElementById('generations'),
@@ -99,6 +110,26 @@ const { ui } = Astro.props;
     diversityScore: document.getElementById('diversity-score'),
     populationScore: document.getElementById('population-score'),
     alleleRanking: document.getElementById('allele-ranking'),
-    ui: { ...ui },
+    ui: {
+      aliveLabel: root?.dataset.aliveLabel ?? '',
+      alleleDefault: root?.dataset.alleleDefault ?? '',
+    },
   });
+
+  const trigger = document.getElementById('ns-console-trigger');
+  const closeBtn = document.getElementById('ns-console-close');
+  const console = document.getElementById('ns-console');
+
+  function openConsole() {
+    console?.classList.add('is-open');
+    trigger?.setAttribute('aria-expanded', 'true');
+  }
+
+  function closeConsole() {
+    console?.classList.remove('is-open');
+    trigger?.setAttribute('aria-expanded', 'false');
+  }
+
+  trigger?.addEventListener('click', openConsole);
+  closeBtn?.addEventListener('click', closeConsole);
 </script>

package/src/tool/natural-selection-drift/natural-selection-drift.css

@@ -427,3 +427,137 @@
     grid-template-columns: minmax(0, 1fr);
   }
 }
+
+.ns-console-trigger {
+  display: none;
+}
+
+.ns-console-header-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.5rem;
+}
+
+.ns-console-close {
+  display: none;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 28px;
+  border-radius: 50%;
+  border: 1px solid var(--ns-border);
+  background: var(--ns-panel);
+  color: var(--ns-muted);
+  cursor: pointer;
+  flex-shrink: 0;
+  transition: background 0.18s ease, color 0.18s ease;
+}
+
+.ns-console-close:hover {
+  background: rgba(239, 68, 68, 0.12);
+  color: #ef4444;
+}
+
+@media (max-width: 640px) {
+  .ns-console-trigger {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.5rem;
+    position: absolute;
+    left: clamp(16px, 4vw, 24px);
+    bottom: clamp(16px, 4vw, 24px);
+    z-index: 3;
+    padding: 0.6rem 1rem;
+    border-radius: 999px;
+    border: 1px solid rgba(255, 255, 255, 0.14);
+    background: rgba(2, 6, 23, 0.72);
+    backdrop-filter: blur(18px);
+    color: rgba(255, 255, 255, 0.9);
+    font-size: 0.78rem;
+    font-weight: 700;
+    letter-spacing: 0.06em;
+    text-transform: uppercase;
+    cursor: pointer;
+    transition: background 0.18s ease, transform 0.18s ease, opacity 0.18s ease;
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
+  }
+
+  .theme-light .ns-console-trigger {
+    background: rgba(255, 255, 255, 0.88);
+    border-color: rgba(148, 163, 184, 0.22);
+    color: #0f172a;
+    box-shadow: 0 8px 24px rgba(148, 163, 184, 0.22);
+  }
+
+  .ns-console-trigger:hover {
+    transform: translateY(-1px);
+  }
+
+  .ns-console-trigger[aria-expanded="true"] {
+    opacity: 0;
+    pointer-events: none;
+  }
+
+  .ns-console {
+    left: 0;
+    right: 0;
+    top: auto;
+    bottom: 0;
+    width: 100%;
+    border-radius: 24px 24px 0 0;
+    border-bottom: none;
+    padding: 1.25rem clamp(16px, 4vw, 24px) calc(clamp(16px, 4vw, 24px) + env(safe-area-inset-bottom, 0px));
+    transform: translateY(110%);
+    transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);
+    background: rgba(7, 9, 13, 0.88);
+    border-top: 1px solid rgba(255, 255, 255, 0.1);
+    backdrop-filter: blur(24px);
+    max-height: 80vh;
+    overflow-y: auto;
+    overscroll-behavior: contain;
+  }
+
+  .theme-light .ns-console {
+    background: rgba(255, 255, 255, 0.96);
+    border-top-color: rgba(148, 163, 184, 0.2);
+  }
+
+  .ns-console.is-open {
+    transform: translateY(0);
+  }
+
+  .ns-console-close {
+    display: inline-flex;
+  }
+
+  .ns-console::before {
+    content: "";
+    display: block;
+    width: 40px;
+    height: 4px;
+    border-radius: 999px;
+    background: rgba(255, 255, 255, 0.18);
+    margin: 0 auto 1rem;
+  }
+
+  .theme-light .ns-console::before {
+    background: rgba(15, 23, 42, 0.14);
+  }
+
+  .ns-alleles {
+    top: 72px;
+    right: clamp(12px, 3vw, 16px);
+    grid-template-columns: minmax(140px, 180px);
+  }
+
+  .ns-allele-chip {
+    padding: 0.28rem 0.4rem 0.28rem 0.6rem;
+    border-radius: 10px;
+  }
+
+  .ns-hud {
+    bottom: clamp(72px, 12vw, 96px);
+  }
+}
+

package/src/tool/roche-limit-satellite-disruption/bibliography.astro

@@ -0,0 +1,14 @@
+---
+import { Bibliography as SharedBibliography } from '@jjlmoya/utils-shared';
+import { rocheLimitSatelliteDisruption } from './index';
+import type { KnownLocale } from '../../types';
+
+interface Props {
+  locale?: KnownLocale;
+}
+
+const { locale = 'en' } = Astro.props;
+const content = await rocheLimitSatelliteDisruption.i18n[locale]?.();
+---
+
+{content && <SharedBibliography links={content.bibliography} />}

package/src/tool/roche-limit-satellite-disruption/bibliography.ts

@@ -0,0 +1,16 @@
+import type { BibliographyEntry } from '../../types';
+
+export const bibliography: BibliographyEntry[] = [
+  {
+    name: 'Murray, C. D. & Dermott, S. F. (1999). Solar System Dynamics. Cambridge University Press.',
+    url: 'https://www.cambridge.org/core/books/solar-system-dynamics/108745217E4A18190CBA340ED5E477A2',
+  },
+  {
+    name: 'NASA Solar System Exploration: Roche Limit and Saturn ring context.',
+    url: 'https://www.nasa.gov/solar-system/new-simulations-shed-light-on-origins-of-saturns-rings-and-icy-moons/',
+  },
+  {
+    name: 'Chandrasekhar, S. (1969). Ellipsoidal Figures of Equilibrium. Yale University Press.',
+    url: 'https://academic.oup.com/gji/article/21/1/103/729424',
+  },
+];

package/src/tool/roche-limit-satellite-disruption/component.astro

@@ -0,0 +1,97 @@
+---
+import './roche-limit-satellite-disruption-calculator.css';
+
+interface Props {
+  ui: Record<string, string>;
+}
+
+const { ui } = Astro.props;
+const uiData = JSON.stringify(ui);
+---
+
+<div class="roche-console" id="roche-console" data-ui={uiData}>
+  <div class="roche-status">
+    <strong id="roche-verdict">{ui.stable}</strong>
+    <span class="roche-distance-readout"><small>{ui.orbitDistance}</small><b id="roche-distance-output">-</b></span>
+  </div>
+
+  <section class="roche-visual" aria-label={ui.ringFormation}>
+    <div class="roche-orbit-stage">
+      <canvas id="roche-particle-canvas" class="roche-particle-canvas" aria-hidden="true"></canvas>
+      <svg class="roche-orbit-map" viewBox="0 0 560 560" role="img" aria-label={ui.rocheBoundary}>
+        <defs>
+          <radialGradient id="roche-planet-gradient" cx="42%" cy="35%">
+            <stop id="roche-planet-stop-a" offset="0%" stop-color="#f7efe2"></stop>
+            <stop id="roche-planet-stop-b" offset="42%" stop-color="#d19a66"></stop>
+            <stop id="roche-planet-stop-c" offset="100%" stop-color="#63425f"></stop>
+          </radialGradient>
+          <linearGradient id="roche-ring-gradient" x1="0" x2="1">
+            <stop offset="0%" stop-color="#7cd5ff"></stop>
+            <stop offset="48%" stop-color="#f8d66d"></stop>
+            <stop offset="100%" stop-color="#ff7f8a"></stop>
+          </linearGradient>
+        </defs>
+        <path class="roche-debris roche-debris-back" d="M 102 280 A 178 62 0 0 1 458 280"></path>
+        <path class="roche-debris roche-debris-back roche-debris-wide" d="M 66 280 A 214 74 0 0 1 494 280"></path>
+        <circle class="roche-boundary" id="roche-boundary" cx="280" cy="280" r="180"></circle>
+        <circle class="roche-orbit" id="roche-orbit" cx="280" cy="280" r="230"></circle>
+        <g id="roche-fragments"></g>
+        <circle class="roche-planet" id="roche-planet" cx="280" cy="280" r="88"></circle>
+        <path class="roche-debris roche-debris-front" d="M 458 280 A 178 62 0 0 1 102 280"></path>
+        <path class="roche-debris roche-debris-front roche-debris-wide" d="M 494 280 A 214 74 0 0 1 66 280"></path>
+        <g class="roche-moon" id="roche-moon">
+          <ellipse id="roche-moon-body" cx="0" cy="0" rx="22" ry="22"></ellipse>
+          <path id="roche-moon-scar" d="M -11 -13 C 5 -7 10 4 5 17"></path>
+        </g>
+        <text class="roche-map-label" x="280" y="512" id="roche-map-label">{ui.moonTrack}</text>
+      </svg>
+    </div>
+  </section>
+
+  <section class="roche-readouts" aria-label={ui.tidalStress}>
+    <div><span>{ui.activeLimit}</span><strong id="roche-active-limit">-</strong></div>
+    <div><span>{ui.safetyRatio}</span><strong id="roche-safety-ratio">-</strong></div>
+    <div><span>{ui.orbitalPeriod}</span><strong id="roche-period">-</strong></div>
+    <div><span>{ui.ringFormation}</span><strong id="roche-ring-progress">-</strong></div>
+  </section>
+
+  <section class="roche-controls" aria-label={ui.primaryBody}>
+    <div class="roche-field roche-picker" id="roche-primary-picker">
+      <span>{ui.primaryBody}</span>
+      <button class="roche-picker-trigger" type="button" id="roche-primary-trigger" aria-expanded="false">
+        <strong id="roche-primary-name">-</strong><small id="roche-primary-density">-</small><i aria-hidden="true"></i>
+      </button>
+      <div class="roche-picker-menu" id="roche-primary-menu" role="listbox"></div>
+    </div>
+
+    <div class="roche-field roche-picker" id="roche-satellite-picker">
+      <span>{ui.satelliteType}</span>
+      <button class="roche-picker-trigger" type="button" id="roche-satellite-trigger" aria-expanded="false">
+        <strong id="roche-satellite-name">-</strong><small id="roche-satellite-density">-</small><i aria-hidden="true"></i>
+      </button>
+      <div class="roche-picker-menu" id="roche-satellite-menu" role="listbox"></div>
+    </div>
+
+    <label class="roche-field roche-distance" for="roche-distance">
+      <span>{ui.orbitDistance}</span>
+      <input id="roche-distance" type="range" min="8000" max="260000" step="250" />
+    </label>
+
+    <div class="roche-button-row">
+      <button type="button" id="roche-close-pass">{ui.closePass}</button>
+      <button type="button" id="roche-reset">{ui.reset}</button>
+    </div>
+  </section>
+
+  <section class="roche-comparison" aria-label={ui.fluidLimit}>
+    <div class="roche-bar"><span>{ui.fluidLimit}</span><div><i id="roche-fluid-bar"></i></div><strong id="roche-fluid-limit">-</strong></div>
+    <div class="roche-bar"><span>{ui.rigidLimit}</span><div><i id="roche-rigid-bar"></i></div><strong id="roche-rigid-limit">-</strong></div>
+    <div class="roche-material">
+      <span id="roche-density">-</span>
+      <span id="roche-cohesion">-</span>
+      <span id="roche-radius">-</span>
+    </div>
+  </section>
+</div>
+
+<script src="./script.ts"></script>

package/src/tool/roche-limit-satellite-disruption/entry.ts

@@ -0,0 +1,28 @@
+import type { ScienceToolEntry } from '../../types';
+
+export const rocheLimitSatelliteDisruption: ScienceToolEntry = {
+  id: 'roche-limit-satellite-disruption',
+  icons: {
+    bg: 'mdi:orbit',
+    fg: 'mdi:moon-waning-crescent',
+  },
+  i18n: {
+    de: () => import('./i18n/de').then((m) => m.content),
+    en: () => import('./i18n/en').then((m) => m.content),
+    es: () => import('./i18n/es').then((m) => m.content),
+    fr: () => import('./i18n/fr').then((m) => m.content),
+    id: () => import('./i18n/id').then((m) => m.content),
+    it: () => import('./i18n/it').then((m) => m.content),
+    ja: () => import('./i18n/ja').then((m) => m.content),
+    ko: () => import('./i18n/ko').then((m) => m.content),
+    nl: () => import('./i18n/nl').then((m) => m.content),
+    pl: () => import('./i18n/pl').then((m) => m.content),
+    pt: () => import('./i18n/pt').then((m) => m.content),
+    ru: () => import('./i18n/ru').then((m) => m.content),
+    sv: () => import('./i18n/sv').then((m) => m.content),
+    tr: () => import('./i18n/tr').then((m) => m.content),
+    zh: () => import('./i18n/zh').then((m) => m.content),
+  },
+};
+
+export type { ToolLocaleContent } from '../../types';