@helpwave/hightide/dist/components/TimeDisplay.mjs

helpwave's component and theming library

// src/hooks/useLanguage.tsx
import { createContext, useContext, useEffect as useEffect2, useState as useState2 } from "react";

// src/hooks/useLocalStorage.tsx
import { useCallback, useEffect, useState } from "react";

// src/hooks/useLanguage.tsx
import { jsx } from "react/jsx-runtime";
var DEFAULT_LANGUAGE = "en";
var LanguageContext = createContext({ language: DEFAULT_LANGUAGE, setLanguage: (v) => v });
var useLanguage = () => useContext(LanguageContext);

// src/hooks/useTranslation.ts
var useTranslation = (defaults, translationOverwrite = {}) => {
  const { language: languageProp, translation: overwrite } = translationOverwrite;
  const { language: inferredLanguage } = useLanguage();
  const usedLanguage = languageProp ?? inferredLanguage;
  let defaultValues = defaults[usedLanguage];
  if (overwrite && overwrite[usedLanguage]) {
    defaultValues = { ...defaultValues, ...overwrite[usedLanguage] };
  }
  return defaultValues;
};

// src/components/TimeDisplay.tsx
import { jsx as jsx2 } from "react/jsx-runtime";
var defaultTimeDisplayTranslations = {
  en: {
    today: "today",
    yesterday: "yesterday",
    tomorrow: "tomorrow",
    inDays: (days) => `in ${days} days`,
    agoDays: (days) => `${days} days ago`,
    january: "January",
    february: "February",
    march: "March",
    april: "April",
    may: "May",
    june: "June",
    july: "July",
    august: "August",
    september: "September",
    october: "October",
    november: "November",
    december: "December"
  },
  de: {
    today: "heute",
    yesterday: "gestern",
    tomorrow: "morgen",
    inDays: (days) => `in ${days} Tagen`,
    agoDays: (days) => `vor ${days} Tagen`,
    january: "Januar",
    february: "Februar",
    march: "M\xE4rz",
    april: "April",
    may: "Mai",
    june: "Juni",
    july: "Juli",
    august: "August",
    september: "September",
    october: "October",
    november: "November",
    december: "December"
  }
};
var TimeDisplay = ({
  overwriteTranslation,
  date,
  mode = "daysFromToday"
}) => {
  const translation = useTranslation(defaultTimeDisplayTranslations, overwriteTranslation);
  const difference = (/* @__PURE__ */ new Date()).setHours(0, 0, 0, 0).valueOf() - new Date(date).setHours(0, 0, 0, 0).valueOf();
  const isBefore = difference > 0;
  const differenceInDays = Math.floor(Math.abs(difference) / (1e3 * 3600 * 24));
  let displayString;
  if (differenceInDays === 0) {
    displayString = translation.today;
  } else if (differenceInDays === 1) {
    displayString = isBefore ? translation.yesterday : translation.tomorrow;
  } else {
    displayString = isBefore ? translation.agoDays(differenceInDays) : translation.inDays(differenceInDays);
  }
  const monthToTranslation = {
    0: translation.january,
    1: translation.february,
    2: translation.march,
    3: translation.april,
    4: translation.may,
    5: translation.june,
    6: translation.july,
    7: translation.august,
    8: translation.september,
    9: translation.october,
    10: translation.november,
    11: translation.december
  };
  let fullString;
  if (mode === "daysFromToday") {
    fullString = `${date.getHours().toString().padStart(2, "0")}:${date.getMinutes().toString().padStart(2, "0")} - ${displayString}`;
  } else {
    fullString = `${date.getDate()}. ${monthToTranslation[date.getMonth()]} ${date.getFullYear()}`;
  }
  return /* @__PURE__ */ jsx2("span", { children: fullString });
};
export {
  TimeDisplay
};
//# sourceMappingURL=TimeDisplay.mjs.map