@helpwave/hightide 0.1.43 → 0.1.44

package/dist/components/properties/TextProperty.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/properties/TextProperty.tsx","../../../src/i18n/translations.ts","../../../src/i18n/LocaleProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/i18n/util.ts","../../../src/i18n/useTranslation.ts","../../../src/utils/array.ts","../../../src/components/user-action/Textarea.tsx","../../../src/components/user-action/Label.tsx","../../../src/hooks/useDelay.ts","../../../src/hooks/useOverwritableState.ts","../../../src/components/properties/PropertyBase.tsx","../../../src/components/user-action/Button.tsx"],"sourcesContent":["import { Text } from 'lucide-react'\nimport clsx from 'clsx'\nimport { useTranslation } from '@/src/i18n/useTranslation'\nimport { Textarea } from '../user-action/Textarea'\nimport type { PropertyBaseProps } from './PropertyBase'\nimport { PropertyBase } from './PropertyBase'\n\nexport type TextPropertyProps = Omit<PropertyBaseProps, 'icon' | 'input' | 'hasValue'> & {\n  value?: string,\n  onChange?: (value: string) => void,\n  onEditComplete?: (value: string) => void,\n}\n\n/**\n * An Input for Text properties\n */\nexport const TextProperty = ({\n                               value,\n                               readOnly,\n                               onChange,\n                               onRemove,\n                               onEditComplete,\n                               ...baseProps\n                             }: TextPropertyProps) => {\n  const translation = useTranslation()\n  const hasValue = value !== undefined\n\n  return (\n    <PropertyBase\n      {...baseProps}\n      onRemove={onRemove}\n      hasValue={hasValue}\n      icon={<Text size={24}/>}\n      input={({ softRequired }) => (\n        <Textarea\n          className={clsx({\n            'bg-surface-warning placeholder-warning': softRequired && !hasValue\n          })}\n          rows={5}\n          defaultStyle={false}\n          value={value ?? ''}\n          readOnly={readOnly}\n          placeholder={`${translation('text')}...`}\n          onChangeText={(value) => {\n            if (!value) {\n              onRemove?.()\n            } else {\n              onChange?.(value)\n            }\n          }}\n          onEditCompleted={(value) => {\n            if (!value) {\n              onRemove?.()\n            } else {\n              onEditComplete?.(value)\n            }\n          }}\n        />\n      )}\n    />\n  )\n}\n","// AUTO-GENERATED. DO NOT EDIT.\nimport type { Translation } from '@helpwave/internationalization'\nimport { TranslationGen } from '@helpwave/internationalization'\n\n/* eslint-disable @stylistic/quote-props */\nexport const supportedLocales = ['de-DE', 'en-US'] as const\n\nexport type SupportedLocale = typeof supportedLocales[number]\n\nexport type GeneratedTranslationEntries = {\n  'add': string,\n  'age': string,\n  'all': string,\n  'apply': string,\n  'back': string,\n  'cancel': string,\n  'carousel': string,\n  'change': string,\n  'chooseLanguage': string,\n  'chooseSlide': string,\n  'chooseTheme': string,\n  'clear': string,\n  'click': string,\n  'clickToCopy': string,\n  'clickToSelect': string,\n  'close': string,\n  'confirm': string,\n  'copied': string,\n  'copy': string,\n  'create': string,\n  'decline': string,\n  'delete': string,\n  'discard': string,\n  'discardChanges': string,\n  'done': string,\n  'edit': string,\n  'endDate': string,\n  'enterText': string,\n  'entryDate': string,\n  'error': string,\n  'errorOccurred': string,\n  'exit': string,\n  'fieldRequiredError': string,\n  'filter': string,\n  'gender': (values: { gender: string }) => string,\n  'goodToSeeYou': string,\n  'identifier': string,\n  'invalidEmail': string,\n  'invalidEmailError': string,\n  'language': string,\n  'less': string,\n  'loading': string,\n  'locale': string,\n  'max': string,\n  'maxLengthError': string,\n  'min': string,\n  'minLengthError': string,\n  'more': string,\n  'name': string,\n  'next': string,\n  'no': string,\n  'none': string,\n  'notEmpty': string,\n  'nothingFound': string,\n  'of': string,\n  'optional': string,\n  'outOfRangeNumber': (values: { min: number, max: number }) => string,\n  'outOfRangeSelectionItems': (values: { min: number, max: number }) => string,\n  'outOfRangeString': (values: { min: number, max: number }) => 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  'showLess': string,\n  'showMore': string,\n  'showSlide': (values: { index: number }) => string,\n  'slide': string,\n  'slideNavigation': string,\n  'slideOf': (values: { index: number, length: number }) => string,\n  'startDate': string,\n  'street': string,\n  'submit': string,\n  'success': string,\n  'text': string,\n  'themeMode': (values: { theme: string }) => string,\n  'themes': (values: { count: number }) => string,\n  'time.ago': string,\n  'time.agoDays': (values: { days: number }) => string,\n  'time.april': string,\n  'time.august': string,\n  'time.century': (values: { count: number }) => string,\n  'time.day': (values: { count: number }) => string,\n  'time.decade': (values: { count: number }) => string,\n  'time.december': string,\n  'time.february': string,\n  'time.hour': (values: { count: number }) => string,\n  'time.in': string,\n  'time.inDays': (values: { days: number }) => string,\n  'time.january': string,\n  'time.july': string,\n  'time.june': string,\n  'time.march': string,\n  'time.may': string,\n  'time.microsecond': (values: { count: number }) => string,\n  'time.millisecond': (values: { count: number }) => string,\n  'time.minute': (values: { count: number }) => string,\n  'time.month': (values: { count: number }) => string,\n  'time.monthName': (values: { month: string }) => string,\n  'time.nanosecond': (values: { count: number }) => string,\n  'time.november': string,\n  'time.october': string,\n  'time.second': (values: { count: number }) => string,\n  'time.september': string,\n  'time.today': string,\n  'time.tomorrow': string,\n  'time.year': (values: { count: number }) => string,\n  'time.yesterday': string,\n  'tooFewSelectionItems': (values: { min: number }) => string,\n  'tooLong': (values: { max: number }) => string,\n  'tooManySelectionItems': (values: { max: number }) => string,\n  'tooShort': (values: { min: number }) => string,\n  'unsavedChanges': string,\n  'unsavedChangesSaveQuestion': string,\n  'update': string,\n  'value': string,\n  'welcome': string,\n  'yes': string,\n}\n\nexport const generatedTranslations: Translation<SupportedLocale, Partial<GeneratedTranslationEntries>> = {\n  'de-DE': {\n    'add': `Hinzufügen`,\n    'age': `Alter`,\n    'all': `Alle`,\n    'apply': `Anwenden`,\n    'back': `Zurück`,\n    'cancel': `Abbrechen`,\n    'carousel': `Karussell`,\n    'change': `Ändern`,\n    'chooseLanguage': `Wähle deine bevorzugte Sprache`,\n    'chooseSlide': `Wähle die angezeigte Slide aus`,\n    'chooseTheme': `Wähle dein bevorzugtes Farbschema.`,\n    'clear': `Löschen`,\n    'click': `Klicken`,\n    'clickToCopy': `Zum kopieren klicken`,\n    'clickToSelect': `Zum Auswählen drücken`,\n    'close': `Schließen`,\n    'confirm': `Bestätigen`,\n    'copied': `Kopiert`,\n    'copy': `Kopieren`,\n    'create': `Erstellen`,\n    'decline': `Ablehnen`,\n    'delete': `Löschen`,\n    'discard': `Verwerfen`,\n    'discardChanges': `Änderungen Verwerfen`,\n    'done': `Fertig`,\n    'edit': `Bearbeiten`,\n    'endDate': `Ende`,\n    'enterText': `Text hier eingeben`,\n    'entryDate': `Eintragsdatum`,\n    'error': `Fehler`,\n    'errorOccurred': `Ein Fehler ist aufgetreten`,\n    'exit': `Beenden`,\n    'fieldRequiredError': `Dieses Feld ist erforderlich.`,\n    'filter': `Filter`,\n    'gender': ({ gender }): string => {\n      return TranslationGen.resolveSelect(gender, {\n        'male': `Männlich`,\n        'female': `Weiblich`,\n        'other': `Divers`,\n      })\n    },\n    'goodToSeeYou': `Schön dich zu sehen`,\n    'identifier': `Identifikator`,\n    'invalidEmail': `Die E-Mail ist ungültig.`,\n    'invalidEmailError': `Bitte geben Sie eine gültige E-Mail-Adresse ein.`,\n    'language': `Sprache`,\n    'less': `Weniger`,\n    'loading': `Lädt`,\n    'locale': `Locale`,\n    'max': `Max`,\n    'maxLengthError': `Maximale Länge überschritten.`,\n    'min': `Min`,\n    'minLengthError': `Mindestlänge nicht erreicht.`,\n    'more': `Mehr`,\n    'name': `Name`,\n    'next': `Weiter`,\n    'no': `Nein`,\n    'none': `Nichts`,\n    'notEmpty': `Das Feld darf nicht leer sein.`,\n    'nothingFound': `Nichts gefunden`,\n    'of': `von`,\n    'optional': `Optional`,\n    'outOfRangeNumber': ({ min, max }): string => {\n      return `Der Wert muss zwischen ${min} und ${max} liegen.`\n    },\n    'outOfRangeSelectionItems': ({ min, max }): string => {\n      return `Es müssen zwischen ${min} und ${max} Elemente ausgewählt werden.`\n    },\n    'outOfRangeString': ({ min, max }): string => {\n      return `Der Wert muss zwischen ${min} und ${max} Zeichen lang sein.`\n    },\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    'showLess': `Weniger anzeigen`,\n    'showMore': `Mehr anzeigen`,\n    'showSlide': ({ index }): string => {\n      return `Zeige Slide ${index}`\n    },\n    'slide': `Slide`,\n    'slideNavigation': `Slide Navigation`,\n    'slideOf': ({ index, length }): string => {\n      return `Slide ${index} von ${length} slides`\n    },\n    'startDate': `Start`,\n    'street': `Straße`,\n    'submit': `Abschicken`,\n    'success': `Erfolg`,\n    'text': `Text`,\n    'themeMode': ({ theme }): string => {\n      return TranslationGen.resolveSelect(theme, {\n        'dark': `Dunkel`,\n        'light': `Hell`,\n        'system': `System`,\n      })\n    },\n    'themes': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Farbschema`,\n        'other': `Farbschemas`,\n      })\n    },\n    'time.ago': `vor`,\n    'time.agoDays': ({ days }): string => {\n      return `var ${days} Tagen`\n    },\n    'time.april': `April`,\n    'time.august': `August`,\n    'time.century': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Jahrhundert`,\n        'other': `Jahrhunderte`,\n      })\n    },\n    'time.day': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Tag`,\n        'other': `Tage`,\n      })\n    },\n    'time.decade': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Jahrzehnt`,\n        'other': `Jahrzehnte`,\n      })\n    },\n    'time.december': `December`,\n    'time.february': `Febuar`,\n    'time.hour': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Stunde`,\n        'other': `Stunden`,\n      })\n    },\n    'time.in': `in`,\n    'time.inDays': ({ days }): string => {\n      return `in ${days} Tagen`\n    },\n    'time.january': `Januar`,\n    'time.july': `Juli`,\n    'time.june': `Juni`,\n    'time.march': `März`,\n    'time.may': `Mai`,\n    'time.microsecond': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Mikrosekunde`,\n        'other': `Mikrosekunden`,\n      })\n    },\n    'time.millisecond': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Millisekunde`,\n        'other': `Millisekunden`,\n      })\n    },\n    'time.minute': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Minute`,\n        'other': `Minuten`,\n      })\n    },\n    'time.month': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Monat`,\n        'other': `Monate`,\n      })\n    },\n    'time.monthName': ({ month }): string => {\n      return TranslationGen.resolveSelect(month, {\n        'january': `Januar`,\n        'february': `Februar`,\n        'march': `März`,\n        'april': `April`,\n        'may': `Mai`,\n        'june': `Juni`,\n        'july': `Juli`,\n        'august': `August`,\n        'september': `September`,\n        'october': `Oktober`,\n        'november': `November`,\n        'december': `Dezember`,\n        'other': `Unbekannter Monat`,\n      })\n    },\n    'time.nanosecond': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Nanosekunde`,\n        'other': `Nanosekunden`,\n      })\n    },\n    'time.november': `November`,\n    'time.october': `October`,\n    'time.second': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Sekunde`,\n        'other': `Sekunden`,\n      })\n    },\n    'time.september': `September`,\n    'time.today': `Heute`,\n    'time.tomorrow': `Morgen`,\n    'time.year': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Jahr`,\n        'other': `Jahre`,\n      })\n    },\n    'time.yesterday': `Gestern`,\n    'tooFewSelectionItems': ({ min }): string => {\n      return `Es müssen mindestens ${min} Elemente ausgewählt werden.`\n    },\n    'tooLong': ({ max }): string => {\n      return `Der Wert darf höchstens ${max} Zeichen enthalten.`\n    },\n    'tooManySelectionItems': ({ max }): string => {\n      return `Es müssen maximal ${max} Elemente ausgewählt werden.`\n    },\n    'tooShort': ({ min }): string => {\n      return `Der Wert muss mindestens ${min} Zeichen enthalten.`\n    },\n    'unsavedChanges': `Ungespeicherte Änderungen`,\n    'unsavedChangesSaveQuestion': `Möchtest du die Änderungen speichern?`,\n    'update': `Update`,\n    'value': `Wert`,\n    'welcome': `Willkommen`,\n    'yes': `Ja`\n  },\n  'en-US': {\n    'add': `Add`,\n    'age': `Age`,\n    'all': `All`,\n    'apply': `Apply`,\n    'back': `Back`,\n    'cancel': `Cancel`,\n    'carousel': `Carousel`,\n    'change': `Change`,\n    'chooseLanguage': `Choose your language`,\n    'chooseSlide': `Choose slide to display`,\n    'chooseTheme': `Choose your preferred color theme.`,\n    'clear': `Clear`,\n    'click': `Click`,\n    'clickToCopy': `Click to Copy`,\n    'clickToSelect': `Click to select`,\n    'close': `Close`,\n    'confirm': `Confirm`,\n    'copied': `Copied`,\n    'copy': `Copy`,\n    'create': `Create`,\n    'decline': `Decline`,\n    'delete': `Delete`,\n    'discard': `Discard`,\n    'discardChanges': `Discard Changes`,\n    'done': `Done`,\n    'edit': `Edit`,\n    'endDate': `End`,\n    'enterText': `Enter text here`,\n    'entryDate': `Entry Date`,\n    'error': `Error`,\n    'errorOccurred': `An error occurred`,\n    'exit': `Exit`,\n    'fieldRequiredError': `This field is required.`,\n    'filter': `Filter`,\n    'gender': ({ gender }): string => {\n      return TranslationGen.resolveSelect(gender, {\n        'male': `Male`,\n        'female': `Female`,\n        'other': `Other`,\n      })\n    },\n    'goodToSeeYou': `Good to see you`,\n    'identifier': `Identifier`,\n    'invalidEmail': `The email is not valid.`,\n    'invalidEmailError': `Please enter a valid email address.`,\n    'language': `Language`,\n    'less': `Less`,\n    'loading': `Loading`,\n    'locale': `Locale`,\n    'max': `Max`,\n    'maxLengthError': `Maximum length exceeded.`,\n    'min': `Min`,\n    'minLengthError': `Minimum length not met.`,\n    'more': `More`,\n    'name': `Name`,\n    'next': `Next`,\n    'no': `No`,\n    'none': `None`,\n    'notEmpty': `The field cannot be empty.`,\n    'nothingFound': `Nothing found`,\n    'of': `of`,\n    'optional': `Optional`,\n    'outOfRangeNumber': ({ min, max }): string => {\n      return `The value must be between ${min} and ${max}.`\n    },\n    'outOfRangeSelectionItems': ({ min, max }): string => {\n      return `Between ${min} and ${max} items must be selected.`\n    },\n    'outOfRangeString': ({ min, max }): string => {\n      return `The value needs to have between ${min} and ${max} characters.`\n    },\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    'showLess': `Show less`,\n    'showMore': `Show more`,\n    'showSlide': ({ index }): string => {\n      return `Show Slide ${index}`\n    },\n    'slide': `Slide`,\n    'slideNavigation': `Slide navigation`,\n    'slideOf': ({ index, length }): string => {\n      return `Slide ${index} of ${length} slides`\n    },\n    'startDate': `Start`,\n    'street': `Street`,\n    'submit': `Submit`,\n    'success': `Success`,\n    'text': `Text`,\n    'themeMode': ({ theme }): string => {\n      return TranslationGen.resolveSelect(theme, {\n        'dark': `Dark`,\n        'light': `Light`,\n        'system': `System`,\n      })\n    },\n    'themes': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Theme`,\n        'other': `Themes`,\n      })\n    },\n    'time.ago': `ago`,\n    'time.agoDays': ({ days }): string => {\n      return `days ${days} ago`\n    },\n    'time.april': `April`,\n    'time.august': `August`,\n    'time.century': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Century`,\n        'other': `Centuries`,\n      })\n    },\n    'time.day': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Day`,\n        'other': `Days`,\n      })\n    },\n    'time.decade': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Decade`,\n        'other': `Decades`,\n      })\n    },\n    'time.december': `December`,\n    'time.february': `Febuary`,\n    'time.hour': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Hour`,\n        'other': `Hours`,\n      })\n    },\n    'time.in': `in`,\n    'time.inDays': ({ days }): string => {\n      return `in ${days} days`\n    },\n    'time.january': `January`,\n    'time.july': `July`,\n    'time.june': `June`,\n    'time.march': `March`,\n    'time.may': `May`,\n    'time.microsecond': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Microsecond`,\n        'other': `Microseconds`,\n      })\n    },\n    'time.millisecond': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Millisecond`,\n        'other': `Milliseconds`,\n      })\n    },\n    'time.minute': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Minute`,\n        'other': `Minutes`,\n      })\n    },\n    'time.month': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Month`,\n        'other': `Months`,\n      })\n    },\n    'time.monthName': ({ month }): string => {\n      return TranslationGen.resolveSelect(month, {\n        'january': `January`,\n        'february': `February`,\n        'march': `March`,\n        'april': `April`,\n        'may': `May`,\n        'june': `June`,\n        'july': `July`,\n        'august': `August`,\n        'september': `September`,\n        'october': `October`,\n        'november': `November`,\n        'december': `December`,\n        'other': `Unknown Month`,\n      })\n    },\n    'time.nanosecond': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Nanosecond`,\n        'other': `Nanoseconds`,\n      })\n    },\n    'time.november': `November`,\n    'time.october': `October`,\n    'time.second': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Second`,\n        'other': `Seconds`,\n      })\n    },\n    'time.september': `September`,\n    'time.today': `Today`,\n    'time.tomorrow': `Tomorrow`,\n    'time.year': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Year`,\n        'other': `Years`,\n      })\n    },\n    'time.yesterday': `Yesterday`,\n    'tooFewSelectionItems': ({ min }): string => {\n      return `Select at least ${min} items.`\n    },\n    'tooLong': ({ max }): string => {\n      return `The value requires less than ${max} characters.`\n    },\n    'tooManySelectionItems': ({ max }): string => {\n      return `Select at most ${max} items.`\n    },\n    'tooShort': ({ min }): string => {\n      return `The value requires at least ${min} characters.`\n    },\n    'unsavedChanges': `Unsaved Changes`,\n    'unsavedChangesSaveQuestion': `Do you want to save your changes?`,\n    'update': `Update`,\n    'value': `Value`,\n    'welcome': `Welcome`,\n    'yes': `Yes`\n  }\n}\n\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useMemo, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport { LocalizationUtil } from './util'\nimport type { SupportedLocale } from '@/src/i18n/translations'\n\nexport type LocaleContextValue = {\n  locale: SupportedLocale,\n  setLocale: Dispatch<SetStateAction<SupportedLocale>>,\n}\n\nexport const LocaleContext = createContext<LocaleContextValue>({\n  locale: LocalizationUtil.DEFAULT_LOCALE,\n  setLocale: (v) => v\n})\n\ntype LocaleWithSystem = SupportedLocale | 'system'\n\ntype LocaleProviderProps = {\n  locale?: LocaleWithSystem,\n  onChangedLocale?: (locale: SupportedLocale) => void,\n}\n\nexport const LocaleProvider = ({ children, locale, onChangedLocale }: PropsWithChildren<LocaleProviderProps>) => {\n  const {\n    value: storedLocale,\n    setValue: setStoredLocale,\n    deleteValue: deleteStoredLocale,\n  } = useLocalStorage<LocaleWithSystem>('locale', 'system')\n  const [localePreference, setLocalePreference] = useState<LocaleWithSystem>('system')\n\n  const resolvedLocale = useMemo(() => {\n    if (locale && locale !== 'system') {\n      return locale\n    }\n    if (storedLocale && storedLocale !== 'system') {\n      return storedLocale\n    }\n    if (localePreference !== 'system') {\n      return localePreference\n    }\n    return LocalizationUtil.DEFAULT_LOCALE\n  }, [locale, localePreference, storedLocale])\n\n  useEffect(() => {\n    if(!locale) return\n    if (locale === 'system') {\n      deleteStoredLocale()\n    } else {\n      setStoredLocale(locale)\n    }\n  }, [locale]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    onChangedLocale?.(resolvedLocale)\n  }, [resolvedLocale]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    const localesToTestAgainst = Object.values(LocalizationUtil.locals)\n\n    const detectLanguage = () => {\n      const matchingBrowserLanguage = window.navigator.languages\n        .map(locale =>\n          localesToTestAgainst.find(\n            (test) => locale === test || locale.split('-')[0] === LocalizationUtil.localToLanguage(test)\n          ))\n        .filter((entry): entry is SupportedLocale => entry !== undefined)\n\n      if (matchingBrowserLanguage.length === 0) return\n\n      const firstMatch = matchingBrowserLanguage[0]\n      setLocalePreference(firstMatch)\n    }\n    detectLanguage()\n\n    window.addEventListener('languagechange', detectLanguage)\n    return () => {\n      window.removeEventListener('languagechange', detectLanguage)\n    }\n  }, [])\n\n  return (\n    <LocaleContext.Provider value={{\n      locale: resolvedLocale,\n      setLocale: (newLocale) => {\n        if (locale !== 'system') {\n          console.warn('LocaleProvider: Attempting to change the ' +\n            \"locale while setting a fixed locale won't have any effect. \" +\n            'Change the locale provided to the LocaleProvider instead.')\n        }\n        setStoredLocale(newLocale)\n      }\n    }}>\n      {children}\n    </LocaleContext.Provider>\n  )\n}\n\nexport const useLocale = () => {\n  const context = useContext(LocaleContext)\n  if (!context) {\n    throw new Error('useLocale must be used within LocaleContext. Try adding a LocaleProvider around your app.')\n  }\n  return context\n}\n\nexport const useLanguage = () => {\n  const context = useContext(LocaleContext)\n  if (!context) {\n    throw new Error('useLanguage must be used within LocaleContext. Try adding a LocaleProvider around your app.')\n  }\n  return { language: LocalizationUtil.localToLanguage(context.locale) }\n}\n","'use client'\n\nimport type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useState } from 'react'\nimport { LocalStorageService } from '@/src/utils/storage'\nimport { resolveSetState } from '@/src/utils/resolveSetState'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\n\ntype UseLocalStorageResult<T> = {\n  value: T,\n  setValue: SetValue<T>,\n  deleteValue: () => void,\n}\n\n/**\n * @param key Key under which to save the data\n * @param backupValue Used if the storage is unavailable or no value is present\n *\n * The backup value will never be saved to the storage unless you explicitly\n */\nexport const useLocalStorage = <T>(key: string, backupValue: T): UseLocalStorageResult<T> => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return backupValue\n    }\n    const storageService = new LocalStorageService()\n    try {\n      const value = storageService.get<T>(key)\n      return value || backupValue\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    } catch (_) {\n      console.warn('useLocalStorage: Error while reading the stored value. Make sure your typing is correct.')\n      storageService.delete(key)\n      console.info(`useLocalStorage: deleted erroneous value for key: ${key}`)\n      return backupValue\n    }\n  }, [backupValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(action => {\n    const newValue = resolveSetState(action, storedValue)\n    const storageService = new LocalStorageService()\n    storageService.set(key, newValue)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  const deleteValue = () => {\n    const storageService = new LocalStorageService()\n    storageService.delete(key)\n    setStoredValue(backupValue)\n  }\n\n  return { value: storedValue, setValue, deleteValue }\n}","import type { SupportedLocale } from '@/src/i18n/translations'\nimport { supportedLocales } from '@/src/i18n/translations'\n\n/**\n * The supported locales' names in their respective language\n */\nconst localsNames: Record<SupportedLocale, string> = {\n  'en-US': 'English (US)',\n  'de-DE': 'Deutsch',\n}\n\n/**\n * The default locale\n */\nconst DEFAULT_LOCALE: SupportedLocale = 'en-US'\n\nfunction localeToLanguage(locale: SupportedLocale) {\n  return locale.split('-')[0]\n}\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LocalizationUtil = {\n  locals: supportedLocales,\n  localToLanguage: localeToLanguage,\n  DEFAULT_LOCALE,\n  languagesLocalNames: localsNames,\n}\n","import type { GeneratedTranslationEntries, SupportedLocale } from '@/src/i18n/translations'\nimport { generatedTranslations } from '@/src/i18n/translations'\nimport { useLocale } from '@/src/i18n/LocaleProvider'\nimport type { PartialTranslation, Translation, TranslationEntries } from '@helpwave/internationalization'\nimport { combineTranslation, ICUUtil } from '@helpwave/internationalization'\nimport { ArrayUtil } from '@/src/utils/array'\nimport type { SingleOrArray } from '@/src/utils/typing'\n\n/**\n * Use for translations where you know that all values are ICU strings.\n *\n * This most likely is the case for Translations provided by a backend,\n * for more dynamic and typesafe translation use useTranslation instead\n */\nexport function useICUTranslation<L extends string, T extends Record<string, string>>(\n  translations: Translation<L, T>[] | Translation<L, T>,\n  locale: L\n) {\n  translations = Array.isArray(translations) ? translations : [translations]\n\n  return function translate(\n    key: string,\n    values?: Record<string, object>\n  ): string {\n    try {\n      for (let i = 0; i < translations.length; i++) {\n        const localizedTranslation = translations[i][locale]\n        if (!localizedTranslation) continue\n\n        const msg = localizedTranslation[key]\n        if (typeof msg === 'string') {\n          return ICUUtil.interpret(msg, values)\n        }\n      }\n      console.warn(`useTranslation: No translation for key \"${key}\" found.`)\n    } catch (e) {\n      console.error(`useTranslation: Error translating key \"${String(key)}\"`, e)\n    }\n\n    return `{{${String(locale)}:${String(key)}}}`\n  }\n}\n\n// TODO allow translation overwrites\ntype UseTranslationOverwrites = {\n  locale?: SupportedLocale,\n}\n\ntype TranslationExtension<\n  L1 extends string,\n  L2 extends string,\n  T1 extends TranslationEntries,\n  T2 extends TranslationEntries\n> = PartialTranslation<L1 | L2, T1 & T2>\n\ntype BaseTranslationExtension<L extends string, T extends TranslationEntries>\n  = TranslationExtension<L, SupportedLocale, T, GeneratedTranslationEntries>\n/**\n * A wrapper for the useTranslation to load and specify the translations for the library\n */\nexport function useTranslation<L extends string, T extends TranslationEntries>(\n  extensions?: SingleOrArray<BaseTranslationExtension<L,T>>,\n  overwrites?: UseTranslationOverwrites\n) {\n  const { locale: inferredLocale } = useLocale()\n  const locale = overwrites?.locale ?? inferredLocale\n  const translationExtensions = ArrayUtil.resolveSingleOrArray(extensions)\n\n  return combineTranslation<L | SupportedLocale, T & GeneratedTranslationEntries>([\n    ...translationExtensions,\n    generatedTranslations as BaseTranslationExtension<L,T>\n  ], locale)\n}\n","export const equalSizeGroups = <T>(array: T[], groupSize: number): T[][] => {\n  if (groupSize <= 0) {\n    console.warn(`group size should be greater than 0: groupSize = ${groupSize}`)\n    return [[...array]]\n  }\n\n  const groups = []\n  for (let i = 0; i < array.length; i += groupSize) {\n    groups.push(array.slice(i, Math.min(i + groupSize, array.length)))\n  }\n  return groups\n}\n\nexport type RangeOptions = {\n  /**  Whether the range can be defined empty via end < start without a warning */\n  allowEmptyRange: boolean,\n  stepSize: number,\n  exclusiveStart: boolean,\n  exclusiveEnd: boolean,\n}\n\nconst defaultRangeOptions: RangeOptions = {\n  allowEmptyRange: false,\n  stepSize: 1,\n  exclusiveStart: false,\n  exclusiveEnd: true,\n}\n\n/**\n * @param endOrRange The end value or a range [start, end], end is exclusive\n * @param options the options for defining the range\n */\nexport const range = (endOrRange: number | [number, number], options?: Partial<RangeOptions>): number[] => {\n  const { allowEmptyRange, stepSize, exclusiveStart, exclusiveEnd } = { ...defaultRangeOptions, ...options }\n  let start = 0\n  let end: number\n  if (typeof endOrRange === 'number') {\n    end = endOrRange\n  } else {\n    start = endOrRange[0]\n    end = endOrRange[1]\n  }\n  if (!exclusiveEnd) {\n    end -= 1\n  }\n  if (exclusiveStart) {\n    start += 1\n  }\n\n  if (end - 1 < start) {\n    if (!allowEmptyRange) {\n      console.warn(`range: end (${end}) < start (${start}) should be allowed explicitly, set options.allowEmptyRange to true`)\n    }\n    return []\n  }\n  return Array.from({ length: end - start }, (_, index) => index * stepSize + start)\n}\n\n/** Finds the closest match\n * @param list The list of all possible matches\n * @param firstCloser Return whether item1 is closer than item2\n */\nexport const closestMatch = <T>(list: T[], firstCloser: (item1: T, item2: T) => boolean) => {\n  return list.reduce((item1, item2) => {\n    return firstCloser(item1, item2) ? item1 : item2\n  })\n}\n\n/**\n * returns the item in middle of a list and its neighbours before and after\n * e.g. [1,2,3,4,5,6] for item = 1 would return [5,6,1,2,3]\n */\nexport const getNeighbours = <T>(list: T[], item: T, neighbourDistance: number = 2) => {\n  const index = list.indexOf(item)\n  const totalItems = neighbourDistance * 2 + 1\n  if (list.length < totalItems) {\n    console.warn('List is to short')\n    return list\n  }\n\n  if (index === -1) {\n    console.error('item not found in list')\n    return list.splice(0, totalItems)\n  }\n\n  let start = index - neighbourDistance\n  if (start < 0) {\n    start += list.length\n  }\n  const end = (index + neighbourDistance + 1) % list.length\n\n  const result: T[] = []\n  let ignoreOnce = list.length === totalItems\n  for (let i = start; i !== end || ignoreOnce; i = (i + 1) % list.length) {\n    result.push(list[i]!)\n    if (end === i && ignoreOnce) {\n      ignoreOnce = false\n    }\n  }\n  return result\n}\n\nexport const createLoopingListWithIndex = <T>(list: T[], startIndex: number = 0, length: number = 0, forwards: boolean = true) => {\n  if (length < 0) {\n    console.warn(`createLoopingList: length must be >= 0, given ${length}`)\n  } else if (length === 0) {\n    length = list.length\n  }\n\n  const returnList: [number, T][] = []\n\n  if (forwards) {\n    for (let i = startIndex; returnList.length < length; i = (i + 1) % list.length) {\n      returnList.push([i, list[i]!])\n    }\n  } else {\n    for (let i = startIndex; returnList.length < length; i = i === 0 ? i = list.length - 1 : i - 1) {\n      returnList.push([i, list[i]!])\n    }\n  }\n\n  return returnList\n}\n\nexport const createLoopingList = <T>(list: T[], startIndex: number = 0, length: number = 0, forwards: boolean = true) => {\n  return createLoopingListWithIndex(list, startIndex, length, forwards).map(([_, item]) => item)\n}\n\n/**\n * @param list The list to be changed\n * @param move The shifting applied to the array (can be negative)\n */\nconst moveItems = <T>(list: T[], move: number = 0) => {\n  const result = []\n  let start = move\n  if (start < 0) {\n    start = list.length - move\n  }\n  start = start % list.length\n  for (let i = 0; i < list.length; i++) {\n    result[i] = list[(i + start) % list.length]\n  }\n  return result\n}\n\nfunction resolveSingleOrArray<T>(value: T | T[]): T[] {\n  if (Array.isArray(value)) {\n    return value\n  } else if (value) {\n    return [value]\n  }\n  return []\n}\n\nexport const ArrayUtil = {\n  unique: <T>(list: T[]): T[] => {\n    const seen = new Set<T>()\n    return list.filter((item) => {\n      if (seen.has(item)) {\n        return false\n      }\n      seen.add(item)\n      return true\n    })\n  },\n  difference: <T>(list: T[], removeList: T[]): T[] => {\n    const remove = new Set<T>(removeList)\n    return list.filter((item) => !remove.has(item))\n  },\n  moveItems,\n  resolveSingleOrArray\n}\n","import type { ReactNode, TextareaHTMLAttributes } from 'react'\nimport { forwardRef, useId } from 'react'\nimport clsx from 'clsx'\nimport type { LabelProps } from '@/src/components/user-action/Label'\nimport { Label } from '@/src/components/user-action/Label'\nimport { useDelay, type UseDelayOptions } from '@/src/hooks/useDelay'\nimport { useOverwritableState } from '@/src/hooks/useOverwritableState'\n\nexport type TextareaProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'value'> & {\n  /** Inside the area */\n  value?: string,\n  invalid?: boolean,\n  onChangeText?: (text: string) => void,\n  onEditCompleted?: (text: string) => void,\n  saveDelayOptions?: UseDelayOptions,\n  defaultStyle?: boolean,\n}\n\n/**\n * A Textarea component for inputting longer texts\n *\n * The State is managed by the parent\n */\nexport const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(function Textarea({\n                                                                                           id,\n                                                                                           onChange,\n                                                                                           onChangeText,\n                                                                                           onBlur,\n                                                                                           onEditCompleted,\n                                                                                           saveDelayOptions,\n                                                                                           defaultStyle = true,\n                                                                                           invalid = false,\n                                                                                           disabled = false,\n                                                                                           className,\n                                                                                           ...props\n                                                                                         }, ref) {\n  const { restartTimer, clearTimer } = useDelay(saveDelayOptions)\n\n  const onEditCompletedWrapper = (text: string) => {\n    onEditCompleted?.(text)\n    clearTimer()\n  }\n\n  return (\n    <textarea\n      ref={ref}\n      id={id}\n      className={clsx(\n        'resize-none w-full h-32 overflow-y-scroll',\n        'py-2 px-3 rounded-md border-2 border-transparent focus-style-none',\n        {\n          'bg-input-background text-input-text hover:border-primary focus:border-primary': !disabled && !invalid,\n          'bg-negative/20 text-negative hover:border-negative focus-visible:border-negative': invalid && !disabled && defaultStyle,\n          'text-disabled bg-disabled-background border-disabled-border': disabled && defaultStyle,\n        },\n        className\n      )}\n      onChange={(event) => {\n        const value = event.target.value\n        restartTimer(() => {\n          onEditCompletedWrapper(value)\n        })\n        onChange?.(event)\n        onChangeText?.(value)\n      }}\n      onBlur={(event) => {\n        onBlur?.(event)\n        onEditCompletedWrapper(event.target.value)\n      }}\n      disabled={disabled}\n      {...props}\n    />\n  )\n})\n\n/**\n * A Textarea component that is not controlled by its parent\n */\nexport const TextareaUncontrolled = ({\n                                       value,\n                                       onChangeText,\n                                       ...props\n                                     }: TextareaProps) => {\n  const [text, setText] = useOverwritableState<string>(value, onChangeText)\n\n  return (\n    <Textarea\n      {...props}\n      value={text}\n      onChangeText={setText}\n    />\n  )\n}\n\nexport type TextareaWithHeadlineProps = Omit<TextareaProps, 'defaultStyle'> & {\n  headline: ReactNode,\n  headlineProps: Omit<LabelProps, 'children'>,\n  containerClassName?: string,\n}\n\nexport const TextareaWithHeadline = ({\n                                       id,\n                                       headline,\n                                       headlineProps,\n                                       disabled,\n                                       className,\n                                       containerClassName,\n                                       ...props\n                                     }: TextareaWithHeadlineProps) => {\n  const genId = useId()\n  const usedId = id ?? genId\n\n  return (\n    <div\n      className={clsx(\n        'group flex-col-3 border-2 rounded-lg',\n        {\n          'bg-input-background text-input-text hover:border-primary focus-within:border-primary': !disabled,\n          'border-disabled-border bg-disabled-background cursor-not-allowed': disabled,\n        },\n        containerClassName\n      )}\n    >\n      {headline && (\n        <Label size=\"md\" {...headlineProps} htmlFor={usedId}>\n          {headline}\n        </Label>\n      )}\n      <Textarea\n        {...props}\n        id={usedId}\n        className={clsx(\n          'border-transparent focus:ring-0 focus-visible:ring-0 resize-none h-32',\n          className\n        )}\n        defaultStyle={false}\n      />\n    </div>\n  )\n}","import clsx from 'clsx'\nimport type { LabelHTMLAttributes } from 'react'\n\nexport type LabelType = 'md' | 'lg'\n\nconst styleMapping: Record<LabelType, string> = {\n  md: 'typography-label-md color-label-text',\n  lg: 'typography-label-lg color-label-text',\n}\n\nexport type LabelProps = LabelHTMLAttributes<HTMLLabelElement> & {\n  /** The size of the label */\n  size?: LabelType,\n}\n\n/**\n * A Label component\n */\nexport const Label = ({\n                        children,\n                        size = 'md',\n                        className,\n                        ...props\n                      }: LabelProps) => {\n  return (\n    <label {...props} className={clsx(styleMapping[size], className)}>\n      {children}\n    </label>\n  )\n}\n","import { useEffect, useState } from 'react'\n\nexport type UseDelayOptionsResolved = {\n  delay: number,\n  disabled: boolean,\n}\n\nexport type UseDelayOptions = Partial<UseDelayOptionsResolved>\n\nconst defaultOptions: UseDelayOptionsResolved = {\n  delay: 3000,\n  disabled: false,\n}\n\nexport function useDelay(options?: UseDelayOptions) {\n  const [timer, setTimer] = useState<NodeJS.Timeout | undefined>(undefined)\n  const { delay, disabled }: UseDelayOptionsResolved = {\n    ...defaultOptions,\n    ...options\n  }\n\n  const clearTimer = () => {\n    clearTimeout(timer)\n    setTimer(undefined)\n  }\n\n  const restartTimer = (onDelayFinish: () => void) => {\n    if(disabled) {\n      return\n    }\n    clearTimeout(timer)\n    setTimer(setTimeout(() => {\n      onDelayFinish()\n      setTimer(undefined)\n    }, delay))\n  }\n\n  useEffect(() => {\n    return () => {\n      clearTimeout(timer)\n    }\n  }, [timer])\n\n  useEffect(() => {\n    if(disabled){\n      clearTimeout(timer)\n      setTimer(undefined)\n    }\n  }, [disabled, timer])\n\n  return { restartTimer, clearTimer, hasActiveTimer: !!timer }\n}","import type React from 'react'\nimport { useEffect, useState } from 'react'\nimport { resolveSetState } from '@/src/utils/resolveSetState'\n\nexport const useOverwritableState = <T>(initialValue?: T, onChange?: (value: T) => void): [T, React.Dispatch<React.SetStateAction<T>>] => {\n  const [state, setState] = useState<T>(initialValue)\n\n  useEffect(() => {\n    setState(initialValue)\n  }, [initialValue])\n\n  const onChangeWrapper: React.Dispatch<React.SetStateAction<T>> = (action) => {\n    const resolved = resolveSetState(action, state)\n    setState(resolved)\n    onChange?.(state)\n  }\n\n  return [state, onChangeWrapper]\n}","import type { ReactNode } from 'react'\nimport { AlertTriangle } from 'lucide-react'\nimport clsx from 'clsx'\nimport { TextButton } from '../user-action/Button'\nimport { useTranslation } from '@/src/i18n/useTranslation'\n\nexport type PropertyBaseProps = {\n  name: string,\n  input: (props: { softRequired: boolean, hasValue: boolean }) => ReactNode,\n  onRemove?: () => void,\n  hasValue: boolean,\n  softRequired?: boolean,\n  readOnly?: boolean,\n  icon?: ReactNode,\n  className?: string,\n}\n\n/**\n * A component for showing a properties with uniform styling\n */\nexport const PropertyBase = ({\n                               name,\n                               input,\n                               softRequired = false,\n                               hasValue,\n                               icon,\n                               readOnly,\n                               onRemove,\n                               className = '',\n                             }: PropertyBaseProps) => {\n  const translation = useTranslation()\n  const requiredAndNoValue = softRequired && !hasValue\n  return (\n    <div className={clsx('flex-row-0 group', className)}>\n      <div\n        className={clsx(\n          'flex-row-2 max-w-48 min-w-48 px-3 py-2 items-center rounded-l-xl border-2 border-r-0', {\n            'bg-property-title-background text-property-title-text group-hover:border-primary': !requiredAndNoValue,\n            'bg-warning text-surface-warning group-hover:border-warning border-warning/90': requiredAndNoValue,\n          }, className\n        )}\n      >\n        <div className=\"max-w-6 min-w-6 text-text-primary\">{icon}</div>\n        <span className=\"font-semibold\">{name}</span>\n      </div>\n      <div\n        className={clsx(\n          'flex-row-2 grow px-3 py-2 justify-between items-center rounded-r-xl border-2 border-l-0 min-h-15', {\n            'bg-input-background text-input-text group-hover:border-primary': !requiredAndNoValue,\n            'bg-surface-warning group-hover:border-warning border-warning/90': requiredAndNoValue,\n          }, className\n        )}\n      >\n        {input({ softRequired, hasValue })}\n        {requiredAndNoValue && (\n          <div className=\"text-warning\"><AlertTriangle size={24}/></div>\n        )}\n        {onRemove && !readOnly && (\n          <TextButton\n            onClick={onRemove}\n            color=\"negative\"\n            className={clsx('items-center')}\n            disabled={!hasValue}\n          >\n            {translation('remove')}\n          </TextButton>\n        )}\n      </div>\n    </div>\n  )\n}\n","import type { ButtonHTMLAttributes, ReactNode } from 'react'\nimport { forwardRef } from 'react'\nimport clsx from 'clsx'\n\n\nexport const ButtonColorUtil = {\n  solid: ['primary', 'secondary', 'tertiary', 'positive', 'warning', 'negative', 'neutral'] as const,\n  text: ['primary', 'negative', 'neutral'] as const,\n  outline: ['primary'] as const,\n}\n\nexport const IconButtonUtil = {\n  icon: [...ButtonColorUtil.solid, 'transparent'] as const,\n}\n\n\n/**\n * The allowed colors for the SolidButton and IconButton\n */\nexport type SolidButtonColor = typeof ButtonColorUtil.solid[number]\n/**\n * The allowed colors for the OutlineButton\n */\nexport type OutlineButtonColor = typeof ButtonColorUtil.outline[number]\n/**\n * The allowed colors for the TextButton\n */\nexport type TextButtonColor = typeof ButtonColorUtil.text[number]\n/**\n * The allowed colors for the IconButton\n */\nexport type IconButtonColor = typeof IconButtonUtil.icon[number]\n\n\n/**\n * The different sizes for a button\n */\ntype ButtonSizes = 'small' | 'medium' | 'large' | 'none'\n\ntype IconButtonSize = 'tiny' | 'small' | 'medium' | 'large' | 'none'\n\n/**\n * The shard properties between all button types\n */\nexport type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n  /**\n   * @default 'medium'\n   */\n  size?: ButtonSizes,\n}\n\nconst paddingMapping: Record<ButtonSizes, string> = {\n  none: '',\n  small: 'btn-sm',\n  medium: 'btn-md',\n  large: 'btn-lg'\n}\n\nconst iconPaddingMapping: Record<IconButtonSize, string> = {\n  none: '',\n  tiny: 'icon-btn-xs',\n  small: 'icon-btn-sm',\n  medium: 'icon-btn-md',\n  large: 'icon-btn-lg'\n}\n\nexport const ButtonUtil = {\n  paddingMapping,\n  iconPaddingMapping\n}\n\ntype ButtonWithIconsProps = ButtonProps & {\n  startIcon?: ReactNode,\n  endIcon?: ReactNode,\n}\n\nexport type SolidButtonProps = ButtonWithIconsProps & {\n  color?: SolidButtonColor,\n}\n\nexport type OutlineButtonProps = ButtonWithIconsProps & {\n  color?: OutlineButtonColor,\n}\n\nexport type TextButtonProps = ButtonWithIconsProps & {\n  color?: TextButtonColor,\n  coloredHoverBackground?: boolean,\n}\n\n/**\n * The shard properties between all button types\n */\nexport type IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n  /**\n   * @default 'medium'\n   */\n  size?: IconButtonSize,\n  color?: IconButtonColor,\n}\n\n/**\n * A button with a solid background and different sizes\n */\nexport const SolidButton = forwardRef<HTMLButtonElement, SolidButtonProps>(function SolidButton({\n                                                                                           children,\n                                                                                           color = 'primary',\n                                                                                           size = 'medium',\n                                                                                           startIcon,\n                                                                                           endIcon,\n                                                                                           onClick,\n                                                                                           className,\n                                                                                           ...restProps\n                                                                                         }, ref) {\n  const colorClasses = {\n    primary: 'not-disabled:bg-button-solid-primary-background not-disabled:text-button-solid-primary-text',\n    secondary: 'not-disabled:bg-button-solid-secondary-background not-disabled:text-button-solid-secondary-text',\n    tertiary: 'not-disabled:bg-button-solid-tertiary-background not-disabled:text-button-solid-tertiary-text',\n    positive: 'not-disabled:bg-button-solid-positive-background not-disabled:text-button-solid-positive-text',\n    warning: 'not-disabled:bg-button-solid-warning-background not-disabled:text-button-solid-warning-text',\n    negative: 'not-disabled:bg-button-solid-negative-background not-disabled:text-button-solid-negative-text',\n    neutral: 'not-disabled:bg-button-solid-neutral-background not-disabled:text-button-solid-neutral-text',\n  }[color]\n\n  const iconColorClasses = {\n    primary: 'not-group-disabled:text-button-solid-primary-icon',\n    secondary: 'not-group-disabled:text-button-solid-secondary-icon',\n    tertiary: 'not-group-disabled:text-button-solid-tertiary-icon',\n    positive: 'not-group-disabled:text-button-solid-positive-icon',\n    warning: 'not-group-disabled:text-button-solid-warning-icon',\n    negative: 'not-group-disabled:text-button-solid-negative-icon',\n    neutral: 'not-group-disabled:text-button-solid-neutral-icon',\n  }[color]\n\n  return (\n    <button\n      ref={ref}\n      onClick={onClick}\n      className={clsx(\n        'group font-semibold',\n        colorClasses,\n        'not-disabled:hover:brightness-90',\n        'disabled:text-disabled disabled:bg-disabled-background',\n        ButtonUtil.paddingMapping[size],\n        className\n      )}\n      {...restProps}\n    >\n      {startIcon && (\n        <span\n          className={clsx(\n            iconColorClasses,\n            'group-disabled:text-disabled-icon'\n          )}\n        >\n          {startIcon}\n        </span>\n      )}\n      {children}\n      {endIcon && (\n        <span\n          className={clsx(\n            iconColorClasses,\n            'group-disabled:text-disabled-icon'\n          )}\n        >\n          {endIcon}\n        </span>\n      )}\n    </button>\n  )\n})\n\n/**\n * A button with an outline border and different sizes\n */\nexport const OutlineButton = ({\n                         children,\n                         color = 'primary',\n                         size = 'medium',\n                         startIcon,\n                         endIcon,\n                         onClick,\n                         className,\n                         ...restProps\n                       }: OutlineButtonProps) => {\n  const colorClasses = {\n    primary: 'not-disabled:border-button-outline-primary-text not-disabled:text-button-outline-primary-text',\n  }[color]\n\n  const iconColorClasses = {\n    primary: 'not-group-disabled:text-button-outline-primary-icon',\n  }[color]\n  return (\n    <button\n      onClick={onClick}\n      className={clsx(\n        'group font-semibold bg-transparent border-2 ',\n        'not-disabled:hover:brightness-80',\n        colorClasses,\n        'disabled:text-disabled disabled:border-disabled-outline',\n        ButtonUtil.paddingMapping[size],\n        className\n      )}\n      {...restProps}\n    >\n      {startIcon && (\n        <span\n          className={clsx(\n            iconColorClasses,\n            'group-disabled:text-disabled-icon'\n          )}\n        >\n          {startIcon}\n        </span>\n      )}\n      {children}\n      {endIcon && (\n        <span\n          className={clsx(\n            iconColorClasses,\n            'group-disabled:text-disabled-icon'\n          )}\n        >\n          {endIcon}\n        </span>\n      )}\n    </button>\n  )\n}\n\n/**\n * A text that is a button that can have different sizes\n */\nexport const TextButton = ({\n                      children,\n                      color = 'neutral',\n                      size = 'medium',\n                      startIcon,\n                      endIcon,\n                      onClick,\n                      coloredHoverBackground = true,\n                      className,\n                      ...restProps\n                    }: TextButtonProps) => {\n  const colorClasses = {\n    primary: 'not-disabled:bg-transparent not-disabled:text-button-text-primary-text not-disabled:focus-visible:outline-button-text-primary-text',\n    negative: 'not-disabled:bg-transparent not-disabled:text-button-text-negative-text not-disabled:focus-visible:outline-button-text-negative-text',\n    neutral: 'not-disabled:bg-transparent not-disabled:text-button-text-neutral-text not-disabled:focus-visible:outline-button-text-neutral-text',\n  }[color]\n\n  const backgroundColor = {\n    primary: 'not-disabled:hover:bg-button-text-primary-text/20 not-disabled:focus-visible:bg-button-text-primary-text/20',\n    negative: 'not-disabled:hover:bg-button-text-negative-text/20 not-disabled:focus-visible:bg-button-text-negative-text/20',\n    neutral: 'not-disabled:hover:bg-button-text-neutral-text/20 not-disabled:focus-visible:bg-button-text-neutral-text/20',\n  }[color]\n\n  const iconColorClasses = {\n    primary: 'not-group-disabled:text-button-text-primary-icon',\n    negative: 'not-group-disabled:text-button-text-negative-icon',\n    neutral: 'not-group-disabled:text-button-text-neutral-icon',\n  }[color]\n\n  return (\n    <button\n      onClick={onClick}\n      className={clsx(\n        'group font-semibold',\n        'disabled:text-disabled',\n        colorClasses,\n        {\n          [backgroundColor]: coloredHoverBackground,\n          'not-disabled:hover:bg-button-text-hover-background': !coloredHoverBackground,\n        },\n        ButtonUtil.paddingMapping[size],\n        className\n      )}\n      {...restProps}\n    >\n      {startIcon && (\n        <span\n          className={clsx(\n            iconColorClasses,\n            'group-disabled:text-disabled-icon'\n          )}\n        >\n          {startIcon}\n        </span>\n      )}\n      {children}\n      {endIcon && (\n        <span\n          className={clsx(\n            iconColorClasses,\n            'group-disabled:text-disabled-icon'\n          )}\n        >\n          {endIcon}\n        </span>\n      )}\n    </button>\n  )\n}\n\n\n/**\n * A button for icons with a solid background and different sizes\n */\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(function IconButton({\n                                                                                        children,\n                                                                                        color = 'primary',\n                                                                                        size = 'medium',\n                                                                                        className,\n                                                                                        ...restProps\n                                                                                      }, ref)\n{\n  const colorClasses = {\n    primary: 'not-disabled:bg-button-solid-primary-background not-disabled:text-button-solid-primary-text',\n    secondary: 'not-disabled:bg-button-solid-secondary-background not-disabled:text-button-solid-secondary-text',\n    tertiary: 'not-disabled:bg-button-solid-tertiary-background not-disabled:text-button-solid-tertiary-text',\n    positive: 'not-disabled:bg-button-solid-positive-background not-disabled:text-button-solid-positive-text',\n    warning: 'not-disabled:bg-button-solid-warning-background not-disabled:text-button-solid-warning-text',\n    negative: 'not-disabled:bg-button-solid-negative-background not-disabled:text-button-solid-negative-text',\n    neutral: 'not-disabled:bg-button-solid-neutral-background not-disabled:text-button-solid-neutral-text',\n    transparent: 'not-disabled:bg-transparent',\n  }[color]\n\n  return (\n    <button\n      ref={ref}\n      className={clsx(\n        colorClasses,\n        'not-disabled:hover:brightness-90',\n        'disabled:text-disabled',\n        {\n          'disabled:bg-disabled-background': color !== 'transparent',\n          'disabled:opacity-70': color === 'transparent',\n          'not-disabled:hover:bg-button-text-hover-background': color === 'transparent',\n        },\n        ButtonUtil.iconPaddingMapping[size],\n        className\n      )}\n      {...restProps}\n    >\n      {children}\n    </button>\n  )\n})"],"mappings":"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","names":["clsx","useState","clsx","jsx","useEffect","useState","useEffect","useState","jsx","Textarea","clsx","clsx","forwardRef","clsx","jsx","jsxs","SolidButton","jsxs","clsx","jsx","forwardRef","IconButton","jsx","jsxs","clsx","jsx","clsx","value"]}
+{"version":3,"sources":["../../../src/components/properties/TextProperty.tsx","../../../src/i18n/LocaleProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/i18n/translations.ts","../../../src/i18n/util.ts","../../../src/i18n/useHightideTranslation.ts","../../../src/utils/array.ts","../../../src/components/user-action/Textarea.tsx","../../../src/components/user-action/Label.tsx","../../../src/hooks/useDelay.ts","../../../src/hooks/useOverwritableState.ts","../../../src/components/properties/PropertyBase.tsx","../../../src/components/user-action/Button.tsx"],"sourcesContent":["import { Text } from 'lucide-react'\nimport clsx from 'clsx'\nimport { useHightideTranslation } from '@/src/i18n/useHightideTranslation'\nimport { Textarea } from '../user-action/Textarea'\nimport type { PropertyBaseProps } from './PropertyBase'\nimport { PropertyBase } from './PropertyBase'\n\nexport type TextPropertyProps = Omit<PropertyBaseProps, 'icon' | 'input' | 'hasValue'> & {\n  value?: string,\n  onChange?: (value: string) => void,\n  onEditComplete?: (value: string) => void,\n}\n\n/**\n * An Input for Text properties\n */\nexport const TextProperty = ({\n                               value,\n                               readOnly,\n                               onChange,\n                               onRemove,\n                               onEditComplete,\n                               ...baseProps\n                             }: TextPropertyProps) => {\n  const translation = useHightideTranslation()\n  const hasValue = value !== undefined\n\n  return (\n    <PropertyBase\n      {...baseProps}\n      onRemove={onRemove}\n      hasValue={hasValue}\n      icon={<Text size={24}/>}\n      input={({ softRequired }) => (\n        <Textarea\n          className={clsx({\n            'bg-surface-warning placeholder-warning': softRequired && !hasValue\n          })}\n          rows={5}\n          defaultStyle={false}\n          value={value ?? ''}\n          readOnly={readOnly}\n          placeholder={`${translation('text')}...`}\n          onChangeText={(value) => {\n            if (!value) {\n              onRemove?.()\n            } else {\n              onChange?.(value)\n            }\n          }}\n          onEditCompleted={(value) => {\n            if (!value) {\n              onRemove?.()\n            } else {\n              onEditComplete?.(value)\n            }\n          }}\n        />\n      )}\n    />\n  )\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useMemo, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport { LocalizationUtil } from './util'\nimport type { HightideTranslationLocales } from '@/src/i18n/translations'\n\nexport type LocaleContextValue = {\n  locale: HightideTranslationLocales,\n  setLocale: Dispatch<SetStateAction<HightideTranslationLocales>>,\n}\n\nexport const LocaleContext = createContext<LocaleContextValue>({\n  locale: LocalizationUtil.DEFAULT_LOCALE,\n  setLocale: (v) => v\n})\n\ntype LocaleWithSystem = HightideTranslationLocales | 'system'\n\ntype LocaleProviderProps = {\n  locale?: LocaleWithSystem,\n  onChangedLocale?: (locale: HightideTranslationLocales) => void,\n}\n\nexport const LocaleProvider = ({ children, locale, onChangedLocale }: PropsWithChildren<LocaleProviderProps>) => {\n  const {\n    value: storedLocale,\n    setValue: setStoredLocale,\n    deleteValue: deleteStoredLocale,\n  } = useLocalStorage<LocaleWithSystem>('locale', 'system')\n  const [localePreference, setLocalePreference] = useState<LocaleWithSystem>('system')\n\n  const resolvedLocale = useMemo(() => {\n    if (locale && locale !== 'system') {\n      return locale\n    }\n    if (storedLocale && storedLocale !== 'system') {\n      return storedLocale\n    }\n    if (localePreference !== 'system') {\n      return localePreference\n    }\n    return LocalizationUtil.DEFAULT_LOCALE\n  }, [locale, localePreference, storedLocale])\n\n  useEffect(() => {\n    if(!locale) return\n    if (locale === 'system') {\n      deleteStoredLocale()\n    } else {\n      setStoredLocale(locale)\n    }\n  }, [locale]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    onChangedLocale?.(resolvedLocale)\n  }, [resolvedLocale]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    const localesToTestAgainst = Object.values(LocalizationUtil.locals)\n\n    const detectLanguage = () => {\n      const matchingBrowserLanguage = window.navigator.languages\n        .map(locale =>\n          localesToTestAgainst.find(\n            (test) => locale === test || locale.split('-')[0] === LocalizationUtil.localToLanguage(test)\n          ))\n        .filter((entry): entry is HightideTranslationLocales => entry !== undefined)\n\n      if (matchingBrowserLanguage.length === 0) return\n\n      const firstMatch = matchingBrowserLanguage[0]\n      setLocalePreference(firstMatch)\n    }\n    detectLanguage()\n\n    window.addEventListener('languagechange', detectLanguage)\n    return () => {\n      window.removeEventListener('languagechange', detectLanguage)\n    }\n  }, [])\n\n  return (\n    <LocaleContext.Provider value={{\n      locale: resolvedLocale,\n      setLocale: (newLocale) => {\n        if (locale !== 'system') {\n          console.warn('LocaleProvider: Attempting to change the ' +\n            \"locale while setting a fixed locale won't have any effect. \" +\n            'Change the locale provided to the LocaleProvider instead.')\n        }\n        setStoredLocale(newLocale)\n      }\n    }}>\n      {children}\n    </LocaleContext.Provider>\n  )\n}\n\nexport const useLocale = () => {\n  const context = useContext(LocaleContext)\n  if (!context) {\n    throw new Error('useLocale must be used within LocaleContext. Try adding a LocaleProvider around your app.')\n  }\n  return context\n}\n\nexport const useLanguage = () => {\n  const context = useContext(LocaleContext)\n  if (!context) {\n    throw new Error('useLanguage must be used within LocaleContext. Try adding a LocaleProvider around your app.')\n  }\n  return { language: LocalizationUtil.localToLanguage(context.locale) }\n}\n","'use client'\n\nimport type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useState } from 'react'\nimport { LocalStorageService } from '@/src/utils/storage'\nimport { resolveSetState } from '@/src/utils/resolveSetState'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\n\ntype UseLocalStorageResult<T> = {\n  value: T,\n  setValue: SetValue<T>,\n  deleteValue: () => void,\n}\n\n/**\n * @param key Key under which to save the data\n * @param backupValue Used if the storage is unavailable or no value is present\n *\n * The backup value will never be saved to the storage unless you explicitly\n */\nexport const useLocalStorage = <T>(key: string, backupValue: T): UseLocalStorageResult<T> => {\n  const get = useCallback((): T => {\n    if (typeof window === 'undefined') {\n      return backupValue\n    }\n    const storageService = new LocalStorageService()\n    try {\n      const value = storageService.get<T>(key)\n      return value || backupValue\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    } catch (_) {\n      console.warn('useLocalStorage: Error while reading the stored value. Make sure your typing is correct.')\n      storageService.delete(key)\n      console.info(`useLocalStorage: deleted erroneous value for key: ${key}`)\n      return backupValue\n    }\n  }, [backupValue, key])\n\n  const [storedValue, setStoredValue] = useState<T>(get)\n\n  const setValue: SetValue<T> = useCallback(action => {\n    const newValue = resolveSetState(action, storedValue)\n    const storageService = new LocalStorageService()\n    storageService.set(key, newValue)\n\n    setStoredValue(newValue)\n  }, [storedValue, setStoredValue, key])\n\n  const deleteValue = () => {\n    const storageService = new LocalStorageService()\n    storageService.delete(key)\n    setStoredValue(backupValue)\n  }\n\n  return { value: storedValue, setValue, deleteValue }\n}","// AUTO-GENERATED. DO NOT EDIT.\n/* eslint-disable @stylistic/quote-props */\n/* eslint-disable no-useless-escape */\n/* eslint-disable @typescript-eslint/no-unused-vars */\nimport type { Translation } from '@helpwave/internationalization'\nimport { TranslationGen } from '@helpwave/internationalization'\n\nexport const hightideTranslationLocales = ['de-DE', 'en-US'] as const\n\nexport type HightideTranslationLocales = typeof hightideTranslationLocales[number]\n\nexport type HightideTranslationEntries = {\n  'add': string,\n  'age': string,\n  'all': string,\n  'apply': string,\n  'back': string,\n  'cancel': string,\n  'carousel': string,\n  'change': string,\n  'chooseLanguage': string,\n  'chooseSlide': string,\n  'chooseTheme': string,\n  'clear': string,\n  'click': string,\n  'clickToCopy': string,\n  'clickToSelect': string,\n  'close': string,\n  'confirm': string,\n  'copied': string,\n  'copy': string,\n  'create': string,\n  'decline': string,\n  'delete': string,\n  'discard': string,\n  'discardChanges': string,\n  'done': string,\n  'edit': string,\n  'endDate': string,\n  'enterText': string,\n  'entryDate': string,\n  'error': string,\n  'errorOccurred': string,\n  'exit': string,\n  'fieldRequiredError': string,\n  'filter': string,\n  'gender': (values: { gender: string }) => string,\n  'goodToSeeYou': string,\n  'identifier': string,\n  'invalidEmail': string,\n  'invalidEmailError': string,\n  'language': string,\n  'less': string,\n  'loading': string,\n  'locale': string,\n  'max': string,\n  'maxLengthError': string,\n  'min': string,\n  'minLengthError': string,\n  'more': string,\n  'name': string,\n  'next': string,\n  'no': string,\n  'none': string,\n  'notEmpty': string,\n  'nothingFound': string,\n  'of': string,\n  'optional': string,\n  'outOfRangeNumber': (values: { min: number, max: number }) => string,\n  'outOfRangeSelectionItems': (values: { min: number, max: number }) => string,\n  'outOfRangeString': (values: { min: number, max: number }) => 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  'showLess': string,\n  'showMore': string,\n  'showSlide': (values: { index: number }) => string,\n  'slide': string,\n  'slideNavigation': string,\n  'slideOf': (values: { index: number, length: number }) => string,\n  'startDate': string,\n  'street': string,\n  'submit': string,\n  'success': string,\n  'text': string,\n  'themeMode': (values: { theme: string }) => string,\n  'themes': (values: { count: number }) => string,\n  'time.ago': string,\n  'time.agoDays': (values: { days: number }) => string,\n  'time.april': string,\n  'time.august': string,\n  'time.century': (values: { count: number }) => string,\n  'time.day': (values: { count: number }) => string,\n  'time.decade': (values: { count: number }) => string,\n  'time.december': string,\n  'time.february': string,\n  'time.hour': (values: { count: number }) => string,\n  'time.in': string,\n  'time.inDays': (values: { days: number }) => string,\n  'time.january': string,\n  'time.july': string,\n  'time.june': string,\n  'time.march': string,\n  'time.may': string,\n  'time.microsecond': (values: { count: number }) => string,\n  'time.millisecond': (values: { count: number }) => string,\n  'time.minute': (values: { count: number }) => string,\n  'time.month': (values: { count: number }) => string,\n  'time.monthName': (values: { month: string }) => string,\n  'time.nanosecond': (values: { count: number }) => string,\n  'time.november': string,\n  'time.october': string,\n  'time.second': (values: { count: number }) => string,\n  'time.september': string,\n  'time.today': string,\n  'time.tomorrow': string,\n  'time.year': (values: { count: number }) => string,\n  'time.yesterday': string,\n  'tooFewSelectionItems': (values: { min: number }) => string,\n  'tooLong': (values: { max: number }) => string,\n  'tooManySelectionItems': (values: { max: number }) => string,\n  'tooShort': (values: { min: number }) => string,\n  'unsavedChanges': string,\n  'unsavedChangesSaveQuestion': string,\n  'update': string,\n  'value': string,\n  'welcome': string,\n  'yes': string,\n}\n\nexport const hightideTranslation: Translation<HightideTranslationLocales, Partial<HightideTranslationEntries>> = {\n  'de-DE': {\n    'add': `Hinzufügen`,\n    'age': `Alter`,\n    'all': `Alle`,\n    'apply': `Anwenden`,\n    'back': `Zurück`,\n    'cancel': `Abbrechen`,\n    'carousel': `Karussell`,\n    'change': `Ändern`,\n    'chooseLanguage': `Wähle deine bevorzugte Sprache`,\n    'chooseSlide': `Wähle die angezeigte Slide aus`,\n    'chooseTheme': `Wähle dein bevorzugtes Farbschema.`,\n    'clear': `Löschen`,\n    'click': `Klicken`,\n    'clickToCopy': `Zum kopieren klicken`,\n    'clickToSelect': `Zum Auswählen drücken`,\n    'close': `Schließen`,\n    'confirm': `Bestätigen`,\n    'copied': `Kopiert`,\n    'copy': `Kopieren`,\n    'create': `Erstellen`,\n    'decline': `Ablehnen`,\n    'delete': `Löschen`,\n    'discard': `Verwerfen`,\n    'discardChanges': `Änderungen Verwerfen`,\n    'done': `Fertig`,\n    'edit': `Bearbeiten`,\n    'endDate': `Ende`,\n    'enterText': `Text hier eingeben`,\n    'entryDate': `Eintragsdatum`,\n    'error': `Fehler`,\n    'errorOccurred': `Ein Fehler ist aufgetreten`,\n    'exit': `Beenden`,\n    'fieldRequiredError': `Dieses Feld ist erforderlich.`,\n    'filter': `Filter`,\n    'gender': ({ gender }): string => {\n      return TranslationGen.resolveSelect(gender, {\n        'male': `Männlich`,\n        'female': `Weiblich`,\n        'other': `Divers`,\n      })\n    },\n    'goodToSeeYou': `Schön dich zu sehen`,\n    'identifier': `Identifikator`,\n    'invalidEmail': `Die E-Mail ist ungültig.`,\n    'invalidEmailError': `Bitte geben Sie eine gültige E-Mail-Adresse ein.`,\n    'language': `Sprache`,\n    'less': `Weniger`,\n    'loading': `Lädt`,\n    'locale': `Locale`,\n    'max': `Max`,\n    'maxLengthError': `Maximale Länge überschritten.`,\n    'min': `Min`,\n    'minLengthError': `Mindestlänge nicht erreicht.`,\n    'more': `Mehr`,\n    'name': `Name`,\n    'next': `Weiter`,\n    'no': `Nein`,\n    'none': `Nichts`,\n    'notEmpty': `Das Feld darf nicht leer sein.`,\n    'nothingFound': `Nichts gefunden`,\n    'of': `von`,\n    'optional': `Optional`,\n    'outOfRangeNumber': ({ min, max }): string => {\n      return `Der Wert muss zwischen ${min} und ${max} liegen.`\n    },\n    'outOfRangeSelectionItems': ({ min, max }): string => {\n      return `Es müssen zwischen ${min} und ${max} Elemente ausgewählt werden.`\n    },\n    'outOfRangeString': ({ min, max }): string => {\n      return `Der Wert muss zwischen ${min} und ${max} Zeichen lang sein.`\n    },\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    'showLess': `Weniger anzeigen`,\n    'showMore': `Mehr anzeigen`,\n    'showSlide': ({ index }): string => {\n      return `Zeige Slide ${index}`\n    },\n    'slide': `Slide`,\n    'slideNavigation': `Slide Navigation`,\n    'slideOf': ({ index, length }): string => {\n      return `Slide ${index} von ${length} slides`\n    },\n    'startDate': `Start`,\n    'street': `Straße`,\n    'submit': `Abschicken`,\n    'success': `Erfolg`,\n    'text': `Text`,\n    'themeMode': ({ theme }): string => {\n      return TranslationGen.resolveSelect(theme, {\n        'dark': `Dunkel`,\n        'light': `Hell`,\n        'system': `System`,\n      })\n    },\n    'themes': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Farbschema`,\n        'other': `Farbschemas`,\n      })\n    },\n    'time.ago': `vor`,\n    'time.agoDays': ({ days }): string => {\n      return `var ${days} Tagen`\n    },\n    'time.april': `April`,\n    'time.august': `August`,\n    'time.century': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Jahrhundert`,\n        'other': `Jahrhunderte`,\n      })\n    },\n    'time.day': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Tag`,\n        'other': `Tage`,\n      })\n    },\n    'time.decade': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Jahrzehnt`,\n        'other': `Jahrzehnte`,\n      })\n    },\n    'time.december': `December`,\n    'time.february': `Febuar`,\n    'time.hour': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Stunde`,\n        'other': `Stunden`,\n      })\n    },\n    'time.in': `in`,\n    'time.inDays': ({ days }): string => {\n      return `in ${days} Tagen`\n    },\n    'time.january': `Januar`,\n    'time.july': `Juli`,\n    'time.june': `Juni`,\n    'time.march': `März`,\n    'time.may': `Mai`,\n    'time.microsecond': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Mikrosekunde`,\n        'other': `Mikrosekunden`,\n      })\n    },\n    'time.millisecond': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Millisekunde`,\n        'other': `Millisekunden`,\n      })\n    },\n    'time.minute': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Minute`,\n        'other': `Minuten`,\n      })\n    },\n    'time.month': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Monat`,\n        'other': `Monate`,\n      })\n    },\n    'time.monthName': ({ month }): string => {\n      return TranslationGen.resolveSelect(month, {\n        'january': `Januar`,\n        'february': `Februar`,\n        'march': `März`,\n        'april': `April`,\n        'may': `Mai`,\n        'june': `Juni`,\n        'july': `Juli`,\n        'august': `August`,\n        'september': `September`,\n        'october': `Oktober`,\n        'november': `November`,\n        'december': `Dezember`,\n        'other': `Unbekannter Monat`,\n      })\n    },\n    'time.nanosecond': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Nanosekunde`,\n        'other': `Nanosekunden`,\n      })\n    },\n    'time.november': `November`,\n    'time.october': `October`,\n    'time.second': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Sekunde`,\n        'other': `Sekunden`,\n      })\n    },\n    'time.september': `September`,\n    'time.today': `Heute`,\n    'time.tomorrow': `Morgen`,\n    'time.year': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Jahr`,\n        'other': `Jahre`,\n      })\n    },\n    'time.yesterday': `Gestern`,\n    'tooFewSelectionItems': ({ min }): string => {\n      return `Es müssen mindestens ${min} Elemente ausgewählt werden.`\n    },\n    'tooLong': ({ max }): string => {\n      return `Der Wert darf höchstens ${max} Zeichen enthalten.`\n    },\n    'tooManySelectionItems': ({ max }): string => {\n      return `Es müssen maximal ${max} Elemente ausgewählt werden.`\n    },\n    'tooShort': ({ min }): string => {\n      return `Der Wert muss mindestens ${min} Zeichen enthalten.`\n    },\n    'unsavedChanges': `Ungespeicherte Änderungen`,\n    'unsavedChangesSaveQuestion': `Möchtest du die Änderungen speichern?`,\n    'update': `Update`,\n    'value': `Wert`,\n    'welcome': `Willkommen`,\n    'yes': `Ja`\n  },\n  'en-US': {\n    'add': `Add`,\n    'age': `Age`,\n    'all': `All`,\n    'apply': `Apply`,\n    'back': `Back`,\n    'cancel': `Cancel`,\n    'carousel': `Carousel`,\n    'change': `Change`,\n    'chooseLanguage': `Choose your language`,\n    'chooseSlide': `Choose slide to display`,\n    'chooseTheme': `Choose your preferred color theme.`,\n    'clear': `Clear`,\n    'click': `Click`,\n    'clickToCopy': `Click to Copy`,\n    'clickToSelect': `Click to select`,\n    'close': `Close`,\n    'confirm': `Confirm`,\n    'copied': `Copied`,\n    'copy': `Copy`,\n    'create': `Create`,\n    'decline': `Decline`,\n    'delete': `Delete`,\n    'discard': `Discard`,\n    'discardChanges': `Discard Changes`,\n    'done': `Done`,\n    'edit': `Edit`,\n    'endDate': `End`,\n    'enterText': `Enter text here`,\n    'entryDate': `Entry Date`,\n    'error': `Error`,\n    'errorOccurred': `An error occurred`,\n    'exit': `Exit`,\n    'fieldRequiredError': `This field is required.`,\n    'filter': `Filter`,\n    'gender': ({ gender }): string => {\n      return TranslationGen.resolveSelect(gender, {\n        'male': `Male`,\n        'female': `Female`,\n        'other': `Other`,\n      })\n    },\n    'goodToSeeYou': `Good to see you`,\n    'identifier': `Identifier`,\n    'invalidEmail': `The email is not valid.`,\n    'invalidEmailError': `Please enter a valid email address.`,\n    'language': `Language`,\n    'less': `Less`,\n    'loading': `Loading`,\n    'locale': `Locale`,\n    'max': `Max`,\n    'maxLengthError': `Maximum length exceeded.`,\n    'min': `Min`,\n    'minLengthError': `Minimum length not met.`,\n    'more': `More`,\n    'name': `Name`,\n    'next': `Next`,\n    'no': `No`,\n    'none': `None`,\n    'notEmpty': `The field cannot be empty.`,\n    'nothingFound': `Nothing found`,\n    'of': `of`,\n    'optional': `Optional`,\n    'outOfRangeNumber': ({ min, max }): string => {\n      return `The value must be between ${min} and ${max}.`\n    },\n    'outOfRangeSelectionItems': ({ min, max }): string => {\n      return `Between ${min} and ${max} items must be selected.`\n    },\n    'outOfRangeString': ({ min, max }): string => {\n      return `The value needs to have between ${min} and ${max} characters.`\n    },\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    'showLess': `Show less`,\n    'showMore': `Show more`,\n    'showSlide': ({ index }): string => {\n      return `Show Slide ${index}`\n    },\n    'slide': `Slide`,\n    'slideNavigation': `Slide navigation`,\n    'slideOf': ({ index, length }): string => {\n      return `Slide ${index} of ${length} slides`\n    },\n    'startDate': `Start`,\n    'street': `Street`,\n    'submit': `Submit`,\n    'success': `Success`,\n    'text': `Text`,\n    'themeMode': ({ theme }): string => {\n      return TranslationGen.resolveSelect(theme, {\n        'dark': `Dark`,\n        'light': `Light`,\n        'system': `System`,\n      })\n    },\n    'themes': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Theme`,\n        'other': `Themes`,\n      })\n    },\n    'time.ago': `ago`,\n    'time.agoDays': ({ days }): string => {\n      return `days ${days} ago`\n    },\n    'time.april': `April`,\n    'time.august': `August`,\n    'time.century': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Century`,\n        'other': `Centuries`,\n      })\n    },\n    'time.day': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Day`,\n        'other': `Days`,\n      })\n    },\n    'time.decade': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Decade`,\n        'other': `Decades`,\n      })\n    },\n    'time.december': `December`,\n    'time.february': `Febuary`,\n    'time.hour': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Hour`,\n        'other': `Hours`,\n      })\n    },\n    'time.in': `in`,\n    'time.inDays': ({ days }): string => {\n      return `in ${days} days`\n    },\n    'time.january': `January`,\n    'time.july': `July`,\n    'time.june': `June`,\n    'time.march': `March`,\n    'time.may': `May`,\n    'time.microsecond': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Microsecond`,\n        'other': `Microseconds`,\n      })\n    },\n    'time.millisecond': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Millisecond`,\n        'other': `Milliseconds`,\n      })\n    },\n    'time.minute': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Minute`,\n        'other': `Minutes`,\n      })\n    },\n    'time.month': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Month`,\n        'other': `Months`,\n      })\n    },\n    'time.monthName': ({ month }): string => {\n      return TranslationGen.resolveSelect(month, {\n        'january': `January`,\n        'february': `February`,\n        'march': `March`,\n        'april': `April`,\n        'may': `May`,\n        'june': `June`,\n        'july': `July`,\n        'august': `August`,\n        'september': `September`,\n        'october': `October`,\n        'november': `November`,\n        'december': `December`,\n        'other': `Unknown Month`,\n      })\n    },\n    'time.nanosecond': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Nanosecond`,\n        'other': `Nanoseconds`,\n      })\n    },\n    'time.november': `November`,\n    'time.october': `October`,\n    'time.second': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Second`,\n        'other': `Seconds`,\n      })\n    },\n    'time.september': `September`,\n    'time.today': `Today`,\n    'time.tomorrow': `Tomorrow`,\n    'time.year': ({ count }): string => {\n      return TranslationGen.resolveSelect(count, {\n        '=1': `Year`,\n        'other': `Years`,\n      })\n    },\n    'time.yesterday': `Yesterday`,\n    'tooFewSelectionItems': ({ min }): string => {\n      return `Select at least ${min} items.`\n    },\n    'tooLong': ({ max }): string => {\n      return `The value requires less than ${max} characters.`\n    },\n    'tooManySelectionItems': ({ max }): string => {\n      return `Select at most ${max} items.`\n    },\n    'tooShort': ({ min }): string => {\n      return `The value requires at least ${min} characters.`\n    },\n    'unsavedChanges': `Unsaved Changes`,\n    'unsavedChangesSaveQuestion': `Do you want to save your changes?`,\n    'update': `Update`,\n    'value': `Value`,\n    'welcome': `Welcome`,\n    'yes': `Yes`\n  }\n}\n\n","import type { HightideTranslationLocales } from '@/src/i18n/translations'\nimport { hightideTranslationLocales } from '@/src/i18n/translations'\n\n/**\n * The supported locales' names in their respective language\n */\nconst localsNames: Record<HightideTranslationLocales, string> = {\n  'en-US': 'English (US)',\n  'de-DE': 'Deutsch',\n}\n\n/**\n * The default locale\n */\nconst DEFAULT_LOCALE: HightideTranslationLocales = 'en-US'\n\nfunction localeToLanguage(locale: HightideTranslationLocales) {\n  return locale.split('-')[0]\n}\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LocalizationUtil = {\n  locals: hightideTranslationLocales,\n  localToLanguage: localeToLanguage,\n  DEFAULT_LOCALE,\n  languagesLocalNames: localsNames,\n}\n","import { useLocale } from '@/src/i18n/LocaleProvider'\nimport type {\n  PartialTranslationExtension,\n  Translation,\n  TranslationEntries\n} from '@helpwave/internationalization'\nimport { combineTranslation, ICUUtil } from '@helpwave/internationalization'\nimport { ArrayUtil } from '@/src/utils/array'\nimport type { SingleOrArray } from '@/src/utils/typing'\nimport type { HightideTranslationEntries, HightideTranslationLocales } from '@/src/i18n/translations'\nimport { hightideTranslation } from '@/src/i18n/translations'\n\n/**\n * Use for translations where you know that all values are ICU strings.\n *\n * This most likely is the case for Translations provided by a backend,\n * for more dynamic and typesafe translation use useTranslation instead\n */\nexport function useICUTranslation<L extends string, T extends Record<string, string>>(\n  translations: Translation<L, T>[] | Translation<L, T>,\n  locale: L\n) {\n  translations = Array.isArray(translations) ? translations : [translations]\n\n  return function translate(\n    key: string,\n    values?: Record<string, object>\n  ): string {\n    try {\n      for (let i = 0; i < translations.length; i++) {\n        const localizedTranslation = translations[i][locale]\n        if (!localizedTranslation) continue\n\n        const msg = localizedTranslation[key]\n        if (typeof msg === 'string') {\n          return ICUUtil.interpret(msg, values)\n        }\n      }\n      console.warn(`useTranslation: No translation for key \"${key}\" found.`)\n    } catch (e) {\n      console.error(`useTranslation: Error translating key \"${String(key)}\"`, e)\n    }\n\n    return `{{${String(locale)}:${String(key)}}}`\n  }\n}\n\ntype UseHidetideTranslationOverwrites = {\n  locale?: HightideTranslationLocales,\n}\n\ntype HidetideTranslationExtension<L extends string, T extends TranslationEntries>\n  = PartialTranslationExtension<L, HightideTranslationLocales, T, HightideTranslationEntries>\n/**\n * A wrapper for the useHightideTranslation to load and specify the translations for the library\n */\nexport function useHightideTranslation<L extends string, T extends TranslationEntries>(\n  extensions?: SingleOrArray<HidetideTranslationExtension<L,T>>,\n  overwrites?: UseHidetideTranslationOverwrites\n) {\n  const { locale: inferredLocale } = useLocale()\n  const locale = overwrites?.locale ?? inferredLocale\n  const translationExtensions = ArrayUtil.resolveSingleOrArray(extensions)\n\n  return combineTranslation<L | HightideTranslationLocales, T & HightideTranslationEntries>([\n    ...translationExtensions,\n    hightideTranslation as HidetideTranslationExtension<L,T>\n  ], locale)\n}\n","export const equalSizeGroups = <T>(array: T[], groupSize: number): T[][] => {\n  if (groupSize <= 0) {\n    console.warn(`group size should be greater than 0: groupSize = ${groupSize}`)\n    return [[...array]]\n  }\n\n  const groups = []\n  for (let i = 0; i < array.length; i += groupSize) {\n    groups.push(array.slice(i, Math.min(i + groupSize, array.length)))\n  }\n  return groups\n}\n\nexport type RangeOptions = {\n  /**  Whether the range can be defined empty via end < start without a warning */\n  allowEmptyRange: boolean,\n  stepSize: number,\n  exclusiveStart: boolean,\n  exclusiveEnd: boolean,\n}\n\nconst defaultRangeOptions: RangeOptions = {\n  allowEmptyRange: false,\n  stepSize: 1,\n  exclusiveStart: false,\n  exclusiveEnd: true,\n}\n\n/**\n * @param endOrRange The end value or a range [start, end], end is exclusive\n * @param options the options for defining the range\n */\nexport const range = (endOrRange: number | [number, number], options?: Partial<RangeOptions>): number[] => {\n  const { allowEmptyRange, stepSize, exclusiveStart, exclusiveEnd } = { ...defaultRangeOptions, ...options }\n  let start = 0\n  let end: number\n  if (typeof endOrRange === 'number') {\n    end = endOrRange\n  } else {\n    start = endOrRange[0]\n    end = endOrRange[1]\n  }\n  if (!exclusiveEnd) {\n    end -= 1\n  }\n  if (exclusiveStart) {\n    start += 1\n  }\n\n  if (end - 1 < start) {\n    if (!allowEmptyRange) {\n      console.warn(`range: end (${end}) < start (${start}) should be allowed explicitly, set options.allowEmptyRange to true`)\n    }\n    return []\n  }\n  return Array.from({ length: end - start }, (_, index) => index * stepSize + start)\n}\n\n/** Finds the closest match\n * @param list The list of all possible matches\n * @param firstCloser Return whether item1 is closer than item2\n */\nexport const closestMatch = <T>(list: T[], firstCloser: (item1: T, item2: T) => boolean) => {\n  return list.reduce((item1, item2) => {\n    return firstCloser(item1, item2) ? item1 : item2\n  })\n}\n\n/**\n * returns the item in middle of a list and its neighbours before and after\n * e.g. [1,2,3,4,5,6] for item = 1 would return [5,6,1,2,3]\n */\nexport const getNeighbours = <T>(list: T[], item: T, neighbourDistance: number = 2) => {\n  const index = list.indexOf(item)\n  const totalItems = neighbourDistance * 2 + 1\n  if (list.length < totalItems) {\n    console.warn('List is to short')\n    return list\n  }\n\n  if (index === -1) {\n    console.error('item not found in list')\n    return list.splice(0, totalItems)\n  }\n\n  let start = index - neighbourDistance\n  if (start < 0) {\n    start += list.length\n  }\n  const end = (index + neighbourDistance + 1) % list.length\n\n  const result: T[] = []\n  let ignoreOnce = list.length === totalItems\n  for (let i = start; i !== end || ignoreOnce; i = (i + 1) % list.length) {\n    result.push(list[i]!)\n    if (end === i && ignoreOnce) {\n      ignoreOnce = false\n    }\n  }\n  return result\n}\n\nexport const createLoopingListWithIndex = <T>(list: T[], startIndex: number = 0, length: number = 0, forwards: boolean = true) => {\n  if (length < 0) {\n    console.warn(`createLoopingList: length must be >= 0, given ${length}`)\n  } else if (length === 0) {\n    length = list.length\n  }\n\n  const returnList: [number, T][] = []\n\n  if (forwards) {\n    for (let i = startIndex; returnList.length < length; i = (i + 1) % list.length) {\n      returnList.push([i, list[i]!])\n    }\n  } else {\n    for (let i = startIndex; returnList.length < length; i = i === 0 ? i = list.length - 1 : i - 1) {\n      returnList.push([i, list[i]!])\n    }\n  }\n\n  return returnList\n}\n\nexport const createLoopingList = <T>(list: T[], startIndex: number = 0, length: number = 0, forwards: boolean = true) => {\n  return createLoopingListWithIndex(list, startIndex, length, forwards).map(([_, item]) => item)\n}\n\n/**\n * @param list The list to be changed\n * @param move The shifting applied to the array (can be negative)\n */\nconst moveItems = <T>(list: T[], move: number = 0) => {\n  const result = []\n  let start = move\n  if (start < 0) {\n    start = list.length - move\n  }\n  start = start % list.length\n  for (let i = 0; i < list.length; i++) {\n    result[i] = list[(i + start) % list.length]\n  }\n  return result\n}\n\nfunction resolveSingleOrArray<T>(value: T | T[]): T[] {\n  if (Array.isArray(value)) {\n    return value\n  } else if (value) {\n    return [value]\n  }\n  return []\n}\n\nexport const ArrayUtil = {\n  unique: <T>(list: T[]): T[] => {\n    const seen = new Set<T>()\n    return list.filter((item) => {\n      if (seen.has(item)) {\n        return false\n      }\n      seen.add(item)\n      return true\n    })\n  },\n  difference: <T>(list: T[], removeList: T[]): T[] => {\n    const remove = new Set<T>(removeList)\n    return list.filter((item) => !remove.has(item))\n  },\n  moveItems,\n  resolveSingleOrArray\n}\n","import type { ReactNode, TextareaHTMLAttributes } from 'react'\nimport { forwardRef, useId } from 'react'\nimport clsx from 'clsx'\nimport type { LabelProps } from '@/src/components/user-action/Label'\nimport { Label } from '@/src/components/user-action/Label'\nimport { useDelay, type UseDelayOptions } from '@/src/hooks/useDelay'\nimport { useOverwritableState } from '@/src/hooks/useOverwritableState'\n\nexport type TextareaProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'value'> & {\n  /** Inside the area */\n  value?: string,\n  invalid?: boolean,\n  onChangeText?: (text: string) => void,\n  onEditCompleted?: (text: string) => void,\n  saveDelayOptions?: UseDelayOptions,\n  defaultStyle?: boolean,\n}\n\n/**\n * A Textarea component for inputting longer texts\n *\n * The State is managed by the parent\n */\nexport const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(function Textarea({\n                                                                                           id,\n                                                                                           onChange,\n                                                                                           onChangeText,\n                                                                                           onBlur,\n                                                                                           onEditCompleted,\n                                                                                           saveDelayOptions,\n                                                                                           defaultStyle = true,\n                                                                                           invalid = false,\n                                                                                           disabled = false,\n                                                                                           className,\n                                                                                           ...props\n                                                                                         }, ref) {\n  const { restartTimer, clearTimer } = useDelay(saveDelayOptions)\n\n  const onEditCompletedWrapper = (text: string) => {\n    onEditCompleted?.(text)\n    clearTimer()\n  }\n\n  return (\n    <textarea\n      ref={ref}\n      id={id}\n      className={clsx(\n        'resize-none w-full h-32 overflow-y-scroll',\n        'py-2 px-3 rounded-md border-2 border-transparent focus-style-none',\n        {\n          'bg-input-background text-input-text hover:border-primary focus:border-primary': !disabled && !invalid,\n          'bg-negative/20 text-negative hover:border-negative focus-visible:border-negative': invalid && !disabled && defaultStyle,\n          'text-disabled bg-disabled-background border-disabled-border': disabled && defaultStyle,\n        },\n        className\n      )}\n      onChange={(event) => {\n        const value = event.target.value\n        restartTimer(() => {\n          onEditCompletedWrapper(value)\n        })\n        onChange?.(event)\n        onChangeText?.(value)\n      }}\n      onBlur={(event) => {\n        onBlur?.(event)\n        onEditCompletedWrapper(event.target.value)\n      }}\n      disabled={disabled}\n      {...props}\n    />\n  )\n})\n\n/**\n * A Textarea component that is not controlled by its parent\n */\nexport const TextareaUncontrolled = ({\n                                       value,\n                                       onChangeText,\n                                       ...props\n                                     }: TextareaProps) => {\n  const [text, setText] = useOverwritableState<string>(value, onChangeText)\n\n  return (\n    <Textarea\n      {...props}\n      value={text}\n      onChangeText={setText}\n    />\n  )\n}\n\nexport type TextareaWithHeadlineProps = Omit<TextareaProps, 'defaultStyle'> & {\n  headline: ReactNode,\n  headlineProps: Omit<LabelProps, 'children'>,\n  containerClassName?: string,\n}\n\nexport const TextareaWithHeadline = ({\n                                       id,\n                                       headline,\n                                       headlineProps,\n                                       disabled,\n                                       className,\n                                       containerClassName,\n                                       ...props\n                                     }: TextareaWithHeadlineProps) => {\n  const genId = useId()\n  const usedId = id ?? genId\n\n  return (\n    <div\n      className={clsx(\n        'group flex-col-3 border-2 rounded-lg',\n        {\n          'bg-input-background text-input-text hover:border-primary focus-within:border-primary': !disabled,\n          'border-disabled-border bg-disabled-background cursor-not-allowed': disabled,\n        },\n        containerClassName\n      )}\n    >\n      {headline && (\n        <Label size=\"md\" {...headlineProps} htmlFor={usedId}>\n          {headline}\n        </Label>\n      )}\n      <Textarea\n        {...props}\n        id={usedId}\n        className={clsx(\n          'border-transparent focus:ring-0 focus-visible:ring-0 resize-none h-32',\n          className\n        )}\n        defaultStyle={false}\n      />\n    </div>\n  )\n}","import clsx from 'clsx'\nimport type { LabelHTMLAttributes } from 'react'\n\nexport type LabelType = 'md' | 'lg'\n\nconst styleMapping: Record<LabelType, string> = {\n  md: 'typography-label-md color-label-text',\n  lg: 'typography-label-lg color-label-text',\n}\n\nexport type LabelProps = LabelHTMLAttributes<HTMLLabelElement> & {\n  /** The size of the label */\n  size?: LabelType,\n}\n\n/**\n * A Label component\n */\nexport const Label = ({\n                        children,\n                        size = 'md',\n                        className,\n                        ...props\n                      }: LabelProps) => {\n  return (\n    <label {...props} className={clsx(styleMapping[size], className)}>\n      {children}\n    </label>\n  )\n}\n","import { useEffect, useState } from 'react'\n\nexport type UseDelayOptionsResolved = {\n  delay: number,\n  disabled: boolean,\n}\n\nexport type UseDelayOptions = Partial<UseDelayOptionsResolved>\n\nconst defaultOptions: UseDelayOptionsResolved = {\n  delay: 3000,\n  disabled: false,\n}\n\nexport function useDelay(options?: UseDelayOptions) {\n  const [timer, setTimer] = useState<NodeJS.Timeout | undefined>(undefined)\n  const { delay, disabled }: UseDelayOptionsResolved = {\n    ...defaultOptions,\n    ...options\n  }\n\n  const clearTimer = () => {\n    clearTimeout(timer)\n    setTimer(undefined)\n  }\n\n  const restartTimer = (onDelayFinish: () => void) => {\n    if(disabled) {\n      return\n    }\n    clearTimeout(timer)\n    setTimer(setTimeout(() => {\n      onDelayFinish()\n      setTimer(undefined)\n    }, delay))\n  }\n\n  useEffect(() => {\n    return () => {\n      clearTimeout(timer)\n    }\n  }, [timer])\n\n  useEffect(() => {\n    if(disabled){\n      clearTimeout(timer)\n      setTimer(undefined)\n    }\n  }, [disabled, timer])\n\n  return { restartTimer, clearTimer, hasActiveTimer: !!timer }\n}","import type React from 'react'\nimport { useEffect, useState } from 'react'\nimport { resolveSetState } from '@/src/utils/resolveSetState'\n\nexport const useOverwritableState = <T>(initialValue?: T, onChange?: (value: T) => void): [T, React.Dispatch<React.SetStateAction<T>>] => {\n  const [state, setState] = useState<T>(initialValue)\n\n  useEffect(() => {\n    setState(initialValue)\n  }, [initialValue])\n\n  const onChangeWrapper: React.Dispatch<React.SetStateAction<T>> = (action) => {\n    const resolved = resolveSetState(action, state)\n    setState(resolved)\n    onChange?.(state)\n  }\n\n  return [state, onChangeWrapper]\n}","import type { ReactNode } from 'react'\nimport { AlertTriangle } from 'lucide-react'\nimport clsx from 'clsx'\nimport { TextButton } from '../user-action/Button'\nimport { useHightideTranslation } from '@/src/i18n/useHightideTranslation'\n\nexport type PropertyBaseProps = {\n  name: string,\n  input: (props: { softRequired: boolean, hasValue: boolean }) => ReactNode,\n  onRemove?: () => void,\n  hasValue: boolean,\n  softRequired?: boolean,\n  readOnly?: boolean,\n  icon?: ReactNode,\n  className?: string,\n}\n\n/**\n * A component for showing a properties with uniform styling\n */\nexport const PropertyBase = ({\n                               name,\n                               input,\n                               softRequired = false,\n                               hasValue,\n                               icon,\n                               readOnly,\n                               onRemove,\n                               className = '',\n                             }: PropertyBaseProps) => {\n  const translation = useHightideTranslation()\n  const requiredAndNoValue = softRequired && !hasValue\n  return (\n    <div className={clsx('flex-row-0 group', className)}>\n      <div\n        className={clsx(\n          'flex-row-2 max-w-48 min-w-48 px-3 py-2 items-center rounded-l-xl border-2 border-r-0', {\n            'bg-property-title-background text-property-title-text group-hover:border-primary': !requiredAndNoValue,\n            'bg-warning text-surface-warning group-hover:border-warning border-warning/90': requiredAndNoValue,\n          }, className\n        )}\n      >\n        <div className=\"max-w-6 min-w-6 text-text-primary\">{icon}</div>\n        <span className=\"font-semibold\">{name}</span>\n      </div>\n      <div\n        className={clsx(\n          'flex-row-2 grow px-3 py-2 justify-between items-center rounded-r-xl border-2 border-l-0 min-h-15', {\n            'bg-input-background text-input-text group-hover:border-primary': !requiredAndNoValue,\n            'bg-surface-warning group-hover:border-warning border-warning/90': requiredAndNoValue,\n          }, className\n        )}\n      >\n        {input({ softRequired, hasValue })}\n        {requiredAndNoValue && (\n          <div className=\"text-warning\"><AlertTriangle size={24}/></div>\n        )}\n        {onRemove && !readOnly && (\n          <TextButton\n            onClick={onRemove}\n            color=\"negative\"\n            className={clsx('items-center')}\n            disabled={!hasValue}\n          >\n            {translation('remove')}\n          </TextButton>\n        )}\n      </div>\n    </div>\n  )\n}\n","import type { ButtonHTMLAttributes, ReactNode } from 'react'\nimport { forwardRef } from 'react'\nimport clsx from 'clsx'\n\n\nexport const ButtonColorUtil = {\n  solid: ['primary', 'secondary', 'tertiary', 'positive', 'warning', 'negative', 'neutral'] as const,\n  text: ['primary', 'negative', 'neutral'] as const,\n  outline: ['primary'] as const,\n}\n\nexport const IconButtonUtil = {\n  icon: [...ButtonColorUtil.solid, 'transparent'] as const,\n}\n\n\n/**\n * The allowed colors for the SolidButton and IconButton\n */\nexport type SolidButtonColor = typeof ButtonColorUtil.solid[number]\n/**\n * The allowed colors for the OutlineButton\n */\nexport type OutlineButtonColor = typeof ButtonColorUtil.outline[number]\n/**\n * The allowed colors for the TextButton\n */\nexport type TextButtonColor = typeof ButtonColorUtil.text[number]\n/**\n * The allowed colors for the IconButton\n */\nexport type IconButtonColor = typeof IconButtonUtil.icon[number]\n\n\n/**\n * The different sizes for a button\n */\ntype ButtonSizes = 'small' | 'medium' | 'large' | 'none'\n\ntype IconButtonSize = 'tiny' | 'small' | 'medium' | 'large' | 'none'\n\n/**\n * The shard properties between all button types\n */\nexport type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n  /**\n   * @default 'medium'\n   */\n  size?: ButtonSizes,\n}\n\nconst paddingMapping: Record<ButtonSizes, string> = {\n  none: '',\n  small: 'btn-sm',\n  medium: 'btn-md',\n  large: 'btn-lg'\n}\n\nconst iconPaddingMapping: Record<IconButtonSize, string> = {\n  none: '',\n  tiny: 'icon-btn-xs',\n  small: 'icon-btn-sm',\n  medium: 'icon-btn-md',\n  large: 'icon-btn-lg'\n}\n\nexport const ButtonUtil = {\n  paddingMapping,\n  iconPaddingMapping\n}\n\ntype ButtonWithIconsProps = ButtonProps & {\n  startIcon?: ReactNode,\n  endIcon?: ReactNode,\n}\n\nexport type SolidButtonProps = ButtonWithIconsProps & {\n  color?: SolidButtonColor,\n}\n\nexport type OutlineButtonProps = ButtonWithIconsProps & {\n  color?: OutlineButtonColor,\n}\n\nexport type TextButtonProps = ButtonWithIconsProps & {\n  color?: TextButtonColor,\n  coloredHoverBackground?: boolean,\n}\n\n/**\n * The shard properties between all button types\n */\nexport type IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n  /**\n   * @default 'medium'\n   */\n  size?: IconButtonSize,\n  color?: IconButtonColor,\n}\n\n/**\n * A button with a solid background and different sizes\n */\nexport const SolidButton = forwardRef<HTMLButtonElement, SolidButtonProps>(function SolidButton({\n                                                                                           children,\n                                                                                           color = 'primary',\n                                                                                           size = 'medium',\n                                                                                           startIcon,\n                                                                                           endIcon,\n                                                                                           onClick,\n                                                                                           className,\n                                                                                           ...restProps\n                                                                                         }, ref) {\n  const colorClasses = {\n    primary: 'not-disabled:bg-button-solid-primary-background not-disabled:text-button-solid-primary-text',\n    secondary: 'not-disabled:bg-button-solid-secondary-background not-disabled:text-button-solid-secondary-text',\n    tertiary: 'not-disabled:bg-button-solid-tertiary-background not-disabled:text-button-solid-tertiary-text',\n    positive: 'not-disabled:bg-button-solid-positive-background not-disabled:text-button-solid-positive-text',\n    warning: 'not-disabled:bg-button-solid-warning-background not-disabled:text-button-solid-warning-text',\n    negative: 'not-disabled:bg-button-solid-negative-background not-disabled:text-button-solid-negative-text',\n    neutral: 'not-disabled:bg-button-solid-neutral-background not-disabled:text-button-solid-neutral-text',\n  }[color]\n\n  const iconColorClasses = {\n    primary: 'not-group-disabled:text-button-solid-primary-icon',\n    secondary: 'not-group-disabled:text-button-solid-secondary-icon',\n    tertiary: 'not-group-disabled:text-button-solid-tertiary-icon',\n    positive: 'not-group-disabled:text-button-solid-positive-icon',\n    warning: 'not-group-disabled:text-button-solid-warning-icon',\n    negative: 'not-group-disabled:text-button-solid-negative-icon',\n    neutral: 'not-group-disabled:text-button-solid-neutral-icon',\n  }[color]\n\n  return (\n    <button\n      ref={ref}\n      onClick={onClick}\n      className={clsx(\n        'group font-semibold',\n        colorClasses,\n        'not-disabled:hover:brightness-90',\n        'disabled:text-disabled disabled:bg-disabled-background',\n        ButtonUtil.paddingMapping[size],\n        className\n      )}\n      {...restProps}\n    >\n      {startIcon && (\n        <span\n          className={clsx(\n            iconColorClasses,\n            'group-disabled:text-disabled-icon'\n          )}\n        >\n          {startIcon}\n        </span>\n      )}\n      {children}\n      {endIcon && (\n        <span\n          className={clsx(\n            iconColorClasses,\n            'group-disabled:text-disabled-icon'\n          )}\n        >\n          {endIcon}\n        </span>\n      )}\n    </button>\n  )\n})\n\n/**\n * A button with an outline border and different sizes\n */\nexport const OutlineButton = ({\n                         children,\n                         color = 'primary',\n                         size = 'medium',\n                         startIcon,\n                         endIcon,\n                         onClick,\n                         className,\n                         ...restProps\n                       }: OutlineButtonProps) => {\n  const colorClasses = {\n    primary: 'not-disabled:border-button-outline-primary-text not-disabled:text-button-outline-primary-text',\n  }[color]\n\n  const iconColorClasses = {\n    primary: 'not-group-disabled:text-button-outline-primary-icon',\n  }[color]\n  return (\n    <button\n      onClick={onClick}\n      className={clsx(\n        'group font-semibold bg-transparent border-2 ',\n        'not-disabled:hover:brightness-80',\n        colorClasses,\n        'disabled:text-disabled disabled:border-disabled-outline',\n        ButtonUtil.paddingMapping[size],\n        className\n      )}\n      {...restProps}\n    >\n      {startIcon && (\n        <span\n          className={clsx(\n            iconColorClasses,\n            'group-disabled:text-disabled-icon'\n          )}\n        >\n          {startIcon}\n        </span>\n      )}\n      {children}\n      {endIcon && (\n        <span\n          className={clsx(\n            iconColorClasses,\n            'group-disabled:text-disabled-icon'\n          )}\n        >\n          {endIcon}\n        </span>\n      )}\n    </button>\n  )\n}\n\n/**\n * A text that is a button that can have different sizes\n */\nexport const TextButton = ({\n                      children,\n                      color = 'neutral',\n                      size = 'medium',\n                      startIcon,\n                      endIcon,\n                      onClick,\n                      coloredHoverBackground = true,\n                      className,\n                      ...restProps\n                    }: TextButtonProps) => {\n  const colorClasses = {\n    primary: 'not-disabled:bg-transparent not-disabled:text-button-text-primary-text not-disabled:focus-visible:outline-button-text-primary-text',\n    negative: 'not-disabled:bg-transparent not-disabled:text-button-text-negative-text not-disabled:focus-visible:outline-button-text-negative-text',\n    neutral: 'not-disabled:bg-transparent not-disabled:text-button-text-neutral-text not-disabled:focus-visible:outline-button-text-neutral-text',\n  }[color]\n\n  const backgroundColor = {\n    primary: 'not-disabled:hover:bg-button-text-primary-text/20 not-disabled:focus-visible:bg-button-text-primary-text/20',\n    negative: 'not-disabled:hover:bg-button-text-negative-text/20 not-disabled:focus-visible:bg-button-text-negative-text/20',\n    neutral: 'not-disabled:hover:bg-button-text-neutral-text/20 not-disabled:focus-visible:bg-button-text-neutral-text/20',\n  }[color]\n\n  const iconColorClasses = {\n    primary: 'not-group-disabled:text-button-text-primary-icon',\n    negative: 'not-group-disabled:text-button-text-negative-icon',\n    neutral: 'not-group-disabled:text-button-text-neutral-icon',\n  }[color]\n\n  return (\n    <button\n      onClick={onClick}\n      className={clsx(\n        'group font-semibold',\n        'disabled:text-disabled',\n        colorClasses,\n        {\n          [backgroundColor]: coloredHoverBackground,\n          'not-disabled:hover:bg-button-text-hover-background': !coloredHoverBackground,\n        },\n        ButtonUtil.paddingMapping[size],\n        className\n      )}\n      {...restProps}\n    >\n      {startIcon && (\n        <span\n          className={clsx(\n            iconColorClasses,\n            'group-disabled:text-disabled-icon'\n          )}\n        >\n          {startIcon}\n        </span>\n      )}\n      {children}\n      {endIcon && (\n        <span\n          className={clsx(\n            iconColorClasses,\n            'group-disabled:text-disabled-icon'\n          )}\n        >\n          {endIcon}\n        </span>\n      )}\n    </button>\n  )\n}\n\n\n/**\n * A button for icons with a solid background and different sizes\n */\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(function IconButton({\n                                                                                        children,\n                                                                                        color = 'primary',\n                                                                                        size = 'medium',\n                                                                                        className,\n                                                                                        ...restProps\n                                                                                      }, ref)\n{\n  const colorClasses = {\n    primary: 'not-disabled:bg-button-solid-primary-background not-disabled:text-button-solid-primary-text',\n    secondary: 'not-disabled:bg-button-solid-secondary-background not-disabled:text-button-solid-secondary-text',\n    tertiary: 'not-disabled:bg-button-solid-tertiary-background not-disabled:text-button-solid-tertiary-text',\n    positive: 'not-disabled:bg-button-solid-positive-background not-disabled:text-button-solid-positive-text',\n    warning: 'not-disabled:bg-button-solid-warning-background not-disabled:text-button-solid-warning-text',\n    negative: 'not-disabled:bg-button-solid-negative-background not-disabled:text-button-solid-negative-text',\n    neutral: 'not-disabled:bg-button-solid-neutral-background not-disabled:text-button-solid-neutral-text',\n    transparent: 'not-disabled:bg-transparent',\n  }[color]\n\n  return (\n    <button\n      ref={ref}\n      className={clsx(\n        colorClasses,\n        'not-disabled:hover:brightness-90',\n        'disabled:text-disabled',\n        {\n          'disabled:bg-disabled-background': color !== 'transparent',\n          'disabled:opacity-70': color === 'transparent',\n          'not-disabled:hover:bg-button-text-hover-background': color === 'transparent',\n        },\n        ButtonUtil.iconPaddingMapping[size],\n        className\n      )}\n      {...restProps}\n    >\n      {children}\n    </button>\n  )\n})"],"mappings":"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","names":["clsx","useState","clsx","jsx","useEffect","useState","useEffect","useState","jsx","Textarea","clsx","clsx","forwardRef","clsx","jsx","jsxs","SolidButton","jsxs","clsx","jsx","forwardRef","IconButton","jsx","jsxs","clsx","jsx","clsx","value"]}

package/dist/components/properties/index.cjs

@@ -1074,10 +1074,16 @@ var IconButton = (0, import_react2.forwardRef)(function IconButton2({
   );
 });
 
+// src/i18n/LocaleProvider.tsx
+var import_react4 = require("react");
+
+// src/hooks/useLocalStorage.ts
+var import_react3 = require("react");
+
 // src/i18n/translations.ts
 var import_internationalization = require("@helpwave/internationalization");
-var supportedLocales = ["de-DE", "en-US"];
-var generatedTranslations = {
+var hightideTranslationLocales = ["de-DE", "en-US"];
+var hightideTranslation = {
   "de-DE": {
     "add": `Hinzuf\xFCgen`,
     "age": `Alter`,
@@ -1552,12 +1558,6 @@ var generatedTranslations = {
   }
 };
 
-// src/i18n/LocaleProvider.tsx
-var import_react4 = require("react");
-
-// src/hooks/useLocalStorage.ts
-var import_react3 = require("react");
-
 // src/i18n/util.ts
 var localsNames = {
   "en-US": "English (US)",
@@ -1568,7 +1568,7 @@ function localeToLanguage(locale) {
   return locale.split("-")[0];
 }
 var LocalizationUtil = {
-  locals: supportedLocales,
+  locals: hightideTranslationLocales,
   localToLanguage: localeToLanguage,
   DEFAULT_LOCALE,
   languagesLocalNames: localsNames
@@ -1588,7 +1588,7 @@ var useLocale = () => {
   return context;
 };
 
-// src/i18n/useTranslation.ts
+// src/i18n/useHightideTranslation.ts
 var import_internationalization2 = require("@helpwave/internationalization");
 
 // src/utils/array.ts
@@ -1631,14 +1631,14 @@ var ArrayUtil = {
   resolveSingleOrArray
 };
 
-// src/i18n/useTranslation.ts
-function useTranslation(extensions, overwrites) {
+// src/i18n/useHightideTranslation.ts
+function useHightideTranslation(extensions, overwrites) {
   const { locale: inferredLocale } = useLocale();
   const locale = overwrites?.locale ?? inferredLocale;
   const translationExtensions = ArrayUtil.resolveSingleOrArray(extensions);
   return (0, import_internationalization2.combineTranslation)([
     ...translationExtensions,
-    generatedTranslations
+    hightideTranslation
   ], locale);
 }
 
@@ -1654,7 +1654,7 @@ var PropertyBase = ({
   onRemove,
   className = ""
 }) => {
-  const translation = useTranslation();
+  const translation = useHightideTranslation();
   const requiredAndNoValue = softRequired && !hasValue;
   return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: (0, import_clsx3.default)("flex-row-0 group", className), children: [
     /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
@@ -1731,7 +1731,7 @@ var CheckboxProperty = ({
   readOnly,
   ...baseProps
 }) => {
-  const translation = useTranslation();
+  const translation = useHightideTranslation();
   const id = (0, import_react5.useId)();
   return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
     PropertyBase,
@@ -2782,7 +2782,7 @@ var SelectOption = (0, import_react13.forwardRef)(
   }
 );
 var SelectButton = (0, import_react13.forwardRef)(function SelectButton2({ placeholder, selectedDisplay, ...props }, ref) {
-  const translation = useTranslation();
+  const translation = useHightideTranslation();
   const { state, trigger } = useSelectContext();
   const { register, unregister, toggleOpen } = trigger;
   const innerRef = (0, import_react13.useRef)(null);
@@ -3174,7 +3174,7 @@ var NumberProperty = ({
   suffix,
   ...baseProps
 }) => {
-  const translation = useTranslation();
+  const translation = useHightideTranslation();
   const hasValue = value !== void 0;
   return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
     PropertyBase,
@@ -3331,7 +3331,7 @@ var TextProperty = ({
   onEditComplete,
   ...baseProps
 }) => {
-  const translation = useTranslation();
+  const translation = useHightideTranslation();
   const hasValue = value !== void 0;
   return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     PropertyBase,