Move date time translations to morfo

src/uix/active-uix/active-uix.svelte.test.ts

@@ -35,6 +35,10 @@ import { colorFieldMorfo } from '$uix/morfo/components/color-field';
 import { colorPickerMorfo } from '$uix/morfo/components/color-picker';
 import { comboboxMorfo } from '$uix/morfo/components/combobox';
 import { commandMorfo } from '$uix/morfo/components/command';
+import { dateFieldMorfo } from '$uix/morfo/components/date-field';
+import { datePickerMorfo } from '$uix/morfo/components/date-picker';
+import { dateRangeFieldMorfo } from '$uix/morfo/components/date-range-field';
+import { dateRangePickerMorfo } from '$uix/morfo/components/date-range-picker';
 import { dragDropMorfo } from '$uix/morfo/components/drag-drop';
 import { drawerMorfo } from '$uix/morfo/components/drawer';
 import { feedMorfo } from '$uix/morfo/components/feed';
@@ -56,6 +60,10 @@ import { tagGroupMorfo } from '$uix/morfo/components/tag-group';
 import { tagsInputMorfo } from '$uix/morfo/components/tags-input';
 import { stepperMorfo } from '$uix/morfo/components/stepper';
 import { tableMorfo } from '$uix/morfo/components/table';
+import { timeFieldMorfo } from '$uix/morfo/components/time-field';
+import { timePickerMorfo } from '$uix/morfo/components/time-picker';
+import { timeRangeFieldMorfo } from '$uix/morfo/components/time-range-field';
+import { timeRangePickerMorfo } from '$uix/morfo/components/time-range-picker';
 import { treeGridMorfo } from '$uix/morfo/components/tree-grid';
 import { treeViewMorfo } from '$uix/morfo/components/tree-view';
 
@@ -300,6 +308,27 @@ describe('createActiveUix (standalone)', () => {
 			expect(uix.langs.t('components.range-calendar.range-start')).toBe('inicio del rango');
 			expect(uix.langs.t('common.calendar.prev-month')).toBe('Mes anterior');
 			expect(uix.langs.t('common.calendar.year-select')).toBe('Seleccionar año');
+			registerMorfo(dateFieldMorfo);
+			registerMorfo(datePickerMorfo);
+			registerMorfo(dateRangeFieldMorfo);
+			registerMorfo(dateRangePickerMorfo);
+			registerMorfo(timeFieldMorfo);
+			registerMorfo(timePickerMorfo);
+			registerMorfo(timeRangeFieldMorfo);
+			registerMorfo(timeRangePickerMorfo);
+			expect(uix.langs.t('components.date-field.input')).toBe('Campo de fecha');
+			expect(uix.langs.t('components.date-picker.trigger')).toBe('Abrir calendario');
+			expect(uix.langs.t('components.date-range-field.separator')).toBe('hasta');
+			expect(uix.langs.t('components.date-range-picker.calendar')).toBe(
+				'Calendario de rango de fechas'
+			);
+			expect(uix.langs.t('components.time-field.input')).toBe('Campo de hora');
+			expect(uix.langs.t('components.time-picker.trigger')).toBe('Abrir selector de hora');
+			expect(uix.langs.t('components.time-range-field.start-label')).toBe('Hora inicial');
+			expect(uix.langs.t('components.time-range-picker.end-minute-slider')).toBe('Minuto final');
+			expect(uix.langs.t('common.date.year')).toBe('Año');
+			expect(uix.langs.t('common.time.minute')).toBe('Minuto');
+			expect(uix.langs.t('common.field.empty')).toBe('Vacío');
 		} finally {
 			uix.dispose();
 			_resetMorfoRegistryForTesting();

src/uix/langs.ts

@@ -25,6 +25,23 @@ export const commonLangs = {
 		'next-month': { es: 'Mes siguiente', en: 'Next month' },
 		'month-select': { es: 'Seleccionar mes', en: 'Select month' },
 		'year-select': { es: 'Seleccionar año', en: 'Select year' }
+	},
+	date: {
+		year: { es: 'Año', en: 'Year' },
+		month: { es: 'Mes', en: 'Month' },
+		day: { es: 'Día', en: 'Day' }
+	},
+	time: {
+		hour: { es: 'Hora', en: 'Hour' },
+		minute: { es: 'Minuto', en: 'Minute' },
+		second: { es: 'Segundo', en: 'Second' },
+		'day-period': { es: 'AM/PM', en: 'AM/PM' },
+		'time-zone': { es: 'Zona horaria', en: 'Time zone' },
+		am: { es: 'AM', en: 'AM' },
+		pm: { es: 'PM', en: 'PM' }
+	},
+	field: {
+		empty: { es: 'Vacío', en: 'Empty' }
 	}
 } satisfies LangNode;
 
@@ -55,69 +72,4 @@ export const componentLangs = {
 		},
 	},
 
-	'date-field': {
-		input: { es: 'Campo de fecha', en: 'Date field' },
-		year: { es: 'Año', en: 'Year' },
-		month: { es: 'Mes', en: 'Month' },
-		day: { es: 'Día', en: 'Day' },
-		hour: { es: 'Hora', en: 'Hour' },
-		minute: { es: 'Minuto', en: 'Minute' },
-		second: { es: 'Segundo', en: 'Second' },
-		'day-period': { es: 'AM/PM', en: 'AM/PM' },
-		'time-zone': { es: 'Zona horaria', en: 'Time zone' },
-		empty: { es: 'Vacío', en: 'Empty' },
-	},
-
-	'date-picker': {
-		trigger: { es: 'Abrir calendario', en: 'Open calendar' },
-		calendar: { es: 'Calendario de fecha', en: 'Date calendar' },
-	},
-
-	'date-range-field': {
-		start: { es: 'Fecha inicial', en: 'Start date' },
-		end: { es: 'Fecha final', en: 'End date' },
-		separator: { es: 'hasta', en: 'to' },
-	},
-
-	'date-range-picker': {
-		trigger: { es: 'Abrir calendario de rango', en: 'Open range calendar' },
-		calendar: { es: 'Calendario de rango de fechas', en: 'Date range calendar' },
-	},
-
-	'time-field': {
-		input: { es: 'Campo de hora', en: 'Time field' },
-		hour: { es: 'Hora', en: 'Hour' },
-		minute: { es: 'Minuto', en: 'Minute' },
-		second: { es: 'Segundo', en: 'Second' },
-		'day-period': { es: 'AM/PM', en: 'AM/PM' },
-		'time-zone': { es: 'Zona horaria', en: 'Time zone' },
-		empty: { es: 'Vacío', en: 'Empty' },
-	},
-
-	'time-picker': {
-		trigger: { es: 'Abrir selector de hora', en: 'Open time picker' },
-		'hour-slider': { es: 'Hora', en: 'Hour' },
-		'minute-slider': { es: 'Minuto', en: 'Minute' },
-		'second-slider': { es: 'Segundo', en: 'Second' },
-		am: { es: 'AM', en: 'AM' },
-		pm: { es: 'PM', en: 'PM' },
-	},
-
-	'time-range-field': {
-		'start-label': { es: 'Hora inicial', en: 'Start time' },
-		'end-label': { es: 'Hora final', en: 'End time' },
-	},
-
-	'time-range-picker': {
-		trigger: { es: 'Abrir selector de rango horario', en: 'Open time range picker' },
-		'start-hour-slider': { es: 'Hora inicial', en: 'Start hour' },
-		'end-hour-slider': { es: 'Hora final', en: 'End hour' },
-		'start-minute-slider': { es: 'Minuto inicial', en: 'Start minute' },
-		'end-minute-slider': { es: 'Minuto final', en: 'End minute' },
-		'start-second-slider': { es: 'Segundo inicial', en: 'Start second' },
-		'end-second-slider': { es: 'Segundo final', en: 'End second' },
-		am: { es: 'AM', en: 'AM' },
-		pm: { es: 'PM', en: 'PM' },
-	},
-
 } satisfies LangNode;

src/uix/morfo/components/date-field.ts

@@ -5,6 +5,9 @@ export const dateFieldMorfo = {
 	name: 'DateField',
 	kebab: 'date-field',
 	scope: ['soma'],
+	translations: {
+		input: { es: 'Campo de fecha', en: 'Date field' }
+	},
 	parts: [
 		{
 			name: 'Provider',

src/uix/morfo/components/date-picker.ts

@@ -5,6 +5,10 @@ export const datePickerMorfo = {
 	name: 'DatePicker',
 	kebab: 'date-picker',
 	scope: ['soma'],
+	translations: {
+		trigger: { es: 'Abrir calendario', en: 'Open calendar' },
+		calendar: { es: 'Calendario de fecha', en: 'Date calendar' }
+	},
 
 	focus: {
 		initial: 'first-focusable',
@@ -46,7 +50,7 @@ export const datePickerMorfo = {
 				},
 				{
 					attr: 'aria-label',
-					value: v.translationRef('#?components.date-picker.trigger|Choose date'),
+					value: v.translationRef('#?components.date-picker.trigger|Open calendar'),
 					severity: 'recommended'
 				}
 			]

src/uix/morfo/components/date-range-field.ts

@@ -5,6 +5,11 @@ export const dateRangeFieldMorfo = {
 	name: 'DateRangeField',
 	kebab: 'date-range-field',
 	scope: ['soma'],
+	translations: {
+		start: { es: 'Fecha inicial', en: 'Start date' },
+		end: { es: 'Fecha final', en: 'End date' },
+		separator: { es: 'hasta', en: 'to' }
+	},
 	parts: [
 		{
 			name: 'Provider',

src/uix/morfo/components/date-range-picker.ts

@@ -5,6 +5,10 @@ export const dateRangePickerMorfo = {
 	name: 'DateRangePicker',
 	kebab: 'date-range-picker',
 	scope: ['soma'],
+	translations: {
+		trigger: { es: 'Abrir calendario de rango', en: 'Open range calendar' },
+		calendar: { es: 'Calendario de rango de fechas', en: 'Date range calendar' }
+	},
 
 	focus: {
 		initial: 'first-focusable',
@@ -46,7 +50,7 @@ export const dateRangePickerMorfo = {
 				},
 				{
 					attr: 'aria-label',
-					value: v.translationRef('#?components.date-range-picker.trigger|Choose date range'),
+					value: v.translationRef('#?components.date-range-picker.trigger|Open range calendar'),
 					severity: 'recommended'
 				}
 			]

src/uix/morfo/components/time-field.ts

@@ -5,6 +5,9 @@ export const timeFieldMorfo = {
 	name: 'TimeField',
 	kebab: 'time-field',
 	scope: ['soma'],
+	translations: {
+		input: { es: 'Campo de hora', en: 'Time field' }
+	},
 	parts: [
 		{
 			name: 'Provider',

src/uix/morfo/components/time-picker.ts

@@ -5,6 +5,9 @@ export const timePickerMorfo = {
 	name: 'TimePicker',
 	kebab: 'time-picker',
 	scope: ['soma'],
+	translations: {
+		trigger: { es: 'Abrir selector de hora', en: 'Open time picker' }
+	},
 
 	focus: {
 		initial: 'first-focusable',
@@ -46,7 +49,7 @@ export const timePickerMorfo = {
 				},
 				{
 					attr: 'aria-label',
-					value: v.translationRef('#?components.time-picker.trigger|Choose time'),
+					value: v.translationRef('#?components.time-picker.trigger|Open time picker'),
 					severity: 'recommended'
 				}
 			]

src/uix/morfo/components/time-range-field.ts

@@ -5,6 +5,10 @@ export const timeRangeFieldMorfo = {
 	name: 'TimeRangeField',
 	kebab: 'time-range-field',
 	scope: ['soma'],
+	translations: {
+		'start-label': { es: 'Hora inicial', en: 'Start time' },
+		'end-label': { es: 'Hora final', en: 'End time' }
+	},
 	parts: [
 		{
 			name: 'Provider',

src/uix/morfo/components/time-range-picker.ts

@@ -5,6 +5,15 @@ export const timeRangePickerMorfo = {
 	name: 'TimeRangePicker',
 	kebab: 'time-range-picker',
 	scope: ['soma'],
+	translations: {
+		trigger: { es: 'Abrir selector de rango horario', en: 'Open time range picker' },
+		'start-hour-slider': { es: 'Hora inicial', en: 'Start hour' },
+		'end-hour-slider': { es: 'Hora final', en: 'End hour' },
+		'start-minute-slider': { es: 'Minuto inicial', en: 'Start minute' },
+		'end-minute-slider': { es: 'Minuto final', en: 'End minute' },
+		'start-second-slider': { es: 'Segundo inicial', en: 'Start second' },
+		'end-second-slider': { es: 'Segundo final', en: 'End second' }
+	},
 
 	focus: {
 		initial: 'first-focusable',
@@ -40,7 +49,7 @@ export const timeRangePickerMorfo = {
 				{ attr: 'aria-expanded', value: v.stateRef('open') },
 				{
 					attr: 'aria-label',
-					value: v.translationRef('#?components.time-range-picker.trigger|Choose time range'),
+					value: v.translationRef('#?components.time-range-picker.trigger|Open time range picker'),
 					severity: 'recommended'
 				}
 			]

src/uix/soma/components/date-field/langs.ts

@@ -1,13 +1,13 @@
 /** Idlangref constants for DateField. Values are inline fallbacks. */
 export const DATE_FIELD_LANGS = {
 	INPUT: '#?components.date-field.input|Date field',
-	YEAR: '#?components.date-field.year|Year',
+	YEAR: '#?common.date.year|Year',
-	MONTH: '#?components.date-field.month|Month',
+	MONTH: '#?common.date.month|Month',
-	DAY: '#?components.date-field.day|Day',
+	DAY: '#?common.date.day|Day',
-	HOUR: '#?components.date-field.hour|Hour',
+	HOUR: '#?common.time.hour|Hour',
-	MINUTE: '#?components.date-field.minute|Minute',
+	MINUTE: '#?common.time.minute|Minute',
-	SECOND: '#?components.date-field.second|Second',
+	SECOND: '#?common.time.second|Second',
-	DAY_PERIOD: '#?components.date-field.day-period|AM/PM',
+	DAY_PERIOD: '#?common.time.day-period|AM/PM',
-	TIME_ZONE: '#?components.date-field.time-zone|Time zone',
+	TIME_ZONE: '#?common.time.time-zone|Time zone',
-	EMPTY: '#?components.date-field.empty|Empty'
+	EMPTY: '#?common.field.empty|Empty'
 } as const;

src/uix/soma/components/time-field/langs.ts

@@ -1,10 +1,10 @@
 /** Idlangref constants for TimeField. */
 export const TIME_FIELD_LANGS = {
 	INPUT: '#?components.time-field.input|Time field',
-	HOUR: '#?components.time-field.hour|Hour',
+	HOUR: '#?common.time.hour|Hour',
-	MINUTE: '#?components.time-field.minute|Minute',
+	MINUTE: '#?common.time.minute|Minute',
-	SECOND: '#?components.time-field.second|Second',
+	SECOND: '#?common.time.second|Second',
-	DAY_PERIOD: '#?components.time-field.day-period|AM/PM',
+	DAY_PERIOD: '#?common.time.day-period|AM/PM',
-	TIME_ZONE: '#?components.time-field.time-zone|Time zone',
+	TIME_ZONE: '#?common.time.time-zone|Time zone',
-	EMPTY: '#?components.time-field.empty|Empty'
+	EMPTY: '#?common.field.empty|Empty'
 } as const;

src/uix/soma/components/time-picker/langs.ts

@@ -1,8 +1,8 @@
 export const TIME_PICKER_LANGS = {
 	TRIGGER: '#?components.time-picker.trigger|Open time picker',
-	HOUR_SLIDER: '#?components.time-picker.hour-slider|Hour',
+	HOUR_SLIDER: '#?common.time.hour|Hour',
-	MINUTE_SLIDER: '#?components.time-picker.minute-slider|Minute',
+	MINUTE_SLIDER: '#?common.time.minute|Minute',
-	SECOND_SLIDER: '#?components.time-picker.second-slider|Second',
+	SECOND_SLIDER: '#?common.time.second|Second',
-	AM: '#?components.time-picker.am|AM',
+	AM: '#?common.time.am|AM',
-	PM: '#?components.time-picker.pm|PM'
+	PM: '#?common.time.pm|PM'
 } as const;

src/uix/soma/components/time-range-picker/langs.ts

@@ -7,6 +7,6 @@ export const TIME_RANGE_PICKER_LANGS = {
 	END_MINUTE_SLIDER: '#?components.time-range-picker.end-minute-slider|End minute',
 	START_SECOND_SLIDER: '#?components.time-range-picker.start-second-slider|Start second',
 	END_SECOND_SLIDER: '#?components.time-range-picker.end-second-slider|End second',
-	AM: '#?components.time-range-picker.am|AM',
+	AM: '#?common.time.am|AM',
-	PM: '#?components.time-range-picker.pm|PM'
+	PM: '#?common.time.pm|PM'
 } as const;