@jjlmoya/utils-chrono 1.2.0

package/src/tool/watch-accuracy-tracker/utils.ts

@@ -0,0 +1,99 @@
+export function formatDrift(seconds: number): string {
+  const absSec = Math.abs(seconds);
+  const sign = seconds >= 0 ? '+' : '-';
+  if (absSec < 60) {
+    return `${sign}${absSec.toFixed(1)}s`;
+  }
+  const mins = Math.floor(absSec / 60);
+  const secs = Math.round(absSec % 60);
+  if (mins < 60) {
+    return `${sign}${mins}m ${secs}s`;
+  }
+  const hrs = Math.floor(mins / 60);
+  const remMins = mins % 60;
+  return `${sign}${hrs}h ${remMins}m`;
+}
+
+export function calculateIntervalRate(
+  currentOffset: number,
+  prevOffset: number,
+  currentTime: string,
+  prevTime: string
+): number | null {
+  const timeDiff = new Date(currentTime).getTime() - new Date(prevTime).getTime();
+  const daysDiff = timeDiff / (1000 * 60 * 60 * 24);
+  if (daysDiff > 0.01) {
+    return (currentOffset - prevOffset) / daysDiff;
+  }
+  return null;
+}
+
+export function calculateAverageRate(
+  firstOffset: number,
+  lastOffset: number,
+  firstTime: string,
+  lastTime: string
+): number | null {
+  const overallTimeDiff = new Date(lastTime).getTime() - new Date(firstTime).getTime();
+  const overallDays = overallTimeDiff / (1000 * 60 * 60 * 24);
+  if (overallDays > 0.01) {
+    return (lastOffset - firstOffset) / overallDays;
+  }
+  return null;
+}
+
+export function getPrecisionStatus(
+  avgRate: number,
+  ui: Record<string, string>
+): { text: string; cssClass: string } {
+  const absRate = Math.abs(avgRate);
+  if (absRate <= 2) {
+    return {
+      text: ui.coscExcellent || 'Rolex Superlative',
+      cssClass: 'stat-value status-superlative'
+    };
+  }
+  if (absRate <= 6) {
+    return {
+      text: ui.coscExcellent || 'COSC Excellent',
+      cssClass: 'stat-value status-excellent'
+    };
+  }
+  if (absRate > 20) {
+    return {
+      text: ui.needsService || 'Needs Service',
+      cssClass: 'stat-value status-service'
+    };
+  }
+  return {
+    text: ui.good || 'Good',
+    cssClass: 'stat-value status-good'
+  };
+}
+
+export function getTernaryDriftClass(rate: number): string {
+  if (rate > 0) {
+    return 'drift-val ahead';
+  }
+  if (rate < 0) {
+    return 'drift-val behind';
+  }
+  return 'drift-val neutral';
+}
+
+export function getExplanationForRate(avgRate: number): string {
+  const absRate = Math.abs(avgRate);
+  if (absRate <= 2) {
+    return 'Rolex Superlative: Your watch is running with exceptional precision, matching Rolex\'s Superlative Chronometer standards (±2 s/d). This is outstanding timekeeping.';
+  }
+  if (absRate <= 6) {
+    return 'COSC Chronometer: Excellent precision, within official Swiss Chronometer standards (-4 to +6 s/d). Your watch performs exceptionally well.';
+  }
+  if (absRate <= 10) {
+    return 'Excellent: Excellent performance. Gaining or losing under 10 seconds a day keeps your timepiece highly accurate for everyday use.';
+  }
+  if (absRate <= 20) {
+    return 'Good: Good everyday timekeeping. Standard mechanical movements are typically regulated within this range.';
+  }
+  return 'Needs Service: Significant rate deviation detected. Your watch might be magnetized, need regulation, or require a movement service (cleaning and oiling).';
+}

package/src/tool/watch-accuracy-tracker/watch-accuracy-tracker.css

@@ -0,0 +1,564 @@
+:root {
+  --color-success: #10b981;
+  --color-success-hover: #059669;
+  --color-success-light: #34d399;
+  --color-danger: #ef4444;
+  --color-info: #60a5fa;
+  --color-warning: #f87171;
+  --color-white: #fff;
+  --color-success-bg: rgba(16, 185, 129, 0.05);
+  --color-chart-bg: #0f172a;
+  --color-accent-bg: rgba(244, 63, 94, 0.05);
+}
+
+.watch-tracker-wrapper {
+  display: flex;
+  flex-direction: column;
+  gap: 2rem;
+  color: var(--text-base);
+  width: 100%;
+}
+
+.tool-main-card {
+  background: var(--bg-surface);
+  border: 1px solid var(--border-color);
+  border-radius: 1rem;
+  padding: 2rem;
+  display: flex;
+  flex-direction: column;
+  gap: 2rem;
+  box-shadow: 0 4px 20px -2px rgba(0, 0, 0, 0.2);
+}
+
+.tabs-header {
+  display: flex;
+  gap: 0.5rem;
+  background: var(--bg-page);
+  padding: 0.35rem;
+  border-radius: 0.75rem;
+  border: 1px solid var(--border-color);
+  max-width: fit-content;
+}
+
+.tab-btn {
+  background: transparent;
+  border: none;
+  color: var(--text-muted);
+  padding: 0.6rem 1.25rem;
+  border-radius: 0.5rem;
+  font-size: 0.9375rem;
+  font-weight: 600;
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.tab-btn:hover {
+  color: var(--text-base);
+  background: rgba(255, 255, 255, 0.04);
+}
+
+.tab-btn.active {
+  color: var(--accent);
+  background: rgba(244, 63, 94, 0.1);
+}
+
+.tab-content {
+  display: none;
+}
+
+.tab-content.active {
+  display: block;
+  animation: fade-in 0.25s ease-out;
+}
+
+@keyframes fade-in {
+  from {
+    opacity: 0;
+    transform: translateY(4px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.predictor-grid {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 2rem;
+  margin-bottom: 2rem;
+}
+
+@media (min-width: 768px) {
+  .predictor-grid {
+    grid-template-columns: 1fr 1fr;
+  }
+}
+
+.tracker-layout {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 2rem;
+}
+
+@media (min-width: 992px) {
+  .tracker-layout {
+    grid-template-columns: 4fr 5fr;
+  }
+}
+
+.drift-predictor-section,
+.accuracy-tracker-section,
+.log-history-section {
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+}
+
+.history-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.history-header h4 {
+  margin: 0;
+  font-size: 1.1rem;
+  font-weight: 700;
+}
+
+.control-label {
+  display: block;
+  font-size: 0.875rem;
+  font-weight: 600;
+  color: var(--text-muted);
+  margin-bottom: 0.5rem;
+}
+
+.form-control {
+  width: 100%;
+  background: var(--bg-page);
+  border: 1px solid var(--border-color);
+  color: var(--text-base);
+  padding: 0.75rem 1rem;
+  border-radius: 0.5rem;
+  font-size: 0.9375rem;
+  outline: none;
+  transition: all 0.2s ease;
+}
+
+.form-control:focus {
+  border-color: var(--accent);
+  box-shadow: 0 0 0 2px rgba(244, 63, 94, 0.15);
+}
+
+select.form-control {
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  background: var(--bg-page) url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f43f5e' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 1rem center/1rem;
+  padding-right: 2.75rem;
+  cursor: pointer;
+}
+
+.input-with-unit {
+  position: relative;
+  display: flex;
+  align-items: center;
+}
+
+.input-with-unit .form-control {
+  padding-right: 3rem;
+}
+
+.unit-badge {
+  position: absolute;
+  right: 1rem;
+  font-size: 0.8125rem;
+  font-weight: 700;
+  color: var(--accent);
+}
+
+.presets-container {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.5rem;
+  margin-top: 0.75rem;
+}
+
+.preset-btn {
+  background: var(--bg-page);
+  border: 1px solid var(--border-color);
+  color: var(--text-muted);
+  padding: 0.35rem 0.75rem;
+  border-radius: 0.375rem;
+  font-size: 0.8125rem;
+  font-weight: 600;
+  cursor: pointer;
+  transition: all 0.15s ease;
+}
+
+.preset-btn:hover {
+  border-color: var(--accent);
+  color: var(--accent);
+  background: rgba(244, 63, 94, 0.05);
+}
+
+.projection-table-wrapper {
+  overflow-x: auto;
+  border: 1px solid var(--border-color);
+  border-radius: 0.5rem;
+  background: var(--bg-page);
+}
+
+.projection-table,
+.history-table {
+  width: 100%;
+  border-collapse: collapse;
+  text-align: left;
+  font-size: 0.875rem;
+}
+
+.projection-table th,
+.projection-table td,
+.history-table th,
+.history-table td {
+  padding: 0.75rem 1rem;
+  border-bottom: 1px solid var(--border-color);
+}
+
+.projection-table th,
+.history-table th {
+  background: rgba(255, 255, 255, 0.02);
+  font-weight: 600;
+  color: var(--text-muted);
+}
+
+.drift-val {
+  font-weight: 700;
+  font-size: 0.9375rem;
+}
+
+.drift-val.ahead {
+  color: var(--color-success);
+}
+
+.drift-val.behind {
+  color: var(--color-danger);
+}
+
+.drift-val.neutral {
+  color: var(--text-muted);
+}
+
+.standards-section {
+  border-top: 1px solid var(--border-color);
+  padding-top: 1.5rem;
+}
+
+.standards-section h4,
+.projections-section h4 {
+  margin: 0 0 1rem;
+  font-size: 1.1rem;
+  font-weight: 700;
+}
+
+.standards-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
+  gap: 1rem;
+}
+
+.standard-card {
+  background: var(--bg-page);
+  border: 1px solid var(--border-color);
+  border-radius: 0.75rem;
+  padding: 1rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+  transition: all 0.2s ease;
+}
+
+.std-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.std-name {
+  font-size: 0.8125rem;
+  font-weight: 600;
+  color: var(--text-muted);
+}
+
+.std-status {
+  font-size: 0.6875rem;
+  font-weight: 800;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+}
+
+.std-tolerance {
+  font-size: 1rem;
+  font-weight: 700;
+}
+
+.standard-card.passed {
+  border-color: var(--color-success);
+  background: var(--color-success-bg);
+}
+
+.standard-card.passed .std-status {
+  color: var(--color-success);
+}
+
+.standard-card.failed {
+  border-color: var(--border-color);
+  opacity: 0.5;
+}
+
+.standard-card.failed .std-status {
+  color: var(--text-muted);
+}
+
+.watch-row-controls {
+  display: flex;
+  gap: 0.5rem;
+  width: 100%;
+}
+
+.watch-row-controls select {
+  flex: 1;
+}
+
+#delete-watch-btn {
+  padding: 0.75rem;
+  aspect-ratio: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.input-with-button {
+  display: flex;
+  gap: 0.5rem;
+}
+
+.btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.5rem;
+  border: none;
+  font-weight: 600;
+  font-size: 0.875rem;
+  padding: 0.75rem 1.25rem;
+  border-radius: 0.5rem;
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.btn-sm {
+  padding: 0.4rem 0.75rem;
+  font-size: 0.8125rem;
+  border-radius: 0.375rem;
+}
+
+.btn-full {
+  width: 100%;
+}
+
+.btn-primary {
+  background: var(--accent);
+  color: var(--color-white);
+}
+
+.btn-primary:hover {
+  background: #e11d48;
+}
+
+.btn-success {
+  background: var(--color-success);
+  color: var(--color-white);
+}
+
+.btn-success:hover {
+  background: var(--color-success-hover);
+}
+
+.btn-danger {
+  background: rgba(239, 68, 68, 0.15);
+  border: 1px solid rgba(239, 68, 68, 0.3);
+  color: var(--color-danger);
+}
+
+.btn-danger:hover {
+  background: var(--color-danger);
+  color: var(--color-white);
+}
+
+.btn-text {
+  background: transparent;
+  border: none;
+  color: var(--accent);
+  font-size: 0.8125rem;
+  font-weight: 600;
+  cursor: pointer;
+}
+
+.btn-text:hover {
+  text-decoration: underline;
+}
+
+.watch-selection-panel {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+  background: rgba(255, 255, 255, 0.01);
+  padding: 1rem;
+  border-radius: 0.75rem;
+  border: 1px solid var(--border-color);
+}
+
+.log-form-section {
+  display: flex;
+  flex-direction: column;
+  gap: 1.25rem;
+  transition: all 0.2s ease;
+}
+
+.log-form-section h4 {
+  margin: 0;
+  font-size: 1.1rem;
+  font-weight: 700;
+}
+
+.log-form-section.disabled-form {
+  opacity: 0.25;
+  pointer-events: none;
+}
+
+.form-grid {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 1rem;
+}
+
+@media (min-width: 768px) {
+  .form-grid {
+    grid-template-columns: 1fr 1fr 1fr;
+  }
+}
+
+.label-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.stats-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 1rem;
+}
+
+.stat-box {
+  background: var(--bg-page);
+  border: 1px solid var(--border-color);
+  padding: 1rem;
+  border-radius: 0.75rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.25rem;
+}
+
+.stat-label {
+  font-size: 0.75rem;
+  font-weight: 600;
+  color: var(--text-muted);
+  text-transform: uppercase;
+}
+
+.stat-value {
+  font-size: 1.125rem;
+  font-weight: 700;
+}
+
+.status-superlative {
+  color: var(--color-success);
+}
+
+.status-excellent {
+  color: var(--color-success-light);
+}
+
+.status-good {
+  color: var(--color-info);
+}
+
+.status-service {
+  color: var(--color-warning);
+}
+
+.no-logs-msg {
+  padding: 2rem;
+  text-align: center;
+  border: 1px dashed var(--border-color);
+  border-radius: 0.75rem;
+  color: var(--text-muted);
+  font-size: 0.875rem;
+}
+
+.no-logs-msg p {
+  margin: 0;
+}
+
+.table-wrapper {
+  border: 1px solid var(--border-color);
+  border-radius: 0.5rem;
+  background: var(--bg-page);
+  max-height: 300px;
+  overflow-y: auto;
+}
+
+.header-actions-row {
+  display: flex;
+  gap: 0.5rem;
+}
+
+.chart-card-wrapper {
+  background: var(--color-chart-bg);
+  padding: 1rem;
+  border-radius: 0.75rem;
+  border: 1px solid var(--border-color);
+  margin-bottom: 1rem;
+}
+
+.chart-card-wrapper canvas {
+  width: 100%;
+  height: 180px;
+  display: block;
+}
+
+.explanation-box {
+  background: var(--color-accent-bg);
+  border: 1px solid var(--accent);
+  border-radius: 0.5rem;
+  padding: 1rem;
+  font-size: 0.875rem;
+  color: var(--text-base);
+  line-height: 1.5;
+}
+
+.pos-badge {
+  background: rgba(255, 255, 255, 0.08);
+  border: 1px solid var(--border-color);
+  color: var(--text-muted);
+  font-size: 0.7rem;
+  font-weight: 700;
+  padding: 0.2rem 0.4rem;
+  border-radius: 0.3rem;
+  margin-left: 0.5rem;
+  text-transform: uppercase;
+}

package/src/tool/watch-savings-planner/bibliography.astro

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

package/src/tool/watch-savings-planner/bibliography.ts

@@ -0,0 +1,8 @@
+import type { BibliographyEntry } from '../../types';
+
+export const bibliography: BibliographyEntry[] = [
+  {
+    name: 'Personal Finance for Watch Enthusiasts',
+    url: 'https://marketing.yourasset.com/blog/en/blog/the-complete-guide-to-luxury-watch-financing',
+  },
+];