@jjlmoya/utils-babies 1.2.0 → 1.3.0

package/src/tool/pregnancy-calculator/bibliography.astro

@@ -1,7 +1,11 @@
 ---
 import { Bibliography as BibliographyUI } from '@jjlmoya/utils-shared';
-import type { BibliographyEntry } from '../../types';
-interface Props { links?: BibliographyEntry[]; title: string; }
-const { links = [], title } = Astro.props;
+import { pregnancyCalculator } from './index';
+import type { KnownLocale } from '../../types';
+
+interface Props { locale?: KnownLocale; }
+const { locale = 'es' } = Astro.props;
+const content = await pregnancyCalculator.i18n[locale]?.();
+if (!content) return null;
 ---
-<BibliographyUI links={links} title={title} />
+<BibliographyUI links={content.bibliography} title={content.bibliographyTitle ?? ''} />

package/src/tool/pregnancy-calculator/component.astro

@@ -89,6 +89,12 @@ const { ui } = Astro.props;
         <p class="pregnancy-calculator-mp-empty-body">{ui.labelStartBody}</p>
       </div>
 
+      <div class="pregnancy-calculator-mp-egg" id="pc-mp-egg" style="display:none">
+        <div class="pregnancy-calculator-egg-dot" id="pc-egg-dot"></div>
+        <div class="pregnancy-calculator-egg-title" id="pc-egg-title"></div>
+        <p class="pregnancy-calculator-egg-body" id="pc-egg-body"></p>
+      </div>
+
       <div class="pregnancy-calculator-mp-results" id="pc-mp-results" style="display:none">
         <div class="pregnancy-calculator-mp-top-row">
           <span class="pregnancy-calculator-mp-badge" id="pc-mp-badge">Semana —</span>
@@ -127,8 +133,10 @@ const { ui } = Astro.props;
     </div>
 
     <div class="pregnancy-calculator-right">
-      <div class="pregnancy-calculator-tl-header">{ui.labelTimeline}</div>
-      <div class="pregnancy-calculator-tl-scroll" id="pc-tl-scroll"></div>
+      <div class="pregnancy-calculator-tl-inner">
+        <div class="pregnancy-calculator-tl-header">{ui.labelTimeline}</div>
+        <div class="pregnancy-calculator-tl-scroll" id="pc-tl-scroll"></div>
+      </div>
     </div>
 
   </div>
@@ -155,6 +163,10 @@ const { ui } = Astro.props;
   const sdEdd = root.querySelector('#pc-sd-edd') as HTMLElement;
   const sdBtnCal = root.querySelector('#pc-sd-btn-cal') as HTMLButtonElement;
   const mpEmpty = root.querySelector('#pc-mp-empty') as HTMLElement;
+  const mpEgg = root.querySelector('#pc-mp-egg') as HTMLElement;
+  const eggDot = root.querySelector('#pc-egg-dot') as HTMLElement;
+  const eggTitle = root.querySelector('#pc-egg-title') as HTMLElement;
+  const eggBody = root.querySelector('#pc-egg-body') as HTMLElement;
   const mpResults = root.querySelector('#pc-mp-results') as HTMLElement;
   const mpBadge = root.querySelector('#pc-mp-badge') as HTMLElement;
   const mpAnalogy = root.querySelector('#pc-mp-analogy') as HTMLElement;
@@ -210,7 +222,7 @@ const { ui } = Astro.props;
       info.className = 'pregnancy-calculator-tl-info';
       const num = document.createElement('span');
       num.className = 'pregnancy-calculator-tl-num';
-      num.textContent = String(w);
+      num.textContent = `${ui['labelSem'] ?? 'Sem'} ${w}`;
       const label = document.createElement('span');
       label.className = 'pregnancy-calculator-tl-label';
       label.textContent = timelineLabels[w] ?? '';
@@ -279,6 +291,20 @@ const { ui } = Astro.props;
     root.classList.add(`pregnancy-calculator-t${tri}`);
   }
 
+  function showEasterEgg(reason: 'future' | 'too-old'): void {
+    eggDot.dataset.reason = reason;
+    if (reason === 'future') {
+      eggTitle.textContent = ui['eggFutureTitle'] ?? '';
+      eggBody.textContent = ui['eggFutureBody'] ?? '';
+    } else {
+      eggTitle.textContent = ui['eggTooOldTitle'] ?? '';
+      eggBody.textContent = ui['eggTooOldBody'] ?? '';
+    }
+    mpEmpty.style.display = 'none';
+    mpResults.style.display = 'none';
+    mpEgg.style.display = '';
+  }
+
   function renderStats(result: CalcResult): void {
     if (!result.valid) {
       sdWeeks.textContent = '—';
@@ -287,8 +313,11 @@ const { ui } = Astro.props;
       sdBtnCal.disabled = true;
       return;
     }
-    sdWeeks.textContent = `${result.weeks}+${result.days}`;
-    sdTri.textContent = String(result.trimester);
+    const wFmt = (ui['weeksFormat'] ?? '{w}s {d}d')
+      .replace('{w}', String(result.weeks))
+      .replace('{d}', String(result.days));
+    sdWeeks.textContent = wFmt;
+    sdTri.textContent = `${result.trimester}${ui['trimesterSuffix'] ?? ''}`;
     sdEdd.textContent = fmtEdd.format(result.edd);
     sdBtnCal.disabled = false;
     applyTrimester(result.trimester);
@@ -305,7 +334,7 @@ const { ui } = Astro.props;
 
   function renderMilestone(weeks: number, cat: string, partner: boolean): void {
     const ms = getMilestone(weeks);
-    mpBadge.textContent = `Semana ${weeks}`;
+    mpBadge.textContent = `${ui['labelWeekBadge'] ?? 'Semana'} ${weeks}`;
     mpAnalogy.textContent = ms.analogies[cat as 'fruits' | 'geek' | 'sweets'] ?? ms.analogies.fruits;
     mpSize.textContent = ms.size;
     mpBio.textContent = ms.biolook;
@@ -342,16 +371,29 @@ const { ui } = Astro.props;
     updateMethodUI(s.method);
     updatePartnerUI(s.partner);
     updateAnalogyTabs(s.analogyCat);
-    if (!s.result || !s.result.valid) {
+    if (!s.result) {
+      mpEmpty.style.display = '';
+      mpEgg.style.display = 'none';
+      mpResults.style.display = 'none';
+      return;
+    }
+    if (!s.result.valid && s.result.outOfRange) {
+      renderStats(s.result);
+      showEasterEgg(s.result.outOfRange);
+      return;
+    }
+    if (!s.result.valid) {
       mpEmpty.style.display = '';
+      mpEgg.style.display = 'none';
       mpResults.style.display = 'none';
-      if (s.result) renderStats(s.result);
+      renderStats(s.result);
       return;
     }
     renderStats(s.result);
     renderMilestone(s.result.weeks, s.analogyCat, s.partner);
     renderTimeline(s.result.weeks);
     mpEmpty.style.display = 'none';
+    mpEgg.style.display = 'none';
     mpResults.style.display = '';
     mpResults.classList.add('pregnancy-calculator-mp-enter');
   }

package/src/tool/pregnancy-calculator/i18n/en.ts

@@ -109,6 +109,14 @@ export const content: PregnancyCalculatorLocaleContent = {
     labelTimeline: 'Timeline',
     labelStartHere: 'Start here',
     labelStartBody: 'Select the date of your last period to discover which week you are in.',
+    labelSem: 'Wk',
+    labelWeekBadge: 'Week',
+    weeksFormat: '{w}w {d}d',
+    trimesterSuffix: '',
+    eggFutureTitle: 'Time traveller detected',
+    eggFutureBody: "That date hasn't arrived yet. Come back when reality catches up.",
+    eggTooOldTitle: 'Expired date',
+    eggTooOldBody: 'More than 40 weeks have passed since that date. If all went well, baby is already in the world.',
     faqTitle: 'Frequently asked questions',
     bibliographyTitle: 'References',
   },

package/src/tool/pregnancy-calculator/i18n/es.ts

@@ -109,6 +109,14 @@ export const content: PregnancyCalculatorLocaleContent = {
     labelTimeline: 'Línea de tiempo',
     labelStartHere: 'Empieza aquí',
     labelStartBody: 'Selecciona la fecha de tu última regla y descubre en qué semana estás.',
+    labelSem: 'Sem',
+    labelWeekBadge: 'Semana',
+    weeksFormat: '{w}s {d}d',
+    trimesterSuffix: 'º',
+    eggFutureTitle: 'Viajera en el tiempo detectada',
+    eggFutureBody: 'Esa fecha aún no ha llegado. Vuelve cuando la realidad te alcance.',
+    eggTooOldTitle: 'Fecha caducada',
+    eggTooOldBody: 'Han pasado más de 40 semanas desde esa fecha. Si todo fue bien, ya es mundo exterior.',
     faqTitle: 'Preguntas frecuentes',
     bibliographyTitle: 'Referencias',
   },

package/src/tool/pregnancy-calculator/i18n/fr.ts

@@ -109,6 +109,14 @@ export const content: PregnancyCalculatorLocaleContent = {
     labelTimeline: 'Chronologie',
     labelStartHere: 'Commencez ici',
     labelStartBody: 'Sélectionnez la date de vos dernières règles pour découvrir à quelle semaine vous en êtes.',
+    labelSem: 'Sem',
+    labelWeekBadge: 'Semaine',
+    weeksFormat: '{w}s {d}j',
+    trimesterSuffix: 'e',
+    eggFutureTitle: 'Voyageuse temporelle détectée',
+    eggFutureBody: 'Cette date n\'est pas encore arrivée. Revenez quand la réalité vous rattrapera.',
+    eggTooOldTitle: 'Date expirée',
+    eggTooOldBody: 'Plus de 40 semaines se sont écoulées depuis cette date. Si tout s\'est bien passé, bébé est déjà dans le monde.',
     faqTitle: 'Questions fréquentes',
     bibliographyTitle: 'Références',
   },

package/src/tool/pregnancy-calculator/index.ts

@@ -29,6 +29,14 @@ export interface PregnancyCalculatorUI {
   labelTimeline: string;
   labelStartHere: string;
   labelStartBody: string;
+  labelSem: string;
+  labelWeekBadge: string;
+  weeksFormat: string;
+  trimesterSuffix: string;
+  eggFutureTitle: string;
+  eggFutureBody: string;
+  eggTooOldTitle: string;
+  eggTooOldBody: string;
   faqTitle: string;
   bibliographyTitle: string;
 }