@jjlmoya/utils-motor 1.10.0 → 1.12.0

package/src/tool/trailerTongueWeightCalculator/trailer-tongue-weight-calculator.css

@@ -0,0 +1,429 @@
+.ttw-tool {
+  --n-paper: #f8f4ec;
+  --n-surface: #fffdf8;
+  --n-surface-muted: #eee8dc;
+  --n-ink: #28241f;
+  --n-muted: #6e665c;
+  --n-line: #d8cfc1;
+  --n-accent: #b24a2f;
+  --n-accent-soft: #f2d4c8;
+  --n-load: #be6d2f;
+  --n-axle: #376b68;
+  --n-safe: #35735d;
+  --n-warn: #a96722;
+  --n-danger: #a23d36;
+  --n-shadow: #382619;
+
+  color: var(--n-ink);
+}
+
+:global(.theme-dark) .ttw-tool {
+  --n-paper: #1c1916;
+  --n-surface: #292521;
+  --n-surface-muted: #37312b;
+  --n-ink: #f6eee3;
+  --n-muted: #c7b9a9;
+  --n-line: #65594d;
+  --n-accent: #e18467;
+  --n-accent-soft: #60382e;
+  --n-load: #e3a060;
+  --n-axle: #7bb6ae;
+  --n-safe: #83c8a8;
+  --n-warn: #e4ad64;
+  --n-danger: #ed8d84;
+  --n-shadow: #000;
+}
+
+.ttw-surface {
+  overflow: hidden;
+  border: 1px solid var(--n-line);
+  border-radius: 1.5rem;
+  background: var(--n-paper);
+  box-shadow: 0 1.5rem 3rem var(--n-shadow);
+}
+
+.ttw-toolbar,
+.ttw-presets,
+.ttw-layout,
+.ttw-formula { padding: 1.2rem 1.4rem; }
+
+.ttw-toolbar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  border-bottom: 1px solid var(--n-line);
+  background: var(--n-surface);
+}
+
+.ttw-unit-switch {
+  display: inline-flex;
+  overflow: hidden;
+  border: 1px solid var(--n-line);
+  border-radius: 999px;
+}
+
+.ttw-unit-switch button,
+.ttw-reset {
+  border: 0;
+  background: transparent;
+  color: var(--n-muted);
+  cursor: pointer;
+  font: inherit;
+  font-size: 0.8rem;
+  font-weight: 800;
+  letter-spacing: 0.04em;
+  padding: 0.55rem 0.8rem;
+}
+
+.ttw-unit-switch button[aria-pressed="true"] {
+  background: var(--n-accent);
+  color: var(--n-surface);
+}
+.ttw-reset { color: var(--n-accent); }
+
+.ttw-reset:hover,
+.ttw-reset:focus-visible,
+.ttw-unit-switch button:focus-visible,
+.ttw-presets button:focus-visible {
+  outline: 3px solid var(--n-accent-soft);
+  outline-offset: 2px;
+}
+
+.ttw-presets {
+  display: grid;
+  grid-template-columns: 1fr repeat(3, minmax(0, 1fr));
+  gap: 0.6rem;
+  border-bottom: 1px solid var(--n-line);
+  background: var(--n-surface);
+}
+
+.ttw-presets-label,
+.ttw-overline {
+  color: var(--n-accent);
+  font-size: 0.72rem;
+  font-weight: 900;
+  letter-spacing: 0.12em;
+  text-transform: uppercase;
+}
+
+.ttw-presets-label { align-self: center; }
+
+.ttw-presets button {
+  min-width: 0;
+  border: 1px solid var(--n-line);
+  border-radius: 0.8rem;
+  padding: 0.7rem;
+  background: var(--n-paper);
+  color: var(--n-ink);
+  cursor: pointer;
+  text-align: left;
+}
+
+.ttw-presets button.is-active {
+  border-color: var(--n-accent);
+  background: var(--n-accent-soft);
+}
+.ttw-presets strong,
+.ttw-presets small { display: block; }
+.ttw-presets small {
+  margin-top: 0.2rem;
+  color: var(--n-muted);
+  font-size: 0.75rem;
+}
+
+.ttw-layout {
+  display: grid;
+  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
+  gap: 1.4rem;
+}
+
+.ttw-controls,
+.ttw-result { min-width: 0; }
+.ttw-controls {
+  padding-right: 1.4rem;
+  border-right: 1px solid var(--n-line);
+}
+.ttw-section-heading { margin-bottom: 1rem; }
+.ttw-overline { margin: 0 0 0.35rem; }
+.ttw-section-heading h2,
+.ttw-result-heading h2 {
+  margin: 0;
+  font-size: 1.25rem;
+  line-height: 1.15;
+}
+.ttw-field-stack,
+.ttw-limits {
+  display: grid;
+  gap: 0.9rem;
+}
+.ttw-limits {
+  margin-top: 1.5rem;
+  padding-top: 1.4rem;
+  border-top: 1px solid var(--n-line);
+}
+.ttw-field {
+  display: grid;
+  gap: 0.35rem;
+}
+.ttw-field-title { font-weight: 800; }
+.ttw-field small {
+  color: var(--n-muted);
+  font-size: 0.78rem;
+  line-height: 1.35;
+}
+
+.ttw-input-row {
+  display: grid;
+  grid-template-columns: 1fr auto;
+  align-items: center;
+  border: 1px solid var(--n-line);
+  border-radius: 0.65rem;
+  background: var(--n-surface);
+}
+
+.ttw-input-row input {
+  width: 100%;
+  min-width: 0;
+  border: 0;
+  padding: 0.65rem 0.75rem;
+  background: transparent;
+  color: var(--n-ink);
+  font: inherit;
+  font-weight: 800;
+}
+
+.ttw-input-row input:focus-visible {
+  outline: 2px solid var(--n-accent);
+  outline-offset: -2px;
+}
+.ttw-input-row em {
+  padding: 0 0.75rem;
+  color: var(--n-muted);
+  font-size: 0.8rem;
+  font-style: normal;
+  font-weight: 800;
+}
+.ttw-field input[type="range"] {
+  width: 100%;
+  accent-color: var(--n-accent);
+}
+.ttw-result { padding: 0.2rem 0; }
+
+.ttw-result-heading {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 0.8rem;
+}
+
+.ttw-status {
+  border: 1px solid var(--n-safe);
+  border-radius: 999px;
+  padding: 0.4rem 0.65rem;
+  color: var(--n-safe);
+  font-size: 0.75rem;
+  font-weight: 900;
+  white-space: nowrap;
+}
+
+.ttw-tool[data-status="light"] .ttw-status {
+  border-color: var(--n-warn);
+  color: var(--n-warn);
+}
+.ttw-tool[data-status="heavy"] .ttw-status,
+.ttw-tool[data-status="invalid"] .ttw-status {
+  border-color: var(--n-danger);
+  color: var(--n-danger);
+}
+
+.ttw-scene-wrap {
+  margin-top: 1rem;
+  padding: 0.7rem 0.3rem 0.4rem;
+  border-top: 1px solid var(--n-line);
+  border-bottom: 1px solid var(--n-line);
+}
+.ttw-scene {
+  display: block;
+  width: 100%;
+  height: auto;
+}
+
+.ttw-force-line,
+.ttw-deck,
+.ttw-drawbar,
+.ttw-axle,
+.ttw-ground,
+.ttw-load-line {
+  fill: none;
+  stroke: var(--n-ink);
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+.ttw-force-line {
+  stroke: var(--n-accent);
+  stroke-width: 7;
+}
+.ttw-deck { stroke-width: 12; }
+.ttw-drawbar { stroke-width: 8; }
+.ttw-axle {
+  stroke: var(--n-axle);
+  stroke-width: 6;
+}
+.ttw-ground {
+  stroke: var(--n-line);
+  stroke-width: 5;
+}
+.ttw-load-line {
+  stroke: var(--n-load);
+  stroke-dasharray: 5 8;
+  stroke-width: 4;
+}
+.ttw-load-dot {
+  fill: var(--n-load);
+  stroke: var(--n-surface);
+  stroke-width: 5;
+}
+.ttw-wheel {
+  fill: var(--n-surface-muted);
+  stroke: var(--n-axle);
+  stroke-width: 6;
+}
+.ttw-scene-label {
+  fill: var(--n-muted);
+  font-size: 13px;
+  font-weight: 700;
+}
+.ttw-scene-value {
+  fill: var(--n-ink);
+  font-size: 16px;
+  font-weight: 900;
+  text-anchor: middle;
+}
+
+.ttw-scene-legend {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.8rem 1rem;
+  color: var(--n-muted);
+  font-size: 0.75rem;
+}
+.ttw-scene-legend span {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.35rem;
+}
+.ttw-dot {
+  width: 0.65rem;
+  height: 0.65rem;
+  border-radius: 50%;
+}
+.ttw-dot-load { background: var(--n-load); }
+.ttw-dot-tongue { background: var(--n-accent); }
+.ttw-dot-axle { background: var(--n-axle); }
+
+.ttw-lead {
+  display: grid;
+  grid-template-columns: 1fr auto;
+  align-items: end;
+  gap: 0.25rem 0.8rem;
+  margin-top: 1rem;
+}
+.ttw-lead span {
+  color: var(--n-muted);
+  font-size: 0.8rem;
+  font-weight: 800;
+}
+.ttw-lead strong {
+  grid-row: span 2;
+  color: var(--n-accent);
+  font-size: clamp(2rem, 5vw, 3.3rem);
+  line-height: 0.95;
+}
+.ttw-lead small {
+  color: var(--n-muted);
+  font-weight: 800;
+}
+
+.ttw-metrics {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 0.6rem;
+  margin-top: 1rem;
+}
+.ttw-metrics div {
+  min-width: 0;
+  padding: 0.75rem;
+  border-left: 3px solid var(--n-line);
+  background: var(--n-surface);
+}
+.ttw-metrics span,
+.ttw-metrics strong { display: block; }
+.ttw-metrics span {
+  color: var(--n-muted);
+  font-size: 0.72rem;
+}
+.ttw-metrics strong {
+  margin-top: 0.35rem;
+  font-size: 0.95rem;
+  overflow-wrap: anywhere;
+}
+
+.ttw-shift {
+  margin-top: 1rem;
+  padding: 0.8rem 0.9rem;
+  border-left: 3px solid var(--n-accent);
+  background: var(--n-surface);
+}
+.ttw-shift strong {
+  display: block;
+  font-size: 0.85rem;
+}
+.ttw-shift p {
+  margin: 0.25rem 0 0;
+  color: var(--n-muted);
+  line-height: 1.45;
+}
+.ttw-summary {
+  margin: 1rem 0 0;
+  color: var(--n-muted);
+  line-height: 1.55;
+}
+
+.ttw-formula {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem 0.8rem;
+  border-top: 1px solid var(--n-line);
+  background: var(--n-surface);
+  color: var(--n-muted);
+  font-size: 0.8rem;
+  line-height: 1.5;
+}
+.ttw-formula strong { color: var(--n-ink); }
+
+@media (max-width: 760px) {
+  .ttw-presets { grid-template-columns: 1fr; }
+  .ttw-presets-label { margin-bottom: -0.2rem; }
+  .ttw-layout { grid-template-columns: 1fr; }
+  .ttw-controls {
+    padding-right: 0;
+    border-right: 0;
+  }
+  .ttw-result {
+    padding-top: 1.2rem;
+    border-top: 1px solid var(--n-line);
+  }
+}
+
+@media (max-width: 460px) {
+  .ttw-toolbar,
+  .ttw-presets,
+  .ttw-layout,
+  .ttw-formula {
+    padding-left: 1rem;
+    padding-right: 1rem;
+  }
+  .ttw-metrics { grid-template-columns: 1fr; }
+  .ttw-scene-legend { gap: 0.5rem; }
+}

package/src/tool/trailerTongueWeightCalculator/ui.ts

@@ -0,0 +1,49 @@
+export interface TrailerTongueWeightCalculatorUI extends Record<string, string> {
+  metricLabel: string;
+  imperialLabel: string;
+  resetLabel: string;
+  presetLabel: string;
+  balancedPreset: string;
+  frontHeavyPreset: string;
+  rearHeavyPreset: string;
+  presetMetaTemplate: string;
+  geometryLabel: string;
+  geometryHint: string;
+  totalMassLabel: string;
+  totalMassHint: string;
+  hitchDistanceLabel: string;
+  hitchDistanceHint: string;
+  centerPositionLabel: string;
+  centerPositionHint: string;
+  tongueLimitsLabel: string;
+  tongueLimitsHint: string;
+  minimumTongueLabel: string;
+  minimumTongueHint: string;
+  maximumTongueLabel: string;
+  maximumTongueHint: string;
+  resultKicker: string;
+  resultTitle: string;
+  sceneLabel: string;
+  hitchLabel: string;
+  axleLabel: string;
+  centerOfMassLabel: string;
+  loadedMassLabel: string;
+  tongueWeightLabel: string;
+  tonguePercentLabel: string;
+  axleLoadLabel: string;
+  allowedRangeLabel: string;
+  statusSafe: string;
+  statusLight: string;
+  statusHeavy: string;
+  statusInvalid: string;
+  shiftTitle: string;
+  shiftForwardTemplate: string;
+  shiftRearwardTemplate: string;
+  shiftNone: string;
+  summaryTemplate: string;
+  formulaLabel: string;
+  formulaText: string;
+  inputUnitMass: string;
+  inputUnitDistance: string;
+  outputUnitMass: string;
+}

package/src/tools.ts

@@ -5,7 +5,10 @@ import { MOTORCYCLE_SKID_MARK_SPEED_ESTIMATOR_TOOL } from './tool/motorcycleSkid
 import { REAL_FUEL_CONSUMPTION_CALCULATOR_TOOL } from './tool/realFuelConsumptionCalculator';
 import { TIRE_PRESSURE_CONVERTER_TOOL } from './tool/tirePressureConverter';
 import { EV_CHARGING_TIME_COST_PLANNER_TOOL } from './tool/evChargingTimeCostPlanner';
+import { TRAILER_TONGUE_WEIGHT_CALCULATOR_TOOL } from './tool/trailerTongueWeightCalculator';
 
-export const ALL_TOOLS = [BRAKING_DISTANCE_CALCULATOR_TOOL, REAL_FUEL_CONSUMPTION_CALCULATOR_TOOL, CAR_MOTORCYCLE_GEAR_RATIO_CALCULATOR_TOOL, TIRE_PRESSURE_CONVERTER_TOOL, MOTORCYCLE_SKID_MARK_SPEED_ESTIMATOR_TOOL, EV_CHARGING_TIME_COST_PLANNER_TOOL];
+export const ALL_TOOLS = [BRAKING_DISTANCE_CALCULATOR_TOOL, REAL_FUEL_CONSUMPTION_CALCULATOR_TOOL, CAR_MOTORCYCLE_GEAR_RATIO_CALCULATOR_TOOL, TIRE_PRESSURE_CONVERTER_TOOL, MOTORCYCLE_SKID_MARK_SPEED_ESTIMATOR_TOOL, EV_CHARGING_TIME_COST_PLANNER_TOOL, TRAILER_TONGUE_WEIGHT_CALCULATOR_TOOL];
 export { evChargingTimeCostPlanner } from './tool/evChargingTimeCostPlanner/entry';
 export type { EVChargingTimeCostPlannerLocaleContent } from './tool/evChargingTimeCostPlanner/entry';
+export { trailerTongueWeightCalculator } from './tool/trailerTongueWeightCalculator/entry';
+export type { TrailerTongueWeightCalculatorLocaleContent } from './tool/trailerTongueWeightCalculator/entry';