Use ha-dialog-header for data-entry-flow (#25403)

* Use ha-dialog-header for data-entry-flow header

* Fix header wrap

src/dialogs/config-flow/show-dialog-data-entry-flow.ts

@@ -31,10 +31,12 @@ export interface FlowConfig {
 
   deleteFlow(hass: HomeAssistant, flowId: string): Promise<unknown>;
 
-  renderAbortHeader?(
+  renderAbortHeader?(hass: HomeAssistant, step: DataEntryFlowStepAbort): string;
+
+  renderAbortSubheader?(
     hass: HomeAssistant,
     step: DataEntryFlowStepAbort
-  ): TemplateResult | string;
+  ): string | TemplateResult;
 
   renderAbortDescription(
     hass: HomeAssistant,
@@ -44,6 +46,11 @@ export interface FlowConfig {
   renderShowFormStepHeader(
     hass: HomeAssistant,
     step: DataEntryFlowStepForm
+  ): string;
+
+  renderShowFormStepSubheader?(
+    hass: HomeAssistant,
+    step: DataEntryFlowStepForm
   ): string | TemplateResult;
 
   renderShowFormStepDescription(
@@ -100,6 +107,11 @@ export interface FlowConfig {
   renderShowFormProgressHeader(
     hass: HomeAssistant,
     step: DataEntryFlowStepProgress
+  ): string;
+
+  renderShowFormProgressSubheader?(
+    hass: HomeAssistant,
+    step: DataEntryFlowStepProgress
   ): string | TemplateResult;
 
   renderShowFormProgressDescription(
@@ -107,7 +119,9 @@ export interface FlowConfig {
     step: DataEntryFlowStepProgress
   ): TemplateResult | "";
 
-  renderMenuHeader(
+  renderMenuHeader(hass: HomeAssistant, step: DataEntryFlowStepMenu): string;
+
+  renderMenuSubheader?(
     hass: HomeAssistant,
     step: DataEntryFlowStepMenu
   ): string | TemplateResult;