@helpwave/hightide 0.1.17 → 0.1.19

package/dist/components/layout-and-navigation/TextImage.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/layout-and-navigation/TextImage.tsx","../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts","../../../src/localization/defaults/form.ts"],"sourcesContent":["import type { PropsForTranslation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport clsx from 'clsx'\nimport type { FormTranslationType } from '../../localization/defaults/form'\nimport { formTranslation } from '../../localization/defaults/form'\n\ntype TextImageColor = 'primary' | 'secondary' | 'dark'\n\ntype TextImageTranslation = FormTranslationType\n\nexport type TextImageProps = {\n  title: string,\n  description: string,\n  imageUrl: string,\n  onShowMoreClicked?: () => void,\n  color?: TextImageColor,\n  badge?: string,\n  contentClassName?: string,\n  className?: string,\n}\n\n/**\n * A Component for layering a Text upon an image\n */\nexport const TextImage = ({\n                            overwriteTranslation,\n                            title,\n                            description,\n                            imageUrl,\n                            onShowMoreClicked,\n                            color = 'primary',\n                            badge,\n                            contentClassName = '',\n                            className = '',\n                          }: PropsForTranslation<TextImageTranslation, TextImageProps>) => {\n  const translation = useTranslation([formTranslation], overwriteTranslation)\n\n  const chipColorMapping: Record<TextImageColor, string> = {\n    primary: 'text-text-image-primary-background bg-text-image-primary-text',\n    secondary: 'text-text-image-secondary-background bg-text-image-secondary-text',\n    dark: 'text-text-image-dark-background bg-text-image-dark-text',\n  }\n\n  const colorMapping: Record<TextImageColor, string> = {\n    primary: 'text-text-image-primary-text bg-linear-to-r from-30% from-text-image-primary-background to-text-image-primary-background/55',\n    secondary: 'text-text-image-secondary-text bg-linear-to-r from-30% from-text-image-secondary-background to-text-image-secondary-background/55',\n    dark: 'text-text-image-dark-text bg-linear-to-r from-30% from-text-image-dark-background to-text-image-dark-background/55',\n  }\n\n  return (\n    <div\n      className={clsx('rounded-2xl w-full', className)}\n      style={{\n        backgroundImage: `url(${imageUrl})`,\n        backgroundSize: 'cover',\n      }}>\n      <div\n        className={clsx(`col px-6 py-12 rounded-2xl h-full`, colorMapping[color], contentClassName)}\n      >\n        {badge && (\n          <div className={clsx(`chip-full mb-2 py-2 px-4 w-fit`, chipColorMapping[color])}>\n            <span className=\"text-lg font-bold\">{badge}</span>\n          </div>\n        )}\n        <div className=\"col gap-y-1 overflow-hidden\">\n          <span className=\"textstyle-title-xl\">{title}</span>\n          <span className=\"text-ellipsis overflow-hidden\">{description}</span>\n        </div>\n        {onShowMoreClicked && (\n          <div className=\"row mt-2 underline\">\n            <button onClick={onShowMoreClicked}>{translation('showMore')}</button>\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n  language: Language,\n  setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n  language: LanguageUtil.DEFAULT_LANGUAGE,\n  setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n  const { language } = useLanguage()\n  const mapping: Record<Language, string> = {\n    en: 'en-US',\n    de: 'de-DE'\n  }\n  return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n  initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n  const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n  const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n  useEffect(() => {\n    if (language !== initialLanguage && initialLanguage) {\n      console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n      setLanguage(initialLanguage)\n    }\n  }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    // TODO set locale of html tag here as well\n    setStoredLanguage(language)\n  }, [language, setStoredLanguage])\n\n  useEffect(() => {\n    if (storedLanguage !== null) {\n      setLanguage(storedLanguage)\n      return\n    }\n\n    const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n    const matchingBrowserLanguage = window.navigator.languages\n      .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n      .filter(entry => entry !== undefined)\n\n    if (matchingBrowserLanguage.length === 0) return\n\n    const firstMatch = matchingBrowserLanguage[0] as Language\n    setLanguage(firstMatch)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <LanguageContext.Provider value={{\n      language,\n      setLanguage\n    }}>\n      {children}\n    </LanguageContext.Provider>\n  )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return initValue\n    }\n    const storageService = new LocalStorageService()\n    const value = storageService.get<T>(key)\n    return value || initValue\n  }, [initValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(value => {\n    const newValue = value instanceof Function ? value(storedValue) : value\n    const storageService = new LocalStorageService()\n    storageService.set(key, value)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  useEffect(() => {\n    setStoredValue(get())\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n  en: 'English',\n  de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n  languages,\n  DEFAULT_LANGUAGE,\n  languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\n/**\n * A type describing the pluralization of a word\n */\nexport type TranslationPlural = {\n  zero?: string,\n  one?: string,\n  two?: string,\n  few?: string,\n  many?: string,\n  other: string,\n}\n\n/**\n * The type describing all values of a translation\n */\nexport type TranslationType = Record<string, string | TranslationPlural>\n\n/**\n * The type of translations\n */\nexport type Translation<T extends TranslationType> = Record<Language, T>\n\ntype OverwriteTranslationType<T extends TranslationType> = {\n  language?: Language,\n  translation?: Translation<Partial<T>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n *              if you don't expect any other props other than `language` and get an\n *              error when using your component (because it uses `forwardRef` etc.)\n *              you can try out `Record<string, unknown>`, this might resolve your\n *              problem as `SomeType & never` is still `never` but `SomeType & unknown`\n *              is `SomeType` which means that adding back props (like `ref` etc.)\n *              works properly\n */\nexport type PropsForTranslation<\n  Translation extends TranslationType,\n  Props = unknown\n> = Props & {\n  overwriteTranslation?: OverwriteTranslationType<Translation>,\n}\n\ntype StringKeys<T> = Extract<keyof T, string>;\n\ntype TranslationFunctionOptions = {\n  replacements?: Record<string, string>,\n  count?: number,\n}\ntype TranslationFunction<T extends TranslationType> = (key: StringKeys<T>, options?: TranslationFunctionOptions) => string\n\nexport const TranslationPluralCount = {\n  zero: 0,\n  one: 1,\n  two: 2,\n  few: 3,\n  many: 11,\n  other: -1,\n}\n\n\nexport const useTranslation = <T extends TranslationType>(\n  translations: Translation<Partial<TranslationType>>[],\n  overwriteTranslation: OverwriteTranslationType<T> = {}\n): TranslationFunction<T> => {\n  const { language: languageProp, translation: overwrite } = overwriteTranslation\n  const { language: inferredLanguage } = useLanguage()\n  const usedLanguage = languageProp ?? inferredLanguage\n  const usedTranslations = [...translations]\n  if (overwrite) {\n    usedTranslations.push(overwrite)\n  }\n\n  return (key: StringKeys<T>, options?: TranslationFunctionOptions): string => {\n    const { count, replacements } = { ...{ count: 0, replacements: {} }, ...options }\n\n    try {\n      for (let i = translations.length - 1; i >= 0; i--) {\n        const translation = translations[i]\n        const localizedTranslation = translation[usedLanguage]\n        if (!localizedTranslation) {\n          continue\n        }\n        const value = localizedTranslation[key]\n        if(!value) {\n          continue\n        }\n\n        let forProcessing: string\n        if (typeof value !== 'string') {\n          if (count === TranslationPluralCount.zero && value?.zero) {\n            forProcessing = value.zero\n          } else if (count === TranslationPluralCount.one && value?.one) {\n            forProcessing = value.one\n          } else if (count === TranslationPluralCount.two && value?.two) {\n            forProcessing = value.two\n          } else if (TranslationPluralCount.few <= count && count < TranslationPluralCount.many && value?.few) {\n            forProcessing = value.few\n          } else if (count > TranslationPluralCount.many && value?.many) {\n            forProcessing = value.many\n          } else {\n            forProcessing = value.other\n          }\n        } else {\n          forProcessing = value\n        }\n        forProcessing = forProcessing.replace(/\\{\\{(\\w+)}}/g, (_, placeholder) => {\n          return replacements[placeholder] ?? `{{key:${placeholder}}}` // fallback if key is missing\n        })\n        return forProcessing\n      }\n    } catch (e) {\n      console.error(e)\n    }\n    return `{{${usedLanguage}:${key}}}`\n  }\n}","import type { Translation } from '../useTranslation'\n\nexport type FormTranslationType = {\n  all: string,\n  apply: string,\n  back: string,\n  cancel: string,\n  change: string,\n  clear: string,\n  click: string,\n  clickToCopy: string,\n  close: string,\n  confirm: string,\n  copy: string,\n  copied: string,\n  decline: string,\n  delete: string,\n  discard: string,\n  discardChanges: string,\n  done: string,\n  edit: string,\n  enterText: string,\n  error: string,\n  exit: string,\n  fieldRequiredError: string,\n  invalidEmailError: string,\n  less: string,\n  loading: string,\n  maxLengthError: string,\n  minLengthError: string,\n  more: string,\n  next: string,\n  no: string,\n  none: string,\n  of: string,\n  optional: string,\n  pleaseWait: string,\n  previous: string,\n  remove: string,\n  required: string,\n  reset: string,\n  save: string,\n  saved: string,\n  search: string,\n  select: string,\n  selectOption: string,\n  show: string,\n  showMore: string,\n  showLess: string,\n  submit: string,\n  success: string,\n  unsavedChanges: string,\n  unsavedChangesSaveQuestion: string,\n  update: string,\n  yes: string,\n}\n\nexport const formTranslation: Translation<FormTranslationType> = {\n  en: {\n    all: 'All',\n    apply: 'Apply',\n    back: 'Back',\n    cancel: 'Cancel',\n    change: 'Change',\n    clear: 'Clear',\n    click: 'Click',\n    clickToCopy: 'Click to Copy',\n    close: 'Close',\n    confirm: 'Confirm',\n    copy: 'Copy',\n    copied: 'Copied',\n    decline: 'Decline',\n    delete: 'Delete',\n    discard: 'Discard',\n    discardChanges: 'Discard Changes',\n    done: 'Done',\n    edit: 'Edit',\n    enterText: 'Enter text here',\n    error: 'Error',\n    exit: 'Exit',\n    fieldRequiredError: 'This field is required.',\n    invalidEmailError: 'Please enter a valid email address.',\n    less: 'Less',\n    loading: 'Loading',\n    maxLengthError: 'Maximum length exceeded.',\n    minLengthError: 'Minimum length not met.',\n    more: 'More',\n    next: 'Next',\n    no: 'No',\n    none: 'None',\n    of: 'of',\n    optional: 'Optional',\n    pleaseWait: 'Please wait...',\n    previous: 'Previous',\n    remove: 'Remove',\n    required: 'Required',\n    reset: 'Reset',\n    save: 'Save',\n    saved: 'Saved',\n    search: 'Search',\n    select: 'Select',\n    selectOption: 'Select an option',\n    show: 'Show',\n    showMore: 'Show more',\n    showLess: 'Show less',\n    submit: 'Submit',\n    success: 'Success',\n    update: 'Update',\n    unsavedChanges: 'Unsaved Changes',\n    unsavedChangesSaveQuestion: 'Do you want to save your changes?',\n    yes: 'Yes',\n  },\n  de: {\n    all: 'Alle',\n    apply: 'Anwenden',\n    back: 'Zurück',\n    cancel: 'Abbrechen',\n    change: 'Ändern',\n    clear: 'Löschen',\n    click: 'Klicken',\n    clickToCopy: 'Zum kopieren klicken',\n    close: 'Schließen',\n    confirm: 'Bestätigen',\n    copy: 'Kopieren',\n    copied: 'Kopiert',\n    decline: 'Ablehnen',\n    delete: 'Löschen',\n    discard: 'Verwerfen',\n    discardChanges: 'Änderungen Verwerfen',\n    done: 'Fertig',\n    edit: 'Bearbeiten',\n    enterText: 'Text hier eingeben',\n    error: 'Fehler',\n    exit: 'Beenden',\n    fieldRequiredError: 'Dieses Feld ist erforderlich.',\n    invalidEmailError: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',\n    less: 'Weniger',\n    loading: 'Lädt',\n    maxLengthError: 'Maximale Länge überschritten.',\n    minLengthError: 'Mindestlänge nicht erreicht.',\n    more: 'Mehr',\n    next: 'Weiter',\n    no: 'Nein',\n    none: 'Nichts',\n    of: 'von',\n    optional: 'Optional',\n    pleaseWait: 'Bitte warten...',\n    previous: 'Vorherige',\n    remove: 'Entfernen',\n    required: 'Erforderlich',\n    reset: 'Zurücksetzen',\n    save: 'Speichern',\n    saved: 'Gespeichert',\n    search: 'Suche',\n    select: 'Select',\n    selectOption: 'Option auswählen',\n    show: 'Anzeigen',\n    showMore: 'Mehr anzeigen',\n    showLess: 'Weniger anzeigen',\n    submit: 'Abschicken',\n    success: 'Erfolg',\n    update: 'Update',\n    unsavedChanges: 'Ungespeicherte Änderungen',\n    unsavedChangesSaveQuestion: 'Möchtest du die Änderungen speichern?',\n    yes: 'Ja',\n  }\n}\n"],"mappings":"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","names":["import_react","import_jsx_runtime","clsx"]}
+{"version":3,"sources":["../../../src/components/layout-and-navigation/TextImage.tsx","../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts","../../../src/localization/defaults/form.ts"],"sourcesContent":["import type { PropsForTranslation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport clsx from 'clsx'\nimport type { FormTranslationType } from '../../localization/defaults/form'\nimport { formTranslation } from '../../localization/defaults/form'\n\ntype TextImageColor = 'primary' | 'secondary' | 'dark'\n\ntype TextImageTranslation = FormTranslationType\n\nexport type TextImageProps = {\n  title: string,\n  description: string,\n  imageUrl: string,\n  onShowMoreClicked?: () => void,\n  color?: TextImageColor,\n  badge?: string,\n  contentClassName?: string,\n  className?: string,\n}\n\n/**\n * A Component for layering a Text upon an image\n */\nexport const TextImage = ({\n                            overwriteTranslation,\n                            title,\n                            description,\n                            imageUrl,\n                            onShowMoreClicked,\n                            color = 'primary',\n                            badge,\n                            contentClassName = '',\n                            className = '',\n                          }: PropsForTranslation<TextImageTranslation, TextImageProps>) => {\n  const translation = useTranslation([formTranslation], overwriteTranslation)\n\n  const chipColorMapping: Record<TextImageColor, string> = {\n    primary: 'text-text-image-primary-background bg-text-image-primary-text',\n    secondary: 'text-text-image-secondary-background bg-text-image-secondary-text',\n    dark: 'text-text-image-dark-background bg-text-image-dark-text',\n  }\n\n  const colorMapping: Record<TextImageColor, string> = {\n    primary: 'text-text-image-primary-text bg-linear-to-r from-30% from-text-image-primary-background to-text-image-primary-background/55',\n    secondary: 'text-text-image-secondary-text bg-linear-to-r from-30% from-text-image-secondary-background to-text-image-secondary-background/55',\n    dark: 'text-text-image-dark-text bg-linear-to-r from-30% from-text-image-dark-background to-text-image-dark-background/55',\n  }\n\n  return (\n    <div\n      className={clsx('rounded-2xl w-full', className)}\n      style={{\n        backgroundImage: `url(${imageUrl})`,\n        backgroundSize: 'cover',\n      }}>\n      <div\n        className={clsx(`flex-col-2 px-6 py-12 rounded-2xl h-full`, colorMapping[color], contentClassName)}\n      >\n        {badge && (\n          <div className={clsx(`chip-full mb-2 py-2 px-4 w-fit`, chipColorMapping[color])}>\n            <span className=\"text-lg font-bold\">{badge}</span>\n          </div>\n        )}\n        <div className=\"flex-col-1 overflow-hidden\">\n          <span className=\"textstyle-title-xl\">{title}</span>\n          <span className=\"text-ellipsis overflow-hidden\">{description}</span>\n        </div>\n        {onShowMoreClicked && (\n          <div className=\"flex-row-2 mt-2 underline\">\n            <button onClick={onShowMoreClicked}>{translation('showMore')}</button>\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n  language: Language,\n  setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n  language: LanguageUtil.DEFAULT_LANGUAGE,\n  setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n  const { language } = useLanguage()\n  const mapping: Record<Language, string> = {\n    en: 'en-US',\n    de: 'de-DE'\n  }\n  return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n  initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n  const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n  const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n  useEffect(() => {\n    if (language !== initialLanguage && initialLanguage) {\n      console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n      setLanguage(initialLanguage)\n    }\n  }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    // TODO set locale of html tag here as well\n    setStoredLanguage(language)\n  }, [language, setStoredLanguage])\n\n  useEffect(() => {\n    if (storedLanguage !== null) {\n      setLanguage(storedLanguage)\n      return\n    }\n\n    const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n    const matchingBrowserLanguage = window.navigator.languages\n      .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n      .filter(entry => entry !== undefined)\n\n    if (matchingBrowserLanguage.length === 0) return\n\n    const firstMatch = matchingBrowserLanguage[0] as Language\n    setLanguage(firstMatch)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <LanguageContext.Provider value={{\n      language,\n      setLanguage\n    }}>\n      {children}\n    </LanguageContext.Provider>\n  )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return initValue\n    }\n    const storageService = new LocalStorageService()\n    const value = storageService.get<T>(key)\n    return value || initValue\n  }, [initValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(value => {\n    const newValue = value instanceof Function ? value(storedValue) : value\n    const storageService = new LocalStorageService()\n    storageService.set(key, value)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  useEffect(() => {\n    setStoredValue(get())\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n  en: 'English',\n  de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n  languages,\n  DEFAULT_LANGUAGE,\n  languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\n/**\n * A type describing the pluralization of a word\n */\nexport type TranslationPlural = {\n  zero?: string,\n  one?: string,\n  two?: string,\n  few?: string,\n  many?: string,\n  other: string,\n}\n\n/**\n * The type describing all values of a translation\n */\nexport type TranslationType = Record<string, string | TranslationPlural>\n\n/**\n * The type of translations\n */\nexport type Translation<T extends TranslationType> = Record<Language, T>\n\ntype OverwriteTranslationType<T extends TranslationType> = {\n  language?: Language,\n  translation?: Translation<Partial<T>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n *              if you don't expect any other props other than `language` and get an\n *              error when using your component (because it uses `forwardRef` etc.)\n *              you can try out `Record<string, unknown>`, this might resolve your\n *              problem as `SomeType & never` is still `never` but `SomeType & unknown`\n *              is `SomeType` which means that adding back props (like `ref` etc.)\n *              works properly\n */\nexport type PropsForTranslation<\n  Translation extends TranslationType,\n  Props = unknown\n> = Props & {\n  overwriteTranslation?: OverwriteTranslationType<Translation>,\n}\n\ntype StringKeys<T> = Extract<keyof T, string>;\n\ntype TranslationFunctionOptions = {\n  replacements?: Record<string, string>,\n  count?: number,\n}\ntype TranslationFunction<T extends TranslationType> = (key: StringKeys<T>, options?: TranslationFunctionOptions) => string\n\nexport const TranslationPluralCount = {\n  zero: 0,\n  one: 1,\n  two: 2,\n  few: 3,\n  many: 11,\n  other: -1,\n}\n\n\nexport const useTranslation = <T extends TranslationType>(\n  translations: Translation<Partial<TranslationType>>[],\n  overwriteTranslation: OverwriteTranslationType<T> = {}\n): TranslationFunction<T> => {\n  const { language: languageProp, translation: overwrite } = overwriteTranslation\n  const { language: inferredLanguage } = useLanguage()\n  const usedLanguage = languageProp ?? inferredLanguage\n  const usedTranslations = [...translations]\n  if (overwrite) {\n    usedTranslations.push(overwrite)\n  }\n\n  return (key: StringKeys<T>, options?: TranslationFunctionOptions): string => {\n    const { count, replacements } = { ...{ count: 0, replacements: {} }, ...options }\n\n    try {\n      for (let i = translations.length - 1; i >= 0; i--) {\n        const translation = translations[i]\n        const localizedTranslation = translation[usedLanguage]\n        if (!localizedTranslation) {\n          continue\n        }\n        const value = localizedTranslation[key]\n        if(!value) {\n          continue\n        }\n\n        let forProcessing: string\n        if (typeof value !== 'string') {\n          if (count === TranslationPluralCount.zero && value?.zero) {\n            forProcessing = value.zero\n          } else if (count === TranslationPluralCount.one && value?.one) {\n            forProcessing = value.one\n          } else if (count === TranslationPluralCount.two && value?.two) {\n            forProcessing = value.two\n          } else if (TranslationPluralCount.few <= count && count < TranslationPluralCount.many && value?.few) {\n            forProcessing = value.few\n          } else if (count > TranslationPluralCount.many && value?.many) {\n            forProcessing = value.many\n          } else {\n            forProcessing = value.other\n          }\n        } else {\n          forProcessing = value\n        }\n        forProcessing = forProcessing.replace(/\\{\\{(\\w+)}}/g, (_, placeholder) => {\n          return replacements[placeholder] ?? `{{key:${placeholder}}}` // fallback if key is missing\n        })\n        return forProcessing\n      }\n    } catch (e) {\n      console.error(e)\n    }\n    return `{{${usedLanguage}:${key}}}`\n  }\n}","import type { Translation } from '../useTranslation'\n\nexport type FormTranslationType = {\n  add: string,\n  all: string,\n  apply: string,\n  back: string,\n  cancel: string,\n  change: string,\n  clear: string,\n  click: string,\n  clickToCopy: string,\n  close: string,\n  confirm: string,\n  copy: string,\n  copied: string,\n  create: string,\n  decline: string,\n  delete: string,\n  discard: string,\n  discardChanges: string,\n  done: string,\n  edit: string,\n  enterText: string,\n  error: string,\n  exit: string,\n  fieldRequiredError: string,\n  invalidEmailError: string,\n  less: string,\n  loading: string,\n  maxLengthError: string,\n  minLengthError: string,\n  more: string,\n  next: string,\n  no: string,\n  none: string,\n  of: string,\n  optional: string,\n  pleaseWait: string,\n  previous: string,\n  remove: string,\n  required: string,\n  reset: string,\n  save: string,\n  saved: string,\n  search: string,\n  select: string,\n  selectOption: string,\n  show: string,\n  showMore: string,\n  showLess: string,\n  submit: string,\n  success: string,\n  unsavedChanges: string,\n  unsavedChangesSaveQuestion: string,\n  update: string,\n  yes: string,\n}\n\nexport const formTranslation: Translation<FormTranslationType> = {\n  en: {\n    add: 'Add',\n    all: 'All',\n    apply: 'Apply',\n    back: 'Back',\n    cancel: 'Cancel',\n    change: 'Change',\n    clear: 'Clear',\n    click: 'Click',\n    clickToCopy: 'Click to Copy',\n    close: 'Close',\n    confirm: 'Confirm',\n    copy: 'Copy',\n    copied: 'Copied',\n    create: 'Create',\n    decline: 'Decline',\n    delete: 'Delete',\n    discard: 'Discard',\n    discardChanges: 'Discard Changes',\n    done: 'Done',\n    edit: 'Edit',\n    enterText: 'Enter text here',\n    error: 'Error',\n    exit: 'Exit',\n    fieldRequiredError: 'This field is required.',\n    invalidEmailError: 'Please enter a valid email address.',\n    less: 'Less',\n    loading: 'Loading',\n    maxLengthError: 'Maximum length exceeded.',\n    minLengthError: 'Minimum length not met.',\n    more: 'More',\n    next: 'Next',\n    no: 'No',\n    none: 'None',\n    of: 'of',\n    optional: 'Optional',\n    pleaseWait: 'Please wait...',\n    previous: 'Previous',\n    remove: 'Remove',\n    required: 'Required',\n    reset: 'Reset',\n    save: 'Save',\n    saved: 'Saved',\n    search: 'Search',\n    select: 'Select',\n    selectOption: 'Select an option',\n    show: 'Show',\n    showMore: 'Show more',\n    showLess: 'Show less',\n    submit: 'Submit',\n    success: 'Success',\n    update: 'Update',\n    unsavedChanges: 'Unsaved Changes',\n    unsavedChangesSaveQuestion: 'Do you want to save your changes?',\n    yes: 'Yes',\n  },\n  de: {\n    add: 'Hinzufügen',\n    all: 'Alle',\n    apply: 'Anwenden',\n    back: 'Zurück',\n    cancel: 'Abbrechen',\n    change: 'Ändern',\n    clear: 'Löschen',\n    click: 'Klicken',\n    clickToCopy: 'Zum kopieren klicken',\n    close: 'Schließen',\n    confirm: 'Bestätigen',\n    copy: 'Kopieren',\n    copied: 'Kopiert',\n    create: 'Erstellen',\n    decline: 'Ablehnen',\n    delete: 'Löschen',\n    discard: 'Verwerfen',\n    discardChanges: 'Änderungen Verwerfen',\n    done: 'Fertig',\n    edit: 'Bearbeiten',\n    enterText: 'Text hier eingeben',\n    error: 'Fehler',\n    exit: 'Beenden',\n    fieldRequiredError: 'Dieses Feld ist erforderlich.',\n    invalidEmailError: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',\n    less: 'Weniger',\n    loading: 'Lädt',\n    maxLengthError: 'Maximale Länge überschritten.',\n    minLengthError: 'Mindestlänge nicht erreicht.',\n    more: 'Mehr',\n    next: 'Weiter',\n    no: 'Nein',\n    none: 'Nichts',\n    of: 'von',\n    optional: 'Optional',\n    pleaseWait: 'Bitte warten...',\n    previous: 'Vorherige',\n    remove: 'Entfernen',\n    required: 'Erforderlich',\n    reset: 'Zurücksetzen',\n    save: 'Speichern',\n    saved: 'Gespeichert',\n    search: 'Suche',\n    select: 'Select',\n    selectOption: 'Option auswählen',\n    show: 'Anzeigen',\n    showMore: 'Mehr anzeigen',\n    showLess: 'Weniger anzeigen',\n    submit: 'Abschicken',\n    success: 'Erfolg',\n    update: 'Update',\n    unsavedChanges: 'Ungespeicherte Änderungen',\n    unsavedChangesSaveQuestion: 'Möchtest du die Änderungen speichern?',\n    yes: 'Ja',\n  }\n}\n"],"mappings":"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","names":["import_react","import_jsx_runtime","clsx"]}

package/dist/components/layout-and-navigation/TextImage.mjs

@@ -91,6 +91,7 @@ import clsx from "clsx";
 // src/localization/defaults/form.ts
 var formTranslation = {
   en: {
+    add: "Add",
     all: "All",
     apply: "Apply",
     back: "Back",
@@ -103,6 +104,7 @@ var formTranslation = {
     confirm: "Confirm",
     copy: "Copy",
     copied: "Copied",
+    create: "Create",
     decline: "Decline",
     delete: "Delete",
     discard: "Discard",
@@ -145,6 +147,7 @@ var formTranslation = {
     yes: "Yes"
   },
   de: {
+    add: "Hinzuf\xFCgen",
     all: "Alle",
     apply: "Anwenden",
     back: "Zur\xFCck",
@@ -157,6 +160,7 @@ var formTranslation = {
     confirm: "Best\xE4tigen",
     copy: "Kopieren",
     copied: "Kopiert",
+    create: "Erstellen",
     decline: "Ablehnen",
     delete: "L\xF6schen",
     discard: "Verwerfen",
@@ -235,14 +239,14 @@ var TextImage = ({
       children: /* @__PURE__ */ jsxs(
         "div",
         {
-          className: clsx(`col px-6 py-12 rounded-2xl h-full`, colorMapping[color], contentClassName),
+          className: clsx(`flex-col-2 px-6 py-12 rounded-2xl h-full`, colorMapping[color], contentClassName),
           children: [
             badge && /* @__PURE__ */ jsx2("div", { className: clsx(`chip-full mb-2 py-2 px-4 w-fit`, chipColorMapping[color]), children: /* @__PURE__ */ jsx2("span", { className: "text-lg font-bold", children: badge }) }),
-            /* @__PURE__ */ jsxs("div", { className: "col gap-y-1 overflow-hidden", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex-col-1 overflow-hidden", children: [
               /* @__PURE__ */ jsx2("span", { className: "textstyle-title-xl", children: title }),
               /* @__PURE__ */ jsx2("span", { className: "text-ellipsis overflow-hidden", children: description })
             ] }),
-            onShowMoreClicked && /* @__PURE__ */ jsx2("div", { className: "row mt-2 underline", children: /* @__PURE__ */ jsx2("button", { onClick: onShowMoreClicked, children: translation("showMore") }) })
+            onShowMoreClicked && /* @__PURE__ */ jsx2("div", { className: "flex-row-2 mt-2 underline", children: /* @__PURE__ */ jsx2("button", { onClick: onShowMoreClicked, children: translation("showMore") }) })
           ]
         }
       )

package/dist/components/layout-and-navigation/TextImage.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts","../../../src/components/layout-and-navigation/TextImage.tsx","../../../src/localization/defaults/form.ts"],"sourcesContent":["import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n  language: Language,\n  setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n  language: LanguageUtil.DEFAULT_LANGUAGE,\n  setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n  const { language } = useLanguage()\n  const mapping: Record<Language, string> = {\n    en: 'en-US',\n    de: 'de-DE'\n  }\n  return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n  initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n  const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n  const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n  useEffect(() => {\n    if (language !== initialLanguage && initialLanguage) {\n      console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n      setLanguage(initialLanguage)\n    }\n  }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    // TODO set locale of html tag here as well\n    setStoredLanguage(language)\n  }, [language, setStoredLanguage])\n\n  useEffect(() => {\n    if (storedLanguage !== null) {\n      setLanguage(storedLanguage)\n      return\n    }\n\n    const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n    const matchingBrowserLanguage = window.navigator.languages\n      .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n      .filter(entry => entry !== undefined)\n\n    if (matchingBrowserLanguage.length === 0) return\n\n    const firstMatch = matchingBrowserLanguage[0] as Language\n    setLanguage(firstMatch)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <LanguageContext.Provider value={{\n      language,\n      setLanguage\n    }}>\n      {children}\n    </LanguageContext.Provider>\n  )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return initValue\n    }\n    const storageService = new LocalStorageService()\n    const value = storageService.get<T>(key)\n    return value || initValue\n  }, [initValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(value => {\n    const newValue = value instanceof Function ? value(storedValue) : value\n    const storageService = new LocalStorageService()\n    storageService.set(key, value)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  useEffect(() => {\n    setStoredValue(get())\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n  en: 'English',\n  de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n  languages,\n  DEFAULT_LANGUAGE,\n  languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\n/**\n * A type describing the pluralization of a word\n */\nexport type TranslationPlural = {\n  zero?: string,\n  one?: string,\n  two?: string,\n  few?: string,\n  many?: string,\n  other: string,\n}\n\n/**\n * The type describing all values of a translation\n */\nexport type TranslationType = Record<string, string | TranslationPlural>\n\n/**\n * The type of translations\n */\nexport type Translation<T extends TranslationType> = Record<Language, T>\n\ntype OverwriteTranslationType<T extends TranslationType> = {\n  language?: Language,\n  translation?: Translation<Partial<T>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n *              if you don't expect any other props other than `language` and get an\n *              error when using your component (because it uses `forwardRef` etc.)\n *              you can try out `Record<string, unknown>`, this might resolve your\n *              problem as `SomeType & never` is still `never` but `SomeType & unknown`\n *              is `SomeType` which means that adding back props (like `ref` etc.)\n *              works properly\n */\nexport type PropsForTranslation<\n  Translation extends TranslationType,\n  Props = unknown\n> = Props & {\n  overwriteTranslation?: OverwriteTranslationType<Translation>,\n}\n\ntype StringKeys<T> = Extract<keyof T, string>;\n\ntype TranslationFunctionOptions = {\n  replacements?: Record<string, string>,\n  count?: number,\n}\ntype TranslationFunction<T extends TranslationType> = (key: StringKeys<T>, options?: TranslationFunctionOptions) => string\n\nexport const TranslationPluralCount = {\n  zero: 0,\n  one: 1,\n  two: 2,\n  few: 3,\n  many: 11,\n  other: -1,\n}\n\n\nexport const useTranslation = <T extends TranslationType>(\n  translations: Translation<Partial<TranslationType>>[],\n  overwriteTranslation: OverwriteTranslationType<T> = {}\n): TranslationFunction<T> => {\n  const { language: languageProp, translation: overwrite } = overwriteTranslation\n  const { language: inferredLanguage } = useLanguage()\n  const usedLanguage = languageProp ?? inferredLanguage\n  const usedTranslations = [...translations]\n  if (overwrite) {\n    usedTranslations.push(overwrite)\n  }\n\n  return (key: StringKeys<T>, options?: TranslationFunctionOptions): string => {\n    const { count, replacements } = { ...{ count: 0, replacements: {} }, ...options }\n\n    try {\n      for (let i = translations.length - 1; i >= 0; i--) {\n        const translation = translations[i]\n        const localizedTranslation = translation[usedLanguage]\n        if (!localizedTranslation) {\n          continue\n        }\n        const value = localizedTranslation[key]\n        if(!value) {\n          continue\n        }\n\n        let forProcessing: string\n        if (typeof value !== 'string') {\n          if (count === TranslationPluralCount.zero && value?.zero) {\n            forProcessing = value.zero\n          } else if (count === TranslationPluralCount.one && value?.one) {\n            forProcessing = value.one\n          } else if (count === TranslationPluralCount.two && value?.two) {\n            forProcessing = value.two\n          } else if (TranslationPluralCount.few <= count && count < TranslationPluralCount.many && value?.few) {\n            forProcessing = value.few\n          } else if (count > TranslationPluralCount.many && value?.many) {\n            forProcessing = value.many\n          } else {\n            forProcessing = value.other\n          }\n        } else {\n          forProcessing = value\n        }\n        forProcessing = forProcessing.replace(/\\{\\{(\\w+)}}/g, (_, placeholder) => {\n          return replacements[placeholder] ?? `{{key:${placeholder}}}` // fallback if key is missing\n        })\n        return forProcessing\n      }\n    } catch (e) {\n      console.error(e)\n    }\n    return `{{${usedLanguage}:${key}}}`\n  }\n}","import type { PropsForTranslation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport clsx from 'clsx'\nimport type { FormTranslationType } from '../../localization/defaults/form'\nimport { formTranslation } from '../../localization/defaults/form'\n\ntype TextImageColor = 'primary' | 'secondary' | 'dark'\n\ntype TextImageTranslation = FormTranslationType\n\nexport type TextImageProps = {\n  title: string,\n  description: string,\n  imageUrl: string,\n  onShowMoreClicked?: () => void,\n  color?: TextImageColor,\n  badge?: string,\n  contentClassName?: string,\n  className?: string,\n}\n\n/**\n * A Component for layering a Text upon an image\n */\nexport const TextImage = ({\n                            overwriteTranslation,\n                            title,\n                            description,\n                            imageUrl,\n                            onShowMoreClicked,\n                            color = 'primary',\n                            badge,\n                            contentClassName = '',\n                            className = '',\n                          }: PropsForTranslation<TextImageTranslation, TextImageProps>) => {\n  const translation = useTranslation([formTranslation], overwriteTranslation)\n\n  const chipColorMapping: Record<TextImageColor, string> = {\n    primary: 'text-text-image-primary-background bg-text-image-primary-text',\n    secondary: 'text-text-image-secondary-background bg-text-image-secondary-text',\n    dark: 'text-text-image-dark-background bg-text-image-dark-text',\n  }\n\n  const colorMapping: Record<TextImageColor, string> = {\n    primary: 'text-text-image-primary-text bg-linear-to-r from-30% from-text-image-primary-background to-text-image-primary-background/55',\n    secondary: 'text-text-image-secondary-text bg-linear-to-r from-30% from-text-image-secondary-background to-text-image-secondary-background/55',\n    dark: 'text-text-image-dark-text bg-linear-to-r from-30% from-text-image-dark-background to-text-image-dark-background/55',\n  }\n\n  return (\n    <div\n      className={clsx('rounded-2xl w-full', className)}\n      style={{\n        backgroundImage: `url(${imageUrl})`,\n        backgroundSize: 'cover',\n      }}>\n      <div\n        className={clsx(`col px-6 py-12 rounded-2xl h-full`, colorMapping[color], contentClassName)}\n      >\n        {badge && (\n          <div className={clsx(`chip-full mb-2 py-2 px-4 w-fit`, chipColorMapping[color])}>\n            <span className=\"text-lg font-bold\">{badge}</span>\n          </div>\n        )}\n        <div className=\"col gap-y-1 overflow-hidden\">\n          <span className=\"textstyle-title-xl\">{title}</span>\n          <span className=\"text-ellipsis overflow-hidden\">{description}</span>\n        </div>\n        {onShowMoreClicked && (\n          <div className=\"row mt-2 underline\">\n            <button onClick={onShowMoreClicked}>{translation('showMore')}</button>\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n","import type { Translation } from '../useTranslation'\n\nexport type FormTranslationType = {\n  all: string,\n  apply: string,\n  back: string,\n  cancel: string,\n  change: string,\n  clear: string,\n  click: string,\n  clickToCopy: string,\n  close: string,\n  confirm: string,\n  copy: string,\n  copied: string,\n  decline: string,\n  delete: string,\n  discard: string,\n  discardChanges: string,\n  done: string,\n  edit: string,\n  enterText: string,\n  error: string,\n  exit: string,\n  fieldRequiredError: string,\n  invalidEmailError: string,\n  less: string,\n  loading: string,\n  maxLengthError: string,\n  minLengthError: string,\n  more: string,\n  next: string,\n  no: string,\n  none: string,\n  of: string,\n  optional: string,\n  pleaseWait: string,\n  previous: string,\n  remove: string,\n  required: string,\n  reset: string,\n  save: string,\n  saved: string,\n  search: string,\n  select: string,\n  selectOption: string,\n  show: string,\n  showMore: string,\n  showLess: string,\n  submit: string,\n  success: string,\n  unsavedChanges: string,\n  unsavedChangesSaveQuestion: string,\n  update: string,\n  yes: string,\n}\n\nexport const formTranslation: Translation<FormTranslationType> = {\n  en: {\n    all: 'All',\n    apply: 'Apply',\n    back: 'Back',\n    cancel: 'Cancel',\n    change: 'Change',\n    clear: 'Clear',\n    click: 'Click',\n    clickToCopy: 'Click to Copy',\n    close: 'Close',\n    confirm: 'Confirm',\n    copy: 'Copy',\n    copied: 'Copied',\n    decline: 'Decline',\n    delete: 'Delete',\n    discard: 'Discard',\n    discardChanges: 'Discard Changes',\n    done: 'Done',\n    edit: 'Edit',\n    enterText: 'Enter text here',\n    error: 'Error',\n    exit: 'Exit',\n    fieldRequiredError: 'This field is required.',\n    invalidEmailError: 'Please enter a valid email address.',\n    less: 'Less',\n    loading: 'Loading',\n    maxLengthError: 'Maximum length exceeded.',\n    minLengthError: 'Minimum length not met.',\n    more: 'More',\n    next: 'Next',\n    no: 'No',\n    none: 'None',\n    of: 'of',\n    optional: 'Optional',\n    pleaseWait: 'Please wait...',\n    previous: 'Previous',\n    remove: 'Remove',\n    required: 'Required',\n    reset: 'Reset',\n    save: 'Save',\n    saved: 'Saved',\n    search: 'Search',\n    select: 'Select',\n    selectOption: 'Select an option',\n    show: 'Show',\n    showMore: 'Show more',\n    showLess: 'Show less',\n    submit: 'Submit',\n    success: 'Success',\n    update: 'Update',\n    unsavedChanges: 'Unsaved Changes',\n    unsavedChangesSaveQuestion: 'Do you want to save your changes?',\n    yes: 'Yes',\n  },\n  de: {\n    all: 'Alle',\n    apply: 'Anwenden',\n    back: 'Zurück',\n    cancel: 'Abbrechen',\n    change: 'Ändern',\n    clear: 'Löschen',\n    click: 'Klicken',\n    clickToCopy: 'Zum kopieren klicken',\n    close: 'Schließen',\n    confirm: 'Bestätigen',\n    copy: 'Kopieren',\n    copied: 'Kopiert',\n    decline: 'Ablehnen',\n    delete: 'Löschen',\n    discard: 'Verwerfen',\n    discardChanges: 'Änderungen Verwerfen',\n    done: 'Fertig',\n    edit: 'Bearbeiten',\n    enterText: 'Text hier eingeben',\n    error: 'Fehler',\n    exit: 'Beenden',\n    fieldRequiredError: 'Dieses Feld ist erforderlich.',\n    invalidEmailError: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',\n    less: 'Weniger',\n    loading: 'Lädt',\n    maxLengthError: 'Maximale Länge überschritten.',\n    minLengthError: 'Mindestlänge nicht erreicht.',\n    more: 'Mehr',\n    next: 'Weiter',\n    no: 'Nein',\n    none: 'Nichts',\n    of: 'von',\n    optional: 'Optional',\n    pleaseWait: 'Bitte warten...',\n    previous: 'Vorherige',\n    remove: 'Entfernen',\n    required: 'Erforderlich',\n    reset: 'Zurücksetzen',\n    save: 'Speichern',\n    saved: 'Gespeichert',\n    search: 'Suche',\n    select: 'Select',\n    selectOption: 'Option auswählen',\n    show: 'Anzeigen',\n    showMore: 'Mehr anzeigen',\n    showLess: 'Weniger anzeigen',\n    submit: 'Abschicken',\n    success: 'Erfolg',\n    update: 'Update',\n    unsavedChanges: 'Ungespeicherte Änderungen',\n    unsavedChangesSaveQuestion: 'Möchtest du die Änderungen speichern?',\n    yes: 'Ja',\n  }\n}\n"],"mappings":"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","names":["useEffect","useState","jsx"]}
+{"version":3,"sources":["../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts","../../../src/components/layout-and-navigation/TextImage.tsx","../../../src/localization/defaults/form.ts"],"sourcesContent":["import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n  language: Language,\n  setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n  language: LanguageUtil.DEFAULT_LANGUAGE,\n  setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n  const { language } = useLanguage()\n  const mapping: Record<Language, string> = {\n    en: 'en-US',\n    de: 'de-DE'\n  }\n  return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n  initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n  const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n  const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n  useEffect(() => {\n    if (language !== initialLanguage && initialLanguage) {\n      console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n      setLanguage(initialLanguage)\n    }\n  }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    // TODO set locale of html tag here as well\n    setStoredLanguage(language)\n  }, [language, setStoredLanguage])\n\n  useEffect(() => {\n    if (storedLanguage !== null) {\n      setLanguage(storedLanguage)\n      return\n    }\n\n    const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n    const matchingBrowserLanguage = window.navigator.languages\n      .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n      .filter(entry => entry !== undefined)\n\n    if (matchingBrowserLanguage.length === 0) return\n\n    const firstMatch = matchingBrowserLanguage[0] as Language\n    setLanguage(firstMatch)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <LanguageContext.Provider value={{\n      language,\n      setLanguage\n    }}>\n      {children}\n    </LanguageContext.Provider>\n  )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return initValue\n    }\n    const storageService = new LocalStorageService()\n    const value = storageService.get<T>(key)\n    return value || initValue\n  }, [initValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(value => {\n    const newValue = value instanceof Function ? value(storedValue) : value\n    const storageService = new LocalStorageService()\n    storageService.set(key, value)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  useEffect(() => {\n    setStoredValue(get())\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n  en: 'English',\n  de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n  languages,\n  DEFAULT_LANGUAGE,\n  languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\n/**\n * A type describing the pluralization of a word\n */\nexport type TranslationPlural = {\n  zero?: string,\n  one?: string,\n  two?: string,\n  few?: string,\n  many?: string,\n  other: string,\n}\n\n/**\n * The type describing all values of a translation\n */\nexport type TranslationType = Record<string, string | TranslationPlural>\n\n/**\n * The type of translations\n */\nexport type Translation<T extends TranslationType> = Record<Language, T>\n\ntype OverwriteTranslationType<T extends TranslationType> = {\n  language?: Language,\n  translation?: Translation<Partial<T>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n *              if you don't expect any other props other than `language` and get an\n *              error when using your component (because it uses `forwardRef` etc.)\n *              you can try out `Record<string, unknown>`, this might resolve your\n *              problem as `SomeType & never` is still `never` but `SomeType & unknown`\n *              is `SomeType` which means that adding back props (like `ref` etc.)\n *              works properly\n */\nexport type PropsForTranslation<\n  Translation extends TranslationType,\n  Props = unknown\n> = Props & {\n  overwriteTranslation?: OverwriteTranslationType<Translation>,\n}\n\ntype StringKeys<T> = Extract<keyof T, string>;\n\ntype TranslationFunctionOptions = {\n  replacements?: Record<string, string>,\n  count?: number,\n}\ntype TranslationFunction<T extends TranslationType> = (key: StringKeys<T>, options?: TranslationFunctionOptions) => string\n\nexport const TranslationPluralCount = {\n  zero: 0,\n  one: 1,\n  two: 2,\n  few: 3,\n  many: 11,\n  other: -1,\n}\n\n\nexport const useTranslation = <T extends TranslationType>(\n  translations: Translation<Partial<TranslationType>>[],\n  overwriteTranslation: OverwriteTranslationType<T> = {}\n): TranslationFunction<T> => {\n  const { language: languageProp, translation: overwrite } = overwriteTranslation\n  const { language: inferredLanguage } = useLanguage()\n  const usedLanguage = languageProp ?? inferredLanguage\n  const usedTranslations = [...translations]\n  if (overwrite) {\n    usedTranslations.push(overwrite)\n  }\n\n  return (key: StringKeys<T>, options?: TranslationFunctionOptions): string => {\n    const { count, replacements } = { ...{ count: 0, replacements: {} }, ...options }\n\n    try {\n      for (let i = translations.length - 1; i >= 0; i--) {\n        const translation = translations[i]\n        const localizedTranslation = translation[usedLanguage]\n        if (!localizedTranslation) {\n          continue\n        }\n        const value = localizedTranslation[key]\n        if(!value) {\n          continue\n        }\n\n        let forProcessing: string\n        if (typeof value !== 'string') {\n          if (count === TranslationPluralCount.zero && value?.zero) {\n            forProcessing = value.zero\n          } else if (count === TranslationPluralCount.one && value?.one) {\n            forProcessing = value.one\n          } else if (count === TranslationPluralCount.two && value?.two) {\n            forProcessing = value.two\n          } else if (TranslationPluralCount.few <= count && count < TranslationPluralCount.many && value?.few) {\n            forProcessing = value.few\n          } else if (count > TranslationPluralCount.many && value?.many) {\n            forProcessing = value.many\n          } else {\n            forProcessing = value.other\n          }\n        } else {\n          forProcessing = value\n        }\n        forProcessing = forProcessing.replace(/\\{\\{(\\w+)}}/g, (_, placeholder) => {\n          return replacements[placeholder] ?? `{{key:${placeholder}}}` // fallback if key is missing\n        })\n        return forProcessing\n      }\n    } catch (e) {\n      console.error(e)\n    }\n    return `{{${usedLanguage}:${key}}}`\n  }\n}","import type { PropsForTranslation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport clsx from 'clsx'\nimport type { FormTranslationType } from '../../localization/defaults/form'\nimport { formTranslation } from '../../localization/defaults/form'\n\ntype TextImageColor = 'primary' | 'secondary' | 'dark'\n\ntype TextImageTranslation = FormTranslationType\n\nexport type TextImageProps = {\n  title: string,\n  description: string,\n  imageUrl: string,\n  onShowMoreClicked?: () => void,\n  color?: TextImageColor,\n  badge?: string,\n  contentClassName?: string,\n  className?: string,\n}\n\n/**\n * A Component for layering a Text upon an image\n */\nexport const TextImage = ({\n                            overwriteTranslation,\n                            title,\n                            description,\n                            imageUrl,\n                            onShowMoreClicked,\n                            color = 'primary',\n                            badge,\n                            contentClassName = '',\n                            className = '',\n                          }: PropsForTranslation<TextImageTranslation, TextImageProps>) => {\n  const translation = useTranslation([formTranslation], overwriteTranslation)\n\n  const chipColorMapping: Record<TextImageColor, string> = {\n    primary: 'text-text-image-primary-background bg-text-image-primary-text',\n    secondary: 'text-text-image-secondary-background bg-text-image-secondary-text',\n    dark: 'text-text-image-dark-background bg-text-image-dark-text',\n  }\n\n  const colorMapping: Record<TextImageColor, string> = {\n    primary: 'text-text-image-primary-text bg-linear-to-r from-30% from-text-image-primary-background to-text-image-primary-background/55',\n    secondary: 'text-text-image-secondary-text bg-linear-to-r from-30% from-text-image-secondary-background to-text-image-secondary-background/55',\n    dark: 'text-text-image-dark-text bg-linear-to-r from-30% from-text-image-dark-background to-text-image-dark-background/55',\n  }\n\n  return (\n    <div\n      className={clsx('rounded-2xl w-full', className)}\n      style={{\n        backgroundImage: `url(${imageUrl})`,\n        backgroundSize: 'cover',\n      }}>\n      <div\n        className={clsx(`flex-col-2 px-6 py-12 rounded-2xl h-full`, colorMapping[color], contentClassName)}\n      >\n        {badge && (\n          <div className={clsx(`chip-full mb-2 py-2 px-4 w-fit`, chipColorMapping[color])}>\n            <span className=\"text-lg font-bold\">{badge}</span>\n          </div>\n        )}\n        <div className=\"flex-col-1 overflow-hidden\">\n          <span className=\"textstyle-title-xl\">{title}</span>\n          <span className=\"text-ellipsis overflow-hidden\">{description}</span>\n        </div>\n        {onShowMoreClicked && (\n          <div className=\"flex-row-2 mt-2 underline\">\n            <button onClick={onShowMoreClicked}>{translation('showMore')}</button>\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n","import type { Translation } from '../useTranslation'\n\nexport type FormTranslationType = {\n  add: string,\n  all: string,\n  apply: string,\n  back: string,\n  cancel: string,\n  change: string,\n  clear: string,\n  click: string,\n  clickToCopy: string,\n  close: string,\n  confirm: string,\n  copy: string,\n  copied: string,\n  create: string,\n  decline: string,\n  delete: string,\n  discard: string,\n  discardChanges: string,\n  done: string,\n  edit: string,\n  enterText: string,\n  error: string,\n  exit: string,\n  fieldRequiredError: string,\n  invalidEmailError: string,\n  less: string,\n  loading: string,\n  maxLengthError: string,\n  minLengthError: string,\n  more: string,\n  next: string,\n  no: string,\n  none: string,\n  of: string,\n  optional: string,\n  pleaseWait: string,\n  previous: string,\n  remove: string,\n  required: string,\n  reset: string,\n  save: string,\n  saved: string,\n  search: string,\n  select: string,\n  selectOption: string,\n  show: string,\n  showMore: string,\n  showLess: string,\n  submit: string,\n  success: string,\n  unsavedChanges: string,\n  unsavedChangesSaveQuestion: string,\n  update: string,\n  yes: string,\n}\n\nexport const formTranslation: Translation<FormTranslationType> = {\n  en: {\n    add: 'Add',\n    all: 'All',\n    apply: 'Apply',\n    back: 'Back',\n    cancel: 'Cancel',\n    change: 'Change',\n    clear: 'Clear',\n    click: 'Click',\n    clickToCopy: 'Click to Copy',\n    close: 'Close',\n    confirm: 'Confirm',\n    copy: 'Copy',\n    copied: 'Copied',\n    create: 'Create',\n    decline: 'Decline',\n    delete: 'Delete',\n    discard: 'Discard',\n    discardChanges: 'Discard Changes',\n    done: 'Done',\n    edit: 'Edit',\n    enterText: 'Enter text here',\n    error: 'Error',\n    exit: 'Exit',\n    fieldRequiredError: 'This field is required.',\n    invalidEmailError: 'Please enter a valid email address.',\n    less: 'Less',\n    loading: 'Loading',\n    maxLengthError: 'Maximum length exceeded.',\n    minLengthError: 'Minimum length not met.',\n    more: 'More',\n    next: 'Next',\n    no: 'No',\n    none: 'None',\n    of: 'of',\n    optional: 'Optional',\n    pleaseWait: 'Please wait...',\n    previous: 'Previous',\n    remove: 'Remove',\n    required: 'Required',\n    reset: 'Reset',\n    save: 'Save',\n    saved: 'Saved',\n    search: 'Search',\n    select: 'Select',\n    selectOption: 'Select an option',\n    show: 'Show',\n    showMore: 'Show more',\n    showLess: 'Show less',\n    submit: 'Submit',\n    success: 'Success',\n    update: 'Update',\n    unsavedChanges: 'Unsaved Changes',\n    unsavedChangesSaveQuestion: 'Do you want to save your changes?',\n    yes: 'Yes',\n  },\n  de: {\n    add: 'Hinzufügen',\n    all: 'Alle',\n    apply: 'Anwenden',\n    back: 'Zurück',\n    cancel: 'Abbrechen',\n    change: 'Ändern',\n    clear: 'Löschen',\n    click: 'Klicken',\n    clickToCopy: 'Zum kopieren klicken',\n    close: 'Schließen',\n    confirm: 'Bestätigen',\n    copy: 'Kopieren',\n    copied: 'Kopiert',\n    create: 'Erstellen',\n    decline: 'Ablehnen',\n    delete: 'Löschen',\n    discard: 'Verwerfen',\n    discardChanges: 'Änderungen Verwerfen',\n    done: 'Fertig',\n    edit: 'Bearbeiten',\n    enterText: 'Text hier eingeben',\n    error: 'Fehler',\n    exit: 'Beenden',\n    fieldRequiredError: 'Dieses Feld ist erforderlich.',\n    invalidEmailError: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',\n    less: 'Weniger',\n    loading: 'Lädt',\n    maxLengthError: 'Maximale Länge überschritten.',\n    minLengthError: 'Mindestlänge nicht erreicht.',\n    more: 'Mehr',\n    next: 'Weiter',\n    no: 'Nein',\n    none: 'Nichts',\n    of: 'von',\n    optional: 'Optional',\n    pleaseWait: 'Bitte warten...',\n    previous: 'Vorherige',\n    remove: 'Entfernen',\n    required: 'Erforderlich',\n    reset: 'Zurücksetzen',\n    save: 'Speichern',\n    saved: 'Gespeichert',\n    search: 'Suche',\n    select: 'Select',\n    selectOption: 'Option auswählen',\n    show: 'Anzeigen',\n    showMore: 'Mehr anzeigen',\n    showLess: 'Weniger anzeigen',\n    submit: 'Abschicken',\n    success: 'Erfolg',\n    update: 'Update',\n    unsavedChanges: 'Ungespeicherte Änderungen',\n    unsavedChangesSaveQuestion: 'Möchtest du die Änderungen speichern?',\n    yes: 'Ja',\n  }\n}\n"],"mappings":"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","names":["useEffect","useState","jsx"]}

package/dist/components/layout-and-navigation/Tile.d.mts

@@ -11,7 +11,7 @@ type TileProps = {
         className?: string;
     };
     onClick?: () => void;
-    isDisabled?: boolean;
+    disabled?: boolean;
     isSelected?: boolean;
     prefix?: ReactNode;
     suffix?: ReactNode;
@@ -23,6 +23,6 @@ type TileProps = {
 /**
  * A component for creating a tile similar to the flutter ListTile
  */
-declare const Tile: ({ title, description, onClick, isSelected, isDisabled, prefix, suffix, normalClassName, selectedClassName, disabledClassName, className }: TileProps) => react_jsx_runtime.JSX.Element;
+declare const Tile: ({ title, description, onClick, isSelected, disabled, prefix, suffix, normalClassName, selectedClassName, disabledClassName, className }: TileProps) => react_jsx_runtime.JSX.Element;
 
 export { Tile, type TileProps };

package/dist/components/layout-and-navigation/Tile.d.ts

@@ -11,7 +11,7 @@ type TileProps = {
         className?: string;
     };
     onClick?: () => void;
-    isDisabled?: boolean;
+    disabled?: boolean;
     isSelected?: boolean;
     prefix?: ReactNode;
     suffix?: ReactNode;
@@ -23,6 +23,6 @@ type TileProps = {
 /**
  * A component for creating a tile similar to the flutter ListTile
  */
-declare const Tile: ({ title, description, onClick, isSelected, isDisabled, prefix, suffix, normalClassName, selectedClassName, disabledClassName, className }: TileProps) => react_jsx_runtime.JSX.Element;
+declare const Tile: ({ title, description, onClick, isSelected, disabled, prefix, suffix, normalClassName, selectedClassName, disabledClassName, className }: TileProps) => react_jsx_runtime.JSX.Element;
 
 export { Tile, type TileProps };

package/dist/components/layout-and-navigation/Tile.js

@@ -40,7 +40,7 @@ var Tile = ({
   description,
   onClick,
   isSelected = false,
-  isDisabled = false,
+  disabled = false,
   prefix,
   suffix,
   normalClassName = "hover:bg-primary/40 cursor-pointer",
@@ -52,18 +52,18 @@ var Tile = ({
     "div",
     {
       className: (0, import_clsx.default)(
-        "row gap-x-2 w-full items-center",
+        "flex-row-2 w-full items-center",
         {
-          [normalClassName]: !!onClick && !isDisabled,
-          [selectedClassName]: isSelected && !isDisabled,
-          [disabledClassName]: isDisabled
+          [normalClassName]: !!onClick && !disabled,
+          [selectedClassName]: isSelected && !disabled,
+          [disabledClassName]: disabled
         },
         className
       ),
-      onClick: isDisabled ? void 0 : onClick,
+      onClick: disabled ? void 0 : onClick,
       children: [
         prefix,
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "col gap-y-0 w-full", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex-col-0 w-full", children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h4", { className: (0, import_clsx.default)(title.className ?? "textstyle-title-normal"), children: title.value }),
           !!description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_clsx.default)(description.className ?? "textstyle-description"), children: description.value })
         ] }),

package/dist/components/layout-and-navigation/Tile.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/layout-and-navigation/Tile.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport clsx from 'clsx'\nimport { Check } from 'lucide-react'\n\nexport type TileProps = {\n  title: { value: ReactNode, className?: string },\n  description?: { value: ReactNode, className?: string },\n  onClick?: () => void,\n  isDisabled?: boolean,\n  isSelected?: boolean,\n  prefix?: ReactNode,\n  suffix?: ReactNode,\n  className?: string,\n  normalClassName?: string,\n  selectedClassName?: string,\n  disabledClassName?: string,\n}\n\n/**\n * A component for creating a tile similar to the flutter ListTile\n */\nexport const Tile = ({\n                       title,\n                       description,\n                       onClick,\n                       isSelected = false,\n                       isDisabled = false,\n                       prefix,\n                       suffix,\n                       normalClassName = 'hover:bg-primary/40 cursor-pointer',\n                       selectedClassName = ' bg-primary/20',\n                       disabledClassName = 'text-disabled-text bg-disabled-background cursor-not-allowed',\n                       className\n                     }: TileProps) => {\n  return (\n    <div\n      className={clsx(\n        'row gap-x-2 w-full items-center',\n        {\n          [normalClassName]: !!onClick && !isDisabled,\n          [selectedClassName]: isSelected && !isDisabled,\n          [disabledClassName]: isDisabled,\n        },\n        className\n      )}\n      onClick={isDisabled ? undefined : onClick}\n    >\n      {prefix}\n      <div className=\"col gap-y-0 w-full\">\n        <h4 className={clsx(title.className ?? 'textstyle-title-normal')}>{title.value}</h4>\n        {!!description &&\n          <span className={clsx(description.className ?? 'textstyle-description')}>{description.value}</span>}\n      </div>\n      {suffix ?? (isSelected ? (<Check size={24}/>) : undefined)}\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,kBAAiB;AACjB,0BAAsB;AA8ChB;AA3BC,IAAM,OAAO,CAAC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB;AACF,MAAiB;AACpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,YAAAA;AAAA,QACT;AAAA,QACA;AAAA,UACE,CAAC,eAAe,GAAG,CAAC,CAAC,WAAW,CAAC;AAAA,UACjC,CAAC,iBAAiB,GAAG,cAAc,CAAC;AAAA,UACpC,CAAC,iBAAiB,GAAG;AAAA,QACvB;AAAA,QACA;AAAA,MACF;AAAA,MACA,SAAS,aAAa,SAAY;AAAA,MAEjC;AAAA;AAAA,QACD,6CAAC,SAAI,WAAU,sBACb;AAAA,sDAAC,QAAG,eAAW,YAAAA,SAAK,MAAM,aAAa,wBAAwB,GAAI,gBAAM,OAAM;AAAA,UAC9E,CAAC,CAAC,eACD,4CAAC,UAAK,eAAW,YAAAA,SAAK,YAAY,aAAa,uBAAuB,GAAI,sBAAY,OAAM;AAAA,WAChG;AAAA,QACC,WAAW,aAAc,4CAAC,6BAAM,MAAM,IAAG,IAAM;AAAA;AAAA;AAAA,EAClD;AAEJ;","names":["clsx"]}
+{"version":3,"sources":["../../../src/components/layout-and-navigation/Tile.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport clsx from 'clsx'\nimport { Check } from 'lucide-react'\n\nexport type TileProps = {\n  title: { value: ReactNode, className?: string },\n  description?: { value: ReactNode, className?: string },\n  onClick?: () => void,\n  disabled?: boolean,\n  isSelected?: boolean,\n  prefix?: ReactNode,\n  suffix?: ReactNode,\n  className?: string,\n  normalClassName?: string,\n  selectedClassName?: string,\n  disabledClassName?: string,\n}\n\n/**\n * A component for creating a tile similar to the flutter ListTile\n */\nexport const Tile = ({\n                       title,\n                       description,\n                       onClick,\n                       isSelected = false,\n                       disabled = false,\n                       prefix,\n                       suffix,\n                       normalClassName = 'hover:bg-primary/40 cursor-pointer',\n                       selectedClassName = ' bg-primary/20',\n                       disabledClassName = 'text-disabled-text bg-disabled-background cursor-not-allowed',\n                       className\n                     }: TileProps) => {\n  return (\n    <div\n      className={clsx(\n        'flex-row-2 w-full items-center',\n        {\n          [normalClassName]: !!onClick && !disabled,\n          [selectedClassName]: isSelected && !disabled,\n          [disabledClassName]: disabled,\n        },\n        className\n      )}\n      onClick={disabled ? undefined : onClick}\n    >\n      {prefix}\n      <div className=\"flex-col-0 w-full\">\n        <h4 className={clsx(title.className ?? 'textstyle-title-normal')}>{title.value}</h4>\n        {!!description &&\n          <span className={clsx(description.className ?? 'textstyle-description')}>{description.value}</span>}\n      </div>\n      {suffix ?? (isSelected ? (<Check size={24}/>) : undefined)}\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,kBAAiB;AACjB,0BAAsB;AA8ChB;AA3BC,IAAM,OAAO,CAAC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB;AACF,MAAiB;AACpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,YAAAA;AAAA,QACT;AAAA,QACA;AAAA,UACE,CAAC,eAAe,GAAG,CAAC,CAAC,WAAW,CAAC;AAAA,UACjC,CAAC,iBAAiB,GAAG,cAAc,CAAC;AAAA,UACpC,CAAC,iBAAiB,GAAG;AAAA,QACvB;AAAA,QACA;AAAA,MACF;AAAA,MACA,SAAS,WAAW,SAAY;AAAA,MAE/B;AAAA;AAAA,QACD,6CAAC,SAAI,WAAU,qBACb;AAAA,sDAAC,QAAG,eAAW,YAAAA,SAAK,MAAM,aAAa,wBAAwB,GAAI,gBAAM,OAAM;AAAA,UAC9E,CAAC,CAAC,eACD,4CAAC,UAAK,eAAW,YAAAA,SAAK,YAAY,aAAa,uBAAuB,GAAI,sBAAY,OAAM;AAAA,WAChG;AAAA,QACC,WAAW,aAAc,4CAAC,6BAAM,MAAM,IAAG,IAAM;AAAA;AAAA;AAAA,EAClD;AAEJ;","names":["clsx"]}

package/dist/components/layout-and-navigation/Tile.mjs

@@ -7,7 +7,7 @@ var Tile = ({
   description,
   onClick,
   isSelected = false,
-  isDisabled = false,
+  disabled = false,
   prefix,
   suffix,
   normalClassName = "hover:bg-primary/40 cursor-pointer",
@@ -19,18 +19,18 @@ var Tile = ({
     "div",
     {
       className: clsx(
-        "row gap-x-2 w-full items-center",
+        "flex-row-2 w-full items-center",
         {
-          [normalClassName]: !!onClick && !isDisabled,
-          [selectedClassName]: isSelected && !isDisabled,
-          [disabledClassName]: isDisabled
+          [normalClassName]: !!onClick && !disabled,
+          [selectedClassName]: isSelected && !disabled,
+          [disabledClassName]: disabled
         },
         className
       ),
-      onClick: isDisabled ? void 0 : onClick,
+      onClick: disabled ? void 0 : onClick,
       children: [
         prefix,
-        /* @__PURE__ */ jsxs("div", { className: "col gap-y-0 w-full", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex-col-0 w-full", children: [
           /* @__PURE__ */ jsx("h4", { className: clsx(title.className ?? "textstyle-title-normal"), children: title.value }),
           !!description && /* @__PURE__ */ jsx("span", { className: clsx(description.className ?? "textstyle-description"), children: description.value })
         ] }),

package/dist/components/layout-and-navigation/Tile.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/layout-and-navigation/Tile.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport clsx from 'clsx'\nimport { Check } from 'lucide-react'\n\nexport type TileProps = {\n  title: { value: ReactNode, className?: string },\n  description?: { value: ReactNode, className?: string },\n  onClick?: () => void,\n  isDisabled?: boolean,\n  isSelected?: boolean,\n  prefix?: ReactNode,\n  suffix?: ReactNode,\n  className?: string,\n  normalClassName?: string,\n  selectedClassName?: string,\n  disabledClassName?: string,\n}\n\n/**\n * A component for creating a tile similar to the flutter ListTile\n */\nexport const Tile = ({\n                       title,\n                       description,\n                       onClick,\n                       isSelected = false,\n                       isDisabled = false,\n                       prefix,\n                       suffix,\n                       normalClassName = 'hover:bg-primary/40 cursor-pointer',\n                       selectedClassName = ' bg-primary/20',\n                       disabledClassName = 'text-disabled-text bg-disabled-background cursor-not-allowed',\n                       className\n                     }: TileProps) => {\n  return (\n    <div\n      className={clsx(\n        'row gap-x-2 w-full items-center',\n        {\n          [normalClassName]: !!onClick && !isDisabled,\n          [selectedClassName]: isSelected && !isDisabled,\n          [disabledClassName]: isDisabled,\n        },\n        className\n      )}\n      onClick={isDisabled ? undefined : onClick}\n    >\n      {prefix}\n      <div className=\"col gap-y-0 w-full\">\n        <h4 className={clsx(title.className ?? 'textstyle-title-normal')}>{title.value}</h4>\n        {!!description &&\n          <span className={clsx(description.className ?? 'textstyle-description')}>{description.value}</span>}\n      </div>\n      {suffix ?? (isSelected ? (<Check size={24}/>) : undefined)}\n    </div>\n  )\n}\n"],"mappings":";AACA,OAAO,UAAU;AACjB,SAAS,aAAa;AA8ChB,SACE,KADF;AA3BC,IAAM,OAAO,CAAC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB;AACF,MAAiB;AACpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,UACE,CAAC,eAAe,GAAG,CAAC,CAAC,WAAW,CAAC;AAAA,UACjC,CAAC,iBAAiB,GAAG,cAAc,CAAC;AAAA,UACpC,CAAC,iBAAiB,GAAG;AAAA,QACvB;AAAA,QACA;AAAA,MACF;AAAA,MACA,SAAS,aAAa,SAAY;AAAA,MAEjC;AAAA;AAAA,QACD,qBAAC,SAAI,WAAU,sBACb;AAAA,8BAAC,QAAG,WAAW,KAAK,MAAM,aAAa,wBAAwB,GAAI,gBAAM,OAAM;AAAA,UAC9E,CAAC,CAAC,eACD,oBAAC,UAAK,WAAW,KAAK,YAAY,aAAa,uBAAuB,GAAI,sBAAY,OAAM;AAAA,WAChG;AAAA,QACC,WAAW,aAAc,oBAAC,SAAM,MAAM,IAAG,IAAM;AAAA;AAAA;AAAA,EAClD;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/layout-and-navigation/Tile.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport clsx from 'clsx'\nimport { Check } from 'lucide-react'\n\nexport type TileProps = {\n  title: { value: ReactNode, className?: string },\n  description?: { value: ReactNode, className?: string },\n  onClick?: () => void,\n  disabled?: boolean,\n  isSelected?: boolean,\n  prefix?: ReactNode,\n  suffix?: ReactNode,\n  className?: string,\n  normalClassName?: string,\n  selectedClassName?: string,\n  disabledClassName?: string,\n}\n\n/**\n * A component for creating a tile similar to the flutter ListTile\n */\nexport const Tile = ({\n                       title,\n                       description,\n                       onClick,\n                       isSelected = false,\n                       disabled = false,\n                       prefix,\n                       suffix,\n                       normalClassName = 'hover:bg-primary/40 cursor-pointer',\n                       selectedClassName = ' bg-primary/20',\n                       disabledClassName = 'text-disabled-text bg-disabled-background cursor-not-allowed',\n                       className\n                     }: TileProps) => {\n  return (\n    <div\n      className={clsx(\n        'flex-row-2 w-full items-center',\n        {\n          [normalClassName]: !!onClick && !disabled,\n          [selectedClassName]: isSelected && !disabled,\n          [disabledClassName]: disabled,\n        },\n        className\n      )}\n      onClick={disabled ? undefined : onClick}\n    >\n      {prefix}\n      <div className=\"flex-col-0 w-full\">\n        <h4 className={clsx(title.className ?? 'textstyle-title-normal')}>{title.value}</h4>\n        {!!description &&\n          <span className={clsx(description.className ?? 'textstyle-description')}>{description.value}</span>}\n      </div>\n      {suffix ?? (isSelected ? (<Check size={24}/>) : undefined)}\n    </div>\n  )\n}\n"],"mappings":";AACA,OAAO,UAAU;AACjB,SAAS,aAAa;AA8ChB,SACE,KADF;AA3BC,IAAM,OAAO,CAAC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB;AACF,MAAiB;AACpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,UACE,CAAC,eAAe,GAAG,CAAC,CAAC,WAAW,CAAC;AAAA,UACjC,CAAC,iBAAiB,GAAG,cAAc,CAAC;AAAA,UACpC,CAAC,iBAAiB,GAAG;AAAA,QACvB;AAAA,QACA;AAAA,MACF;AAAA,MACA,SAAS,WAAW,SAAY;AAAA,MAE/B;AAAA;AAAA,QACD,qBAAC,SAAI,WAAU,qBACb;AAAA,8BAAC,QAAG,WAAW,KAAK,MAAM,aAAa,wBAAwB,GAAI,gBAAM,OAAM;AAAA,UAC9E,CAAC,CAAC,eACD,oBAAC,UAAK,WAAW,KAAK,YAAY,aAAa,uBAAuB,GAAI,sBAAY,OAAM;AAAA,WAChG;AAAA,QACC,WAAW,aAAc,oBAAC,SAAM,MAAM,IAAG,IAAM;AAAA;AAAA;AAAA,EAClD;AAEJ;","names":[]}

package/dist/components/loading-states/ErrorComponent.js

@@ -138,7 +138,7 @@ var ErrorComponent = ({
   classname
 }) => {
   const translation = useTranslation([defaultErrorComponentTranslation], overwriteTranslation);
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: (0, import_clsx.default)("col items-center justify-center gap-y-4 w-full h-24", classname), children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: (0, import_clsx.default)("flex-col-4 items-center justify-center w-full h-24", classname), children: [
     /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react.AlertOctagon, { size: 64, className: "text-warning" }),
     errorText ?? `${translation("errorOccurred")} :(`
   ] });

package/dist/components/loading-states/ErrorComponent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/loading-states/ErrorComponent.tsx","../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts"],"sourcesContent":["import { AlertOctagon } from 'lucide-react'\nimport type { PropsForTranslation, Translation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport clsx from 'clsx'\n\ntype ErrorComponentTranslation = {\n  errorOccurred: string,\n}\n\nconst defaultErrorComponentTranslation: Translation<ErrorComponentTranslation> = {\n  en: {\n    errorOccurred: 'An error occurred'\n  },\n  de: {\n    errorOccurred: 'Ein Fehler ist aufgetreten'\n  }\n}\n\nexport type ErrorComponentProps = {\n  errorText?: string,\n  classname?: string,\n}\n\n/**\n * The Component to show when an error occurred\n */\nexport const ErrorComponent = ({\n                                 overwriteTranslation,\n                                 errorText,\n                                 classname\n                               }: PropsForTranslation<ErrorComponentTranslation, ErrorComponentProps>) => {\n  const translation = useTranslation([defaultErrorComponentTranslation], overwriteTranslation)\n  return (\n    <div className={clsx('col items-center justify-center gap-y-4 w-full h-24', classname)}>\n      <AlertOctagon size={64} className=\"text-warning\"/>\n      {errorText ?? `${translation('errorOccurred')} :(`}\n    </div>\n  )\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n  language: Language,\n  setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n  language: LanguageUtil.DEFAULT_LANGUAGE,\n  setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n  const { language } = useLanguage()\n  const mapping: Record<Language, string> = {\n    en: 'en-US',\n    de: 'de-DE'\n  }\n  return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n  initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n  const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n  const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n  useEffect(() => {\n    if (language !== initialLanguage && initialLanguage) {\n      console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n      setLanguage(initialLanguage)\n    }\n  }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    // TODO set locale of html tag here as well\n    setStoredLanguage(language)\n  }, [language, setStoredLanguage])\n\n  useEffect(() => {\n    if (storedLanguage !== null) {\n      setLanguage(storedLanguage)\n      return\n    }\n\n    const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n    const matchingBrowserLanguage = window.navigator.languages\n      .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n      .filter(entry => entry !== undefined)\n\n    if (matchingBrowserLanguage.length === 0) return\n\n    const firstMatch = matchingBrowserLanguage[0] as Language\n    setLanguage(firstMatch)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <LanguageContext.Provider value={{\n      language,\n      setLanguage\n    }}>\n      {children}\n    </LanguageContext.Provider>\n  )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return initValue\n    }\n    const storageService = new LocalStorageService()\n    const value = storageService.get<T>(key)\n    return value || initValue\n  }, [initValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(value => {\n    const newValue = value instanceof Function ? value(storedValue) : value\n    const storageService = new LocalStorageService()\n    storageService.set(key, value)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  useEffect(() => {\n    setStoredValue(get())\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n  en: 'English',\n  de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n  languages,\n  DEFAULT_LANGUAGE,\n  languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\n/**\n * A type describing the pluralization of a word\n */\nexport type TranslationPlural = {\n  zero?: string,\n  one?: string,\n  two?: string,\n  few?: string,\n  many?: string,\n  other: string,\n}\n\n/**\n * The type describing all values of a translation\n */\nexport type TranslationType = Record<string, string | TranslationPlural>\n\n/**\n * The type of translations\n */\nexport type Translation<T extends TranslationType> = Record<Language, T>\n\ntype OverwriteTranslationType<T extends TranslationType> = {\n  language?: Language,\n  translation?: Translation<Partial<T>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n *              if you don't expect any other props other than `language` and get an\n *              error when using your component (because it uses `forwardRef` etc.)\n *              you can try out `Record<string, unknown>`, this might resolve your\n *              problem as `SomeType & never` is still `never` but `SomeType & unknown`\n *              is `SomeType` which means that adding back props (like `ref` etc.)\n *              works properly\n */\nexport type PropsForTranslation<\n  Translation extends TranslationType,\n  Props = unknown\n> = Props & {\n  overwriteTranslation?: OverwriteTranslationType<Translation>,\n}\n\ntype StringKeys<T> = Extract<keyof T, string>;\n\ntype TranslationFunctionOptions = {\n  replacements?: Record<string, string>,\n  count?: number,\n}\ntype TranslationFunction<T extends TranslationType> = (key: StringKeys<T>, options?: TranslationFunctionOptions) => string\n\nexport const TranslationPluralCount = {\n  zero: 0,\n  one: 1,\n  two: 2,\n  few: 3,\n  many: 11,\n  other: -1,\n}\n\n\nexport const useTranslation = <T extends TranslationType>(\n  translations: Translation<Partial<TranslationType>>[],\n  overwriteTranslation: OverwriteTranslationType<T> = {}\n): TranslationFunction<T> => {\n  const { language: languageProp, translation: overwrite } = overwriteTranslation\n  const { language: inferredLanguage } = useLanguage()\n  const usedLanguage = languageProp ?? inferredLanguage\n  const usedTranslations = [...translations]\n  if (overwrite) {\n    usedTranslations.push(overwrite)\n  }\n\n  return (key: StringKeys<T>, options?: TranslationFunctionOptions): string => {\n    const { count, replacements } = { ...{ count: 0, replacements: {} }, ...options }\n\n    try {\n      for (let i = translations.length - 1; i >= 0; i--) {\n        const translation = translations[i]\n        const localizedTranslation = translation[usedLanguage]\n        if (!localizedTranslation) {\n          continue\n        }\n        const value = localizedTranslation[key]\n        if(!value) {\n          continue\n        }\n\n        let forProcessing: string\n        if (typeof value !== 'string') {\n          if (count === TranslationPluralCount.zero && value?.zero) {\n            forProcessing = value.zero\n          } else if (count === TranslationPluralCount.one && value?.one) {\n            forProcessing = value.one\n          } else if (count === TranslationPluralCount.two && value?.two) {\n            forProcessing = value.two\n          } else if (TranslationPluralCount.few <= count && count < TranslationPluralCount.many && value?.few) {\n            forProcessing = value.few\n          } else if (count > TranslationPluralCount.many && value?.many) {\n            forProcessing = value.many\n          } else {\n            forProcessing = value.other\n          }\n        } else {\n          forProcessing = value\n        }\n        forProcessing = forProcessing.replace(/\\{\\{(\\w+)}}/g, (_, placeholder) => {\n          return replacements[placeholder] ?? `{{key:${placeholder}}}` // fallback if key is missing\n        })\n        return forProcessing\n      }\n    } catch (e) {\n      console.error(e)\n    }\n    return `{{${usedLanguage}:${key}}}`\n  }\n}"],"mappings":"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","names":["import_react","import_jsx_runtime","clsx"]}
+{"version":3,"sources":["../../../src/components/loading-states/ErrorComponent.tsx","../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts"],"sourcesContent":["import { AlertOctagon } from 'lucide-react'\nimport type { PropsForTranslation, Translation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport clsx from 'clsx'\n\ntype ErrorComponentTranslation = {\n  errorOccurred: string,\n}\n\nconst defaultErrorComponentTranslation: Translation<ErrorComponentTranslation> = {\n  en: {\n    errorOccurred: 'An error occurred'\n  },\n  de: {\n    errorOccurred: 'Ein Fehler ist aufgetreten'\n  }\n}\n\nexport type ErrorComponentProps = {\n  errorText?: string,\n  classname?: string,\n}\n\n/**\n * The Component to show when an error occurred\n */\nexport const ErrorComponent = ({\n                                 overwriteTranslation,\n                                 errorText,\n                                 classname\n                               }: PropsForTranslation<ErrorComponentTranslation, ErrorComponentProps>) => {\n  const translation = useTranslation([defaultErrorComponentTranslation], overwriteTranslation)\n  return (\n    <div className={clsx('flex-col-4 items-center justify-center w-full h-24', classname)}>\n      <AlertOctagon size={64} className=\"text-warning\"/>\n      {errorText ?? `${translation('errorOccurred')} :(`}\n    </div>\n  )\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n  language: Language,\n  setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n  language: LanguageUtil.DEFAULT_LANGUAGE,\n  setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n  const { language } = useLanguage()\n  const mapping: Record<Language, string> = {\n    en: 'en-US',\n    de: 'de-DE'\n  }\n  return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n  initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n  const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n  const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n  useEffect(() => {\n    if (language !== initialLanguage && initialLanguage) {\n      console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n      setLanguage(initialLanguage)\n    }\n  }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    // TODO set locale of html tag here as well\n    setStoredLanguage(language)\n  }, [language, setStoredLanguage])\n\n  useEffect(() => {\n    if (storedLanguage !== null) {\n      setLanguage(storedLanguage)\n      return\n    }\n\n    const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n    const matchingBrowserLanguage = window.navigator.languages\n      .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n      .filter(entry => entry !== undefined)\n\n    if (matchingBrowserLanguage.length === 0) return\n\n    const firstMatch = matchingBrowserLanguage[0] as Language\n    setLanguage(firstMatch)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <LanguageContext.Provider value={{\n      language,\n      setLanguage\n    }}>\n      {children}\n    </LanguageContext.Provider>\n  )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return initValue\n    }\n    const storageService = new LocalStorageService()\n    const value = storageService.get<T>(key)\n    return value || initValue\n  }, [initValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(value => {\n    const newValue = value instanceof Function ? value(storedValue) : value\n    const storageService = new LocalStorageService()\n    storageService.set(key, value)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  useEffect(() => {\n    setStoredValue(get())\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n  en: 'English',\n  de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n  languages,\n  DEFAULT_LANGUAGE,\n  languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\n/**\n * A type describing the pluralization of a word\n */\nexport type TranslationPlural = {\n  zero?: string,\n  one?: string,\n  two?: string,\n  few?: string,\n  many?: string,\n  other: string,\n}\n\n/**\n * The type describing all values of a translation\n */\nexport type TranslationType = Record<string, string | TranslationPlural>\n\n/**\n * The type of translations\n */\nexport type Translation<T extends TranslationType> = Record<Language, T>\n\ntype OverwriteTranslationType<T extends TranslationType> = {\n  language?: Language,\n  translation?: Translation<Partial<T>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n *              if you don't expect any other props other than `language` and get an\n *              error when using your component (because it uses `forwardRef` etc.)\n *              you can try out `Record<string, unknown>`, this might resolve your\n *              problem as `SomeType & never` is still `never` but `SomeType & unknown`\n *              is `SomeType` which means that adding back props (like `ref` etc.)\n *              works properly\n */\nexport type PropsForTranslation<\n  Translation extends TranslationType,\n  Props = unknown\n> = Props & {\n  overwriteTranslation?: OverwriteTranslationType<Translation>,\n}\n\ntype StringKeys<T> = Extract<keyof T, string>;\n\ntype TranslationFunctionOptions = {\n  replacements?: Record<string, string>,\n  count?: number,\n}\ntype TranslationFunction<T extends TranslationType> = (key: StringKeys<T>, options?: TranslationFunctionOptions) => string\n\nexport const TranslationPluralCount = {\n  zero: 0,\n  one: 1,\n  two: 2,\n  few: 3,\n  many: 11,\n  other: -1,\n}\n\n\nexport const useTranslation = <T extends TranslationType>(\n  translations: Translation<Partial<TranslationType>>[],\n  overwriteTranslation: OverwriteTranslationType<T> = {}\n): TranslationFunction<T> => {\n  const { language: languageProp, translation: overwrite } = overwriteTranslation\n  const { language: inferredLanguage } = useLanguage()\n  const usedLanguage = languageProp ?? inferredLanguage\n  const usedTranslations = [...translations]\n  if (overwrite) {\n    usedTranslations.push(overwrite)\n  }\n\n  return (key: StringKeys<T>, options?: TranslationFunctionOptions): string => {\n    const { count, replacements } = { ...{ count: 0, replacements: {} }, ...options }\n\n    try {\n      for (let i = translations.length - 1; i >= 0; i--) {\n        const translation = translations[i]\n        const localizedTranslation = translation[usedLanguage]\n        if (!localizedTranslation) {\n          continue\n        }\n        const value = localizedTranslation[key]\n        if(!value) {\n          continue\n        }\n\n        let forProcessing: string\n        if (typeof value !== 'string') {\n          if (count === TranslationPluralCount.zero && value?.zero) {\n            forProcessing = value.zero\n          } else if (count === TranslationPluralCount.one && value?.one) {\n            forProcessing = value.one\n          } else if (count === TranslationPluralCount.two && value?.two) {\n            forProcessing = value.two\n          } else if (TranslationPluralCount.few <= count && count < TranslationPluralCount.many && value?.few) {\n            forProcessing = value.few\n          } else if (count > TranslationPluralCount.many && value?.many) {\n            forProcessing = value.many\n          } else {\n            forProcessing = value.other\n          }\n        } else {\n          forProcessing = value\n        }\n        forProcessing = forProcessing.replace(/\\{\\{(\\w+)}}/g, (_, placeholder) => {\n          return replacements[placeholder] ?? `{{key:${placeholder}}}` // fallback if key is missing\n        })\n        return forProcessing\n      }\n    } catch (e) {\n      console.error(e)\n    }\n    return `{{${usedLanguage}:${key}}}`\n  }\n}"],"mappings":"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","names":["import_react","import_jsx_runtime","clsx"]}

package/dist/components/loading-states/ErrorComponent.mjs

@@ -105,7 +105,7 @@ var ErrorComponent = ({
   classname
 }) => {
   const translation = useTranslation([defaultErrorComponentTranslation], overwriteTranslation);
-  return /* @__PURE__ */ jsxs("div", { className: clsx("col items-center justify-center gap-y-4 w-full h-24", classname), children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx("flex-col-4 items-center justify-center w-full h-24", classname), children: [
     /* @__PURE__ */ jsx2(AlertOctagon, { size: 64, className: "text-warning" }),
     errorText ?? `${translation("errorOccurred")} :(`
   ] });

package/dist/components/loading-states/ErrorComponent.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/loading-states/ErrorComponent.tsx","../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts"],"sourcesContent":["import { AlertOctagon } from 'lucide-react'\nimport type { PropsForTranslation, Translation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport clsx from 'clsx'\n\ntype ErrorComponentTranslation = {\n  errorOccurred: string,\n}\n\nconst defaultErrorComponentTranslation: Translation<ErrorComponentTranslation> = {\n  en: {\n    errorOccurred: 'An error occurred'\n  },\n  de: {\n    errorOccurred: 'Ein Fehler ist aufgetreten'\n  }\n}\n\nexport type ErrorComponentProps = {\n  errorText?: string,\n  classname?: string,\n}\n\n/**\n * The Component to show when an error occurred\n */\nexport const ErrorComponent = ({\n                                 overwriteTranslation,\n                                 errorText,\n                                 classname\n                               }: PropsForTranslation<ErrorComponentTranslation, ErrorComponentProps>) => {\n  const translation = useTranslation([defaultErrorComponentTranslation], overwriteTranslation)\n  return (\n    <div className={clsx('col items-center justify-center gap-y-4 w-full h-24', classname)}>\n      <AlertOctagon size={64} className=\"text-warning\"/>\n      {errorText ?? `${translation('errorOccurred')} :(`}\n    </div>\n  )\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n  language: Language,\n  setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n  language: LanguageUtil.DEFAULT_LANGUAGE,\n  setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n  const { language } = useLanguage()\n  const mapping: Record<Language, string> = {\n    en: 'en-US',\n    de: 'de-DE'\n  }\n  return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n  initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n  const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n  const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n  useEffect(() => {\n    if (language !== initialLanguage && initialLanguage) {\n      console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n      setLanguage(initialLanguage)\n    }\n  }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    // TODO set locale of html tag here as well\n    setStoredLanguage(language)\n  }, [language, setStoredLanguage])\n\n  useEffect(() => {\n    if (storedLanguage !== null) {\n      setLanguage(storedLanguage)\n      return\n    }\n\n    const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n    const matchingBrowserLanguage = window.navigator.languages\n      .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n      .filter(entry => entry !== undefined)\n\n    if (matchingBrowserLanguage.length === 0) return\n\n    const firstMatch = matchingBrowserLanguage[0] as Language\n    setLanguage(firstMatch)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <LanguageContext.Provider value={{\n      language,\n      setLanguage\n    }}>\n      {children}\n    </LanguageContext.Provider>\n  )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return initValue\n    }\n    const storageService = new LocalStorageService()\n    const value = storageService.get<T>(key)\n    return value || initValue\n  }, [initValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(value => {\n    const newValue = value instanceof Function ? value(storedValue) : value\n    const storageService = new LocalStorageService()\n    storageService.set(key, value)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  useEffect(() => {\n    setStoredValue(get())\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n  en: 'English',\n  de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n  languages,\n  DEFAULT_LANGUAGE,\n  languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\n/**\n * A type describing the pluralization of a word\n */\nexport type TranslationPlural = {\n  zero?: string,\n  one?: string,\n  two?: string,\n  few?: string,\n  many?: string,\n  other: string,\n}\n\n/**\n * The type describing all values of a translation\n */\nexport type TranslationType = Record<string, string | TranslationPlural>\n\n/**\n * The type of translations\n */\nexport type Translation<T extends TranslationType> = Record<Language, T>\n\ntype OverwriteTranslationType<T extends TranslationType> = {\n  language?: Language,\n  translation?: Translation<Partial<T>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n *              if you don't expect any other props other than `language` and get an\n *              error when using your component (because it uses `forwardRef` etc.)\n *              you can try out `Record<string, unknown>`, this might resolve your\n *              problem as `SomeType & never` is still `never` but `SomeType & unknown`\n *              is `SomeType` which means that adding back props (like `ref` etc.)\n *              works properly\n */\nexport type PropsForTranslation<\n  Translation extends TranslationType,\n  Props = unknown\n> = Props & {\n  overwriteTranslation?: OverwriteTranslationType<Translation>,\n}\n\ntype StringKeys<T> = Extract<keyof T, string>;\n\ntype TranslationFunctionOptions = {\n  replacements?: Record<string, string>,\n  count?: number,\n}\ntype TranslationFunction<T extends TranslationType> = (key: StringKeys<T>, options?: TranslationFunctionOptions) => string\n\nexport const TranslationPluralCount = {\n  zero: 0,\n  one: 1,\n  two: 2,\n  few: 3,\n  many: 11,\n  other: -1,\n}\n\n\nexport const useTranslation = <T extends TranslationType>(\n  translations: Translation<Partial<TranslationType>>[],\n  overwriteTranslation: OverwriteTranslationType<T> = {}\n): TranslationFunction<T> => {\n  const { language: languageProp, translation: overwrite } = overwriteTranslation\n  const { language: inferredLanguage } = useLanguage()\n  const usedLanguage = languageProp ?? inferredLanguage\n  const usedTranslations = [...translations]\n  if (overwrite) {\n    usedTranslations.push(overwrite)\n  }\n\n  return (key: StringKeys<T>, options?: TranslationFunctionOptions): string => {\n    const { count, replacements } = { ...{ count: 0, replacements: {} }, ...options }\n\n    try {\n      for (let i = translations.length - 1; i >= 0; i--) {\n        const translation = translations[i]\n        const localizedTranslation = translation[usedLanguage]\n        if (!localizedTranslation) {\n          continue\n        }\n        const value = localizedTranslation[key]\n        if(!value) {\n          continue\n        }\n\n        let forProcessing: string\n        if (typeof value !== 'string') {\n          if (count === TranslationPluralCount.zero && value?.zero) {\n            forProcessing = value.zero\n          } else if (count === TranslationPluralCount.one && value?.one) {\n            forProcessing = value.one\n          } else if (count === TranslationPluralCount.two && value?.two) {\n            forProcessing = value.two\n          } else if (TranslationPluralCount.few <= count && count < TranslationPluralCount.many && value?.few) {\n            forProcessing = value.few\n          } else if (count > TranslationPluralCount.many && value?.many) {\n            forProcessing = value.many\n          } else {\n            forProcessing = value.other\n          }\n        } else {\n          forProcessing = value\n        }\n        forProcessing = forProcessing.replace(/\\{\\{(\\w+)}}/g, (_, placeholder) => {\n          return replacements[placeholder] ?? `{{key:${placeholder}}}` // fallback if key is missing\n        })\n        return forProcessing\n      }\n    } catch (e) {\n      console.error(e)\n    }\n    return `{{${usedLanguage}:${key}}}`\n  }\n}"],"mappings":"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","names":["useEffect","useState","jsx"]}
+{"version":3,"sources":["../../../src/components/loading-states/ErrorComponent.tsx","../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts"],"sourcesContent":["import { AlertOctagon } from 'lucide-react'\nimport type { PropsForTranslation, Translation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport clsx from 'clsx'\n\ntype ErrorComponentTranslation = {\n  errorOccurred: string,\n}\n\nconst defaultErrorComponentTranslation: Translation<ErrorComponentTranslation> = {\n  en: {\n    errorOccurred: 'An error occurred'\n  },\n  de: {\n    errorOccurred: 'Ein Fehler ist aufgetreten'\n  }\n}\n\nexport type ErrorComponentProps = {\n  errorText?: string,\n  classname?: string,\n}\n\n/**\n * The Component to show when an error occurred\n */\nexport const ErrorComponent = ({\n                                 overwriteTranslation,\n                                 errorText,\n                                 classname\n                               }: PropsForTranslation<ErrorComponentTranslation, ErrorComponentProps>) => {\n  const translation = useTranslation([defaultErrorComponentTranslation], overwriteTranslation)\n  return (\n    <div className={clsx('flex-col-4 items-center justify-center w-full h-24', classname)}>\n      <AlertOctagon size={64} className=\"text-warning\"/>\n      {errorText ?? `${translation('errorOccurred')} :(`}\n    </div>\n  )\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n  language: Language,\n  setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n  language: LanguageUtil.DEFAULT_LANGUAGE,\n  setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n  const { language } = useLanguage()\n  const mapping: Record<Language, string> = {\n    en: 'en-US',\n    de: 'de-DE'\n  }\n  return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n  initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n  const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n  const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n  useEffect(() => {\n    if (language !== initialLanguage && initialLanguage) {\n      console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n      setLanguage(initialLanguage)\n    }\n  }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    // TODO set locale of html tag here as well\n    setStoredLanguage(language)\n  }, [language, setStoredLanguage])\n\n  useEffect(() => {\n    if (storedLanguage !== null) {\n      setLanguage(storedLanguage)\n      return\n    }\n\n    const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n    const matchingBrowserLanguage = window.navigator.languages\n      .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n      .filter(entry => entry !== undefined)\n\n    if (matchingBrowserLanguage.length === 0) return\n\n    const firstMatch = matchingBrowserLanguage[0] as Language\n    setLanguage(firstMatch)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <LanguageContext.Provider value={{\n      language,\n      setLanguage\n    }}>\n      {children}\n    </LanguageContext.Provider>\n  )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return initValue\n    }\n    const storageService = new LocalStorageService()\n    const value = storageService.get<T>(key)\n    return value || initValue\n  }, [initValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(value => {\n    const newValue = value instanceof Function ? value(storedValue) : value\n    const storageService = new LocalStorageService()\n    storageService.set(key, value)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  useEffect(() => {\n    setStoredValue(get())\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n  en: 'English',\n  de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n  languages,\n  DEFAULT_LANGUAGE,\n  languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\n/**\n * A type describing the pluralization of a word\n */\nexport type TranslationPlural = {\n  zero?: string,\n  one?: string,\n  two?: string,\n  few?: string,\n  many?: string,\n  other: string,\n}\n\n/**\n * The type describing all values of a translation\n */\nexport type TranslationType = Record<string, string | TranslationPlural>\n\n/**\n * The type of translations\n */\nexport type Translation<T extends TranslationType> = Record<Language, T>\n\ntype OverwriteTranslationType<T extends TranslationType> = {\n  language?: Language,\n  translation?: Translation<Partial<T>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n *              if you don't expect any other props other than `language` and get an\n *              error when using your component (because it uses `forwardRef` etc.)\n *              you can try out `Record<string, unknown>`, this might resolve your\n *              problem as `SomeType & never` is still `never` but `SomeType & unknown`\n *              is `SomeType` which means that adding back props (like `ref` etc.)\n *              works properly\n */\nexport type PropsForTranslation<\n  Translation extends TranslationType,\n  Props = unknown\n> = Props & {\n  overwriteTranslation?: OverwriteTranslationType<Translation>,\n}\n\ntype StringKeys<T> = Extract<keyof T, string>;\n\ntype TranslationFunctionOptions = {\n  replacements?: Record<string, string>,\n  count?: number,\n}\ntype TranslationFunction<T extends TranslationType> = (key: StringKeys<T>, options?: TranslationFunctionOptions) => string\n\nexport const TranslationPluralCount = {\n  zero: 0,\n  one: 1,\n  two: 2,\n  few: 3,\n  many: 11,\n  other: -1,\n}\n\n\nexport const useTranslation = <T extends TranslationType>(\n  translations: Translation<Partial<TranslationType>>[],\n  overwriteTranslation: OverwriteTranslationType<T> = {}\n): TranslationFunction<T> => {\n  const { language: languageProp, translation: overwrite } = overwriteTranslation\n  const { language: inferredLanguage } = useLanguage()\n  const usedLanguage = languageProp ?? inferredLanguage\n  const usedTranslations = [...translations]\n  if (overwrite) {\n    usedTranslations.push(overwrite)\n  }\n\n  return (key: StringKeys<T>, options?: TranslationFunctionOptions): string => {\n    const { count, replacements } = { ...{ count: 0, replacements: {} }, ...options }\n\n    try {\n      for (let i = translations.length - 1; i >= 0; i--) {\n        const translation = translations[i]\n        const localizedTranslation = translation[usedLanguage]\n        if (!localizedTranslation) {\n          continue\n        }\n        const value = localizedTranslation[key]\n        if(!value) {\n          continue\n        }\n\n        let forProcessing: string\n        if (typeof value !== 'string') {\n          if (count === TranslationPluralCount.zero && value?.zero) {\n            forProcessing = value.zero\n          } else if (count === TranslationPluralCount.one && value?.one) {\n            forProcessing = value.one\n          } else if (count === TranslationPluralCount.two && value?.two) {\n            forProcessing = value.two\n          } else if (TranslationPluralCount.few <= count && count < TranslationPluralCount.many && value?.few) {\n            forProcessing = value.few\n          } else if (count > TranslationPluralCount.many && value?.many) {\n            forProcessing = value.many\n          } else {\n            forProcessing = value.other\n          }\n        } else {\n          forProcessing = value\n        }\n        forProcessing = forProcessing.replace(/\\{\\{(\\w+)}}/g, (_, placeholder) => {\n          return replacements[placeholder] ?? `{{key:${placeholder}}}` // fallback if key is missing\n        })\n        return forProcessing\n      }\n    } catch (e) {\n      console.error(e)\n    }\n    return `{{${usedLanguage}:${key}}}`\n  }\n}"],"mappings":"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","names":["useEffect","useState","jsx"]}

package/dist/components/loading-states/LoadingAndErrorComponent.js

@@ -199,6 +199,7 @@ var Helpwave = ({
 // src/localization/defaults/form.ts
 var formTranslation = {
   en: {
+    add: "Add",
     all: "All",
     apply: "Apply",
     back: "Back",
@@ -211,6 +212,7 @@ var formTranslation = {
     confirm: "Confirm",
     copy: "Copy",
     copied: "Copied",
+    create: "Create",
     decline: "Decline",
     delete: "Delete",
     discard: "Discard",
@@ -253,6 +255,7 @@ var formTranslation = {
     yes: "Yes"
   },
   de: {
+    add: "Hinzuf\xFCgen",
     all: "Alle",
     apply: "Anwenden",
     back: "Zur\xFCck",
@@ -265,6 +268,7 @@ var formTranslation = {
     confirm: "Best\xE4tigen",
     copy: "Kopieren",
     copied: "Kopiert",
+    create: "Erstellen",
     decline: "Ablehnen",
     delete: "L\xF6schen",
     discard: "Verwerfen",
@@ -316,7 +320,7 @@ var LoadingAnimation = ({
   classname
 }) => {
   const translation = useTranslation([formTranslation], overwriteTranslation);
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: (0, import_clsx2.default)("col items-center justify-center w-full h-24", classname), children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: (0, import_clsx2.default)("flex-col-2 items-center justify-center w-full h-24", classname), children: [
     /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Helpwave, { animate: "loading" }),
     loadingText ?? `${translation("loading")}...`
   ] });
@@ -340,7 +344,7 @@ var ErrorComponent = ({
   classname
 }) => {
   const translation = useTranslation([defaultErrorComponentTranslation], overwriteTranslation);
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: (0, import_clsx3.default)("col items-center justify-center gap-y-4 w-full h-24", classname), children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: (0, import_clsx3.default)("flex-col-4 items-center justify-center w-full h-24", classname), children: [
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react.AlertOctagon, { size: 64, className: "text-warning" }),
     errorText ?? `${translation("errorOccurred")} :(`
   ] });