@helpwave/hightide 0.1.8 → 0.1.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/date/DatePicker.d.mts +3 -4
- package/dist/components/date/DatePicker.d.ts +3 -4
- package/dist/components/date/DatePicker.js +125 -13
- package/dist/components/date/DatePicker.js.map +1 -1
- package/dist/components/date/DatePicker.mjs +125 -13
- package/dist/components/date/DatePicker.mjs.map +1 -1
- package/dist/components/date/TimeDisplay.d.mts +5 -19
- package/dist/components/date/TimeDisplay.d.ts +5 -19
- package/dist/components/date/TimeDisplay.js +129 -37
- package/dist/components/date/TimeDisplay.js.map +1 -1
- package/dist/components/date/TimeDisplay.mjs +129 -37
- package/dist/components/date/TimeDisplay.mjs.map +1 -1
- package/dist/components/dialogs/ConfirmDialog.d.mts +2 -5
- package/dist/components/dialogs/ConfirmDialog.d.ts +2 -5
- package/dist/components/dialogs/ConfirmDialog.js +163 -23
- package/dist/components/dialogs/ConfirmDialog.js.map +1 -1
- package/dist/components/dialogs/ConfirmDialog.mjs +163 -23
- package/dist/components/dialogs/ConfirmDialog.mjs.map +1 -1
- package/dist/components/layout-and-navigation/Overlay.d.mts +2 -3
- package/dist/components/layout-and-navigation/Overlay.d.ts +2 -3
- package/dist/components/layout-and-navigation/Overlay.js +158 -10
- package/dist/components/layout-and-navigation/Overlay.js.map +1 -1
- package/dist/components/layout-and-navigation/Overlay.mjs +158 -10
- package/dist/components/layout-and-navigation/Overlay.mjs.map +1 -1
- package/dist/components/layout-and-navigation/Pagination.d.mts +2 -3
- package/dist/components/layout-and-navigation/Pagination.d.ts +2 -3
- package/dist/components/layout-and-navigation/Pagination.js +153 -13
- package/dist/components/layout-and-navigation/Pagination.js.map +1 -1
- package/dist/components/layout-and-navigation/Pagination.mjs +153 -13
- package/dist/components/layout-and-navigation/Pagination.mjs.map +1 -1
- package/dist/components/layout-and-navigation/SearchableList.d.mts +3 -2
- package/dist/components/layout-and-navigation/SearchableList.d.ts +3 -2
- package/dist/components/layout-and-navigation/SearchableList.js +157 -11
- package/dist/components/layout-and-navigation/SearchableList.js.map +1 -1
- package/dist/components/layout-and-navigation/SearchableList.mjs +157 -11
- package/dist/components/layout-and-navigation/SearchableList.mjs.map +1 -1
- package/dist/components/layout-and-navigation/StepperBar.d.mts +2 -5
- package/dist/components/layout-and-navigation/StepperBar.d.ts +2 -5
- package/dist/components/layout-and-navigation/StepperBar.js +153 -15
- package/dist/components/layout-and-navigation/StepperBar.js.map +1 -1
- package/dist/components/layout-and-navigation/StepperBar.mjs +153 -15
- package/dist/components/layout-and-navigation/StepperBar.mjs.map +1 -1
- package/dist/components/layout-and-navigation/Table.js +153 -13
- package/dist/components/layout-and-navigation/Table.js.map +1 -1
- package/dist/components/layout-and-navigation/Table.mjs +153 -13
- package/dist/components/layout-and-navigation/Table.mjs.map +1 -1
- package/dist/components/layout-and-navigation/TextImage.d.mts +3 -4
- package/dist/components/layout-and-navigation/TextImage.d.ts +3 -4
- package/dist/components/layout-and-navigation/TextImage.js +161 -19
- package/dist/components/layout-and-navigation/TextImage.js.map +1 -1
- package/dist/components/layout-and-navigation/TextImage.mjs +161 -19
- package/dist/components/layout-and-navigation/TextImage.mjs.map +1 -1
- package/dist/components/loading-states/ErrorComponent.js +56 -8
- package/dist/components/loading-states/ErrorComponent.js.map +1 -1
- package/dist/components/loading-states/ErrorComponent.mjs +56 -8
- package/dist/components/loading-states/ErrorComponent.mjs.map +1 -1
- package/dist/components/loading-states/LoadingAndErrorComponent.d.mts +1 -0
- package/dist/components/loading-states/LoadingAndErrorComponent.d.ts +1 -0
- package/dist/components/loading-states/LoadingAndErrorComponent.js +155 -15
- package/dist/components/loading-states/LoadingAndErrorComponent.js.map +1 -1
- package/dist/components/loading-states/LoadingAndErrorComponent.mjs +155 -15
- package/dist/components/loading-states/LoadingAndErrorComponent.mjs.map +1 -1
- package/dist/components/loading-states/LoadingAnimation.d.mts +2 -3
- package/dist/components/loading-states/LoadingAnimation.d.ts +2 -3
- package/dist/components/loading-states/LoadingAnimation.js +153 -13
- package/dist/components/loading-states/LoadingAnimation.js.map +1 -1
- package/dist/components/loading-states/LoadingAnimation.mjs +153 -13
- package/dist/components/loading-states/LoadingAnimation.mjs.map +1 -1
- package/dist/components/modals/ConfirmModal.d.mts +2 -5
- package/dist/components/modals/ConfirmModal.d.ts +2 -5
- package/dist/components/modals/ConfirmModal.js +164 -26
- package/dist/components/modals/ConfirmModal.js.map +1 -1
- package/dist/components/modals/ConfirmModal.mjs +164 -26
- package/dist/components/modals/ConfirmModal.mjs.map +1 -1
- package/dist/components/modals/DiscardChangesModal.d.mts +2 -7
- package/dist/components/modals/DiscardChangesModal.d.ts +2 -7
- package/dist/components/modals/DiscardChangesModal.js +168 -46
- package/dist/components/modals/DiscardChangesModal.js.map +1 -1
- package/dist/components/modals/DiscardChangesModal.mjs +168 -46
- package/dist/components/modals/DiscardChangesModal.mjs.map +1 -1
- package/dist/components/modals/InputModal.d.mts +1 -0
- package/dist/components/modals/InputModal.d.ts +1 -0
- package/dist/components/modals/InputModal.js +164 -26
- package/dist/components/modals/InputModal.js.map +1 -1
- package/dist/components/modals/InputModal.mjs +164 -26
- package/dist/components/modals/InputModal.mjs.map +1 -1
- package/dist/components/modals/LanguageModal.d.mts +3 -2
- package/dist/components/modals/LanguageModal.d.ts +3 -2
- package/dist/components/modals/LanguageModal.js +170 -24
- package/dist/components/modals/LanguageModal.js.map +1 -1
- package/dist/components/modals/LanguageModal.mjs +170 -24
- package/dist/components/modals/LanguageModal.mjs.map +1 -1
- package/dist/components/modals/ThemeModal.d.mts +5 -5
- package/dist/components/modals/ThemeModal.d.ts +5 -5
- package/dist/components/modals/ThemeModal.js +178 -30
- package/dist/components/modals/ThemeModal.js.map +1 -1
- package/dist/components/modals/ThemeModal.mjs +178 -30
- package/dist/components/modals/ThemeModal.mjs.map +1 -1
- package/dist/components/properties/CheckboxProperty.d.mts +3 -5
- package/dist/components/properties/CheckboxProperty.d.ts +3 -5
- package/dist/components/properties/CheckboxProperty.js +155 -25
- package/dist/components/properties/CheckboxProperty.js.map +1 -1
- package/dist/components/properties/CheckboxProperty.mjs +155 -25
- package/dist/components/properties/CheckboxProperty.mjs.map +1 -1
- package/dist/components/properties/DateProperty.d.mts +1 -0
- package/dist/components/properties/DateProperty.d.ts +1 -0
- package/dist/components/properties/DateProperty.js +153 -13
- package/dist/components/properties/DateProperty.js.map +1 -1
- package/dist/components/properties/DateProperty.mjs +153 -13
- package/dist/components/properties/DateProperty.mjs.map +1 -1
- package/dist/components/properties/MultiSelectProperty.d.mts +4 -5
- package/dist/components/properties/MultiSelectProperty.d.ts +4 -5
- package/dist/components/properties/MultiSelectProperty.js +169 -43
- package/dist/components/properties/MultiSelectProperty.js.map +1 -1
- package/dist/components/properties/MultiSelectProperty.mjs +169 -43
- package/dist/components/properties/MultiSelectProperty.mjs.map +1 -1
- package/dist/components/properties/NumberProperty.d.mts +1 -0
- package/dist/components/properties/NumberProperty.d.ts +1 -0
- package/dist/components/properties/NumberProperty.js +155 -15
- package/dist/components/properties/NumberProperty.js.map +1 -1
- package/dist/components/properties/NumberProperty.mjs +155 -15
- package/dist/components/properties/NumberProperty.mjs.map +1 -1
- package/dist/components/properties/PropertyBase.d.mts +2 -3
- package/dist/components/properties/PropertyBase.d.ts +2 -3
- package/dist/components/properties/PropertyBase.js +153 -13
- package/dist/components/properties/PropertyBase.js.map +1 -1
- package/dist/components/properties/PropertyBase.mjs +153 -13
- package/dist/components/properties/PropertyBase.mjs.map +1 -1
- package/dist/components/properties/SelectProperty.d.mts +2 -3
- package/dist/components/properties/SelectProperty.d.ts +2 -3
- package/dist/components/properties/SelectProperty.js +159 -29
- package/dist/components/properties/SelectProperty.js.map +1 -1
- package/dist/components/properties/SelectProperty.mjs +159 -29
- package/dist/components/properties/SelectProperty.mjs.map +1 -1
- package/dist/components/properties/TextProperty.d.mts +2 -1
- package/dist/components/properties/TextProperty.d.ts +2 -1
- package/dist/components/properties/TextProperty.js +157 -17
- package/dist/components/properties/TextProperty.js.map +1 -1
- package/dist/components/properties/TextProperty.mjs +157 -17
- package/dist/components/properties/TextProperty.mjs.map +1 -1
- package/dist/components/user-action/DateAndTimePicker.d.mts +4 -20
- package/dist/components/user-action/DateAndTimePicker.d.ts +4 -20
- package/dist/components/user-action/DateAndTimePicker.js +223 -51
- package/dist/components/user-action/DateAndTimePicker.js.map +1 -1
- package/dist/components/user-action/DateAndTimePicker.mjs +223 -51
- package/dist/components/user-action/DateAndTimePicker.mjs.map +1 -1
- package/dist/components/user-action/Menu.js +1 -1
- package/dist/components/user-action/Menu.js.map +1 -1
- package/dist/components/user-action/Menu.mjs +1 -1
- package/dist/components/user-action/Menu.mjs.map +1 -1
- package/dist/components/user-action/MultiSelect.d.mts +5 -9
- package/dist/components/user-action/MultiSelect.d.ts +5 -9
- package/dist/components/user-action/MultiSelect.js +165 -23
- package/dist/components/user-action/MultiSelect.js.map +1 -1
- package/dist/components/user-action/MultiSelect.mjs +165 -23
- package/dist/components/user-action/MultiSelect.mjs.map +1 -1
- package/dist/components/user-action/Select.js +158 -12
- package/dist/components/user-action/Select.js.map +1 -1
- package/dist/components/user-action/Select.mjs +158 -12
- package/dist/components/user-action/Select.mjs.map +1 -1
- package/dist/css/globals.css +13 -4
- package/dist/css/uncompiled/globals.css +4 -4
- package/dist/index.d.mts +4 -2
- package/dist/index.d.ts +4 -2
- package/dist/index.js +345 -303
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +341 -303
- package/dist/index.mjs.map +1 -1
- package/dist/localization/defaults/form.d.mts +54 -0
- package/dist/localization/defaults/form.d.ts +54 -0
- package/dist/localization/defaults/form.js +127 -0
- package/dist/localization/defaults/form.js.map +1 -0
- package/dist/localization/defaults/form.mjs +103 -0
- package/dist/localization/defaults/form.mjs.map +1 -0
- package/dist/localization/defaults/time.d.mts +39 -0
- package/dist/localization/defaults/time.d.ts +39 -0
- package/dist/localization/defaults/time.js +101 -0
- package/dist/localization/defaults/time.js.map +1 -0
- package/dist/localization/defaults/time.mjs +76 -0
- package/dist/localization/defaults/time.mjs.map +1 -0
- package/dist/localization/useTranslation.d.mts +38 -6
- package/dist/localization/useTranslation.d.ts +38 -6
- package/dist/localization/useTranslation.js +56 -6
- package/dist/localization/useTranslation.js.map +1 -1
- package/dist/localization/useTranslation.mjs +55 -6
- package/dist/localization/useTranslation.mjs.map +1 -1
- package/dist/theming/useTheme.d.mts +4 -2
- package/dist/theming/useTheme.d.ts +4 -2
- package/dist/theming/useTheme.js +10 -2
- package/dist/theming/useTheme.js.map +1 -1
- package/dist/theming/useTheme.mjs +10 -2
- package/dist/theming/useTheme.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -51,28 +51,70 @@ var LanguageContext = (0, import_react2.createContext)({
|
|
|
51
51
|
var useLanguage = () => (0, import_react2.useContext)(LanguageContext);
|
|
52
52
|
|
|
53
53
|
// src/localization/useTranslation.ts
|
|
54
|
-
var
|
|
55
|
-
|
|
54
|
+
var TranslationPluralCount = {
|
|
55
|
+
zero: 0,
|
|
56
|
+
one: 1,
|
|
57
|
+
two: 2,
|
|
58
|
+
few: 3,
|
|
59
|
+
many: 11,
|
|
60
|
+
other: -1
|
|
61
|
+
};
|
|
62
|
+
var useTranslation = (translations, overwriteTranslation = {}) => {
|
|
63
|
+
const { language: languageProp, translation: overwrite } = overwriteTranslation;
|
|
56
64
|
const { language: inferredLanguage } = useLanguage();
|
|
57
65
|
const usedLanguage = languageProp ?? inferredLanguage;
|
|
58
|
-
|
|
59
|
-
if (overwrite
|
|
60
|
-
|
|
66
|
+
const usedTranslations = [...translations];
|
|
67
|
+
if (overwrite) {
|
|
68
|
+
usedTranslations.push(overwrite);
|
|
61
69
|
}
|
|
62
|
-
return
|
|
70
|
+
return (key, options) => {
|
|
71
|
+
const { count, replacements } = { ...{ count: 0, replacements: {} }, ...options };
|
|
72
|
+
try {
|
|
73
|
+
for (let i = translations.length - 1; i >= 0; i--) {
|
|
74
|
+
const translation = translations[i];
|
|
75
|
+
const localizedTranslation = translation[usedLanguage];
|
|
76
|
+
if (!localizedTranslation) {
|
|
77
|
+
continue;
|
|
78
|
+
}
|
|
79
|
+
const value = localizedTranslation[key];
|
|
80
|
+
if (!value) {
|
|
81
|
+
continue;
|
|
82
|
+
}
|
|
83
|
+
let forProcessing;
|
|
84
|
+
if (typeof value !== "string") {
|
|
85
|
+
if (count === TranslationPluralCount.zero && value?.zero) {
|
|
86
|
+
forProcessing = value.zero;
|
|
87
|
+
} else if (count === TranslationPluralCount.one && value?.one) {
|
|
88
|
+
forProcessing = value.one;
|
|
89
|
+
} else if (count === TranslationPluralCount.two && value?.two) {
|
|
90
|
+
forProcessing = value.two;
|
|
91
|
+
} else if (TranslationPluralCount.few <= count && count < TranslationPluralCount.many && value?.few) {
|
|
92
|
+
forProcessing = value.few;
|
|
93
|
+
} else if (count > TranslationPluralCount.many && value?.many) {
|
|
94
|
+
forProcessing = value.many;
|
|
95
|
+
} else {
|
|
96
|
+
forProcessing = value.other;
|
|
97
|
+
}
|
|
98
|
+
} else {
|
|
99
|
+
forProcessing = value;
|
|
100
|
+
}
|
|
101
|
+
forProcessing = forProcessing.replace(/\{\{(\w+)}}/g, (_, placeholder) => {
|
|
102
|
+
return replacements[placeholder] ?? `{{key:${placeholder}}}`;
|
|
103
|
+
});
|
|
104
|
+
return forProcessing;
|
|
105
|
+
}
|
|
106
|
+
} catch (e) {
|
|
107
|
+
console.error(e);
|
|
108
|
+
}
|
|
109
|
+
return `{{${usedLanguage}:${key}}}`;
|
|
110
|
+
};
|
|
63
111
|
};
|
|
64
112
|
|
|
65
|
-
// src/
|
|
66
|
-
var
|
|
67
|
-
var defaultTimeDisplayTranslations = {
|
|
113
|
+
// src/localization/defaults/time.ts
|
|
114
|
+
var monthTranslation = {
|
|
68
115
|
en: {
|
|
69
|
-
today: "today",
|
|
70
|
-
yesterday: "yesterday",
|
|
71
|
-
tomorrow: "tomorrow",
|
|
72
|
-
inDays: (days) => `in ${days} days`,
|
|
73
|
-
agoDays: (days) => `${days} days ago`,
|
|
74
116
|
january: "January",
|
|
75
|
-
february: "
|
|
117
|
+
february: "Febuary",
|
|
76
118
|
march: "March",
|
|
77
119
|
april: "April",
|
|
78
120
|
may: "May",
|
|
@@ -85,13 +127,8 @@ var defaultTimeDisplayTranslations = {
|
|
|
85
127
|
december: "December"
|
|
86
128
|
},
|
|
87
129
|
de: {
|
|
88
|
-
today: "heute",
|
|
89
|
-
yesterday: "gestern",
|
|
90
|
-
tomorrow: "morgen",
|
|
91
|
-
inDays: (days) => `in ${days} Tagen`,
|
|
92
|
-
agoDays: (days) => `vor ${days} Tagen`,
|
|
93
130
|
january: "Januar",
|
|
94
|
-
february: "
|
|
131
|
+
february: "Febuar",
|
|
95
132
|
march: "M\xE4rz",
|
|
96
133
|
april: "April",
|
|
97
134
|
may: "Mai",
|
|
@@ -104,36 +141,91 @@ var defaultTimeDisplayTranslations = {
|
|
|
104
141
|
december: "December"
|
|
105
142
|
}
|
|
106
143
|
};
|
|
144
|
+
var timeTranslation = {
|
|
145
|
+
en: {
|
|
146
|
+
...monthTranslation.en,
|
|
147
|
+
century: { one: "Century", other: "Centuries" },
|
|
148
|
+
decade: { one: "Decade", other: "Decades" },
|
|
149
|
+
year: { one: "Year", other: "Years" },
|
|
150
|
+
month: { one: "Month", other: "Months" },
|
|
151
|
+
day: { one: "Day", other: "Days" },
|
|
152
|
+
hour: { one: "Hour", other: "Hours" },
|
|
153
|
+
minute: { one: "Minute", other: "Minutes" },
|
|
154
|
+
second: { one: "Second", other: "Seconds" },
|
|
155
|
+
millisecond: { one: "Millisecond", other: "Milliseconds" },
|
|
156
|
+
microsecond: { one: "Microsecond", other: "Microseconds" },
|
|
157
|
+
nanosecond: { one: "Nanosecond", other: "Nanoseconds" },
|
|
158
|
+
yesterday: "Yesterday",
|
|
159
|
+
today: "Today",
|
|
160
|
+
tomorrow: "Tomorrow",
|
|
161
|
+
in: "in",
|
|
162
|
+
ago: "ago"
|
|
163
|
+
},
|
|
164
|
+
de: {
|
|
165
|
+
...monthTranslation.de,
|
|
166
|
+
century: { one: "Jahrhundert", other: "Jahrhunderte" },
|
|
167
|
+
decade: { one: "Jahrzehnt", other: "Jahrzehnte" },
|
|
168
|
+
year: { one: "Jahr", other: "Jahre" },
|
|
169
|
+
month: { one: "Monat", other: "Monate" },
|
|
170
|
+
day: { one: "Tag", other: "Tage" },
|
|
171
|
+
hour: { one: "Stunde", other: "Stunden" },
|
|
172
|
+
minute: { one: "Minute", other: "Minuten" },
|
|
173
|
+
second: { one: "Sekunde", other: "Sekunden" },
|
|
174
|
+
millisecond: { one: "Millisekunde", other: "Millisekunden" },
|
|
175
|
+
microsecond: { one: "Mikrosekunde", other: "Mikrosekunden" },
|
|
176
|
+
nanosecond: { one: "Nanosekunde", other: "Nanosekunden" },
|
|
177
|
+
yesterday: "Gestern",
|
|
178
|
+
today: "Heute",
|
|
179
|
+
tomorrow: "Morgen",
|
|
180
|
+
in: "in",
|
|
181
|
+
ago: "vor"
|
|
182
|
+
}
|
|
183
|
+
};
|
|
184
|
+
|
|
185
|
+
// src/components/date/TimeDisplay.tsx
|
|
186
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
187
|
+
var defaultTimeDisplayTranslations = {
|
|
188
|
+
en: {
|
|
189
|
+
...timeTranslation.en,
|
|
190
|
+
inDays: `in {{days}} days`,
|
|
191
|
+
agoDays: `{{days}} days ago`
|
|
192
|
+
},
|
|
193
|
+
de: {
|
|
194
|
+
...timeTranslation.de,
|
|
195
|
+
inDays: `in {{days}} Tagen`,
|
|
196
|
+
agoDays: `vor {{days}} Tagen`
|
|
197
|
+
}
|
|
198
|
+
};
|
|
107
199
|
var TimeDisplay = ({
|
|
108
200
|
overwriteTranslation,
|
|
109
201
|
date,
|
|
110
202
|
mode = "daysFromToday"
|
|
111
203
|
}) => {
|
|
112
|
-
const translation = useTranslation(defaultTimeDisplayTranslations, overwriteTranslation);
|
|
204
|
+
const translation = useTranslation([defaultTimeDisplayTranslations], overwriteTranslation);
|
|
113
205
|
const difference = (/* @__PURE__ */ new Date()).setHours(0, 0, 0, 0).valueOf() - new Date(date).setHours(0, 0, 0, 0).valueOf();
|
|
114
206
|
const isBefore = difference > 0;
|
|
115
207
|
const differenceInDays = Math.floor(Math.abs(difference) / (1e3 * 3600 * 24));
|
|
116
208
|
let displayString;
|
|
117
209
|
if (differenceInDays === 0) {
|
|
118
|
-
displayString = translation
|
|
210
|
+
displayString = translation("today");
|
|
119
211
|
} else if (differenceInDays === 1) {
|
|
120
|
-
displayString = isBefore ? translation
|
|
212
|
+
displayString = isBefore ? translation("yesterday") : translation("tomorrow");
|
|
121
213
|
} else {
|
|
122
|
-
displayString = isBefore ? translation.
|
|
214
|
+
displayString = isBefore ? translation("agoDays", { replacements: { days: differenceInDays.toString() } }) : translation("inDays", { replacements: { days: differenceInDays.toString() } });
|
|
123
215
|
}
|
|
124
216
|
const monthToTranslation = {
|
|
125
|
-
0: translation
|
|
126
|
-
1: translation
|
|
127
|
-
2: translation
|
|
128
|
-
3: translation
|
|
129
|
-
4: translation
|
|
130
|
-
5: translation
|
|
131
|
-
6: translation
|
|
132
|
-
7: translation
|
|
133
|
-
8: translation
|
|
134
|
-
9: translation
|
|
135
|
-
10: translation
|
|
136
|
-
11: translation
|
|
217
|
+
0: translation("january"),
|
|
218
|
+
1: translation("february"),
|
|
219
|
+
2: translation("march"),
|
|
220
|
+
3: translation("april"),
|
|
221
|
+
4: translation("may"),
|
|
222
|
+
5: translation("june"),
|
|
223
|
+
6: translation("july"),
|
|
224
|
+
7: translation("august"),
|
|
225
|
+
8: translation("september"),
|
|
226
|
+
9: translation("october"),
|
|
227
|
+
10: translation("november"),
|
|
228
|
+
11: translation("december")
|
|
137
229
|
};
|
|
138
230
|
let fullString;
|
|
139
231
|
if (mode === "daysFromToday") {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/date/TimeDisplay.tsx","../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts"],"sourcesContent":["import type { Language } from '../../localization/util'\nimport type { PropsForTranslation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\n\ntype TimeDisplayTranslation = {\n today: string,\n yesterday: string,\n tomorrow: string,\n inDays: (days: number) => string,\n agoDays: (days: number) => string,\n january: string,\n february: string,\n march: string,\n april: string,\n may: string,\n june: string,\n july: string,\n august: string,\n september: string,\n october: string,\n november: string,\n december: string,\n}\n\nconst defaultTimeDisplayTranslations: Record<Language, TimeDisplayTranslation> = {\n en: {\n today: 'today',\n yesterday: 'yesterday',\n tomorrow: 'tomorrow',\n inDays: (days: number) => `in ${days} days`,\n agoDays: (days: number) => `${days} days ago`,\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 },\n de: {\n today: 'heute',\n yesterday: 'gestern',\n tomorrow: 'morgen',\n inDays: (days: number) => `in ${days} Tagen`,\n agoDays: (days: number) => `vor ${days} Tagen`,\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: 'October',\n november: 'November',\n december: 'December'\n }\n}\n\ntype TimeDisplayMode = 'daysFromToday' | 'date'\n\ntype TimeDisplayProps = {\n date: Date,\n mode?: TimeDisplayMode,\n}\n\n/**\n * A Component for displaying time and dates in a unified fashion\n */\nexport const TimeDisplay = ({\n overwriteTranslation,\n date,\n mode = 'daysFromToday'\n }: PropsForTranslation<TimeDisplayTranslation, TimeDisplayProps>) => {\n const translation = useTranslation(defaultTimeDisplayTranslations, overwriteTranslation)\n const difference = new Date().setHours(0, 0, 0, 0).valueOf() - new Date(date).setHours(0, 0, 0, 0).valueOf()\n const isBefore = difference > 0\n const differenceInDays = Math.floor(Math.abs(difference) / (1000 * 3600 * 24))\n\n let displayString\n if (differenceInDays === 0) {\n displayString = translation.today\n } else if (differenceInDays === 1) {\n displayString = isBefore ? translation.yesterday : translation.tomorrow\n } else {\n displayString = isBefore ? translation.agoDays(differenceInDays) : translation.inDays(differenceInDays)\n }\n const monthToTranslation: { [key: number]: string } = {\n 0: translation.january,\n 1: translation.february,\n 2: translation.march,\n 3: translation.april,\n 4: translation.may,\n 5: translation.june,\n 6: translation.july,\n 7: translation.august,\n 8: translation.september,\n 9: translation.october,\n 10: translation.november,\n 11: translation.december\n } as const\n\n let fullString\n if (mode === 'daysFromToday') {\n fullString = `${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')} - ${displayString}`\n } else {\n fullString = `${date.getDate()}. ${monthToTranslation[date.getMonth()]} ${date.getFullYear()}`\n }\n\n return (\n <span>\n {fullString}\n </span>\n )\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n language: Language,\n setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n language: LanguageUtil.DEFAULT_LANGUAGE,\n setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n const { language } = useLanguage()\n const mapping: Record<Language, string> = {\n en: 'en-US',\n de: 'de-DE'\n }\n return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n useEffect(() => {\n if (language !== initialLanguage && initialLanguage) {\n console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n setLanguage(initialLanguage)\n }\n }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n useEffect(() => {\n // TODO set locale of html tag here as well\n setStoredLanguage(language)\n }, [language, setStoredLanguage])\n\n useEffect(() => {\n if (storedLanguage !== null) {\n setLanguage(storedLanguage)\n return\n }\n\n const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n const matchingBrowserLanguage = window.navigator.languages\n .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n .filter(entry => entry !== undefined)\n\n if (matchingBrowserLanguage.length === 0) return\n\n const firstMatch = matchingBrowserLanguage[0] as Language\n setLanguage(firstMatch)\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <LanguageContext.Provider value={{\n language,\n setLanguage\n }}>\n {children}\n </LanguageContext.Provider>\n )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n const get = useCallback((): T => {\n if (typeof window === 'undefined') {\n return initValue\n }\n const storageService = new LocalStorageService()\n const value = storageService.get<T>(key)\n return value || initValue\n }, [initValue, key])\n\n const [storedValue, setStoredValue] = useState<T>(get)\n\n const setValue: SetValue<T> = useCallback(value => {\n const newValue = value instanceof Function ? value(storedValue) : value\n const storageService = new LocalStorageService()\n storageService.set(key, value)\n\n setStoredValue(newValue)\n }, [storedValue, setStoredValue, key])\n\n useEffect(() => {\n setStoredValue(get())\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n en: 'English',\n de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n languages,\n DEFAULT_LANGUAGE,\n languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\nexport type Translation<T> = Record<Language, T>\n\ntype OverwriteTranslationType<Translation extends Record<string, unknown>> = {\n language?: Language,\n translation?: Partial<Record<Language, Partial<Translation>>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n * if you don't expect any other props other than `language` and get an\n * error when using your component (because it uses `forwardRef` etc.)\n * you can try out `Record<string, unknown>`, this might resolve your\n * problem as `SomeType & never` is still `never` but `SomeType & unknown`\n * is `SomeType` which means that adding back props (like `ref` etc.)\n * works properly\n */\nexport type PropsForTranslation<\n Translation extends Record<string, unknown>,\n Props = Record<string, never>\n> = Props & {\n overwriteTranslation?: OverwriteTranslationType<Translation>,\n};\n\nexport const useTranslation = <Translation extends Record<string, unknown>>(\n defaults: Record<Language, Translation>,\n translationOverwrite: OverwriteTranslationType<Translation> = {}\n): Translation => {\n const { language: languageProp, translation: overwrite } = translationOverwrite\n const { language: inferredLanguage } = useLanguage()\n const usedLanguage = languageProp ?? inferredLanguage\n let defaultValues: Translation = defaults[usedLanguage]\n if (overwrite && overwrite[usedLanguage]) {\n defaultValues = { ...defaultValues, ...overwrite[usedLanguage] }\n }\n return defaultValues\n}\n"],"mappings":"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","names":["import_react","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/date/TimeDisplay.tsx","../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts","../../../src/localization/defaults/time.ts"],"sourcesContent":["import type { PropsForTranslation, Translation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport type { TimeTranslationType } from '../../localization/defaults/time'\nimport { timeTranslation } from '../../localization/defaults/time'\n\ntype TimeDisplayTranslationType = TimeTranslationType & {\n inDays: string,\n agoDays: string,\n}\n\nconst defaultTimeDisplayTranslations: Translation<TimeDisplayTranslationType> = {\n en: {\n ...timeTranslation.en,\n inDays: `in {{days}} days`,\n agoDays: `{{days}} days ago`,\n },\n de: {\n ...timeTranslation.de,\n inDays: `in {{days}} Tagen`,\n agoDays: `vor {{days}} Tagen`,\n }\n}\n\ntype TimeDisplayMode = 'daysFromToday' | 'date'\n\ntype TimeDisplayProps = {\n date: Date,\n mode?: TimeDisplayMode,\n}\n\n/**\n * A Component for displaying time and dates in a unified fashion\n */\nexport const TimeDisplay = ({\n overwriteTranslation,\n date,\n mode = 'daysFromToday'\n }: PropsForTranslation<TimeDisplayTranslationType, TimeDisplayProps>) => {\n const translation = useTranslation([defaultTimeDisplayTranslations], overwriteTranslation)\n const difference = new Date().setHours(0, 0, 0, 0).valueOf() - new Date(date).setHours(0, 0, 0, 0).valueOf()\n const isBefore = difference > 0\n const differenceInDays = Math.floor(Math.abs(difference) / (1000 * 3600 * 24))\n\n let displayString\n if (differenceInDays === 0) {\n displayString = translation('today')\n } else if (differenceInDays === 1) {\n displayString = isBefore ? translation('yesterday') : translation('tomorrow')\n } else {\n displayString = isBefore ? translation('agoDays', { replacements: { days: differenceInDays.toString() } }) : translation('inDays', { replacements: { days: differenceInDays.toString() } })\n }\n const monthToTranslation: { [key: number]: string } = {\n 0: translation('january'),\n 1: translation('february'),\n 2: translation('march'),\n 3: translation('april'),\n 4: translation('may'),\n 5: translation('june'),\n 6: translation('july'),\n 7: translation('august'),\n 8: translation('september'),\n 9: translation('october'),\n 10: translation('november'),\n 11: translation('december')\n } as const\n\n let fullString\n if (mode === 'daysFromToday') {\n fullString = `${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')} - ${displayString}`\n } else {\n fullString = `${date.getDate()}. ${monthToTranslation[date.getMonth()]} ${date.getFullYear()}`\n }\n\n return (\n <span>\n {fullString}\n </span>\n )\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n language: Language,\n setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n language: LanguageUtil.DEFAULT_LANGUAGE,\n setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n const { language } = useLanguage()\n const mapping: Record<Language, string> = {\n en: 'en-US',\n de: 'de-DE'\n }\n return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n useEffect(() => {\n if (language !== initialLanguage && initialLanguage) {\n console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n setLanguage(initialLanguage)\n }\n }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n useEffect(() => {\n // TODO set locale of html tag here as well\n setStoredLanguage(language)\n }, [language, setStoredLanguage])\n\n useEffect(() => {\n if (storedLanguage !== null) {\n setLanguage(storedLanguage)\n return\n }\n\n const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n const matchingBrowserLanguage = window.navigator.languages\n .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n .filter(entry => entry !== undefined)\n\n if (matchingBrowserLanguage.length === 0) return\n\n const firstMatch = matchingBrowserLanguage[0] as Language\n setLanguage(firstMatch)\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <LanguageContext.Provider value={{\n language,\n setLanguage\n }}>\n {children}\n </LanguageContext.Provider>\n )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n const get = useCallback((): T => {\n if (typeof window === 'undefined') {\n return initValue\n }\n const storageService = new LocalStorageService()\n const value = storageService.get<T>(key)\n return value || initValue\n }, [initValue, key])\n\n const [storedValue, setStoredValue] = useState<T>(get)\n\n const setValue: SetValue<T> = useCallback(value => {\n const newValue = value instanceof Function ? value(storedValue) : value\n const storageService = new LocalStorageService()\n storageService.set(key, value)\n\n setStoredValue(newValue)\n }, [storedValue, setStoredValue, key])\n\n useEffect(() => {\n setStoredValue(get())\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n en: 'English',\n de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n languages,\n DEFAULT_LANGUAGE,\n languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\n/**\n * A type describing the pluralization of a word\n */\nexport type TranslationPlural = {\n zero?: string,\n one?: string,\n two?: string,\n few?: string,\n many?: string,\n other: string,\n}\n\n/**\n * The type describing all values of a translation\n */\nexport type TranslationType = Record<string, string | TranslationPlural>\n\n/**\n * The type of translations\n */\nexport type Translation<T extends TranslationType> = Record<Language, T>\n\ntype OverwriteTranslationType<T extends TranslationType> = {\n language?: Language,\n translation?: Translation<Partial<T>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n * if you don't expect any other props other than `language` and get an\n * error when using your component (because it uses `forwardRef` etc.)\n * you can try out `Record<string, unknown>`, this might resolve your\n * problem as `SomeType & never` is still `never` but `SomeType & unknown`\n * is `SomeType` which means that adding back props (like `ref` etc.)\n * works properly\n */\nexport type PropsForTranslation<\n Translation extends TranslationType,\n Props = unknown\n> = Props & {\n overwriteTranslation?: OverwriteTranslationType<Translation>,\n}\n\ntype StringKeys<T> = Extract<keyof T, string>;\n\ntype TranslationFunctionOptions = {\n replacements?: Record<string, string>,\n count?: number,\n}\ntype TranslationFunction<T extends TranslationType> = (key: StringKeys<T>, options?: TranslationFunctionOptions) => string\n\nexport const TranslationPluralCount = {\n zero: 0,\n one: 1,\n two: 2,\n few: 3,\n many: 11,\n other: -1,\n}\n\n\nexport const useTranslation = <T extends TranslationType>(\n translations: Translation<Partial<TranslationType>>[],\n overwriteTranslation: OverwriteTranslationType<T> = {}\n): TranslationFunction<T> => {\n const { language: languageProp, translation: overwrite } = overwriteTranslation\n const { language: inferredLanguage } = useLanguage()\n const usedLanguage = languageProp ?? inferredLanguage\n const usedTranslations = [...translations]\n if (overwrite) {\n usedTranslations.push(overwrite)\n }\n\n return (key: StringKeys<T>, options?: TranslationFunctionOptions): string => {\n const { count, replacements } = { ...{ count: 0, replacements: {} }, ...options }\n\n try {\n for (let i = translations.length - 1; i >= 0; i--) {\n const translation = translations[i]\n const localizedTranslation = translation[usedLanguage]\n if (!localizedTranslation) {\n continue\n }\n const value = localizedTranslation[key]\n if(!value) {\n continue\n }\n\n let forProcessing: string\n if (typeof value !== 'string') {\n if (count === TranslationPluralCount.zero && value?.zero) {\n forProcessing = value.zero\n } else if (count === TranslationPluralCount.one && value?.one) {\n forProcessing = value.one\n } else if (count === TranslationPluralCount.two && value?.two) {\n forProcessing = value.two\n } else if (TranslationPluralCount.few <= count && count < TranslationPluralCount.many && value?.few) {\n forProcessing = value.few\n } else if (count > TranslationPluralCount.many && value?.many) {\n forProcessing = value.many\n } else {\n forProcessing = value.other\n }\n } else {\n forProcessing = value\n }\n forProcessing = forProcessing.replace(/\\{\\{(\\w+)}}/g, (_, placeholder) => {\n return replacements[placeholder] ?? `{{key:${placeholder}}}` // fallback if key is missing\n })\n return forProcessing\n }\n } catch (e) {\n console.error(e)\n }\n return `{{${usedLanguage}:${key}}}`\n }\n}","import type { TranslationPlural, Translation } from '../useTranslation'\n\nexport type MonthTranslationType = {\n january: string,\n february: string,\n march: string,\n april: string,\n may: string,\n june: string,\n july: string,\n august: string,\n september: string,\n october: string,\n november: string,\n december: string,\n}\n\nexport const monthTranslation: Translation<MonthTranslationType> = {\n en: {\n january: 'January',\n february: 'Febuary',\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 },\n de: {\n january: 'Januar',\n february: 'Febuar',\n march: 'März',\n april: 'April',\n may: 'Mai',\n june: 'Juni',\n july: 'Juli',\n august: 'August',\n september: 'September',\n october: 'October',\n november: 'November',\n december: 'December',\n }\n}\n\nexport type TimeTranslationType = {\n century: TranslationPlural,\n decade: TranslationPlural,\n year: TranslationPlural,\n month: TranslationPlural,\n day: TranslationPlural,\n hour: TranslationPlural,\n minute: TranslationPlural,\n second: TranslationPlural,\n millisecond: TranslationPlural,\n microsecond: TranslationPlural,\n nanosecond: TranslationPlural,\n yesterday: string,\n today: string,\n tomorrow: string,\n in: string,\n ago: string,\n} & MonthTranslationType\n\nexport const timeTranslation: Translation<TimeTranslationType> = {\n en: {\n ...monthTranslation.en,\n century: { one: 'Century', other: 'Centuries' },\n decade: { one: 'Decade', other: 'Decades' },\n year: { one: 'Year', other: 'Years' },\n month: { one: 'Month', other: 'Months' },\n day: { one: 'Day', other: 'Days' },\n hour: { one: 'Hour', other: 'Hours' },\n minute: { one: 'Minute', other: 'Minutes' },\n second: { one: 'Second', other: 'Seconds' },\n millisecond: { one: 'Millisecond', other: 'Milliseconds' },\n microsecond: { one: 'Microsecond', other: 'Microseconds' },\n nanosecond: { one: 'Nanosecond', other: 'Nanoseconds' },\n yesterday: 'Yesterday',\n today: 'Today',\n tomorrow: 'Tomorrow',\n in: 'in',\n ago: 'ago',\n },\n de: {\n ...monthTranslation.de,\n century: { one: 'Jahrhundert', other: 'Jahrhunderte' },\n decade: { one: 'Jahrzehnt', other: 'Jahrzehnte' },\n year: { one: 'Jahr', other: 'Jahre' },\n month: { one: 'Monat', other: 'Monate' },\n day: { one: 'Tag', other: 'Tage' },\n hour: { one: 'Stunde', other: 'Stunden' },\n minute: { one: 'Minute', other: 'Minuten' },\n second: { one: 'Sekunde', other: 'Sekunden' },\n millisecond: { one: 'Millisekunde', other: 'Millisekunden' },\n microsecond: { one: 'Mikrosekunde', other: 'Mikrosekunden' },\n nanosecond: { one: 'Nanosekunde', other: 'Nanosekunden' },\n yesterday: 'Gestern',\n today: 'Heute',\n tomorrow: 'Morgen',\n in: 'in',\n ago: 'vor',\n }\n}"],"mappings":"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","names":["import_react","import_jsx_runtime"]}
|
|
@@ -26,28 +26,70 @@ var LanguageContext = createContext({
|
|
|
26
26
|
var useLanguage = () => useContext(LanguageContext);
|
|
27
27
|
|
|
28
28
|
// src/localization/useTranslation.ts
|
|
29
|
-
var
|
|
30
|
-
|
|
29
|
+
var TranslationPluralCount = {
|
|
30
|
+
zero: 0,
|
|
31
|
+
one: 1,
|
|
32
|
+
two: 2,
|
|
33
|
+
few: 3,
|
|
34
|
+
many: 11,
|
|
35
|
+
other: -1
|
|
36
|
+
};
|
|
37
|
+
var useTranslation = (translations, overwriteTranslation = {}) => {
|
|
38
|
+
const { language: languageProp, translation: overwrite } = overwriteTranslation;
|
|
31
39
|
const { language: inferredLanguage } = useLanguage();
|
|
32
40
|
const usedLanguage = languageProp ?? inferredLanguage;
|
|
33
|
-
|
|
34
|
-
if (overwrite
|
|
35
|
-
|
|
41
|
+
const usedTranslations = [...translations];
|
|
42
|
+
if (overwrite) {
|
|
43
|
+
usedTranslations.push(overwrite);
|
|
36
44
|
}
|
|
37
|
-
return
|
|
45
|
+
return (key, options) => {
|
|
46
|
+
const { count, replacements } = { ...{ count: 0, replacements: {} }, ...options };
|
|
47
|
+
try {
|
|
48
|
+
for (let i = translations.length - 1; i >= 0; i--) {
|
|
49
|
+
const translation = translations[i];
|
|
50
|
+
const localizedTranslation = translation[usedLanguage];
|
|
51
|
+
if (!localizedTranslation) {
|
|
52
|
+
continue;
|
|
53
|
+
}
|
|
54
|
+
const value = localizedTranslation[key];
|
|
55
|
+
if (!value) {
|
|
56
|
+
continue;
|
|
57
|
+
}
|
|
58
|
+
let forProcessing;
|
|
59
|
+
if (typeof value !== "string") {
|
|
60
|
+
if (count === TranslationPluralCount.zero && value?.zero) {
|
|
61
|
+
forProcessing = value.zero;
|
|
62
|
+
} else if (count === TranslationPluralCount.one && value?.one) {
|
|
63
|
+
forProcessing = value.one;
|
|
64
|
+
} else if (count === TranslationPluralCount.two && value?.two) {
|
|
65
|
+
forProcessing = value.two;
|
|
66
|
+
} else if (TranslationPluralCount.few <= count && count < TranslationPluralCount.many && value?.few) {
|
|
67
|
+
forProcessing = value.few;
|
|
68
|
+
} else if (count > TranslationPluralCount.many && value?.many) {
|
|
69
|
+
forProcessing = value.many;
|
|
70
|
+
} else {
|
|
71
|
+
forProcessing = value.other;
|
|
72
|
+
}
|
|
73
|
+
} else {
|
|
74
|
+
forProcessing = value;
|
|
75
|
+
}
|
|
76
|
+
forProcessing = forProcessing.replace(/\{\{(\w+)}}/g, (_, placeholder) => {
|
|
77
|
+
return replacements[placeholder] ?? `{{key:${placeholder}}}`;
|
|
78
|
+
});
|
|
79
|
+
return forProcessing;
|
|
80
|
+
}
|
|
81
|
+
} catch (e) {
|
|
82
|
+
console.error(e);
|
|
83
|
+
}
|
|
84
|
+
return `{{${usedLanguage}:${key}}}`;
|
|
85
|
+
};
|
|
38
86
|
};
|
|
39
87
|
|
|
40
|
-
// src/
|
|
41
|
-
|
|
42
|
-
var defaultTimeDisplayTranslations = {
|
|
88
|
+
// src/localization/defaults/time.ts
|
|
89
|
+
var monthTranslation = {
|
|
43
90
|
en: {
|
|
44
|
-
today: "today",
|
|
45
|
-
yesterday: "yesterday",
|
|
46
|
-
tomorrow: "tomorrow",
|
|
47
|
-
inDays: (days) => `in ${days} days`,
|
|
48
|
-
agoDays: (days) => `${days} days ago`,
|
|
49
91
|
january: "January",
|
|
50
|
-
february: "
|
|
92
|
+
february: "Febuary",
|
|
51
93
|
march: "March",
|
|
52
94
|
april: "April",
|
|
53
95
|
may: "May",
|
|
@@ -60,13 +102,8 @@ var defaultTimeDisplayTranslations = {
|
|
|
60
102
|
december: "December"
|
|
61
103
|
},
|
|
62
104
|
de: {
|
|
63
|
-
today: "heute",
|
|
64
|
-
yesterday: "gestern",
|
|
65
|
-
tomorrow: "morgen",
|
|
66
|
-
inDays: (days) => `in ${days} Tagen`,
|
|
67
|
-
agoDays: (days) => `vor ${days} Tagen`,
|
|
68
105
|
january: "Januar",
|
|
69
|
-
february: "
|
|
106
|
+
february: "Febuar",
|
|
70
107
|
march: "M\xE4rz",
|
|
71
108
|
april: "April",
|
|
72
109
|
may: "Mai",
|
|
@@ -79,36 +116,91 @@ var defaultTimeDisplayTranslations = {
|
|
|
79
116
|
december: "December"
|
|
80
117
|
}
|
|
81
118
|
};
|
|
119
|
+
var timeTranslation = {
|
|
120
|
+
en: {
|
|
121
|
+
...monthTranslation.en,
|
|
122
|
+
century: { one: "Century", other: "Centuries" },
|
|
123
|
+
decade: { one: "Decade", other: "Decades" },
|
|
124
|
+
year: { one: "Year", other: "Years" },
|
|
125
|
+
month: { one: "Month", other: "Months" },
|
|
126
|
+
day: { one: "Day", other: "Days" },
|
|
127
|
+
hour: { one: "Hour", other: "Hours" },
|
|
128
|
+
minute: { one: "Minute", other: "Minutes" },
|
|
129
|
+
second: { one: "Second", other: "Seconds" },
|
|
130
|
+
millisecond: { one: "Millisecond", other: "Milliseconds" },
|
|
131
|
+
microsecond: { one: "Microsecond", other: "Microseconds" },
|
|
132
|
+
nanosecond: { one: "Nanosecond", other: "Nanoseconds" },
|
|
133
|
+
yesterday: "Yesterday",
|
|
134
|
+
today: "Today",
|
|
135
|
+
tomorrow: "Tomorrow",
|
|
136
|
+
in: "in",
|
|
137
|
+
ago: "ago"
|
|
138
|
+
},
|
|
139
|
+
de: {
|
|
140
|
+
...monthTranslation.de,
|
|
141
|
+
century: { one: "Jahrhundert", other: "Jahrhunderte" },
|
|
142
|
+
decade: { one: "Jahrzehnt", other: "Jahrzehnte" },
|
|
143
|
+
year: { one: "Jahr", other: "Jahre" },
|
|
144
|
+
month: { one: "Monat", other: "Monate" },
|
|
145
|
+
day: { one: "Tag", other: "Tage" },
|
|
146
|
+
hour: { one: "Stunde", other: "Stunden" },
|
|
147
|
+
minute: { one: "Minute", other: "Minuten" },
|
|
148
|
+
second: { one: "Sekunde", other: "Sekunden" },
|
|
149
|
+
millisecond: { one: "Millisekunde", other: "Millisekunden" },
|
|
150
|
+
microsecond: { one: "Mikrosekunde", other: "Mikrosekunden" },
|
|
151
|
+
nanosecond: { one: "Nanosekunde", other: "Nanosekunden" },
|
|
152
|
+
yesterday: "Gestern",
|
|
153
|
+
today: "Heute",
|
|
154
|
+
tomorrow: "Morgen",
|
|
155
|
+
in: "in",
|
|
156
|
+
ago: "vor"
|
|
157
|
+
}
|
|
158
|
+
};
|
|
159
|
+
|
|
160
|
+
// src/components/date/TimeDisplay.tsx
|
|
161
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
162
|
+
var defaultTimeDisplayTranslations = {
|
|
163
|
+
en: {
|
|
164
|
+
...timeTranslation.en,
|
|
165
|
+
inDays: `in {{days}} days`,
|
|
166
|
+
agoDays: `{{days}} days ago`
|
|
167
|
+
},
|
|
168
|
+
de: {
|
|
169
|
+
...timeTranslation.de,
|
|
170
|
+
inDays: `in {{days}} Tagen`,
|
|
171
|
+
agoDays: `vor {{days}} Tagen`
|
|
172
|
+
}
|
|
173
|
+
};
|
|
82
174
|
var TimeDisplay = ({
|
|
83
175
|
overwriteTranslation,
|
|
84
176
|
date,
|
|
85
177
|
mode = "daysFromToday"
|
|
86
178
|
}) => {
|
|
87
|
-
const translation = useTranslation(defaultTimeDisplayTranslations, overwriteTranslation);
|
|
179
|
+
const translation = useTranslation([defaultTimeDisplayTranslations], overwriteTranslation);
|
|
88
180
|
const difference = (/* @__PURE__ */ new Date()).setHours(0, 0, 0, 0).valueOf() - new Date(date).setHours(0, 0, 0, 0).valueOf();
|
|
89
181
|
const isBefore = difference > 0;
|
|
90
182
|
const differenceInDays = Math.floor(Math.abs(difference) / (1e3 * 3600 * 24));
|
|
91
183
|
let displayString;
|
|
92
184
|
if (differenceInDays === 0) {
|
|
93
|
-
displayString = translation
|
|
185
|
+
displayString = translation("today");
|
|
94
186
|
} else if (differenceInDays === 1) {
|
|
95
|
-
displayString = isBefore ? translation
|
|
187
|
+
displayString = isBefore ? translation("yesterday") : translation("tomorrow");
|
|
96
188
|
} else {
|
|
97
|
-
displayString = isBefore ? translation.
|
|
189
|
+
displayString = isBefore ? translation("agoDays", { replacements: { days: differenceInDays.toString() } }) : translation("inDays", { replacements: { days: differenceInDays.toString() } });
|
|
98
190
|
}
|
|
99
191
|
const monthToTranslation = {
|
|
100
|
-
0: translation
|
|
101
|
-
1: translation
|
|
102
|
-
2: translation
|
|
103
|
-
3: translation
|
|
104
|
-
4: translation
|
|
105
|
-
5: translation
|
|
106
|
-
6: translation
|
|
107
|
-
7: translation
|
|
108
|
-
8: translation
|
|
109
|
-
9: translation
|
|
110
|
-
10: translation
|
|
111
|
-
11: translation
|
|
192
|
+
0: translation("january"),
|
|
193
|
+
1: translation("february"),
|
|
194
|
+
2: translation("march"),
|
|
195
|
+
3: translation("april"),
|
|
196
|
+
4: translation("may"),
|
|
197
|
+
5: translation("june"),
|
|
198
|
+
6: translation("july"),
|
|
199
|
+
7: translation("august"),
|
|
200
|
+
8: translation("september"),
|
|
201
|
+
9: translation("october"),
|
|
202
|
+
10: translation("november"),
|
|
203
|
+
11: translation("december")
|
|
112
204
|
};
|
|
113
205
|
let fullString;
|
|
114
206
|
if (mode === "daysFromToday") {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts","../../../src/components/date/TimeDisplay.tsx"],"sourcesContent":["import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n language: Language,\n setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n language: LanguageUtil.DEFAULT_LANGUAGE,\n setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n const { language } = useLanguage()\n const mapping: Record<Language, string> = {\n en: 'en-US',\n de: 'de-DE'\n }\n return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n useEffect(() => {\n if (language !== initialLanguage && initialLanguage) {\n console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n setLanguage(initialLanguage)\n }\n }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n useEffect(() => {\n // TODO set locale of html tag here as well\n setStoredLanguage(language)\n }, [language, setStoredLanguage])\n\n useEffect(() => {\n if (storedLanguage !== null) {\n setLanguage(storedLanguage)\n return\n }\n\n const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n const matchingBrowserLanguage = window.navigator.languages\n .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n .filter(entry => entry !== undefined)\n\n if (matchingBrowserLanguage.length === 0) return\n\n const firstMatch = matchingBrowserLanguage[0] as Language\n setLanguage(firstMatch)\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <LanguageContext.Provider value={{\n language,\n setLanguage\n }}>\n {children}\n </LanguageContext.Provider>\n )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n const get = useCallback((): T => {\n if (typeof window === 'undefined') {\n return initValue\n }\n const storageService = new LocalStorageService()\n const value = storageService.get<T>(key)\n return value || initValue\n }, [initValue, key])\n\n const [storedValue, setStoredValue] = useState<T>(get)\n\n const setValue: SetValue<T> = useCallback(value => {\n const newValue = value instanceof Function ? value(storedValue) : value\n const storageService = new LocalStorageService()\n storageService.set(key, value)\n\n setStoredValue(newValue)\n }, [storedValue, setStoredValue, key])\n\n useEffect(() => {\n setStoredValue(get())\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n en: 'English',\n de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n languages,\n DEFAULT_LANGUAGE,\n languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\nexport type Translation<T> = Record<Language, T>\n\ntype OverwriteTranslationType<Translation extends Record<string, unknown>> = {\n language?: Language,\n translation?: Partial<Record<Language, Partial<Translation>>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n * if you don't expect any other props other than `language` and get an\n * error when using your component (because it uses `forwardRef` etc.)\n * you can try out `Record<string, unknown>`, this might resolve your\n * problem as `SomeType & never` is still `never` but `SomeType & unknown`\n * is `SomeType` which means that adding back props (like `ref` etc.)\n * works properly\n */\nexport type PropsForTranslation<\n Translation extends Record<string, unknown>,\n Props = Record<string, never>\n> = Props & {\n overwriteTranslation?: OverwriteTranslationType<Translation>,\n};\n\nexport const useTranslation = <Translation extends Record<string, unknown>>(\n defaults: Record<Language, Translation>,\n translationOverwrite: OverwriteTranslationType<Translation> = {}\n): Translation => {\n const { language: languageProp, translation: overwrite } = translationOverwrite\n const { language: inferredLanguage } = useLanguage()\n const usedLanguage = languageProp ?? inferredLanguage\n let defaultValues: Translation = defaults[usedLanguage]\n if (overwrite && overwrite[usedLanguage]) {\n defaultValues = { ...defaultValues, ...overwrite[usedLanguage] }\n }\n return defaultValues\n}\n","import type { Language } from '../../localization/util'\nimport type { PropsForTranslation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\n\ntype TimeDisplayTranslation = {\n today: string,\n yesterday: string,\n tomorrow: string,\n inDays: (days: number) => string,\n agoDays: (days: number) => string,\n january: string,\n february: string,\n march: string,\n april: string,\n may: string,\n june: string,\n july: string,\n august: string,\n september: string,\n october: string,\n november: string,\n december: string,\n}\n\nconst defaultTimeDisplayTranslations: Record<Language, TimeDisplayTranslation> = {\n en: {\n today: 'today',\n yesterday: 'yesterday',\n tomorrow: 'tomorrow',\n inDays: (days: number) => `in ${days} days`,\n agoDays: (days: number) => `${days} days ago`,\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 },\n de: {\n today: 'heute',\n yesterday: 'gestern',\n tomorrow: 'morgen',\n inDays: (days: number) => `in ${days} Tagen`,\n agoDays: (days: number) => `vor ${days} Tagen`,\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: 'October',\n november: 'November',\n december: 'December'\n }\n}\n\ntype TimeDisplayMode = 'daysFromToday' | 'date'\n\ntype TimeDisplayProps = {\n date: Date,\n mode?: TimeDisplayMode,\n}\n\n/**\n * A Component for displaying time and dates in a unified fashion\n */\nexport const TimeDisplay = ({\n overwriteTranslation,\n date,\n mode = 'daysFromToday'\n }: PropsForTranslation<TimeDisplayTranslation, TimeDisplayProps>) => {\n const translation = useTranslation(defaultTimeDisplayTranslations, overwriteTranslation)\n const difference = new Date().setHours(0, 0, 0, 0).valueOf() - new Date(date).setHours(0, 0, 0, 0).valueOf()\n const isBefore = difference > 0\n const differenceInDays = Math.floor(Math.abs(difference) / (1000 * 3600 * 24))\n\n let displayString\n if (differenceInDays === 0) {\n displayString = translation.today\n } else if (differenceInDays === 1) {\n displayString = isBefore ? translation.yesterday : translation.tomorrow\n } else {\n displayString = isBefore ? translation.agoDays(differenceInDays) : translation.inDays(differenceInDays)\n }\n const monthToTranslation: { [key: number]: string } = {\n 0: translation.january,\n 1: translation.february,\n 2: translation.march,\n 3: translation.april,\n 4: translation.may,\n 5: translation.june,\n 6: translation.july,\n 7: translation.august,\n 8: translation.september,\n 9: translation.october,\n 10: translation.november,\n 11: translation.december\n } as const\n\n let fullString\n if (mode === 'daysFromToday') {\n fullString = `${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')} - ${displayString}`\n } else {\n fullString = `${date.getDate()}. ${monthToTranslation[date.getMonth()]} ${date.getFullYear()}`\n }\n\n return (\n <span>\n {fullString}\n </span>\n )\n}\n"],"mappings":";AACA,SAAS,eAAe,YAAY,aAAAA,YAAW,YAAAC,iBAAgB;;;ACA/D,SAAS,aAAa,WAAW,gBAAgB;;;ACEjD,IAAM,YAAY,CAAC,MAAM,IAAI;AAU7B,IAAM,sBAAgD;AAAA,EACpD,IAAI;AAAA,EACJ,IAAI;AACN;AAKA,IAAM,mBAA6B;AAK5B,IAAM,eAAe;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AACF;;;AFoCI;AAvDG,IAAM,kBAAkB,cAAoC;AAAA,EACjE,UAAU,aAAa;AAAA,EACvB,aAAa,CAAC,MAAM;AACtB,CAAC;AAEM,IAAM,cAAc,MAAM,WAAW,eAAe;;;AGcpD,IAAM,iBAAiB,CAC5B,UACA,uBAA8D,CAAC,MAC/C;AAChB,QAAM,EAAE,UAAU,cAAc,aAAa,UAAU,IAAI;AAC3D,QAAM,EAAE,UAAU,iBAAiB,IAAI,YAAY;AACnD,QAAM,eAAe,gBAAgB;AACrC,MAAI,gBAA6B,SAAS,YAAY;AACtD,MAAI,aAAa,UAAU,YAAY,GAAG;AACxC,oBAAgB,EAAE,GAAG,eAAe,GAAG,UAAU,YAAY,EAAE;AAAA,EACjE;AACA,SAAO;AACT;;;AC0EI,gBAAAC,YAAA;AA5FJ,IAAM,iCAA2E;AAAA,EAC/E,IAAI;AAAA,IACF,OAAO;AAAA,IACP,WAAW;AAAA,IACX,UAAU;AAAA,IACV,QAAQ,CAAC,SAAiB,MAAM,IAAI;AAAA,IACpC,SAAS,CAAC,SAAiB,GAAG,IAAI;AAAA,IAClC,SAAS;AAAA,IACT,UAAU;AAAA,IACV,OAAO;AAAA,IACP,OAAO;AAAA,IACP,KAAK;AAAA,IACL,MAAM;AAAA,IACN,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,SAAS;AAAA,IACT,UAAU;AAAA,IACV,UAAU;AAAA,EACZ;AAAA,EACA,IAAI;AAAA,IACF,OAAO;AAAA,IACP,WAAW;AAAA,IACX,UAAU;AAAA,IACV,QAAQ,CAAC,SAAiB,MAAM,IAAI;AAAA,IACpC,SAAS,CAAC,SAAiB,OAAO,IAAI;AAAA,IACtC,SAAS;AAAA,IACT,UAAU;AAAA,IACV,OAAO;AAAA,IACP,OAAO;AAAA,IACP,KAAK;AAAA,IACL,MAAM;AAAA,IACN,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,SAAS;AAAA,IACT,UAAU;AAAA,IACV,UAAU;AAAA,EACZ;AACF;AAYO,IAAM,cAAc,CAAC;AAAA,EACE;AAAA,EACA;AAAA,EACA,OAAO;AACT,MAAqE;AAC/F,QAAM,cAAc,eAAe,gCAAgC,oBAAoB;AACvF,QAAM,cAAa,oBAAI,KAAK,GAAE,SAAS,GAAG,GAAG,GAAG,CAAC,EAAE,QAAQ,IAAI,IAAI,KAAK,IAAI,EAAE,SAAS,GAAG,GAAG,GAAG,CAAC,EAAE,QAAQ;AAC3G,QAAM,WAAW,aAAa;AAC9B,QAAM,mBAAmB,KAAK,MAAM,KAAK,IAAI,UAAU,KAAK,MAAO,OAAO,GAAG;AAE7E,MAAI;AACJ,MAAI,qBAAqB,GAAG;AAC1B,oBAAgB,YAAY;AAAA,EAC9B,WAAW,qBAAqB,GAAG;AACjC,oBAAgB,WAAW,YAAY,YAAY,YAAY;AAAA,EACjE,OAAO;AACL,oBAAgB,WAAW,YAAY,QAAQ,gBAAgB,IAAI,YAAY,OAAO,gBAAgB;AAAA,EACxG;AACA,QAAM,qBAAgD;AAAA,IACpD,GAAG,YAAY;AAAA,IACf,GAAG,YAAY;AAAA,IACf,GAAG,YAAY;AAAA,IACf,GAAG,YAAY;AAAA,IACf,GAAG,YAAY;AAAA,IACf,GAAG,YAAY;AAAA,IACf,GAAG,YAAY;AAAA,IACf,GAAG,YAAY;AAAA,IACf,GAAG,YAAY;AAAA,IACf,GAAG,YAAY;AAAA,IACf,IAAI,YAAY;AAAA,IAChB,IAAI,YAAY;AAAA,EAClB;AAEA,MAAI;AACJ,MAAI,SAAS,iBAAiB;AAC5B,iBAAa,GAAG,KAAK,SAAS,EAAE,SAAS,EAAE,SAAS,GAAG,GAAG,CAAC,IAAI,KAAK,WAAW,EAAE,SAAS,EAAE,SAAS,GAAG,GAAG,CAAC,MAAM,aAAa;AAAA,EACjI,OAAO;AACL,iBAAa,GAAG,KAAK,QAAQ,CAAC,KAAK,mBAAmB,KAAK,SAAS,CAAC,CAAC,IAAI,KAAK,YAAY,CAAC;AAAA,EAC9F;AAEA,SACE,gBAAAA,KAAC,UACE,sBACH;AAEJ;","names":["useEffect","useState","jsx"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/localization/LanguageProvider.tsx","../../../src/hooks/useLocalStorage.ts","../../../src/localization/util.ts","../../../src/localization/useTranslation.ts","../../../src/localization/defaults/time.ts","../../../src/components/date/TimeDisplay.tsx"],"sourcesContent":["import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from '../hooks/useLocalStorage'\nimport type { Language } from './util'\nimport { LanguageUtil } from './util'\n\nexport type LanguageContextValue = {\n language: Language,\n setLanguage: Dispatch<SetStateAction<Language>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({\n language: LanguageUtil.DEFAULT_LANGUAGE,\n setLanguage: (v) => v\n})\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Language) => {\n const { language } = useLanguage()\n const mapping: Record<Language, string> = {\n en: 'en-US',\n de: 'de-DE'\n }\n return mapping[overWriteLanguage ?? language]\n}\n\ntype LanguageProviderProps = {\n initialLanguage?: Language,\n}\n\nexport const LanguageProvider = ({ initialLanguage, children }: PropsWithChildren<LanguageProviderProps>) => {\n const [language, setLanguage] = useState<Language>(initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n const [storedLanguage, setStoredLanguage] = useLocalStorage<Language>('language', initialLanguage ?? LanguageUtil.DEFAULT_LANGUAGE)\n\n useEffect(() => {\n if (language !== initialLanguage && initialLanguage) {\n console.warn('LanguageProvider initial state changed: Prefer using languageProvider\\'s setLanguage instead')\n setLanguage(initialLanguage)\n }\n }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n useEffect(() => {\n // TODO set locale of html tag here as well\n setStoredLanguage(language)\n }, [language, setStoredLanguage])\n\n useEffect(() => {\n if (storedLanguage !== null) {\n setLanguage(storedLanguage)\n return\n }\n\n const LanguageToTestAgainst = Object.values(LanguageUtil.languages)\n\n const matchingBrowserLanguage = window.navigator.languages\n .map(language => LanguageToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n .filter(entry => entry !== undefined)\n\n if (matchingBrowserLanguage.length === 0) return\n\n const firstMatch = matchingBrowserLanguage[0] as Language\n setLanguage(firstMatch)\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <LanguageContext.Provider value={{\n language,\n setLanguage\n }}>\n {children}\n </LanguageContext.Provider>\n )\n}","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T>(key: string, initValue: T): [T, SetValue<T>] => {\n const get = useCallback((): T => {\n if (typeof window === 'undefined') {\n return initValue\n }\n const storageService = new LocalStorageService()\n const value = storageService.get<T>(key)\n return value || initValue\n }, [initValue, key])\n\n const [storedValue, setStoredValue] = useState<T>(get)\n\n const setValue: SetValue<T> = useCallback(value => {\n const newValue = value instanceof Function ? value(storedValue) : value\n const storageService = new LocalStorageService()\n storageService.set(key, value)\n\n setStoredValue(newValue)\n }, [storedValue, setStoredValue, key])\n\n useEffect(() => {\n setStoredValue(get())\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return [storedValue, setValue]\n}","/**\n * The supported languages\n */\nconst languages = ['en', 'de'] as const\n\n/**\n * The supported languages\n */\nexport type Language = typeof languages[number]\n\n/**\n * The supported languages' names in their respective language\n */\nconst languagesLocalNames: Record<Language, string> = {\n en: 'English',\n de: 'Deutsch',\n}\n\n/**\n * The default language\n */\nconst DEFAULT_LANGUAGE: Language = 'en'\n\n/**\n * A constant definition for holding data regarding languages\n */\nexport const LanguageUtil = {\n languages,\n DEFAULT_LANGUAGE,\n languagesLocalNames,\n}","import { useLanguage } from './LanguageProvider'\nimport type { Language } from './util'\n\n/**\n * A type describing the pluralization of a word\n */\nexport type TranslationPlural = {\n zero?: string,\n one?: string,\n two?: string,\n few?: string,\n many?: string,\n other: string,\n}\n\n/**\n * The type describing all values of a translation\n */\nexport type TranslationType = Record<string, string | TranslationPlural>\n\n/**\n * The type of translations\n */\nexport type Translation<T extends TranslationType> = Record<Language, T>\n\ntype OverwriteTranslationType<T extends TranslationType> = {\n language?: Language,\n translation?: Translation<Partial<T>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n * if you don't expect any other props other than `language` and get an\n * error when using your component (because it uses `forwardRef` etc.)\n * you can try out `Record<string, unknown>`, this might resolve your\n * problem as `SomeType & never` is still `never` but `SomeType & unknown`\n * is `SomeType` which means that adding back props (like `ref` etc.)\n * works properly\n */\nexport type PropsForTranslation<\n Translation extends TranslationType,\n Props = unknown\n> = Props & {\n overwriteTranslation?: OverwriteTranslationType<Translation>,\n}\n\ntype StringKeys<T> = Extract<keyof T, string>;\n\ntype TranslationFunctionOptions = {\n replacements?: Record<string, string>,\n count?: number,\n}\ntype TranslationFunction<T extends TranslationType> = (key: StringKeys<T>, options?: TranslationFunctionOptions) => string\n\nexport const TranslationPluralCount = {\n zero: 0,\n one: 1,\n two: 2,\n few: 3,\n many: 11,\n other: -1,\n}\n\n\nexport const useTranslation = <T extends TranslationType>(\n translations: Translation<Partial<TranslationType>>[],\n overwriteTranslation: OverwriteTranslationType<T> = {}\n): TranslationFunction<T> => {\n const { language: languageProp, translation: overwrite } = overwriteTranslation\n const { language: inferredLanguage } = useLanguage()\n const usedLanguage = languageProp ?? inferredLanguage\n const usedTranslations = [...translations]\n if (overwrite) {\n usedTranslations.push(overwrite)\n }\n\n return (key: StringKeys<T>, options?: TranslationFunctionOptions): string => {\n const { count, replacements } = { ...{ count: 0, replacements: {} }, ...options }\n\n try {\n for (let i = translations.length - 1; i >= 0; i--) {\n const translation = translations[i]\n const localizedTranslation = translation[usedLanguage]\n if (!localizedTranslation) {\n continue\n }\n const value = localizedTranslation[key]\n if(!value) {\n continue\n }\n\n let forProcessing: string\n if (typeof value !== 'string') {\n if (count === TranslationPluralCount.zero && value?.zero) {\n forProcessing = value.zero\n } else if (count === TranslationPluralCount.one && value?.one) {\n forProcessing = value.one\n } else if (count === TranslationPluralCount.two && value?.two) {\n forProcessing = value.two\n } else if (TranslationPluralCount.few <= count && count < TranslationPluralCount.many && value?.few) {\n forProcessing = value.few\n } else if (count > TranslationPluralCount.many && value?.many) {\n forProcessing = value.many\n } else {\n forProcessing = value.other\n }\n } else {\n forProcessing = value\n }\n forProcessing = forProcessing.replace(/\\{\\{(\\w+)}}/g, (_, placeholder) => {\n return replacements[placeholder] ?? `{{key:${placeholder}}}` // fallback if key is missing\n })\n return forProcessing\n }\n } catch (e) {\n console.error(e)\n }\n return `{{${usedLanguage}:${key}}}`\n }\n}","import type { TranslationPlural, Translation } from '../useTranslation'\n\nexport type MonthTranslationType = {\n january: string,\n february: string,\n march: string,\n april: string,\n may: string,\n june: string,\n july: string,\n august: string,\n september: string,\n october: string,\n november: string,\n december: string,\n}\n\nexport const monthTranslation: Translation<MonthTranslationType> = {\n en: {\n january: 'January',\n february: 'Febuary',\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 },\n de: {\n january: 'Januar',\n february: 'Febuar',\n march: 'März',\n april: 'April',\n may: 'Mai',\n june: 'Juni',\n july: 'Juli',\n august: 'August',\n september: 'September',\n october: 'October',\n november: 'November',\n december: 'December',\n }\n}\n\nexport type TimeTranslationType = {\n century: TranslationPlural,\n decade: TranslationPlural,\n year: TranslationPlural,\n month: TranslationPlural,\n day: TranslationPlural,\n hour: TranslationPlural,\n minute: TranslationPlural,\n second: TranslationPlural,\n millisecond: TranslationPlural,\n microsecond: TranslationPlural,\n nanosecond: TranslationPlural,\n yesterday: string,\n today: string,\n tomorrow: string,\n in: string,\n ago: string,\n} & MonthTranslationType\n\nexport const timeTranslation: Translation<TimeTranslationType> = {\n en: {\n ...monthTranslation.en,\n century: { one: 'Century', other: 'Centuries' },\n decade: { one: 'Decade', other: 'Decades' },\n year: { one: 'Year', other: 'Years' },\n month: { one: 'Month', other: 'Months' },\n day: { one: 'Day', other: 'Days' },\n hour: { one: 'Hour', other: 'Hours' },\n minute: { one: 'Minute', other: 'Minutes' },\n second: { one: 'Second', other: 'Seconds' },\n millisecond: { one: 'Millisecond', other: 'Milliseconds' },\n microsecond: { one: 'Microsecond', other: 'Microseconds' },\n nanosecond: { one: 'Nanosecond', other: 'Nanoseconds' },\n yesterday: 'Yesterday',\n today: 'Today',\n tomorrow: 'Tomorrow',\n in: 'in',\n ago: 'ago',\n },\n de: {\n ...monthTranslation.de,\n century: { one: 'Jahrhundert', other: 'Jahrhunderte' },\n decade: { one: 'Jahrzehnt', other: 'Jahrzehnte' },\n year: { one: 'Jahr', other: 'Jahre' },\n month: { one: 'Monat', other: 'Monate' },\n day: { one: 'Tag', other: 'Tage' },\n hour: { one: 'Stunde', other: 'Stunden' },\n minute: { one: 'Minute', other: 'Minuten' },\n second: { one: 'Sekunde', other: 'Sekunden' },\n millisecond: { one: 'Millisekunde', other: 'Millisekunden' },\n microsecond: { one: 'Mikrosekunde', other: 'Mikrosekunden' },\n nanosecond: { one: 'Nanosekunde', other: 'Nanosekunden' },\n yesterday: 'Gestern',\n today: 'Heute',\n tomorrow: 'Morgen',\n in: 'in',\n ago: 'vor',\n }\n}","import type { PropsForTranslation, Translation } from '../../localization/useTranslation'\nimport { useTranslation } from '../../localization/useTranslation'\nimport type { TimeTranslationType } from '../../localization/defaults/time'\nimport { timeTranslation } from '../../localization/defaults/time'\n\ntype TimeDisplayTranslationType = TimeTranslationType & {\n inDays: string,\n agoDays: string,\n}\n\nconst defaultTimeDisplayTranslations: Translation<TimeDisplayTranslationType> = {\n en: {\n ...timeTranslation.en,\n inDays: `in {{days}} days`,\n agoDays: `{{days}} days ago`,\n },\n de: {\n ...timeTranslation.de,\n inDays: `in {{days}} Tagen`,\n agoDays: `vor {{days}} Tagen`,\n }\n}\n\ntype TimeDisplayMode = 'daysFromToday' | 'date'\n\ntype TimeDisplayProps = {\n date: Date,\n mode?: TimeDisplayMode,\n}\n\n/**\n * A Component for displaying time and dates in a unified fashion\n */\nexport const TimeDisplay = ({\n overwriteTranslation,\n date,\n mode = 'daysFromToday'\n }: PropsForTranslation<TimeDisplayTranslationType, TimeDisplayProps>) => {\n const translation = useTranslation([defaultTimeDisplayTranslations], overwriteTranslation)\n const difference = new Date().setHours(0, 0, 0, 0).valueOf() - new Date(date).setHours(0, 0, 0, 0).valueOf()\n const isBefore = difference > 0\n const differenceInDays = Math.floor(Math.abs(difference) / (1000 * 3600 * 24))\n\n let displayString\n if (differenceInDays === 0) {\n displayString = translation('today')\n } else if (differenceInDays === 1) {\n displayString = isBefore ? translation('yesterday') : translation('tomorrow')\n } else {\n displayString = isBefore ? translation('agoDays', { replacements: { days: differenceInDays.toString() } }) : translation('inDays', { replacements: { days: differenceInDays.toString() } })\n }\n const monthToTranslation: { [key: number]: string } = {\n 0: translation('january'),\n 1: translation('february'),\n 2: translation('march'),\n 3: translation('april'),\n 4: translation('may'),\n 5: translation('june'),\n 6: translation('july'),\n 7: translation('august'),\n 8: translation('september'),\n 9: translation('october'),\n 10: translation('november'),\n 11: translation('december')\n } as const\n\n let fullString\n if (mode === 'daysFromToday') {\n fullString = `${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')} - ${displayString}`\n } else {\n fullString = `${date.getDate()}. ${monthToTranslation[date.getMonth()]} ${date.getFullYear()}`\n }\n\n return (\n <span>\n {fullString}\n </span>\n )\n}\n"],"mappings":";AACA,SAAS,eAAe,YAAY,aAAAA,YAAW,YAAAC,iBAAgB;;;ACA/D,SAAS,aAAa,WAAW,gBAAgB;;;ACEjD,IAAM,YAAY,CAAC,MAAM,IAAI;AAU7B,IAAM,sBAAgD;AAAA,EACpD,IAAI;AAAA,EACJ,IAAI;AACN;AAKA,IAAM,mBAA6B;AAK5B,IAAM,eAAe;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AACF;;;AFoCI;AAvDG,IAAM,kBAAkB,cAAoC;AAAA,EACjE,UAAU,aAAa;AAAA,EACvB,aAAa,CAAC,MAAM;AACtB,CAAC;AAEM,IAAM,cAAc,MAAM,WAAW,eAAe;;;AG0CpD,IAAM,yBAAyB;AAAA,EACpC,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,OAAO;AACT;AAGO,IAAM,iBAAiB,CAC5B,cACA,uBAAoD,CAAC,MAC1B;AAC3B,QAAM,EAAE,UAAU,cAAc,aAAa,UAAU,IAAI;AAC3D,QAAM,EAAE,UAAU,iBAAiB,IAAI,YAAY;AACnD,QAAM,eAAe,gBAAgB;AACrC,QAAM,mBAAmB,CAAC,GAAG,YAAY;AACzC,MAAI,WAAW;AACb,qBAAiB,KAAK,SAAS;AAAA,EACjC;AAEA,SAAO,CAAC,KAAoB,YAAiD;AAC3E,UAAM,EAAE,OAAO,aAAa,IAAI,EAAE,GAAG,EAAE,OAAO,GAAG,cAAc,CAAC,EAAE,GAAG,GAAG,QAAQ;AAEhF,QAAI;AACF,eAAS,IAAI,aAAa,SAAS,GAAG,KAAK,GAAG,KAAK;AACjD,cAAM,cAAc,aAAa,CAAC;AAClC,cAAM,uBAAuB,YAAY,YAAY;AACrD,YAAI,CAAC,sBAAsB;AACzB;AAAA,QACF;AACA,cAAM,QAAQ,qBAAqB,GAAG;AACtC,YAAG,CAAC,OAAO;AACT;AAAA,QACF;AAEA,YAAI;AACJ,YAAI,OAAO,UAAU,UAAU;AAC7B,cAAI,UAAU,uBAAuB,QAAQ,OAAO,MAAM;AACxD,4BAAgB,MAAM;AAAA,UACxB,WAAW,UAAU,uBAAuB,OAAO,OAAO,KAAK;AAC7D,4BAAgB,MAAM;AAAA,UACxB,WAAW,UAAU,uBAAuB,OAAO,OAAO,KAAK;AAC7D,4BAAgB,MAAM;AAAA,UACxB,WAAW,uBAAuB,OAAO,SAAS,QAAQ,uBAAuB,QAAQ,OAAO,KAAK;AACnG,4BAAgB,MAAM;AAAA,UACxB,WAAW,QAAQ,uBAAuB,QAAQ,OAAO,MAAM;AAC7D,4BAAgB,MAAM;AAAA,UACxB,OAAO;AACL,4BAAgB,MAAM;AAAA,UACxB;AAAA,QACF,OAAO;AACL,0BAAgB;AAAA,QAClB;AACA,wBAAgB,cAAc,QAAQ,gBAAgB,CAAC,GAAG,gBAAgB;AACxE,iBAAO,aAAa,WAAW,KAAK,SAAS,WAAW;AAAA,QAC1D,CAAC;AACD,eAAO;AAAA,MACT;AAAA,IACF,SAAS,GAAG;AACV,cAAQ,MAAM,CAAC;AAAA,IACjB;AACA,WAAO,KAAK,YAAY,IAAI,GAAG;AAAA,EACjC;AACF;;;AC1GO,IAAM,mBAAsD;AAAA,EACjE,IAAI;AAAA,IACF,SAAS;AAAA,IACT,UAAU;AAAA,IACV,OAAO;AAAA,IACP,OAAO;AAAA,IACP,KAAK;AAAA,IACL,MAAM;AAAA,IACN,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,SAAS;AAAA,IACT,UAAU;AAAA,IACV,UAAU;AAAA,EACZ;AAAA,EACA,IAAI;AAAA,IACF,SAAS;AAAA,IACT,UAAU;AAAA,IACV,OAAO;AAAA,IACP,OAAO;AAAA,IACP,KAAK;AAAA,IACL,MAAM;AAAA,IACN,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,SAAS;AAAA,IACT,UAAU;AAAA,IACV,UAAU;AAAA,EACZ;AACF;AAqBO,IAAM,kBAAoD;AAAA,EAC/D,IAAI;AAAA,IACF,GAAG,iBAAiB;AAAA,IACpB,SAAS,EAAE,KAAK,WAAW,OAAO,YAAY;AAAA,IAC9C,QAAQ,EAAE,KAAK,UAAU,OAAO,UAAU;AAAA,IAC1C,MAAM,EAAE,KAAK,QAAQ,OAAO,QAAQ;AAAA,IACpC,OAAO,EAAE,KAAK,SAAS,OAAO,SAAS;AAAA,IACvC,KAAK,EAAE,KAAK,OAAO,OAAO,OAAO;AAAA,IACjC,MAAM,EAAE,KAAK,QAAQ,OAAO,QAAQ;AAAA,IACpC,QAAQ,EAAE,KAAK,UAAU,OAAO,UAAU;AAAA,IAC1C,QAAQ,EAAE,KAAK,UAAU,OAAO,UAAU;AAAA,IAC1C,aAAa,EAAE,KAAK,eAAe,OAAO,eAAe;AAAA,IACzD,aAAa,EAAE,KAAK,eAAe,OAAO,eAAe;AAAA,IACzD,YAAY,EAAE,KAAK,cAAc,OAAO,cAAc;AAAA,IACtD,WAAW;AAAA,IACX,OAAO;AAAA,IACP,UAAU;AAAA,IACV,IAAI;AAAA,IACJ,KAAK;AAAA,EACP;AAAA,EACA,IAAI;AAAA,IACF,GAAG,iBAAiB;AAAA,IACpB,SAAS,EAAE,KAAK,eAAe,OAAO,eAAe;AAAA,IACrD,QAAQ,EAAE,KAAK,aAAa,OAAO,aAAa;AAAA,IAChD,MAAM,EAAE,KAAK,QAAQ,OAAO,QAAQ;AAAA,IACpC,OAAO,EAAE,KAAK,SAAS,OAAO,SAAS;AAAA,IACvC,KAAK,EAAE,KAAK,OAAO,OAAO,OAAO;AAAA,IACjC,MAAM,EAAE,KAAK,UAAU,OAAO,UAAU;AAAA,IACxC,QAAQ,EAAE,KAAK,UAAU,OAAO,UAAU;AAAA,IAC1C,QAAQ,EAAE,KAAK,WAAW,OAAO,WAAW;AAAA,IAC5C,aAAa,EAAE,KAAK,gBAAgB,OAAO,gBAAgB;AAAA,IAC3D,aAAa,EAAE,KAAK,gBAAgB,OAAO,gBAAgB;AAAA,IAC3D,YAAY,EAAE,KAAK,eAAe,OAAO,eAAe;AAAA,IACxD,WAAW;AAAA,IACX,OAAO;AAAA,IACP,UAAU;AAAA,IACV,IAAI;AAAA,IACJ,KAAK;AAAA,EACP;AACF;;;AChCI,gBAAAC,YAAA;AAhEJ,IAAM,iCAA0E;AAAA,EAC9E,IAAI;AAAA,IACF,GAAG,gBAAgB;AAAA,IACnB,QAAQ;AAAA,IACR,SAAS;AAAA,EACX;AAAA,EACA,IAAI;AAAA,IACF,GAAG,gBAAgB;AAAA,IACnB,QAAQ;AAAA,IACR,SAAS;AAAA,EACX;AACF;AAYO,IAAM,cAAc,CAAC;AAAA,EACE;AAAA,EACA;AAAA,EACA,OAAO;AACT,MAAyE;AACnG,QAAM,cAAc,eAAe,CAAC,8BAA8B,GAAG,oBAAoB;AACzF,QAAM,cAAa,oBAAI,KAAK,GAAE,SAAS,GAAG,GAAG,GAAG,CAAC,EAAE,QAAQ,IAAI,IAAI,KAAK,IAAI,EAAE,SAAS,GAAG,GAAG,GAAG,CAAC,EAAE,QAAQ;AAC3G,QAAM,WAAW,aAAa;AAC9B,QAAM,mBAAmB,KAAK,MAAM,KAAK,IAAI,UAAU,KAAK,MAAO,OAAO,GAAG;AAE7E,MAAI;AACJ,MAAI,qBAAqB,GAAG;AAC1B,oBAAgB,YAAY,OAAO;AAAA,EACrC,WAAW,qBAAqB,GAAG;AACjC,oBAAgB,WAAW,YAAY,WAAW,IAAI,YAAY,UAAU;AAAA,EAC9E,OAAO;AACL,oBAAgB,WAAW,YAAY,WAAW,EAAE,cAAc,EAAE,MAAM,iBAAiB,SAAS,EAAE,EAAE,CAAC,IAAI,YAAY,UAAU,EAAE,cAAc,EAAE,MAAM,iBAAiB,SAAS,EAAE,EAAE,CAAC;AAAA,EAC5L;AACA,QAAM,qBAAgD;AAAA,IACpD,GAAG,YAAY,SAAS;AAAA,IACxB,GAAG,YAAY,UAAU;AAAA,IACzB,GAAG,YAAY,OAAO;AAAA,IACtB,GAAG,YAAY,OAAO;AAAA,IACtB,GAAG,YAAY,KAAK;AAAA,IACpB,GAAG,YAAY,MAAM;AAAA,IACrB,GAAG,YAAY,MAAM;AAAA,IACrB,GAAG,YAAY,QAAQ;AAAA,IACvB,GAAG,YAAY,WAAW;AAAA,IAC1B,GAAG,YAAY,SAAS;AAAA,IACxB,IAAI,YAAY,UAAU;AAAA,IAC1B,IAAI,YAAY,UAAU;AAAA,EAC5B;AAEA,MAAI;AACJ,MAAI,SAAS,iBAAiB;AAC5B,iBAAa,GAAG,KAAK,SAAS,EAAE,SAAS,EAAE,SAAS,GAAG,GAAG,CAAC,IAAI,KAAK,WAAW,EAAE,SAAS,EAAE,SAAS,GAAG,GAAG,CAAC,MAAM,aAAa;AAAA,EACjI,OAAO;AACL,iBAAa,GAAG,KAAK,QAAQ,CAAC,KAAK,mBAAmB,KAAK,SAAS,CAAC,CAAC,IAAI,KAAK,YAAY,CAAC;AAAA,EAC9F;AAEA,SACE,gBAAAA,KAAC,UACE,sBACH;AAEJ;","names":["useEffect","useState","jsx"]}
|
|
@@ -3,13 +3,10 @@ import { PropsWithChildren } from 'react';
|
|
|
3
3
|
import { SolidButtonColor } from '../user-action/Button.mjs';
|
|
4
4
|
import { PropsForTranslation } from '../../localization/useTranslation.mjs';
|
|
5
5
|
import { DialogProps } from '../layout-and-navigation/Overlay.mjs';
|
|
6
|
+
import { FormTranslationType } from '../../localization/defaults/form.mjs';
|
|
6
7
|
import '../../localization/util.mjs';
|
|
7
8
|
|
|
8
|
-
type ConfirmDialogTranslation =
|
|
9
|
-
confirm: string;
|
|
10
|
-
cancel: string;
|
|
11
|
-
decline: string;
|
|
12
|
-
};
|
|
9
|
+
type ConfirmDialogTranslation = FormTranslationType;
|
|
13
10
|
type ConfirmDialogType = 'positive' | 'negative' | 'neutral' | 'primary';
|
|
14
11
|
type ButtonOverwriteType = {
|
|
15
12
|
text?: string;
|
|
@@ -3,13 +3,10 @@ import { PropsWithChildren } from 'react';
|
|
|
3
3
|
import { SolidButtonColor } from '../user-action/Button.js';
|
|
4
4
|
import { PropsForTranslation } from '../../localization/useTranslation.js';
|
|
5
5
|
import { DialogProps } from '../layout-and-navigation/Overlay.js';
|
|
6
|
+
import { FormTranslationType } from '../../localization/defaults/form.js';
|
|
6
7
|
import '../../localization/util.js';
|
|
7
8
|
|
|
8
|
-
type ConfirmDialogTranslation =
|
|
9
|
-
confirm: string;
|
|
10
|
-
cancel: string;
|
|
11
|
-
decline: string;
|
|
12
|
-
};
|
|
9
|
+
type ConfirmDialogTranslation = FormTranslationType;
|
|
13
10
|
type ConfirmDialogType = 'positive' | 'negative' | 'neutral' | 'primary';
|
|
14
11
|
type ButtonOverwriteType = {
|
|
15
12
|
text?: string;
|