jeremy's feedback

kobaltedev · Nov 19, 2024 · 50941a9 · 50941a9
1 parent 1b39d47
commit 50941a9
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 7 deletions.
diff --git a/packages/core/src/time-field/time-field-context.tsx b/packages/core/src/time-field/time-field-context.tsx
@@ -15,7 +15,8 @@ export interface TimeFieldContextValue {
 	granularity: Accessor<TimeFieldGranularity>;
 	hideTimeZone: Accessor<boolean>;
 	shouldForceLeadingZeros: Accessor<boolean>;
-	placeholderValue: Accessor<TimeValue>;
+	placeholderTime: Accessor<TimeValue>;
+	placeholderValue: Accessor<TimeValue | undefined>;
 	defaultTimeZone: Accessor<string | undefined>;
 	formattedValue: Accessor<string | undefined>;
 	isDisabled: Accessor<boolean>;

diff --git a/packages/core/src/time-field/time-field-field.tsx b/packages/core/src/time-field/time-field-field.tsx
@@ -100,13 +100,13 @@ export function TimeFieldField<T extends ValidComponent = "div">(
 	const { locale, direction } = useLocale();
 
 	const val = createMemo(
-		() => timeFieldContext.value() || timeFieldContext.placeholderValue(),
+		() => timeFieldContext.value() || timeFieldContext.placeholderTime(),
 	);
 
 	const [placeholderDate, setPlaceholderDate] = createSignal(
 		createPlaceholderDate(
 			val(),
-			timeFieldContext.placeholderValue(),
+			timeFieldContext.placeholderTime(),
 			timeFieldContext.defaultTimeZone(),
 		),
 	);
@@ -208,7 +208,11 @@ export function TimeFieldField<T extends ValidComponent = "div">(
 				const isPlaceholder =
 					isOriginallyEditable && !(validSegments() as any)[segment.type];
 				const placeholder = isOriginallyEditable
-					? getPlaceholder(segment.type, segment.value)
+					? getPlaceholder(
+							segment.type,
+							segment.value,
+							timeFieldContext.placeholderValue(),
+						)
 					: null;
 
 				return {
@@ -308,7 +312,7 @@ export function TimeFieldField<T extends ValidComponent = "div">(
 
 		const placeholder = createPlaceholderDate(
 			val(),
-			timeFieldContext.placeholderValue(),
+			timeFieldContext.placeholderTime(),
 			timeFieldContext.defaultTimeZone(),
 		);
 
@@ -557,10 +561,28 @@ function setSegmentBase(
 	}
 }
 
-export function getPlaceholder(field: string, value: string) {
+export function getPlaceholder(
+	field: string,
+	value: string,
+	placeholderValue?: TimeValue,
+) {
 	if (field === "dayPeriod") {
 		return value;
 	}
 
+	if (placeholderValue) {
+		if (placeholderValue.hour && field === "hour") {
+			return String(placeholderValue.hour);
+		}
+
+		if (placeholderValue.minute && field === "minute") {
+			return String(placeholderValue.minute);
+		}
+
+		if (placeholderValue.second && field === "second") {
+			return String(placeholderValue.second);
+		}
+	}
+
 	return "––";
 }
diff --git a/packages/core/src/time-field/time-field-root.tsx b/packages/core/src/time-field/time-field-root.tsx
@@ -291,7 +291,8 @@ export function TimeFieldRoot<T extends ValidComponent = "div">(
 		granularity,
 		hideTimeZone: () => local.hideTimeZone ?? false,
 		shouldForceLeadingZeros: () => local.shouldForceLeadingZeros ?? false,
-		placeholderValue: () => value() || (local.placeholderValue ?? new Time()),
+		placeholderTime: () => value() || (local.placeholderValue ?? new Time()),
+		placeholderValue: () => local.placeholderValue,
 		defaultTimeZone,
 		formattedValue,
 		focusManager: () => focusManager,