@sapudex/web-components 0.173.0 → 0.184.0

package/dist/generated/themes/overrides/@ui5/webcomponents/sap_glow/parameters-bundle.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"parameters-bundle.css.js","sourceRoot":"","sources":["../../../../../../../src/generated/themes/overrides/@ui5/webcomponents/sap_glow/parameters-bundle.css.ts"],"names":[],"mappings":"AAEA,MAAM,SAAS,GAAc,EAAC,WAAW,EAAC,yBAAyB,EAAC,QAAQ,EAAC,uEAAuE,EAAC,OAAO,EAAC;CAC5J,EAAC,CAAC;AACH,eAAe,SAAS,CAAC","sourcesContent":["import type { StyleData } from \"@ui5/webcomponents-base/dist/types.js\";\n\nconst styleData: StyleData = {packageName:\"@sapudex/web-components\",fileName:\"themes/overrides/@ui5/webcomponents/sap_glow/parameters-bundle.css.ts\",content:`:root{--browser_scrollbar_border_radius: var(--udexRadiusM, 8px);--_ui5-v1-24-17_popup_header_font_family: var(--sapFontFamily);--_ui5-v1-24-17_popup_header_font_weight: var(--udexTypographyFontWeightRegular);--_ui5-v1-24-17_checkbox_inner_background: var(--sapBackgroundColor);--_ui5-v1-24-17_checkbox_inner_border: var(--sapElement_BorderWidth) solid var(--sapField_BorderColor);--_ui5-v1-24-17_checkbox_inner_selected_border_color: var(--sapField_BorderColor);--_ui5-v1-24-17_checkbox_checkmark_color: var(--udexColorBlue7);--_ui5-v1-24-17_checkbox_inner_hover_checked_border_color: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-17_checkbox_inner_hover_border_color: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-17_checkbox_hover_background: var(--sapInformationBackground, #EBF8FF);--_ui5-v1-24-17_checkbox_inner_active_border_color: var(--sapSelectedColor);--_ui5-v1-24-17_checkbox_label_color: var(--sapField_TextColor);--_ui5-v1-24-17_checkbox_inner_disabled_border_color: var(--sapField_BorderColor);--_ui5-v1-24-17_checkbox_disabled_label_color: var(--sapField_TextColor);--_ui5-v1-24-17_checkbox_inner_width_height: 24px;--_ui5-v1-24-17_checkbox_width_height: 42px;--_ui5-v1-24-17_checkbox_icon_size: 16px;--_ui5-v1-24-17_checkbox_partially_icon_size: 16px;--_ui5-v1-24-17_checkbox_inner_border_radius: 4px;--_ui5-v1-24-17_checkbox_disabled_opacity: var(--sapContent_DisabledOpacity);--_ui5-v1-24-17_checkbox_inner_readonly_border: var(--sapElement_BorderWidth) var(--sapField_ReadOnly_BorderColor) dashed;--_ui5-v1-24-17_checkbox_inner_success_border: var(--sapField_SuccessBorderWidth) solid var(--udexCoreSemanticSuccess6);--_ui5-v1-24-17_checkbox_inner_success_background_hover: var(--sapSuccessBackground, #F5FAE5);--_ui5-v1-24-17_checkbox_inner_error_border: var(--sapField_InvalidBorderWidth) solid var(--udexCoreSemanticError5);--_ui5-v1-24-17_checkbox_inner_error_background_hover: var(--sapErrorBackground, #FFEAF4);--_ui5-v1-24-17_checkbox_label_offset: .563rem;--_ui5-v1-24-17_checkbox_right_focus_distance: var(--udexSpacer8);--_ui5-v1-24-17_radio_button_outer_ring_bg: var(--sapField_Background, #ffffff);--_ui5-v1-24-17_radio_button_inner_size: 24px;--_ui5-v1-24-17_radio_button_checked_fill: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-17_radio_button_height: 42px;--_ui5-v1-24-17_radio_button_svg_size: 24px;--_ui5-v1-24-17_radio_button_inner_ring_radius: 25%;--_ui5-v1-24-17_radio_button_outer_ring_padding_with_label: 9px 11px 9px 9px;--_ui5-v1-24-17_radio_button_outer_ring_padding: 9px;--_ui5-v1-24-17_radio_button_label_offset: 0;--_ui5-v1-24-17_radio_button_hover_fill: #EBF8FF;--_ui5-v1-24-17_radio_button_outer_ring_checked_color: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-17_radio_button_outer_ring_checked_hover_color: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-17_radio_button_outer_ring_color: var(--sapField_BorderColor, #5b738b);--_ui5-v1-24-17_radio_button_outer_ring_hover_color: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-17_radio_button_inner_ring_color: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-17_radio_button_read_only_inner_ring_color: var(--sapField_ReadOnly_BorderColor, #5B738B);--_ui5-v1-24-17_radio_button_hover_fill_success: var(--sapSuccessBackground, #F5FAE5);--_ui5-v1-24-17_radio_button_hover_fill_error: var(--sapErrorBackground, #FFEAF4);--_ui5-v1-24-17_link_focus_background_color: transparent;--_ui5-v1-24-17_link_focus_color: var(--sapLinkColor);--_ui5-v1-24-17_link_focus_text_decoration: underline;--_ui5-v1-24-17_link_focused_hover_text_color: var(--sapLink_Hover_Color);--_ui5-v1-24-17_link_focused_hover_text_decoration: underline;--_ui5-v1-24-17_progress_indicator_bar_border_radius: 6px;--_ui5-v1-24-17_progress_indicator_root_height: .5rem;--_ui5-v1-24-17_progress_indicator_bar_height: .75rem;--_ui5-v1-24-17_progress_indicator_icon_size: 1.125rem;--_ui5-v1-24-17_progress_indicator_icon_right_position: -24px;--_ui5-v1-24-17_progress_indicator_padding_end: 24px;--_ui5-v1-24-17_toast_vertical_offset: 2.5rem;--_ui5-v1-24-17_toast_background: var(--udexColorNeutralWhite);--_ui5-v1-24-17_toast_shadow: var(--sapContent_Shadow2);--_ui5-v1-24-17_popover_box_shadow: 0px 0px 0px 1px var(--udexColorGrey4);--_ui5-v1-24-17_message_strip_padding_inline_no_icon: var(--udexSpacer12, 12px);--_ui5-v1-24-17_message_strip_padding_block_no_icon: var(--udexSpacer8, 8px);--_ui5-v1-24-17_message_strip_padding: var(--udexSpacer8, 8px) 36px;--_ui5-v1-24-17_message_strip_icon_top:calc(50% - 8px);--_ui5-v1-24-17_daypicker_daynames_container_height: 42px;--_ui5-v1-24-17_daypicker_dayname_color: var(--udexColorGrey6, #5B738B);--_ui5-v1-24-17_daypicker_weekname_color: var(--udexColorGrey6, #5B738B);--_ui5-v1-24-17_daypicker_item_now_border_color: var(--udexColorPink8, #A100C2);--_ui5-v1-24-17_daypicker_item_weeekend_filter: none;--_ui5-v1-24-17_daypicker_item_select_between_border: 1px solid var(--udexColorBlue9, #0040B0);--_ui5-v1-24-17_calendar_header_middle_button_focus_outline: 1px solid var(--udexColorBlue9, #0040B0);--_ui5-v1-24-17_calendar_header_arrow_button_box_shadow: none;--ui5-v1-24-17_carousel_active_dot_background: var(--udexColorBlue9);--_ui5-v1-24-17_tokenizer_padding: var(--udexSpacer12, 12px);--_ui5-v1-24-17_slider_handle_icon_size: var(--udexSpacer20, 1.25rem);--_ui5-v1-24-17_slider_handle_width: 2.75rem;--_ui5-v1-24-17_slider_handle_height: var(--udexSpacer32, 2rem);--_ui5-v1-24-17_slider_handle_top: -.875rem;--_ui5-v1-24-17_slider_label_color: var(--sapContent_MeasureIndicatorColor, #5b738b);--_ui5-v1-24-17_range_slider_progress_focus_top: -1.18rem;--_ui5-v1-24-17_slider_progress_after_background: var(--sapContent_MeasureIndicatorColor, #5b738b);--_ui5-v1-24-17_slider_tickmark_bg: var(--sapContent_MeasureIndicatorColor, #5b738b);--_ui5-v1-24-17_slider_tickmark_in_range_bg: var(--sapSlider_Selected_BorderColor, #0070f2);--_ui5-v1-24-17_slider_start_end_point_left: -.875rem;--_ui5-v1-24-17_slider_tooltip_bottom: 2.5rem;--_ui5-v1-24-17_slider_tooltip_border: 1px solid var(--sapField_BorderColor, #5B738B);--_ui5-v1-24-17_slider_tooltip_border_radius: var(--udexSpacer4, .25rem);--_ui5-v1-24-17_slider_tooltip_color: var(--sapContent_MeasureIndicatorColor, #5b738b);--_ui5-v1-24-17_slider_tooltip_fontsize: var(--udexTypographyNavigationRegularMFontSize, 14px);--_ui5-v1-24-17_slider_tooltip_height: var(--udexSpacer32, 2rem);--_ui5-v1-24-17_slider_tooltip_min_width: 2.75rem;--_ui5-v1-24-17_slider_handle_focus_border: 2px solid var(--sapSlider_Active_HandleBorderColor)}udex-phone-number-field{--_ui5-v1-24-17_button_border_radius: var(--udexRadiusXS)}udex-search,udex-password-field,udex-select-box,udex-filter-menu,udex-country-selector{--_ui5-v1-24-17_button_pressed_focused_border_color: transparent}udex-password-field{--_ui5-v1-24-17_icon_transform_scale: none}.sapUiSizeCompact,.ui5-content-density-compact,[data-ui5-compact-size]{--_ui5-v1-24-17_button_base_height: 3rem;--_ui5-v1-24-17_button_base_padding: 3rem;--_ui5-v1-24-17_checkbox_inner_width_height: 24px;--_ui5-v1-24-17_checkbox_width_height: 42px;--_ui5-v1-24-17_checkbox_icon_size: 16px;--_ui5-v1-24-17_checkbox_partially_icon_size: 16px;--_ui5-v1-24-17_radio_button_min_width: 42px;--_ui5-v1-24-17_radio_button_outer_ring_padding: 9px;--_ui5-v1-24-17_radio_button_inner_size: 24px;--_ui5-v1-24-17_radio_button_height: 42px;--_ui5-v1-24-17_radio_button_svg_size: 24px;--_ui5-v1-24-17_radio_button_inner_ring_radius: 25%;--_ui5-v1-24-17_radio_button_outer_ring_padding_with_label: 9px 11px 9px 9px;--_ui5-v1-24-17_radio_button_label_offset: 0;--_ui5-v1-24-17_progress_indicator_bar_border_radius: 6px;--_ui5-v1-24-17_progress_indicator_root_height: .5rem;--_ui5-v1-24-17_progress_indicator_bar_height: .75rem;--_ui5-v1-24-17_progress_indicator_icon_size: 1.125rem;--_ui5-v1-24-17_progress_indicator_icon_right_position: -24px;--_ui5-v1-24-17_progress_indicator_padding_end: 24px;--_ui5-v1-24-17_toast_vertical_offset: 2.5rem;--_ui5-v1-24-17_tc_item_text_line_height: 1.25rem;--_ui5-v1-24-17_calendar_top_bottom_padding: var(--udexSpacer8, 8px);--_ui5-v1-24-17_calendar_left_right_padding: var(--udexSpacer8, 8px);--_ui5-v1-24-17_day_picker_item_width: 42px;--_ui5-v1-24-17_day_picker_item_height: 42px;--_ui5-v1-24-17_calendar_width: 371px;--_ui5-v1-24-17_calendar_height: auto;--_ui5-v1-24-17_calendar_header_height: 42px;--_ui5-v1-24-17_calendar_header_arrow_button_width: 42px;--_ui5-v1-24-17_month_picker_item_height: 36px;--_ui5-v1-24-17_monthpicker_item_margin: -8px 0 var(--udexSpacer16, 16px) 0;--_ui5-v1-24-17_year_picker_item_height: 36px;--_ui5-v1-24-17_yearpicker_item_margin: -8px 0 var(--udexSpacer16, 16px) 0;--_ui5-v1-24-17_slider_handle_icon_size: var(--udexSpacer20, 1.25rem);--_ui5-v1-24-17_slider_handle_width: 2.75rem;--_ui5-v1-24-17_slider_handle_height: var(--udexSpacer32, 2rem);--_ui5-v1-24-17_slider_handle_top: -.875rem;--_ui5-v1-24-17_range_slider_progress_focus_top: -1.18rem;--_ui5-v1-24-17_slider_start_end_point_left: -.875rem;--_ui5-v1-24-17_slider_tooltip_bottom: 2.5rem;--_ui5-v1-24-17_slider_tooltip_border_radius: var(--udexSpacer4, .25rem);--_ui5-v1-24-17_slider_tooltip_height: var(--udexSpacer32, 2rem);--_ui5-v1-24-17_slider_tooltip_min_width: 2.75rem;--_ui5-v1-24-17_slider_handle_focus_border: 2px solid var(--sapSlider_Active_HandleBorderColor)}\n`};\nexport default styleData;\n\t"]}
+{"version":3,"file":"parameters-bundle.css.js","sourceRoot":"","sources":["../../../../../../../src/generated/themes/overrides/@ui5/webcomponents/sap_glow/parameters-bundle.css.ts"],"names":[],"mappings":"AAEA,MAAM,SAAS,GAAc,EAAC,WAAW,EAAC,yBAAyB,EAAC,QAAQ,EAAC,uEAAuE,EAAC,OAAO,EAAC;CAC5J,EAAC,CAAC;AACH,eAAe,SAAS,CAAC","sourcesContent":["import type { StyleData } from \"@ui5/webcomponents-base/dist/types.js\";\n\nconst styleData: StyleData = {packageName:\"@sapudex/web-components\",fileName:\"themes/overrides/@ui5/webcomponents/sap_glow/parameters-bundle.css.ts\",content:`:root{--browser_scrollbar_border_radius: var(--udexRadiusM, 8px);--_ui5-v1-24-20_popup_header_font_family: var(--sapFontFamily);--_ui5-v1-24-20_popup_header_font_weight: var(--udexTypographyFontWeightRegular);--_ui5-v1-24-20_checkbox_inner_background: var(--sapBackgroundColor);--_ui5-v1-24-20_checkbox_inner_border: var(--sapElement_BorderWidth) solid var(--sapField_BorderColor);--_ui5-v1-24-20_checkbox_inner_selected_border_color: var(--sapField_BorderColor);--_ui5-v1-24-20_checkbox_checkmark_color: var(--udexColorBlue7);--_ui5-v1-24-20_checkbox_inner_hover_checked_border_color: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-20_checkbox_inner_hover_border_color: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-20_checkbox_hover_background: var(--sapInformationBackground, #EBF8FF);--_ui5-v1-24-20_checkbox_inner_active_border_color: var(--sapSelectedColor);--_ui5-v1-24-20_checkbox_label_color: var(--sapField_TextColor);--_ui5-v1-24-20_checkbox_inner_disabled_border_color: var(--sapField_BorderColor);--_ui5-v1-24-20_checkbox_disabled_label_color: var(--sapField_TextColor);--_ui5-v1-24-20_checkbox_inner_width_height: 24px;--_ui5-v1-24-20_checkbox_width_height: 42px;--_ui5-v1-24-20_checkbox_icon_size: 16px;--_ui5-v1-24-20_checkbox_partially_icon_size: 16px;--_ui5-v1-24-20_checkbox_inner_border_radius: 4px;--_ui5-v1-24-20_checkbox_disabled_opacity: var(--sapContent_DisabledOpacity);--_ui5-v1-24-20_checkbox_inner_readonly_border: var(--sapElement_BorderWidth) var(--sapField_ReadOnly_BorderColor) dashed;--_ui5-v1-24-20_checkbox_inner_success_border: var(--sapField_SuccessBorderWidth) solid var(--udexCoreSemanticSuccess6);--_ui5-v1-24-20_checkbox_inner_success_background_hover: var(--sapSuccessBackground, #F5FAE5);--_ui5-v1-24-20_checkbox_inner_error_border: var(--sapField_InvalidBorderWidth) solid var(--udexCoreSemanticError5);--_ui5-v1-24-20_checkbox_inner_error_background_hover: var(--sapErrorBackground, #FFEAF4);--_ui5-v1-24-20_checkbox_label_offset: .563rem;--_ui5-v1-24-20_checkbox_right_focus_distance: var(--udexSpacer8);--_ui5-v1-24-20_radio_button_outer_ring_bg: var(--sapField_Background, #ffffff);--_ui5-v1-24-20_radio_button_inner_size: 24px;--_ui5-v1-24-20_radio_button_checked_fill: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-20_radio_button_height: 42px;--_ui5-v1-24-20_radio_button_svg_size: 24px;--_ui5-v1-24-20_radio_button_inner_ring_radius: 25%;--_ui5-v1-24-20_radio_button_outer_ring_padding_with_label: 9px 11px 9px 9px;--_ui5-v1-24-20_radio_button_outer_ring_padding: 9px;--_ui5-v1-24-20_radio_button_label_offset: 0;--_ui5-v1-24-20_radio_button_hover_fill: #EBF8FF;--_ui5-v1-24-20_radio_button_outer_ring_checked_color: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-20_radio_button_outer_ring_checked_hover_color: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-20_radio_button_outer_ring_color: var(--sapField_BorderColor, #5b738b);--_ui5-v1-24-20_radio_button_outer_ring_hover_color: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-20_radio_button_inner_ring_color: var(--sapContent_Selected_ForegroundColor, #0070f2);--_ui5-v1-24-20_radio_button_read_only_inner_ring_color: var(--sapField_ReadOnly_BorderColor, #5B738B);--_ui5-v1-24-20_radio_button_hover_fill_success: var(--sapSuccessBackground, #F5FAE5);--_ui5-v1-24-20_radio_button_hover_fill_error: var(--sapErrorBackground, #FFEAF4);--_ui5-v1-24-20_link_focus_background_color: transparent;--_ui5-v1-24-20_link_focus_color: var(--sapLinkColor);--_ui5-v1-24-20_link_focus_text_decoration: underline;--_ui5-v1-24-20_link_focused_hover_text_color: var(--sapLink_Hover_Color);--_ui5-v1-24-20_link_focused_hover_text_decoration: underline;--_ui5-v1-24-20_progress_indicator_bar_border_radius: 6px;--_ui5-v1-24-20_progress_indicator_root_height: .5rem;--_ui5-v1-24-20_progress_indicator_bar_height: .75rem;--_ui5-v1-24-20_progress_indicator_icon_size: 1.125rem;--_ui5-v1-24-20_progress_indicator_icon_right_position: -24px;--_ui5-v1-24-20_progress_indicator_padding_end: 24px;--_ui5-v1-24-20_toast_vertical_offset: 2.5rem;--_ui5-v1-24-20_toast_background: var(--udexColorNeutralWhite);--_ui5-v1-24-20_toast_shadow: var(--sapContent_Shadow2);--_ui5-v1-24-20_popover_box_shadow: 0px 0px 0px 1px var(--udexColorGrey4);--_ui5-v1-24-20_message_strip_padding_inline_no_icon: var(--udexSpacer12, 12px);--_ui5-v1-24-20_message_strip_padding_block_no_icon: var(--udexSpacer8, 8px);--_ui5-v1-24-20_message_strip_padding: var(--udexSpacer8, 8px) 36px;--_ui5-v1-24-20_message_strip_icon_top:calc(50% - 8px);--_ui5-v1-24-20_daypicker_daynames_container_height: 42px;--_ui5-v1-24-20_daypicker_dayname_color: var(--udexColorGrey6, #5B738B);--_ui5-v1-24-20_daypicker_weekname_color: var(--udexColorGrey6, #5B738B);--_ui5-v1-24-20_daypicker_item_now_border_color: var(--udexColorPink8, #A100C2);--_ui5-v1-24-20_daypicker_item_weeekend_filter: none;--_ui5-v1-24-20_daypicker_item_select_between_border: 1px solid var(--udexColorBlue9, #0040B0);--_ui5-v1-24-20_calendar_header_middle_button_focus_outline: 1px solid var(--udexColorBlue9, #0040B0);--_ui5-v1-24-20_calendar_header_arrow_button_box_shadow: none;--ui5-v1-24-20_carousel_active_dot_background: var(--udexColorBlue9);--_ui5-v1-24-20_tokenizer_padding: var(--udexSpacer12, 12px);--_ui5-v1-24-20_slider_handle_icon_size: var(--udexSpacer20, 1.25rem);--_ui5-v1-24-20_slider_handle_width: 2.75rem;--_ui5-v1-24-20_slider_handle_height: var(--udexSpacer32, 2rem);--_ui5-v1-24-20_slider_handle_top: -.875rem;--_ui5-v1-24-20_slider_label_color: var(--sapContent_MeasureIndicatorColor, #5b738b);--_ui5-v1-24-20_range_slider_progress_focus_top: -1.18rem;--_ui5-v1-24-20_slider_progress_after_background: var(--sapContent_MeasureIndicatorColor, #5b738b);--_ui5-v1-24-20_slider_tickmark_bg: var(--sapContent_MeasureIndicatorColor, #5b738b);--_ui5-v1-24-20_slider_tickmark_in_range_bg: var(--sapSlider_Selected_BorderColor, #0070f2);--_ui5-v1-24-20_slider_start_end_point_left: -.875rem;--_ui5-v1-24-20_slider_tooltip_bottom: 2.5rem;--_ui5-v1-24-20_slider_tooltip_border: 1px solid var(--sapField_BorderColor, #5B738B);--_ui5-v1-24-20_slider_tooltip_border_radius: var(--udexSpacer4, .25rem);--_ui5-v1-24-20_slider_tooltip_color: var(--sapContent_MeasureIndicatorColor, #5b738b);--_ui5-v1-24-20_slider_tooltip_fontsize: var(--udexTypographyNavigationRegularMFontSize, 14px);--_ui5-v1-24-20_slider_tooltip_height: var(--udexSpacer32, 2rem);--_ui5-v1-24-20_slider_tooltip_min_width: 2.75rem;--_ui5-v1-24-20_slider_handle_focus_border: 2px solid var(--sapSlider_Active_HandleBorderColor)}udex-phone-number-field{--_ui5-v1-24-20_button_border_radius: var(--udexRadiusXS)}udex-search,udex-password-field,udex-select-box,udex-filter-menu,udex-country-selector{--_ui5-v1-24-20_button_pressed_focused_border_color: transparent}udex-password-field{--_ui5-v1-24-20_icon_transform_scale: none}.sapUiSizeCompact,.ui5-content-density-compact,[data-ui5-compact-size]{--_ui5-v1-24-20_button_base_height: 3rem;--_ui5-v1-24-20_button_base_padding: 3rem;--_ui5-v1-24-20_checkbox_inner_width_height: 24px;--_ui5-v1-24-20_checkbox_width_height: 42px;--_ui5-v1-24-20_checkbox_icon_size: 16px;--_ui5-v1-24-20_checkbox_partially_icon_size: 16px;--_ui5-v1-24-20_radio_button_min_width: 42px;--_ui5-v1-24-20_radio_button_outer_ring_padding: 9px;--_ui5-v1-24-20_radio_button_inner_size: 24px;--_ui5-v1-24-20_radio_button_height: 42px;--_ui5-v1-24-20_radio_button_svg_size: 24px;--_ui5-v1-24-20_radio_button_inner_ring_radius: 25%;--_ui5-v1-24-20_radio_button_outer_ring_padding_with_label: 9px 11px 9px 9px;--_ui5-v1-24-20_radio_button_label_offset: 0;--_ui5-v1-24-20_progress_indicator_bar_border_radius: 6px;--_ui5-v1-24-20_progress_indicator_root_height: .5rem;--_ui5-v1-24-20_progress_indicator_bar_height: .75rem;--_ui5-v1-24-20_progress_indicator_icon_size: 1.125rem;--_ui5-v1-24-20_progress_indicator_icon_right_position: -24px;--_ui5-v1-24-20_progress_indicator_padding_end: 24px;--_ui5-v1-24-20_toast_vertical_offset: 2.5rem;--_ui5-v1-24-20_tc_item_text_line_height: 1.25rem;--_ui5-v1-24-20_calendar_top_bottom_padding: var(--udexSpacer8, 8px);--_ui5-v1-24-20_calendar_left_right_padding: var(--udexSpacer8, 8px);--_ui5-v1-24-20_day_picker_item_width: 42px;--_ui5-v1-24-20_day_picker_item_height: 42px;--_ui5-v1-24-20_calendar_width: 371px;--_ui5-v1-24-20_calendar_height: auto;--_ui5-v1-24-20_calendar_header_height: 42px;--_ui5-v1-24-20_calendar_header_arrow_button_width: 42px;--_ui5-v1-24-20_month_picker_item_height: 36px;--_ui5-v1-24-20_monthpicker_item_margin: -8px 0 var(--udexSpacer16, 16px) 0;--_ui5-v1-24-20_year_picker_item_height: 36px;--_ui5-v1-24-20_yearpicker_item_margin: -8px 0 var(--udexSpacer16, 16px) 0;--_ui5-v1-24-20_slider_handle_icon_size: var(--udexSpacer20, 1.25rem);--_ui5-v1-24-20_slider_handle_width: 2.75rem;--_ui5-v1-24-20_slider_handle_height: var(--udexSpacer32, 2rem);--_ui5-v1-24-20_slider_handle_top: -.875rem;--_ui5-v1-24-20_range_slider_progress_focus_top: -1.18rem;--_ui5-v1-24-20_slider_start_end_point_left: -.875rem;--_ui5-v1-24-20_slider_tooltip_bottom: 2.5rem;--_ui5-v1-24-20_slider_tooltip_border_radius: var(--udexSpacer4, .25rem);--_ui5-v1-24-20_slider_tooltip_height: var(--udexSpacer32, 2rem);--_ui5-v1-24-20_slider_tooltip_min_width: 2.75rem;--_ui5-v1-24-20_slider_handle_focus_border: 2px solid var(--sapSlider_Active_HandleBorderColor)}\n`};\nexport default styleData;\n\t"]}

package/dist/vscode.html-custom-data.json

@@ -372,7 +372,7 @@
     },
     {
       "name": "udex-date-picker",
-      "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-date-picker</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/DatePicker.js\";</code>\n\n\n---\n\n\n\n\n### **Events:**\n - **selection-change** - Fired when the selected dates change.",
+      "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-date-picker</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/DatePicker.js\";</code>\n\n\n---\n\n\n\n\n### **Events:**\n - **selection-change** - Fired when the selected dates change.\n\n### **Methods:**\n - **isValid(value: _string_): _boolean_** - Checks if a value is valid against the current date format of the DatePicker.\n- **isInValidRangeRange(value: _string_): _boolean_** - Checks if a date is between the minimum and maximum date.",
       "attributes": [
         {
           "name": "selection-mode",
@@ -419,16 +419,6 @@
           "description": "Defines label text for the input field.",
           "values": []
         },
-        {
-          "name": "min-date",
-          "description": "Determines the minimum date available for selection.\n<br/><br/>\n<b>Note:</b> The minDate value must be provided in the ISO date format (YYYY-MM-dd).",
-          "values": []
-        },
-        {
-          "name": "max-date",
-          "description": "Determines the maximum date available for selection.\n<br/><br/>\n<b>Note:</b> The maxDate value must be provided in the ISO date format (YYYY-MM-dd).",
-          "values": []
-        },
         {
           "name": "value-state",
           "description": "Defines the value state of the component.",
@@ -1624,7 +1614,7 @@
     },
     {
       "name": "udex-masthead-shell",
-      "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-shell</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MastheadShell.js\";</code>\n\n\n---\n\n\n\n\n### **Events:**\n - **search-click** - Fired event when the user clicks the search button trigger.\n- **cart-click** - Fired event when the user clicks the cart button trigger.\n- **profile-click** - Fired event when the user clicks the profile button trigger.\n- **logo-click** - Fired event when the user clicks the logo.\n- **site-label-click** - Fired event when the user clicks the site label.\n\n### **Slots:**\n - **mobileMenu** - Slot for mobile menu\n- **default** - Slot for main menu items.\n- **search** - Slot for search component - will be visible on search icon click.\nNote: search component should be hidden by default.\nNote: search icon won't be visible if this slot would be empty\n- **exploreSAP** - Slot for 'Explore SAP' menu\n- **cart** - Slot for cart menu\n- **profile** - Slot for avatar",
+      "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-shell</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MastheadShell.js\";</code>\n\n\n---\n\n\n\n\n### **Events:**\n - **mobile-menu-open** - Fired event when the user clicks the mobile menu button opener.\n- **mobile-menu-close** - Fired event when the user clicks the mobile menu button closer.\n- **search-click** - Fired event when the user clicks the search button trigger.\n- **cart-click** - Fired event when the user clicks the cart button trigger.\n- **profile-click** - Fired event when the user clicks the profile button trigger.\n- **logo-click** - Fired event when the user clicks the logo.\n- **site-label-click** - Fired event when the user clicks the site label.\n\n### **Slots:**\n - **mobileMenu** - Slot for mobile menu\n- **default** - Slot for main menu items.\n- **search** - Slot for search component - will be visible on search icon click.\nNote: search component should be hidden by default.\nNote: search icon won't be visible if this slot would be empty\n- **exploreSAP** - Slot for 'Explore SAP' menu\n- **cart** - Slot for cart menu\n- **profile** - Slot for avatar",
       "attributes": [
         {
           "name": "home-url",

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@sapudex/web-components",
-  "version": "0.173.0",
+  "version": "0.184.0",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -815,7 +815,7 @@
         },
         {
           "name": "udex-date-picker",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-date-picker</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/DatePicker.js\";</code>\n---\n\n\n### **Events:**\n - **selection-change** - Fired when the selected dates change.",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-date-picker</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/DatePicker.js\";</code>\n---\n\n\n### **Events:**\n - **selection-change** - Fired when the selected dates change.\n\n### **Methods:**\n - **isValid(value: _string_): _boolean_** - Checks if a value is valid against the current date format of the DatePicker.\n- **isInValidRangeRange(value: _string_): _boolean_** - Checks if a date is between the minimum and maximum date.",
           "doc-url": "",
           "attributes": [
             {
@@ -866,16 +866,6 @@
               "description": "Defines label text for the input field.",
               "value": { "type": "string", "default": "\"\"" }
             },
-            {
-              "name": "min-date",
-              "description": "Determines the minimum date available for selection.\n<br/><br/>\n<b>Note:</b> The minDate value must be provided in the ISO date format (YYYY-MM-dd).",
-              "value": { "type": "string", "default": "\"\"" }
-            },
-            {
-              "name": "max-date",
-              "description": "Determines the maximum date available for selection.\n<br/><br/>\n<b>Note:</b> The maxDate value must be provided in the ISO date format (YYYY-MM-dd).",
-              "value": { "type": "string", "default": "\"\"" }
-            },
             {
               "name": "value-state",
               "description": "Defines the value state of the component.",
@@ -943,16 +933,6 @@
                 "description": "Defines label text for the input field.",
                 "value": { "type": "string" }
               },
-              {
-                "name": "min-date",
-                "description": "Determines the minimum date available for selection.\n<br/><br/>\n<b>Note:</b> The minDate value must be provided in the ISO date format (YYYY-MM-dd).",
-                "value": { "type": "string" }
-              },
-              {
-                "name": "max-date",
-                "description": "Determines the maximum date available for selection.\n<br/><br/>\n<b>Note:</b> The maxDate value must be provided in the ISO date format (YYYY-MM-dd).",
-                "value": { "type": "string" }
-              },
               {
                 "name": "value-state",
                 "description": "Defines the value state of the component.",
@@ -3281,7 +3261,7 @@
         },
         {
           "name": "udex-masthead-shell",
-          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-shell</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MastheadShell.js\";</code>\n---\n\n\n### **Events:**\n - **search-click** - Fired event when the user clicks the search button trigger.\n- **cart-click** - Fired event when the user clicks the cart button trigger.\n- **profile-click** - Fired event when the user clicks the profile button trigger.\n- **logo-click** - Fired event when the user clicks the logo.\n- **site-label-click** - Fired event when the user clicks the site label.\n\n### **Slots:**\n - **mobileMenu** - Slot for mobile menu\n- **default** - Slot for main menu items.\n- **search** - Slot for search component - will be visible on search icon click.\nNote: search component should be hidden by default.\nNote: search icon won't be visible if this slot would be empty\n- **exploreSAP** - Slot for 'Explore SAP' menu\n- **cart** - Slot for cart menu\n- **profile** - Slot for avatar",
+          "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-shell</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@udex/web-components/dist/MastheadShell.js\";</code>\n---\n\n\n### **Events:**\n - **mobile-menu-open** - Fired event when the user clicks the mobile menu button opener.\n- **mobile-menu-close** - Fired event when the user clicks the mobile menu button closer.\n- **search-click** - Fired event when the user clicks the search button trigger.\n- **cart-click** - Fired event when the user clicks the cart button trigger.\n- **profile-click** - Fired event when the user clicks the profile button trigger.\n- **logo-click** - Fired event when the user clicks the logo.\n- **site-label-click** - Fired event when the user clicks the site label.\n\n### **Slots:**\n - **mobileMenu** - Slot for mobile menu\n- **default** - Slot for main menu items.\n- **search** - Slot for search component - will be visible on search icon click.\nNote: search component should be hidden by default.\nNote: search icon won't be visible if this slot would be empty\n- **exploreSAP** - Slot for 'Explore SAP' menu\n- **cart** - Slot for cart menu\n- **profile** - Slot for avatar",
           "doc-url": "",
           "attributes": [
             {
@@ -3360,6 +3340,14 @@
             { "name": "profile", "description": "Slot for avatar" }
           ],
           "events": [
+            {
+              "name": "mobile-menu-open",
+              "description": "Fired event when the user clicks the mobile menu button opener."
+            },
+            {
+              "name": "mobile-menu-close",
+              "description": "Fired event when the user clicks the mobile menu button closer."
+            },
             {
               "name": "search-click",
               "description": "Fired event when the user clicks the search button trigger."
@@ -3445,6 +3433,14 @@
               }
             ],
             "events": [
+              {
+                "name": "mobile-menu-open",
+                "description": "Fired event when the user clicks the mobile menu button opener."
+              },
+              {
+                "name": "mobile-menu-close",
+                "description": "Fired event when the user clicks the mobile menu button closer."
+              },
               {
                 "name": "search-click",
                 "description": "Fired event when the user clicks the search button trigger."

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sapudex/web-components",
-  "version": "0.173.0",
+  "version": "0.184.0",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },
@@ -30,17 +30,17 @@
   "dependencies": {
     "@types/vimeo__player": "^2.18.3",
     "@types/youtube": "^0.1.0",
-    "@ui5/webcomponents": "1.24.17",
-    "@ui5/webcomponents-base": "1.24.17",
-    "@ui5/webcomponents-fiori": "1.24.17",
-    "@ui5/webcomponents-icons": "1.24.17",
-    "@ui5/webcomponents-theming": "1.24.17",
+    "@ui5/webcomponents": "1.24.20",
+    "@ui5/webcomponents-base": "1.24.20",
+    "@ui5/webcomponents-fiori": "1.24.20",
+    "@ui5/webcomponents-icons": "1.24.20",
+    "@ui5/webcomponents-theming": "1.24.20",
     "@vimeo/player": "^2.24.0",
     "video.js": "8.22.0"
   },
   "devDependencies": {
-    "@ui5/webcomponents-tools": "1.24.17",
-    "chromedriver": "132.0.2",
+    "@ui5/webcomponents-tools": "1.24.20",
+    "chromedriver": "134.0.4",
     "cross-env": "^7.0.3",
     "typescript": "^4.9.4",
     "wdio-chromedriver-service": "^8.1.1",

package/src/Accordion.ts

@@ -16,6 +16,7 @@ import AccordionTemplate from "./generated/templates/AccordionTemplate.lit.js";
 // Styles
 import AccordionCss from "./generated/themes/Accordion.css.js";
 import { COLLAPSE_ALL, EXPAND_ALL } from "./generated/i18n/i18n-defaults.js";
+import UDExButton from "./Button.js";
 
 /**
  * @class
@@ -41,7 +42,7 @@ import { COLLAPSE_ALL, EXPAND_ALL } from "./generated/i18n/i18n-defaults.js";
   renderer: litRender,
   styles: AccordionCss,
   template: AccordionTemplate,
-  dependencies: [],
+  dependencies: [UDExButton],
 })
 
 /**

package/src/AccordionItem.ts

@@ -4,7 +4,7 @@ import property from "@ui5/webcomponents-base/dist/decorators/property.js";
 import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
 import event from "@ui5/webcomponents-base/dist/decorators/event.js";
 import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
-import "@ui5/webcomponents/dist/Icon.js";
+import Icon from "@ui5/webcomponents/dist/Icon.js";
 import "@ui5/webcomponents-icons/dist/AllIcons.js";
 import "@ui5/webcomponents-icons/dist/feeder-arrow.js";
 import { isDesktop } from "@ui5/webcomponents-base/dist/Device.js";
@@ -42,7 +42,7 @@ type ToggleAllEvent = {
   renderer: litRender,
   styles: AccordionItemCss,
   template: AccordionItemTemplate,
-  dependencies: [UDExBadge],
+  dependencies: [UDExBadge, Icon],
 })
 
 /**

package/src/Badge.ts

@@ -4,6 +4,7 @@ import property from "@ui5/webcomponents-base/dist/decorators/property.js";
 import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
 import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
 import "@ui5/webcomponents/dist/Badge.js";
+import Icon from "@ui5/webcomponents/dist/Icon.js";
 
 import BadgeTemplate from "./generated/templates/BadgeTemplate.lit.js";
 
@@ -44,7 +45,7 @@ export enum BadgeSize {
   renderer: litRender,
   styles: BadgeCss,
   template: BadgeTemplate,
-  dependencies: [],
+  dependencies: [Icon],
 })
 class UDExBadge extends UI5Element {
   /**

package/src/Breadcrumbs.hbs

@@ -10,9 +10,9 @@
 				aria-label="{{_dropdownArrowAccessibleNameText}}"
 				aria-haspopup="true">
 				<ui5-icon
-                    name="slim-arrow-down"
-                    title="{{_dropdownArrowAccessibleNameText}}">
-                </ui5-icon>
+            name="slim-arrow-down"
+            title="{{_dropdownArrowAccessibleNameText}}">
+        </ui5-icon>
 			</button>
 		</li>
 		{{#each _linksData}}

package/src/Breadcrumbs.ts

@@ -19,8 +19,8 @@ import breadcrumbsCss from "@ui5/webcomponents/dist/generated/themes/Breadcrumbs
 import BreadcrumbsTemplate from "./generated/templates/BreadcrumbsTemplate.lit.js";
 import BreadcrumbsPopover from "./generated/templates/BreadcrumbsPopoverTemplate.lit.js";
 import UDExBreadcrumbsItem from "./BreadcrumbsItem.js";
-import Link from "./Link.js";
-import Dropdown from "./Dropdown.js";
+import UDExDropdown from "./Dropdown.js";
+import UDExLink from "./Link.js";
 import {
   BREADCRUMBS_ARIA_LABEL,
   BREADCRUMBS_OVERFLOW_ARIA_LABEL,
@@ -66,7 +66,7 @@ export type UDExBreadcrumbsItemClickEventDetail = {
   template: BreadcrumbsTemplate,
   staticAreaTemplate: BreadcrumbsPopover,
   staticAreaStyles: [BreadcrumbsPopoverCss],
-  dependencies: [UDExBreadcrumbsItem, Link, Dropdown, Icon],
+  dependencies: [UDExBreadcrumbsItem, UDExLink, UDExDropdown, Icon],
 })
 /**
  * Fires when a `BreadcrumbsItem` is clicked.
@@ -132,7 +132,7 @@ class UDExBreadcrumbs extends UI5Element {
   @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true })
     items!: Array<UDExBreadcrumbsItem>;
 
-  responsivePopover?: Dropdown;
+  responsivePopover?: UDExDropdown;
   _itemNavigation?: ItemNavigation;
   _shouldFocusFirstVisibleItem!: boolean;
 
@@ -156,12 +156,12 @@ class UDExBreadcrumbs extends UI5Element {
     });
   }
 
-  async _getResponsePopover(): Promise<Dropdown> {
+  async _getResponsePopover(): Promise<UDExDropdown> {
     const staticAreaItem = await this.getStaticAreaItemDomRef();
-    return staticAreaItem!.querySelector<Dropdown>(`#udex-${this.__id!}-breadcrumbs__popover`)!;
+    return staticAreaItem!.querySelector<UDExDropdown>(`#udex-${this.__id!}-breadcrumbs__popover`)!;
   }
 
-  _getFocusableItems(): Array<Link> {
+  _getFocusableItems(): Array<UDExLink> {
     const items = this._links;
     items.unshift(this._dropdownArrowLink);
 
@@ -206,7 +206,7 @@ class UDExBreadcrumbs extends UI5Element {
   }
 
   _onLinkPress(e: CustomEvent<LinkClickEventDetail>): void {
-    const link = e.target as Link,
+    const link = e.target as UDExLink,
       items = this._getItems(),
       item = items.find(x => `${x._id}-link` === link.id)!,
       {
@@ -251,7 +251,7 @@ class UDExBreadcrumbs extends UI5Element {
   }
 
   _onfocusin(e: FocusEvent): void {
-    const currentItem = e.target as Link;
+    const currentItem = e.target as UDExLink;
 
     this._itemNavigation?.setCurrentItem(currentItem);
   }
@@ -272,7 +272,7 @@ class UDExBreadcrumbs extends UI5Element {
   }
 
   _focusFirstVisibleItem(): void {
-    Array.from(this.shadowRoot!.querySelectorAll<Link>("[udex-link]"))[0].focus();
+    Array.from(this.shadowRoot!.querySelectorAll<UDExLink>("[udex-link]"))[0].focus();
     this._shouldFocusFirstVisibleItem = false;
   }
 
@@ -280,15 +280,15 @@ class UDExBreadcrumbs extends UI5Element {
    * Getter for the interactive element that opens the overflow
    * @private
    */
-  get _dropdownArrowLink(): Link {
-    return this.shadowRoot!.querySelector<Link>(".udex-breadcrumbs__trigger")!;
+  get _dropdownArrowLink(): UDExLink {
+    return this.shadowRoot!.querySelector<UDExLink>(".udex-breadcrumbs__trigger")!;
   }
 
   /**
    * Getter for the list of links corresponding to the abstract breadcrumb items
    */
-  get _links(): Array<Link> {
-    return Array.from(this.shadowRoot!.querySelectorAll<Link>(".udex-breadcrumbs__link-wrapper [ui5-link]"));
+  get _links(): Array<UDExLink> {
+    return Array.from(this.shadowRoot!.querySelectorAll<UDExLink>(".udex-breadcrumbs__link-wrapper [ui5-link]"));
   }
 
   /**

package/src/BreadcrumbsPopover.hbs

@@ -17,7 +17,7 @@
           target="{{this.target}}"
           class="udex-breadcrumbs__item udex-breadcrumbs__item--{{@index}} udex-breadcrumbs__item--with-icon" 
           icon={{this.icon}}
-          icon-placement="start" 
+          icon-placement="Start" 
           accessible-name="{{this.textContent}}"
           data-ui5-stable="{{this.stableDomRef}}">
           {{this.textContent}}

package/src/CountrySelector.ts

@@ -350,7 +350,7 @@ class CountrySelector extends UDExSearchableListBase {
   }
 
   get ariaControls(): string | null | undefined {
-    const list = this.shadowRoot!.querySelector<UDExList>("udex-list");
+    const list = this.shadowRoot!.querySelector<UDExList>("[udex-list]");
     return list?.getAttribute("id");
   }
 
@@ -415,7 +415,7 @@ class CountrySelector extends UDExSearchableListBase {
   }
 
   handleCloseSearch() {
-    this.getInput()?.shadowRoot!.querySelector<Button>("udex-control-button")?.focus();
+    this.getInput()?.shadowRoot!.querySelector<Button>("[udex-control-button]")?.focus();
   }
 
   handleItemPress(e: CustomEvent) {
@@ -529,7 +529,7 @@ class CountrySelector extends UDExSearchableListBase {
   }
 
   getSearch(): Search {
-    return this.shadowRoot!.querySelector<Search>("udex-search")!;
+    return this.shadowRoot!.querySelector<Search>("[udex-search]")!;
   }
 
   getDropdownPopover() {
@@ -537,11 +537,11 @@ class CountrySelector extends UDExSearchableListBase {
   }
 
   getDropdown(): UDExDropdown {
-    return this.shadowRoot!.querySelector<UDExDropdown>("udex-dropdown")!;
+    return this.shadowRoot!.querySelector<UDExDropdown>("[udex-dropdown]")!;
   }
 
   getInput(): UDExTextField {
-    return this.shadowRoot!.querySelector<UDExTextField>("udex-text-field")!;
+    return this.shadowRoot!.querySelector<UDExTextField>("[udex-text-field]")!;
   }
 
   get effectiveAriaLabel(): string {

package/src/DatePicker.hbs

@@ -1,10 +1,9 @@
 <div
     class="udex-date-picker__container">
     <udex-text-field
-        @click="{{handleInputClick}}"
-        @mousedown="{{handleInputMouseDown}}"
-        @keydown="{{handleInputKeyDown}}"
-        class="udex-date-picker__input udex-date-picker__trigger"
+        value="{{value}}"
+        @ui5-change="{{_onInputChange}}"
+        class="udex-date-picker__input"
         label="{{label}}"
         accessible-name="{{dateAccessibleName}}"
         accessible-name-ref="{{accessibleNameRef}}"
@@ -13,8 +12,8 @@
         ?disabled="{{disabled}}"
         ?required="{{required}}"
         ?readonly="{{readonly}}"
-        value="{{value}}"
         icon="appointment-2"
+        @ui5-click-icon="{{handleInputClick}}"
         value-state="{{valueState}}"
     >
     </udex-text-field>