RN 42082

user-guide/Advanced_Modules/Dashboards_and_Low_Code_Apps/Visualizations/Available_visualizations/Basic_controls/Timerange.md

@@ -4,18 +4,30 @@ uid: TimeRange
 
 # Time range
 
-The time range component allows you to specify a time range, which can then be used as a filter for compatible components such as the [line & area chart](xref:LineAndAreaChart). You can either select a **quick pick button** or a **preset**, or manually set a **custom time range**.
-
-When you modify the time range in this component, the data displayed in any linked component is updated accordingly. For example, selecting the *Last 24 hours* preset will display data for the last 24 hours and update the filtered components to match that time range.
+The time range component allows you to specify a time range, which can then be used as a filter for compatible components such as the [line & area chart](xref:LineAndAreaChart). You can either select a **preset** or a **quick pick button**, or manually set a **custom time range**. When you modify the time range in this component, the data displayed in any linked component is updated accordingly.
 
 > [!NOTE]
->
-> - Prior to DataMiner 10.4.0 [CU12]/10.5.3<!--RN 41934-->, this component is available under *General*.
-> - Prior to DataMiner 10.4.0 [CU12]/10.5.3<!--RN 42082-->, if you use a sliding window preset like *Last 24 hours* and filter another component, the data will dynamically update. As a result, the time range shown in the time range component may not match the one used in the linked component, unless the *Allow refresh* setting is enabled and the refresh rate is set to at least once per minute.
-> - From DataMiner 10.3.0 [CU20]/10.4.0 [CU8]/10.4.11 onwards<!--RN 40622-->, when you set a custom time range, the data of the component is only updated after you click the *Apply* button. If you have not yet clicked this button, you can revert any changes to the custom time range by clicking *Cancel*. In previous versions, changing the custom time range automatically updates the component data.
+> Prior to DataMiner 10.4.0 [CU12]/10.5.3<!--RN 41934-->, this component is available under *General*.
 
 ![Time range](~/user-guide/images/Time_Range.png)<br>*Time range component in DataMiner 10.5.3*
 
+- Presets (1): Presets are predefined time selections that allow you to quickly adjust the displayed time range without manually specifying start and end times. Examples include *Last 2 days*, *Last 5 minutes*, and *Last year*. You can access a list of presets by clicking the ![Calendar](~/user-guide/images/Calendar_Icon.png) icon or the ![Clock](~/user-guide/images/Clock_Icon.png) icon (depending on your DataMiner version<!--RN 42082-->). From DataMiner 10.4.0 [CU12]/10.5.3 onwards<!--RN 42082-->, you can filter this list using the search box.
+
+  > [!NOTE]
+  > Prior to DataMiner 10.4.0 [CU12]/10.5.3<!--RN 42082-->, if you use a sliding window preset like *Last 15 minutes* and filter another component, the data will dynamically update. As a result, the time range shown in the time range component may not match the one used in the linked component, unless the *Allow refresh* setting is enabled and the refresh rate is set to at least once per minute.
+
+- Quick picks (2): Quick pick buttons are presets that can be added as fixed buttons to the time range component for quick access to frequently used time ranges. You can enable the *Use quick picks* option in the *Layout* pane, where you can also configure which buttons to include.
+
+- Custom time range (3): You can manually set a custom time range by specifying a start and end time. If the *Pinning as quick pick* option is enabled in the *Layout* pane, you can save the time selection as a custom quick pick button.
+
+  - From DataMiner 10.4.0 [CU12]/10.5.3 onwards<!--RN 42082-->, you can either enter a custom start and end time in the text box (in `DD/MM/YYYY HH:MM` format) or click the ![Calendar](~/user-guide/images/Calendar_Icon.png) icon to open the *Calendar* pane, where you can select the start and end time using the calendar interface.
+
+  - Prior to DataMiner 10.4.0 [CU12]/10.5.3, click the ![Clock](~/user-guide/images/Clock_Icon.png) icon and specify the start and end time manually.
+
+When you select a preset or quick pick, the time range will be updated immediately. If the time range is used as a filter, the component data will also update immediately. When you set a custom time range, the data will only be updated after clicking the *Apply* button. If you have not yet clicked this button, you can revert any changes by clicking *Cancel*. Prior to DataMiner 10.3.0 [CU20]/10.4.0 [CU8]/10.4.11<!--RN 40622-->, the data is updated immediately after the custom time range is changed.
+
+![Options time range component](~/user-guide/images/Time_Range2.png)<br>*Time range component in DataMiner 10.5.3*
+
 ## Configuring the component
 
 To configure the component:
@@ -32,13 +44,36 @@ To configure the component:
 
      Prior to DataMiner 10.4.0 [CU12]/10.5.3<!--RN 42082-->, if you are using a sliding window preset and filtering another component with it, the refresh rate should be set between 5 to 60 seconds to prevent any mismatch between the time range displayed and the actual time range used in the filtered component.
 
+   - *Granularity*: Available from DataMiner 10.4.0 [CU12]/10.5.3 onwards<!--RN 42082-->. Determines the level of detail required when setting a time range:
+
+     - *Date & time*: Both dates and times must be specified for the start and end times, e.g. `05/02/2025 12:05 to 06/02/2025 13:15`. The start and end times cannot be identical. This is the default setting.
+
+     - *Date*: Only the dates must be specified for the start and end times, e.g. `05/02/2025 to 06/02/2025`. If the same date  is entered for both the start and end time, the time range will cover the full 24 hours (from midnight to midnight).
+
+   - *Emit value on*: Available from DataMiner 10.4.0 [CU12]/10.5.3 onwards<!--RN 42082-->. Determines when the time range entered in the text box becomes available as data. This can be when the user presses Enter ("Enter"), when the focus is no longer on the box ("Focus lost"), or when the value in the box changes ("Value change"). If you select *Focus lost*, the value will also become available when the user presses Enter.
+
+   - *Edit using*: Available from DataMiner 10.4.0 [CU12]/10.5.3 onwards<!--RN 42082-->. Determines how the time range can be modified:
+
+     - *Keyboard & calendar*: Allows you to enter a custom time range manually in the text box (format: `DD/MM/YYYY HH:MM`) or select one using the calender interface, which you can access by clicking the ![Calendar](~/user-guide/images/Calendar_Icon.png) icon.
+
+     - *Calendar*: Allows you to set a custom time range only by clicking the ![Calendar](~/user-guide/images/Calendar_Icon.png) icon and selecting the dates in the calendar interface.
+
+       > [!NOTE]
+       > If your dashboard or low-code app contains time range components created before upgrading to DataMiner 10.4.0 [CU12]/10.5.3, they will default to *Calendar* to maintain the previous behavior of the component.
+
 1. Optionally, fine-tune the component layout. In the *Component* > *Layout* pane, the following options are available:
 
    - The default options available for all components. See [Customizing the component layout](xref:Customize_Component_Layout).
 
-   - *Layout & Alignment* > *Horizontal alignment*: Determines the horizontal alignment of the quick picks (left, center, or right).
+   - *Layout & Alignment* > *Quick pick alignment*: Determines the horizontal alignment of the quick picks (left, center, right, or justify).
+
+     > [!NOTE]
+     > Prior to DataMiner 10.4.0 [CU12]/10.5.3<!--RN 42082-->, this setting is called *Horizontal alignment* instead, and only *left*, *center*, and *right* are available.
 
-   - *Layout & Alignment* > *Align current time position*: Determines the horizontal alignment of the current time range (left, center, or right). This option is only visible when the *Show current range* setting is enabled.
+   - *Layout & Alignment* > *Input alignment*: Determines the horizontal alignment of the current time range (left, center, or right). This option is only visible when the *Show current range* setting is enabled.
+
+     > [!NOTE]
+     > Prior to DataMiner 10.4.0 [CU12]/10.5.3<!--RN 42082-->, this setting is called *Align current time position* instead.
 
    - *Show refresh timer*: Determines whether an indication is displayed that the data will be refreshed.